8000 docs: update theme · coreui/coreui-vue@06b182c · GitHub
[go: up one dir, main page]
Skip to content

Commit 06b182c

Browse files
mrholekmrholek
committed
docs: update theme
1 parent 510ea1a commit 06b182c

23 files changed

+1018
-976
lines changed

‎packages/docs/.vuepress/clientAppEnhance.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,13 +18,16 @@ import {
1818
cilBurn,
1919
cilCheckCircle,
2020
cilCloudDownload,
21+
cilContrast,
2122
cilInfo,
2223
cilMenu,
24+
cilMoon,
2325
cilOptions,
2426
cilPeople,
2527
cilPuzzle,
2628
cilSettings,
2729
cilSpeedometer,
30+
cilSun,
2831
cilUserFollow,
2932
cilWarning,
3033
} from '@coreui/icons'
@@ -42,13 +45,16 @@ export const icons = {
4245
cilBurn,
4346
cilCheckCircle,
4447
cilCloudDownload,
48+
cilContrast,
4549
cilInfo,
4650
cilMenu,
51+
cilMoon,
4752
cilOptions,
4853
cilPeople,
4954
cilPuzzle,
5055
cilSettings,
5156
cilSpeedometer,
57+
cilSun,
5258
cilUserFollow,
5359
cilWarning,
5460
}

