Code section fixes

pull/4276/head^2
Tuğçe Küçükoğlu 2023-08-17 16:05:28 +03:00
parent 99d77616af
commit 9f3f02ea6e
2 changed files with 9 additions and 15 deletions

View File

@ -205,11 +205,16 @@
} }
} }
.doc-section-buttons { .doc-section-code-buttons {
gap: .75rem; gap: .75rem;
padding: .75rem 0 0; padding: .75rem 0 0;
border-top-left-radius: 10px; border-top-left-radius: 10px;
border-top-right-radius: 10px; border-top-right-radius: 10px;
.p-button-label {
font-weight: normal;
font-size: 0.875rem;
}
} }
.doc-section-code-tooltip .p-tooltip-text { .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 { pre {
margin: 0; margin: 0;
} }

View File

@ -1,14 +1,14 @@
<template> <template>
<div v-if="!embedded" class="surface-card" style="border-radius: 10px"> <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"> <template v-if="codeMode !== 'basic' && !hideToggleCode">
<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 === '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" label="Composition API"
@click="codeLang = 'composition'" @click="codeLang = 'composition'"
></Button> ></Button>
<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" label="Options API"
@click="codeLang = 'options'" @click="codeLang = 'options'"
></Button> ></Button>