From 83c08d993ba77ae758e2246f39b41de6232cf54c Mon Sep 17 00:00:00 2001 From: Matt Pilott Date: Sun, 23 Jan 2022 20:09:09 +0000 Subject: [PATCH 1/8] Remove IE11 and underutilised options --- index.scss | 287 ++++++++++++++------------------------------------- package.json | 8 +- reboot.css | 2 +- 3 files changed, 80 insertions(+), 217 deletions(-) diff --git a/index.scss b/index.scss index 8aa3f65..4cf5882 100644 --- a/index.scss +++ b/index.scss @@ -1,31 +1,28 @@ /*----------------------------------------------------------------------------*\ #REBOOT BROWSER STYLES - - Version: 1.10.2 + - Version: 2.0.0 - Author: Matt Pilott - Site: https://github.com/neuekit/reboot - - Copyright: 2020, Matt Pilott + - Copyright: 2022, Matt Pilott – License: MIT | http://goo.gl/p3bexl - Mentions: Based on normalize/sanitize https://goo.gl/a3DzGd \*----------------------------------------------------------------------------*/ /*----------------------------------------------------------------------------*\ - 1. Set background size to cover in all browsers (opinion). - 2. Remove repeating backgrounds in all browsers (opinion). - 3. Set background position to center apart from to pseudos (opinion). + 1. Remove repeating backgrounds in all browsers (opinion). + 2. Set background position to center apart from to pseudos (opinion). + 3. Set background size to cover in all browsers (opinion). 4. Add box sizing in all browsers (opinion). 5. Add relative positioning (opinion). \*----------------------------------------------------------------------------*/ -* { - background-size: cover; /* 1 */ -} - *, ::before, ::after { - background-repeat: no-repeat; /* 2 */ - background-position: center; /* 3 */ + background-repeat: no-repeat; /* 1 */ + background-position: center; /* 2 */ + background-size: cover; /* 3 */ box-sizing: border-box; /* 4 */ position: relative; /* 5 */ } @@ -63,11 +60,21 @@ html { /*----------------------------------------------------------------------------*\ - Remove margin in all browsers. (opinion) + 1. Set default font stack to leverage systom font (opinion) + 2. Remove margin in all browsers. (opinion) \*----------------------------------------------------------------------------*/ body { - margin: 0; + font-family: system-ui, + -apple-system, + 'Segoe UI', + Roboto, + Helvetica, + Arial, + sans-serif, + 'Apple Color Emoji', + 'Segoe UI Emoji'; /* 1 */ + margin: 0; /* 2 */ } @@ -83,41 +90,13 @@ h1 { /*----------------------------------------------------------------------------*\ - Remove the margin on nested lists in Chrome, Edge, IE, and Safari. -\*----------------------------------------------------------------------------*/ - -dl dl, -dl ol, -dl ul, -ol dl, -ul dl, -ol ol, -ol ul, -ul ol, -ul ul { - margin: 0; -} - - -/*----------------------------------------------------------------------------*\ - 1. Add the correct box sizing in Firefox. - 2. Show the overflow in Edge and IE. + 1. Correct the inheritance of border color in Firefox. + 2. Add the correct box sizing in Firefox. \*----------------------------------------------------------------------------*/ hr { - height: 0; /* 1 */ - overflow: visible; /* 2 */ -} - - -/*----------------------------------------------------------------------------*\ - Render the `main` element consistently in IE. - Add the correct display in Edge, IE 10+, and Firefox. -\*----------------------------------------------------------------------------*/ - -main, -details { - display: block; + color: inherit; /* 1 */ + height: 0; /* 2 */ } @@ -133,7 +112,7 @@ nav ul { /*----------------------------------------------------------------------------*\ - 1. Correct font sizing inheritance and scaling in all browsers. + 1. Set default font stack to leverage systom font (opinion) 2. Correct the odd `em` font sizing in all browsers. \*----------------------------------------------------------------------------*/ @@ -141,17 +120,21 @@ code, kbd, pre, samp { - font-family: monospace, monospace; /* 1 */ - font-size: 1em; /* 2 */ + font-family: ui-monospace, + SFMono-Regular, + Consolas, + 'Liberation Mono', + Menlo, + monospace; /* 1 */ + font-size: 1em; /* 2 */ } /*----------------------------------------------------------------------------*\ - Add the correct text decoration in Edge, IE, Opera, and Safari. + Add the correct text decoration in Edge, Opera, and Safari. \*----------------------------------------------------------------------------*/ abbr[title] { - text-decoration: underline; text-decoration: underline dotted; } @@ -175,6 +158,27 @@ small { } +/*----------------------------------------------------------------------------*\ + Stop 'sub' and 'sup' elements affecting line height in all browsers. +\*----------------------------------------------------------------------------*/ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + + /*----------------------------------------------------------------------------*\ Change the alignment on media elements in all browers (opinion). \*----------------------------------------------------------------------------*/ @@ -220,27 +224,26 @@ figure { /*----------------------------------------------------------------------------*\ - 1. Change the fill to match the text color in all browsers (opinion). - 2. Hide the overflow in IE. + Change the fill to match the text color in all browsers (opinion). \*----------------------------------------------------------------------------*/ svg { &:not([fill]) { - fill: currentColor; /* 1 */ - } - - &:not(:root) { - overflow: hidden; /* 2 */ + fill: currentColor; } } /*----------------------------------------------------------------------------*\ - Remove border spacing in all browsers (opinion). + 1. Remove border spacing in all browsers (opinion). + 2. Correct table border color inheritance + 3. Remove text indentation from table contents \*----------------------------------------------------------------------------*/ table { - border-collapse: collapse; + border-collapse: collapse; /* 1 */ + border-color: inherit; /* 2 */ + text-indent: 0; /* 3 */ } @@ -255,36 +258,21 @@ input, optgroup, select, textarea { - background-color: transparent; /* 1 */ - border-style: none; /* 1 */ - font-family: inherit; /* 1 */ - font-size: inherit; /* 1 */ - line-height: inherit; /* 1 */ - margin: 0; /* 2 */ - word-break: normal; /* 3 */ -} - - -/*----------------------------------------------------------------------------*\ - Correct the overflow in IE. - 1. Correct the overflow in Edge -\*----------------------------------------------------------------------------*/ - -button, -input { - color: inherit; /* 1 */ - overflow: visible; /* 1 */ + font-family: inherit; /* 1 */ + font-size: inherit; /* 1 */ + line-height: inherit; /* 1 */ + margin: 0; /* 2 */ + word-break: normal; /* 3 */ } /*----------------------------------------------------------------------------*\ - Remove the inheritance in Edge, Firefox, and IE. - 1. Remove the inheritance in Firefox. + Remove the inheritance in Edge, Firefox. \*----------------------------------------------------------------------------*/ button, select { - text-transform: none; /* 1 */ + text-transform: none; } @@ -314,40 +302,30 @@ fieldset { /*----------------------------------------------------------------------------*\ - 1. Correct the text wrapping in Edge and IE. - 2. Remove the padding so developers are not caught out when they zero out + Remove the padding so developers are not caught out when they zero out `fieldset` elements in all browsers. - 3. Correct the color inheritance from `fieldset` elements in IE. \*----------------------------------------------------------------------------*/ legend { - color: inherit; /* 3 */ - display: table; /* 1 */ - max-width: 100%; /* 1 */ - padding: 0; /* 2 */ - white-space: normal; /* 1 */ + padding: 0; } /*----------------------------------------------------------------------------*\ - 1. Add the correct display in Edge 18- and IE. - 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. + Add the correct vertical alignment in Chrome, Firefox, and Opera. \*----------------------------------------------------------------------------*/ progress { - display: inline-block; /* 1 */ - vertical-align: baseline; /* 2 */ + vertical-align: baseline; } /*----------------------------------------------------------------------------*\ - 1. Remove the vertical scrollbar in IE 10+. - 2. Change the resize direction on textareas in all browsers (opinion). + Change the resize direction on textareas in all browsers (opinion). \*----------------------------------------------------------------------------*/ textarea { - overflow: auto; /* 1 */ - resize: vertical; /* 2 */ + resize: vertical; } @@ -372,16 +350,6 @@ textarea { } -/*----------------------------------------------------------------------------*\ - Correct the text style on placeholders in Chrome, Edge, and Safari. -\*----------------------------------------------------------------------------*/ - -::-webkit-input-placeholder { - color: inherit; - opacity: 0.5; -} - - /*----------------------------------------------------------------------------*\ Remove the inner padding and cancel buttons in Chrome and Safari for macOS. \*----------------------------------------------------------------------------*/ @@ -430,33 +398,6 @@ textarea { } -/*----------------------------------------------------------------------------*\ - Add the correct styles in Edge 18-, IE, and Safari. -\*----------------------------------------------------------------------------*/ - -dialog { - background-color: white; - border: solid; - color: black; - display: block; - height: -moz-fit-content; - height: -webkit-fit-content; - height: fit-content; - left: 0; - margin: auto; - padding: 1em; - position: absolute; - right: 0; - width: -moz-fit-content; - width: -webkit-fit-content; - width: fit-content; - - &:not([open]) { - display: none; - } -} - - /*----------------------------------------------------------------------------*\ Add the correct display in all browsers. \*----------------------------------------------------------------------------*/ @@ -465,81 +406,3 @@ summary { display: list-item; } - -/*----------------------------------------------------------------------------*\ - Add the correct display in IE. -\*----------------------------------------------------------------------------*/ - -template { - display: none; -} - - -/*----------------------------------------------------------------------------*\ - Remove the tapping delay on clickable elements in all browsers (opinion). -\*----------------------------------------------------------------------------*/ - -a, -area, -button, -input, -label, -select, -summary, -textarea, -[tabindex] { - touch-action: manipulation; -} - - -/*----------------------------------------------------------------------------*\ - Change the cursor on busy elements (opinion). -\*----------------------------------------------------------------------------*/ - -[aria-busy="true"] { - cursor: progress; -} - - -/*----------------------------------------------------------------------------*\ - Change the cursor on control elements (opinion). -\*----------------------------------------------------------------------------*/ - -[aria-controls] { - cursor: pointer; -} - - -/*----------------------------------------------------------------------------*\ - Change the cursor on disabled, not-editable, or otherwise inoperable - elements (opinion). -\*----------------------------------------------------------------------------*/ - -[aria-disabled="true"], -[disabled] { - cursor: not-allowed; -} - - -/*----------------------------------------------------------------------------*\ - Remove the outline when hovering in all browsers (opinion/m). -\*----------------------------------------------------------------------------*/ - -a:hover { - outline-width: 0; -} - - -/*----------------------------------------------------------------------------*\ - Change the display on visually hidden accessible elements (opinion). -\*----------------------------------------------------------------------------*/ - -[aria-hidden="false"][hidden] { - display: initial; - - &:not(:focus) { - clip: rect(0, 0, 0, 0); - position: absolute; - } -} - diff --git a/package.json b/package.json index 0fe6fa9..c34a5a3 100644 --- a/package.json +++ b/package.json @@ -1,8 +1,8 @@ { "name": "@neuekit/reboot", - "version": "1.10.2", + "version": "2.0.0-alpha.1", "license": "MIT", - "description": "The Neue Kit Reboot is an opionated style reset supporting modern browsers and IE11 😒", + "description": "Neue Kit Reboot is an opionated style reset supporting modern browsers", "repository": { "type": "git", "url": "git+https://github.com/neuekit/reboot.git" @@ -17,8 +17,8 @@ }, "devDependencies": { "csso-cli": "^3.0.0", - "onchange": "7.0.2", - "sass": "1.26.5" + "onchange": "7.1.0", + "sass": "1.49.0" }, "scripts": { "sass": "sass --no-source-map -s compressed index.scss reboot.css", diff --git a/reboot.css b/reboot.css index 1065b0d..f5f26aa 100644 --- a/reboot.css +++ b/reboot.css @@ -1 +1 @@ -*,::after,::before{background-repeat:no-repeat;background-position:center;box-sizing:border-box;position:relative}*{background-size:cover}::after,::before{text-decoration:inherit;vertical-align:inherit}html{cursor:default;line-height:1.4;-moz-tab-size:3;tab-size:3;-webkit-tap-highlight-color:transparent;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body,dl dl,dl ol,dl ul,figure,ol dl,ol ol,ol ul,ul dl,ul ol,ul ul{margin:0}h1{font-size:2em;margin:.6875em 0}hr{height:0;overflow:visible}details,main{display:block}nav ol,nav ul{list-style:none;padding:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:83.3333%}audio,canvas,iframe,img,svg,video{vertical-align:middle}iframe,img{border-style:none}img,picture,svg{display:block;max-width:100%}img{height:auto}svg:not([fill]){fill:currentColor}svg:not(:root){overflow:hidden}table{border-collapse:collapse}button,input,optgroup,select,textarea{background-color:transparent;border-style:none;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;word-break:normal}button,input{color:inherit;overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{cursor:pointer;-webkit-appearance:button}fieldset{border:1px solid silver;padding:.35em .75em .625em}legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto;resize:vertical}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.5}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}dialog{background-color:#fff;border:solid;color:#000;display:block;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;left:0;margin:auto;padding:1em;position:absolute;right:0;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}dialog:not([open]){display:none}summary{display:list-item}template{display:none}[tabindex],a,area,button,input,label,select,summary,textarea{touch-action:manipulation}[aria-busy=true]{cursor:progress}[aria-controls]{cursor:pointer}[aria-disabled=true],[disabled]{cursor:not-allowed}a:hover{outline-width:0}[aria-hidden=false][hidden]{display:initial}[aria-hidden=false][hidden]:not(:focus){clip:rect(0,0,0,0);position:absolute} \ No newline at end of file +*,::after,::before{background-repeat:no-repeat;background-position:center;background-size:cover;box-sizing:border-box;position:relative}::after,::before{text-decoration:inherit;vertical-align:inherit}html{cursor:default;line-height:1.4;-moz-tab-size:3;tab-size:3;-webkit-tap-highlight-color:transparent;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"}h1{font-size:2em;margin:.6875em 0}hr{color:inherit;height:0}nav ol,nav ul{list-style:none;padding:0}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;font-size:1em}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:83.3333%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,canvas,iframe,img,svg,video{vertical-align:middle}iframe,img{border-style:none}img,picture,svg{display:block;max-width:100%}img{height:auto}body,figure{margin:0}svg:not([fill]){fill:currentColor}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0;word-break:normal}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{cursor:pointer;-webkit-appearance:button}fieldset{border:1px solid silver;padding:.35em .75em .625em}legend{padding:0}progress{vertical-align:baseline}textarea{resize:vertical}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}summary{display:list-item} \ No newline at end of file From 5402185745c65d47a068a46dea8199580d60b02a Mon Sep 17 00:00:00 2001 From: Matt Pilott Date: Sun, 23 Jan 2022 20:17:38 +0000 Subject: [PATCH 2/8] remove csso --- README.md | 3 ++- package.json | 5 +---- reboot.css | 2 +- 3 files changed, 4 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 52bf301..2afe2cc 100644 --- a/README.md +++ b/README.md @@ -8,6 +8,7 @@ A modern approach to consistently styled elements! 🧑‍💻 ![GitHub release](https://img.shields.io/github/release/neuekit/reboot.svg?style=for-the-badge) +### M2 has dropped support for IE11 💪 This is the somewhat incredible readme for a little mashup of normalize, sanitize and opinion. A reset in it's purest form is a way to level the browser playing field, attempting to ensure that each browser displays all standardised elements the same. Although that sounds fairly trivial, in practice it is quite time consuming and requries you to check every element in a variety of situations to ensure you haven't added strange issues. @@ -38,6 +39,6 @@ To build the project manually run either `$ npm run build` To watch for changes manually run either `$ npm run watch` ## Future -Although the gains aren't massive version 2 of reboot will drop support for the dreaded Internet Explorer and v1 will be maintained as the legacy branch until Mircrosoft kills it. +M3 (version 3) will shift to use the super low specificity pseudo selector `:where` and drop support for any browsers that do not support it (classic Edge, Safari 13 etc.) **That's all! Feel free to scrutinise this repo and help improve it.** diff --git a/package.json b/package.json index c34a5a3..b4c3623 100644 --- a/package.json +++ b/package.json @@ -16,14 +16,11 @@ "access": "public" }, "devDependencies": { - "csso-cli": "^3.0.0", "onchange": "7.1.0", "sass": "1.49.0" }, "scripts": { - "sass": "sass --no-source-map -s compressed index.scss reboot.css", - "clean": "csso reboot.css -o reboot.css", - "build": "npm run sass && npm run clean", + "build": "sass --no-source-map -s compressed index.scss reboot.css", "watch": "onchange './*.scss' -- npm run build --silent", "start": "npm run watch --silent" } diff --git a/reboot.css b/reboot.css index f5f26aa..b43ce7f 100644 --- a/reboot.css +++ b/reboot.css @@ -1 +1 @@ -*,::after,::before{background-repeat:no-repeat;background-position:center;background-size:cover;box-sizing:border-box;position:relative}::after,::before{text-decoration:inherit;vertical-align:inherit}html{cursor:default;line-height:1.4;-moz-tab-size:3;tab-size:3;-webkit-tap-highlight-color:transparent;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"}h1{font-size:2em;margin:.6875em 0}hr{color:inherit;height:0}nav ol,nav ul{list-style:none;padding:0}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;font-size:1em}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:83.3333%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,canvas,iframe,img,svg,video{vertical-align:middle}iframe,img{border-style:none}img,picture,svg{display:block;max-width:100%}img{height:auto}body,figure{margin:0}svg:not([fill]){fill:currentColor}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0;word-break:normal}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{cursor:pointer;-webkit-appearance:button}fieldset{border:1px solid silver;padding:.35em .75em .625em}legend{padding:0}progress{vertical-align:baseline}textarea{resize:vertical}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}summary{display:list-item} \ No newline at end of file +*,::before,::after{background-repeat:no-repeat;background-position:center;background-size:cover;box-sizing:border-box;position:relative}::before,::after{text-decoration:inherit;vertical-align:inherit}html{cursor:default;line-height:1.4;-moz-tab-size:3;tab-size:3;-webkit-tap-highlight-color:transparent;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";margin:0}h1{font-size:2em;margin:.6875em 0}hr{color:inherit;height:0}nav ol,nav ul{list-style:none;padding:0}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;font-size:1em}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:83.3333%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}audio,canvas,iframe,img,svg,video{vertical-align:middle}img,iframe{border-style:none}img,picture,svg{display:block;max-width:100%}img{height:auto}figure{margin:0}svg:not([fill]){fill:currentColor}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0;word-break:normal}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{cursor:pointer;-webkit-appearance:button}fieldset{border:1px solid silver;padding:.35em .75em .625em}legend{padding:0}progress{vertical-align:baseline}textarea{resize:vertical}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}summary{display:list-item} From 0c22e197d369f1039d990e2f7f364e9841680265 Mon Sep 17 00:00:00 2001 From: Matt Pilott Date: Sun, 30 Jan 2022 15:27:41 +0000 Subject: [PATCH 3/8] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 2afe2cc..c553700 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -![Hero](https://github.com/neuekit/reboot/raw/master/hero.png) +![Hero](https://github.com/neuekit/reboot/raw/main/hero.png)

A modern approach to consistently styled elements! 🧑‍💻 From 7cbd41451d26519567699840315a4780312e9904 Mon Sep 17 00:00:00 2001 From: Matt Pilott Date: Sun, 30 Jan 2022 15:42:56 +0000 Subject: [PATCH 4/8] revert removal of button opinions --- index.scss | 19 +++++++++++-------- package.json | 2 +- reboot.css | 2 +- 3 files changed, 13 insertions(+), 10 deletions(-) diff --git a/index.scss b/index.scss index 4cf5882..a6630b9 100644 --- a/index.scss +++ b/index.scss @@ -248,9 +248,10 @@ table { /*----------------------------------------------------------------------------*\ - 1. Change the font styles in all browsers. - 2. Remove the margin in Firefox and Safari. - 3. Restore natural behaviour for inputs (opinion) + 1. Remove default styling (opinion). + 2. Change the font styles in all browsers. + 3. Remove the margin in Firefox and Safari. + 4. Restore natural behaviour for inputs (opinion) \*----------------------------------------------------------------------------*/ button, @@ -258,11 +259,13 @@ input, optgroup, select, textarea { - font-family: inherit; /* 1 */ - font-size: inherit; /* 1 */ - line-height: inherit; /* 1 */ - margin: 0; /* 2 */ - word-break: normal; /* 3 */ + background-color: transparent; /* 1 */ + border-style: none; /* 1 */ + font-family: inherit; /* 2 */ + font-size: inherit; /* 2 */ + line-height: inherit; /* 2 */ + margin: 0; /* 3 */ + word-break: normal; /* 4 */ } diff --git a/package.json b/package.json index b4c3623..8269595 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@neuekit/reboot", - "version": "2.0.0-alpha.1", + "version": "2.0.0-alpha.2", "license": "MIT", "description": "Neue Kit Reboot is an opionated style reset supporting modern browsers", "repository": { diff --git a/reboot.css b/reboot.css index b43ce7f..0aff6f7 100644 --- a/reboot.css +++ b/reboot.css @@ -1 +1 @@ -*,::before,::after{background-repeat:no-repeat;background-position:center;background-size:cover;box-sizing:border-box;position:relative}::before,::after{text-decoration:inherit;vertical-align:inherit}html{cursor:default;line-height:1.4;-moz-tab-size:3;tab-size:3;-webkit-tap-highlight-color:transparent;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";margin:0}h1{font-size:2em;margin:.6875em 0}hr{color:inherit;height:0}nav ol,nav ul{list-style:none;padding:0}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;font-size:1em}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:83.3333%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}audio,canvas,iframe,img,svg,video{vertical-align:middle}img,iframe{border-style:none}img,picture,svg{display:block;max-width:100%}img{height:auto}figure{margin:0}svg:not([fill]){fill:currentColor}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0;word-break:normal}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{cursor:pointer;-webkit-appearance:button}fieldset{border:1px solid silver;padding:.35em .75em .625em}legend{padding:0}progress{vertical-align:baseline}textarea{resize:vertical}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}summary{display:list-item} +*,::before,::after{background-repeat:no-repeat;background-position:center;background-size:cover;box-sizing:border-box;position:relative}::before,::after{text-decoration:inherit;vertical-align:inherit}html{cursor:default;line-height:1.4;-moz-tab-size:3;tab-size:3;-webkit-tap-highlight-color:transparent;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";margin:0}h1{font-size:2em;margin:.6875em 0}hr{color:inherit;height:0}nav ol,nav ul{list-style:none;padding:0}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;font-size:1em}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:83.3333%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}audio,canvas,iframe,img,svg,video{vertical-align:middle}img,iframe{border-style:none}img,picture,svg{display:block;max-width:100%}img{height:auto}figure{margin:0}svg:not([fill]){fill:currentColor}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{background-color:transparent;border-style:none;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;word-break:normal}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{cursor:pointer;-webkit-appearance:button}fieldset{border:1px solid silver;padding:.35em .75em .625em}legend{padding:0}progress{vertical-align:baseline}textarea{resize:vertical}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}summary{display:list-item} From 295d54836ac82ff4a632701abec6f96dd645a318 Mon Sep 17 00:00:00 2001 From: Matt Pilott Date: Sun, 28 Aug 2022 16:37:02 +0100 Subject: [PATCH 5/8] bump --- index.scss | 2 +- package.json | 52 ++++++++++++++++++++++++++-------------------------- 2 files changed, 27 insertions(+), 27 deletions(-) diff --git a/index.scss b/index.scss index a6630b9..1b940fb 100644 --- a/index.scss +++ b/index.scss @@ -2,7 +2,7 @@ #REBOOT BROWSER STYLES - Version: 2.0.0 - - Author: Matt Pilott + - Author: Matt Pilott && Darby Manning && Chris Myers - Site: https://github.com/neuekit/reboot - Copyright: 2022, Matt Pilott – License: MIT | http://goo.gl/p3bexl diff --git a/package.json b/package.json index 8269595..ea57f25 100644 --- a/package.json +++ b/package.json @@ -1,27 +1,27 @@ { - "name": "@neuekit/reboot", - "version": "2.0.0-alpha.2", - "license": "MIT", - "description": "Neue Kit Reboot is an opionated style reset supporting modern browsers", - "repository": { - "type": "git", - "url": "git+https://github.com/neuekit/reboot.git" - }, - "author": "Matt Pilott && Darby Manning && Chris Myers", - "bugs": { - "url": "https://github.com/neuekit/reboot/issues" - }, - "homepage": "https://github.com/neuekit/reboot#readme", - "publishConfig": { - "access": "public" - }, - "devDependencies": { - "onchange": "7.1.0", - "sass": "1.49.0" - }, - "scripts": { - "build": "sass --no-source-map -s compressed index.scss reboot.css", - "watch": "onchange './*.scss' -- npm run build --silent", - "start": "npm run watch --silent" - } -} + "name": "@neuekit/reboot", + "version": "2.0.0-beta.1", + "license": "MIT", + "description": "Neue Kit Reboot is an opionated style reset supporting modern browsers", + "repository": { + "type": "git", + "url": "git+https://github.com/neuekit/reboot.git" + }, + "author": "Matt Pilott && Darby Manning && Chris Myers", + "bugs": { + "url": "https://github.com/neuekit/reboot/issues" + }, + "homepage": "https://github.com/neuekit/reboot#readme", + "publishConfig": { + "access": "public" + }, + "devDependencies": { + "onchange": "7.1.0", + "sass": "1.54.5" + }, + "scripts": { + "build": "sass --no-source-map -s compressed index.scss reboot.css", + "watch": "onchange './*.scss' -- npm run build --silent", + "start": "npm run watch --silent" + } +} \ No newline at end of file From 87eac05cfefb304714a71ba6feb1c9959af1406e Mon Sep 17 00:00:00 2001 From: Matt Pilott Date: Sat, 8 Oct 2022 15:52:01 +0100 Subject: [PATCH 6/8] removed opionated svg fill declaration --- .gitignore | 3 ++- index.scss | 12 ------------ package.json | 2 +- 3 files changed, 3 insertions(+), 14 deletions(-) diff --git a/.gitignore b/.gitignore index a064bbc..c16e9b5 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ .DS_Store node_modules package-lock.json -pnpm-lock.yaml \ No newline at end of file +pnpm-lock.yaml +.vscode \ No newline at end of file diff --git a/index.scss b/index.scss index 1b940fb..ca85304 100644 --- a/index.scss +++ b/index.scss @@ -6,7 +6,6 @@ - Site: https://github.com/neuekit/reboot - Copyright: 2022, Matt Pilott – License: MIT | http://goo.gl/p3bexl - - Mentions: Based on normalize/sanitize https://goo.gl/a3DzGd \*----------------------------------------------------------------------------*/ /*----------------------------------------------------------------------------*\ @@ -223,17 +222,6 @@ figure { } -/*----------------------------------------------------------------------------*\ - Change the fill to match the text color in all browsers (opinion). -\*----------------------------------------------------------------------------*/ - -svg { - &:not([fill]) { - fill: currentColor; - } -} - - /*----------------------------------------------------------------------------*\ 1. Remove border spacing in all browsers (opinion). 2. Correct table border color inheritance diff --git a/package.json b/package.json index ea57f25..a11117d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@neuekit/reboot", - "version": "2.0.0-beta.1", + "version": "2.0.0-beta.2", "license": "MIT", "description": "Neue Kit Reboot is an opionated style reset supporting modern browsers", "repository": { From 854fe56ae269ee5ac5bd82f0da7507c28c832420 Mon Sep 17 00:00:00 2001 From: Matt Pilott Date: Thu, 29 Dec 2022 13:20:40 +0000 Subject: [PATCH 7/8] deps --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index a11117d..f63721b 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,7 @@ }, "devDependencies": { "onchange": "7.1.0", - "sass": "1.54.5" + "sass": "1.57.1" }, "scripts": { "build": "sass --no-source-map -s compressed index.scss reboot.css", From 7bdc4c6cb4e49c94789e18bf85ca22c1dee8c2d5 Mon Sep 17 00:00:00 2001 From: Matt Pilott Date: Thu, 12 Oct 2023 12:43:39 +0100 Subject: [PATCH 8/8] M2 --- package.json | 6 +++--- reboot.css | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index f63721b..63aba76 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@neuekit/reboot", - "version": "2.0.0-beta.2", + "version": "2.0.0", "license": "MIT", "description": "Neue Kit Reboot is an opionated style reset supporting modern browsers", "repository": { @@ -17,11 +17,11 @@ }, "devDependencies": { "onchange": "7.1.0", - "sass": "1.57.1" + "sass": "1.69.3" }, "scripts": { "build": "sass --no-source-map -s compressed index.scss reboot.css", "watch": "onchange './*.scss' -- npm run build --silent", "start": "npm run watch --silent" } -} \ No newline at end of file +} diff --git a/reboot.css b/reboot.css index 0aff6f7..187cc0d 100644 --- a/reboot.css +++ b/reboot.css @@ -1 +1 @@ -*,::before,::after{background-repeat:no-repeat;background-position:center;background-size:cover;box-sizing:border-box;position:relative}::before,::after{text-decoration:inherit;vertical-align:inherit}html{cursor:default;line-height:1.4;-moz-tab-size:3;tab-size:3;-webkit-tap-highlight-color:transparent;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";margin:0}h1{font-size:2em;margin:.6875em 0}hr{color:inherit;height:0}nav ol,nav ul{list-style:none;padding:0}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;font-size:1em}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:83.3333%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}audio,canvas,iframe,img,svg,video{vertical-align:middle}img,iframe{border-style:none}img,picture,svg{display:block;max-width:100%}img{height:auto}figure{margin:0}svg:not([fill]){fill:currentColor}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{background-color:transparent;border-style:none;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;word-break:normal}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{cursor:pointer;-webkit-appearance:button}fieldset{border:1px solid silver;padding:.35em .75em .625em}legend{padding:0}progress{vertical-align:baseline}textarea{resize:vertical}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}summary{display:list-item} +*,::before,::after{background-repeat:no-repeat;background-position:center;background-size:cover;box-sizing:border-box;position:relative}::before,::after{text-decoration:inherit;vertical-align:inherit}html{cursor:default;line-height:1.4;-moz-tab-size:3;tab-size:3;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";margin:0}h1{font-size:2em;margin:.6875em 0}hr{color:inherit;height:0}nav ol,nav ul{list-style:none;padding:0}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;font-size:1em}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:83.3333%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}audio,canvas,iframe,img,svg,video{vertical-align:middle}img,iframe{border-style:none}img,picture,svg{display:block;max-width:100%}img{height:auto}figure{margin:0}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{background-color:rgba(0,0,0,0);border-style:none;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;word-break:normal}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{cursor:pointer;-webkit-appearance:button}fieldset{border:1px solid silver;padding:.35em .75em .625em}legend{padding:0}progress{vertical-align:baseline}textarea{resize:vertical}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}summary{display:list-item}