layout-footer.pcss.css

Same filename and directory in other branches
  1. 10 core/themes/olivero/css/layout/layout-footer.pcss.css
  2. 9 core/themes/olivero/css/layout/layout-footer.pcss.css

Grid system definition for the footer top and footer bottom layouts.

File

core/themes/olivero/css/layout/layout-footer.pcss.css

View source
  1. /**
  2. * @file
  3. * Grid system definition for the footer top and footer bottom layouts.
  4. */
  5. @import "../base/media-queries.pcss.css";
  6. /**
  7. * Creates stacking context ensuring that child elements can never appear in
  8. * front of mobile navigation.
  9. */
  10. .site-footer {
  11. position: relative;
  12. z-index: 1;
  13. }
  14. .site-footer__inner {
  15. padding-block: var(--sp2);
  16. @media (--nav) {
  17. padding-block: var(--sp4) var(--sp13);
  18. }
  19. }
  20. .region--footer_top__inner,
  21. .region--footer_bottom__inner {
  22. & > * {
  23. margin-block-end: var(--sp2);
  24. @media (--md) {
  25. flex: 1;
  26. margin-block-end: 0;
  27. &:not(:last-child) {
  28. margin-inline-end: var(--sp2);
  29. }
  30. }
  31. }
  32. @media (--md) {
  33. display: flex;
  34. flex-wrap: wrap;
  35. }
  36. }

Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.