bachir/figureslibres.cc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

menu

Browse Source
This commit is contained in:
kevin
2019-12-03 19:09:35 +01:00
parent c31a4942c0
commit 7ca69e1549
20 changed files with 472 additions and 141 deletions
Download Patch File Download Diff File Expand all files Collapse all files
user/themes/figureslibres/scss/theme/_sidebar.scss
+117 -40
View File
@@ -1,82 +1,159 @@
.sidebar-right{
position: fixed;
width: 20%;
width: 100%;
height: 100%;
right: calc( -20% + 0.5rem);
// right: calc( -20% + 0.5rem);
left: -100vw;
top: 0;
transition: 0.3s right ease;
background: #f9f9f9fe;
z-index: 999;
background: white;
z-index: 1000;
ul{
& > *:not(span) {
// border: 2px solid black;
// border-radius: 50px;
}
}
#icone_list{
z-index: 999;
z-index: 1000;
position: fixed;
top: 0;
right: 0;
}
.list-projets{
height: 100%;
overflow: auto;
overflow: hidden;
.title-menu{
padding-left: 0.5rem;
&::after{
content: " ";
width: 0;
height: 1px;
display: block;
margin-top: 0.5rem;
}
}
.container{
margin: auto;
overflow: auto;
padding: 1rem 2rem 2rem 0.5rem;
width: 85%;
float: left;
ul{
text-align: left;
margin: 0;
margin-bottom: 20px;
span.cat{
display: block;
line-height: 3rem;
font-weight: bold;
padding-left: 23px;
}
li{
display: inline-flex;
width: 100%;
margin-top: -6px;
align-items: flex-end;
width: auto;
position: relative;
&::before{
position: absolute;
content: " ";
display: inline-block;
min-width: 10px;
height: 100%;
}
&.culturelle{
&::before{
background: $color_culturelle;
}
}
&.sociale{
&::before{
background: $color_sociale;
}
}
&.publique{
&::before{
background: $color_publique;
a{
z-index: 0;
display: block;
background: white;
transition: 0.6s background;
.img{
pointer-events: none;
display: none;
position: fixed;
width: 300px;
height: auto;
z-index: 999;
transform-origin: center center;
transform: rotate(0deg);
border-radius: 10px;
overflow: hidden;
}
&:hover{
z-index: 999;
.img{
display: block;
transition: all 1s ease;
}
}
}
// &::before{
// position: absolute;
// content: " ";
// display: inline-block;
// height: 100%;
// transition: 0.6s background;
// }
&:hover{
&.culturelle{
a{
background: $color_culturelle;
transition: 0.6s background;
}
// &::before{
// }
}
&.sociale{
a{
background: $color_sociale;
transition: 0.6s background;
}
// &::before{}
}
&.publique{
a{
background: $color_publique;
transition: 0.6s background;
}
&::before{}
}
&::before{
min-width: 100%;
transition: 0.6s min-width;
transition: 0.3s background;
}
}
}
a{
color: black;
display: block;
padding-left: 1rem;
z-index: 999;
width: 100%;
&.active{
color: black;
}
}
}
}
.informations{
position: relative;
float: right;
width: 15%;
min-width: 250px;
height: 100%;
&::after{
content: " ";
height: 0;
width: 1px;
display: block;
position: absolute;
top: 0;
margin-right: 1rem;
left:0;
}
}
}
&.is-active{
right: 0;
transition: 0.3s right ease;
left: 0;
transition: 0.5s 0.3s left ease;
.title-menu{
&::after{
width: 100%;
background: black;
transition: 1s 0.9s width ease;
}
}
.informations{
&::after{
background: black;
transition: 1s 0.9s height ease;
height: 100%;
}
}
}
}