From: Jérémy Fabre Date: Wed, 20 Jul 2016 13:04:21 +0000 (+0200) Subject: Fix header. Responsive footer implementation X-Git-Url: https://git.parisson.com/?a=commitdiff_plain;h=8e7b8fe5e381e639681e375a7c29f6dca9763ca0;p=mezzo.git Fix header. Responsive footer implementation --- diff --git a/app/static/src/sass/global/_helpers.scss b/app/static/src/sass/global/_helpers.scss index 00a4d276..7dba8d90 100755 --- a/app/static/src/sass/global/_helpers.scss +++ b/app/static/src/sass/global/_helpers.scss @@ -31,14 +31,35 @@ .bg { background-color: $color-main; } +.tal { + text-align: left; +} +@each $size, $width in $breakpoints { + .tal-#{$size} { + @include mq($from: $size) { + text-align: left; + } + } +} .tac { text-align: center; } +@each $size, $width in $breakpoints { + .tac-#{$size} { + @include mq($from: $size) { + text-align: center; + } + } +} .tar { text-align: right; } -.tal { - text-align: left; +@each $size, $width in $breakpoints { + .tar-#{$size} { + @include mq($from: $size) { + text-align: right; + } + } } .hide-xxs { @include mq($until: xs) { diff --git a/app/static/src/sass/layout/_footer.scss b/app/static/src/sass/layout/_footer.scss index fddf99ee..b3453ee5 100755 --- a/app/static/src/sass/layout/_footer.scss +++ b/app/static/src/sass/layout/_footer.scss @@ -2,6 +2,12 @@ $module: ".footer"; #{$module} { + @include mq($until: xs) { + div[class^="col-"] { + @include margin(.5 0); + } + } + &__pre { background: $color-black; @@ -10,6 +16,11 @@ $module: ".footer"; @include padding(1 0); + @include mq($until: xs) { + @include padding(0); + border: 0; + } + } &__content { @@ -24,6 +35,11 @@ $module: ".footer"; color: white; + @include mq($until: xs) { + @include padding(0); + background: $color-black; + } + } &__follow-link { @@ -71,10 +87,21 @@ $module: ".footer"; @include margin(1 0); + @include mq($until: xs) { + @include margin(0); + } + &--small { height: 1px; } } + &__partner { + @include mq($until: xs) { + width: 48%; + height: auto; + } + } + } diff --git a/app/static/src/sass/layout/_global.scss b/app/static/src/sass/layout/_global.scss index 89e3d1ee..5549ec01 100755 --- a/app/static/src/sass/layout/_global.scss +++ b/app/static/src/sass/layout/_global.scss @@ -1,5 +1,5 @@ .main { - @include margin(3 0 0 0); + @include margin(3 0 3 0); @include padding(1 0 0 0); background: white; diff --git a/app/static/src/sass/layout/_grid.scss b/app/static/src/sass/layout/_grid.scss index 4de6e3ed..d71ef04c 100755 --- a/app/static/src/sass/layout/_grid.scss +++ b/app/static/src/sass/layout/_grid.scss @@ -25,7 +25,9 @@ padding-left: $grid-gutter / 2; padding-right: $grid-gutter / 2; min-height: 1px; - float: left; + /*float: left;*/ + display: inline-block; + vertical-align: top; } diff --git a/app/static/src/sass/modules/navs/_nav-footer.scss b/app/static/src/sass/modules/navs/_nav-footer.scss index 4a7c4713..ee1cb03e 100644 --- a/app/static/src/sass/modules/navs/_nav-footer.scss +++ b/app/static/src/sass/modules/navs/_nav-footer.scss @@ -5,7 +5,6 @@ $module: ".nav-footer"; list-style-type: none; margin: 0; padding: 0; - text-align: left; &__item-link { @include font-size(m); @@ -13,5 +12,5 @@ $module: ".nav-footer"; font-weight: weight(regular); color: white; } - + } diff --git a/app/templates/base.html b/app/templates/base.html index f691a067..27c61181 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -39,7 +39,7 @@ - + {% spaceless %}