1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192 |
- .sidebar-right{
- position: fixed;
- width: 20%;
- height: 100%;
- right: calc( -20% + 0.9rem);
- top: 0;
- transition: 0.3s right ease;
- #icone_list{
- z-index: 999;
- position: fixed;
- top: 0;
- right: 0;
- .hamburger{
- padding: 0.8rem;
- padding-right: 2rem;
- .hamburger-box{
- width: 30px;
- .hamburger-inner{
- height: 2px;
- width: 30px;
- &::before{
- width: 20px;
- height: inherit;
- }
- &::after{
- height: inherit;
- width: inherit;
- }
- }
- }
- }
- }
- .list-projets{
- height: 100%;
- overflow: auto;
- .container{
- margin: auto;
- ul{
- text-align: left;
- margin: 0;
- span.cat{
- display: block;
- line-height: 3rem;
- font-weight: bold;
- padding-left: 23px;
- }
- li{
- display: inline-flex;
- width: 100%;
- margin-top: -6px;
- &::before{
- content: " ";
- display: inline-block;
- min-width: 15px;
- height: auto;
- }
- &.culturelle{
- &::before{
- background: $color_culturelle;
- }
- }
- &.sociale{
- &::before{
- background: $color_sociale;
- }
- }
- &.publique{
- &::before{
- background: $color_publique;
- }
- }
- }
- a{
- color: black;
- display: block;
- padding-left: 0.5rem;
- &.active{
- color: black;
- }
- &:hover{
- background: white;
- transition: 0.3s background ease;
- }
- }
- }
- }
- }
- &.is-active{
- right: 0;
- transition: 0.3s right ease;
- }
- }
|