univ-nantes: theme tweaks to match client request (#71216)

static/univ-nantes/_custom.scss

@@ -44,15 +44,58 @@ h1, h2, h3, h4, h5, h6 {
 }
 .site-header {
     padding: $space-small;
-}
-#nav-wrapper {
-    box-shadow: 0 0.225em 0.325em rgba(0, 0, 0, 0.1);
+    height: 200px;
+    background-color: $blue;
+    @media screen and ($max-mobile-viewport) {
+        height: 100px;
+    }
 }
 
-#logo {
-    @media screen and ($max-mobile-viewport) {
-        padding-left: unset;
+
+#logo.has-logo {
+    a {
+        margin-top: $space-small;
+        display: block;
+        height: 80px;
     }
+    @media screen and ($max-mobile-viewport) {
+        padding-left: 0;
+        a {
+            height: 50px;
+        }
+    }
+}
+
+#toplinks {
+    font-size: $fz-small;
+    font-weight: 700;
+    right: $space-xlarge;
+    background: transparent;
+    padding-top: 0;
+    @media screen and ($max-mobile-viewport) {
+        margin-right: $space-medium;
+        background: transparent;
+    }
+    a {
+        color: $white;
+        @media screen and ($max-mobile-viewport) {
+            padding: $space-xsmall 0;
+            margin-left: $space-medium;
+        }
+        @media screen and ($min-desktop-viewport) {
+            padding: $space-xsmall;
+            &:not(:first-child) {
+                padding-left: $space-medium;
+            }
+        }
+    }
+}
+
+#nav-wrapper {
+    box-shadow: 0 0.225em 0.325em rgba(0, 0, 0, 0.1);
+    position: relative;
+    top: -4.4em;
+    margin-bottom: -4.4em;
 }
 
 div#nav {
@@ -67,42 +110,16 @@ div.gru-nav {
     @media screen and ($max-mobile-viewport) {
         .gru-nav-button {
             right: $space-medium;
+            top: $space-medium;
             left: unset;
             & + ul::before {
                 display: none;
             }
         }
     }
-}
-#toplinks {
-    font-size: $fz-small;
-    font-weight: 700;
-    right: $space-xlarge;
-    @media screen and ($max-mobile-viewport) {
-        margin-right: $nav-menu-side;
-        background: transparent;
-    }
-    a {
-        color: $black;
-        @media screen and ($max-mobile-viewport) {
-            padding: $space-xsmall 0;
-            margin-left: $space-large;
-        }
-        @media screen and ($min-desktop-viewport) {
-            padding: $space-xsmall;
-            &:not(:first-child) {
-                padding-left: $space-medium;
-            }
-        }
-    }
-}
-
-main {
-    margin-top: $space-large;
-}
-div.gru-nav {
     li > a {
         border: 2px solid transparent;
+        text-transform: uppercase;
     }
     li:focus-within > a,
     li:hover > a {
@@ -110,8 +127,26 @@ div.gru-nav {
     }
 }
 
+main {
+    margin-top: $space-large;
+}
+
 %cell-links-list {
     > li:hover {
-        border-left: 5px solid blue;
+        border-left: 5px solid $blue;
     }
+}
+
+div.wcsformcell {
+    padding: 0.7em 1rem;
+}
+
+footer h1,
+footer h2 {
+    font-size: $fz-small;
+    display: inline-block;
+    border-bottom: 1px solid white;
+    padding: $space-small 0;
+    margin: 0 $space-medium;
+
 }

static/univ-nantes/_vars.scss

@@ -1,6 +1,4 @@
 $blue: #3452ff;
-$white: #ffffff;
-$black: black;
 $epicea: #5d7b84;
 
 $gray-light-1: rgba(0, 0, 0, 0.87);
@@ -14,7 +12,7 @@ $space-large: 2em;
 $space-xlarge: 3em;
 
 // // typo
-$font-color: $black;
+$font-color: black;
 $font-family: "Source Sans Pro", sans-serif;
 $font-size: 18px;
 $font-line-height: 27px;
@@ -27,24 +25,30 @@ $fz-small: 14em / $base-font;
 $fz-xsmall: 12em / $base-font;;
 $fz-xxsmall: 11em / $base-font;;
 
-$width: 890px;
+$width: 1200px;
 $link-color: $blue;
 $link-decoration: underline;
 $link-hover-decoration: none;
 
 $responsive-menu: left-to-right;
-$nav-button-background: $white;
-$nav-button-color: $black;
-
-$nav-mobile-menu-background: $white;
+$nav-color: white;
+$nav-background: transparent;
+$nav-button-background: transparent;
+$nav-button-color: white;
+$nav-border-color: none;
+$nav-mobile-menu-background: white;
+$nav-item-background: transparent;
 $nav-item-selected-background: $blue;
-$nav-item-selected-color: $white;
+$nav-item-selected-color: white;
 
-$nav-item-hover-background: $white;
+$nav-item-hover-background: white;
 $nav-item-hover-color: $blue;
 
 $nav-submenu-background: $blue;
-$nav-submenu-color: $white;
+$nav-submenu-color: white;
+
+$nav-mobile-bottom-bar-color: white;
+$nav-mobile-bottom-bar-background: $blue;
 
 $toplinks-border-radius: 0;
 $toplinks-box-shadow: none;
@@ -52,14 +56,14 @@ $toplinks-padding: $space-medium;
 $toplinks-border: none;
 
 
-$title-color: $black;
+$title-color: black;
 $title-font-size: $fz-2;
 $title-weight: 700;
 
 $button-background: $blue;
-$button-color: $white;
+$button-color: white;
 $button-border: 2px solid $blue;
-$button-hover-background: $white;
+$button-hover-background: white;
 $button-hover-color: $blue;
 $button-focus-outline: 2px solid $blue;
 $button-focus-outline-offset: 2px;
@@ -68,11 +72,11 @@ $buttons-order: previous, cancel (grow), submit;
 
 $form-sidebar-width: 30%;
 
-$widget-background: $white;
+$widget-background: white;
 $widget-focus-border: 1px solid transparent;
 $widget-border-radius: 4px;
 $widget-focus-outline: 2px solid $blue;
 
-$footer-background: $black;
-$footer-color: $white;
-$footer-link-color: $white;
+$footer-background: black;
+$footer-color: white;
+$footer-link-color: white;

static/univ-nantes/config.json

@@ -6,7 +6,8 @@
   "settings": {
     "combo": {
       "COMBO_ASSET_SLOTS.update": {
-        "header:logo": { "label": "Têtière : logo" }
+        "header:logo": { "label": "Têtière : logo" },
+        "header:background": { "label" : "Têtière : fond" }
       }
     }
   }