Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.
 
 
 
 

73 wiersze
1.5 KiB

  1. @import '../../_global/styles/mixins';
  2. @import '../../_global/styles/vars';
  3. .magazine-header {
  4. --magazine-header-height: 90px;
  5. position: sticky;
  6. display: block;
  7. height: var(--magazine-header-height);
  8. top: var(--header-height);
  9. z-index: 99;
  10. font-size: 0;
  11. line-height: 0;
  12. text-align: center;
  13. pointer-events: none;
  14. box-shadow: 0 -10px 0 0 var(--theme-color-white);
  15. @media(max-width: 767px) {
  16. --magazine-header-height: 70px;
  17. margin-bottom: 0;
  18. }
  19. a {
  20. transition: none;
  21. }
  22. .gradient {
  23. @include full-size;
  24. background: linear-gradient(90deg, var(--theme-color-gradient-01) 10%, var(--theme-color-gradient-02) 55%, var(--theme-color-gradient-03) 90%);
  25. transform-origin: center top;
  26. }
  27. .title {
  28. position: absolute;
  29. top: 50%;
  30. left: 50%;
  31. transform-origin: center 7%;
  32. transform: translate(-50%, -50%);
  33. display: inline-block;
  34. font-family: var(--font-korb);
  35. font-size: var(--font-size-h1);
  36. color: white;
  37. line-height: 1;
  38. padding: 15px;
  39. font-weight: 400;
  40. text-decoration: none;
  41. pointer-events: all;
  42. @media(max-width: 567px) {
  43. display: block;
  44. width: 100%;
  45. }
  46. }
  47. img {
  48. display: block;
  49. width: auto;
  50. height: calc(var(--magazine-header-height) * 7 / 9);
  51. margin: 0 auto;
  52. }
  53. &.narrow {
  54. --magazine-header-height: 50px;
  55. margin-bottom: 10px;
  56. @media(max-width: 767px) {
  57. margin-bottom: 0;
  58. }
  59. .title {
  60. font-size: var(--font-size-h3);
  61. }
  62. }
  63. }