From b3fd50315bbf6b27fe927a8356f488e86b5c7cc8 Mon Sep 17 00:00:00 2001 From: Eduardo San Martin Morote Date: Thu, 11 Jul 2024 09:19:37 +0200 Subject: [PATCH] docs: animated logo (#2035) * docs: wip animated logo * docs: better perf * docs: idle state * docs: idle at start * docs: ok --- .../.vitepress/theme/components/PiniaLogo.vue | 263 ++++++++++-------- packages/docs/.vitepress/theme/index.ts | 3 + .../docs/api/pinia/functions/mapActions.md | 4 +- packages/docs/package.json | 3 +- pnpm-lock.yaml | 36 +++ 5 files changed, 184 insertions(+), 125 deletions(-) diff --git a/packages/docs/.vitepress/theme/components/PiniaLogo.vue b/packages/docs/.vitepress/theme/components/PiniaLogo.vue index 99c200ffbe..443bc85294 100644 --- a/packages/docs/.vitepress/theme/components/PiniaLogo.vue +++ b/packages/docs/.vitepress/theme/components/PiniaLogo.vue @@ -1,10 +1,11 @@ - - - + + + + + - - + + + + @@ -193,23 +198,100 @@ + + + + + + + - - diff --git a/packages/docs/.vitepress/theme/index.ts b/packages/docs/.vitepress/theme/index.ts index 374d96f9a2..adb16c84a7 100644 --- a/packages/docs/.vitepress/theme/index.ts +++ b/packages/docs/.vitepress/theme/index.ts @@ -4,6 +4,8 @@ import DefaultTheme from 'vitepress/theme' import AsideSponsors from './components/AsideSponsors.vue' // import AsideSponsors from './components/AsideSponsors.vue' import TranslationStatus from 'vitepress-translation-helper/ui/TranslationStatus.vue' +// import HomeSponsors from './components/HomeSponsors.vue' +import PiniaLogo from './components/PiniaLogo.vue' import './styles/vars.css' import './styles/playground-links.css' import VueSchoolLink from './components/VueSchoolLink.vue' @@ -20,6 +22,7 @@ const theme: Theme = { ...DefaultTheme, Layout() { return h(DefaultTheme.Layout, null, { + 'home-hero-image': () => h('div', { class: 'image-src' }, h(PiniaLogo)), // 'home-features-after': () => h(HomeSponsors), 'aside-ads-before': () => h(AsideSponsors), // 'layout-top': () => h(VuejsdeConfBanner), diff --git a/packages/docs/api/pinia/functions/mapActions.md b/packages/docs/api/pinia/functions/mapActions.md index 66dc9a40da..409c503bd7 100644 --- a/packages/docs/api/pinia/functions/mapActions.md +++ b/packages/docs/api/pinia/functions/mapActions.md @@ -64,11 +64,11 @@ export default { methods: { // other methods properties // useCounterStore has two actions named `increment` and `setCount` - ...mapActions(useCounterStore, { moar: 'increment', setIt: 'setCount' }) + ...mapActions(useCounterStore, { more: 'increment', setIt: 'setCount' }) }, created() { - this.moar() + this.more() this.setIt(2) } } diff --git a/packages/docs/package.json b/packages/docs/package.json index 5cdec393cc..0145d3ba3f 100644 --- a/packages/docs/package.json +++ b/packages/docs/package.json @@ -17,6 +17,7 @@ "@vueuse/core": "^10.11.0", "pinia": "workspace:*", "vitepress": "1.2.3", - "vitepress-translation-helper": "^0.2.1" + "vitepress-translation-helper": "^0.2.1", + "vue-use-spring": "^0.1.1" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b0d11da35e..9d80cf366d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -126,6 +126,9 @@ importers: vitepress-translation-helper: specifier: ^0.2.1 version: 0.2.1(vitepress@1.2.3(@algolia/client-search@4.24.0)(@types/node@20.14.9)(@vue/composition-api@1.7.2(vue@3.4.30(typescript@5.5.2)))(postcss@8.4.38)(search-insights@2.14.0)(terser@5.31.1)(typescript@5.5.2))(vue@3.4.30(typescript@5.5.2)) + vue-use-spring: + specifier: ^0.1.1 + version: 0.1.1(@vue/composition-api@1.7.2(vue@3.4.30(typescript@5.5.2)))(vue@3.4.30(typescript@5.5.2)) packages/nuxt: dependencies: @@ -5410,6 +5413,17 @@ packages: vue-component-type-helpers@2.0.22: resolution: {integrity: sha512-gPr2Ba7efUwy/Vfbuf735bHSVdN4ycoZUCHfypkI33M9DUH+ieRblLLVM2eImccFYaWNWwEzURx02EgoXDBmaQ==} + vue-demi@0.11.4: + resolution: {integrity: sha512-/3xFwzSykLW2HiiLie43a+FFgNOcokbBJ+fzvFXd0r2T8MYohqvphUyDQ8lbAwzQ3Dlcrb1c9ykifGkhSIAk6A==} + engines: {node: '>=12'} + hasBin: true + peerDependencies: + '@vue/composition-api': ^1.0.0-rc.1 + vue: ^3.0.0-0 || ^2.6.0 + peerDependenciesMeta: + '@vue/composition-api': + optional: true + vue-demi@0.14.8: resolution: {integrity: sha512-Uuqnk9YE9SsWeReYqK2alDI5YzciATE0r2SkA6iMAtuXvNTMNACJLJEXNXaEy94ECuBe4Sk6RzRU80kjdbIo1Q==} engines: {node: '>=12'} @@ -5447,6 +5461,15 @@ packages: peerDependencies: typescript: '*' + vue-use-spring@0.1.1: + resolution: {integrity: sha512-SNzVt6aLbcJvYz5DDUbVIo2+SdipYpPQDXWtMExD420LQMWCHz8eNbZjdCIFWsUtPGexm0DGYZiVInFjr0ILsA==} + peerDependencies: + '@vue/composition-api': ^1.0.0-rc.1 + vue: ^2.6.12 || ^3.0.0 + peerDependenciesMeta: + '@vue/composition-api': + optional: true + vue@3.4.30: resolution: {integrity: sha512-NcxtKCwkdf1zPsr7Y8+QlDBCGqxvjLXF2EX+yi76rV5rrz90Y6gK1cq0olIhdWGgrlhs9ElHuhi9t3+W5sG5Xw==} peerDependencies: @@ -11426,6 +11449,12 @@ snapshots: vue-component-type-helpers@2.0.22: {} + vue-demi@0.11.4(@vue/composition-api@1.7.2(vue@3.4.30(typescript@5.5.2)))(vue@3.4.30(typescript@5.5.2)): + dependencies: + vue: 3.4.30(typescript@5.5.2) + optionalDependencies: + '@vue/composition-api': 1.7.2(vue@3.4.30(typescript@5.5.2)) + vue-demi@0.14.8(@vue/composition-api@1.7.2(vue@3.4.30(typescript@5.5.2)))(vue@3.4.30(typescript@5.5.2)): dependencies: vue: 3.4.30(typescript@5.5.2) @@ -11458,6 +11487,13 @@ snapshots: semver: 7.6.2 typescript: 5.5.2 + vue-use-spring@0.1.1(@vue/composition-api@1.7.2(vue@3.4.30(typescript@5.5.2)))(vue@3.4.30(typescript@5.5.2)): + dependencies: + vue: 3.4.30(typescript@5.5.2) + vue-demi: 0.11.4(@vue/composition-api@1.7.2(vue@3.4.30(typescript@5.5.2)))(vue@3.4.30(typescript@5.5.2)) + optionalDependencies: + '@vue/composition-api': 1.7.2(vue@3.4.30(typescript@5.5.2)) + vue@3.4.30(typescript@5.5.2): dependencies: '@vue/compiler-dom': 3.4.30