bachir/materio-d9
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

more respnsive: header hamburger done, started base

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2021-03-29 22:28:24 +02:00
parent d170979b42
commit 2f1636dfd4
13 changed files with 651 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
web/themes/custom/materiotheme/assets/styles/base/_layout.scss
View File

@ -151,21 +151,28 @@ header[role="banner"]{
display:block;
}
// default position (hidden, translated right)
$w: 20em;
.header-block-wrapper{
z-index: 10;
z-index: 100;
position: absolute;
top: $min-height;
$w: 300px;
width: $w;
right: - $w - 150px;
right:0;
// right: - $w - 150px;
box-sizing: border-box;
// transform: translateX(150px);
transition: right 0.5s ease-in-out;
// transform: translateX(450px);
overflow: hidden;
width:0.1px;
box-shadow: 0 0 0 #fff;
padding:1em 0;
margin-top: 0.7em;
transition: all 0.5s ease-in-out;
>*.block, >div#user-tools{
display: block;
padding:0 0 0.5em 0!important;
margin:0 0 0.5em 0!important;
width: $w - 2em;
padding:0 0 1em 0!important;
margin:0 0 1em 0!important;
text-align: right;
border-left: none!important;
border-right: none!important;
@ -173,11 +180,20 @@ header[role="banner"]{
border-bottom: 1px solid #ccc!important;
}
}
#user-flags{
width: $w - 2em;
padding:1em 0 0 0!important;
margin:1em 0 0 0!important;
border-top: 1px solid #ccc!important;
}
}
// input checked, wrapper visible
input#header-block-right-toggle:checked ~ div.header-block-wrapper {
// transform: translateX(1px);
right:1px;
// right:1px;
width: $w;
padding:1em 1em;
box-shadow: -2px 2px 4px #ccc;
}
}
}