Merge branch 'denischiron-master-css' into dev

fusion des changements CSS
chartes · Mar 25, 2024 · cf1697d · cf1697d
2 parents 0ddf81c + ba6241b
commit cf1697d
Show file tree

Hide file tree

Showing 18 changed files with 414 additions and 141 deletions.
diff --git a/src/assets/css/endp_utils.css b/src/assets/css/endp_utils.css
@@ -18,14 +18,19 @@ html {
   --tablet-side-padding: 40px;
   --mobile-side-padding: 18px;
   --column-gap-desktop: 48px;
-  --right-column-bottom-padding-desktop: 300px;
+  --right-column-bottom-padding-desktop: 500px;
   --right-column-bottom-padding-mobile: 200px;
 }
 
 body {
   font-family: var(--font-primary);
 }
 
+.input:focus {
+  outline: none;
+  box-shadow: none;
+}
+
 /* Banner style */
 
 #banner-image {
@@ -40,28 +45,36 @@ body {
 
 #banner-image::before {
   content: "";
-  background-color : #320205;
-  background-size: var(--desktop-content-width) auto;
-  background-position: center;
-  background-repeat: no-repeat;
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
 }
 
-#banner-image h1 {
-  position: absolute;
-  left: 0;
-  bottom: 0;
+.page-title,
+#banner-image::before {
+  background-color : #320205;
+  background-size: var(--desktop-content-width) auto;
+  background-position: bottom center;
+  background-repeat: no-repeat;
+}
+
+.page-title {
+  position: sticky;
   z-index: 2;
+  top: 0;
+  margin-top:-52px;
+}
+
+.page-title h1 {
 
   display: block;
   width: var(--desktop-content-width);
   margin: 0 var(--desktop-side-padding);
   padding: 0 0 0 20px;
   background-color: #000000CC;
+  box-sizing: border-box;
 
   font-size: 25px;
   font-weight: 400;
@@ -102,13 +115,13 @@ body {
   font-style: italic;
 }
 
+.app-main-content__area > .box-iconography-collecta,
 .app-main-content__area > .columns {
   padding: 0 var(--desktop-side-padding);
 }
 
 @media (max-width: 1380px) {
   .app-main-content__area > .columns,
-  #banner-image h1,
   #banner-image {
     padding: 0 var(--tablet-side-padding);
   }
@@ -117,28 +130,37 @@ body {
 @media (max-width: 1340px) {
 
   #banner-image {
-    width: 100vw;
+    width: 100%;
     padding: 0;
   }
 
-  #banner-image h1 {
-    width: 100%;
-    margin: 0;
-    text-align: center;
+  .page-title h1 {
+    width: calc(100% - 2* var(--tablet-side-padding));
+    margin: 0 var(--tablet-side-padding);
   }
 }
 
 @media (max-width: 1024px) {
+
+  .app-main-content__area > .columns {
+    padding: 0 var(--mobile-side-padding);
+  }
+
   #banner-image {
     width: 100vw;
     height: 50px;
     padding: 0;
   }
 
-  #banner-image h1 {
+  .page-title {
+    top: 50px;
+  }
+
+  .page-title h1 {
     width: 100%;
     position: relative;
     margin: 0;
+    text-align: center;
     z-index: 1;
   }
 

diff --git a/src/components/AppFooter.vue b/src/components/AppFooter.vue
@@ -74,7 +74,6 @@
       </div>
     </div>
 
-
   </footer>
 </template>
 
@@ -88,6 +87,7 @@ export default {
 
 footer {
   width: 100%;
+  background-color: #4C4949;
   border-top: solid 6px var(--brown);
 }
 

diff --git a/src/components/AppMenuAside.vue b/src/components/AppMenuAside.vue
@@ -164,9 +164,10 @@ ul.menu-list > li:not(:last-child)::after {
   content: "";
   display: inline-block;
   width: 1px;
-  height: 100%;
+  height: 27px;
   border-right: solid #ffffff 1px;
-  margin: 0 20px;
+  margin: 12px 20px 0;
+  box-sizing: border-box;
 }
 
 .menu-list a span.icon {
@@ -232,7 +233,7 @@ ul.menu-list > li:not(:last-child)::after {
     padding: 0;
   }
 
-  ul.menu-list > li[data-v-09a19628]:not(:last-child)::after {
+  ul.menu-list > li:not(:last-child)::after {
     display: none;
   }
 

diff --git a/src/components/BurgerButton.vue b/src/components/BurgerButton.vue
@@ -19,8 +19,8 @@ export default {
   overflow: hidden;
   margin: 0;
   padding: 0;
-  width: 27px;
-  height: 27px;
+  width: 32px;
+  height: 32px;
   font-size: 0;
   text-indent: -9999px;
   -webkit-appearance: none;
@@ -44,7 +44,7 @@ export default {
 .hamburger span {
   display: block;
   position: absolute;
-  top: 9px;
+  top: 11px;
   left: 0;
   right: 0;
   height: 3px;
@@ -63,11 +63,11 @@ export default {
 }
 
 .hamburger span::before {
-  top: -9px;
+  top: -11px;
 }
 
 .hamburger span::after {
-  bottom: -9px;
+  bottom: -11px;
 }
 
 .hamburger span {