✨ Feat(tips): improve style, add some tips

Author: mattboll

site/content/tips/easy-window-resize/index.md

@@ -0,0 +1,12 @@
+---
+title: easy window resize
+author: tmaillard
+date: 2024-05-24
+expirydate: ""
+draft: false
+tags:
+  - chrome
+---
+Un plugin pour retailler rapidement sa fenêtre chrome, toujours utile quand on fait du dév front !
+
+[https://chromewebstore.google.com/detail/easy-window-resize](https://chromewebstore.google.com/detail/easy-window-resize/cfpenpohaapdgnkglcbgjiooipcbcebi?pli=1)

site/content/tips/faire-des-commits-conventionnels/index.md

@@ -0,0 +1,10 @@
+---
+title: Faire des commits conventionnels
+author: mbollot
+date: 2024-05-24
+expirydate: ""
+draft: false
+---
+commitizen est un outil en ligne de commande pour faire des commit, quand on le lance il demande si c'est une feature, un bug etc. quelle catégorie est concernée, quel est le message de commit, si cela ferme un ticket… Bref quelques questions et il va créer un joli commit bien formaté, avec un emoji.
+
+<https://github.com/commitizen/cz-cli>

site/content/tips/only-allow-ne-vous-trompez-plus/index.md

@@ -0,0 +1,21 @@
+---
+title: "only-allow : ne vous trompez plus"
+author: probillard
+date: 2024-05-24
+expirydate: ""
+draft: false
+tags:
+  - npm
+  - yarn
+---
+Ça vous arrive de switcher de projet et de vous tromper entre npm et yarn ? Plus maintenant, grâce à [only-allow](https://www.npmjs.com/package/only-allow) !
+
+Ajoutez juste une commade en preinstall (plus d'info sur le readme) et c'est parti
+
+```
+{
+  "scripts": {
+    "preinstall": "npx only-allow npm"
+  }
+}
+```

site/layouts/partials/tips.html

@@ -3,13 +3,9 @@ <h1>Tips</h1>
 
     <div class="wrapper">
 
-        <section id="tips">
-            <div class="wrapper">
                 {{ range first 3 (where .Site.RegularPages "Section" "tips") }}
                 {{ .Render "li" }}
                 {{ end }}
-            </div>
-        </section>
     </div>
     <div class="wrapper-center">
         <a href="/tips/" class="btn">Tous nos tips</a>

site/layouts/tips/li.html

@@ -2,7 +2,6 @@
 
 <div class="tips-snippet-container">
   <div class="tips-snippet">
-  <div>
     <h2>
       {{ if .Truncated }}
       <a aria-label="En savoir plus sur {{ .Title }}" href="{{ .Permalink }}">{{ .Title }}</a>
@@ -24,5 +23,4 @@ <h2>
     </a>
     {{ end }}
   </div>
-  </div>
 </div>

src/css/_tips.scss

@@ -4,7 +4,32 @@ section#tips {
     padding-bottom: 50px;
 
     .wrapper {
-        max-width: 800px;
+        max-width: 992px;
         margin: 0 auto;
     }
+
+    .tips-snippet {
+        color: $darkgrey;
+        min-height: 200px;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+
+        width: 100%;
+        padding: 35px;
+        margin-top: 20px;
+        margin-bottom: 20px;
+
+        border: 1px solid rgba(255, 255, 255, 0.25);
+        border-radius: 20px;
+        background-color: rgba(255, 255, 255, 0.45);
+        box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.25);
+
+        backdrop-filter: blur(15px);
+
+        a {
+            color: $darkerblue;
+            text-decoration: underline;
+        }
+    }
 }