const posts = await this.$content('posts')
  .only(['title', 'date', 'author'])
  .sortBy('date', 'asc')
  .limit(5)
  .skip(10)
  .where({
    tags: 'javascript',
    isArchived: false,
    date: { $gt: new Date(2020) },
  })
  .search('nuxt')
  .fetch()

```js
function foo() {
	var a = 42,
		b = 'Prism';
	return a + bar(b);
}
```

# Lorem ipsum
blah blah
## dolor—sit—amet
blah blah blah blah
### consectetur & adipisicing
blah blah blah blah blah blah

yarn add @nuxt/content

/* nuxt.config.js */

modules: [
 '@nuxt/content'
],
content: {
  dir: 'content',
  fullTextSearchFields: ['title', 'description'],
  markdown: {
    remarkExternalLinks: {
      target: '_blank',
      rel: 'noopener noreferrer'
    },
    remarkPlugins: ['remark-emoji'],
    prism: {
      theme: 'prism-themes/themes/prism-a11y-dark.css'
    }
  }
},

<!-- example-page.vue -->
<template>
  <div>
    <nuxt-content :document="page" />
  </div>
</template>

yarn create nuxt-content-docs <your-docs>

yarn add @nuxtjs/<module-name>

yarn add --dev @nuxtjs/color-mode

#OR
npm install --save-dev @nuxtjs/color-mode

/* nuxt.config.js */

export default {
  buildModules: [
    '@nuxtjs/color-mode'
  ],
  //external
  colorMode: {
    // default value of $colorMode.preference
    preference: 'system',
    // fallback value if not system preference found
    fallback: 'light', 
    hid: 'nuxt-color-mode-script',
    globalName: '__NUXT_COLOR_MODE__',
    componentName: 'ColorScheme'
  }
}

$colorMode = {
  preference, //actual selected color-mode
  value, //read-only, for detecting system color mode
  unknown //boolean - to check if need a placeholder
}

/* assets/colormode.css */
:root {
  --color: #243746;
  --color-primary: #158876;
  --bg: #f3f5f4;
}

.dark-mode {
  --color: #ebf4f1;
  --color-primary: #41b38a;
  --bg: #091a28;
}

.sepia-mode {
  --color: #433422;
  --color-secondary: #504231;
  --bg: #f1e7d0;
}

body {
  background-color: var(--bg);
  color: var(--color);
  transition: background-color .3s;
}
a {
  color: var(--color-primary)
}

/* ~/tailwind.config.js */
module.exports = {
 theme: {
  darkSelector: '.dark-mode',
 },
 variants: {
  backgroundColor: ['dark', 'dark-hover'],
  borderColor: ['dark', 'dark-focus'],
  textColor: ['dark', 'dark-hover', 'dark-active']
 },
 plugins: [require('tailwindcss-dark-mode')()]
}

<button
  class="btn border border-black dark:border-white"
  @click="changeMode"
>
    Button
</button>

/* nuxt.config.js */

export default {
  buildModules: [
    '@nuxtjs/tailwindcss'
  ],
}

yarn addd @nuxtjs/<module-name>

yarn addd @nuxtjs/cloudinary