diff --git a/content/_index.md b/content/_index.md index 142d528..a28e9cb 100644 --- a/content/_index.md +++ b/content/_index.md @@ -1,5 +1,5 @@ +++ -title = "Manuels Deuxfleurs" +title = "Guide Deuxfleurs" sort_by = "weight" +++ diff --git a/content/formations/conf/_index.md b/content/formations/conf/_index.md index fddfcb3..7a2cf60 100644 --- a/content/formations/conf/_index.md +++ b/content/formations/conf/_index.md @@ -1,7 +1,7 @@ +++ title = "Conférences" description = "Compte-rendu des conférences auxquelles on a assisté" -weight = 50 +weight = 30 sort_by = "weight" +++ diff --git a/content/formations/mediatheque/_index.md b/content/formations/mediatheque/_index.md index dee163c..205dfec 100644 --- a/content/formations/mediatheque/_index.md +++ b/content/formations/mediatheque/_index.md @@ -1,23 +1,22 @@ +++ title = "Médiathèque critique" description = "Médiathèque critique" -weight = 30 +weight = 20 sort_by = "weight" +++ # Des livres -![Couverture de la Convivialité d'Illich <](/img/cover/convivialite.jpg) -![Couverture du Macroscope <](/img/cover/macroscope.jpg) -![Couverture de l'ordre moins le pouvoir <](/img/cover/pouvoir.jpg) -![Couverture de technologie partout démocratie nulle part <](/img/cover/techno-partout.jpg) -![Couverture de Cyberstructure <](/img/cover/cyberstructure.jpg) -![Couverture de L'institution imaginaire de la société <](/img/cover/imaginaire.jpg) - -![Couverture de Permanent Record <](/img/cover/permanent-record.jpg) -![Couverture de La France contre les robots <](/img/cover/France-contre-robots.jpg) -![Couverture de Carbon Democracy de Timothy Mitchell <](/img/cover/carbon_democracy.jpg) -![Couverture de Surveiller et punir de Michel Foucault <](/img/cover/surveiller-et-punir.jpg) +![Couverture de la Convivialité d'Illich #](/img/cover/convivialite.jpg) +![Couverture du Macroscope #](/img/cover/macroscope.jpg) +![Couverture de l'ordre moins le pouvoir #](/img/cover/pouvoir.jpg) +![Couverture de technologie partout démocratie nulle part #](/img/cover/techno-partout.jpg) +![Couverture de Cyberstructure #](/img/cover/cyberstructure.jpg) +![Couverture de L'institution imaginaire de la société #](/img/cover/imaginaire.jpg) +![Couverture de Permanent Record #](/img/cover/permanent-record.jpg) +![Couverture de La France contre les robots #](/img/cover/France-contre-robots.jpg) +![Couverture de Carbon Democracy de Timothy Mitchell #](/img/cover/carbon_democracy.jpg) +![Couverture de Surveiller et punir de Michel Foucault #](/img/cover/surveiller-et-punir.jpg) [↣ Consulter la page détaillée sur les livres](./livres/) diff --git a/content/formations/nix/_index.md b/content/formations/nix/_index.md index 2f1f4e9..7134d61 100644 --- a/content/formations/nix/_index.md +++ b/content/formations/nix/_index.md @@ -2,7 +2,7 @@ title = "Écosystème Nix" description = "L'écosysème Nix : nixlang, nixpkgs, nixos, flakes, etc." sort_by = "weight" -weight = 30 +weight = 60 +++ # Apprendre diff --git a/content/formations/sysadmin/_index.md b/content/formations/sysadmin/_index.md index cd79887..2a397c1 100644 --- a/content/formations/sysadmin/_index.md +++ b/content/formations/sysadmin/_index.md @@ -2,7 +2,7 @@ title = "Administration Système" description = "Administration Système" sort_by = "weight" -weight = 20 +weight = 50 +++ L'administration système est un concept aux contours flous. diff --git a/sass/_markdown.scss b/sass/_markdown.scss index 73caeb5..5cc6e69 100644 --- a/sass/_markdown.scss +++ b/sass/_markdown.scss @@ -74,6 +74,10 @@ width: auto; } +.content img[alt$="#"] { + margin: .5rem; +} + .content img[alt$=">"] { float: right; margin-left: 1rem; diff --git a/sass/_text.scss b/sass/_text.scss index 329017b..eb52d51 100644 --- a/sass/_text.scss +++ b/sass/_text.scss @@ -1,14 +1,16 @@ .heading-text { font-family: "Fira Sans", sans-serif; - font-size: 32px; + font-size: 2em; font-weight: 600; + line-height: 1.2em; padding: 10px 0 25px 0; color: var(--secondary-text-color); } h1, .title-text { font-family: "Fira Sans", sans-serif; - font-size: 25px; + font-size: 1.8em; + line-height: 1.2em; font-weight: 500; color: var(--secondary-text-color); border-left: var(--primary-color) 8px solid; @@ -17,7 +19,7 @@ h1, .title-text { h2, .title-text { font-family: "Fira Sans", sans-serif; - font-size: 25px; + font-size: 1.5em; font-weight: 500; color: var(--secondary-text-color); border-left: #aaa 8px solid; @@ -26,14 +28,14 @@ h2, .title-text { h3, .subtitle-text { font-family: "Fira Sans", sans-serif; - font-size: 20px; + font-size: 1.3em; font-weight: 500; color: var(--secondary-text-color); } .text { font-family: "Fira Sans", sans-serif; - font-size: 18px; + font-size: 16px; font-weight: 400; line-height: 26px; letter-spacing: 0.2px; diff --git a/sass/juice.scss b/sass/juice.scss index 04136a1..7866bb4 100644 --- a/sass/juice.scss +++ b/sass/juice.scss @@ -38,9 +38,20 @@ header { justify-content: space-between; } +header ul { + margin: 0px; + padding: 0px; + list-style: none; +} + +header ul li { + display: inline; + +} + .logo { font-family: Georgia, DejaVu Serif, Norasi, serif; - font-size: 32px; + font-size: 28px; color: var(--primary-text-color); font-weight: 500; display: flex; @@ -56,7 +67,6 @@ header { .nav-item { margin: 0 10px; text-decoration: none; - font-size: 18px; font-weight: bold; color: var(--primary-text-color); @@ -83,11 +93,16 @@ header { } } + main { display: flex; - padding: 50px 100px; + padding: 50px 50px; flex-grow: 1; + .toc-homepage .toc-sticky { + display: none; + } + .toc { max-width: 260px; min-width: 240px; @@ -123,7 +138,6 @@ main { padding: 0 30px 5px; color: #424242; } - } .toc-sticky { @@ -157,11 +171,20 @@ footer { } @media screen and (min-width: 1280px) { + main { + padding: 50px 100px; + } + .logo { + font-size: 32px; + } .content { max-width: 60%; min-width: 800px; overflow: hidden; } + .text { + font-size: 18px; + } } @media screen and (max-width: 768px) { @@ -172,6 +195,10 @@ footer { justify-content: center; } + header nav { + display: none; + } + .logo { font-size: 28px; margin: 10px; @@ -184,7 +211,7 @@ footer { .nav-item { margin: 0 5px; - font-size: 14px; + font-size: 1em; } .hero { @@ -192,15 +219,108 @@ footer { } main { - padding: 30px; + display: block; + padding: 0px; + } + + main .content { + margin: 15px; } .content { padding: 0; + display: block; + } +} + +/* + Disposition spécifique du menu pour mobile; menu déroulable pour mobile + Code inspiré de: https://alvarotrigo.com/blog/hamburger-menu-css/ +*/ + +#menu-toggle { + display: none; +} + +.menu-button-container { + display: none; +} + +.menu-button::before { + content: ''; + transform: translate(0, -8px); +} + +.menu-button::after { + content: ''; + transform: translate(0, 8px); +} + +#menu-toggle:checked + .menu-button-container .menu-button::before { + margin-top: 0px; + transform: rotate(45deg); +} + +#menu-toggle:checked + .menu-button-container .menu-button { + background: transparent; +} + +#menu-toggle:checked + .menu-button-container .menu-button::after { + margin-top: 0px; + transform: rotate(-45deg); +} + +@media (max-width: 768px) { + main .toc { + margin: 0px; + width: 100%; + max-width: none; + border: 0px; } - .explore-more, .toc { + main .toc-sticky { + border: 0px; + padding: 10px 0px; + } + + main .toc-homepage .toc-sticky { + display: block; + } + + .menu-button-container { + display: block; + } + + .toc-menu-title { + font-weight: 600; + margin-left: 64px; + } + + .toc-section { + margin-top: 16px; + } + + .menu-button { + top: 28px; + left:24px; + } + + .menu-button, + .menu-button::before, + .menu-button::after { + display: block; + background-color: #777; + position: absolute; + height: 4px; + width: 30px; + transition: transform 400ms ease; + border-radius: 2px; + } + + #menu-toggle ~ .toc-item { display: none; } - -} + #menu-toggle:checked ~ .toc-item { + display: block; + } +} \ No newline at end of file diff --git a/templates/_macros.html b/templates/_macros.html index 7c301a9..4f8d852 100644 --- a/templates/_macros.html +++ b/templates/_macros.html @@ -1,5 +1,7 @@ {% macro render_header() %} {% set section = get_section(path="_index.md") %} + +