Skip to content

Commit 462410a

Browse files
Tahulatinux
Tahul
and
atinux
authored
feat(docs): upgrade to latest Docus (#580)
* feat(docs): upgrade to latest Docus * fix: use iconLinks Co-authored-by: Sébastien Chopin <seb@nuxtjs.com>
1 parent 5ba48c7 commit 462410a

19 files changed

+2781
-3378
lines changed

‎docs/app.config.ts‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
export default defineAppConfig({
2+
docus: {
3+
title: 'Nuxt Tailwind',
4+
layout: 'default',
5+
url: 'https://tailwindcss.nuxtjs.org/',
6+
description: 'Add Tailwind CSS to your Nuxt application in seconds.',
7+
socials: {
8+
twitter: 'nuxt_js',
9+
github: 'nuxt-modules/tailwindcss'
10+
},
11+
image: '/cover.jpg',
12+
header: {
13+
// title: false,
14+
logo: true
15+
},
16+
footer: {
17+
iconLinks: [
18+
{
19+
label: 'Nuxt',
20+
href: 'https://nuxt.com',
21+
icon: 'IconNuxt'
22+
},
23+
{
24+
label: 'Vue Telescope',
25+
href: 'https://vuetelescope.com',
26+
icon: 'IconVueTelescope'
27+
}
28+
]
29+
}
30+
}
31+
})

‎docs/content/0.index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
title: Introduction
33
description: Add Tailwind CSS to your Nuxt application in seconds.
44
navigation: false
5-
layout: fluid
5+
layout: page
66
---
77

88
::block-hero

‎docs/content/1.getting-started/1.setup.md‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
---
2-
title: Setup
3-
description: Using Tailwind CSS in your Nuxt project is only one command away ✨
1+
# Setup
2+
3+
Using Tailwind CSS in your Nuxt project is only one command away ✨
4+
45
---
56

67
## Installation

‎docs/content/1.getting-started/2.options.md‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
---
2-
title: Options
3-
description: Configure Nuxt Tailwind easily with the `tailwindcss` property.
1+
# Options
2+
3+
Configure Nuxt Tailwind easily with the `tailwindcss` property.
4+
45
---
56

67
```ts [nuxt.config]

‎docs/content/2.tailwind/1.config.md‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
---
2-
title: Config
3-
description: This module comes with a default Tailwind configuration file to provide the best possible user experience.
1+
# Config
2+
3+
This module comes with a default Tailwind configuration file to provide the best possible user experience.
4+
45
---
56

67
## Default configuration

‎docs/content/2.tailwind/2.viewer.md‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
---
2-
title: Viewer
3-
description: Visualize your Tailwind configuration with the viewer.
1+
# Viewer
2+
3+
Visualize your Tailwind configuration with the viewer.
4+
45
---
56

67
Nuxt Tailwind will expose a `/_tailwind/` route in development, so that you can quickly visualize your Tailwind configuration with easy copy-pasting (thanks to the awesome [tailwind-config-viewer](https://github.com/rogden/tailwind-config-viewer) package ✨).

‎docs/content/2.tailwind/3.editor-support.md‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
---
2-
title: Editor Support
3-
description: Improve your development experience with features such as autocomplete, syntax highlighting, and linting.
1+
# Editor Support
2+
3+
Improve your development experience with features such as autocomplete, syntax highlighting, and linting.
4+
45
---
56

67
Tailwind provides an [extension for Visual Studio Code](https://github.com/tailwindlabs/tailwindcss-intellisense), which enables advanced features such as autocomplete, syntax highlighting, and linting.

‎docs/content/3.examples/1.basic.md‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
---
2-
title: Basic Usage
3-
description: Live example of basic usage of Nuxt Tailwind on CodeSandbox.
42
toc: false
53
---
64

5+
# Basic Usage
6+
7+
Live example of basic usage of Nuxt Tailwind on CodeSandbox.
8+
9+
---
10+
711
Minimal example of a Nuxt project with Tailwind CSS module.
812

913
:sandbox{src="https://codesandbox.io/embed/nuxt3-tailwindcss-twowfx"}

‎docs/content/3.examples/2.dark-mode.md‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
---
2-
title: Dark Mode
3-
description: Live example of dark mode with Nuxt Tailwind on CodeSandbox.
42
toc: false
53
---
64

5+
# Dark Mode
6+
7+
Live example of dark mode with Nuxt Tailwind on CodeSandbox.
8+
9+
---
10+
711
<!-- TODO: Replace with tailwind's native dark mode support. -->
812

913
Example with the [tailwindcss-dark-mode](https://github.com/ChanceArthur/tailwindcss-dark-mode) plugin and [@nuxtjs/color-mode](https://github.com/nuxt-community/color-mode-module) module.

‎docs/content/3.examples/3.tailwindui.md‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,14 @@
11
---
2-
title: Tailwind UI
3-
description: Live example of Tailwind UI plugin with Nuxt Tailwind on CodeSandbox.
42
toc: false
53
---
64

5+
# Tailwind UI
6+
7+
Live example of Tailwind UI plugin with Nuxt Tailwind on CodeSandbox.
8+
9+
---
10+
11+
712
Example with [Tailwind UI](https://tailwindui.com) plugin with the [Inter](https://rsms.me/inter/) font loaded by [@nuxtjs/google-fonts](https://github.com/nuxt-community/google-fonts-module) module.
813

914
:sandbox{src="https://codesandbox.io/embed/nuxt-tailwindui-xy1jk" class="h-[600px]"}

0 commit comments

Comments
 (0)