Ρυθμίστε Mermaid
Περιβάλλον: client
Αυτή η λειτουργία ρύθμισης θα εκτελεστεί μόνο σε client side. Βεβαιωθείτε ότι το πρόγραμμα περιήγησης είναι συμβατό όταν κάνετε εισαγωγή πακέτων.
Δημιουργήστε ./setup/mermaid.ts
με το εξής περιεχόμενο:
import { defineMermaidSetup } from '@slidev/types'
export default defineMermaidSetup(() => {
return {
theme: 'forest',
}
})
Με το setup, μπορείτε να δώσετε μια προσαρμοσμένη προεπιλεγμένη ρύθμιση για το Mermaid. Ανατρέξτε στους ορισμούς των τύπων και στις οδηγίες χρήσης τους για περισσότερες λεπτομέρειες.
Προσαρμοσμένο θέμα/στυλ
Σε περίπτωση που θέλετε να δημιουργήσετε τα δικά σας προσαρμοσμένα θέματα ή στυλ για το Mermaid, μπορείτε να το κάνετε αυτό ορίζοντας το themeVariables
όπως στο παρακάτω παράδειγμα:
import { defineMermaidSetup } from '@slidev/types'
export default defineMermaidSetup(() => {
return {
theme: 'base',
themeVariables: {
// Γενικές μεταβλητές του θέματος
noteBkgColor: "#181d29",
noteTextColor: "#F3EFF5cc",
noteBorderColor: "#404551",
// Μεταβλητές διαγράμματος ακολουθίας
actorBkg: "#0E131F",
actorBorder: "#44FFD2",
actorTextColor: "#F3EFF5",
actorLineColor: "#F3EFF5",
signalColor: "#F3EFF5",
signalTextColor: "#F3EFF5",
}
}
})
Μπορείτε να βρείτε όλες τις μεταβλητές θέματος στη σελίδα Mermaid Theme Configuration.