Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

navigation.scss 1.6 KiB

il y a 4 ans
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. //
  2. // Main nav, breadcrumb, etc...
  3. //
  4. .navigation-list {
  5. padding: 0;
  6. margin-top: 0;
  7. margin-bottom: 0;
  8. list-style: none;
  9. }
  10. .navigation-list-child-list {
  11. padding-left: $sp-3;
  12. list-style: none;
  13. .navigation-list-link {
  14. color: $nav-child-link-color;
  15. }
  16. .navigation-list-item {
  17. position: relative;
  18. &::before {
  19. position: absolute;
  20. margin-top: 0.3em;
  21. margin-left: -0.8em;
  22. color: rgba($body-text-color, 0.3);
  23. content: "- ";
  24. }
  25. &.active {
  26. &::before {
  27. color: $body-text-color;
  28. }
  29. }
  30. }
  31. }
  32. .navigation-list-item {
  33. @include fs-4;
  34. margin: 0;
  35. @include mq(md) {
  36. @include fs-3;
  37. }
  38. .navigation-list-child-list {
  39. display: none;
  40. }
  41. &.active {
  42. .navigation-list-child-list {
  43. display: block;
  44. }
  45. }
  46. }
  47. .navigation-list-link {
  48. display: block;
  49. padding-top: $sp-1;
  50. padding-bottom: $sp-1;
  51. &.active {
  52. font-weight: 600;
  53. color: $body-heading-color;
  54. text-decoration: none;
  55. }
  56. }
  57. // Small screen nav
  58. .main-nav {
  59. display: none;
  60. &.nav-open {
  61. display: block;
  62. }
  63. @include mq(md) {
  64. display: block;
  65. }
  66. }
  67. .aux-nav {
  68. align-self: center;
  69. }
  70. // Breadcrumb nav
  71. .breadcrumb-nav {
  72. @include mq(md) {
  73. margin-top: -$sp-4;
  74. }
  75. }
  76. .breadcrumb-nav-list {
  77. padding-left: 0;
  78. margin-bottom: $sp-3;
  79. list-style: none;
  80. }
  81. .breadcrumb-nav-list-item {
  82. display: table-cell;
  83. @include fs-2;
  84. &::before {
  85. display: none;
  86. }
  87. &::after {
  88. display: inline-block;
  89. margin-right: $sp-2;
  90. margin-left: $sp-2;
  91. color: $grey-dk-000;
  92. content: "/";
  93. }
  94. &:last-child {
  95. &::after {
  96. content: "";
  97. }
  98. }
  99. }