Verwenden Sie CSS, um HTML-Elemente zu stylen, oder fügen Sie benutzerdefiniertes CSS und JavaScript hinzu, um Erscheinungsbild und Verhalten Ihrer Dokumentation vollständig anzupassen.

​
Styling mit Tailwind CSS

Verwenden Sie Tailwind CSS v3, um HTML-Elemente zu gestalten. Sie können Layout, Abstände, Farben und andere visuelle Eigenschaften steuern. Einige gängige Klassen sind:
  • w-full - volle Breite
  • aspect-video - Seitenverhältnis 16:9
  • rounded-xl - stark abgerundete Ecken
  • block, hidden - Anzeige steuern
  • dark:hidden, dark:block - Sichtbarkeit im Dark Mode
Arbitrary Values in Tailwind CSS werden nicht unterstützt. Für eigene Werte verwenden Sie stattdessen die style-Prop. 
<img style={{ width: '350px', margin: '12px auto' }} src="/path/image.jpg" />

​
Benutzerdefiniertes CSS

Fügen Sie Ihrem Repository CSS-Dateien hinzu; die darin definierten Klassennamen werden angewendet und stehen in all Ihren MDX-Dateien zur Verfügung.

​
Hinzufügen von style.css

Sie können beispielsweise die folgende Datei style.css hinzufügen, um das Styling der Navbar und der Fußzeile anzupassen. 
#navbar {
  background: "#fffff2";
  padding: 1rem;
}

footer {
  margin-top: 2rem;
}

​
Verwendung von Identifikatoren und Selektoren

Mintlify stellt eine Reihe gängiger Identifikatoren und Selektoren bereit, mit denen Sie wichtige UI-Elemente kennzeichnen können.
Verwenden Sie „Element untersuchen“, um die Elemente zu finden, die Sie anpassen möchten.
Referenzen und das Styling gängiger Elemente können sich im Zuge der Weiterentwicklung der Plattform ändern. Bitte verwenden Sie benutzerdefiniertes Styling mit Vorsicht.

​
Benutzerdefiniertes JavaScript

Benutzerdefiniertes JS ermöglicht es, eigenen ausführbaren Code global hinzuzufügen. Das entspricht dem Einfügen eines <script>-Tags mit JS-Code auf jeder Seite.

​
Benutzerdefiniertes JavaScript hinzufügen

Jede .js-Datei im Content-Verzeichnis deiner Dokumentation wird auf jeder Dokumentationsseite geladen. Du kannst zum Beispiel die folgende Datei ga.js hinzufügen, um Google Analytics für die gesamte Dokumentation zu aktivieren. 
window.dataLayer = window.dataLayer || [];
function gtag() {
  dataLayer.push(arguments);
}
gtag('js', new Date());

gtag('config', 'TAG_ID');
Bitte mit Vorsicht verwenden, um keine Sicherheitsrisiken einzuführen.