atinux / content-wind

A lightweight Nuxt theme to build a Markdown driven website. Powered by Nuxt Content, TailwindCSS and Iconify.
https://content-wind.nuxt.space
MIT License
810 stars 56 forks source link

Support code diffs & file names #9

Closed heychazza closed 2 years ago

heychazza commented 2 years ago

Hi,

It would be cool if this could support code diffs, like seen here:

CleanShot 2022-06-03 at 11 55 05@2x

In addition to file names and tabs like: CleanShot 2022-06-03 at 11 56 46@2x

CleanShot 2022-06-03 at 11 57 17@2x

I wasn't sure if these are natively supported by Nuxt Content v2 already, and needed some form of syntax or flag. These are in the docs.

atinux commented 2 years ago

Actually these components are part of Docus (docs generator) that we plan to open source during the following weeks.

atinux commented 2 years ago

Actually for the diff, you need to use this syntax:

```diff
- "nuxt": "latest"
+ "nuxt": "^3.0.0-rc.3"
```

To activate it, update your nuxt.config to add it into the preload:

export default defineNuxtConfig({
  // ...
  content: {
    // ...
    highlight: {
      // ...
      preload: ['diff', 'ts'] // and other languages you need to highlight
    }
  }
})
heychazza commented 2 years ago

Actually for the diff, you need to use this syntax:


```diff

- "nuxt": "latest"

+ "nuxt": "^3.0.0-rc.3"

```

To activate it, update your nuxt.config to add it into the preload:


export default defineNuxtConfig({

  // ...

  content: {

    // ...

    highlight: {

      // ...

      preload: ['diff', 'ts'] // and other languages you need to highlight

    }

  }

})

So great, thank you!