fix menu header small screens #39

Merged
jorge merged 2 commits from fix/header into develop 2021-10-13 10:49:00 +02:00
2 changed files with 26 additions and 14 deletions

File diff suppressed because one or more lines are too long

View File

@ -100,7 +100,7 @@ main {
max-width: 50rem; max-width: 50rem;
} }
@include breakpoint(xlarge){ @include breakpoint(xlarge){
max-width: 50rem; // max-width: 50rem;
} }
} }
} }
@ -207,12 +207,12 @@ main {
padding: 0; padding: 0;
margin: 0; margin: 0;
article { article {
@include breakpoint(small){
@include card-container(); @include card-container();
@include xy-cell(); @include xy-cell();
width: 100%; width: 100%;
padding: 0; padding: 0;
margin: 0; margin: 0;
@include breakpoint(small){
font-size: $global-font-size*0.7; font-size: $global-font-size*0.7;
} }
@include breakpoint(medium){ @include breakpoint(medium){
@ -220,7 +220,6 @@ main {
} }
@include breakpoint(large){ @include breakpoint(large){
} }
margin-bottom:0;
} }
} }
.accordion-content { .accordion-content {
@ -306,13 +305,13 @@ main {
@include xy-grid(); @include xy-grid();
.slide { .slide {
@include xy-grid; @include xy-grid;
justify-content: center;
overflow: hidden;
padding: 0;
@include breakpoint(small){ @include breakpoint(small){
width: 100vw; width: 100vw;
overflow: hidden;
padding: 0;
margin: 0; margin: 0;
// padding: $global-padding * 3; justify-content: center;
color: $white;
.textwidget { .textwidget {
} }
} }
@ -327,8 +326,8 @@ main {
@include breakpoint(large){ @include breakpoint(large){
width: 50%; width: 50%;
height: calc((50vw*9)/16); height: calc((50vw*9)/16);
padding: 0; //padding: 0;
margin: 0; //margin: 0;
//overflow:hidden; //overflow:hidden;
a { a {
@include flex; @include flex;
@ -359,7 +358,6 @@ main {
background-color: $primary-color; background-color: $primary-color;
font-variant:all-small-caps; font-variant:all-small-caps;
} }
color: $white;
.logo { .logo {
@include breakpoint(medium){ @include breakpoint(medium){
@ -375,8 +373,22 @@ main {
@include xy-cell(auto); @include xy-cell(auto);
@include flex; @include flex;
@include flex-align(spaced,middle); @include flex-align(spaced,middle);
min-height: 6rem; @include breakpoint(small) {
flex-direction: column;
min-height: unset;
padding: $global-padding;
.menu, .menu.horizontal {
justify-content: center;
}
}
@include breakpoint(large) {
flex-direction: row;
min-height: $global-padding * 6;
padding: $global-padding 0 ; padding: $global-padding 0 ;
.menu, .menu.horizontal {
justify-content: unset;
}
}
a { a {
color: $body-font-color; color: $body-font-color;
} }