vitepress-theme-element-plus 0.0.3 → 0.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/README.md +3 -3
  2. package/client/components/A11yTag.vue +29 -29
  3. package/client/components/ApiTyping.vue +54 -54
  4. package/client/components/Backdrop.vue +41 -41
  5. package/client/components/Bili.vue +94 -94
  6. package/client/components/Content.vue +148 -150
  7. package/client/components/DeprecatedTag.vue +19 -19
  8. package/client/components/Doc.vue +181 -181
  9. package/client/components/DocAside.vue +46 -46
  10. package/client/components/DocAsideOutline.vue +87 -82
  11. package/client/components/DocFooter.vue +159 -159
  12. package/client/components/Footer.vue +77 -77
  13. package/client/components/FooterCopyright.vue +27 -27
  14. package/client/components/Layout.vue +156 -156
  15. package/client/components/Link.vue +41 -41
  16. package/client/components/LocalNav.vue +160 -160
  17. package/client/components/Nav.vue +69 -69
  18. package/client/components/NavBar.vue +203 -203
  19. package/client/components/NavBarTitle.vue +75 -75
  20. package/client/components/Sidebar.vue +129 -129
  21. package/client/components/SidebarGroup.vue +51 -51
  22. package/client/components/SidebarItem.vue +302 -302
  23. package/client/components/Tag.vue +25 -25
  24. package/client/components/VPNavBarSearch.vue +23 -23
  25. package/client/components/VersionTag.vue +18 -18
  26. package/client/hooks/useBackTop.ts +71 -71
  27. package/client/hooks/useLangs.ts +50 -50
  28. package/client/hooks/useSidebar.ts +93 -18
  29. package/client/hooks/useSidebarControl.ts +78 -78
  30. package/client/hooks/useSize.ts +69 -69
  31. package/client/utils/client/common.ts +49 -49
  32. package/client/utils/client/outline.ts +113 -113
  33. package/client/utils/common.ts +90 -90
  34. package/index.ts +26 -26
  35. package/package.json +73 -73
  36. package/shared/constants.ts +3 -3
  37. package/styles/base.scss +37 -37
  38. package/styles/code.scss +282 -282
  39. package/styles/doc-content.scss +162 -161
  40. package/styles/index.scss +69 -69
  41. package/styles/tag-content.scss +30 -30
