vuepress-theme-uniapp-official 1.5.0 → 1.5.2

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.
@@ -1,104 +1,98 @@
1
1
  <template>
2
- <li :class="li_class">
3
- <a :href="handleUrl(item.url)">
4
- <div class="DocSearch-Hit-Container">
5
- <div
6
- class="DocSearch-Hit-content-wrapper"
7
- v-if="item.hierarchy[item.type] && item.type === 'lvl1'"
8
- >
9
- <span class="DocSearch-Hit-title" v-html="hierarchyLvl1Html" />
10
- <span v-if="item.content" class="DocSearch-Hit-path" v-html="contentHtml" />
11
- </div>
2
+ <li :class="li_class">
3
+ <a :href="handleUrl(item.url)">
4
+ <div class="DocSearch-Hit-Container">
5
+ <div class="DocSearch-Hit-content-wrapper" v-if="item.hierarchy[item.type] && item.type === 'lvl1'">
6
+ <span class="DocSearch-Hit-title" v-html="hierarchyLvl1Html" />
7
+ <span v-if="item.content" class="DocSearch-Hit-path" v-html="contentHtml" />
8
+ </div>
12
9
 
13
- <div v-else-if="isContent" class="DocSearch-Hit-content-wrapper">
14
- <span class="DocSearch-Hit-title" v-html="contentHtml" />
15
- <span class="DocSearch-Hit-path" v-html="hierarchyLvl1Html || hierarchyLvl2Html" />
16
- </div>
10
+ <div v-else-if="isContent" class="DocSearch-Hit-content-wrapper">
11
+ <span class="DocSearch-Hit-title" v-html="contentHtml" />
12
+ <span class="DocSearch-Hit-path" v-html="hierarchyLvl1Html || hierarchyLvl2Html" />
13
+ </div>
17
14
 
18
- <div v-else class="DocSearch-Hit-content-wrapper">
19
- <span
20
- class="DocSearch-Hit-title"
21
- v-html="snippetResultContent(`hierarchy.${item.type}`)"
22
- />
23
- <span class="DocSearch-Hit-path" v-html="hierarchyLvl1Html" />
24
- </div>
15
+ <div v-else class="DocSearch-Hit-content-wrapper">
16
+ <span class="DocSearch-Hit-title" v-html="snippetResultContent(`hierarchy.${item.type}`)" />
17
+ <span class="DocSearch-Hit-path" v-html="hierarchyLvl1Html" />
18
+ </div>
25
19
 
26
- <span v-if="item.tag && item.tag !== 'uniCloud'" class="DocSearch-Hit-source_tag">
27
- {{ item.tag }}
28
- </span>
29
- </div>
30
- </a>
31
- </li>
20
+ <span v-if="item.tag && item.tag !== 'uniCloud'" class="DocSearch-Hit-source_tag">
21
+ {{ item.tag }}
22
+ </span>
23
+ </div>
24
+ </a>
25
+ </li>
32
26
  </template>
33
27
  <script>
34
- function getPropertyByPath(object, path) {
35
- const parts = path.split('.');
28
+ function getPropertyByPath(object, path) {
29
+ const parts = path.split('.');
36
30
 
37
- return parts.reduce((prev, current) => {
38
- if (prev && prev[current]) return prev[current];
39
- return null;
40
- }, object);
41
- }
31
+ return parts.reduce((prev, current) => {
32
+ if (prev && prev[current]) return prev[current];
33
+ return null;
34
+ }, object);
35
+ }
42
36
 
