This is the about page, with a custom description and image for SEO ✨
---navTitle: 'About'# Custom og:imagehead.description: 'This is a custom description for Content Wind about page.'head.image: 'https://i.picsum.photos/id/866/536/354.jpg?hmac=tGofDTV7tl2rprappPzKFiZ9vDh5MKj39oa2D--gqhA'---
A few highlighted features are below.
You can use any icon from the Iconify Project with the included <Icon />
component.
What's this mean? Access to 100,000 icons in 100 collections! See iconify.design for info -›
Icon
component is ready-to-use, without the need for importing it, in either MDC
format or in the standard Vue syntax.Here's a simple example of how to render the BMW logo from the Simple Icons collection.
<Icon name="simple-icons:bmw" />
It supports code highlighting with Shiki and as well as different VSCode themes. Updating the theme is as simple as editing your nuxt.config.[js|ts]
! Learn more in the Content Code Highlight section.
import { defineNuxtConfig } from 'nuxt'export default defineNuxtConfig({ content: { highlight: { theme: 'one-dark-pro', } }})
Markdown has a not-so-well-known feature for syntax highlighting, allowing us to render a fenced code-block inside of... a fenced code-block. This is quite useful for development tutorials, allowing you to display fenced code blocks without using any complicated escape sequences or backslashes.
```tsexport default () => 'Hello Content Wind'```
Available during development at port 3001
(configurable with $ANALYSIS_PORT
), or by running npm run dev:analysis
. Also available as a static, single-page application (SPA) by running npm run build:analysis
.