off-canvas.base.css 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
  1. /**
  2. * @file
  3. * Set base styles for the off-canvas dialog.
  4. */
  5. /* Set some global attributes. */
  6. #drupal-off-canvas *,
  7. #drupal-off-canvas *:not(div) {
  8. background: #444;
  9. font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
  10. color: #ddd;
  11. }
  12. /* Generic elements. */
  13. #drupal-off-canvas a,
  14. #drupal-off-canvas .link {
  15. border-bottom: none;
  16. font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
  17. font-size: inherit;
  18. font-weight: normal;
  19. color: #85bef4;
  20. text-decoration: none;
  21. transition: color 0.5s ease;
  22. }
  23. #drupal-off-canvas a:focus,
  24. #drupal-off-canvas .link:focus,
  25. #drupal-off-canvas a:hover,
  26. #drupal-off-canvas .link:hover {
  27. text-decoration: underline;
  28. }
  29. #drupal-off-canvas hr {
  30. height: 1px;
  31. background: #ccc;
  32. }
  33. #drupal-off-canvas summary,
  34. #drupal-off-canvas .fieldgroup:not(.form-composite) > legend {
  35. font-weight: bold;
  36. }
  37. #drupal-off-canvas h1,
  38. #drupal-off-canvas .heading-a {
  39. display: block;
  40. font-weight: bold;
  41. font-size: 1.625em;
  42. line-height: 1.875em;
  43. }
  44. #drupal-off-canvas h2,
  45. #drupal-off-canvas .heading-b {
  46. display: block;
  47. font-weight: bold;
  48. margin: 10px 0;
  49. font-size: 1.385em;
  50. }
  51. #drupal-off-canvas h3,
  52. #drupal-off-canvas .heading-c {
  53. display: block;
  54. font-weight: bold;
  55. margin: 10px 0;
  56. font-size: 1.231em;
  57. }
  58. #drupal-off-canvas h4,
  59. #drupal-off-canvas .heading-d {
  60. display: block;
  61. font-weight: bold;
  62. margin: 10px 0;
  63. font-size: 1.154em;
  64. }
  65. #drupal-off-canvas h5,
  66. #drupal-off-canvas .heading-e {
  67. display: block;
  68. font-weight: bold;
  69. margin: 10px 0;
  70. font-size: 1.077em;
  71. }
  72. #drupal-off-canvas h6,
  73. #drupal-off-canvas .heading-f {
  74. display: block;
  75. font-weight: bold;
  76. margin: 10px 0;
  77. font-size: 1.077em;
  78. }
  79. #drupal-off-canvas p {
  80. margin: 1em 0;
  81. }
  82. #drupal-off-canvas dl {
  83. margin: 0 0 20px;
  84. }
  85. #drupal-off-canvas dl dd,
  86. #drupal-off-canvas dl dl {
  87. margin-left: 20px; /* LTR */
  88. margin-bottom: 10px;
  89. }
  90. [dir="rtl"] #drupal-off-canvas dl dd,
  91. [dir="rtl"] #drupal-off-canvas dl dl {
  92. margin-right: 20px;
  93. }
  94. #drupal-off-canvas blockquote {
  95. margin: 1em 40px;
  96. }
  97. #drupal-off-canvas address {
  98. font-style: italic;
  99. }
  100. #drupal-off-canvas u,
  101. #drupal-off-canvas ins {
  102. text-decoration: underline;
  103. }
  104. #drupal-off-canvas s,
  105. #drupal-off-canvas strike,
  106. #drupal-off-canvas del {
  107. text-decoration: line-through;
  108. }
  109. #drupal-off-canvas big {
  110. font-size: larger;
  111. }
  112. #drupal-off-canvas small {
  113. font-size: smaller;
  114. }
  115. #drupal-off-canvas sub {
  116. vertical-align: sub;
  117. font-size: smaller;
  118. line-height: normal;
  119. }
  120. #drupal-off-canvas sup {
  121. vertical-align: super;
  122. font-size: smaller;
  123. line-height: normal;
  124. }
  125. #drupal-off-canvas abbr,
  126. #drupal-off-canvas acronym {
  127. border-bottom: dotted 1px;
  128. background: transparent;
  129. }
  130. #drupal-off-canvas ul {
  131. list-style-type: disc;
  132. list-style-image: none;
  133. }
  134. [dir="rtl"] #drupal-off-canvas .messages__list {
  135. margin-right: 0;
  136. }
  137. #drupal-off-canvas ol {
  138. list-style-type: decimal;
  139. }
  140. #drupal-off-canvas ul li,
  141. #drupal-off-canvas ol li {
  142. display: block;
  143. }
  144. #drupal-off-canvas blockquote,
  145. #drupal-off-canvas code {
  146. margin: 20px 0;
  147. }
  148. #drupal-off-canvas pre {
  149. margin: 20px 0;
  150. white-space: pre-wrap;
  151. }
  152. /* Classes for hidden and visually hidden elements. See hidden.module.css. */
  153. #drupal-off-canvas .hidden {
  154. display: none;
  155. }
  156. #drupal-off-canvas .visually-hidden {
  157. position: absolute !important;
  158. clip: rect(1px, 1px, 1px, 1px);
  159. overflow: hidden;
  160. height: 1px;
  161. width: 1px;
  162. word-wrap: normal;
  163. }
  164. #drupal-off-canvas .visually-hidden.focusable:active,
  165. #drupal-off-canvas .visually-hidden.focusable:focus {
  166. position: static !important;
  167. clip: auto;
  168. overflow: visible;
  169. height: auto;
  170. width: auto;
  171. }
  172. #drupal-off-canvas .invisible {
  173. visibility: hidden;
  174. }
  175. /* Some system classes. See system.admin.css. */
  176. #drupal-off-canvas .panel {
  177. padding: 5px 5px 15px;
  178. }
  179. #drupal-off-canvas .panel__description {
  180. margin: 0 0 3px;
  181. padding: 2px 0 3px 0;
  182. }
  183. #drupal-off-canvas .compact-link {
  184. margin: 0 0 10px 0;
  185. }
  186. #drupal-off-canvas small .admin-link:before {
  187. content: ' [';
  188. }
  189. #drupal-off-canvas small .admin-link:after {
  190. content: ']';
  191. }
  192. /* Override jQuery UI */
  193. #drupal-off-canvas .ui-widget-content a {
  194. color: #85bef4 !important;
  195. }
  196. /* Message styles */
  197. #drupal-off-canvas .messages {
  198. background: no-repeat 10px 17px;
  199. }
  200. [dir="rtl"] #drupal-off-canvas .messages {
  201. background-position: right 10px top 17px;
  202. }
  203. #drupal-off-canvas .messages abbr {
  204. color: #444;
  205. }
  206. #drupal-off-canvas .messages--status {
  207. background-color: #f3faef;
  208. background-image: url(../icons/73b355/check.svg);
  209. color: #325e1c;
  210. }
  211. #drupal-off-canvas .messages--warning {
  212. background-color: #fdf8ed;
  213. background-image: url(../icons/e29700/warning.svg);
  214. color: #734c00;
  215. }
  216. #drupal-off-canvas .messages--error {
  217. background-color: #fcf4f2;
  218. background-image: url(../icons/e32700/error.svg);
  219. color: #a51b00;
  220. }
  221. #drupal-off-canvas .messages--error div[role="alert"] {
  222. background: transparent;
  223. color: inherit;
  224. }