@varlet/cli 2.15.1 → 2.16.0-alpha.1693852004525
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.
- package/lib/node/config/varlet.config.js +2 -1
- package/lib/node/config/varlet.default.config.js +264 -7
- package/package.json +8 -7
- package/site/mobile/App.vue +25 -22
- package/site/mobile/{components/AppHome.vue → AppHome.vue} +6 -6
- package/site/mobile/main.ts +6 -21
- package/site/pc/App.vue +0 -5
- package/site/pc/Layout.vue +24 -28
- package/site/pc/components/AppHeader.vue +123 -122
- package/site/pc/components/AppMobile.vue +9 -2
- package/site/pc/components/AppSidebar.vue +18 -17
- package/site/{components → pc/components}/code-example/CodeExample.vue +8 -15
- package/site/pc/main.ts +6 -23
- package/site/pc/pages/index/index.vue +316 -47
- package/site/types.ts +6 -0
- package/template/generators/base/package.json +1 -0
- package/site/components/button/Button.vue +0 -106
- package/site/components/button/button.less +0 -183
- package/site/components/button/index.ts +0 -10
- package/site/components/button/props.ts +0 -78
- package/site/components/cell/Cell.vue +0 -54
- package/site/components/cell/cell.less +0 -78
- package/site/components/cell/index.ts +0 -10
- package/site/components/cell/props.ts +0 -27
- package/site/components/context/index.ts +0 -21
- package/site/components/context/lock.ts +0 -92
- package/site/components/context/zIndex.ts +0 -20
- package/site/components/icon/Icon.vue +0 -75
- package/site/components/icon/icon.less +0 -38
- package/site/components/icon/index.ts +0 -10
- package/site/components/icon/props.ts +0 -24
- package/site/components/loading/Loading.vue +0 -84
- package/site/components/loading/index.ts +0 -10
- package/site/components/loading/loading.less +0 -505
- package/site/components/loading/props.ts +0 -42
- package/site/components/popup/Popup.tsx +0 -102
- package/site/components/popup/index.ts +0 -10
- package/site/components/popup/popup.less +0 -125
- package/site/components/popup/props.ts +0 -63
- package/site/components/ripple/index.ts +0 -188
- package/site/components/ripple/ripple.less +0 -20
- package/site/components/snackbar/Snackbar.vue +0 -41
- package/site/components/snackbar/core.vue +0 -132
- package/site/components/snackbar/index.tsx +0 -270
- package/site/components/snackbar/props.ts +0 -97
- package/site/components/snackbar/snackbar.less +0 -135
- package/site/components/styles/common.less +0 -64
- package/site/components/styles/elevation.less +0 -126
- package/site/components/styles/var.less +0 -27
- package/site/components/utils/components.ts +0 -114
- package/site/components/utils/elements.ts +0 -104
- package/site/mobile/components/app-bar/AppBar.vue +0 -65
- package/site/mobile/components/app-bar/appBar.less +0 -57
- package/site/mobile/components/app-bar/index.ts +0 -10
- package/site/mobile/components/app-bar/props.ts +0 -25
- package/site/pc/components/AnimationBox.vue +0 -62
- package/site/pc/components/LogoAnimation.vue +0 -119
- package/site/pc/pages/index/index.less +0 -204
- /package/site/{components → pc/components}/code-example/codeExample.less +0 -0
- /package/site/{components → pc/components}/code-example/index.ts +0 -0
|
@@ -9,7 +9,8 @@ export function defineConfig(config) {
|
|
|
9
9
|
return config;
|
|
10
10
|
}
|
|
11
11
|
export function mergeStrategy(value, srcValue, key) {
|
|
12
|
-
|
|
12
|
+
const keys = ['features', 'members'];
|
|
13
|
+
if (keys.includes(key) && isArray(srcValue)) {
|
|
13
14
|
return srcValue;
|
|
14
15
|
}
|
|
15
16
|
}
|
|
@@ -4,8 +4,8 @@ const title = {
|
|
|
4
4
|
'en-US': 'Material design mobile components built for Vue3',
|
|
5
5
|
};
|
|
6
6
|
const description = {
|
|
7
|
-
'zh-CN': 'Varlet 是一个基于 Vue3 开发的 Material 风格移动端组件库,全面拥抱 Vue3 生态,由社区团队维护。支持 Typescript、按需引入、暗黑模式、主题定制、国际化,并提供 VSCode
|
|
8
|
-
'en-US': 'Varlet is a Material design mobile component library developed based on Vue3, developed and maintained by partners in the community. Support Typescript, import on demand, dark mode, theme customization, internationalization, and provide VSCode plugin to ensure a good development experience',
|
|
7
|
+
'zh-CN': 'Varlet 是一个基于 Vue3 开发的 Material 风格移动端组件库,全面拥抱 Vue3 生态,由社区团队维护。支持 Typescript、按需引入、暗黑模式、主题定制、国际化,并提供 VSCode 插件保障良好的开发体验。',
|
|
8
|
+
'en-US': 'Varlet is a Material design mobile component library developed based on Vue3, developed and maintained by partners in the community. Support Typescript, import on demand, dark mode, theme customization, internationalization, and provide VSCode plugin to ensure a good development experience.',
|
|
9
9
|
};
|
|
10
10
|
const keywords = {
|
|
11
11
|
'zh-CN': 'Varlet,Vue3 移动端组件库,Material Design',
|
|
@@ -38,8 +38,12 @@ export default defineConfig({
|
|
|
38
38
|
indexPage: {
|
|
39
39
|
description,
|
|
40
40
|
started: {
|
|
41
|
-
'zh-CN': '
|
|
42
|
-
'en-US': '
|
|
41
|
+
'zh-CN': '快速开始',
|
|
42
|
+
'en-US': 'Get Started',
|
|
43
|
+
},
|
|
44
|
+
viewOnGithub: {
|
|
45
|
+
'zh-CN': '查看仓库',
|
|
46
|
+
'en-US': 'View On Github',
|
|
43
47
|
},
|
|
44
48
|
features: [
|
|
45
49
|
{
|
|
@@ -133,6 +137,257 @@ export default defineConfig({
|
|
|
133
137
|
},
|
|
134
138
|
},
|
|
135
139
|
],
|
|
140
|
+
teamMembers: {
|
|
141
|
+
label: {
|
|
142
|
+
'zh-CN': '团队成员',
|
|
143
|
+
'en-US': 'Team Members',
|
|
144
|
+
},
|
|
145
|
+
members: [
|
|
146
|
+
{
|
|
147
|
+
name: {
|
|
148
|
+
'zh-CN': 'haoziqaq',
|
|
149
|
+
'en-US': 'haoziqaq',
|
|
150
|
+
},
|
|
151
|
+
title: {
|
|
152
|
+
'zh-CN': '开源开发者',
|
|
153
|
+
'en-US': 'Open Source Developer',
|
|
154
|
+
},
|
|
155
|
+
description: {
|
|
156
|
+
'zh-CN': 'varletjs 核心团队成员',
|
|
157
|
+
'en-US': 'Core team member of varletjs',
|
|
158
|
+
},
|
|
159
|
+
avatar: 'https://avatars.githubusercontent.com/u/24223652',
|
|
160
|
+
github: 'https://github.com/haoziqaq',
|
|
161
|
+
twitter: 'https://twitter.com/haozijunqaq',
|
|
162
|
+
},
|
|
163
|
+
{
|
|
164
|
+
name: {
|
|
165
|
+
'zh-CN': 'BeADre',
|
|
166
|
+
'en-US': 'BeADre',
|
|
167
|
+
},
|
|
168
|
+
title: {
|
|
169
|
+
'zh-CN': '开源开发者',
|
|
170
|
+
'en-US': 'Open Source Developer',
|
|
171
|
+
},
|
|
172
|
+
description: {
|
|
173
|
+
'zh-CN': 'varletjs 核心团队成员',
|
|
174
|
+
'en-US': 'Core team member of varletjs',
|
|
175
|
+
},
|
|
176
|
+
avatar: 'https://avatars.githubusercontent.com/u/34639100',
|
|
177
|
+
github: 'https://github.com/BeADre',
|
|
178
|
+
},
|
|
179
|
+
{
|
|
180
|
+
name: {
|
|
181
|
+
'zh-CN': 'zhangmo8',
|
|
182
|
+
'en-US': 'zhangmo8',
|
|
183
|
+
},
|
|
184
|
+
title: {
|
|
185
|
+
'zh-CN': '开源开发者',
|
|
186
|
+
'en-US': 'Open Source Developer',
|
|
187
|
+
},
|
|
188
|
+
description: {
|
|
189
|
+
'zh-CN': 'varletjs & ikun-ui 核心团队成员',
|
|
190
|
+
'en-US': 'Core team member of varletjs & ikun-ui',
|
|
191
|
+
},
|
|
192
|
+
avatar: 'https://avatars.githubusercontent.com/u/43628500',
|
|
193
|
+
github: 'https://github.com/zhangmo8',
|
|
194
|
+
twitter: 'https://twitter.com/wegi8666',
|
|
195
|
+
},
|
|
196
|
+
{
|
|
197
|
+
name: {
|
|
198
|
+
'zh-CN': 'chouchouji',
|
|
199
|
+
'en-US': 'chouchouji',
|
|
200
|
+
},
|
|
201
|
+
title: {
|
|
202
|
+
'zh-CN': '开源开发者',
|
|
203
|
+
'en-US': 'Open Source Developer',
|
|
204
|
+
},
|
|
205
|
+
description: {
|
|
206
|
+
'zh-CN': 'varletjs 核心团队成员',
|
|
207
|
+
'en-US': 'Core team member of varletjs',
|
|
208
|
+
},
|
|
209
|
+
avatar: 'https://avatars.githubusercontent.com/u/70570907',
|
|
210
|
+
github: 'https://github.com/chouchouji',
|
|
211
|
+
},
|
|
212
|
+
{
|
|
213
|
+
name: {
|
|
214
|
+
'zh-CN': 'tiny-dust',
|
|
215
|
+
'en-US': 'tiny-dust',
|
|
216
|
+
},
|
|
217
|
+
title: {
|
|
218
|
+
'zh-CN': '开源开发者',
|
|
219
|
+
'en-US': 'Open Source Developer',
|
|
220
|
+
},
|
|
221
|
+
description: {
|
|
222
|
+
'zh-CN': 'varletjs 核心团队成员',
|
|
223
|
+
'en-US': 'Core team member of varletjs',
|
|
224
|
+
},
|
|
225
|
+
avatar: 'https://avatars.githubusercontent.com/u/49502875',
|
|
226
|
+
github: 'https://github.com/tiny-dust',
|
|
227
|
+
},
|
|
228
|
+
{
|
|
229
|
+
name: {
|
|
230
|
+
'zh-CN': 'songjianet',
|
|
231
|
+
'en-US': 'songjianet',
|
|
232
|
+
},
|
|
233
|
+
title: {
|
|
234
|
+
'zh-CN': '开源开发者',
|
|
235
|
+
'en-US': 'Open Source Developer',
|
|
236
|
+
},
|
|
237
|
+
description: {
|
|
238
|
+
'zh-CN': 'varletjs & apache & w3c & naiveui & ikun-ui 团队成员',
|
|
239
|
+
'en-US': 'Core team member of varletjs & apache & w3c & naiveui & ikun-ui',
|
|
240
|
+
},
|
|
241
|
+
avatar: 'https://avatars.githubusercontent.com/u/19239641',
|
|
242
|
+
github: 'https://github.com/songjianet',
|
|
243
|
+
twitter: 'https://twitter.com/songjianet',
|
|
244
|
+
},
|
|
245
|
+
{
|
|
246
|
+
name: {
|
|
247
|
+
'zh-CN': 'running snail',
|
|
248
|
+
'en-US': 'running snail',
|
|
249
|
+
},
|
|
250
|
+
title: {
|
|
251
|
+
'zh-CN': '开源开发者',
|
|
252
|
+
'en-US': 'Open Source Developer',
|
|
253
|
+
},
|
|
254
|
+
description: {
|
|
255
|
+
'zh-CN': 'varletjs & dcloud 团队成员',
|
|
256
|
+
'en-US': 'Core team member of varletjs & dcloud',
|
|
257
|
+
},
|
|
258
|
+
avatar: 'https://avatars.githubusercontent.com/u/37523000',
|
|
259
|
+
github: 'https://github.com/zhenyuWang',
|
|
260
|
+
},
|
|
261
|
+
{
|
|
262
|
+
name: {
|
|
263
|
+
'zh-CN': 'qytayh',
|
|
264
|
+
'en-US': 'qytayh',
|
|
265
|
+
},
|
|
266
|
+
title: {
|
|
267
|
+
'zh-CN': '开源开发者',
|
|
268
|
+
'en-US': 'Open Source Developer',
|
|
269
|
+
},
|
|
270
|
+
description: {
|
|
271
|
+
'zh-CN': 'varletjs 团队成员',
|
|
272
|
+
'en-US': 'Core team member of varletjs',
|
|
273
|
+
},
|
|
274
|
+
avatar: 'https://avatars.githubusercontent.com/u/39668309',
|
|
275
|
+
github: 'https://github.com/qytayh',
|
|
276
|
+
},
|
|
277
|
+
{
|
|
278
|
+
name: {
|
|
279
|
+
'zh-CN': 'Erkelost',
|
|
280
|
+
'en-US': 'Erkelost',
|
|
281
|
+
},
|
|
282
|
+
title: {
|
|
283
|
+
'zh-CN': '开源开发者',
|
|
284
|
+
'en-US': 'Open Source Developer',
|
|
285
|
+
},
|
|
286
|
+
description: {
|
|
287
|
+
'zh-CN': 'varletjs & unplugin & farm & devui & wujie 团队成员',
|
|
288
|
+
'en-US': 'Core team member of varletjs & unplugin & farm & devui & wujie',
|
|
289
|
+
},
|
|
290
|
+
avatar: 'https://avatars.githubusercontent.com/u/66500121',
|
|
291
|
+
github: 'https://github.com/ErKeLost',
|
|
292
|
+
},
|
|
293
|
+
{
|
|
294
|
+
name: {
|
|
295
|
+
'zh-CN': 'EmberSpirit',
|
|
296
|
+
'en-US': 'EmberSpirit',
|
|
297
|
+
},
|
|
298
|
+
title: {
|
|
299
|
+
'zh-CN': '开源开发者',
|
|
300
|
+
'en-US': 'Open Source Developer',
|
|
301
|
+
},
|
|
302
|
+
description: {
|
|
303
|
+
'zh-CN': 'varletjs 团队成员',
|
|
304
|
+
'en-US': 'Core team member of varletjs',
|
|
305
|
+
},
|
|
306
|
+
avatar: 'https://avatars.githubusercontent.com/u/85718018',
|
|
307
|
+
github: 'https://github.com/wangKBweb',
|
|
308
|
+
},
|
|
309
|
+
{
|
|
310
|
+
name: {
|
|
311
|
+
'zh-CN': 'ayangweb',
|
|
312
|
+
'en-US': 'ayangweb',
|
|
313
|
+
},
|
|
314
|
+
title: {
|
|
315
|
+
'zh-CN': '开源开发者 & B 站 UP 主',
|
|
316
|
+
'en-US': 'Open Source Developer & Bilibili UP',
|
|
317
|
+
},
|
|
318
|
+
description: {
|
|
319
|
+
'zh-CN': 'varletjs 团队成员',
|
|
320
|
+
'en-US': 'Core team member of varletjs',
|
|
321
|
+
},
|
|
322
|
+
avatar: 'https://avatars.githubusercontent.com/u/75017711',
|
|
323
|
+
github: 'https://github.com/ayangweb',
|
|
324
|
+
},
|
|
325
|
+
{
|
|
326
|
+
name: {
|
|
327
|
+
'zh-CN': 'jiechen66',
|
|
328
|
+
'en-US': 'jiechen66',
|
|
329
|
+
},
|
|
330
|
+
title: {
|
|
331
|
+
'zh-CN': '开源开发者',
|
|
332
|
+
'en-US': 'Open Source Developer',
|
|
333
|
+
},
|
|
334
|
+
description: {
|
|
335
|
+
'zh-CN': 'varletjs 团队成员',
|
|
336
|
+
'en-US': 'Core team member of varletjs',
|
|
337
|
+
},
|
|
338
|
+
avatar: 'https://avatars.githubusercontent.com/u/42862411',
|
|
339
|
+
github: 'https://github.com/jiechen66',
|
|
340
|
+
},
|
|
341
|
+
{
|
|
342
|
+
name: {
|
|
343
|
+
'zh-CN': 'dyggod',
|
|
344
|
+
'en-US': 'dyggod',
|
|
345
|
+
},
|
|
346
|
+
title: {
|
|
347
|
+
'zh-CN': '开源开发者',
|
|
348
|
+
'en-US': 'Open Source Developer',
|
|
349
|
+
},
|
|
350
|
+
description: {
|
|
351
|
+
'zh-CN': 'varletjs 团队成员',
|
|
352
|
+
'en-US': 'Core team member of varletjs',
|
|
353
|
+
},
|
|
354
|
+
avatar: 'https://avatars.githubusercontent.com/u/49914353',
|
|
355
|
+
github: 'https://github.com/dyggod',
|
|
356
|
+
},
|
|
357
|
+
{
|
|
358
|
+
name: {
|
|
359
|
+
'zh-CN': 'clen cat',
|
|
360
|
+
'en-US': 'clen cat',
|
|
361
|
+
},
|
|
362
|
+
title: {
|
|
363
|
+
'zh-CN': '开源开发者',
|
|
364
|
+
'en-US': 'Open Source Developer',
|
|
365
|
+
},
|
|
366
|
+
description: {
|
|
367
|
+
'zh-CN': 'varletjs 团队成员',
|
|
368
|
+
'en-US': 'Core team member of varletjs',
|
|
369
|
+
},
|
|
370
|
+
avatar: 'https://avatars.githubusercontent.com/u/37403253',
|
|
371
|
+
github: 'https://github.com/a145789',
|
|
372
|
+
},
|
|
373
|
+
{
|
|
374
|
+
name: {
|
|
375
|
+
'zh-CN': 'gaoting',
|
|
376
|
+
'en-US': 'gaoting',
|
|
377
|
+
},
|
|
378
|
+
title: {
|
|
379
|
+
'zh-CN': '开源开发者',
|
|
380
|
+
'en-US': 'Open Source Developer',
|
|
381
|
+
},
|
|
382
|
+
description: {
|
|
383
|
+
'zh-CN': 'varletjs 团队成员',
|
|
384
|
+
'en-US': 'Core team member of varletjs',
|
|
385
|
+
},
|
|
386
|
+
avatar: 'https://avatars.githubusercontent.com/u/7401170',
|
|
387
|
+
github: 'https://github.com/gaoting',
|
|
388
|
+
},
|
|
389
|
+
],
|
|
390
|
+
},
|
|
136
391
|
contributors: {
|
|
137
392
|
label: {
|
|
138
393
|
'zh-CN': '贡献者',
|
|
@@ -194,7 +449,9 @@ export default defineConfig({
|
|
|
194
449
|
themeKey: 'VARLET_THEME',
|
|
195
450
|
lightTheme: {
|
|
196
451
|
'color-body': '#fff',
|
|
197
|
-
'color-index-page-background': '#
|
|
452
|
+
'color-index-page-background': '#fff',
|
|
453
|
+
'color-index-page-get-started-button': '#3a7afe',
|
|
454
|
+
'color-index-page-github-button': '#212121',
|
|
198
455
|
'color-index-page-feature-background': '#fff',
|
|
199
456
|
'color-index-page-logo-mask-background': 'linear-gradient(-45deg, #8baff8 50%, #84e0ff 50%)',
|
|
200
457
|
'color-index-page-second-text-color': 'rgba(60, 60, 60, .7)',
|
|
@@ -217,7 +474,6 @@ export default defineConfig({
|
|
|
217
474
|
'color-mobile-cell-hover': '#3a7afe',
|
|
218
475
|
'color-pc-language-active': '#3a7afe',
|
|
219
476
|
'color-pc-language-active-background': '#edf5ff',
|
|
220
|
-
'color-pc-github-active-background': '#212121',
|
|
221
477
|
'color-mobile-language-active': '#3a7afe',
|
|
222
478
|
'color-mobile-language-active-background': '#edf5ff',
|
|
223
479
|
'color-hl-background': '#fafafa',
|
|
@@ -236,6 +492,8 @@ export default defineConfig({
|
|
|
236
492
|
darkTheme: {
|
|
237
493
|
'color-body': '#121212',
|
|
238
494
|
'color-index-page-background': '#1e1e1e',
|
|
495
|
+
'color-index-page-get-started-button': '#4a7afe',
|
|
496
|
+
'color-index-page-github-button': '#303030',
|
|
239
497
|
'color-index-page-feature-background': '#303030',
|
|
240
498
|
'color-index-page-logo-mask-background': 'linear-gradient(-45deg, #729dfc 50%, #6859f4 50%)',
|
|
241
499
|
'color-index-page-second-text-color': 'rgba(255, 255, 255, .75)',
|
|
@@ -258,7 +516,6 @@ export default defineConfig({
|
|
|
258
516
|
'color-mobile-cell-hover': '#4a7afe',
|
|
259
517
|
'color-pc-language-active': '#4a7afe',
|
|
260
518
|
'color-pc-language-active-background': '#4a7afe20',
|
|
261
|
-
'color-pc-github-active-background': '#303030',
|
|
262
519
|
'color-mobile-language-active': '#4a7afe',
|
|
263
520
|
'color-mobile-language-active-background': '#4a7afe20',
|
|
264
521
|
'color-hl-background': '#272727',
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@varlet/cli",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.16.0-alpha.1693852004525",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "cli of varlet",
|
|
6
6
|
"bin": {
|
|
@@ -67,8 +67,8 @@
|
|
|
67
67
|
"vite": "4.3.5",
|
|
68
68
|
"vue": "3.3.4",
|
|
69
69
|
"webfont": "^9.0.0",
|
|
70
|
-
"@varlet/
|
|
71
|
-
"@varlet/
|
|
70
|
+
"@varlet/vite-plugins": "2.16.0-alpha.1693852004525",
|
|
71
|
+
"@varlet/shared": "2.16.0-alpha.1693852004525"
|
|
72
72
|
},
|
|
73
73
|
"devDependencies": {
|
|
74
74
|
"@types/babel__core": "^7.20.1",
|
|
@@ -83,8 +83,9 @@
|
|
|
83
83
|
"@types/semver": "^7.3.9",
|
|
84
84
|
"@types/sharp": "0.31.1",
|
|
85
85
|
"rimraf": "^5.0.1",
|
|
86
|
-
"@varlet/icons": "2.
|
|
87
|
-
"@varlet/
|
|
86
|
+
"@varlet/icons": "2.16.0-alpha.1693852004525",
|
|
87
|
+
"@varlet/ui": "2.16.0-alpha.1693852004525",
|
|
88
|
+
"@varlet/touch-emulator": "2.16.0-alpha.1693852004525"
|
|
88
89
|
},
|
|
89
90
|
"peerDependencies": {
|
|
90
91
|
"@vue/runtime-core": "3.3.4",
|
|
@@ -97,8 +98,8 @@
|
|
|
97
98
|
"lodash-es": "^4.17.21",
|
|
98
99
|
"vue": "3.3.4",
|
|
99
100
|
"vue-router": "4.2.0",
|
|
100
|
-
"@varlet/icons": "2.
|
|
101
|
-
"@varlet/touch-emulator": "2.
|
|
101
|
+
"@varlet/icons": "2.16.0-alpha.1693852004525",
|
|
102
|
+
"@varlet/touch-emulator": "2.16.0-alpha.1693852004525"
|
|
102
103
|
},
|
|
103
104
|
"scripts": {
|
|
104
105
|
"dev": "tsc --watch",
|
package/site/mobile/App.vue
CHANGED
|
@@ -3,46 +3,47 @@
|
|
|
3
3
|
<header>
|
|
4
4
|
<var-app-bar class="app-bar" title-position="left" :title="bigCamelizeComponentName">
|
|
5
5
|
<template #left>
|
|
6
|
-
<var-button v-if="showBackIcon" text round @click="back" color="transparent" text-color="#fff">
|
|
6
|
+
<var-button v-if="showBackIcon" style="margin-right: 6px;" text round @click="back" color="transparent" text-color="#fff">
|
|
7
7
|
<var-icon name="chevron-left" class="arrow-left" style="margin-top: 1px"/>
|
|
8
8
|
</var-button>
|
|
9
9
|
<var-button
|
|
10
10
|
v-if="!showBackIcon && github"
|
|
11
|
-
style="margin-left: 2px"
|
|
11
|
+
style="margin-left: 2px; margin-right: 6px;"
|
|
12
12
|
text
|
|
13
13
|
round
|
|
14
|
-
@click="toGithub"
|
|
15
14
|
color="transparent"
|
|
16
15
|
text-color="#fff"
|
|
16
|
+
@click="toGithub"
|
|
17
17
|
>
|
|
18
|
-
<var-icon name="github" class="github" style="margin-top: 1px"/>
|
|
18
|
+
<var-icon name="github" class="github" style="margin-top: 1px;"/>
|
|
19
19
|
</var-button>
|
|
20
20
|
</template>
|
|
21
21
|
<template #right>
|
|
22
22
|
<var-button
|
|
23
|
+
v-if="darkMode"
|
|
23
24
|
text
|
|
24
25
|
round
|
|
25
26
|
color="transparent"
|
|
26
27
|
text-color="#fff"
|
|
27
28
|
:style="{
|
|
28
|
-
transform: languages ? 'translateX(
|
|
29
|
+
transform: languages ? 'translateX(-4px)' : 'translateX(-6px)',
|
|
29
30
|
}"
|
|
30
|
-
v-if="darkMode"
|
|
31
31
|
@click="toggleTheme"
|
|
32
32
|
>
|
|
33
33
|
<var-icon
|
|
34
34
|
class="theme"
|
|
35
35
|
color="#fff"
|
|
36
|
+
:size="24"
|
|
36
37
|
:name="currentTheme === 'lightTheme' ? 'white-balance-sunny' : 'weather-night'"
|
|
37
38
|
/>
|
|
38
39
|
</var-button>
|
|
39
40
|
<var-button
|
|
41
|
+
v-if="languages"
|
|
40
42
|
class="i18n-button"
|
|
41
43
|
text
|
|
42
44
|
color="transparent"
|
|
43
45
|
text-color="#fff"
|
|
44
46
|
@click.stop="showMenu = true"
|
|
45
|
-
v-if="languages"
|
|
46
47
|
>
|
|
47
48
|
<var-icon name="translate" class="i18n"/>
|
|
48
49
|
<var-icon name="chevron-down" class="arrow-down"/>
|
|
@@ -55,7 +56,7 @@
|
|
|
55
56
|
</div>
|
|
56
57
|
|
|
57
58
|
<transition name="site-menu">
|
|
58
|
-
<div class="settings var-
|
|
59
|
+
<div class="settings var-elevation--3" v-if="showMenu">
|
|
59
60
|
<var-cell
|
|
60
61
|
v-for="(value, key) in nonEmptyLanguages"
|
|
61
62
|
:key="key"
|
|
@@ -206,6 +207,19 @@ body {
|
|
|
206
207
|
transition: background-color 0.25s, color 0.25s;
|
|
207
208
|
}
|
|
208
209
|
|
|
210
|
+
::-webkit-scrollbar {
|
|
211
|
+
display: none;
|
|
212
|
+
width: 0;
|
|
213
|
+
background: transparent;
|
|
214
|
+
}
|
|
215
|
+
|
|
216
|
+
.app-type {
|
|
217
|
+
width: 100%;
|
|
218
|
+
padding: 15px 0;
|
|
219
|
+
color: var(--site-config-color-sub-text);
|
|
220
|
+
font-size: 14px;
|
|
221
|
+
}
|
|
222
|
+
|
|
209
223
|
header {
|
|
210
224
|
position: fixed;
|
|
211
225
|
z-index: 99;
|
|
@@ -213,12 +227,6 @@ header {
|
|
|
213
227
|
font-weight: bold;
|
|
214
228
|
}
|
|
215
229
|
|
|
216
|
-
::-webkit-scrollbar {
|
|
217
|
-
display: none;
|
|
218
|
-
width: 0;
|
|
219
|
-
background: transparent;
|
|
220
|
-
}
|
|
221
|
-
|
|
222
230
|
.site {
|
|
223
231
|
&-menu-enter-from,
|
|
224
232
|
&-menu-leave-to {
|
|
@@ -248,7 +256,7 @@ header {
|
|
|
248
256
|
.mobile-language-cell {
|
|
249
257
|
color: var(--site-config-color-text) !important;
|
|
250
258
|
background: var(--site-config-color-bar) !important;
|
|
251
|
-
cursor: pointer;
|
|
259
|
+
cursor: pointer !important;
|
|
252
260
|
|
|
253
261
|
&--active {
|
|
254
262
|
color: var(--site-config-color-mobile-language-active) !important;
|
|
@@ -278,13 +286,8 @@ header {
|
|
|
278
286
|
|
|
279
287
|
.i18n-button {
|
|
280
288
|
padding-right: 6px !important;
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
.app-type {
|
|
284
|
-
width: 100%;
|
|
285
|
-
padding: 15px 0;
|
|
286
|
-
color: var(--site-config-color-sub-text);
|
|
287
|
-
font-size: 14px;
|
|
289
|
+
margin-right: 4px;
|
|
290
|
+
padding-left: 12px !important;
|
|
288
291
|
}
|
|
289
292
|
|
|
290
293
|
.app-bar {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div class="logo">
|
|
2
|
+
<div class="varlet-logo">
|
|
3
3
|
<h1 class="varlet-home__title">
|
|
4
4
|
<img class="varlet-home__image" :src="logo" />
|
|
5
5
|
<span>{{ title }}</span>
|
|
@@ -19,12 +19,12 @@
|
|
|
19
19
|
</div>
|
|
20
20
|
</template>
|
|
21
21
|
|
|
22
|
-
<script lang=
|
|
22
|
+
<script lang="ts">
|
|
23
23
|
import config from '@config'
|
|
24
24
|
import { useRouter } from 'vue-router'
|
|
25
25
|
import { reactive, ref } from 'vue'
|
|
26
26
|
import { watchLang, watchPlatform } from '@varlet/cli/client'
|
|
27
|
-
import { inIframe, isPhone } from '
|
|
27
|
+
import { inIframe, isPhone } from '../utils'
|
|
28
28
|
|
|
29
29
|
export default {
|
|
30
30
|
name: 'AppHome',
|
|
@@ -34,7 +34,7 @@ export default {
|
|
|
34
34
|
const description = ref(config?.mobile?.title ?? {})
|
|
35
35
|
const menu = ref(config?.pc?.menu ?? [])
|
|
36
36
|
const configComponents = menu.value.filter((item: any) => item.type === 2)
|
|
37
|
-
const components = reactive(configComponents)
|
|
37
|
+
const components = reactive<any>(configComponents)
|
|
38
38
|
const lang = ref('zh-CN')
|
|
39
39
|
const platform = ref('mobile')
|
|
40
40
|
const router = useRouter()
|
|
@@ -75,8 +75,8 @@ export default {
|
|
|
75
75
|
}
|
|
76
76
|
</script>
|
|
77
77
|
|
|
78
|
-
<style
|
|
79
|
-
.logo {
|
|
78
|
+
<style lang="less">
|
|
79
|
+
.varlet-logo {
|
|
80
80
|
height: 100px;
|
|
81
81
|
padding-top: 30px;
|
|
82
82
|
margin-bottom: 20px;
|
package/site/mobile/main.ts
CHANGED
|
@@ -1,21 +1,15 @@
|
|
|
1
1
|
import routes from '@mobile-routes'
|
|
2
2
|
import config from '@config'
|
|
3
3
|
import App from './App.vue'
|
|
4
|
-
import '@varlet/
|
|
4
|
+
import Varlet from '@varlet/ui'
|
|
5
5
|
import { createApp } from 'vue'
|
|
6
6
|
import { createRouter, createWebHashHistory } from 'vue-router'
|
|
7
|
-
|
|
8
|
-
import Icon from '../components/icon'
|
|
9
|
-
import AppBar from './components/app-bar'
|
|
10
|
-
import Button from '../components/button'
|
|
11
|
-
import Cell from '../components/cell'
|
|
12
|
-
import Ripple from '../components/ripple'
|
|
13
|
-
import '../components/styles/common.less'
|
|
14
|
-
import '../components/styles/elevation.less'
|
|
15
|
-
|
|
16
7
|
import { get } from 'lodash-es'
|
|
17
8
|
import { inIframe, isPhone } from '../utils'
|
|
18
9
|
|
|
10
|
+
import '@varlet/touch-emulator'
|
|
11
|
+
import '@varlet/ui/es/style'
|
|
12
|
+
|
|
19
13
|
const redirect = get(config, 'mobile.redirect')
|
|
20
14
|
const defaultLanguage = get(config, 'defaultLanguage')
|
|
21
15
|
|
|
@@ -27,7 +21,7 @@ redirect &&
|
|
|
27
21
|
|
|
28
22
|
routes.push({
|
|
29
23
|
path: '/home',
|
|
30
|
-
component: () => import('./
|
|
24
|
+
component: () => import('./AppHome.vue')
|
|
31
25
|
})
|
|
32
26
|
|
|
33
27
|
const router = createRouter({
|
|
@@ -63,16 +57,7 @@ router.beforeEach((to: any) => {
|
|
|
63
57
|
}
|
|
64
58
|
})
|
|
65
59
|
|
|
66
|
-
// @ts-ignore
|
|
67
60
|
createApp(App)
|
|
68
61
|
.use(router)
|
|
69
|
-
|
|
70
|
-
.use(Icon)
|
|
71
|
-
// @ts-ignore
|
|
72
|
-
.use(AppBar)
|
|
73
|
-
// @ts-ignore
|
|
74
|
-
.use(Cell)
|
|
75
|
-
.use(Ripple)
|
|
76
|
-
// @ts-ignore
|
|
77
|
-
.use(Button)
|
|
62
|
+
.use(Varlet)
|
|
78
63
|
.mount('#app')
|
package/site/pc/App.vue
CHANGED
|
@@ -1,15 +1,11 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
2
|
import config from '@config'
|
|
3
|
-
import LogoAnimation from './components/LogoAnimation.vue'
|
|
4
3
|
import { defineComponent, onMounted, ref } from 'vue'
|
|
5
4
|
import { getPCLocationInfo } from '@varlet/cli/client'
|
|
6
5
|
import { isPhone } from '../utils'
|
|
7
6
|
import { get } from 'lodash-es'
|
|
8
7
|
|
|
9
8
|
export default defineComponent({
|
|
10
|
-
components: {
|
|
11
|
-
LogoAnimation
|
|
12
|
-
},
|
|
13
9
|
setup() {
|
|
14
10
|
const useMobile = ref(get(config, 'useMobile'))
|
|
15
11
|
const defaultLanguage = get(config, 'defaultLanguage')
|
|
@@ -30,7 +26,6 @@ export default defineComponent({
|
|
|
30
26
|
|
|
31
27
|
<template>
|
|
32
28
|
<router-view></router-view>
|
|
33
|
-
<logo-animation />
|
|
34
29
|
</template>
|
|
35
30
|
|
|
36
31
|
<style lang="less">
|