_header.scss 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. .fixedHeaderContainer {
  2. background: $primary-bg;
  3. color: $primary-overlay;
  4. height: $header-height;
  5. padding: $header-ptop 0 $header-pbot;
  6. position: sticky;
  7. top: 0;
  8. width: 100%;
  9. z-index: 9999;
  10. a {
  11. align-items: center;
  12. border: 0;
  13. color: $primary-overlay;
  14. display: flex;
  15. flex-flow: row nowrap;
  16. height: $header-height;
  17. }
  18. header {
  19. display: flex;
  20. flex-flow: row nowrap;
  21. position: relative;
  22. text-align: left;
  23. img {
  24. height: 24px;
  25. margin-right: 10px;
  26. }
  27. h2 {
  28. display: block;
  29. font-family: $header-font-family;
  30. font-weight: 900;
  31. line-height: 18px;
  32. position: relative;
  33. }
  34. }
  35. }
  36. .navigationFull {
  37. height: 34px;
  38. margin-left: auto;
  39. nav {
  40. position: relative;
  41. ul {
  42. display: flex;
  43. flex-flow: row nowrap;
  44. margin: 0 -10px;
  45. li {
  46. padding: 0 10px;
  47. display: block;
  48. a {
  49. border: 0;
  50. color: $primary-overlay-special;
  51. font-size: 16px;
  52. font-weight: 400;
  53. line-height: 1.2em;
  54. &:hover {
  55. border-bottom: 2px solid $primary-overlay;
  56. color: $primary-overlay;
  57. }
  58. }
  59. &.navItemActive {
  60. a {
  61. color: $primary-overlay;
  62. }
  63. }
  64. }
  65. }
  66. }
  67. }
  68. /* 900px
  69. .fixedHeaderContainer {
  70. .navigationWrapper {
  71. nav {
  72. padding: 0 1em;
  73. position: relative;
  74. top: -9px;
  75. ul {
  76. margin: 0 -0.4em;
  77. li {
  78. display: inline-block;
  79. a {
  80. padding: 14px 0.4em;
  81. border: 0;
  82. color: $primary-overlay-special;
  83. display: inline-block;
  84. &:hover {
  85. color: $primary-overlay;
  86. }
  87. }
  88. &.navItemActive {
  89. a {
  90. color: $primary-overlay;
  91. }
  92. }
  93. }
  94. }
  95. }
  96. &.navigationFull {
  97. display: inline-block;
  98. }
  99. &.navigationSlider {
  100. display: none;
  101. }
  102. }
  103. }
  104. 1200px
  105. .fixedHeaderContainer {
  106. header {
  107. max-width: 1100px;
  108. }
  109. }
  110. 1500px
  111. .fixedHeaderContainer {
  112. header {
  113. max-width: 1400px;
  114. }
  115. }
  116. */