]> xenbits.xensource.com Git - www-xenproject-org.git/commitdiff
fix lot of stuff
authorArnaud Guéras <arnaudgs@gmail.com>
Wed, 30 Oct 2024 11:04:40 +0000 (12:04 +0100)
committerArnaud Guéras <arnaudgs@gmail.com>
Wed, 30 Oct 2024 11:04:40 +0000 (12:04 +0100)
Signed-off-by: Arnaud Guéras <arnaudgs@gmail.com>
12 files changed:
content/projects/hvmi.md
hugo.yaml
themes/xen-project/assets/css/base.scss
themes/xen-project/assets/css/molecules/anchor.scss
themes/xen-project/assets/css/molecules/features-list.scss
themes/xen-project/assets/css/molecules/media-block.scss
themes/xen-project/assets/css/molecules/project-card.scss
themes/xen-project/assets/css/structure.scss
themes/xen-project/assets/css/typography.scss
themes/xen-project/assets/js/latest-news.js
themes/xen-project/assets/js/mockup/mockup-upload.js
themes/xen-project/layouts/partials/aside.html

index a887847536634a0ccba184e210f3789e5821beae..b2f0e606bbe6e1d0a31fbdd5fd0e4d2d75bb65ca 100644 (file)
@@ -10,9 +10,9 @@ menus:
 aside: 
   - type: resource
     items:
-      - name: "**Github repository**"
+      - name: "Github repository"
         link: https://github.com/hvmi
-      - name: Documentation
+      - name: "Documentation"
         link: https://hvmi.readthedocs.io/
 ---
 
index 0a6d48524618a7a29c1cf91de15740ce534703ac..ac88b1ab2f0d592f19e65af893e75313eeebc073 100644 (file)
--- a/hugo.yaml
+++ b/hugo.yaml
@@ -11,7 +11,11 @@ module:
 
 build:
   writeStats: true
-
+  processing:
+    css: true
+    css:
+      includePaths: []
+      sourceMap: true
 outputs:
   home:
     - HTML
index e98665ecb91a3ddc029f5e5444b3cd5492de40b7..cd8de1b13666a3e4b21e609540d8f06ef83fcf03 100644 (file)
@@ -37,10 +37,6 @@ address {
   display: inline;
 }
 
-strong {
-  font-weight: 600;
-}
-
 ul {
   list-style: disc;
   margin-top: var(--sp-sm);
index 4c74c5e134bbdc4a7cb31202242c48bbdb7bd42e..6ac63112586cfba17a29eef41a68ee8a02ca44a2 100644 (file)
@@ -2,14 +2,17 @@
   display: inline-block;
   text-decoration: none;
   color: var(--color-action-text);
-  font-size: 18px;
+  // font-size: 20px;
+  strong {
+    font-weight: 500;
+  }
 
   &::after {
     font-family: var(--font-family-icons);
     content: var(--icon-arrow-down);
     display: block;
     text-align: center;
-    margin-top: 10px;
+    margin-top: 0px;
     transition: all 0.3s ease-in-out;
     transform: translateX(0);
   }
index ced3710d22b55764787d9ccfcbcca84eb76d9359..56a5737157006b8248cb9f800c345f1b73881964 100644 (file)
@@ -77,7 +77,7 @@
     align-items: center;
     font-weight: 700;
     color: var(--color-action-fill);
-    margin: 0 0 0.75rem;
+    margin: 0 0 1.05rem;
     padding-bottom: 0.28em;
     border-bottom: 2px solid var(--color-brand-fill);
   }
