diff options
Diffstat (limited to 'assets/css')
| -rw-r--r-- | assets/css/grid.css | 852 | ||||
| -rw-r--r-- | assets/css/main.css | 35 | ||||
| -rw-r--r-- | assets/css/main.sass | 68 | ||||
| -rw-r--r-- | assets/css/normalize.css | 549 |
4 files changed, 309 insertions, 1195 deletions
diff --git a/assets/css/grid.css b/assets/css/grid.css deleted file mode 100644 index 7e27ea9..0000000 --- a/assets/css/grid.css +++ /dev/null @@ -1,852 +0,0 @@ -.container, -.container-fluid { - margin-right: auto; - margin-left: auto -} - -.container-fluid { - padding-right: 2rem; - padding-left: 2rem -} - -.row { - box-sizing: border-box; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-flex: 0; - -ms-flex: 0 1 auto; - flex: 0 1 auto; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - margin-right: -.5rem; - margin-left: -.5rem -} - -.row.reverse { - -webkit-box-orient: horizontal; - -webkit-box-direction: reverse; - -ms-flex-direction: row-reverse; - flex-direction: row-reverse -} - -.col.reverse { - -webkit-box-orient: vertical; - -webkit-box-direction: reverse; - -ms-flex-direction: column-reverse; - flex-direction: column-reverse -} - -.col-xs, -.col-xs-1, -.col-xs-10, -.col-xs-11, -.col-xs-12, -.col-xs-2, -.col-xs-3, -.col-xs-4, -.col-xs-5, -.col-xs-6, -.col-xs-7, -.col-xs-8, -.col-xs-9, -.col-xs-offset-0, -.col-xs-offset-1, -.col-xs-offset-10, -.col-xs-offset-11, -.col-xs-offset-12, -.col-xs-offset-2, -.col-xs-offset-3, -.col-xs-offset-4, -.col-xs-offset-5, -.col-xs-offset-6, -.col-xs-offset-7, -.col-xs-offset-8, -.col-xs-offset-9 { - box-sizing: border-box; - -webkit-box-flex: 0; - -ms-flex: 0 0 auto; - flex: 0 0 auto; - padding-right: .5rem; - padding-left: .5rem -} - -.col-xs { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-preferred-size: 0; - flex-basis: 0; - max-width: 100% -} - -.col-xs-1 { - -ms-flex-preferred-size: 8.33333333%; - flex-basis: 8.33333333%; - max-width: 8.33333333% -} - -.col-xs-2 { - -ms-flex-preferred-size: 16.66666667%; - flex-basis: 16.66666667%; - max-width: 16.66666667% -} - -.col-xs-3 { - -ms-flex-preferred-size: 25%; - flex-basis: 25%; - max-width: 25% -} - -.col-xs-4 { - -ms-flex-preferred-size: 33.33333333%; - flex-basis: 33.33333333%; - max-width: 33.33333333% -} - -.col-xs-5 { - -ms-flex-preferred-size: 41.66666667%; - flex-basis: 41.66666667%; - max-width: 41.66666667% -} - -.col-xs-6 { - -ms-flex-preferred-size: 50%; - flex-basis: 50%; - max-width: 50% -} - -.col-xs-7 { - -ms-flex-preferred-size: 58.33333333%; - flex-basis: 58.33333333%; - max-width: 58.33333333% -} - -.col-xs-8 { - -ms-flex-preferred-size: 66.66666667%; - flex-basis: 66.66666667%; - max-width: 66.66666667% -} - -.col-xs-9 { - -ms-flex-preferred-size: 75%; - flex-basis: 75%; - max-width: 75% -} - -.col-xs-10 { - -ms-flex-preferred-size: 83.33333333%; - flex-basis: 83.33333333%; - max-width: 83.33333333% -} - -.col-xs-11 { - -ms-flex-preferred-size: 91.66666667%; - flex-basis: 91.66666667%; - max-width: 91.66666667% -} - -.col-xs-12 { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100% -} - -.col-xs-offset-0 { - margin-left: 0 -} - -.col-xs-offset-1 { - margin-left: 8.33333333% -} - -.col-xs-offset-2 { - margin-left: 16.66666667% -} - -.col-xs-offset-3 { - margin-left: 25% -} - -.col-xs-offset-4 { - margin-left: 33.33333333% -} - -.col-xs-offset-5 { - margin-left: 41.66666667% -} - -.col-xs-offset-6 { - margin-left: 50% -} - -.col-xs-offset-7 { - margin-left: 58.33333333% -} - -.col-xs-offset-8 { - margin-left: 66.66666667% -} - -.col-xs-offset-9 { - margin-left: 75% -} - -.col-xs-offset-10 { - margin-left: 83.33333333% -} - -.col-xs-offset-11 { - margin-left: 91.66666667% -} - -.start-xs { - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; - text-align: start -} - -.center-xs { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - text-align: center -} - -.end-xs { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; - text-align: end -} - -.top-xs { - -webkit-box-align: start; - -ms-flex-align: start; - align-items: flex-start -} - -.middle-xs { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center -} - -.bottom-xs { - -webkit-box-align: end; - -ms-flex-align: end; - align-items: flex-end -} - -.around-xs { - -ms-flex-pack: distribute; - justify-content: space-around -} - -.between-xs { - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between -} - -.first-xs { - -webkit-box-ordinal-group: 0; - -ms-flex-order: -1; - order: -1 -} - -.last-xs { - -webkit-box-ordinal-group: 2; - -ms-flex-order: 1; - order: 1 -} - -@media only screen and (min-width:48em) { - .container { - width: 49rem - } - .col-sm, - .col-sm-1, - .col-sm-10, - .col-sm-11, - .col-sm-12, - .col-sm-2, - .col-sm-3, - .col-sm-4, - .col-sm-5, - .col-sm-6, - .col-sm-7, - .col-sm-8, - .col-sm-9, - .col-sm-offset-0, - .col-sm-offset-1, - .col-sm-offset-10, - .col-sm-offset-11, - .col-sm-offset-12, - .col-sm-offset-2, - .col-sm-offset-3, - .col-sm-offset-4, - .col-sm-offset-5, - .col-sm-offset-6, - .col-sm-offset-7, - .col-sm-offset-8, - .col-sm-offset-9 { - box-sizing: border-box; - -webkit-box-flex: 0; - -ms-flex: 0 0 auto; - flex: 0 0 auto; - padding-right: .5rem; - padding-left: .5rem - } - .col-sm { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-preferred-size: 0; - flex-basis: 0; - max-width: 100% - } - .col-sm-1 { - -ms-flex-preferred-size: 8.33333333%; - flex-basis: 8.33333333%; - max-width: 8.33333333% - } - .col-sm-2 { - -ms-flex-preferred-size: 16.66666667%; - flex-basis: 16.66666667%; - max-width: 16.66666667% - } - .col-sm-3 { - -ms-flex-preferred-size: 25%; - flex-basis: 25%; - max-width: 25% - } - .col-sm-4 { - -ms-flex-preferred-size: 33.33333333%; - flex-basis: 33.33333333%; - max-width: 33.33333333% - } - .col-sm-5 { - -ms-flex-preferred-size: 41.66666667%; - flex-basis: 41.66666667%; - max-width: 41.66666667% - } - .col-sm-6 { - -ms-flex-preferred-size: 50%; - flex-basis: 50%; - max-width: 50% - } - .col-sm-7 { - -ms-flex-preferred-size: 58.33333333%; - flex-basis: 58.33333333%; - max-width: 58.33333333% - } - .col-sm-8 { - -ms-flex-preferred-size: 66.66666667%; - flex-basis: 66.66666667%; - max-width: 66.66666667% - } - .col-sm-9 { - -ms-flex-preferred-size: 75%; - flex-basis: 75%; - max-width: 75% - } - .col-sm-10 { - -ms-flex-preferred-size: 83.33333333%; - flex-basis: 83.33333333%; - max-width: 83.33333333% - } - .col-sm-11 { - -ms-flex-preferred-size: 91.66666667%; - flex-basis: 91.66666667%; - max-width: 91.66666667% - } - .col-sm-12 { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100% - } - .col-sm-offset-0 { - margin-left: 0 - } - .col-sm-offset-1 { - margin-left: 8.33333333% - } - .col-sm-offset-2 { - margin-left: 16.66666667% - } - .col-sm-offset-3 { - margin-left: 25% - } - .col-sm-offset-4 { - margin-left: 33.33333333% - } - .col-sm-offset-5 { - margin-left: 41.66666667% - } - .col-sm-offset-6 { - margin-left: 50% - } - .col-sm-offset-7 { - margin-left: 58.33333333% - } - .col-sm-offset-8 { - margin-left: 66.66666667% - } - .col-sm-offset-9 { - margin-left: 75% - } - .col-sm-offset-10 { - margin-left: 83.33333333% - } - .col-sm-offset-11 { - margin-left: 91.66666667% - } - .start-sm { - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; - text-align: start - } - .center-sm { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - text-align: center - } - .end-sm { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; - text-align: end - } - .top-sm { - -webkit-box-align: start; - -ms-flex-align: start; - align-items: flex-start - } - .middle-sm { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center - } - .bottom-sm { - -webkit-box-align: end; - -ms-flex-align: end; - align-items: flex-end - } - .around-sm { - -ms-flex-pack: distribute; - justify-content: space-around - } - .between-sm { - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between - } - .first-sm { - -webkit-box-ordinal-group: 0; - -ms-flex-order: -1; - order: -1 - } - .last-sm { - -webkit-box-ordinal-group: 2; - -ms-flex-order: 1; - order: 1 - } -} - -@media only screen and (min-width:64em) { - .container { - width: 65rem - } - .col-md, - .col-md-1, - .col-md-10, - .col-md-11, - .col-md-12, - .col-md-2, - .col-md-3, - .col-md-4, - .col-md-5, - .col-md-6, - .col-md-7, - .col-md-8, - .col-md-9, - .col-md-offset-0, - .col-md-offset-1, - .col-md-offset-10, - .col-md-offset-11, - .col-md-offset-12, - .col-md-offset-2, - .col-md-offset-3, - .col-md-offset-4, - .col-md-offset-5, - .col-md-offset-6, - .col-md-offset-7, - .col-md-offset-8, - .col-md-offset-9 { - box-sizing: border-box; - -webkit-box-flex: 0; - -ms-flex: 0 0 auto; - flex: 0 0 auto; - padding-right: .5rem; - padding-left: .5rem - } - .col-md { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-preferred-size: 0; - flex-basis: 0; - max-width: 100% - } - .col-md-1 { - -ms-flex-preferred-size: 8.33333333%; - flex-basis: 8.33333333%; - max-width: 8.33333333% - } - .col-md-2 { - -ms-flex-preferred-size: 16.66666667%; - flex-basis: 16.66666667%; - max-width: 16.66666667% - } - .col-md-3 { - -ms-flex-preferred-size: 25%; - flex-basis: 25%; - max-width: 25% - } - .col-md-4 { - -ms-flex-preferred-size: 33.33333333%; - flex-basis: 33.33333333%; - max-width: 33.33333333% - } - .col-md-5 { - -ms-flex-preferred-size: 41.66666667%; - flex-basis: 41.66666667%; - max-width: 41.66666667% - } - .col-md-6 { - -ms-flex-preferred-size: 50%; - flex-basis: 50%; - max-width: 50% - } - .col-md-7 { - -ms-flex-preferred-size: 58.33333333%; - flex-basis: 58.33333333%; - max-width: 58.33333333% - } - .col-md-8 { - -ms-flex-preferred-size: 66.66666667%; - flex-basis: 66.66666667%; - max-width: 66.66666667% - } - .col-md-9 { - -ms-flex-preferred-size: 75%; - flex-basis: 75%; - max-width: 75% - } - .col-md-10 { - -ms-flex-preferred-size: 83.33333333%; - flex-basis: 83.33333333%; - max-width: 83.33333333% - } - .col-md-11 { - -ms-flex-preferred-size: 91.66666667%; - flex-basis: 91.66666667%; - max-width: 91.66666667% - } - .col-md-12 { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100% - } - .col-md-offset-0 { - margin-left: 0 - } - .col-md-offset-1 { - margin-left: 8.33333333% - } - .col-md-offset-2 { - margin-left: 16.66666667% - } - .col-md-offset-3 { - margin-left: 25% - } - .col-md-offset-4 { - margin-left: 33.33333333% - } - .col-md-offset-5 { - margin-left: 41.66666667% - } - .col-md-offset-6 { - margin-left: 50% - } - .col-md-offset-7 { - margin-left: 58.33333333% - } - .col-md-offset-8 { - margin-left: 66.66666667% - } - .col-md-offset-9 { - margin-left: 75% - } - .col-md-offset-10 { - margin-left: 83.33333333% - } - .col-md-offset-11 { - margin-left: 91.66666667% - } - .start-md { - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; - text-align: start - } - .center-md { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - text-align: center - } - .end-md { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; - text-align: end - } - .top-md { - -webkit-box-align: start; - -ms-flex-align: start; - align-items: flex-start - } - .middle-md { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center - } - .bottom-md { - -webkit-box-align: end; - -ms-flex-align: end; - align-items: flex-end - } - .around-md { - -ms-flex-pack: distribute; - justify-content: space-around - } - .between-md { - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between - } - .first-md { - -webkit-box-ordinal-group: 0; - -ms-flex-order: -1; - order: -1 - } - .last-md { - -webkit-box-ordinal-group: 2; - -ms-flex-order: 1; - order: 1 - } -} - -@media only screen and (min-width:75em) { - .container { - width: 76rem - } - .col-lg, - .col-lg-1, - .col-lg-10, - .col-lg-11, - .col-lg-12, - .col-lg-2, - .col-lg-3, - .col-lg-4, - .col-lg-5, - .col-lg-6, - .col-lg-7, - .col-lg-8, - .col-lg-9, - .col-lg-offset-0, - .col-lg-offset-1, - .col-lg-offset-10, - .col-lg-offset-11, - .col-lg-offset-12, - .col-lg-offset-2, - .col-lg-offset-3, - .col-lg-offset-4, - .col-lg-offset-5, - .col-lg-offset-6, - .col-lg-offset-7, - .col-lg-offset-8, - .col-lg-offset-9 { - box-sizing: border-box; - -webkit-box-flex: 0; - -ms-flex: 0 0 auto; - flex: 0 0 auto; - padding-right: .5rem; - padding-left: .5rem - } - .col-lg { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-preferred-size: 0; - flex-basis: 0; - max-width: 100% - } - .col-lg-1 { - -ms-flex-preferred-size: 8.33333333%; - flex-basis: 8.33333333%; - max-width: 8.33333333% - } - .col-lg-2 { - -ms-flex-preferred-size: 16.66666667%; - flex-basis: 16.66666667%; - max-width: 16.66666667% - } - .col-lg-3 { - -ms-flex-preferred-size: 25%; - flex-basis: 25%; - max-width: 25% - } - .col-lg-4 { - -ms-flex-preferred-size: 33.33333333%; - flex-basis: 33.33333333%; - max-width: 33.33333333% - } - .col-lg-5 { - -ms-flex-preferred-size: 41.66666667%; - flex-basis: 41.66666667%; - max-width: 41.66666667% - } - .col-lg-6 { - -ms-flex-preferred-size: 50%; - flex-basis: 50%; - max-width: 50% - } - .col-lg-7 { - -ms-flex-preferred-size: 58.33333333%; - flex-basis: 58.33333333%; - max-width: 58.33333333% - } - .col-lg-8 { - -ms-flex-preferred-size: 66.66666667%; - flex-basis: 66.66666667%; - max-width: 66.66666667% - } - .col-lg-9 { - -ms-flex-preferred-size: 75%; - flex-basis: 75%; - max-width: 75% - } - .col-lg-10 { - -ms-flex-preferred-size: 83.33333333%; - flex-basis: 83.33333333%; - max-width: 83.33333333% - } - .col-lg-11 { - -ms-flex-preferred-size: 91.66666667%; - flex-basis: 91.66666667%; - max-width: 91.66666667% - } - .col-lg-12 { - -ms-flex-preferred-size: 100%; - flex-basis: 100%; - max-width: 100% - } - .col-lg-offset-0 { - margin-left: 0 - } - .col-lg-offset-1 { - margin-left: 8.33333333% - } - .col-lg-offset-2 { - margin-left: 16.66666667% - } - .col-lg-offset-3 { - margin-left: 25% - } - .col-lg-offset-4 { - margin-left: 33.33333333% - } - .col-lg-offset-5 { - margin-left: 41.66666667% - } - .col-lg-offset-6 { - margin-left: 50% - } - .col-lg-offset-7 { - margin-left: 58.33333333% - } - .col-lg-offset-8 { - margin-left: 66.66666667% - } - .col-lg-offset-9 { - margin-left: 75% - } - .col-lg-offset-10 { - margin-left: 83.33333333% - } - .col-lg-offset-11 { - margin-left: 91.66666667% - } - .start-lg { - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; - text-align: start - } - .center-lg { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - text-align: center - } - .end-lg { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; - text-align: end - } - .top-lg { - -webkit-box-align: start; - -ms-flex-align: start; - align-items: flex-start - } - .middle-lg { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center - } - .bottom-lg { - -webkit-box-align: end; - -ms-flex-align: end; - align-items: flex-end - } - .around-lg { - -ms-flex-pack: distribute; - justify-content: space-around - } - .between-lg { - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between - } - .first-lg { - -webkit-box-ordinal-group: 0; - -ms-flex-order: -1; - order: -1 - } - .last-lg { - -webkit-box-ordinal-group: 2; - -ms-flex-order: 1; - order: 1 - } -}
\ No newline at end of file diff --git a/assets/css/main.css b/assets/css/main.css new file mode 100644 index 0000000..805975f --- /dev/null +++ b/assets/css/main.css @@ -0,0 +1,35 @@ +/** + * Stylesheet of the Netflix Stats Generator + * @author Marvin Borner + * @copyright Marvin Borner 2019 + */ + +html, body { + padding: 8px; + font-family: "Varela Round", sans-serif !important; + text-rendering: optimizeLegibility !important; +} + +.loading, .stats { + display: none; +} + +.stats { + text-align: center; +} + +.stats > div { + padding: 8px; + margin-top: 8px; + border: 1px solid black; +} + +.heatMap { + border-collapse: collapse; +} + +.heatMap td { + width: 2vw; + height: 2vw; + border: 1px solid black; +} diff --git a/assets/css/main.sass b/assets/css/main.sass deleted file mode 100644 index 65427d3..0000000 --- a/assets/css/main.sass +++ /dev/null @@ -1,68 +0,0 @@ -/** - * Design of the Netflix Stats Generator - * @author Marvin Borner - * @copyright Marvin Borner 2018 - -//// General -$BlueColor: #1e3264 - -html, body - width: 100vw !important - background-color: #141518 - font-family: "Varela Round", sans-serif !important - text-rendering: optimizeLegibility !important - color: #bbb - box-sizing: border-box !important - overflow-x: hidden - -.Main - // display: none - min-height: 100vh - -.row:not(.MostWatchedOverview) div - border: .5px solid #25272a - -//// Charts -.MostWatchedOverview - .Description - margin: 20px - .MostWatchedPoster - height: 50% - - -/// Heatmap -.HeatmapWrap - max-width: 100vw !important - -text.month-name, -text.calendar-heatmap-legend-text, -text.day-initial - fill: #bbb - font-size: 10px - font-family: Helvetica, arial, 'Open Sans', sans-serif - - -rect.day-cell:hover - stroke: #555555 - stroke-width: 1px - - -.day-cell-tooltip - position: absolute - z-index: 9999 - padding: 5px 9px - color: #bbbbbb - font-size: 12px - background: rgba(0, 0, 0, 0.85) - border-radius: 3px - text-align: center - - -.day-cell-tooltip>span - font-family: Helvetica, arial, 'Open Sans', sans-serif - - -.calendar-heatmap - overflow: visible - box-sizing: initial - diff --git a/assets/css/normalize.css b/assets/css/normalize.css index 3c3b6b4..b532f93 100644 --- a/assets/css/normalize.css +++ b/assets/css/normalize.css @@ -11,332 +11,331 @@ html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ - } - - /* Sections - ========================================================================== */ - - /** - * Remove the margin in all browsers. - */ - - body { +} + +/* Sections + ========================================================================== */ + +/** + * Remove the margin in all browsers. + */ + +body { margin: 0; - } - - /** - * Correct the font size and margin on `h1` elements within `section` and - * `article` contexts in Chrome, Firefox, and Safari. - */ - - h1 { +} + +/** + * 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 - ========================================================================== */ - - /** - * 1. Add the correct box sizing in Firefox. - * 2. Show the overflow in Edge and IE. - */ - - hr { +} + +/* Grouping content + ========================================================================== */ + +/** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ + +hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ - } - - /** - * 1. Correct the inheritance and scaling of font size in all browsers. - * 2. Correct the odd `em` font sizing in all browsers. - */ - - pre { +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ - } - - /* Text-level semantics - ========================================================================== */ - - /** - * Remove the gray background on active links in IE 10. - */ - - a { +} + +/* Text-level semantics + ========================================================================== */ + +/** + * Remove the gray background on active links in IE 10. + */ + +a { background-color: transparent; - } - - /** - * 1. Remove the bottom border in Chrome 57- - * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. - */ - - abbr[title] { +} + +/** + * 1. Remove the bottom border in Chrome 57- + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ + +abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ - } - - /** - * Add the correct font weight in Chrome, Edge, and Safari. - */ - - b, - strong { +} + +/** + * Add the correct font weight in Chrome, Edge, and Safari. + */ + +b, +strong { font-weight: bolder; - } - - /** - * 1. Correct the inheritance and scaling of font size in all browsers. - * 2. Correct the odd `em` font sizing in all browsers. - */ - - code, - kbd, - samp { +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +code, +kbd, +samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ - } - - /** - * Add the correct font size in all browsers. - */ - - small { +} + +/** + * Add the correct font size in all browsers. + */ + +small { font-size: 80%; - } - - /** - * Prevent `sub` and `sup` elements from affecting the line height in - * all browsers. - */ - - sub, - sup { +} + +/** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ + +sub, +sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; - } - - sub { +} + +sub { bottom: -0.25em; - } - - sup { +} + +sup { top: -0.5em; - } - - /* Embedded content - ========================================================================== */ - - /** - * Remove the border on images inside links in IE 10. - */ - - img { +} + +/* Embedded content + ========================================================================== */ + +/** + * Remove the border on images inside links in IE 10. + */ + +img { border-style: none; - } - - /* Forms - ========================================================================== */ - - /** - * 1. Change the font styles in all browsers. - * 2. Remove the margin in Firefox and Safari. - */ - - button, - input, - optgroup, - select, - textarea { +} + +/* Forms + ========================================================================== */ + +/** + * 1. Change the font styles in all browsers. + * 2. Remove the margin in Firefox and Safari. + */ + +button, +input, +optgroup, +select, +textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ - } - - /** - * Show the overflow in IE. - * 1. Show the overflow in Edge. - */ - - button, - input { /* 1 */ +} + +/** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ + +button, +input { /* 1 */ overflow: visible; - } - - /** - * Remove the inheritance of text transform in Edge, Firefox, and IE. - * 1. Remove the inheritance of text transform in Firefox. - */ - - button, - select { /* 1 */ +} + +/** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ + +button, +select { /* 1 */ text-transform: none; - } - - /** - * Correct the inability to style clickable types in iOS and Safari. - */ - - button, - [type="button"], - [type="reset"], - [type="submit"] { +} + +/** + * Correct the inability to style clickable types in iOS and Safari. + */ + +button, +[type="button"], +[type="reset"], +[type="submit"] { -webkit-appearance: button; - } - - /** - * Remove the inner border and padding in Firefox. - */ - - button::-moz-focus-inner, - [type="button"]::-moz-focus-inner, - [type="reset"]::-moz-focus-inner, - [type="submit"]::-moz-focus-inner { +} + +/** + * Remove the inner border and padding in Firefox. + */ + +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { border-style: none; padding: 0; - } - - /** - * Restore the focus styles unset by the previous rule. - */ - - button:-moz-focusring, - [type="button"]:-moz-focusring, - [type="reset"]:-moz-focusring, - [type="submit"]:-moz-focusring { +} + +/** + * Restore the focus styles unset by the previous rule. + */ + +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; - } - - /** - * Correct the padding in Firefox. - */ - - fieldset { +} + +/** + * Correct the padding in Firefox. + */ + +fieldset { padding: 0.35em 0.75em 0.625em; - } - - /** - * 1. Correct the text wrapping in Edge and IE. - * 2. Correct the color inheritance from `fieldset` elements in IE. - * 3. Remove the padding so developers are not caught out when they zero out - * `fieldset` elements in all browsers. - */ - - legend { +} + +/** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ + +legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ - } - - /** - * Add the correct vertical alignment in Chrome, Firefox, and Opera. - */ - - progress { +} + +/** + * Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ + +progress { vertical-align: baseline; - } - - /** - * Remove the default vertical scrollbar in IE 10+. - */ - - textarea { +} + +/** + * Remove the default vertical scrollbar in IE 10+. + */ + +textarea { overflow: auto; - } - - /** - * 1. Add the correct box sizing in IE 10. - * 2. Remove the padding in IE 10. - */ - - [type="checkbox"], - [type="radio"] { +} + +/** + * 1. Add the correct box sizing in IE 10. + * 2. Remove the padding in IE 10. + */ + +[type="checkbox"], +[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ - } - - /** - * Correct the cursor style of increment and decrement buttons in Chrome. - */ - - [type="number"]::-webkit-inner-spin-button, - [type="number"]::-webkit-outer-spin-button { +} + +/** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ + +[type="number"]::-webkit-inner-spin-button, +[type="number"]::-webkit-outer-spin-button { height: auto; - } - - /** - * 1. Correct the odd appearance in Chrome and Safari. - * 2. Correct the outline style in Safari. - */ - - [type="search"] { +} + +/** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ + +[type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ - } - - /** - * Remove the inner padding in Chrome and Safari on macOS. - */ - - [type="search"]::-webkit-search-decoration { +} + +/** + * Remove the inner padding in Chrome and Safari on macOS. + */ + +[type="search"]::-webkit-search-decoration { -webkit-appearance: none; - } - - /** - * 1. Correct the inability to style clickable types in iOS and Safari. - * 2. Change font properties to `inherit` in Safari. - */ - - ::-webkit-file-upload-button { +} + +/** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ + +::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ - } - - /* Interactive - ========================================================================== */ - - /* - * Add the correct display in Edge, IE 10+, and Firefox. - */ - - details { +} + +/* Interactive + ========================================================================== */ + +/* + * Add the correct display in Edge, IE 10+, and Firefox. + */ + +details { display: block; - } - - /* - * Add the correct display in all browsers. - */ - - summary { +} + +/* + * Add the correct display in all browsers. + */ + +summary { display: list-item; - } - - /* Misc - ========================================================================== */ - - /** - * Add the correct display in IE 10+. - */ - - template { +} + +/* Misc + ========================================================================== */ + +/** + * Add the correct display in IE 10+. + */ + +template { display: none; - } - - /** - * Add the correct display in IE 10. - */ - - [hidden] { +} + +/** + * Add the correct display in IE 10. + */ + +[hidden] { display: none; - } -
\ No newline at end of file +} |