diff --git a/assets/styles/header.sass b/assets/styles/header.sass index 3dbf0c5..9a508d8 100644 --- a/assets/styles/header.sass +++ b/assets/styles/header.sass @@ -161,25 +161,31 @@ height: 100vh z-index: 100 background: white - flex-direction: column justify-content: center + flex-wrap: wrap + align-items: last baseline + align-content: center - @media (orientation: landscape) - flex-direction: row - align-items: last baseline + .viemunicipale + order: 1 + .economie + order: 2 + .cadredevie + order: 3 + .associations + order: 4 img display: inherit .menu height: auto + width: 200px flex-direction: column - margin-bottom: 1rem + margin: .7rem + padding: .7rem box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px - .menu.withSubmenu - padding: 10px - .submenu display: flex position: relative @@ -195,6 +201,21 @@ .menu:before content: none + @media screen and (max-width: 320px) + font-size: .9rem + flex-direction: row + flex-wrap: wrap; + align-items: center; + align-content: center; + .menu + width: 150px + a + padding: 0 + .submenu + font-size: .8rem + img + display: none + .open-button display: none white-space: nowrap diff --git a/assets/styles/main.sass b/assets/styles/main.sass index 5e8851f..ffe04d5 100644 --- a/assets/styles/main.sass +++ b/assets/styles/main.sass @@ -94,10 +94,17 @@ body .containerGrid display: flex + @media screen and (max-width: $size-md) + flex-direction: column .actus width: 75% + @media screen and (max-width: $size-md) + width: 100% .infos width: 25% + @media screen and (max-width: $size-md) + width: 100% + padding-left: 0 padding: 7rem 0 0 1rem display: block @@ -170,7 +177,6 @@ body background-position: center -50px background-size: 70% @media screen and (max-width: $size-md) - margin: 0 background-position-x: 120% background-size: 50%