_sidebar.scss 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. .sidebar-right{
  2. position: fixed;
  3. width: 20%;
  4. height: 100%;
  5. right: calc( -20% + 0.9rem);
  6. top: 0;
  7. transition: 0.3s right ease;
  8. #icone_list{
  9. z-index: 999;
  10. position: fixed;
  11. top: 0;
  12. right: 0;
  13. .hamburger{
  14. padding: 0.8rem;
  15. padding-right: 2rem;
  16. .hamburger-box{
  17. width: 30px;
  18. .hamburger-inner{
  19. height: 2px;
  20. width: 30px;
  21. &::before{
  22. width: 20px;
  23. height: inherit;
  24. }
  25. &::after{
  26. height: inherit;
  27. width: inherit;
  28. }
  29. }
  30. }
  31. }
  32. }
  33. .list-projets{
  34. height: 100%;
  35. overflow: auto;
  36. .container{
  37. margin: auto;
  38. ul{
  39. text-align: left;
  40. margin: 0;
  41. span.cat{
  42. display: block;
  43. line-height: 3rem;
  44. font-weight: bold;
  45. padding-left: 23px;
  46. }
  47. li{
  48. display: inline-flex;
  49. width: 100%;
  50. margin-top: -6px;
  51. &::before{
  52. content: " ";
  53. display: inline-block;
  54. min-width: 15px;
  55. height: auto;
  56. }
  57. &.culturelle{
  58. &::before{
  59. background: $color_culturelle;
  60. }
  61. }
  62. &.sociale{
  63. &::before{
  64. background: $color_sociale;
  65. }
  66. }
  67. &.publique{
  68. &::before{
  69. background: $color_publique;
  70. }
  71. }
  72. }
  73. a{
  74. color: black;
  75. display: block;
  76. padding-left: 0.5rem;
  77. &.active{
  78. color: black;
  79. }
  80. &:hover{
  81. background: white;
  82. transition: 0.3s background ease;
  83. }
  84. }
  85. }
  86. }
  87. }
  88. &.is-active{
  89. right: 0;
  90. transition: 0.3s right ease;
  91. }
  92. }