menu
This commit is contained in:
@@ -2,6 +2,7 @@ $animate: all 0.2s ease-in-out;
|
||||
|
||||
#text_figli{
|
||||
z-index: 999;
|
||||
opacity: 1;
|
||||
p{
|
||||
& > a{
|
||||
z-index: 999;
|
||||
@@ -70,6 +71,10 @@ $animate: all 0.2s ease-in-out;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.hidden{
|
||||
opacity: 0;
|
||||
transition: 0.3s opacity ease;
|
||||
}
|
||||
}
|
||||
|
||||
.circle_hover{
|
||||
@@ -87,7 +92,7 @@ $animate: all 0.2s ease-in-out;
|
||||
&.publique{
|
||||
background:
|
||||
url("/user/themes/figureslibres/images/forme2.svg") center no-repeat;
|
||||
background-size: cover;
|
||||
background-size: contain;
|
||||
}
|
||||
&.sociale{
|
||||
background: $color_sociale;
|
||||
@@ -96,11 +101,11 @@ $animate: all 0.2s ease-in-out;
|
||||
&.culturelle{
|
||||
background:
|
||||
url("/user/themes/figureslibres/images/forme3.svg") center no-repeat;
|
||||
background-size: cover;
|
||||
background-size: contain;
|
||||
}
|
||||
&.commanditaires{
|
||||
background:
|
||||
url("/user/themes/figureslibres/images/forme4.svg") center no-repeat;
|
||||
background-size: cover;
|
||||
background-size: contain;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@
|
||||
width: 100%;
|
||||
.card{
|
||||
width: $Wi50;
|
||||
height: 100%;
|
||||
&:nth-child(odd){
|
||||
margin-right: $margI;
|
||||
}
|
||||
@@ -11,7 +12,6 @@
|
||||
z-index: 999;
|
||||
display: inline-flex;
|
||||
width: 100%;
|
||||
// margin-bottom: $marg;
|
||||
& > * {
|
||||
margin-right: $marg;
|
||||
}
|
||||
|
||||
@@ -13,13 +13,13 @@ body.sticky-footer {
|
||||
.home{
|
||||
footer{
|
||||
color: #acb3c2;
|
||||
display: inline-flex;
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
p{
|
||||
font-size: 1rem!important;
|
||||
line-height: 1rem!important;
|
||||
display: inline-flex;
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
a{
|
||||
img{
|
||||
width: 20px!important;
|
||||
|
||||
@@ -20,13 +20,23 @@
|
||||
body{
|
||||
#start{
|
||||
width: $Wi-m;
|
||||
margin: 0rem auto 2rem auto;
|
||||
padding-right: 2rem;
|
||||
#text_figli{
|
||||
p{
|
||||
font-size: 1.7rem;
|
||||
line-height: 2.3rem;
|
||||
a{
|
||||
&:before,
|
||||
&:after {
|
||||
width: 50%;
|
||||
opacity: 1;
|
||||
background-color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
#item_list{
|
||||
width: $Wi-m;
|
||||
width: 100%;
|
||||
.card{
|
||||
width: calc(100%);
|
||||
margin: 0 0 0.5rem 0;
|
||||
@@ -49,11 +59,51 @@
|
||||
}
|
||||
}
|
||||
.sidebar-right{
|
||||
display: none;
|
||||
width: 100%;
|
||||
right: -100%;
|
||||
#icone_list{
|
||||
z-index: 0;
|
||||
width: 100%;
|
||||
// background-color: #f9f9f9fe;
|
||||
.hamburger{
|
||||
float: right;
|
||||
z-index: 999;
|
||||
}
|
||||
}
|
||||
.list-projets{
|
||||
z-index: 999;
|
||||
ul{
|
||||
text-align: center;
|
||||
span{
|
||||
text-align: center;
|
||||
}
|
||||
li{
|
||||
text-align: center;
|
||||
margin-top: 0!important;
|
||||
&::before{
|
||||
width: 100%;
|
||||
}
|
||||
a{
|
||||
padding: 0.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
footer{
|
||||
z-index: 999;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
bottom: 0!important;
|
||||
left: 0!important;
|
||||
padding: 0.5rem;
|
||||
background-color: #f9f9f9fe;
|
||||
}
|
||||
|
||||
.circle_hover.open{
|
||||
width: 0!important;
|
||||
height: 0!important;
|
||||
width: 100px!important;
|
||||
height: 100px!important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -10,8 +10,13 @@ header{
|
||||
}
|
||||
}
|
||||
|
||||
a, button{
|
||||
border: none;
|
||||
outline: none!important;
|
||||
}
|
||||
|
||||
.home{
|
||||
p{
|
||||
h2, p{
|
||||
font-size: $txt-figli;
|
||||
line-height: 3rem;
|
||||
}
|
||||
@@ -46,8 +51,8 @@ header{
|
||||
#item{
|
||||
.e-content{
|
||||
p{
|
||||
font-size: 1rem;
|
||||
line-height: 1.2rem;
|
||||
font-size: 1.5rem;
|
||||
line-height: 3rem;
|
||||
strong{
|
||||
font-weight: bold!important;
|
||||
}
|
||||
@@ -67,7 +72,6 @@ header{
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -124,9 +128,38 @@ a.culturelle, span.culturelle{
|
||||
}
|
||||
|
||||
.sidebar-right{
|
||||
ul, a{
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.2rem;
|
||||
h2{
|
||||
margin: .5rem 0rem 0rem 0rem;
|
||||
}
|
||||
ul > span{
|
||||
font-size: 0.8rem;
|
||||
line-height: 1rem!important;
|
||||
text-decoration: underline;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
ul > li{
|
||||
font-size: 1.7rem;
|
||||
line-height: 2rem;
|
||||
a{
|
||||
font-size: 1.7rem;
|
||||
line-height: 2rem;
|
||||
border-radius: 50px;
|
||||
}
|
||||
}
|
||||
.informations{
|
||||
padding: 1rem;
|
||||
&> div{
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
h3{
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
margin: 0;
|
||||
}
|
||||
p{
|
||||
font-size: 1rem;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user