8000 docs: update theme · coreui/coreui-vue@adc8bec · GitHub
[go: up one dir, main page]

Skip to content

Commit adc8bec

Browse files
committed
docs: update theme
1 parent e47ccd6 commit adc8bec

File tree

16 files changed

+72
-644
lines changed

16 files changed

+72
-644
lines changed

packages/docs/.vuepress/theme-coreui/src/client/components/Header.vue

Lines changed: 18 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -20,35 +20,35 @@
2020
</li>
2121
<CDropdown variant="nav-item" placement="bottom-end">
2222
<CDropdownToggle :caret="false">
23-
<CIcon v-if="theme === 'dark'" icon="cil-moon" size="xl" />
24-
<CIcon v-else-if="theme === 'light'" icon="cil-sun" size="xl" />
23+
<CIcon v-if="storedTheme === 'dark'" icon="cil-moon" size="xl" />
24+
<CIcon v-else-if="storedTheme === 'light'" icon="cil-sun" size="xl" />
2525
<CIcon v-else icon="cil-contrast" size="xl" />
2626
</CDropdownToggle>
2727
<CDropdownMenu>
2828
<CDropdownItem
29-
:active="theme === 'light'"
29+
:active="storedTheme === 'light'"
3030
class="d-flex align-items-center"
3131
component="button"
3232
type="button"
33-
@click="$emit('toggle-color-mode', 'light')"
34-
>
33+
@click="toggleColorMode('light')"
34+
>
3535
<CIcon class="me-2" icon="cil-sun" size="lg" /> Light
3636
</CDropdownItem>
3737
<CDropdownItem
38-
:active="theme === 'dark'"
38+
:active="storedTheme === 'dark'"
3939
class="d-flex align-items-center"
4040
component="button"
4141
type="button"
42-
@click="$emit('toggle-color-mode', 'dark')"
42+
@click="toggleColorMode('dark')"
4343
>
4444
<CIcon class="me-2" icon="cil-moon" size="lg" /> Dark
4545
</CDropdownItem>
4646
<CDropdownItem
47-
:active="theme === 'auto'"
47+
:active="storedTheme === 'auto'"
4848
class="d-flex align-items-center"
4949
component="button"
5050
type="button"
51-
@click="$emit('toggle-color-mode', 'auto')"
51+
@click="toggleColorMode('auto')"
5252
>
5353
<CIcon class="me-2" icon="cil-contrast" size="lg" /> Auto
5454
</CDropdownItem>
@@ -88,6 +88,7 @@
8888
</template>
8989
<script lang="ts">
9090
import { defineComponent, ref, watch } from 'vue'
91+
import { useColorMode } from '../composables'
9192
9293
export default defineComponent({
9394
name: 'Header',
@@ -96,7 +97,11 @@ export default defineComponent({
9697
},
9798
emits: ['toggle-color-mode', 'toggle-sidebar'],
9899
setup(props) {
100+
const storedTheme = useColorMode()
99101
const theme = ref(props.theme)
102+
const toggleColorMode = (theme: string): void => {
103+
storedTheme.value = theme
104+
}
100105
watch(
101106
() => props.theme,
102107
() => {
@@ -105,8 +110,10 @@ export default defineComponent({
105110
)
106111
107112
return {
108-
theme
113+
theme,
114+
storedTheme,
115+
toggleColorMode,
109116
}
110-
}
117+
},
111118
})
112119
</script>

packages/docs/.vuepress/theme-coreui/src/client/components/Home.vue

Lines changed: 0 additions & 133 deletions
This file was deleted.

packages/docs/.vuepress/theme-coreui/src/client/components/global/CodeGroup.ts

Lines changed: 0 additions & 130 deletions
This file was deleted.

packages/docs/.vuepress/theme-coreui/src/client/components/global/CodeGroupItem.vue

Lines changed: 0 additions & 28 deletions
This file was deleted.

0 commit comments

Comments
 (0)
0