scss refactor: main.scss split into abstracts/global/pages partials, kebab-case (compiled css unchanged)

2026-09-28 17:49:46 +02:00
parent fa13910d98
commit 74399a3823
18 changed files with 807 additions and 832 deletions
@@ -0,0 +1,33 @@
+//   _____                                           _
+//  | ____|_   _____ _ __   ___ _ __ ___   ___ _ __ | |_
+//  |  _| \ \ / / _ \ '_ \ / _ \ '_ ` _ \ / _ \ '_ \| __|
+//  | |___ \ V /  __/ | | |  __/ | | | | |  __/ | | | |_
+//  |_____| \_/ \___|_| |_|\___|_| |_| |_|\___|_| |_|\__|
+
+@use "../abstracts/variables" as *;
+@use "../abstracts/node-full" as *;
+@use "../abstracts/nodes-on-liste" as *;
+@use "../abstracts/event-date-time" as *;
+
+
+article.node-type-evenement.view-mode-full{
+  @include nodefull();
+
+  .field_dates.digit-dates{
+    transform-origin: 0 0;
+    @include event-date-time();
+  }
+
+  div.field_projet_s_lie_s{
+    margin-top: 2em;
+    .field-label{
+      margin-bottom: 1em;
+    }
+    article.node-type-projet.view-mode-tableau_liste{
+      @include projetOnListe();
+    }
+  }
+
+}
+
+
@@ -0,0 +1,36 @@
+//   _   _
+//  | | | | ___  _ __ ___   ___
+//  | |_| |/ _ \| '_ ` _ \ / _ \
+//  |  _  | (_) | | | | | |  __/
+//  |_| |_|\___/|_| |_| |_|\___|
+
+@use "../abstracts/variables" as *;
+@use "../abstracts/nodes-on-liste" as *;
+
+
+div.layout.layout--twocol-section--50-50{
+  flex-wrap: nowrap;
+  // Sans ça, `align-items: stretch` (défaut flex) étire les deux colonnes à la
+  // même hauteur : la synchro de scroll ne verrait aucune différence de hauteur.
+  // flex-start = chaque colonne prend la hauteur de son contenu.
+  align-items: flex-start;
+
+  column-gap: $colsgap;
+  div.layout__region{
+    max-width: calc(50% - $colsgap / 2);
+    flex: 1 0 calc(50% - $colsgap / 2);
+    .views-row{
+      // border: 1px solid red;
+      // box-sizing: border-box;
+      margin-bottom: 2em;
+      max-width: 100%;
+      article.node-type-projet{
+        @include projetOnListe();
+      }
+      article.node-type-evenement{
+        @include evenementOnListe();
+      }
+
+    }
+  }
+}
@@ -0,0 +1,15 @@
+//   ____            _      _
+//  |  _ \ _ __ ___ (_) ___| |_
+//  | |_) | '__/ _ \| |/ _ \ __|
+//  |  __/| | | (_) | |  __/ |_
+//  |_|   |_|  \___// |\___|\__|
+//                |__/
+@use "../abstracts/variables" as *;
+@use "../abstracts/node-full" as *;
+
+article.node-type-projet.view-mode-full{
+  @include nodefull();
+
+
+}
+
@@ -0,0 +1,71 @@
+//  __     ___                        _             _     _                  _____                                           _
+//  \ \   / (_) _____      _____     / \   _ __ ___| |__ (_)_   _____  ___  | ____|_   _____ _ __   ___ _ __ ___   ___ _ __ | |_ ___
+//   \ \ / /| |/ _ \ \ /\ / / __|   / _ \ | '__/ __| '_ \| \ \ / / _ \/ __| |  _| \ \ / / _ \ '_ \ / _ \ '_ ` _ \ / _ \ '_ \| __/ __|
+//    \ V / | |  __/\ V  V /\__ \  / ___ \| | | (__| | | | |\ V /  __/\__ \ | |___ \ V /  __/ | | |  __/ | | | | |  __/ | | | |_\__ \
+//     \_/  |_|\___| \_/\_/ |___/ /_/   \_\_|  \___|_| |_|_| \_/ \___||___/ |_____| \_/ \___|_| |_|\___|_| |_| |_|\___|_| |_|\__|___/
+
+@use "../abstracts/variables" as *;
+@use "../abstracts/event-date-time" as *;
+
+div.views-archives-evenements {
+
+  & > h3{
+    border-bottom: 1px solid #999;
+  }
+
+  article.node-type-evenement.view-mode-calendrier{
+    // @include evenementListe();
+    display: flex;
+    flex-direction: row;
+    gap: 1em;
+    header{
+      flex:0 1 auto;
+      // width: 5em;
+      padding:0 1em 0 0;
+
+      .field_dates{
+        @include event-date-time(5em);
+        flex-direction: column;
+        align-items: center;
+        gap: 0.6em;
+        span.date-sep{
+          display: block;
+          width: 1em;
+          height: 0;
+          overflow: visible;
+          transform-origin: center;
+          transform: rotate(90deg) translateX(0.1em);
+          line-height: 0;
+          padding: 0;
+        }
+      }
+    }
+
+    section.content{
+      flex:0 1 auto;
+      h2.node-title{
+        font-size: 3em;
+      }
+    }
+
+    section.last-cel{
+      flex:0 1 auto;
+      .field_images{
+        a{
+          display: block;
+          width: 12em;
+          height: 12em;
+          overflow: hidden;
+          img{
+            width: 100%;
+            height: 100%;
+            object-fit:contain;
+            object-position: top left;
+          }
+        }
+      }
+    }
+
+  }
+}
+
@@ -0,0 +1,49 @@
+//  __     ___                        _             _     _                  ____            _      _
+//  \ \   / (_) _____      _____     / \   _ __ ___| |__ (_)_   _____  ___  |  _ \ _ __ ___ (_) ___| |_
+//   \ \ / /| |/ _ \ \ /\ / / __|   / _ \ | '__/ __| '_ \| \ \ / / _ \/ __| | |_) | '__/ _ \| |/ _ \ __|
+//    \ V / | |  __/\ V  V /\__ \  / ___ \| | | (__| | | | |\ V /  __/\__ \ |  __/| | | (_) | |  __/ |_
+//     \_/  |_|\___| \_/\_/ |___/ /_/   \_\_|  \___|_| |_|_| \_/ \___||___/ |_|   |_|  \___// |\___|\__|
+//                                                                                        |__/
+
+@use "../abstracts/variables" as *;
+@use "../abstracts/nodes-on-liste" as *;
+
+
+div.views-archives-projets{
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  gap: 2em;
+  gap: $colsgap;
+  div.views-row{
+      flex: 1 0 calc(25% - $colsgap);
+      width: calc(25% - $colsgap);
+  }
+
+  article.node-type-projet.view-mode-tableau_liste{
+
+    @include projetOnListe();
+    >header{
+      >h2{
+        font-size: 3em;
+      }
+    }
+
+  }
+}
+form#views-exposed-form-archives-page-1{
+  div.bef-links{
+    ul{
+      margin:0; padding:0;
+      display: flex;
+      flex-direction: row;
+      flex-wrap: wrap;
+      li{
+        list-style: none;
+        flex: 0 1 auto;
+        padding: 0.2em 0.5em;
+        font-size: 0.756em;
+      }
+    }
+  }
+}