index db7e593d731ea080c4d4ccd2ed92ae4edecfe753..0f223b28aaa64c7a50159e6afb56867d1ae44e48 100644 (file)
@@ -35,7 +35,7 @@
 
   @include tablet {
     --gap: var(--sp-xl);
-    --content-gap: var(--sp-md);
+    --content-gap: var(--sp-xs);
     --content-line-height: 1.67;
     --flex-direction: row-reverse;
     --media-max-width: 100%;
index ca987f2f742b4377dd549a5b4fbacb9190692233..f0ee4aaca4b0f12b9f22599da8205759e7a3f64a 100644 (file)
@@ -3,6 +3,7 @@
   --title-paddings: 0.25rem 0.5rem;
   --content-paddings: 0.75rem;
   --link-font-size: 1rem;
+  --content-line-height: 2;
   border: 0.0625rem solid var(--color-border);
   display: flex;
   flex-direction: column;
@@ -11,8 +12,9 @@
 
   @include tablet {
     --title-font-size: 1.5rem;
-    --content-paddings: 1.5rem 1rem;
-    --link-font-size: 1.25rem;
+    --content-paddings: 1.4rem 1rem;
+    --link-font-size: 1.22rem;
+    --content-line-height: 1.5;
   }
 
   &__title {
@@ -27,7 +29,7 @@
 
   &__content {
     padding: var(--content-paddings);
-    line-height: 2;
+    line-height: var(--content-line-height);
 
     p:first-child,
     p:last-child {
index 18a510bd03f7c38079dab121784284ca86719fa9..4f1a95ba4332037ea2cf8635a8ba0fa9cb551dba 100644 (file)
@@ -9,7 +9,19 @@
   padding-bottom: 0;
 }
 
+@include tablet {
+  .page-aside {
+    width: 420px;
+  }
+}
+
 .page-single {
+  @include tablet {
+    > .article {
+      padding-top: var(--sp-xl);
+    }
+  }
+
   &.with-aside {
     display: flex;
     flex-direction: column;
index c7bce5482a61d6467bd58ccae76a668c6a50e2c3..4cba8160d27a3bc4957547fdb385d027359b6983 100644 (file)
@@ -1,7 +1,26 @@
+:root {
+  /* Mobile font sizes (default) */
+  --font-size-base: 1.125rem; /* 18px - taille de base pour mobile */
+  --font-size-h1: 2.25rem; /* 36px */
+  --font-size-h2: 2rem; /* 32px */
+  --font-size-h3: 1.25rem; /* 20px */
+  --font-size-button: 1.125rem; /* 18px */
+  --font-size-p1: 1.125rem; /* 18px */
+  --font-size-p2: 1rem; /* 16px */
+
+  /* Line heights */
+  --line-height-heading: 60px;
+  --line-height-body: 1.5em;
+  --line-height-button: 1.2em;
+
+  /* Letter spacing */
+  --letter-spacing-p: -0.03125rem; /* -0.5px */
+}
+
 /* General Typography Styles */
 body {
   font-family: "Gotham", sans-serif;
-  font-size: 1rem; /* Base font size */
+  font-size: var(--font-size-base);
 }
 
 /* Line heights and common styles for paragraphs and buttons */
@@ -15,7 +34,7 @@ h3,
 .p1-medium-underline,
 .p1-book,
 .p1-book-underline {
-  line-height: var(--title-line-height);
+  line-height: var(--line-height-body);
 }
 
 .p1-bold,
@@ -24,7 +43,7 @@ h3,
 .p1-medium-underline,
 .p1-book,
 .p1-book-underline {
-  font-size: 1.125rem; /* 18px */
+  font-size: var(--font-size-p1);
 }
 
 .p1-medium,
@@ -35,12 +54,12 @@ h3,
 .p2-medium-underline,
 .p2-book,
 .p2-book-underline {
-  letter-spacing: -0.03125rem; /* -0.5px */
+  letter-spacing: var(--letter-spacing-p);
 }
 
 /* Headings */
 h1 {
-  font-size: var(--h1-font-size);
+  font-size: var(--font-size-h1);
   margin-top: var(--sp-md);
   margin-bottom: var(--sp-md);
   font-weight: 700;
@@ -50,7 +69,7 @@ h1 {
 
 h2 {
   font-weight: bold;
-  font-size: 2rem; /* 32px */
+  font-size: var(--font-size-h2);
   margin-top: 0.66em;
   margin-bottom: 0.66em;
   letter-spacing: -0.0194em;
@@ -58,7 +77,7 @@ h2 {
 
 h3 {
   font-weight: bold;
-  font-size: 1.25rem; /* 24px */
+  font-size: var(--font-size-h3);
   line-height: 120%;
 }
 
@@ -86,13 +105,13 @@ strong {
 /* Buttons */
 .button-medium {
   font-weight: medium;
-  font-size: 1.125rem; /* 18px */
+  font-size: var(--font-size-button);
 }
 
 .button-medium-mobile {
   font-weight: medium;
-  font-size: 1.125rem; /* 18px */
-  line-height: 1.2em;
+  font-size: var(--font-size-button);
+  line-height: var(--line-height-button);
 }
 
 /* Paragraphs */
@@ -125,29 +144,27 @@ strong {
 }
 
 /* Common Styles */
-.p2-medium {
-  font-weight: medium;
-  font-size: 1rem; /* 16px */
-  line-height: 1.5em;
+.p2-medium,
+.p2-medium-underline,
+.p2-book,
+.p2-book-underline {
+  font-size: var(--font-size-p2);
+  line-height: var(--line-height-body);
+  letter-spacing: var(--letter-spacing-p);
 }
 
+.p2-medium,
 .p2-medium-underline {
   font-weight: medium;
-  font-size: 1rem; /* 16px */
-  line-height: 1.5em;
-  text-decoration: underline;
 }
 
-.p2-book {
+.p2-book,
+.p2-book-underline {
   font-weight: book;
-  font-size: 1rem; /* 16px */
-  line-height: 1.5em;
 }
 
+.p2-medium-underline,
 .p2-book-underline {
-  font-weight: book;
-  font-size: 1rem; /* 16px */
-  line-height: 1.5em;
   text-decoration: underline;
 }
 
@@ -181,27 +198,15 @@ p {
 
 /* Desktop Styles */
 @media (min-width: 768px) {
-  h1 {
-    font-size: 2.5rem; /* 40px */
-    line-height: 1.2em;
-  }
-
-  h2 {
-    font-size: 2.25rem; /* 36px */
-    line-height: 1.2em;
-  }
-
-  .button-medium {
-    font-size: 1.25rem; /* 20px */
-  }
-
-  .p1-bold,
-  .p1-bold-underline,
-  .p1-medium,
-  .p1-medium-underline,
-  .p1-book,
-  .p1-book-underline {
-    font-size: 1.25rem; /* 20px */
+  :root {
+    --font-size-base: 1.25rem; /* 20px - taille de base pour desktop */
+    --font-size-h1: 2.5rem; /* 40px */
+    --font-size-h2: 2.25rem; /* 36px */
+    --font-size-h3: 1.5rem; /* 24px */
+    --font-size-button: 1.25rem; /* 20px */
+    --font-size-p1: 1.25rem; /* 20px */
+    /* P2 reste à 16px même sur desktop selon la maquette */
+    --line-height-heading: 1.2em;
   }
 }
 
@@ -209,4 +214,10 @@ p {
   h1 {
     color: var(--color-action-text);
   }
+
+  @include tablet {
+    h1 {
+      margin-top: 0;
+    }
+  }
 }
index 76923fe2bf432fa1e7084c82cbfa253af09c4660..bc0d2a31ee7bcfc829f9586849d976a7d7373875 100644 (file)
@@ -19,9 +19,8 @@
     };
   })();
 
-  const newsCardTemplate = createTemplate();
-
   const latestnews = async (element) => {
+    const newsCardTemplate = createTemplate();
     const container = element.querySelector(".latest-news_container");
     const { maxCards, blogFilter, tagFilter } = container.dataset;
     const blogIds = blogFilter?.split(",") || blogs.map((blog) => blog.id);
index eb1c7e7f5162296eeb3913814fe5e73f96e8b187..309038b190defb437a962ce1a01437633089d306 100644 (file)
@@ -146,33 +146,36 @@ const mockupUpload = {
     async function loadSavedImages() {
       const images = await getImagesFromIndexedDB();
       savedImagesOptions.innerHTML = ""; // Clear existing options
-      images.forEach((image) => {
-        const option = document.createElement("span");
-        option.className = "custom-option";
-        option.dataset.value = image.id;
-        option.textContent = `${image.fileName.replace(/\.+?$/, "")}`;
-        savedImagesOptions.appendChild(option);
+      images
+        .sort((a, b) => (a.fileName < b.fileName ? -1 : 1))
+        .forEach((image) => {
+          const option = document.createElement("span");
+          option.className = "custom-option";
+          option.dataset.value = image.id;
+          option.textContent = `${image.fileName.replace(/\..+$/, "")}`;
+          savedImagesOptions.appendChild(option);
 
-        option.addEventListener("click", async () => {
-          const db = await openDB();
-          const transaction = db.transaction(storeName, "readonly");
-          const store = transaction.objectStore(storeName);
-          store.get(parseInt(option.dataset.value)).onsuccess = (event) => {
-            const selectedImage = event.target.result;
-            if (selectedImage.error) {
-              console.error("Error getting image from IndexedDB:", selectedImage.error);
-            } else {
-              if (selectedImage?.data) {
-                createImage(selectedImage.data); // Use the base64 data directly
-                customSelectTrigger.textContent = option.textContent;
-                customSelect.classList.remove("open");
+          option.addEventListener("click", async () => {
+            const db = await openDB();
+            const transaction = db.transaction(storeName, "readonly");
+            const store = transaction.objectStore(storeName);
+            store.get(parseInt(option.dataset.value)).onsuccess = (event) => {
+              const selectedImage = event.target.result;
+              if (selectedImage.error) {
+                console.error("Error getting image from IndexedDB:", selectedImage.error);
               } else {
-                console.error("Image data not found for ID:", option.dataset.value);
+                if (selectedImage?.data) {
+                  createImage(selectedImage.data); // Use the base64 data directly
+                  saveToLocalStorage("mockupMockupImage", selectedImage.data);
+                  customSelectTrigger.textContent = option.textContent;
+                  customSelect.classList.remove("open");
+                } else {
+                  console.error("Image data not found for ID:", option.dataset.value);
+                }
               }
-            }
-          };
+            };
+          });
         });
-      });
     }
 
     customSelectTrigger.addEventListener("click", () => {
index 563fc36bf1ab4c5a085620ea9e46c799de71db59..cd35b71f3bb7bf0abf8a099bf3c164ebc033a3b6 100644 (file)
@@ -23,7 +23,7 @@
         </div>
       {{ else if eq .type "members-list" }}
         <div class="box-members">
-          <h3 class="box-members__title">{{ .name }}</h3>
+          <h3 class="box-members__title">{{ .name | markdownify }}</h3>
           <ul>
             {{ range .items }}
               <li>