‎packages/docs/.vuepress/config.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,9 @@ export default defineUserConfig<DefaultThemeOptions>({
2626
placement: 'after'
2727
})
2828
},
29+
code: {
30+
lineNumbers: false
31+
}
2932
},
3033
plugins: [
3134
'@vuepress/plugin-toc',

‎packages/docs/.vuepress/theme-coreui/src/assets/brand/coreui-vue.svg

Lines changed: 8 additions & 36 deletions
Loading

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

Lines changed: 61 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,47 @@
1414
<CNavItem href="https://opencollective.com/coreui">
1515
<CIcon icon="cib-open-collective" size="xl" />
1616
</CNavItem>
17+
<li class="nav-item py-2 py-lg-1">
18+
<div class="vr d-none d-lg-flex h-100 mx-lg-2 text-body text-opacity-75"></div>
19+
<hr class="d-lg-none my-2 text-white-50" />
20+
</li>
21+
<CDropdown variant="nav-item" placement="bottom-end">
22+
<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" />
25+
<CIcon v-else icon="cil-contrast" size="xl" />
26+
</CDropdownToggle>
27+
<CDropdownMenu>
28+
<CDropdownItem
29+
class="d-flex align-items-center"
30+
component="button"
31+
type="button"
32+
@click="$emit('toggle-color-mode', 'light')"
33+
>
34+
<CIcon class="me-2" icon="cil-sun" size="lg" /> Light
35+
</CDropdownItem>
36+
<CDropdownItem
37+
class="d-flex align-items-center"
38+
component="button"
39+
type="button"
40+
@click="$emit('toggle-color-mode', 'dark')"
41+
>
42+
<CIcon class="me-2" icon="cil-moon" size="lg" /> Dark
43+
</CDropdownItem>
44+
<CDropdownItem
45+
class="d-flex align-items-center"
46+
component="button"
47+
type="button"
48+
@click="$emit('toggle-color-mode', 'auto')"
49+
>
50+
<CIcon class="me-2" icon="cil-contrast" size="lg" /> Auto
51+
</CDropdownItem>
52+
</CDropdownMenu>
53+
</CDropdown>
54+
<li class="nav-item py-2 py-lg-1">
55+
<div class="vr d-none d-lg-flex h-100 mx-lg-2 text-body text-opacity-75"></div>
56+
<hr class="d-lg-none my-2 text-white-50" />
57+
</li>
1758
</CHeaderNav>
1859
<CButton
1960
class="d-lg-inline-block my-2 my-md-0 ms-md-3"
@@ -35,10 +76,28 @@
3576
</CHeader>
3677
</template>
3778
<script lang="ts">
38-
import { defineComponent } from 'vue'
79+
import { defineComponent, ref, watch } from 'vue'
3980
4081
export default defineComponent({
4182
name: 'Header',
42-
emits: ['toggle-sidebar'],
83+
props: {
84+
theme: String,
85+
},
86+
emits: ['toggle-color-mode', 'toggle-sidebar'],
87+
setup(props) {
88+
console.log(props.theme)
89+
const theme = ref(props.theme)
90+
watch(
91+
() => props.theme,
92+
() => {
93+
theme.value = props.theme
94+
console.log(props.theme)
95+
},
96+
)
97+
98+
return {
99+
theme
100+
}
101+
}
43102
})
44103
</script>

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

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,23 @@
11
<template>
22
<CSidebar position="fixed" size="lg" class="docs-sidebar elevation-0 border-end ps-xl-4">
33
<CSidebarBrand class="justify-content-start ps-3">
4-
<img :src="logo" alt="CoreUI for Vue.js logo" height="50" class="d-block mt-4 mb-5" />
4+
<svg
5+
xmlns="http://www.w3.org/2000/svg"
6+
viewBox="0 0 556 134"
7+
height="50"
8+
class="d-block mt-4 mb-5"
9+
>
10+
<g fill="#1bbd93">
11+
<path d="m347.982 90.087-11.84-43.52-.065-.193q0-.51.641-.511h1.28a.66.66 0 0 1 .704.576l10.623 39.68c.042.086.086.128.13.128.04 0 .083-.042.126-.128l10.625-39.68a.657.657 0 0 1 .703-.576h1.217a.54.54 0 0 1 .576.704l-11.904 43.52a.658.658 0 0 1-.704.576h-1.408a.658.658 0 0 1-.704-.576ZM382.279 89.575a10.902 10.902 0 0 1-4.352-4.544 14.459 14.459 0 0 1-1.536-6.784V46.503a.566.566 0 0 1 .64-.64h1.217a.566.566 0 0 1 .64.64v32a10.549 10.549 0 0 0 2.72 7.553 10.36 10.36 0 0 0 14.336 0 10.55 10.55 0 0 0 2.72-7.553v-32a.566.566 0 0 1 .64-.64h1.216a.567.567 0 0 1 .64.64v31.744a13.01 13.01 0 0 1-3.392 9.376 11.897 11.897 0 0 1-9.023 3.553 12.848 12.848 0 0 1-6.466-1.6ZM439.584 48.103h-20.032a.226.226 0 0 0-.256.256v18.496a.226.226 0 0 0 .256.256h13.824a.567.567 0 0 1 .64.64v.96a.567.567 0 0 1-.64.64h-13.824a.226.226 0 0 0-.256.257v18.56a.226.226 0 0 0 .256.256h20.032a.567.567 0 0 1 .64.64v.96a.566.566 0 0 1-.64.64h-22.143a.565.565 0 0 1-.64-.64v-43.52a.566.566 0 0 1 .64-.64h22.143a.566.566 0 0 1 .64.64v.96a.566.566 0 0 1-.64.64ZM454.592 89.512a2.838 2.838 0 0 1-.8-2.05 2.92 2.92 0 0 1 .8-2.11 2.752 2.752 0 0 1 2.08-.833 2.846 2.846 0 0 1 2.943 2.944 2.756 2.756 0 0 1-.832 2.08 2.92 2.92 0 0 1-2.112.8 2.752 2.752 0 0 1-2.079-.831ZM474.931 88.008a11.309 11.309 0 0 1-3.2-8.416v-5.44a.566.566 0 0 1 .64-.64h1.216a.566.566 0 0 1 .64.64v5.504a9.142 9.142 0 0 0 2.529 6.72 8.973 8.973 0 0 0 6.687 2.56 8.792 8.792 0 0 0 9.28-9.28V46.503a.566.566 0 0 1 .64-.64h1.216a.566.566 0 0 1 .64.64v33.089a11.254 11.254 0 0 1-3.231 8.416 13.062 13.062 0 0 1-17.056 0ZM512.875 88.103a10.485 10.485 0 0 1-3.36-8.127v-1.793a.567.567 0 0 1 .64-.64h1.089a.567.567 0 0 1 .64.64v1.6a8.546 8.546 0 0 0 2.752 6.657 10.536 10.536 0 0 0 7.36 2.496 9.874 9.874 0 0 0 6.976-2.368 8.219 8.219 0 0 0 2.56-6.336 8.395 8.395 0 0 0-1.12-4.416 11.375 11.375 0 0 0-3.328-3.393 71.687 71.687 0 0 0-6.175-3.712 71.015 71.015 0 0 1-6.24-3.84 12.182 12.182 0 0 1-3.424-3.68 10.266 10.266 0 0 1-1.28-5.343 9.86 9.86 0 0 1 3.072-7.745 12.013 12.013 0 0 1 8.32-2.752q5.696 0 8.96 3.104a10.825 10.825 0 0 1 3.264 8.225v1.6a.566.566 0 0 1-.64.64h-1.152a.565.565 0 0 1-.64-.64v-1.472a8.864 8.864 0 0 0-2.624-6.689 9.994 9.994 0 0 0-7.233-2.527 9.37 9.37 0 0 0-6.528 2.143 7.825 7.825 0 0 0-2.367 6.113 7.809 7.809 0 0 0 1.023 4.16 10.398 10.398 0 0 0 3.008 3.039 63.025 63.025 0 0 0 5.952 3.488 70.796 70.796 0 0 1 6.72 4.256 13.461 13.461 0 0 1 3.649 3.936 10.044 10.044 0 0 1 1.28 5.184 10.719 10.719 0 0 1-3.265 8.192q-3.264 3.072-8.832 3.072-5.698 0-9.057-3.072Z"/>
12+
</g>
13+
<g fill="var(--cui-body-color, currentColor)">
14+
<path d="m99.367 36.058-39-22.517a12 12 0 0 0-12 0l-39 22.517a12.034 12.034 0 0 0-6 10.392v45.033a12.033 12.033 0 0 0 6 10.393l39 22.516a12 12 0 0 0 12 0l39-22.516a12.033 12.033 0 0 0 6-10.393V46.45a12.034 12.034 0 0 0-6-10.392Zm-2 55.425a4 4 0 0 1-2 3.464l-39 22.517a4 4 0 0 1-4 0l-39-22.517a4 4 0 0 1-2-3.464V46.45a4 4 0 0 1 2-3.464l39-22.517a4 4 0 0 1 4 0l39 22.517a4 4 0 0 1 2 3.464Z"/>
15+
<path d="M77.389 82.005h-2.866a4 4 0 0 0-1.925.493l-17.28 9.485-19.951-11.518V57.487l19.95-11.518 17.289 9.455a4 4 0 0 0 1.92.49h2.862a2 2 0 0 0 2-2v-2.712a2 2 0 0 0-1.04-1.754L59.16 38.952a8.039 8.039 0 0 0-7.843.09L31.367 50.56a8.024 8.024 0 0 0-4 6.929v22.976a8 8 0 0 0 4 6.928l19.95 11.519a8.043 8.043 0 0 0 7.843.087l19.19-10.53a2 2 0 0 0 1.038-1.754v-2.71a2 2 0 0 0-2-2ZM172.112 45.362a15.017 15.017 0 0 0-15 15v17.277a15 15 0 0 0 30 0V60.36a15.017 15.017 0 0 0-15-15Zm7 32.277a7 7 0 0 1-14 0V60.36a7 7 0 0 1 14 0ZM135.446 53.421a7.01 7.01 0 0 1 7.868 6.075.99.99 0 0 0 .984.865h6.03a1.01 1.01 0 0 0 .999-1.097 15.018 15.018 0 0 0-15.716-13.883 15.288 15.288 0 0 0-14.244 15.416v16.407a15.288 15.288 0 0 0 14.244 15.416 15.018 15.018 0 0 0 15.716-13.884 1.01 1.01 0 0 0-.998-1.097h-6.03a.99.99 0 0 0-.985.865 7.01 7.01 0 0 1-7.868 6.075 7.164 7.164 0 0 1-6.078-7.184v-16.79a7.164 7.164 0 0 1 6.078-7.184ZM218.29 72.928a12.158 12.158 0 0 0 7.183-11.077v-3.702A12.15 12.15 0 0 0 213.324 46h-16.957a1 1 0 0 0-1 1v44a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V74h6.622l7.915 17.414a1 1 0 0 0 .91.586h6.591a1 1 0 0 0 .91-1.414Zm-.817-11.077A4.154 4.154 0 0 1 213.324 66h-9.85V54h9.85a4.154 4.154 0 0 1 4.15 4.15ZM260.367 46h-26a1 1 0 0 0-1 1v44a1 1 0 0 0 1 1h26a1 1 0 0 0 1-1v-6a1 1 0 0 0-1-1h-19V72h13a1 1 0 0 0 1-1v-6a1 1 0 0 0-1-1h-13V54h19a1 1 0 0 0 1-1v-6a1 1 0 0 0-1-1ZM298.367 46h-6a1 1 0 0 0-1 1v22.647a7.007 7.007 0 1 1-14 0V47a1 1 0 0 0-1-1h-6a1 1 0 0 0-1 1v22.647a15.003 15.003 0 1 0 30 0V47a1 1 0 0 0-1-1Z"/>
16+
<rect width="8" height="38" x="307.367" y="46" rx="1"/>
17+
</g>
18+
</svg>
519
</CSidebarBrand>
20+
<div class="text-body-secondary ms-3 me-5 mb-2 small fw-semibold">Framework:</div>
621
<CDropdown class="ms-3 me-5 mb-4">
722
<CDropdownToggle color="primary" variant="outline"> Vue.js </CDropdownToggle>
823
<CDropdownMenu class="w-100">
@@ -25,7 +40,6 @@
2540
import { defineComponent } from 'vue'
2641
import { useSidebarItems } from '../composables'
2742
import { SidebarNav } from './SidebarNav'
28-
import logo from '../../assets/brand/coreui-vue.svg'
2943
3044
export default defineComponent({
3145
name: 'Sidebar',
@@ -37,7 +51,6 @@ export default defineComponent({
3751
setup() {
3852
const sidebarItems = useSidebarItems()
3953
return {
40-
logo,
4154
sidebarItems,
4255
}
4356
},

0 commit comments

Comments
 (0)
0