43
- export default {
44
- data() {
45
- return {};
46
- },
47
- props: {
48
- item: {
49
- type: Object,
50
- default: () => ({}),
51
- },
52
- index: {
53
- type: Number,
54
- default: 0,
55
- },
56
- },
57
- computed: {
58
- li_class() {
59
- return ['DocSearch-Hit', this.item.__docsearch_parent && 'DocSearch-Hit--Child']
60
- .filter(Boolean)
61
- .join(' ');
62
- },
63
- isContent() {
64
- return this.item.type === 'content';
65
- },
66
- contentHtml() {
67
- return this.snippetResultContent('content');
68
- },
69
- hierarchyLvl1Html() {
70
- return this.snippetResultContent('hierarchy.lvl1');
71
- },
72
- hierarchyLvl2Html() {
73
- const lvl2 = this.snippetResultContent('hierarchy.lvl2');
74
- return this.isContent ? this.contentHtml === lvl2 ? '' : lvl2 : '';
75
- },
76
- },
77
- methods: {
78
- snippetResultContent(attribute) {
79
- return (
80
- getPropertyByPath(this.item, `_snippetResult.${attribute}.value`) ||
81
- getPropertyByPath(this.item, attribute)
82
- );
83
- },
84
- handleUrl(url) {
85
- const len = url.length
86
- const lastIndex = url.lastIndexOf('/')
87
- if (lastIndex === len - 1) {
88
- return url
89
- }
90
- const front = url.substring(0, lastIndex + 1)
91
- const end = url.substring(lastIndex + 1)
92
- if (end.indexOf('.html') > -1) {
93
- return url
94
- }
95
- if (end.indexOf('#') > -1) {
96
- return front + end.replace(/([\s\S]+)#([\s\S]+)/, '$1.html#$2')
97
- }
98
- return `${url}.html`
99
- }
100
- },
101
- };
37
+ export default {
38
+ data() {
39
+ return {};
40
+ },
41
+ props: {
42
+ item: {
43
+ type: Object,
44
+ default: () => ({}),
45
+ },
46
+ index: {
47
+ type: Number,
48
+ default: 0,
49
+ },
50
+ },
51
+ computed: {
52
+ li_class() {
53
+ return ['DocSearch-Hit', this.item.__docsearch_parent && 'DocSearch-Hit--Child']
54
+ .filter(Boolean)
55
+ .join(' ');
56
+ },
57
+ isContent() {
58
+ return this.item.type === 'content';
59
+ },
60
+ contentHtml() {
61
+ return this.snippetResultContent('content');
62
+ },
63
+ hierarchyLvl1Html() {
64
+ return this.snippetResultContent('hierarchy.lvl1');
65
+ },
66
+ hierarchyLvl2Html() {
67
+ const lvl2 = this.snippetResultContent('hierarchy.lvl2');
68
+ return this.isContent ? this.contentHtml === lvl2 ? '' : lvl2 : '';
69
+ },
70
+ },
71
+ methods: {
72
+ snippetResultContent(attribute) {
73
+ return (
74
+ getPropertyByPath(this.item, `_snippetResult.${attribute}.value`) ||
75
+ getPropertyByPath(this.item, attribute)
76
+ );
77
+ },
78
+ handleUrl(url) {
79
+ const len = url.length
80
+ const lastIndex = url.lastIndexOf('/')
81
+ if (lastIndex === len - 1) {
82
+ return url
83
+ }
84
+ const front = url.substring(0, lastIndex + 1)
85
+ const end = url.substring(lastIndex + 1)
86
+ if (end.indexOf('.html') > -1) {
87
+ return url
88
+ }
89
+ if (end.indexOf('#') > -1) {
90
+ return front + end.replace(/([\s\S]+)#([\s\S]+)/, '$1.html#$2')
91
+ }
92
+ return `${url}.html`
93
+ }
94
+ },
95
+ };
102
96
  </script>
103
97
  <style lang="stylus">
104
98
  .DocSearch-Hit-source_tag {
@@ -110,51 +104,54 @@
110
104
  margin-right: 5px;
111
105
  font-weight: normal;
112
106
  }
113
- .DocSearch-Hit
114
- border-radius 0px
115
- display flex
116
- padding-bottom 0px
117
- position relative
107
+ .DocSearch-Hit
108
+ border-radius 0px
109
+ display flex
110
+ padding-bottom 0px
111
+ position relative
118
112
 
119
- &:not(:first-child)
120
- border-top 1px solid #f5f6f7
113
+ &:not(:first-child)
114
+ border-top 1px solid #f5f6f7
121
115
 
122
- a
123
- background var(--docsearch-hit-background)
124
- border-radius 0px
125
- // box-shadow var(--docsearch-hit-shadow)
126
- box-shadow none
127
- display block
128
- padding-left var(--docsearch-spacing)
129
- width 100%
116
+ a
117
+ background var(--docsearch-hit-background)
118
+ border-radius 0px
119
+ // box-shadow var(--docsearch-hit-shadow)
120
+ box-shadow none
121
+ display block
122
+ padding-left var(--docsearch-spacing)
123
+ width 100%
130
124
 
131
- .DocSearch-Hit-Container
132
- align-items center
133
- color #444950
134
- display flex
135
- flex-direction row
136
- height 56px
137
- padding 0 12px 0 0
125
+ .DocSearch-Hit-Container
126
+ align-items center
127
+ color #444950
128
+ display flex
129
+ flex-direction row
130
+ height 56px
131
+ padding 0 12px 0 0
132
+ @media (max-width $MQMobile)
133
+ height 46px
134
+ padding 0 8px 0 0
138
135
 
139
- .DocSearch-Hit-content-wrapper
140
- overflow hidden
141
- display flex
142
- flex 1 1 auto
143
- flex-direction column
144
- font-weight 500
145
- justify-content center
146
- line-height 1.2em
147
- margin 0 8px
148
- overflow-x hidden
149
- position relative
150
- text-overflow ellipsis
151
- white-space nowrap
152
- width 80%
136
+ .DocSearch-Hit-content-wrapper
137
+ overflow hidden
138
+ display flex
139
+ flex 1 1 auto
140
+ flex-direction column
141
+ font-weight 500
142
+ justify-content center
143
+ line-height 1.2em
144
+ margin 0 8px
145
+ overflow-x hidden
146
+ position relative
147
+ text-overflow ellipsis
148
+ white-space nowrap
149
+ width 80%
153
150
 
154
- .DocSearch-Hit-title
155
- font-size 0.9em
151
+ .DocSearch-Hit-title
152
+ font-size 0.9em
156
153
 
157
- .DocSearch-Hit-path
158
- // color $accentColor
159
- font-size 0.75em
154
+ .DocSearch-Hit-path
155
+ // color $accentColor
156
+ font-size 0.75em
160
157
  </style>
@@ -63,4 +63,8 @@
63
63
  font-size 1em;
64
64
  padding 15px 4px 15px
65
65
  }
66
+
67
+ @media (max-width $MQMobile)
68
+ .DocSearch-Hit-source
69
+ padding 8px 4px 8px
66
70
  </style>
@@ -107,12 +107,15 @@
107
107
  .page-bar
108
108
  display flex
109
109
  justify-content center
110
- margin 10px
111
110
 
112
- ul, li
113
- margin 0px
114
- padding 0px
115
- user-select none
111
+ ul
112
+ margin 0px
113
+ line-height normal
114
+ padding 0px
115
+ li
116
+ margin 0px
117
+ padding 0px
118
+ user-select none
116
119
 
117
120
  li
118
121
  display inline-block
@@ -128,11 +131,10 @@
128
131
  position relative
129
132
  float left
130
133
  padding 2px 10px
131
- margin-left -1px
132
- line-height 1.42857143
134
+ line-height 1.5
133
135
  color #5d6062
134
136
  cursor pointer
135
- margin-right 20px
137
+ margin-right 15px
136
138
  background-color #fff
137
139
 
138
140
  .page-bar a:hover
@@ -5,6 +5,7 @@ $svg-hover-color = #9b9b9b
5
5
  @import './styles/ask.styl'
6
6
 
7
7
  #search-container
8
+ font-size: 16px
8
9
  position relative
9
10
  overflow auto
10
11
  position fixed
@@ -13,9 +14,63 @@ $svg-hover-color = #9b9b9b
13
14
  left 0
14
15
  top 0
15
16
  z-index 200
16
- background-color $search-container-color
17
+ background-color: rgba(0,0,0,0.4);
18
+ backdrop-filter: blur(4px);
17
19
 
18
- .sub-navbar, .result-wrap
20
+ .result-number
21
+ display flex
22
+ justify-content center
23
+ align-items center
24
+ padding 10px 0
25
+ font-size 20px
26
+
27
+ .uni-loading
28
+ width 27px
29
+ height 27px
30
+
31
+ .DocSearch-Logo
32
+ font-size 16px
33
+ vertical-align middle
34
+ display inline-block
35
+
36
+ .search-result
37
+ width 95%
38
+ // max-width 960px
39
+ margin 0 auto 10px
40
+ padding: 10px;
41
+ box-sizing border-box
42
+ overflow-x: hidden;
43
+ background-color: $search-container-color
44
+
45
+ .result-wrap
46
+ ul
47
+ list-style none
48
+ margin 0
49
+ padding 0
50
+
51
+ .algolia-logo
52
+ display flex
53
+ justify-content center
54
+ padding 10px 0
55
+
56
+ .search-more
57
+ display block
58
+ text-align center
59
+ padding 10px 0
60
+ color inherit
61
+ cursor pointer
62
+
63
+ &:hover
64
+ color $accentColor
65
+
66
+ .search-page-content
67
+ width: 90%;
68
+ margin: 20px auto 20px;
69
+ background-color: #fff;
70
+ border-radius: 6px;
71
+ overflow hidden
72
+ .sub-navbar
73
+ background-color: $navbar-background-color
19
74
  margin 0 auto
20
75
 
21
76
  .search-wrap
@@ -63,7 +118,6 @@ $svg-hover-color = #9b9b9b
63
118
 
64
119
  .search-input
65
120
  width 100%
66
- height 56px
67
121
  font-size 16px
68
122
  border none
69
123
  box-sizing border-box
@@ -71,8 +125,8 @@ $svg-hover-color = #9b9b9b
71
125
  padding 1px 18px
72
126
  border-radius 4px
73
127
 
74
- .search-input-btn
75
- height 56px
128
+ .search-input, .search-input-btn
129
+ height 46px
76
130
 
77
131
  .search-back__btn
78
132
  display block !important
@@ -110,52 +164,15 @@ $svg-hover-color = #9b9b9b
110
164
  @media (max-width 900px)
111
165
  &
112
166
  padding 0 1%
113
-
114
- .result-number
115
- display flex
116
- justify-content center
117
- align-items center
118
- padding-top 20px
119
- font-size 20px
120
-
121
- .uni-loading
122
- width 27px
123
- height 27px
124
-
125
- .DocSearch-Logo
126
- font-size 16px
127
- vertical-align middle
128
- display inline-block
129
-
130
- .search-result
131
- width 80%
132
- max-width 960px
133
- margin 0 auto
134
- box-sizing border-box
135
-
136
- .result-wrap
137
- ul
138
- list-style none
139
- margin 0
140
- padding 0
141
-
142
- .algolia-logo
143
- display flex
144
- justify-content center
145
- padding 10px 0 20px
146
-
147
- .search-more
148
- display block
149
- text-align center
150
- padding 10px 0
151
- color inherit
152
- cursor pointer
153
-
154
- &:hover
155
- color $accentColor
167
+ .search-footer
168
+ // 一个好看的上方阴影
169
+ background-color $navbar-background-color
170
+ .search-pagination
171
+ padding-top 10px
156
172
 
157
173
  @media (max-width $MQMobile)
158
174
  #search-container
175
+ font-size: 14px
159
176
  .search-navbar-header>.main-navbar
160
177
  display none !important
161
178
 
@@ -180,4 +197,6 @@ $svg-hover-color = #9b9b9b
180
197
  padding 0 10px
181
198
 
182
199
  .search-result-aside
183
- display none
200
+ display none
201
+ .result-number
202
+ font-size 14px