base.css

Set base styles for the off-canvas dialog.

@internal

File

core/misc/dialog/off-canvas/css/base.css

View source
  1. /*
  2. * DO NOT EDIT THIS FILE.
  3. * See the following change record for more information,
  4. * https://www.drupal.org/node/3084859
  5. * @preserve
  6. */
  7. /**
  8. * @file
  9. * Set base styles for the off-canvas dialog.
  10. *
  11. * @internal
  12. */
  13. #drupal-off-canvas-wrapper {
  14. --off-canvas-background-color-light: #666;
  15. --off-canvas-background-color-medium: #444;
  16. --off-canvas-background-color-dark: #333;
  17. --off-canvas-background-color: var(--off-canvas-background-color-medium);
  18. --off-canvas-padding: 1.25rem;
  19. --off-canvas-text-color: #e5e5e5;
  20. --off-canvas-link-color: #85bef4;
  21. --off-canvas-border-color: #666;
  22. --off-canvas-font-family: "Lucida Grande", "Lucida Sans Unicode", "liberation sans", sans-serif;
  23. --off-canvas-vertical-spacing-unit: 0.5rem;
  24. --off-canvas-focus-outline-width: 2px;
  25. --off-canvas-focus-outline-color: #fff;
  26. padding: 0 var(--off-canvas-padding) var(--off-canvas-padding);
  27. color: var(--off-canvas-text-color);
  28. background-color: var(--off-canvas-background-color);
  29. font-family: var(--off-canvas-font-family);
  30. & *:focus {
  31. outline: solid var(--off-canvas-focus-outline-width) var(--off-canvas-focus-outline-color);
  32. outline-offset: 2px;
  33. }
  34. & a,
  35. & .link {
  36. -webkit-text-decoration: none;
  37. text-decoration: none;
  38. color: var(--off-canvas-link-color);
  39. }
  40. & hr {
  41. height: 1px;
  42. background: var(--off-canvas-border-color);
  43. }
  44. & h1,
  45. & .heading-a {
  46. font-size: 1.4375rem;
  47. line-height: 1.2;
  48. }
  49. & h2,
  50. & .heading-b {
  51. margin: var(--off-canvas-vertical-spacing-unit) 0;
  52. font-size: 1.1875rem;
  53. }
  54. & h3,
  55. & .heading-c {
  56. margin: var(--off-canvas-vertical-spacing-unit) 0;
  57. font-size: 1.0625rem;
  58. }
  59. & h4,
  60. & .heading-d {
  61. margin: var(--off-canvas-vertical-spacing-unit) 0;
  62. font-size: 1rem;
  63. }
  64. & h5,
  65. & .heading-e,
  66. & h6,
  67. & .heading-f {
  68. margin: var(--off-canvas-vertical-spacing-unit) 0;
  69. font-size: 0.9375rem;
  70. }
  71. & p {
  72. margin: var(--off-canvas-vertical-spacing-unit) 0;
  73. }
  74. & img {
  75. max-width: 100%;
  76. height: auto;
  77. }
  78. & .links {
  79. margin: 0;
  80. padding: 0;
  81. list-style: none;
  82. & li {
  83. margin: calc(var(--off-canvas-vertical-spacing-unit) / 2) 0;
  84. }
  85. }
  86. }

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