diff --git a/scss/_normalize.scss b/scss/_normalize.scss index c4df66618ba2..6bafd53f63a5 100644 --- a/scss/_normalize.scss +++ b/scss/_normalize.scss @@ -1,11 +1,15 @@ -/*! normalize.css v4.2.0 | MIT License | github.com/necolas/normalize.css */ +/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */ // // 1. Change the default font family in all browsers (opinionated). // 2. Correct the line height in all browsers. -// 3. Prevent adjustments of font size after orientation changes in IE and iOS. +// 3. Prevent adjustments of font size after orientation changes in +// IE on Windows Phone and in iOS. // +// Document +// ========================================================================== + html { font-family: sans-serif; // 1 line-height: 1.15; // 2 @@ -13,6 +17,9 @@ html { -webkit-text-size-adjust: 100%; // 3 } +// Sections +// ========================================================================== + // // Remove the margin in all browsers (opinionated). // @@ -21,69 +28,73 @@ body { margin: 0; } -// HTML5 display definitions -// ========================================================================== - // // Add the correct display in IE 9-. -// 1. Add the correct display in Edge, IE, and Firefox. -// 2. Add the correct display in IE. // article, aside, -details, // 1 -figcaption, -figure, footer, header, -main, // 2 -menu, nav, -section, -summary { // 1 +section { display: block; } +// +// Correct the font size and margin on `h1` elements within `section` and +// `article` contexts in Chrome, Firefox, and Safari. +// + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +// Grouping content +// ========================================================================== + // // Add the correct display in IE 9-. +// 1. Add the correct display in IE. // -audio, -canvas, -progress, -video { - display: inline-block; +figcaption, +figure, +main { // 1 + display: block; } // -// Add the correct display in iOS 4-7. +// Add the correct margin in IE 8. // -audio:not([controls]) { - display: none; - height: 0; +figure { + margin: 1em 40px; } // -// Add the correct vertical alignment in Chrome, Firefox, and Opera. +// 1. Add the correct box sizing in Firefox. +// 2. Show the overflow in Edge and IE. // -progress { - vertical-align: baseline; +hr { + box-sizing: content-box; // 1 + height: 0; // 1 + overflow: visible; // 2 } // -// Add the correct display in IE 10-. -// 1. Add the correct display in IE. +// 1. Correct the inheritance and scaling of font size in all browsers. +// 2. Correct the odd `em` font sizing in all browsers. // -template, // 1 -[hidden] { - display: none; +pre { + font-family: monospace, monospace; // 1 + font-size: 1em; // 2 } -// Links +// Text-level semantics // ========================================================================== // @@ -106,9 +117,6 @@ a:hover { outline-width: 0; } -// Text-level semantics -// ========================================================================== - // // 1. Remove the bottom border in Firefox 39-. // 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. @@ -139,21 +147,23 @@ strong { } // -// Add the correct font style in Android 4.3-. +// 1. Correct the inheritance and scaling of font size in all browsers. +// 2. Correct the odd `em` font sizing in all browsers. // -dfn { - font-style: italic; +code, +kbd, +samp { + font-family: monospace, monospace; // 1 + font-size: 1em; // 2 } // -// Correct the font size and margin on `h1` elements within `section` and -// `article` contexts in Chrome, Firefox, and Safari. +// Add the correct font style in Android 4.3-. // -h1 { - font-size: 2em; - margin: 0.67em 0; +dfn { + font-style: italic; } // @@ -198,61 +208,44 @@ sup { // ========================================================================== // -// Remove the border on images inside links in IE 10-. -// - -img { - border-style: none; -} - -// -// Hide the overflow in IE. +// Add the correct display in IE 9-. // -svg:not(:root) { - overflow: hidden; +audio, +video { + display: inline-block; } -// Grouping content -// ========================================================================== - // -// 1. Correct the inheritance and scaling of font size in all browsers. -// 2. Correct the odd `em` font sizing in all browsers. +// Add the correct display in iOS 4-7. // -code, -kbd, -pre, -samp { - font-family: monospace, monospace; // 1 - font-size: 1em; // 2 +audio:not([controls]) { + display: none; + height: 0; } // -// Add the correct margin in IE 8. +// Remove the border on images inside links in IE 10-. // -figure { - margin: 1em 40px; +img { + border-style: none; } // -// 1. Add the correct box sizing in Firefox. -// 2. Show the overflow in Edge and IE. +// Hide the overflow in IE. // -hr { - box-sizing: content-box; // 1 - height: 0; // 1 - overflow: visible; // 2 +svg:not(:root) { + overflow: hidden; } // Forms // ========================================================================== // -// 1. Change font properties to `inherit` in all browsers (opinionated). +// 1. Change the font styles in all browsers (opinionated). // 2. Remove the margin in Firefox and Safari. // @@ -261,18 +254,12 @@ input, optgroup, select, textarea { - font: inherit; // 1 + font-family: sans-serif; // 1 + font-size: 100%; // 1 + line-height: 1.15; // 1 margin: 0; // 2 } -// -// Restore the font weight unset by the previous rule. -// - -optgroup { - font-weight: $font-weight-bold; -} - // // Show the overflow in IE. // 1. Show the overflow in Edge. @@ -355,6 +342,16 @@ legend { white-space: normal; // 1 } +// +// 1. Add the correct display in IE 9-. +// 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. +// + +progress { + display: inline-block; // 1 + vertical-align: baseline; // 2 +} + // // Remove the default vertical scrollbar in IE. // @@ -394,7 +391,7 @@ textarea { } // -// Remove the inner padding and cancel buttons in Chrome and Safari on OS X. +// Remove the inner padding and cancel buttons in Chrome and Safari on macOS. // [type="search"]::-webkit-search-cancel-button, @@ -402,15 +399,6 @@ textarea { -webkit-appearance: none; } -// -// Correct the text style of placeholders in Chrome, Edge, and Safari. -// - -::-webkit-input-placeholder { - color: inherit; - opacity: 0.54; -} - // // 1. Correct the inability to style clickable types in iOS and Safari. // 2. Change font properties to `inherit` in Safari. @@ -420,3 +408,54 @@ textarea { -webkit-appearance: button; // 1 font: inherit; // 2 } + +// Interactive +// ========================================================================== + +// +// Add the correct display in IE 9-. +// 1. Add the correct display in Edge, IE, and Firefox. +// + +details, // 1 +menu { + display: block; +} + +// +// Add the correct display in all browsers. +// + +summary { + display: list-item; +} + +// Scripting +// ========================================================================== + +// +// Add the correct display in IE 9-. +// + +canvas { + display: inline-block; +} + +// +// Add the correct display in IE. +// + +template { + display: none; +} + +// Hidden +// ========================================================================== + +// +// Add the correct display in IE 10-. +// + +[hidden] { + display: none; +}