Reveal – Vos propres CSS et JS

Sans devoir hacker une feuille de style ou un fichier .js, marknotes vous permet de spécifier des règles CSS ou des lignes de code JS pour, juste, une note ou toutes les notes d’un dossier.

Le fichier settings.json permet en effet de définir des “custom” css / js comme illustré ci-dessous.

Rappel : la notion de surcharge du fichier settings.json est programmé de telle manière que si vous placez un fichier settings.json dans un des dossiers pour accéder à la note, vos paramètres seront pris en considération pour chaque note dans ces dossiers et, si vous nommez le fichier note.json il s’appliquera alors juste pour le fichier note.md se trouvant dans le même dossier.

Truc

Parfois vous avez plus ou moins de texte pour vos “slides”; il peut alors être intéressant de changer la taille (font-size) des caractères pour, juste, une présentation.

Si vous avez p.ex. beaucoup de texte sur vos slides, au lieu d’utiliser une taille de 40px (comme c’est le cas pour la feuille de style beige.css, standard à Reveal), vous pouvez forcer une taille de 30px comme illustré ci-dessous.

Configuration

{
    "plugins": {
        "options": {
            "page": {
                "html": {
                    "reveal": {
                        "appearance": {
                            "theme": "beige",
                            "custom": {
                                "css": [
                                    ".reveal { font-size: 30px; }",
                                    "section { background-color: white; }"
                                ],
                                "js": [
                                    "alert('Welcome in my super nice presentation');"
                                ]
                            }
                        }
                    }
                }
            }
        }
    }
}