docs: upgrade to latest Docus (#214)

* feat(docs): upgrade to latest Docus

* update

Co-authored-by: Sébastien Chopin <[email protected]>

Author: Tahul

README.md

@@ -14,6 +14,10 @@
 - [✨  Release Notes](https://http.nuxtjs.org/releases)
 - [📖  Documentation](https://http.nuxtjs.org)
 
+## Nuxt 3
+
+HTTP module supports Nuxt 2. Nuxt 3 users can use the new isomorphic [$fetch API](https://nuxt.com/docs/getting-started/data-fetching#isomorphic-fetch-and-fetch) ([migration guide](https://nuxt.com/docs/migration/component-options#isomorphic-fetch)).
+
 ## Features
 
 - The fluent [ky](https://github.com/sindresorhus/ky) API has been extended with enhancements and shortcuts

docs/app.config.ts

@@ -0,0 +1,12 @@
+export default defineAppConfig({
+  docus: {
+    url: 'https://http.nuxtjs.org',
+    header: {
+      logo: true
+    },
+    socials: {
+      twitter: 'nuxt_js',
+      github: 'nuxt/http'
+    },
+  }
+})

docs/components/Logo.vue

@@ -0,0 +1,31 @@
+<template>
+  <svg width="175" height="40" viewBox="0 0 175 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+      d="M43.82 28V14.112H46.984L47.264 16.464C47.6933 15.6427 48.3093 14.9893 49.112 14.504C49.9333 14.0187 50.8947 13.776 51.996 13.776C53.7133 13.776 55.048 14.3173 56 15.4C56.952 16.4827 57.428 18.0693 57.428 20.16V28H53.844V20.496C53.844 19.3013 53.6013 18.3867 53.116 17.752C52.6307 17.1173 51.8747 16.8 50.848 16.8C49.84 16.8 49.0093 17.1547 48.356 17.864C47.7213 18.5733 47.404 19.5627 47.404 20.832V28H43.82ZM66.0632 28.336C64.3272 28.336 62.9832 27.7947 62.0312 26.712C61.0978 25.6293 60.6312 24.0427 60.6312 21.952V14.112H64.1872V21.616C64.1872 22.8107 64.4298 23.7253 64.9152 24.36C65.4005 24.9947 66.1658 25.312 67.2112 25.312C68.2005 25.312 69.0125 24.9573 69.6472 24.248C70.3005 23.5387 70.6272 22.5493 70.6272 21.28V14.112H74.2112V28H71.0472L70.7672 25.648C70.3378 26.4693 69.7125 27.1227 68.8912 27.608C68.0885 28.0933 67.1458 28.336 66.0632 28.336ZM76.5743 28L81.6143 21.056L76.5743 14.112H80.4103L83.9383 19.04L87.4383 14.112H91.3023L86.2343 21.056L91.3023 28H87.4383L83.9383 23.072L80.4103 28H76.5743ZM99.7736 28C98.3176 28 97.151 27.6453 96.2736 26.936C95.3963 26.2267 94.9576 24.9667 94.9576 23.156V17.108H92.5776V14.112H94.9576L95.3776 10.388H98.5416V14.112H102.294V17.108H98.5416V23.184C98.5416 23.856 98.6816 24.3227 98.9616 24.584C99.2603 24.8267 99.7643 24.948 100.474 24.948H102.21V28H99.7736ZM104.195 31.108L111.195 6.244H114.695L107.667 31.108H104.195Z"
+      fill="var(--logo-color)" />
+    <path
+      d="M117.156 28V7.84H120.74V16.24C121.207 15.4747 121.832 14.8773 122.616 14.448C123.419 14 124.333 13.776 125.36 13.776C127.077 13.776 128.403 14.3173 129.336 15.4C130.288 16.4827 130.764 18.0693 130.764 20.16V28H127.208V20.496C127.208 19.3013 126.965 18.3867 126.48 17.752C126.013 17.1173 125.267 16.8 124.24 16.8C123.232 16.8 122.392 17.1547 121.72 17.864C121.067 18.5733 120.74 19.5627 120.74 20.832V28H117.156ZM140.379 28C138.923 28 137.756 27.6453 136.879 26.936C136.002 26.2267 135.563 24.9667 135.563 23.156V17.108H133.183V14.112H135.563L135.983 10.388H139.147V14.112H142.899V17.108H139.147V23.184C139.147 23.856 139.287 24.3227 139.567 24.584C139.866 24.8267 140.37 24.948 141.079 24.948H142.815V28H140.379ZM152.164 28C150.708 28 149.542 27.6453 148.664 26.936C147.787 26.2267 147.348 24.9667 147.348 23.156V17.108H144.968V14.112H147.348L147.768 10.388H150.932V14.112H154.684V17.108H150.932V23.184C150.932 23.856 151.072 24.3227 151.352 24.584C151.651 24.8267 152.155 24.948 152.864 24.948H154.6V28H152.164ZM157.761 34.16V14.112H160.953L161.345 16.1C161.793 15.484 162.381 14.9427 163.109 14.476C163.856 14.0093 164.817 13.776 165.993 13.776C167.3 13.776 168.467 14.0933 169.493 14.728C170.52 15.3627 171.332 16.2307 171.929 17.332C172.527 18.4333 172.825 19.684 172.825 21.084C172.825 22.484 172.527 23.7347 171.929 24.836C171.332 25.9187 170.52 26.7773 169.493 27.412C168.467 28.028 167.3 28.336 165.993 28.336C164.948 28.336 164.033 28.14 163.249 27.748C162.465 27.356 161.831 26.8053 161.345 26.096V34.16H157.761ZM165.237 25.2C166.376 25.2 167.319 24.8173 168.065 24.052C168.812 23.2867 169.185 22.2973 169.185 21.084C169.185 19.8707 168.812 18.872 168.065 18.088C167.319 17.304 166.376 16.912 165.237 16.912C164.08 16.912 163.128 17.304 162.381 18.088C161.653 18.8533 161.289 19.8427 161.289 21.056C161.289 22.2693 161.653 23.268 162.381 24.052C163.128 24.8173 164.08 25.2 165.237 25.2Z"
+      fill="#00DC82" />
+    <mask id="mask0" mask-type="alpha" maskUnits="userSpaceOnUse" x="1" y="5" width="30" height="30">
+      <path
+        d="M27.2008 33.2309C19.8319 34.9446 12.1681 34.9446 4.7992 33.2309C3.7909 32.9964 3.0036 32.2091 2.76911 31.2008C1.05541 23.8319 1.05541 16.1681 2.76911 8.7992C3.0036 7.7909 3.7909 7.0036 4.7992 6.76911C12.1681 5.05541 19.8319 5.05541 27.2008 6.76911C28.2091 7.0036 28.9964 7.7909 29.2309 8.7992C30.9446 16.1681 30.9446 23.8319 29.2309 31.2008C28.9964 32.2091 28.2091 32.9964 27.2008 33.2309Z"
+        fill="#00DC82" stroke="black" stroke-width="0.32" />
+    </mask>
+    <g mask="url(#mask0)">
+      <path fill-rule="evenodd" clip-rule="evenodd"
+        d="M20.9369 4.60376H0.52832V32.9828L3.45343 36H15.4372L25.4888 30.1967C26.0893 29.85 26.295 29.0822 25.9483 28.4817L20.3068 18.7104C19.9601 18.1099 20.1659 17.3421 20.7663 16.9954L24.2791 14.9673C24.8795 14.6206 25.6474 14.8264 25.9941 15.4268L32 25.8295V5.8387C31.9349 5.86292 31.871 5.89289 31.8088 5.92878L15.0798 15.5873C14.4793 15.934 14.2736 16.7018 14.6203 17.3023L20.2618 27.0736C20.6085 27.6741 20.4027 28.4419 19.8022 28.7886L16.2649 30.8309C15.6644 31.1776 14.8966 30.9718 14.5499 30.3714L5.61669 14.8986C5.27001 14.2981 5.47574 13.5303 6.07622 13.1836L20.9369 4.60376ZM28.6041 36L32 34.0394V36H28.6041Z"
+        fill="#00DC82" />
+    </g>
+  </svg>
+</template>
+
+<style lang="ts" scoped>
+css({
+  svg: {
+    '--logo-color': '#003C3C',
+    '@dark': {
+      '--logo-color': '{color.white}'
+    }
+  }
+})
+</style>

docs/pages/en/1.getting-started/1.setup.md renamed to docs/content/1.getting-started/1.setup.md

@@ -1,6 +1,7 @@
----
-title: Setup
-description: 'How to setup your module'
+# Setup
+
+How to setup your module.
+
 ---
 
 Checkout the [Nuxt documentation](https://nuxtjs.org/api/configuration-modules#the-modules-property) for more information about installing and using modules.
@@ -9,22 +10,15 @@ Checkout the [Nuxt documentation](https://nuxtjs.org/api/configuration-modules#t
 
 Add `@nuxt/http` dependency to your project:
 
-:::::code-group
-  ::::code-block{label="Yarn" active}
-
-  ```bash
+::code-group
+  ```bash [Yarn]
   yarn add @nuxt/http
   ```
 
-  ::::
-  ::::code-block{label="NPM"}
-
-  ```bash
+  ```bash [NPM]
   npm install @nuxt/http
   ```
-
-  ::::
-:::::
+::
 
 Then add it to the modules section in your `nuxt.config.js`:
 
@@ -34,9 +28,9 @@ export default {
 }
 ```
 
-:::alert{type="success"}
+::alert{type="success"}
 That's it! You can now use [$http](/usage) in your Nuxt app ✨
-:::
+::
 
 ## Configure
 
@@ -56,9 +50,9 @@ export default {
 
 See [http's options](/API/options).
 
-:::alert{type="warning"}
+::alert{type="warning"}
 Note that this module does not currently support IE 11 because of using [ky](https://github.com/sindresorhus/ky) ([open issue](https://github.com/nuxt/http/issues/126))
-:::
+::
 
 ## TypeScript
 

docs/pages/en/1.getting-started/2.usage.md renamed to docs/content/1.getting-started/2.usage.md

@@ -1,6 +1,7 @@
----
-title: Usage
-description: 'How to use this module'
+# Usage
+
+How to use this module.
+
 ---
 
 ## Making Requests
@@ -108,9 +109,9 @@ methods: {
 }
 ```
 
-:::alert{type="info"}
+::alert{type="info"}
 `this` is not available in Nuxt's `asyncData` method, see [using in `asyncData`](#using-in-asyncdata) for how to use this module in `asyncData`
-:::
+::
 
 ## Using in Store
 

docs/pages/en/1.getting-started/3.http-methods.md renamed to docs/content/1.getting-started/3.http-methods.md

@@ -1,11 +1,14 @@
 ---
-title: HTTP Methods
-description: 'HTTP Methods'
+description: 'HTTP Methods.'
 ---
 
-:::alert{type="info"}
+# HTTP Methods
+
+---
+
+::alert{type="info"}
 Each http method returns a `Promise`
-:::
+::
 
 ### `$get`
 

docs/pages/en/1.getting-started/4.advanced.md renamed to docs/content/1.getting-started/4.advanced.md

@@ -1,6 +1,7 @@
----
-title: Advanced
-description: 'Advanced concepts'
+# Advanced
+
+Advanced concepts.
+
 ---
 
 ## Hooks
@@ -53,15 +54,15 @@ export default function ({ $http }) {
 
 Globally set a header to all subsequent requests.
 
-:::alert{type="warning"}
+::alert{type="warning"}
 This method should probably not be called inside hooks as it is global and will apply to all future requests
-:::
+::
 
-:::alert{type="info"}
+::alert{type="info"}
 Please note that HTTP headers are case-insensitive. Therefore all header names will be converted to lower-case to make sure that if you set the same header twice but with different casing the last one set will be used.
 
 See also [this comment](https://github.com/sindresorhus/ky/issues/105#issuecomment-470169100) in the Ky repository for more information
-:::
+::
 
 Parameters:
 
@@ -86,9 +87,9 @@ this.$http.setHeader('Content-Type', false)
 
 Globally set `Authorization` header to all subsequent requests.
 
-:::alert{type="info"}
+::alert{type="info"}
 This is a global method, you only have to call it once after which all future requests will include the token
-:::
+::
 
 Parameters:
 

docs/pages/en/1.index.md renamed to docs/content/1.index.md

@@ -1,16 +1,12 @@
----
-title: Introduction
-description: 'HTTP module for Nuxt.js provides a universal way to make HTTP requests to the API backend.'
----
+# Introduction
 
-:::alert{type="warning"}
-HTTP module supports Nuxt 2. Nuxt 3 users can use the new isomorphic [$fetch API](https://v3.nuxtjs.org/getting-started/data-fetching#isomorphic-fetch-and-fetch) ([migration guide](https://v3.nuxtjs.org/docs/migration/component-options#isomorphic-fetch)).
-:::
+HTTP module for Nuxt.js provides a universal way to make HTTP requests to the API backend.
 
+---
 
-<img src="/preview.png" class="transition-shadow duration-200 rounded-md shadow light-img hover:shadow-lg" />
-
-<img src="/preview-dark.png" class="transition-shadow duration-200 rounded-md shadow dark-img hover:shadow-lg" />
+::alert{type="warning"}
+HTTP module supports Nuxt 2. Nuxt 3 users can use the new isomorphic [$fetch API](https://nuxt.com/docs/getting-started/data-fetching#isomorphic-fetch-and-fetch) ([migration guide](https://nuxt.com/docs/migration/component-options#isomorphic-fetch)).
+::
 
 The HTTP module for [Nuxt](https://nuxtjs.org) provides a universal way to make HTTP requests to any API.
 
@@ -22,15 +18,15 @@ Starting from [v2.5.0](https://github.com/nuxt/nuxt.js/releases/tag/v2.5.0), Nux
 
 ## Features
 
-:::list
+::list
 
 - The fluent ky API has been extended with enhancements and shortcuts
 - Highly customizable options support for `BaseURL`
 - Automatically proxy cookies and headers when making requests from server side
 - Best practices to avoid token sharing when making server side requests
 - Easy proxy support to avoid CORS problems and making deployment easier
 
-:::
+::
 
 ## Links
 

docs/pages/en/2.API/1.options.md renamed to docs/content/2.API/1.options.md

@@ -1,9 +1,8 @@
----
-title: Options
-description: 'You can pass options using module options or http section in nuxt.config.js'
----
+# Options
 
-You can pass options using module options or `http` section in `nuxt.config.js`
+You can pass options using module options or `http` section in `nuxt.config.js`.
+
+---
 
 ```js
 {
@@ -33,9 +32,9 @@ Base URL which is used and prepended to make requests in server side.
 
 Environment variable `API_URL` can be used to **override** `baseURL`.
 
-:::alert{type="info"}
+::alert{type="info"}
 `baseURL` and `proxy` won't work together, you will need to use [`prefix`](/options#prefix) instead
-:::
+::
 
 ## `browserBaseURL`
 
@@ -82,11 +81,11 @@ You can easily integrate HTTP with [Proxy Module](https://github.com/nuxt-commun
 }
 ```
 
-:::alert{type="info"}
+::alert{type="info"}
 It is not required to manually register `@nuxtjs/proxy` module, but it does need to be in your dependencies
-:::
+::
 
-:::alert{type="info"}
+::alert{type="info"}
 `/api/` will be added to all requests to the API end point. If you need to remove it use `pathRewrite`:
 
 ```js
@@ -97,7 +96,7 @@ proxy: {
   }
 }
 ```
-:::
+::
 
 ## `retry`
 
@@ -147,9 +146,9 @@ In SSR context, sets client request header as http default request headers.
 This is useful for making requests which need cookie based auth on server side.
 Also helps making consistent requests in both SSR and Client Side code.
 
-:::alert{type="info"}
+::alert{type="info"}
 When directing requests at a url protected by CloudFlare's CDN you should set this to `false` to prevent CloudFlare from mistakenly detecting a reverse proxy loop and returning a 403 error.
-:::
+::
 
 ## `proxyHeadersIgnore`
 
@@ -163,10 +162,10 @@ Headers added to all requests. If provided, will be merged with the defaults.
 
 * Default: `{}`
 
-:::alert{type="info"}
+::alert{type="info"}
 Do NOT include any credentials or tokens here. One can easily access them.
-:::
+::
 
-:::alert{type="info"}
+::alert{type="info"}
 This headers are effective to ALL requests. Please take care and consider providing special headers on each call that needs this unless you are pretty sure you always need to add headers.
-:::
+::

docs/pages/en/2.API/2.runtime-config.md renamed to docs/content/2.API/2.runtime-config.md

@@ -1,6 +1,7 @@
----
-title: Runtime Config
-description: 'The use of runtime config is mandatory in case of using environment variables in production.'
+# Runtime Config
+
+The use of runtime config is mandatory in case of using environment variables in production.
+
 ---
 
 The use of [runtime config](https://nuxtjs.org/guide/runtime-config) is mandatory in case of using environment variables in production. Otherwise, the values will be hard coded during build and won't change until the next build.