From c6bf1469763565bf6aba2c7a0a51dfd8b141d1c3 Mon Sep 17 00:00:00 2001 From: Florent Delerue Date: Thu, 5 Jan 2023 10:28:28 +0100 Subject: [PATCH] docs: refactor cards (#9935) * refactor: cards * refactor: update image props * docs(version): update to 0.2.5 --- docs/content/0.index.md | 90 +++++++------ docs/content/1.docs/0.index.md | 118 ++++++++++-------- .../1.getting-started/1.introduction.md | 96 ++++++++++---- .../1.docs/5.community/1.nuxt-community.md | 116 ++++++++++++----- docs/content/2.modules.md | 2 +- docs/content/3.showcase.md | 2 +- docs/content/4.support/1.solutions.md | 20 ++- docs/content/4.support/2.agencies/1.index.md | 2 +- docs/content/4.support/3.us.md | 2 +- docs/content/4.support/4.jobs.md | 2 +- docs/content/design-kit.md | 2 +- docs/package.json | 2 +- ...dx-batteries.svg => dx-batteries-dark.svg} | 0 ...-effortless.svg => dx-effortless-dark.svg} | 0 ...and-play.svg => dx-plug-and-play-dark.svg} | 0 ...t.png => needs-community-support-dark.png} | Bin ...-expert.png => needs-nuxt-expert-dark.png} | Bin ...ncy.png => needs-official-agency-dark.png} | Bin .../home/{ux-fast.svg => ux-fast-dark.svg} | 0 .../{ux-hybrid.svg => ux-hybrid-dark.svg} | 0 .../home/{ux-seo.svg => ux-seo-dark.svg} | 0 .../{agency.webp => agency-dark.webp} | Bin .../{community.webp => community-dark.webp} | Bin .../{experts.webp => experts-dark.webp} | Bin docs/yarn.lock | 10 +- 25 files changed, 299 insertions(+), 165 deletions(-) rename docs/public/assets/home/{dx-batteries.svg => dx-batteries-dark.svg} (100%) rename docs/public/assets/home/{dx-effortless.svg => dx-effortless-dark.svg} (100%) rename docs/public/assets/home/{dx-plug-and-play.svg => dx-plug-and-play-dark.svg} (100%) rename docs/public/assets/home/{needs-community-support.png => needs-community-support-dark.png} (100%) rename docs/public/assets/home/{needs-nuxt-expert.png => needs-nuxt-expert-dark.png} (100%) rename docs/public/assets/home/{needs-official-agency.png => needs-official-agency-dark.png} (100%) rename docs/public/assets/home/{ux-fast.svg => ux-fast-dark.svg} (100%) rename docs/public/assets/home/{ux-hybrid.svg => ux-hybrid-dark.svg} (100%) rename docs/public/assets/home/{ux-seo.svg => ux-seo-dark.svg} (100%) rename docs/public/assets/support/solutions/{agency.webp => agency-dark.webp} (100%) rename docs/public/assets/support/solutions/{community.webp => community-dark.webp} (100%) rename docs/public/assets/support/solutions/{experts.webp => experts-dark.webp} (100%) diff --git a/docs/content/0.index.md b/docs/content/0.index.md index 04dd010a9b..f3364a680f 100644 --- a/docs/content/0.index.md +++ b/docs/content/0.index.md @@ -32,22 +32,26 @@ Deliver an optimized [User Experience]{.text-transparent .bg-clip-text .bg-gradi #description How a user interacts with and experiences your website will determine your impact. Utility, ease of use, and efficiency are key. **Nuxt is built with a set of features that make this possible.** #cards - :::home-card-item + :::card-item --- image: - light: 'ux-fast-light.svg' - dark: 'ux-fast.svg' + path: '/assets/home/ux-fast' + width: '341' + height: '164' + format: 'svg' --- #title Fast and Furious #description Optimized with code-splitting, tree-shaking, optimized cold-start, link prefetching, payload extraction, just to name a few. Fast by default so you can focus on building. ::: - :::home-card-item + :::card-item --- image: - light: 'ux-hybrid-light.svg' - dark: 'ux-hybrid.svg' + path: '/assets/home/ux-hybrid' + width: '341' + height: '164' + format: 'svg' --- #title On-demand Rendering @@ -55,11 +59,13 @@ How a user interacts with and experiences your website will determine your impac Decide what rendering strategy at the route level: SSR, SSG, CSR, ISR, ESR, SWR. Build any kind of website or web application with optimized performance in mind. ::: - :::home-card-item + :::card-item --- image: - light: 'ux-seo-light.svg' - dark: 'ux-seo.svg' + path: '/assets/home/ux-seo' + width: '341' + height: '164' + format: 'svg' --- #title SEO & Web Vitals @@ -97,33 +103,39 @@ Discover a new [Developer Experience]{.text-transparent .bg-clip-text .bg-gradie #description Developers deserve solutions as well designed as non-technical people. Our focus is to empower Vue developers to ship great softwares with confidence. #cards - :::home-card-item + :::card-item --- image: - light: 'dx-plug-and-play-light.svg' - dark: 'dx-plug-and-play.svg' + path: '/assets/home/dx-plug-and-play' + width: '341' + height: '164' + format: 'svg' --- #title Plug & Play #description Unlock features by creating folders and files with the [most intuitive directory structure]{.font-semibold} made for developers and teams. ::: - :::home-card-item + :::card-item --- image: - light: 'dx-effortless-light.svg' - dark: dx-effortless.svg + path: '/assets/home/dx-effortless' + width: '341' + height: '164' + format: 'svg' --- #title Automation #description Repetitive tasks are [automated]{.font-semibold}: auto-imports, code-splitting, typings, minification, bundling for production. and more. ::: - :::home-card-item + :::card-item --- image: - light: 'dx-batteries-light.svg' - dark: 'dx-batteries.svg' + path: '/assets/home/dx-batteries' + width: '341' + height: '164' + format: 'svg' --- #title Batteries Included @@ -210,40 +222,44 @@ A community of [Web builders]{.text-transparent .bg-clip-text .bg-gradient-to-r #description Nuxt is composed of web builders all over the world who like to craft beautiful user experiences with Vue.js. #cards - :::home-card-item + :::card-item --- icon: 'fa-brands:npm' to: 'https://www.npmjs.com/package/nuxt' + titleClass: 'text-5xl font-semibold u-text-gray-900' --- #title 56M #description npm downloads ::: - :::home-card-item + :::card-item --- icon: 'fa-brands:discord' to: 'https://discord.com/invite/ps2h6QT' + titleClass: 'text-5xl font-semibold u-text-gray-900' --- #title 20k #description Discord members ::: - :::home-card-item + :::card-item --- icon: 'fa-brands:github' to: 'https://github.com/nuxt' + titleClass: 'text-5xl font-semibold u-text-gray-900' --- #title 55k #description GitHub stars ::: - :::home-card-item + :::card-item --- icon: 'fa-brands:twitter' to: 'https://twitter.com/nuxt_js' + titleClass: 'text-5xl font-semibold u-text-gray-900' --- #title 76k @@ -265,14 +281,14 @@ A solution to cover [all your needs]{.text-transparent .bg-clip-text .bg-gradien #description Developers deserve solutions as well designed as non-technical people. Our focus is to empower Vue developers to ship great softwares with confidence. #cards - :::home-card-item + :::card-item --- headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: 'needs-official-agency-light.png' - dark: 'needs-official-agency.png' - imageHeight: '58' - imageWidth: '52' + path: '/assets/home/needs-official-agency' + width: '52' + height: '58' + format: 'png' contentClass: 'gap-y-2' to: '/support/agencies' --- @@ -281,14 +297,14 @@ Developers deserve solutions as well designed as non-technical people. Our focus #description A carefully built network of trusted agencies from all over the world! ::: - :::home-card-item + :::card-item --- headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: 'needs-nuxt-expert-light.png' - dark: 'needs-nuxt-expert.png' - imageHeight: '58' - imageWidth: '52' + path: '/assets/home/needs-nuxt-expert' + width: '52' + height: '58' + format: 'png' contentClass: 'gap-y-2' to: '/support/solutions' --- @@ -297,15 +313,15 @@ Developers deserve solutions as well designed as non-technical people. Our focus #description A network of freelance from all over the world, certified by the NuxtLabs team ! ::: - :::home-card-item + :::card-item --- headerClass: 'justify-start px-4 pt-4 sm:px-6' contentClass: 'gap-y-2' image: - light: 'needs-community-support-light.png' - dark: 'needs-community-support.png' - imageHeight: '58' - imageWidth: '52' + path: '/assets/home/needs-community-support' + width: '52' + height: '58' + format: 'png' to: '/support/solutions' --- #title diff --git a/docs/content/1.docs/0.index.md b/docs/content/1.docs/0.index.md index 660e3a863f..addb84c4c1 100644 --- a/docs/content/1.docs/0.index.md +++ b/docs/content/1.docs/0.index.md @@ -12,26 +12,27 @@ Nuxt Docs Nuxt is an open-source framework under MIT license for building modern and performant web applications that can be deployed on any platform running JavaScript. :: -::docs-card +::card-item --- -component: 'div' +is: 'div' +gradientBorder: false descriptionClass: 'w-full sm:w-2/3' -roundedClass: 'rounded-xl' -image: +backgroundImage: path: '/assets/docs/getting-started/views/getting-started' width: '100' height: '100' + format: 'png' buttons: - label: 'Get started' - size: 'xl' + size: 'sm' variant: 'primary-gradient' to: '/docs/getting-started/introduction' - label: 'Explore Examples' - size: 'xl' + size: 'sm' variant: 'secondary' to: '/docs/examples/essentials/hello-world' --- -#extraTitle +#title Getting Started #description Start by learning Nuxt core features, from installation to deployment. @@ -45,15 +46,16 @@ Guide #description From an idea to a masterpiece, guides take you on the path to becoming a Nuxter. #extra - ::docs-landing-list - :::docs-landing-card + ::card-list + :::card-item --- + gradientBorder: false headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: '/assets/docs/getting-started/views/docs-landing/key-concepts-light.svg' - dark: '/assets/docs/getting-started/views/docs-landing/key-concepts-dark.svg' - imageHeight: '58' - imageWidth: '52' + path: '/assets/docs/getting-started/views/docs-landing/key-concepts' + width: '52' + height: '58' + format: 'svg' contentClass: 'gap-y-2' to: '/docs/guide/concepts/auto-imports' --- @@ -62,14 +64,15 @@ From an idea to a masterpiece, guides take you on the path to becoming a Nuxter. #description Get an overview of the concepts that drive the Nuxt experience. ::: - :::docs-landing-card + :::card-item --- + gradientBorder: false headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: '/assets/docs/getting-started/views/docs-landing/directory-structure-light.svg' - dark: '/assets/docs/getting-started/views/docs-landing/directory-structure-dark.svg' - imageHeight: '58' - imageWidth: '52' + path: '/assets/docs/getting-started/views/docs-landing/directory-structure' + width: '52' + height: '58' + format: 'svg' contentClass: 'gap-y-2' to: '/docs/guide/directory-structure/nuxt' --- @@ -78,14 +81,15 @@ From an idea to a masterpiece, guides take you on the path to becoming a Nuxter. #description Navigate Nuxt directory structure with this handy guide. ::: - :::docs-landing-card + :::card-item --- + gradientBorder: false headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: '/assets/docs/getting-started/views/docs-landing/going-further-light.svg' - dark: '/assets/docs/getting-started/views/docs-landing/going-further-dark.svg' - imageHeight: '58' - imageWidth: '52' + path: '/assets/docs/getting-started/views/docs-landing/going-further' + width: '52' + height: '58' + format: 'svg' contentClass: 'gap-y-2' to: '/docs/guide/going-further/internals' --- @@ -103,15 +107,16 @@ API #description Every Nuxt components, composables and utilities, in details. #extra - ::docs-landing-list - :::docs-landing-card + ::card-list + :::card-item --- + gradientBorder: false headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: '/assets/docs/getting-started/views/docs-landing/composables-light.svg' - dark: '/assets/docs/getting-started/views/docs-landing/composables-dark.svg' - imageHeight: '58' - imageWidth: '52' + path: '/assets/docs/getting-started/views/docs-landing/composables' + width: '52' + height: '58' + format: 'svg' contentClass: 'gap-y-2' to: '/docs/api/composables/use-app-config' --- @@ -120,14 +125,15 @@ Every Nuxt components, composables and utilities, in details. #description From data fetching to error handling, get familiar with Nuxt built-in composables. ::: - :::docs-landing-card + :::card-item --- + gradientBorder: false headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: '/assets/docs/getting-started/views/docs-landing/components-light.svg' - dark: '/assets/docs/getting-started/views/docs-landing/components-dark.svg' - imageHeight: '58' - imageWidth: '52' + path: '/assets/docs/getting-started/views/docs-landing/components' + width: '52' + height: '58' + format: 'svg' contentClass: 'gap-y-2' to: '/docs/api/components/client-only' --- @@ -136,14 +142,15 @@ Every Nuxt components, composables and utilities, in details. #description Nuxt components, auto-imported and ready to use in your application. ::: - :::docs-landing-card + :::card-item --- + gradientBorder: false headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: '/assets/docs/getting-started/views/docs-landing/utils-light.svg' - dark: '/assets/docs/getting-started/views/docs-landing/utils-dark.svg' - imageHeight: '58' - imageWidth: '52' + path: '/assets/docs/getting-started/views/docs-landing/utils' + width: '52' + height: '58' + format: 'svg' contentClass: 'gap-y-2' to: '/docs/api/utils/dollarfetch' --- @@ -152,14 +159,15 @@ Every Nuxt components, composables and utilities, in details. #description Use utility functions to get fine-grained control over your app behavior. ::: - :::docs-landing-card + :::card-item --- + gradientBorder: false headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: '/assets/docs/getting-started/views/docs-landing/advanced-light.svg' - dark: '/assets/docs/getting-started/views/docs-landing/advanced-dark.svg' - imageHeight: '58' - imageWidth: '52' + path: '/assets/docs/getting-started/views/docs-landing/advanced' + width: '52' + height: '58' + format: 'svg' contentClass: 'gap-y-2' to: '/docs/api/advanced/hooks' --- @@ -168,14 +176,15 @@ Every Nuxt components, composables and utilities, in details. #description Learn about lifecycle hooks and Kit utilities in the advanced section. ::: - :::docs-landing-card + :::card-item --- + gradientBorder: false headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: '/assets/docs/getting-started/views/docs-landing/commands-light.svg' - dark: '/assets/docs/getting-started/views/docs-landing/commands-dark.svg' - imageHeight: '58' - imageWidth: '52' + path: '/assets/docs/getting-started/views/docs-landing/commands' + width: '52' + height: '58' + format: 'svg' contentClass: 'gap-y-2' to: '/docs/api/commands/add' --- @@ -184,14 +193,15 @@ Every Nuxt components, composables and utilities, in details. #description Meet Nuxi, Nuxt 3 command-line tool. The essential companion in your journey. ::: - :::docs-landing-card + :::card-item --- + gradientBorder: false headerClass: 'justify-start px-4 pt-4 sm:px-6' image: - light: '/assets/docs/getting-started/views/docs-landing/configuration-light.svg' - dark: '/assets/docs/getting-started/views/docs-landing/configuration-dark.svg' - imageHeight: '58' - imageWidth: '52' + path: '/assets/docs/getting-started/views/docs-landing/configuration' + width: '52' + height: '58' + format: 'svg' contentClass: 'gap-y-2' to: '/docs/api/configuration/nuxt-config' --- diff --git a/docs/content/1.docs/1.getting-started/1.introduction.md b/docs/content/1.docs/1.getting-started/1.introduction.md index 22963a4795..2b248448f7 100644 --- a/docs/content/1.docs/1.getting-started/1.introduction.md +++ b/docs/content/1.docs/1.getting-started/1.introduction.md @@ -10,47 +10,86 @@ image: path: '/assets/docs/getting-started/views/hero' width: '129' height: '143' + format: 'png' --- #title Introduction #description -Nuxt provides both frontend and backend functionality so you can focus on what matters: Creating your web application. +Nuxt provides both frontend and backend functionality so you can focus on what matters: Creating your web application. :: ## What is Nuxt? To understand what Nuxt is, we need to understand what we need in order to create a modern application: -::docs-card-list - ::docs-card - #extraTitle +::card-list +--- +cardListClass: 'grid grid-cols-1 gap-y-2' +--- + ::card-item + --- + gradientBorder: false + contentClass: 'gap-y-2' + bodyClass: 'p-4' + roundedClass: 'rounded-sm' + titleClass: 'text-base font-semibold u-text-gray-900' + --- + #title JavaScript framework #description A JavaScript framework to bring reactivity and web components, we chose Vue.js. :: - ::docs-card - #extraTitle + ::card-item + --- + gradientBorder: false + contentClass: 'gap-y-2' + bodyClass: 'p-4' + roundedClass: 'rounded-sm' + titleClass: 'text-base font-semibold u-text-gray-900' + --- + #title Webpack and Vite #description A bundler to support hot module replacement in development and bundle your code for production, we support both [webpack 5](https://webpack.js.org/) and [Vite](https://vitejs.dev/). :: - ::docs-card - #extraTitle + ::card-item + --- + gradientBorder: false + contentClass: 'gap-y-2' + bodyClass: 'p-4' + roundedClass: 'rounded-sm' + titleClass: 'text-base font-semibold u-text-gray-900' + --- + #title Latest JavaScript syntax #description A transpiler to write the latest JavaScript syntax while supporting legacy browsers, we use [esbuild](https://esbuild.github.io) for that. :: - ::docs-card - #extraTitle + ::card-item + --- + gradientBorder: false + contentClass: 'gap-y-2' + bodyClass: 'p-4' + roundedClass: 'rounded-sm' + titleClass: 'text-base font-semibold u-text-gray-900' + --- + #title Server side #description A server for serving your application in development, but also to support [server-side rendering](https://vuejs.org/api/ssr.html#server-side-rendering-api) or API routes, Nuxt uses [h3](https://github.com/unjs/h3) for deployment versatility such as serverless, workers, Node.js and unmatched performance. :: - ::docs-card - #extraTitle + ::card-item + --- + gradientBorder: false + contentClass: 'gap-y-2' + bodyClass: 'p-4' + roundedClass: 'rounded-sm' + titleClass: 'text-base font-semibold u-text-gray-900' + --- + #title Routing library #description A routing library to handle client-side navigation, we chose [vue-router](https://router.vuejs.org/). @@ -139,13 +178,19 @@ Nuxt is composed of different [core packages](https://github.com/nuxt/framework/ We recommend reading each concept to have a full vision of Nuxt capabilities and the scope of each package. -::docs-card-list - ::docs-card +::card-list +--- +cardListClass: 'grid grid-cols-1 gap-y-4' +--- + :::card-item --- - image: + gradientBorder: false + backgroundImage: path: '/assets/docs/getting-started/views/are-you-nuxt' width: '72px' height: '92px' + format: 'png' + titleClass: 'text-5xl font-semibold u-text-gray-900 pb-2' descriptionClass: 'md:mr-[64px] w-[90%]' --- #title @@ -158,19 +203,18 @@ We recommend reading each concept to have a full vision of Nuxt capabilities and

Ready to try? Head over to the [Installation section](/docs/getting-started/installation). + ::: - :: - - ::docs-landing-card{.mb-8} + :::card-item --- - image: - dark: '/assets/docs/getting-started/views/contribute-dark.png' - light: '/assets/docs/getting-started/views/contribute-light.png' - imageWidth: '72' - imageHeight: '92' - fontSizeClass: 'text-2xl' + gradientBorder: false + backgroundImage: + path: '/assets/docs/getting-started/views/contribute' + width: '72' + height: '92' + format: 'png' + titleClass: 'text-2xl u-text-gray-900 font-semibold' descriptionClass: 'md:mr-[64px]' - imageClass: "right-0 bottom-0 absolute" --- #title Contribute @@ -178,5 +222,5 @@ We recommend reading each concept to have a full vision of Nuxt capabilities and Do you want to get involved in the evolution of Nuxt?
Follow the [contribution guide](/docs/community/contribution). - :: + ::: :: diff --git a/docs/content/1.docs/5.community/1.nuxt-community.md b/docs/content/1.docs/5.community/1.nuxt-community.md index 179abdcf42..d0e82cfa23 100644 --- a/docs/content/1.docs/5.community/1.nuxt-community.md +++ b/docs/content/1.docs/5.community/1.nuxt-community.md @@ -10,6 +10,7 @@ image: path: '/assets/docs/getting-started/nuxt-community/nuxt-community' width: '437' height: '236' + format: 'png' --- #title Nuxt Community @@ -23,50 +24,75 @@ The journey of an [Open Source Project]{.text-transparent .bg-clip-text .bg-grad #description The development of Nuxt and its ecosystem is led by an international team. Our committed team and community work every day to move Nuxt forward. #extra - ::docs-card{.dark:bg-gray-900} + ::docs-community-journey-section{.dark:bg-gray-900} --- fontSizeClass: 'text-2xl' --- #extraTitle Since the creation of Nuxt 3 - ::stat-card-list + ::card-list --- - gridClass: 'lg:grid-cols-4' - backgroundImg: + cardListClass: 'grid grid-cols-1 gap-1 sm:gap-8 sm:grid-cols-2 lg:grid-cols-4 border-gray-200 dark:border-gray-800 rounded-xl' + backgroundImage: path: '/assets/docs/getting-started/nuxt-community/map-nuxters' - width: "800" - height: "" + width: '582' + height: '187' + format: 'png' --- - :::stat-card-item + :::card-item --- - descriptionClass: 'text-lg font-medium' + contentClass: '' + ringClass: '' + gradientBorder: false + titleClass: 'text-3xl font-semibold sm:text-5xl u-text-gray-900 mb-2 mt-2' + descriptionClass: 'u-text-gray-500 text-lg font-medium' + bodyClass: 'p-2.5 sm:p-4' + backgroundClass: 'bg-transparent' --- #title 50M #description npm downloads ::: - :::stat-card-item + :::card-item --- - descriptionClass: 'text-lg font-medium' + contentClass: '' + ringClass: '' + gradientBorder: false + titleClass: 'text-3xl font-semibold sm:text-5xl u-text-gray-900 mb-2 mt-2' + descriptionClass: 'u-text-gray-500 text-lg font-medium' + bodyClass: 'p-2.5 sm:p-4' + backgroundClass: 'bg-transparent' --- #title 10,6K #description Stars ::: - :::stat-card-item + :::card-item --- - descriptionClass: 'text-lg font-medium' + contentClass: '' + ringClass: '' + gradientBorder: false + titleClass: 'text-3xl font-semibold sm:text-5xl u-text-gray-900 mb-2 mt-2' + descriptionClass: 'u-text-gray-500 text-lg font-medium' + bodyClass: 'p-2.5 sm:p-4' + backgroundClass: 'bg-transparent' --- #title 330 #description Contributors ::: - :::stat-card-item + :::card-item --- - descriptionClass: 'text-lg font-medium' + contentClass: '' + ringClass: '' + gradientBorder: false + titleClass: 'text-3xl font-semibold sm:text-5xl u-text-gray-900 mb-2 mt-2' + descriptionClass: 'u-text-gray-500 text-lg font-medium' + bodyClass: 'p-2.5 sm:p-4' + backgroundClass: 'bg-transparent' --- #title 998 @@ -83,7 +109,6 @@ From users to [Contributors]{.text-transparent .bg-clip-text .bg-gradient-to-r . #description From contributors to advocates, the community is made of members with different horizons and skills. We are happy to see new members every day and encourage anyone to help in any way (answering questions, giving a talk, creating modules and contributing to the core). #extra - ::contributors-card #title Sharing is caring @@ -114,59 +139,86 @@ Join the [journey]{.text-transparent .bg-clip-text .bg-gradient-to-r .from-green #description From user to contributor, these guides will help you get the best out of Nuxt. #extra - ::journey-card-list - ::docs-card + ::card-list + --- + cardListClass: 'grid grid-cols-1 pt-6 gap-y-4 sm:gap-y-0 sm:grid-cols-2 border-gray-200 dark:border-gray-800 rounded-lg overflow-hidden' + --- + ::card-item --- + backgroundClass: 'border dark:border-gray-700' + roundedClass: 'sm:rounded-r-none sm:rounded-br-none sm:rounded-tl-lg' + ringClass: 'ring-0' + gradientBorder: false descriptionClass: 'w-full sm:w-2/3' - roundedClass: 'rounded-t-lg sm:rounded-tl-lg sm:rounded-tr-none' - image: + backgroundImageClass: 'hidden sm:block absolute bottom-0 right-0' + backgroundImage: path: '/assets/docs/getting-started/nuxt-community/community-contribute' width: '88' height: '88' + format: 'png' + titleClass: 'text-base font-semibold u-text-gray-900' --- - #extraTitle + #title [How to contribute?](/docs/community/contribution) #description Nuxt is a community project - and so we love contributions of all kinds! ❤️ :: - ::docs-card + ::card-item --- + backgroundClass: 'border dark:border-gray-700' + roundedClass: 'sm:rounded-l-none sm:rounded-br-none sm:rounded-tr-lg' + ringClass: 'ring-0' + gradientBorder: false descriptionClass: 'w-full sm:w-2/3' - roundedClass: 'sm:rounded-tr-lg' - image: + backgroundImageClass: 'hidden sm:block absolute bottom-0 right-0' + backgroundImage: path: '/assets/docs/getting-started/nuxt-community/roadmap' width: '88' height: '88' + format: 'png' + titleClass: 'text-base font-semibold u-text-gray-900' --- - #extraTitle + #title [Discover our roadmap](/docs/community/roadmap) #description Nuxt is constantly evolving, with new features and modules being added all the time. :: - ::docs-card + ::card-item --- + backgroundClass: 'border dark:border-gray-700' + ringClass: 'ring-0' + roundedClass: 'sm:rounded-tl-none sm:rounded-r-none sm:rounded-bl-lg' + gradientBorder: false descriptionClass: 'w-full sm:w-2/3' - roundedClass: 'sm:rounded-bl-lg' - image: + backgroundImageClass: 'hidden sm:block absolute bottom-0 right-0' + backgroundImage: path: '/assets/docs/getting-started/nuxt-community/bugs' width: '88' height: '88' + format: 'png' + titleClass: 'text-base font-semibold u-text-gray-900' --- - #extraTitle + #title [Reporting Bugs](/docs/community/reporting-bugs) #description One of the most valuable roles in open source is taking the time to report bugs helpfully. :: - ::docs-card + ::card-item --- + backgroundClass: 'border dark:border-gray-700' + ringClass: 'ring-0' + roundedClass: 'sm:rounded-l-none sm:rounded-br-lg sm:rounded-tr-none' + gradientBorder: false descriptionClass: 'w-full sm:w-2/3' - roundedClass: 'rounded-b-lg sm:rounded-br-lg sm:rounded-bl-none' - image: + backgroundImageClass: 'hidden sm:block absolute bottom-0 right-0' + backgroundImage: path: '/assets/docs/getting-started/nuxt-community/help' width: '88' height: '88' + format: 'png' + titleClass: 'text-base font-semibold u-text-gray-900' --- - #extraTitle + #title [Getting Help](/docs/community/getting-help) #description We're a friendly community of developers and we'd love to help you! diff --git a/docs/content/2.modules.md b/docs/content/2.modules.md index dcadc9cbe3..3a0a7abd51 100644 --- a/docs/content/2.modules.md +++ b/docs/content/2.modules.md @@ -8,7 +8,7 @@ image: '/socials/modules.jpg' ::page-hero --- image: - src: '/assets/modules/hero' + path: '/assets/modules/hero' format: 'webp' height: '216' width: '400' diff --git a/docs/content/3.showcase.md b/docs/content/3.showcase.md index 7df080ef83..df0c07f9d8 100644 --- a/docs/content/3.showcase.md +++ b/docs/content/3.showcase.md @@ -8,7 +8,7 @@ image: '/socials/showcase.jpg' ::page-hero --- image: - src: '/assets/showcase/hero' + path: '/assets/showcase/hero' format: 'webp' height: '216' width: '400' diff --git a/docs/content/4.support/1.solutions.md b/docs/content/4.support/1.solutions.md index 045fe847e9..134e902a15 100644 --- a/docs/content/4.support/1.solutions.md +++ b/docs/content/4.support/1.solutions.md @@ -7,7 +7,7 @@ image: '/socials/support.jpg' ::page-hero --- image: - src: '/assets/support/solutions/hero' + path: '/assets/support/solutions/hero' format: 'webp' height: '216' width: '400' @@ -20,7 +20,11 @@ Discover the different support offers to answer your questions, get an audit, co ::support-section --- -image: 'agency' +image: + path: 'agency' + width: '73' + height: '81' + format: 'webp' to: '/support/agencies' --- #title @@ -36,7 +40,11 @@ If you have any question, we will gladly help you refine your needs and help you ::support-section --- -image: 'experts' +image: + path: 'experts' + width: '73' + height: '81' + format: 'webp' --- #title Nuxt Experts @@ -58,7 +66,11 @@ They act as an external workforce for Nuxtlabs and are qualified to take on any ::support-section --- -image: 'community' +image: + path: 'community' + width: '73' + height: '81' + format: 'webp' --- #title Community Support diff --git a/docs/content/4.support/2.agencies/1.index.md b/docs/content/4.support/2.agencies/1.index.md index c52156cbd3..2abc14fc32 100644 --- a/docs/content/4.support/2.agencies/1.index.md +++ b/docs/content/4.support/2.agencies/1.index.md @@ -6,7 +6,7 @@ head.titleTemplate: '%s' ::page-hero --- image: - src: '/assets/support/agencies/hero' + path: '/assets/support/agencies/hero' format: 'svg' height: '216' width: '400' diff --git a/docs/content/4.support/3.us.md b/docs/content/4.support/3.us.md index b86ce8c170..abe0b45564 100644 --- a/docs/content/4.support/3.us.md +++ b/docs/content/4.support/3.us.md @@ -7,7 +7,7 @@ image: '/socials/sponsors.jpg' ::page-hero --- image: - src: '/assets/support/sponsors/hero' + path: '/assets/support/sponsors/hero' format: 'webp' height: '216' width: '400' diff --git a/docs/content/4.support/4.jobs.md b/docs/content/4.support/4.jobs.md index 14d11f0213..9a01e631a0 100644 --- a/docs/content/4.support/4.jobs.md +++ b/docs/content/4.support/4.jobs.md @@ -7,7 +7,7 @@ image: '/socials/jobs.jpg' ::page-hero --- image: - src: '/assets/support/jobs/hero' + path: '/assets/support/jobs/hero' format: 'webp' height: '216' width: '400' diff --git a/docs/content/design-kit.md b/docs/content/design-kit.md index a8b11e7463..7fa3d5510a 100644 --- a/docs/content/design-kit.md +++ b/docs/content/design-kit.md @@ -7,7 +7,7 @@ image: '/socials/design-kit.jpg' ::page-hero --- image: - src: '/assets/design-kit/hero-designkit' + path: '/assets/design-kit/hero-designkit' format: 'webp' height: '216' width: '400' diff --git a/docs/package.json b/docs/package.json index f03f29f35b..a8f997fdf2 100644 --- a/docs/package.json +++ b/docs/package.json @@ -10,7 +10,7 @@ "devDependencies": { "jiti": "^1.16.1", "nuxt": "^3.0.0", - "nuxt-website-theme": "^0.2.4", + "nuxt-website-theme": "^0.2.5", "pathe": "^1.0.0", "scule": "^1.0.0", "untyped": "^1.2.1" diff --git a/docs/public/assets/home/dx-batteries.svg b/docs/public/assets/home/dx-batteries-dark.svg similarity index 100% rename from docs/public/assets/home/dx-batteries.svg rename to docs/public/assets/home/dx-batteries-dark.svg diff --git a/docs/public/assets/home/dx-effortless.svg b/docs/public/assets/home/dx-effortless-dark.svg similarity index 100% rename from docs/public/assets/home/dx-effortless.svg rename to docs/public/assets/home/dx-effortless-dark.svg diff --git a/docs/public/assets/home/dx-plug-and-play.svg b/docs/public/assets/home/dx-plug-and-play-dark.svg similarity index 100% rename from docs/public/assets/home/dx-plug-and-play.svg rename to docs/public/assets/home/dx-plug-and-play-dark.svg diff --git a/docs/public/assets/home/needs-community-support.png b/docs/public/assets/home/needs-community-support-dark.png similarity index 100% rename from docs/public/assets/home/needs-community-support.png rename to docs/public/assets/home/needs-community-support-dark.png diff --git a/docs/public/assets/home/needs-nuxt-expert.png b/docs/public/assets/home/needs-nuxt-expert-dark.png similarity index 100% rename from docs/public/assets/home/needs-nuxt-expert.png rename to docs/public/assets/home/needs-nuxt-expert-dark.png diff --git a/docs/public/assets/home/needs-official-agency.png b/docs/public/assets/home/needs-official-agency-dark.png similarity index 100% rename from docs/public/assets/home/needs-official-agency.png rename to docs/public/assets/home/needs-official-agency-dark.png diff --git a/docs/public/assets/home/ux-fast.svg b/docs/public/assets/home/ux-fast-dark.svg similarity index 100% rename from docs/public/assets/home/ux-fast.svg rename to docs/public/assets/home/ux-fast-dark.svg diff --git a/docs/public/assets/home/ux-hybrid.svg b/docs/public/assets/home/ux-hybrid-dark.svg similarity index 100% rename from docs/public/assets/home/ux-hybrid.svg rename to docs/public/assets/home/ux-hybrid-dark.svg diff --git a/docs/public/assets/home/ux-seo.svg b/docs/public/assets/home/ux-seo-dark.svg similarity index 100% rename from docs/public/assets/home/ux-seo.svg rename to docs/public/assets/home/ux-seo-dark.svg diff --git a/docs/public/assets/support/solutions/agency.webp b/docs/public/assets/support/solutions/agency-dark.webp similarity index 100% rename from docs/public/assets/support/solutions/agency.webp rename to docs/public/assets/support/solutions/agency-dark.webp diff --git a/docs/public/assets/support/solutions/community.webp b/docs/public/assets/support/solutions/community-dark.webp similarity index 100% rename from docs/public/assets/support/solutions/community.webp rename to docs/public/assets/support/solutions/community-dark.webp diff --git a/docs/public/assets/support/solutions/experts.webp b/docs/public/assets/support/solutions/experts-dark.webp similarity index 100% rename from docs/public/assets/support/solutions/experts.webp rename to docs/public/assets/support/solutions/experts-dark.webp diff --git a/docs/yarn.lock b/docs/yarn.lock index d38741b06f..27654ebf2d 100644 --- a/docs/yarn.lock +++ b/docs/yarn.lock @@ -4194,7 +4194,7 @@ __metadata: dependencies: jiti: ^1.16.1 nuxt: ^3.0.0 - nuxt-website-theme: ^0.2.4 + nuxt-website-theme: ^0.2.5 pathe: ^1.0.0 scule: ^1.0.0 untyped: ^1.2.1 @@ -8996,9 +8996,9 @@ __metadata: languageName: node linkType: hard -"nuxt-website-theme@npm:^0.2.4": - version: 0.2.4 - resolution: "nuxt-website-theme@npm:0.2.4" +"nuxt-website-theme@npm:^0.2.5": + version: 0.2.5 + resolution: "nuxt-website-theme@npm:0.2.5" dependencies: "@docsearch/css": ^3.3.0 "@docsearch/js": ^3.3.0 @@ -9022,7 +9022,7 @@ __metadata: tailwindcss-border-gradient-radius: ^3.0.1 three: ^0.147.0 vue-lite-youtube-embed: ^1.0.4 - checksum: 3f268953cb17198a0090b4d6c1f0eb6c0e15531ad863f65597ff0aa080823018fd10c342cf7866d11ea5567821740cd44d6712947351071fb08df9221d80fcb7 + checksum: 5a5ba6b094475edbea83b0583e85bdcbc4435a2378be6e63be4f67f980071686d08c2297400c6eda7bbe9e28d95452863f897012f92cf1eed0c7c3cfe7558d3a languageName: node linkType: hard