content/_index.md

@@ -4,18 +4,4 @@ date: 2018-02-09T10:17:00
 draft: false
 ---
 
-## Salut !
-
-Je suis Achille Toupin, un 
-
-Ce site personnel regroupe ma présence sur internet
-
-Je collectionne les machines à écrire (entre autres)
-
-J'aime bien bricoler, les motos, le bois
-
-J'aime bien coder [git]()
-
-J'écris des [articles de blog](blog) quand ça me chante
-
-
+Minions ipsum gelatooo uuuhhh para tú bappleees para tú tank yuuu! Gelatooo po kass. Bappleees poopayee tulaliloo pepete belloo! Wiiiii. Baboiii hana dul sae bappleees pepete hana dul sae po kass po kass baboiii. Belloo! hahaha baboiii poopayee hahaha belloo! La bodaaa bee do bee do bee do chasy. Pepete poopayee tank yuuu! Butt la bodaaa wiiiii aaaaaah ti aamoo! Poulet tikka masala. Tatata bala tu daa ti aamoo! Poulet tikka masala poopayee wiiiii bappleees hana dul sae ti aamoo! Jeje belloo!

layouts/home.html

@@ -19,117 +19,66 @@
     <link rel="stylesheet" href="{{ $core.RelPermalink }}">
     
     <style>
