Quickstart long

Quickstart


short version

Quickstart long

Directives

Marp supporte des directives

  1. globales (en début de document dans le header YAML ou n'importe où)
    ---
    marp: true
    headingDivider: 2
    paginate: true
    header: 'Quickstart _long_'
    footer: 'Juste Leblanc & Marlène Sassœur'  
    ---
    
Juste Leblanc & Marlène Sassœur
Quickstart long
  1. locales, simplement en les précédents d'un underscore (tiret bas) _ et en les mettant comme un commentaire

    <!--
    _footer: ''
    _paginate: false 
    -->
    

Une directive locale est locale au slide courant

Juste Leblanc & Marlène Sassœur
Quickstart long

Footer & header

Parmi ces directives, les directives footer et header.

Juste Leblanc & Marlène Sassœur
Quickstart long

Pagination

La pagination se donne grâce à la directive paginate.

Remarque : Pour ajouter le nombre de page, il faut modifier le style comme suit :

<style>
section::after {
  content: attr(data-marpit-pagination) ' / ' attr(data-marpit-pagination-total);
}
</style>
Juste Leblanc & Marlène Sassœur

Thème

Il est possible de modifier le style d'un slide particulier.

Par exemple :

Il est également possible de définir une classe dans le style et de l'associer au slide courant via, par exemple _class: inverted et

section.inverted {
    background-color: #3e8ea3;
    color: white;
}

Et enfin, si l'on veut modifier du CSS dans des balises <style></style>, ajouter scoped

<style scoped>
</style>
Quickstart long

Style pour ces slides

Pour ces slides, voici le style (à écrire entre deux balises <style></style>)

  • pour la couleur des titres de niveau 1

    h1 {
        color: #3e8ea3;
    }
    
Juste Leblanc & Marlène Sassœur
Quickstart long
  • pour les couleurs et l'alignement du footer

    footer {
        background: #D2D2D2;
        color: peru;
        position: absolute;
        left: 0px;
        right: 0px;
        height: 25px;
        bottom: 0px;
        padding: 5px 20px;
    }
    
Juste Leblanc & Marlène Sassœur
Quickstart long
  • et pour les numéros de slides

    section::after {
        /* Layout of pagination content */
        background-color: darkgrey;
        color:#3e8ea3;
        position: absolute;
        bottom: 0px;
        right: 0px;
        width: 150px;
        height: 25px;
        line-height: 20px;
        padding: 5px 2px 5px 35px;
        text-align: center;
    }
    
Juste Leblanc & Marlène Sassœur
Quickstart long

Plusieurs colonnes

see https://github.com/orgs/marp-team/discussions/192

Column 1

Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptas eveniet, corporis commodi vitae accusamus obcaecati dolor corrupti eaque id numquam officia velit sapiente incidunt dolores provident laboriosam praesentium nobis culpa.

Column 2

Tempore ad exercitationem necessitatibus nulla, optio distinctio illo non similique? Laborum dolor odio, ipsam incidunt corrupti quia nemo quo exercitationem adipisci quidem nesciunt.

Juste Leblanc & Marlène Sassœur

Reste à écrire une page de crédit « comme mes autres slides »

Slides dans le cadre de mes cours.

Qui suis-je ?

Pierre Bettens (pbt)
blog.namok.be
pbettens@he2b.be · bettensp@helha.be

Crédits

GNU linux, markdown, Codium, Marp

Licence WTFL