@@ -1,150 +1,148 @@
1
- <script setup lang="ts">
2
- import { ElTag } from 'element-plus'
3
- import { useData } from 'vitepress'
4
- import VPHome from 'vitepress/dist/client/theme-default/components/VPHome.vue'
5
- import VPPage from 'vitepress/dist/client/theme-default/components/VPPage.vue'
6
- import NotFound from 'vitepress/dist/client/theme-default/NotFound.vue'
7
- import { useLayout } from 'vitepress/theme'
8
- import { getCurrentInstance } from 'vue'
9
- import ApiTyping from './ApiTyping.vue'
10
- import VPDoc from './Doc.vue'
11
- import Footer from './Footer.vue'
12
- import FooterCopyright from './FooterCopyright.vue'
13
-
14
- const { page, frontmatter } = useData()
15
- const { isHome, hasSidebar } = useLayout()
16
- const { appContext } = getCurrentInstance()
17
-
18
- appContext.app.component('ApiTyping', ApiTyping)
19
- appContext.app.component('ElTag', ElTag)
20
- </script>
21
-
22
- <template>
23
- <div id="VPContent" class="VPContent" :class="{ 'has-sidebar': hasSidebar, 'is-home': isHome }">
24
- <slot v-if="page.isNotFound" name="not-found">
25
- <NotFound />
26
- </slot>
27
-
28
- <VPPage v-else-if="frontmatter.layout === 'page'">
29
- <template #page-top>
30
- <slot name="page-top" />
31
- </template>
32
- <template #page-bottom>
33
- <slot name="page-bottom" />
34
- </template>
35
- </VPPage>
36
-
37
- <VPHome v-else-if="frontmatter.layout === 'home'">
38
- <template #home-hero-before>
39
- <slot name="home-hero-before" />
40
- </template>
41
- <template #home-hero-info-before>
42
- <slot name="home-hero-info-before" />
43
- </template>
44
- <template #home-hero-info>
45
- <slot name="home-hero-info" />
46
- </template>
47
- <template #home-hero-info-after>
48
- <slot name="home-hero-info-after" />
49
- </template>
50
- <template #home-hero-actions-after>
51
- <slot name="home-hero-actions-after" />
52
- </template>
53
- <template #home-hero-image>
54
- <slot name="home-hero-image" />
55
- </template>
56
- <template #home-hero-after>
57
- <slot name="home-hero-after" />
58
- </template>
59
- <template #home-features-before>
60
- <slot name="home-features-before" />
61
- </template>
62
- <template #home-features-after>
63
- <slot name="home-features-after" />
64
- </template>
65
- </VPHome>
66
-
67
- <component :is="frontmatter.layout" v-else-if="frontmatter.layout && frontmatter.layout !== 'doc'" />
68
-
69
- <VPDoc v-else>
70
- <template #doc-top>
71
- <slot name="doc-top" />
72
- </template>
73
- <template #doc-bottom>
74
- <slot name="doc-bottom" />
75
- </template>
76
-
77
- <template #doc-footer-before>
78
- <slot name="doc-footer-before" />
79
- </template>
80
- <template #doc-before>
81
- <slot name="doc-before" />
82
- </template>
83
- <template #doc-after>
84
- <slot name="doc-after" />
85
- </template>
86
-
87
- <template #aside-top>
88
- <slot name="aside-top" />
89
- </template>
90
- <template #aside-outline-before>
91
- <slot name="aside-outline-before" />
92
- </template>
93
- <template #aside-outline-after>
94
- <slot name="aside-outline-after" />
95
- </template>
96
- <template #aside-ads-before>
97
- <slot name="aside-ads-before" />
98
- </template>
99
- <template #aside-ads-after>
100
- <slot name="aside-ads-after" />
101
- </template>
102
- <template #aside-bottom>
103
- <slot name="aside-bottom" />
104
- </template>
105
- </VPDoc>
106
- <Footer />
107
- <FooterCopyright v-if="isHome" />
108
- </div>
109
- </template>
110
-
111
- <style scoped>
112
- .VPContent {
113
- flex-grow: 1;
114
- flex-shrink: 0;
115
- margin: var(--vp-layout-top-height, 0px) auto 0;
116
- width: 100%;
117
- }
118
-
119
- .VPContent.is-home {
120
- width: 100%;
121
- max-width: 100%;
122
- }
123
-
124
- .VPContent.has-sidebar {
125
- margin: 0;
126
- }
127
-
128
- @media (min-width: 960px) {
129
- .VPContent {
130
- padding-top: calc(var(--vp-nav-height) + 47px);
131
- }
132
-
133
- .VPContent.has-sidebar {
134
- margin: var(--vp-layout-top-height, 0px) 0 0;
135
- padding-left: var(--vp-sidebar-width-small);
136
- }
137
- }
138
-
139
- @media screen and (min-width: 1440px) {
140
- .VPContent.has-sidebar {
141
- padding-left: calc(var(--vp-sidebar-width-small) + 39px)
142
- }
143
- }
144
-
145
- @media screen and (min-width: 1680px) {
146
- .VPContent.has-sidebar {
147
- padding-left: calc(var(--vp-sidebar-width-small) + 48px)
148
- }
149
- }
150
- </style>
1
+ <script setup lang="ts">
2
+ import { useData } from 'vitepress'
3
+ import VPHome from 'vitepress/dist/client/theme-default/components/VPHome.vue'
4
+ import VPPage from 'vitepress/dist/client/theme-default/components/VPPage.vue'
5
+ import NotFound from 'vitepress/dist/client/theme-default/NotFound.vue'
6
+ import { useLayout } from 'vitepress/theme'
7
+ import { getCurrentInstance } from 'vue'
8
+ import ApiTyping from './ApiTyping.vue'
9
+ import VPDoc from './Doc.vue'
10
+ import Footer from './Footer.vue'
11
+ import FooterCopyright from './FooterCopyright.vue'
12
+
13
+ const { page, frontmatter } = useData()
14
+ const { isHome, hasSidebar } = useLayout()
15
+ const { appContext } = getCurrentInstance()
16
+
17
+ appContext.app.component('ApiTyping', ApiTyping)
18
+ </script>
19
+
20
+ <template>
21
+ <div id="VPContent" class="VPContent" :class="{ 'has-sidebar': hasSidebar, 'is-home': isHome }">
22
+ <slot v-if="page.isNotFound" name="not-found">
23
+ <NotFound />
24
+ </slot>
25
+
26
+ <VPPage v-else-if="frontmatter.layout === 'page'">
27
+ <template #page-top>
28
+ <slot name="page-top" />
29
+ </template>
30
+ <template #page-bottom>
31
+ <slot name="page-bottom" />
32
+ </template>
33
+ </VPPage>
34
+
35
+ <VPHome v-else-if="frontmatter.layout === 'home'">
36
+ <template #home-hero-before>
37
+ <slot name="home-hero-before" />
38
+ </template>
39
+ <template #home-hero-info-before>
40
+ <slot name="home-hero-info-before" />
41
+ </template>
42
+ <template #home-hero-info>
43
+ <slot name="home-hero-info" />
44
+ </template>
45
+ <template #home-hero-info-after>
46
+ <slot name="home-hero-info-after" />
47
+ </template>
48
+ <template #home-hero-actions-after>
49
+ <slot name="home-hero-actions-after" />
50
+ </template>
51
+ <template #home-hero-image>
52
+ <slot name="home-hero-image" />
53
+ </template>
54
+ <template #home-hero-after>
55
+ <slot name="home-hero-after" />
56
+ </template>
57
+ <template #home-features-before>
58
+ <slot name="home-features-before" />
59
+ </template>
60
+ <template #home-features-after>
61
+ <slot name="home-features-after" />
62
+ </template>
63
+ </VPHome>
64
+
65
+ <component :is="frontmatter.layout" v-else-if="frontmatter.layout && frontmatter.layout !== 'doc'" />
66
+
67
+ <VPDoc v-else>
68
+ <template #doc-top>
69
+ <slot name="doc-top" />
70
+ </template>
71
+ <template #doc-bottom>
72
+ <slot name="doc-bottom" />
73
+ </template>
74
+
75
+ <template #doc-footer-before>
76
+ <slot name="doc-footer-before" />
77
+ </template>
78
+ <template #doc-before>
79
+ <slot name="doc-before" />
80
+ </template>
81
+ <template #doc-after>
82
+ <slot name="doc-after" />
83
+ </template>
84
+
85
+ <template #aside-top>
86
+ <slot name="aside-top" />
87
+ </template>
88
+ <template #aside-outline-before>
89
+ <slot name="aside-outline-before" />
90
+ </template>
91
+ <template #aside-outline-after>
92
+ <slot name="aside-outline-after" />
93
+ </template>
94
+ <template #aside-ads-before>
95
+ <slot name="aside-ads-before" />
96
+ </template>
97
+ <template #aside-ads-after>
98
+ <slot name="aside-ads-after" />
99
+ </template>
100
+ <template #aside-bottom>
101
+ <slot name="aside-bottom" />
102
+ </template>
103
+ </VPDoc>
104
+ <Footer />
105
+ <FooterCopyright v-if="isHome" />
106
+ </div>
107
+ </template>
108
+
109
+ <style scoped>
110
+ .VPContent {
111
+ flex-grow: 1;
112
+ flex-shrink: 0;
113
+ margin: var(--vp-layout-top-height, 0px) auto 0;
114
+ width: 100%;
115
+ }
116
+
117
+ .VPContent.is-home {
118
+ width: 100%;
119
+ max-width: 100%;
120
+ }
121
+
122
+ .VPContent.has-sidebar {
123
+ margin: 0;
124
+ }
125
+
126
+ @media (min-width: 960px) {
127
+ .VPContent {
128
+ padding-top: calc(var(--vp-nav-height) + 47px);
129
+ }
130
+
131
+ .VPContent.has-sidebar {
132
+ margin: var(--vp-layout-top-height, 0px) 0 0;
133
+ padding-left: var(--vp-sidebar-width-small);
134
+ }
135
+ }
136
+
137
+ @media screen and (min-width: 1440px) {
138
+ .VPContent.has-sidebar {
139
+ padding-left: calc(var(--vp-sidebar-width-small) + 39px)
140
+ }
141
+ }
142
+
143
+ @media screen and (min-width: 1680px) {
144
+ .VPContent.has-sidebar {
145
+ padding-left: calc(var(--vp-sidebar-width-small) + 48px)
146
+ }
147
+ }
148
+ </style>
@@ -1,19 +1,19 @@
1
- <script lang="ts" setup>
2
- import { ElTag } from 'element-plus'
3
-
4
- defineProps<{
5
- version: string
6
- }>()
7
- </script>
8
-
9
- <template>
10
- <ElTag
11
- size="small"
12
- type="warning"
13
- effect="plain"
14
- hit
15
- round
16
- >
17
- deprecated
18
- </ElTag>
19
- </template>
1
+ <script lang="ts" setup>
2
+ import { ElTag } from 'element-plus'
3
+
4
+ defineProps<{
5
+ version: string
6
+ }>()
7
+ </script>
8
+
9
+ <template>
10
+ <ElTag
11
+ size="small"
12
+ type="warning"
13
+ effect="plain"
14
+ hit
15
+ round
16
+ >
17
+ deprecated
18
+ </ElTag>
19
+ </template>