From 9f3f02ea6ef6213b6f7c1cc9dff27de918316bcc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?=
 <tugcekucukoglu.860@gmail.com>
Date: Thu, 17 Aug 2023 16:05:28 +0300
Subject: [PATCH] Code section fixes

---
 assets/styles/layout/_doc.scss    | 18 ++++++------------
 components/doc/DocSectionCode.vue |  6 +++---
 2 files changed, 9 insertions(+), 15 deletions(-)

diff --git a/assets/styles/layout/_doc.scss b/assets/styles/layout/_doc.scss
index 837ce668c..8de1138fa 100644
--- a/assets/styles/layout/_doc.scss
+++ b/assets/styles/layout/_doc.scss
@@ -205,11 +205,16 @@
     }
 }
 
-.doc-section-buttons {
+.doc-section-code-buttons {
     gap: .75rem;
     padding: .75rem 0 0;
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
+
+    .p-button-label {
+        font-weight: normal;
+        font-size: 0.875rem;
+    }
 }
 
 .doc-section-code-tooltip .p-tooltip-text {
@@ -224,17 +229,6 @@
         }
     }
 
-    .p-button-label {
-        font-weight: normal;
-        font-size: 0.875rem;
-    }
-
-    .doc-section-code-active {
-        .p-button-label {
-            font-weight: bold;
-        }
-    }
-
     pre {
         margin: 0;
     }
diff --git a/components/doc/DocSectionCode.vue b/components/doc/DocSectionCode.vue
index d71b49f7a..1ca9f9c84 100644
--- a/components/doc/DocSectionCode.vue
+++ b/components/doc/DocSectionCode.vue
@@ -1,14 +1,14 @@
 <template>
     <div v-if="!embedded" class="surface-card" style="border-radius: 10px">
-        <div class="flex doc-section-buttons surface-card align-items-center justify-content-end sticky z-1 top-0 mr-3">
+        <div class="flex doc-section-code-buttons surface-card align-items-center justify-content-end sticky z-1 top-0 mr-3">
             <template v-if="codeMode !== 'basic' && !hideToggleCode">
                 <Button
-                    :class="['p-button-rounded p-button-text p-button-plain p-0 inline-flex align-items-center justify-content-center', { 'doc-section-code-active text-primary': codeLang === 'typescript' }]"
+                    :class="['p-button-rounded p-button-text p-button-plain p-0 inline-flex align-items-center justify-content-center', { 'doc-section-code-buttons-active text-primary': codeLang === 'composition' }]"
                     label="Composition API"
                     @click="codeLang = 'composition'"
                 ></Button>
                 <Button
-                    :class="['p-button-rounded p-button-text p-button-plain p-0 inline-flex align-items-center justify-content-center', { 'doc-section-code-active text-primary': codeLang === 'javascript' }]"
+                    :class="['p-button-rounded p-button-text p-button-plain p-0 inline-flex align-items-center justify-content-center', { 'doc-section-code-buttons-active text-primary': codeLang === 'options' }]"
                     label="Options API"
                     @click="codeLang = 'options'"
                 ></Button>