-        body {
-            margin: 0;
-            padding: 0;
-            display: flex;
-            justify-content: center; /* Center the main-screen horizontally */
-            align-items: stretch; /* Ensure full height */
-            min-height: 100vh; /* Ensure the body takes up the full viewport height */
+      body {
+        margin: 0;
+        padding: 0;
+        display: flex;
+        justify-content: center; /* Center the main-screen horizontally */
+        align-items: stretch; /* Ensure full height */
+        min-height: 100vh; /* Ensure the body takes up the full viewport height */
+      }
+
+      .main-screen {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between; /* Ensure side-screens are adjacent to main-content */
+        width: auto; /* Allow the width to adjust based on content */
+        max-width: 100%; /* Prevent overflow */
+        gap: 0;
+        text-align: justify;
+      }
+
+      .side-screen {
+        height: 100vh;
+        overflow-y: auto; /* Allow scrolling if content overflows */
+        flex: 0 0 400px; /* Fixed width of 400px */
+      }
+
+      .main-content {
+        flex-grow: 1; /* Take up the remaining space between side-screens */
+        max-width: 750px; /* Optional: Limit max width */
+        margin: 0 25px;
+      }
+
+      .site-title {
+        width: 100%;
+        text-align: center;
+      }
+
+      .icon-row {
+        display: flex;
+        flex-direction: row;
+        justify-content: center;
+        width: 100%;
+        gap: 2rem;
+      }
+
+      .icon-item {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 1rem;
+      }
+
+      @media (max-width: 1380px) {
+        .side-screen {
+          display: none; /* Hide side-screens on smaller screens */
         }
 
         .main-screen {
-            display: flex;
-            flex-direction: row;
-            justify-content: space-between; /* Ensure side-screens are adjacent to main-content */
-            width: auto; /* Allow the width to adjust based on content */
-            max-width: 100%; /* Prevent overflow */
-            gap: 0;
-            text-align: justify;
+          justify-content: center; /* Center main-content when side-screens are hidden */
         }
-
-        .side-screen {
-            height: 100vh;
-            overflow-y: auto; /* Allow scrolling if content overflows */
-            flex: 0 0 400px; /* Fixed width of 400px */
-        }
-
-        .main-content {
-            display: flex;
-            flex-direction: column;
-            flex-grow: 1; /* Take up the remaining space between side-screens */
-            max-width: 900px; /* Optional: Limit max width */
-            margin: 0 25px;
-        }
-
-        .header {
-            display: flex;
-            justify-content: space-between; /* Space between the title and navigation */
-            align-items: center; /* Align items vertically in the center */
-            padding: 10px 20px; /* Optional: Add some padding */
-        }
-        
-        .site-title {
-            flex-grow: 1;
-            margin: 0; /* Remove default margin */
-            font-size: 3rem; /* Adjust font size as needed */
-
-        }
-
-        .navigation {
-            flex-grow: 3;
-            display: flex;
-
-        }
-
-        .navigation ul {
-            display: flex;
-            flex-wrap: wrap; /* Allow items to wrap onto multiple lines */
-            list-style: none;
-            margin: 0; /* Remove default margin */
-            padding: 0; /* Remove default padding */
-            justify-content: flex-end; /* Align items to the right */
-        }
-
-        .navigation ul li {
-            margin: 0 10px 0 10px;
-            
-        }
-
-        .navigation ul li a:hover {
-            text-decoration: underline; /* Add underline on hover */
-            
-        }
-
-        .center-content {
-            display: flex;
-            flex-grow: 1; /* Allow it to grow */
-            gap: 20px; /* Optional: Add spacing between child elements */
-        }
-
-        .presentation, .side-content-column {
-            flex: 1; /* Make both elements take up equal width */
-        }
-
-        .presentation {
-            max-width: 100%; /* Ensure it doesn't exceed its container */
-        }
-
-        .side-content-column {
-            max-width: 100%; /* Ensure it doesn't exceed its container */
-        }
-
-        @media (max-width: 1380px) {
-            .side-screen {
-            display: none; /* Hide side-screens on smaller screens */
-            }
-
-            .main-screen {
-            justify-content: center; /* Center main-content when side-screens are hidden */
-            }
-        }
-          /* Media query for when main-content is less than 700px wide */
-        @media (max-width: 700px) {
-            .center-content, .header{
-                flex-direction: column; /* Stack elements vertically */
-            }
-
-            .presentation, .side-content-column, .site-title, .navigation{
-                flex: none; /* Reset flex property */
-                width: 100%; /* Make them take full width */
-            }
-        }
-
+      }
     </style>
 </head>
 
@@ -188,86 +137,51 @@
             {{ partial "posts-defile.html" (dict "context" . "direction" "up") }}
         </div>
         <div class="main-content">
-            
-            <div class="header">
+            <h1 class="site-title">{{ .Title }}</h1>
 
-                <h1 class="site-title">Achille Toupin</h1>
-
-                <nav class="navigation">
-                    <ul>
-                        <li>📝 <a href="blog">Blog</a></li>
-                        <p> · </p>
-                        <li>📠 <a href="collection">Machines</a></li>
-                        <p> · </p>
-                        <li>🔗 <a href="liens">Liens</a></li>
-                        <p> · </p>
-                        <li>🔖 <a href="liens">Marque-pages</a></li>
-                        <p> · </p>
-                        <li>🌐 <a href="blogroll">Blogroll</a></li>
-                        <p> · </p>
-                        <li>❓ <a href="blogroll">A propos</a></li>
-                        <p> · </p>
-                        <li>✉️ <a href="contact">Contact</a></li>
-                        
-                    </ul>
-
-                    {{- if (not site.Params.disableThemeToggle) }}
-                    <button id="theme-toggle" accesskey="t" title="(Alt + T)" aria-label="Toggle theme">
-                        <svg id="moon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
-                            fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"
-                            stroke-linejoin="round">
-                            <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
-                        </svg>
-                        <svg id="sun" xmlns="http://www.w3.org/2000/svg" width="24" height="18" viewBox="0 0 24 24"
-                            fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
-                            stroke-linejoin="round">
-                            <circle cx="12" cy="12" r="5"></circle>
-                            <line x1="12" y1="1" x2="12" y2="3"></line>
-                            <line x1="12" y1="21" x2="12" y2="23"></line>
-                            <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
-                            <line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
-                            <line x1="1" y1="12" x2="3" y2="12"></line>
-                            <line x1="21" y1="12" x2="23" y2="12"></line>
-                            <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
-                            <line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
-                        </svg>
-                    </button>
-                    {{- end }}
-                </nav>
-
-
-                
+            {{- if (not site.Params.disableThemeToggle) }}
+            <button id="theme-toggle" accesskey="t" title="(Alt + T)" aria-label="Toggle theme">
+                <svg id="moon" xmlns="http://www.w3.org/2000/svg" width="24" height="18" viewBox="0 0 24 24"
+                    fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
+                    stroke-linejoin="round">
+                    <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
+                </svg>
+                <svg id="sun" xmlns="http://www.w3.org/2000/svg" width="24" height="18" viewBox="0 0 24 24"
+                    fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
+                    stroke-linejoin="round">
+                    <circle cx="12" cy="12" r="5"></circle>
+                    <line x1="12" y1="1" x2="12" y2="3"></line>
+                    <line x1="12" y1="21" x2="12" y2="23"></line>
+                    <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
+                    <line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
+                    <line x1="1" y1="12" x2="3" y2="12"></line>
+                    <line x1="21" y1="12" x2="23" y2="12"></line>
+                    <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
+                    <line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
+                </svg>
+            </button>
+            {{- end }}
 
 
+            {{ .Content }}
+            <div class="icon-row">
+                <a class="icon-item" href="/blog">
+                    <img src="/icon_work.webp" alt="Work icon by Shar"></img>
+                    <span>Blog</span>
+                </a>
+                <a class="icon-item" href="/collection">
+                    <img src="/icon_work.webp" alt="Work icon by Shar"></img>
+                    <span>Collection</span>
+                </a>
+                <a class="icon-item" href="/recettes">
+                    <img src="/icon_work.webp" alt="Work icon by Shar"></img>
+                    <span>Recettes</span>
+                </a>
+                <a class="icon-item" href="/livres">
+                    <img src="/icon_work.webp" alt="Work icon by Shar"></img>
+                    <span>Livres</span>
+                </a>
             </div>
-
-
-            
-            <div class="center-content">
-
-                <div class="presentation">
-                    {{ .Content }}
-                </div>
-
-                <div class="side-content-column">
-
-                    <div class="dernier-article">
-                        <h2>Mon dernier article</h2>
-                        {{ partial "posts-recents-carte.html" . }}
-                    </div>
-                    
-                    <div class="dernier-article">
-                        <h2>Mon dernier article</h2>
-                        {{ partial "posts-recents-carte.html" . }}
-                    </div>
-                </div>
-
-            </div>
-
-            {{ partial "buttons.html"}}
-
-            {{ partialCached "footer.html" . .Layout .Kind (.Param "hideFooter") (.Param "ShowCodeCopyButtons") -}}
-
         </div>
         <div class="side-screen">
             {{ partial "posts-defile.html" (dict "context" . "direction" "down") }}

layouts/partials/buttons.html

@@ -1,34 +0,0 @@
-<style>
-    .buttons {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: center;
-        max-width: 100vw; /* Make the container as wide as the viewport */
-        gap: 3px;
-        margin: 0; /* Remove any default margin */
-        padding: 0; /* Remove any default padding */
-    }
-    .button {
-        display: inline-block; 
-        border: none;
-        margin: 0;
-        padding: 0;
-        border-radius: 0;
-        background: none;
-        image-rendering: auto;
-        image-rendering: crisp-edges;
-        image-rendering: pixelated;
-        image-rendering: -webkit-optimize-contrast;
-    }
-</style>
-
-<div class="buttons">
-{{ $buttons := resources.Match "buttons/*" }}
-{{ if $buttons }}
-    {{ range $index, $button := $buttons }}
-        <img class="button" src="{{ $button.RelPermalink }}" alt="Button {{ $button.Name | path.Base }}" />
-    {{ end }}
-{{ else }}
-    <p>No buttons available.</p>
-{{ end }}
-</div>

layouts/partials/donnees-chargement.html

@@ -3,7 +3,7 @@ Code volé chez lucien
 https://git.shenanigans.cc/globuzma/blog/commit/695e63b275ca03ec53a099d68f274c9466d0539f 
 -->
 
-<span class="small-text" id="data-used">0kB chargés</span>
+<p class="small-text" id="data-used">0kB chargés</p>
 <script>
   window.addEventListener('load', function () {
     let totalTransferSize = 0;

layouts/partials/posts-recents-carte.html

@@ -1,19 +0,0 @@
-{{ $n := 1 }} <!-- Change this value to set the number of posts to display -->
-{{ range first $n (where .Site.RegularPages.ByDate.Reverse "Section" "blog") }}
-
-  {{- $image := .Resources.GetMatch (printf "%s" .Params.cover.image) -}}
-  {{- if $image -}}
-
-    {{- $optimizedImage := $image.Fill "100x100 webp q95 Center" -}}
-    <a href="{{ .RelPermalink }}" >
-        <h3>{{ .Title }}</h3>
-        <img src="{{ $optimizedImage.RelPermalink }}" alt="{{ .Title }} cover image"></img>
-        <small>{{ .Date.Format "January 2, 2006" }}</small>
-        <p>{{ .Summary | truncate 100 }}</p>
-        
-    </a>
-  {{ end }}
-  
-
-{{ end }}
-

readMe.md

@@ -38,6 +38,5 @@
     - [x] Faire fonctionner l'auth avec forgejo
     - [ ] Configurer decap CMS pour qu'il affiche les posts, et fonctionne avec les page bundles
     - [ ] Configurer les galleries dans Decap CMS
-- [ ] Ajouter des catégories aux articles et une liste de catégories sur page accueil
-- [ ] Boutons grossissent quand la souris est dessus, comme https://88x31.kate.pet/
+