Vous pouvez ajouter des extraits de code en ligne ou des code blocks. Les code blocks prennent en charge des options de métadonnées pour la coloration syntaxique, les titles, la mise en évidence de lignes, les icon, et plus encore.
Utilisez des blocs de code délimités en entourant le code de trois accents graves. Les blocs de code sont copiables et, si vous avez activé l’Assistant, les utilisateurs peuvent demander à l’IA d’expliquer le code.Indiquez le langage de programmation pour la coloration syntaxique et pour activer les options méta. Ajoutez les options méta, comme un title ou un icon, après le langage.
Report incorrect code
Copy
Ask AI
class HelloWorld { public static void main(String[] args) { System.out.println("Hello, World!"); }}
Activez la mise en surbrillance de la syntaxe en indiquant le langage de programmation après les backticks ouvrants d’un code block.Nous utilisons Shiki pour la mise en surbrillance de la syntaxe et prenons en charge tous les langages disponibles. Consultez la liste complète des langages dans la documentation de Shiki.Personnalisez globalement les thèmes des code blocks avec styling.codeblocks dans votre fichier docs.json. Définissez des thèmes simples comme system ou dark, ou configurez des thèmes Shiki personnalisés pour les modes clair et sombre. Voir Paramètres pour les options de configuration.
Thème personnalisé de mise en surbrillance de la syntaxe
Pour des thèmes personnalisés, définissez votre thème dans docs.json sur "css-variables" et remplacez les couleurs de surbrillance de la syntaxe à l’aide de variables CSS avec le préfixe --mint-.Les variables suivantes sont disponibles :Couleurs de base
--mint-color-text : Couleur de texte par défaut
--mint-color-background : Couleur d’arrière-plan
Couleurs des jetons
--mint-token-constant : Constantes et littéraux
--mint-token-string : Valeurs de chaîne
--mint-token-comment : Commentaires
--mint-token-keyword : Mots-clés
--mint-token-parameter : Paramètres de fonction
--mint-token-function : Noms de fonctions
--mint-token-string-expression : Expressions de chaîne
Dans les blocs de code JavaScript et TypeScript, utilisez twoslash pour activer des informations de type interactives. Les utilisateurs peuvent survoler les variables, fonctions et paramètres pour voir les types et les erreurs comme dans un IDE.
Report incorrect code
Copy
Ask AI
typePet = "cat" | "dog" | "hamster";functionadoptPet(name: string, type:Pet) {return `${name} the ${type} is now adopted!`;}// Survolez pour voir les types inférésconstmessage =adoptPet("Mintie", "cat");
Permettez aux utilisateurs de déplier et de replier de longs code blocks à l’aide de expandable.
Report incorrect code
Copy
Ask AI
from datetime import datetime, timedeltafrom typing import Dict, List, Optionalfrom dataclasses import dataclass@dataclassclass Book:title: strauthor: strisbn: strchecked_out: bool = Falsedue_date: Optional[datetime] = Noneclass Library:def **init**(self):self.books: Dict[str, Book] = {}self.checkouts: Dict[str, List[str]] = {} # patron -> list of ISBNs def add_book(self, book: Book) -> None: if book.isbn in self.books: raise ValueError(f"Book with ISBN {book.isbn} already exists") self.books[book.isbn] = book def checkout_book(self, isbn: str, patron: str, days: int = 14) -> None: if patron not in self.checkouts: self.checkouts[patron] = [] book = self.books.get(isbn) if not book: raise ValueError("Book not found") if book.checked_out: raise ValueError("Book is already checked out") if len(self.checkouts[patron]) >= 3: raise ValueError("Patron has reached checkout limit") book.checked_out = True book.due_date = datetime.now() + timedelta(days=days) self.checkouts[patron].append(isbn) def return_book(self, isbn: str) -> float: book = self.books.get(isbn) if not book or not book.checked_out: raise ValueError("Book not found or not checked out") late_fee = 0.0 if datetime.now() > book.due_date: days_late = (datetime.now() - book.due_date).days late_fee = days_late * 0.50 book.checked_out = False book.due_date = None # Remove from patron's checkouts for patron, books in self.checkouts.items(): if isbn in books: books.remove(isbn) break return late_fee def search(self, query: str) -> List[Book]: query = query.lower() return [ book for book in self.books.values() if query in book.title.lower() or query in book.author.lower() ]def main():library = Library() # Add some books books = [ Book("The Hobbit", "J.R.R. Tolkien", "978-0-261-10295-4"), Book("1984", "George Orwell", "978-0-452-28423-4"), ] for book in books: library.add_book(book) # Checkout and return example library.checkout_book("978-0-261-10295-4", "patron123") late_fee = library.return_book("978-0-261-10295-4") print(f"Late fee: ${late_fee:.2f}")if **name** == "**main**":main()
Activez le retour à la ligne pour les lignes trop longues avec wrap. Cela évite le défilement horizontal et rend les longues lignes plus faciles à lire.
Report incorrect code
Copy
Ask AI
const greeting = "Hello, World! I am a long line of text that will wrap to the next line.";function sayHello() { console.log(greeting);}sayHello();
Affichez un diff visuel des lignes ajoutées ou supprimées dans vos code blocks. Les lignes ajoutées sont mises en évidence en vert et les lignes supprimées en rouge.Pour créer des diffs, ajoutez ces commentaires spéciaux à la fin des lignes dans votre code block :
// [!code ++] : Marque une ligne comme ajoutée (mise en évidence en vert).
// [!code --] : Marque une ligne comme supprimée (mise en évidence en rouge).
Pour plusieurs lignes consécutives, indiquez le nombre de lignes après un deux-points :
// [!code ++:3] : Marque la ligne actuelle plus les deux suivantes comme ajoutées.
// [!code --:5] : Marque la ligne actuelle plus les quatre suivantes comme supprimées.
La syntaxe des commentaires doit correspondre à votre langage de programmation (par exemple, // pour JavaScript ou # pour Python).
