_header.scss 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. .layout-container{
  2. position: absolute;
  3. }
  4. header{
  5. display: block;
  6. position: sticky;
  7. top:0;
  8. }
  9. #header-top {
  10. height: 7rem;
  11. background-color: $white;
  12. box-shadow: 1px 0px 8px $black;
  13. display: flex;
  14. flex-direction: row;
  15. justify-content: space-between;
  16. color: $black;
  17. .region-header-top-left {
  18. display:flex;
  19. flex-direction: row;
  20. padding: 1rem;
  21. align-items: center;
  22. color: $black;
  23. font-weight: 800;
  24. ul{
  25. list-style: none;
  26. display: flex;
  27. flex-direction: row;
  28. li {
  29. padding-right: 1rem;
  30. a {
  31. color: $black;
  32. }
  33. .is-active {
  34. color: $blue-light;
  35. }
  36. }
  37. .ul2{
  38. flex-direction: column;
  39. }
  40. }
  41. :hover{
  42. color: $blue-light;
  43. }
  44. }
  45. li ul {
  46. display: flex;
  47. flex-direction: column;
  48. }
  49. #block-burger {
  50. z-index: 1;
  51. background-color: $blue-light;
  52. font-size: 0.5rem;
  53. color: $white;
  54. display: block;
  55. width: 7rem;
  56. height: 7rem;
  57. margin-top: 0;
  58. :hover{
  59. cursor: pointer;
  60. }
  61. h2:after{
  62. display: block;
  63. height: 60px;
  64. font-family: 'Font Awesome';
  65. content: "\f0c9";
  66. font-weight: 100;
  67. font-size: 5rem;
  68. // content:"";
  69. // background-image: url('~/web/themes/custom/eql/images/pictos/menu.png');
  70. height: 6rem;
  71. }
  72. #block-burger-menu{
  73. display: block;
  74. margin: 0;
  75. align-self: center;
  76. text-align: center;
  77. height:7rem;
  78. }
  79. .ul1:not(.sous-liste){
  80. width: 300%;
  81. position: relative;
  82. right: 260px;
  83. margin: 0;
  84. padding-top: 2rem;
  85. z-index: 99;
  86. }
  87. ul {
  88. display: none;
  89. background-color: $blue-light;
  90. line-height: 2rem;
  91. list-style: none;
  92. .ul1 .sous-liste{
  93. a{
  94. opacity: 1;
  95. }
  96. }
  97. a{
  98. opacity: 0.6;
  99. color: $white;
  100. font-weight: 800;
  101. font-size: 1rem;
  102. }
  103. }
  104. &.opened ul {
  105. display: block;
  106. }
  107. }
  108. }