Vuetifyのcodeタグの装飾を止める

Nuxt/contentとVuetifyを使ってブログを作ろうとしていたけど、
codeタグの文字が勝手に装飾されてしまってprismのコードハイライトが大変見えにくくなっていた。

解決法

nuxt.config.jsに以下の設定を追加

nuxtconfig.js

...
vuetify:{
    customVariables: ['~/assets/variables.scss'],
    treeShake: true
}

次に/assets/variables.scssに(なければ作成)以下を追加

~/assets/variables.scss

$code-background-color:initia;
$code-color:initia;

以上で多分直る

解説

公式ドキュメントにはパッと見た感じ

Vuetifyには、複数の標準要素のカスタムスタイルがあります。
https://vuetifyjs.com/en/styles/content/

としか書かれておらず、無効化する方法なんて一切書かれていない

しかし、公式ドキュメントと半日にらめっこしていると、
sass変数一覧にしれっと

SASS Variables

Name	Defalt
$code-background-color	#FBE5E1 !default;
$code-color	#C0341D !default;

https://vuetifyjs.com/en/api/vuetify/#sass-variables

って書いてあった。
自分の読解力とかエンジニア力が足りなかっただけだと思うが非常にわかりにくいと感じた。

あとは
https://vuetifyjs.com/en/features/sass-variables/
に従って適当にしてやったらできた。