_reset.scss 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291
  1. @use '../settings';
  2. /*!
  3. * ress.css • v2.0.4
  4. * MIT License
  5. * github.com/filipelinhares/ress
  6. */
  7. @if (settings.$reset) {
  8. /* # =================================================================
  9. # Global selectors
  10. # ================================================================= */
  11. html {
  12. box-sizing: border-box;
  13. overflow-y: scroll; /* All browsers without overlaying scrollbars */
  14. -webkit-text-size-adjust: 100%; /* Prevent adjustments of font size after orientation changes in iOS */
  15. word-break: normal;
  16. -moz-tab-size: 4;
  17. tab-size: 4;
  18. }
  19. *,
  20. ::before,
  21. ::after {
  22. background-repeat: no-repeat; /* Set `background-repeat: no-repeat` to all elements and pseudo elements */
  23. box-sizing: inherit;
  24. }
  25. ::before,
  26. ::after {
  27. text-decoration: inherit; /* Inherit text-decoration and vertical align to ::before and ::after pseudo elements */
  28. vertical-align: inherit;
  29. }
  30. * {
  31. padding: 0; /* Reset `padding` and `margin` of all elements */
  32. margin: 0;
  33. }
  34. /* # =================================================================
  35. # General elements
  36. # ================================================================= */
  37. hr {
  38. overflow: visible; /* Show the overflow in Edge and IE */
  39. height: 0; /* Add the correct box sizing in Firefox */
  40. }
  41. details,
  42. main {
  43. display: block; /* Render the `main` element consistently in IE. */
  44. }
  45. summary {
  46. display: list-item; /* Add the correct display in all browsers */
  47. }
  48. small {
  49. font-size: 80%; /* Set font-size to 80% in `small` elements */
  50. }
  51. [hidden] {
  52. display: none; /* Add the correct display in IE */
  53. }
  54. abbr[title] {
  55. border-bottom: none; /* Remove the bottom border in Chrome 57 */
  56. /* Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari */
  57. text-decoration: underline;
  58. text-decoration: underline dotted;
  59. }
  60. a {
  61. background-color: transparent; /* Remove the gray background on active links in IE 10 */
  62. }
  63. a:active,
  64. a:hover {
  65. outline-width: 0; /* Remove the outline when hovering in all browsers */
  66. }
  67. code,
  68. kbd,
  69. pre,
  70. samp {
  71. font-family: monospace, monospace; /* Specify the font family of code elements */
  72. }
  73. pre {
  74. font-size: 1em; /* Correct the odd `em` font sizing in all browsers */
  75. }
  76. b,
  77. strong {
  78. font-weight: bolder; /* Add the correct font weight in Chrome, Edge, and Safari */
  79. }
  80. /* https://gist.github.com/unruthless/413930 */
  81. sub,
  82. sup {
  83. font-size: 75%;
  84. line-height: 0;
  85. position: relative;
  86. vertical-align: baseline;
  87. }
  88. sub {
  89. bottom: -0.25em;
  90. }
  91. sup {
  92. top: -0.5em;
  93. }
  94. /* # =================================================================
  95. # Forms
  96. # ================================================================= */
  97. input {
  98. border-radius: 0;
  99. }
  100. /* Replace pointer cursor in disabled elements */
  101. [disabled] {
  102. cursor: default;
  103. }
  104. [type="number"]::-webkit-inner-spin-button,
  105. [type="number"]::-webkit-outer-spin-button {
  106. height: auto; /* Correct the cursor style of increment and decrement buttons in Chrome */
  107. }
  108. [type="search"] {
  109. -webkit-appearance: textfield; /* Correct the odd appearance in Chrome and Safari */
  110. outline-offset: -2px; /* Correct the outline style in Safari */
  111. }
  112. [type="search"]::-webkit-search-cancel-button,
  113. [type="search"]::-webkit-search-decoration {
  114. -webkit-appearance: none; /* Remove the inner padding in Chrome and Safari on macOS */
  115. }
  116. textarea {
  117. overflow: auto; /* Internet Explorer 11+ */
  118. resize: vertical; /* Specify textarea resizability */
  119. }
  120. button,
  121. input,
  122. optgroup,
  123. select,
  124. textarea {
  125. font: inherit; /* Specify font inheritance of form elements */
  126. }
  127. optgroup {
  128. font-weight: bold; /* Restore the font weight unset by the previous rule */
  129. }
  130. button {
  131. overflow: visible; /* Address `overflow` set to `hidden` in IE 8/9/10/11 */
  132. }
  133. button,
  134. select {
  135. text-transform: none; /* Firefox 40+, Internet Explorer 11- */
  136. }
  137. /* Apply cursor pointer to button elements */
  138. button,
  139. [type="button"],
  140. [type="reset"],
  141. [type="submit"],
  142. [role="button"] {
  143. cursor: pointer;
  144. color: inherit;
  145. }
  146. /* Remove inner padding and border in Firefox 4+ */
  147. button::-moz-focus-inner,
  148. [type="button"]::-moz-focus-inner,
  149. [type="reset"]::-moz-focus-inner,
  150. [type="submit"]::-moz-focus-inner {
  151. border-style: none;
  152. padding: 0;
  153. }
  154. /* Replace focus style removed in the border reset above */
  155. button:-moz-focusring,
  156. [type="button"]::-moz-focus-inner,
  157. [type="reset"]::-moz-focus-inner,
  158. [type="submit"]::-moz-focus-inner {
  159. outline: 1px dotted ButtonText;
  160. }
  161. button,
  162. html [type="button"], /* Prevent a WebKit bug where (2) destroys native `audio` and `video`controls in Android 4 */
  163. [type="reset"],
  164. [type="submit"] {
  165. -webkit-appearance: button; /* Correct the inability to style clickable types in iOS */
  166. }
  167. /* Remove the default button styling in all browsers */
  168. button,
  169. input,
  170. select,
  171. textarea {
  172. background-color: transparent;
  173. border-style: none;
  174. }
  175. /* Style select like a standard input */
  176. select {
  177. -moz-appearance: none; /* Firefox 36+ */
  178. -webkit-appearance: none; /* Chrome 41+ */
  179. }
  180. select::-ms-expand {
  181. display: none; /* Internet Explorer 11+ */
  182. }
  183. select::-ms-value {
  184. color: currentColor; /* Internet Explorer 11+ */
  185. }
  186. legend {
  187. border: 0; /* Correct `color` not being inherited in IE 8/9/10/11 */
  188. color: inherit; /* Correct the color inheritance from `fieldset` elements in IE */
  189. display: table; /* Correct the text wrapping in Edge and IE */
  190. max-width: 100%; /* Correct the text wrapping in Edge and IE */
  191. white-space: normal; /* Correct the text wrapping in Edge and IE */
  192. max-width: 100%; /* Correct the text wrapping in Edge 18- and IE */
  193. }
  194. ::-webkit-file-upload-button {
  195. /* Correct the inability to style clickable types in iOS and Safari */
  196. -webkit-appearance: button;
  197. color: inherit;
  198. font: inherit; /* Change font properties to `inherit` in Chrome and Safari */
  199. }
  200. // Remove default password icon in EdgeHTML (#537)
  201. ::-ms-clear,
  202. ::-ms-reveal {
  203. display: none
  204. }
  205. /* # =================================================================
  206. # Specify media element style
  207. # ================================================================= */
  208. img {
  209. border-style: none; /* Remove border when inside `a` element in IE 8/9/10 */
  210. }
  211. /* Add the correct vertical alignment in Chrome, Firefox, and Opera */
  212. progress {
  213. vertical-align: baseline;
  214. }
  215. /* # =================================================================
  216. # Accessibility
  217. # ================================================================= */
  218. /* Hide content from screens but not screenreaders */
  219. @media screen {
  220. [hidden~="screen"] {
  221. display: inherit;
  222. }
  223. [hidden~="screen"]:not(:active):not(:focus):not(:target) {
  224. position: absolute !important;
  225. clip: rect(0 0 0 0) !important;
  226. }
  227. }
  228. /* Specify the progress cursor of updating elements */
  229. [aria-busy="true"] {
  230. cursor: progress;
  231. }
  232. /* Specify the pointer cursor of trigger elements */
  233. [aria-controls] {
  234. cursor: pointer;
  235. }
  236. /* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */
  237. [aria-disabled="true"] {
  238. cursor: default;
  239. }
  240. }