responcive: better header
This commit is contained in:
parent
8cb32b1b48
commit
4d1299387a
|
@ -19352,16 +19352,20 @@ header[role="banner"] {
|
||||||
header[role="banner"] #block-sitebranding h1 {
|
header[role="banner"] #block-sitebranding h1 {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
line-height: 1; }
|
line-height: 1; }
|
||||||
@media (max-width: 436px) {
|
header[role="banner"] #block-sitebranding .slogan {
|
||||||
header[role="banner"] #block-sitebranding .slogan {
|
font-size: 0.882em;
|
||||||
display: none; } }
|
display: block;
|
||||||
|
white-space: nowrap; }
|
||||||
|
@media (max-width: 436px) {
|
||||||
|
header[role="banner"] #block-sitebranding .slogan {
|
||||||
|
display: none; } }
|
||||||
header[role="banner"] #block-socialmedialinks {
|
header[role="banner"] #block-socialmedialinks {
|
||||||
padding-right: 0.5em;
|
padding-right: 0.5em;
|
||||||
border-right: 1px solid #1A1A1A;
|
border-right: 1px solid #1A1A1A;
|
||||||
margin-right: 0.5em; }
|
margin-right: 0.5em; }
|
||||||
header[role="banner"] #block-socialmedialinks li {
|
header[role="banner"] #block-socialmedialinks li {
|
||||||
padding: 0; }
|
padding: 0; }
|
||||||
@media (max-width: 654px) {
|
@media (max-width: 872px) {
|
||||||
header[role="banner"] #block-socialmedialinks {
|
header[role="banner"] #block-socialmedialinks {
|
||||||
display: none; } }
|
display: none; } }
|
||||||
header[role="banner"] #block-userlogin {
|
header[role="banner"] #block-userlogin {
|
||||||
|
@ -19439,7 +19443,7 @@ header[role="banner"] {
|
||||||
padding-top: 0.06em; }
|
padding-top: 0.06em; }
|
||||||
header[role="banner"] #user-tools a.mdi-account {
|
header[role="banner"] #user-tools a.mdi-account {
|
||||||
cursor: pointer; }
|
cursor: pointer; }
|
||||||
@media (max-width: 654px) {
|
@media (max-width: 1090px) {
|
||||||
header[role="banner"] #user-tools a.mdi-account span {
|
header[role="banner"] #user-tools a.mdi-account span {
|
||||||
display: none; } }
|
display: none; } }
|
||||||
header[role="banner"] #user-tools .mdi-logout::before {
|
header[role="banner"] #user-tools .mdi-logout::before {
|
||||||
|
@ -19456,7 +19460,7 @@ header[role="banner"] {
|
||||||
cursor: pointer; }
|
cursor: pointer; }
|
||||||
header[role="banner"] #user-flags h2:before {
|
header[role="banner"] #user-flags h2:before {
|
||||||
padding-right: 0.2em; }
|
padding-right: 0.2em; }
|
||||||
@media (max-width: 654px) {
|
@media (max-width: 1090px) {
|
||||||
header[role="banner"] #user-flags h2 span {
|
header[role="banner"] #user-flags h2 span {
|
||||||
display: none; } }
|
display: none; } }
|
||||||
header[role="banner"] #user-flags ul {
|
header[role="banner"] #user-flags ul {
|
||||||
|
@ -19538,11 +19542,10 @@ header[role="banner"] {
|
||||||
margin: 0; }
|
margin: 0; }
|
||||||
header[role="banner"] #block-header ul.menu li {
|
header[role="banner"] #block-header ul.menu li {
|
||||||
padding: 0; }
|
padding: 0; }
|
||||||
@media (max-width: 654px) {
|
header[role="banner"] #block-header ul.menu li {
|
||||||
header[role="banner"] #block-header ul.menu li {
|
display: inline-block; }
|
||||||
display: inline-block; }
|
header[role="banner"] #block-header ul.menu li:not(:first-of-type) {
|
||||||
header[role="banner"] #block-header ul.menu li:not(:first-of-type) {
|
margin-left: 0.5em; }
|
||||||
margin-left: 0.5em; } }
|
|
||||||
@media (max-width: 654px) {
|
@media (max-width: 654px) {
|
||||||
header[role="banner"] #block-header {
|
header[role="banner"] #block-header {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
@ -19563,7 +19566,9 @@ header[role="banner"] {
|
||||||
padding: 0.2em 0.5em;
|
padding: 0.2em 0.5em;
|
||||||
margin-right: -0.5em;
|
margin-right: -0.5em;
|
||||||
z-index: 90;
|
z-index: 90;
|
||||||
text-align: right; } }
|
text-align: right; }
|
||||||
|
header[role="banner"] #block-header ul.menu li {
|
||||||
|
display: block; } }
|
||||||
header[role="banner"] #block-languageswitcher {
|
header[role="banner"] #block-languageswitcher {
|
||||||
text-align: right;
|
text-align: right;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -60,7 +60,9 @@ header[role="banner"]{
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
}
|
}
|
||||||
.slogan{
|
.slogan{
|
||||||
|
font-size: 0.882em;
|
||||||
|
display: block;
|
||||||
|
white-space: nowrap;
|
||||||
@include col-mediaquery-max(2){
|
@include col-mediaquery-max(2){
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
|
@ -74,7 +76,7 @@ header[role="banner"]{
|
||||||
li{
|
li{
|
||||||
padding:0;
|
padding:0;
|
||||||
}
|
}
|
||||||
@include col-mediaquery-max(3){
|
@include col-mediaquery-max(4){
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -183,7 +185,7 @@ header[role="banner"]{
|
||||||
@extend %header-fs;
|
@extend %header-fs;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
span{
|
span{
|
||||||
@include col-mediaquery-max(3){
|
@include col-mediaquery-max(5){
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -207,7 +209,7 @@ header[role="banner"]{
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
&:before{padding-right: 0.2em;}
|
&:before{padding-right: 0.2em;}
|
||||||
span{
|
span{
|
||||||
@include col-mediaquery-max(3){
|
@include col-mediaquery-max(5){
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -321,7 +323,7 @@ header[role="banner"]{
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include col-mediaquery-max(3){
|
// @include col-mediaquery-max(3){
|
||||||
ul.menu{
|
ul.menu{
|
||||||
li{
|
li{
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
@ -330,7 +332,7 @@ header[role="banner"]{
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
// }
|
||||||
@include col-mediaquery-max(3){
|
@include col-mediaquery-max(3){
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
|
@ -352,6 +354,9 @@ header[role="banner"]{
|
||||||
margin-right: -0.5em;
|
margin-right: -0.5em;
|
||||||
z-index: 90;
|
z-index: 90;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
|
li{
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue