diff --git a/bower.json b/bower.json index d5d0c93..6326537 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "total-reset", - "version": "0.1.1", + "version": "0.1.0", "description": "A semantic CSS reset that goes all the way", "authors": [ "M. George Hansen " @@ -18,7 +18,7 @@ }, "main": [ "dist/total-reset.css", - "src/total-reset.scss" + "src/total-reset.sass" ], "ignore": [ "**/.*", diff --git a/dist/total-reset.css b/dist/total-reset.css index a880184..630f692 100644 --- a/dist/total-reset.css +++ b/dist/total-reset.css @@ -9,16 +9,8 @@ * on the fact that *all* elements are block by default. Except checkboxes * and radios of course, because reasons. */ -article, aside, div, footer, header, hgroup, main, menu, nav, noscript, section, -abbr, acronym, blockquote, h1, h2, h3, h4, h5, h6, p, q, -b, bdo, em, i, ins, hr, mark, pre, s, small, strike, strong, sub, sup, u, wbr, -a, address, cite, code, dd, dfn, dl, dt, figcaption, figure, kbd, ol, ul, samp, time, var, -rp, rt, ruby, -details, meter, progress, summary, -audio, canvas, embed, img, svg, video, button, datalist, form, fieldset, input:not([type="checkbox"]):not([type="radio"]), keygen, label, output, select, textarea { - display: block; - /* 1 */ } + display: block; } /** * 1. Reset box-sizing on all elements to border-box. @@ -42,14 +34,10 @@ html { */ a { color: inherit; - /* 1 */ text-decoration: none; - /* 1 */ - background-color: transparent; - /* 2 */ } + background-color: transparent; } a:link, a:active, a:visited { - color: inherit; - /* 1 */ } + color: inherit; } ul, ol { margin: 0; @@ -64,48 +52,39 @@ ul, ol { */ html { -ms-text-size-adjust: 100%; - /* 1 */ - -webkit-text-size-adjust: 100%; - /* 1 */ } + -webkit-text-size-adjust: 100%; } /** * 1. Remove all styling from `h1-6` elements. */ h1, h2, h3, h4, h5, h6 { margin: 0; - /* 1 */ font-size: inherit; - /* 1 */ - font-weight: inherit; - /* 1 */ } + font-weight: inherit; } /** * 1. Remove extra margin around these elements. */ p, dl, dd, pre, figure, blockquote { - margin: 0; - /* 1 */ } + margin: 0; } /** * 1. Ensure that these elements inherit font-style. */ i, cite, em, var, address, dfn { - font-style: inherit; - /* 1 */ } + font-style: inherit; } /** * 1. Ensure that these elements inherit text-decoration. */ u, s, strike, del, ins { - text-decoration: inherit; - /* 1 */ } + text-decoration: inherit; } /** * 1. Ensure that these elements inherit font-weight. */ dfn, strong, th, b { - font-weight: inherit; - /* 1 */ } + font-weight: inherit; } small { font-size: inherit; } @@ -116,31 +95,24 @@ small { */ tt, code, kbd, samp, pre { font-family: inherit; - /* 1 */ - font-size: inherit; - /* 2 */ } + font-size: inherit; } /** * 1. Remove quotation marks. */ q::before, q::after { content: ""; - /* 1 */ - content: none; - /* 1 */ } + content: none; } blockquote, q { - quotes: none; - /* 1 */ } + quotes: none; } /** * 1. Reset styling for `mark` elements. */ mark { background-color: inherit; - /* 1 */ - color: inherit; - /* 1 */ } + color: inherit; } hr { box-sizing: content-box; @@ -176,8 +148,7 @@ img { * 1. Remove borders from iframes. This isn't 1995 any more. */ iframe { - border: none; - /* 1 */ } + border: none; } /** * 1. Prevent modern browsers from displaying `audio` without controls. @@ -185,9 +156,7 @@ iframe { */ audio:not([controls]) { display: none; - /* 1 */ - height: 0; - /* 2 */ } + height: 0; } /** * Correct overflow not hidden in IE 9/10/11 (from normalize.css). @@ -248,11 +217,8 @@ audio { */ fieldset { margin: 0; - /* 1 */ padding: 0; - /* 1 */ - border: none; - /* 1 */ } + border: none; } /** * 1. Fully reset lengends removing all default styling. @@ -260,11 +226,8 @@ fieldset { */ legend { border: 0; - /* 1 */ padding: 0; - /* 1 */ - width: 100%; - /* 2 */ } + width: 100%; } /** * Known limitation: by default, Chrome and Safari on OS X allow very limited @@ -291,9 +254,7 @@ button { */ select { border-radius: 0; - /* 1 */ - -webkit-appearance: none; - /* 2 */ } + -webkit-appearance: none; } /** * Remove default vertical scrollbar in IE 8/9/10/11 (from normalize.css). @@ -305,8 +266,7 @@ textarea { * 1. Address `overflow` set to `hidden` in IE 8/9/10/11 (from normalize.css). */ button { - overflow: visible; - /* 1 */ } + overflow: visible; } /** * 1. Address inconsistent `text-transform` inheritance for `button` and @@ -317,8 +277,7 @@ button { */ button, select { - text-transform: none; - /* 1 */ } + text-transform: none; } /** * 1. Remove inner padding and border in Firefox 4+ (from normalize.css). @@ -326,9 +285,7 @@ select { button::-moz-focus-inner, input::-moz-focus-inner { border: 0; - /* 1 */ - padding: 0; - /* 1 */ } + padding: 0; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` @@ -342,9 +299,7 @@ html input[type="button"], input[type="submit"], input[type="reset"] { -webkit-appearance: button; - /* 2 */ cursor: pointer; - /* 3 */ text-align: left; } /** @@ -371,9 +326,7 @@ input { input[type="checkbox"], input[type="radio"] { box-sizing: border-box; - /* 1 */ - padding: 0; - /* 2 */ } + padding: 0; } /** * Fix the cursor style for Chrome's increment/decrement buttons. For certain @@ -395,11 +348,9 @@ input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-o * */ input[type="search"] { - -webkit-appearance: textfield; - /* 1 */ } + -webkit-appearance: textfield; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { - -webkit-appearance: none; - /* 2 */ } + -webkit-appearance: none; } /** * 1. Update input placeholders to inherit color (IE, Chrome and Safari) and @@ -410,16 +361,13 @@ input[type="search"] { * workaround :(. */ ::-webkit-input-placeholder { - color: inherit; - /* 1 */ } + color: inherit; } ::-moz-placeholder { - opacity: inherit; - /* 1 */ } + opacity: inherit; } :-ms-input-placeholder { - color: inherit; - /* 1 */ } + color: inherit; } /** * 1. Address `[hidden]` styling not present in IE 8/9/10 and hide the @@ -428,8 +376,7 @@ input[type="search"] { */ [hidden], template { - display: none; - /* 1 */ } + display: none; } /** * 1. Remove default padding on body. @@ -437,6 +384,4 @@ template { */ body { margin: 0; - /* 1 */ - line-height: 1; - /* 2 */ } + line-height: 1; } diff --git a/dist/total-reset.min.css b/dist/total-reset.min.css index 8851921..3de91fa 100644 --- a/dist/total-reset.min.css +++ b/dist/total-reset.min.css @@ -1 +1 @@ -b,dfn,h1,h2,h3,h4,h5,h6,strong,th{font-weight:inherit}h1,h2,h3,h4,h5,h6,small{font-size:inherit}[title],a{text-decoration:none}button,html,input:not([type=checkbox]):not([type=radio]),legend,meter,progress,select,textarea{width:100%}fieldset,iframe,img{border:none}a,a:active,a:link,a:visited,mark{color:inherit}a,abbr,acronym,address,article,aside,audio,b,bdo,blockquote,button,canvas,cite,code,datalist,dd,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,hr,i,img,input:not([type=checkbox]):not([type=radio]),ins,kbd,keygen,label,main,mark,menu,meter,nav,noscript,ol,output,p,pre,progress,q,rp,rt,ruby,s,samp,section,select,small,strike,strong,sub,summary,sup,svg,textarea,time,u,ul,var,video,wbr{display:block}html{box-sizing:border-box;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;overflow-x:hidden}*,::after,::before{box-sizing:inherit}a{background-color:transparent}ol,ul{margin:0;padding:0;list-style-type:none}ol ol,ol ul,td,th,ul ol,ul ul{padding:0}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,p,pre{margin:0}address,cite,dfn,em,i,var{font-style:inherit}del,ins,s,strike,u{text-decoration:inherit}code,kbd,pre,samp,tt{font-family:inherit;font-size:inherit}q::after,q::before{content:"";content:none}blockquote,q{quotes:none}mark{background-color:inherit}hr{box-sizing:content-box;height:0}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}audio:not([controls]){display:none;height:0}svg:not(:root){overflow:hidden}:focus{outline:0}table{border-collapse:collapse;border-spacing:0}caption{text-align:inherit}embed,iframe,img,object,video{height:auto;max-width:100%}audio{max-width:100%}fieldset{margin:0;padding:0}legend{border:0;padding:0}button,input:not([type=checkbox]):not([type=radio]),optgroup,select,textarea{margin:0;padding:0;border:none;background:0 0;font:inherit;color:inherit}select{border-radius:0;-webkit-appearance:none}textarea{overflow:auto}button{overflow:visible}button,select{text-transform:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}button,html input[type=button],input[type=submit],input[type=reset]{-webkit-appearance:button;cursor:pointer;text-align:left}button[disabled],html input[disabled]{cursor:default}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit}::-moz-placeholder{opacity:inherit}:-ms-input-placeholder{color:inherit}[hidden],template{display:none}body{margin:0;line-height:1} \ No newline at end of file +b,dfn,h1,h2,h3,h4,h5,h6,strong,th{font-weight:inherit}h1,h2,h3,h4,h5,h6,small{font-size:inherit}[title],a{text-decoration:none}button,html,input:not([type=checkbox]):not([type=radio]),legend,meter,progress,select,textarea{width:100%}fieldset,iframe,img{border:none}a,a:active,a:link,a:visited,mark{color:inherit}button,datalist,fieldset,form,input:not([type=checkbox]):not([type=radio]),keygen,label,output,select,textarea{display:block}html{box-sizing:border-box;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;overflow-x:hidden}*,::after,::before{box-sizing:inherit}a{background-color:transparent}ol,ul{margin:0;padding:0;list-style-type:none}ol ol,ol ul,td,th,ul ol,ul ul{padding:0}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,p,pre{margin:0}address,cite,dfn,em,i,var{font-style:inherit}del,ins,s,strike,u{text-decoration:inherit}code,kbd,pre,samp,tt{font-family:inherit;font-size:inherit}q::after,q::before{content:"";content:none}blockquote,q{quotes:none}mark{background-color:inherit}hr{box-sizing:content-box;height:0}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}audio:not([controls]){display:none;height:0}svg:not(:root){overflow:hidden}:focus{outline:0}table{border-collapse:collapse;border-spacing:0}caption{text-align:inherit}embed,iframe,img,object,video{height:auto;max-width:100%}audio{max-width:100%}fieldset{margin:0;padding:0}legend{border:0;padding:0}button,input:not([type=checkbox]):not([type=radio]),optgroup,select,textarea{margin:0;padding:0;border:none;background:0 0;font:inherit;color:inherit}select{border-radius:0;-webkit-appearance:none}textarea{overflow:auto}button{overflow:visible}button,select{text-transform:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}button,html input[type=button],input[type=submit],input[type=reset]{-webkit-appearance:button;cursor:pointer;text-align:left}button[disabled],html input[disabled]{cursor:default}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit}::-moz-placeholder{opacity:inherit}:-ms-input-placeholder{color:inherit}[hidden],template{display:none}body{margin:0;line-height:1} \ No newline at end of file diff --git a/gulpfile.js b/gulpfile.js index d1d71ad..a19f54f 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -9,7 +9,7 @@ var distDir = 'dist'; var srcDir = 'src'; gulp.task('build', function() { - return gulp.src(srcDir + '/**/[^_]*.scss') + return gulp.src(srcDir + '/**/[^_]*.sass') .pipe(gulpSass()).on('error', gulpSass.logError) .pipe(gulp.dest(distDir)) .pipe(browserSync.stream()) @@ -32,7 +32,7 @@ gulp.task('serve', ['build'], function() { }); gulp.watch('test/**/*.html').on('change', browserSync.reload); - gulp.watch(srcDir + '/**/*.scss', ['build']); + gulp.watch(srcDir + '/**/*.sass', ['build']); }); gulp.task('default', ['build']) diff --git a/package.json b/package.json index 004aaa2..87288ec 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "total-reset", - "version": "0.1.1", + "version": "0.1.0", "description": "A semantic CSS reset that goes all the way", "license": "MPL-2.0", "keywords": [ diff --git a/src/_accessibility.scss b/src/_accessibility.sass similarity index 92% rename from src/_accessibility.scss rename to src/_accessibility.sass index 648e2bb..b39c281 100644 --- a/src/_accessibility.scss +++ b/src/_accessibility.sass @@ -11,15 +11,13 @@ * made for standard and expected behavior, but it is easy enough to add * a focus outline back in the application styling if that's what you want. */ -:focus { - outline: none; -} +:focus + outline: none /* 1 */ /** * 1. Remove the underline that Firefox adds to elements with a title. * * Again, this might be controversal but see the comments on :focus above. */ -[title] { - text-decoration: none; -} +[title] + text-decoration: none /* 1 */ diff --git a/src/_blocks.scss b/src/_blocks.sass similarity index 96% rename from src/_blocks.scss rename to src/_blocks.sass index 02b3d3c..9330469 100644 --- a/src/_blocks.scss +++ b/src/_blocks.sass @@ -16,6 +16,5 @@ a, address, cite, code, dd, dfn, dl, dt, figcaption, figure, kbd, ol, ul, samp, rp, rt, ruby, /* language elements */ details, meter, progress, summary, /* interactive elements */ audio, canvas, embed, img, svg, video, /* embedded content */ -button, datalist, form, fieldset, input:not([type="checkbox"]):not([type="radio"]), keygen, label, output, select, textarea /* form elements */ { - display: block; /* 1 */ -} +button, datalist, form, fieldset, input:not([type="checkbox"]):not([type="radio"]), keygen, label, output, select, textarea /* form elements */ + display: block /* 1 */ diff --git a/src/_box-sizing.scss b/src/_box-sizing.sass similarity index 81% rename from src/_box-sizing.scss rename to src/_box-sizing.sass index 7ec91fb..20dc26b 100644 --- a/src/_box-sizing.scss +++ b/src/_box-sizing.sass @@ -7,10 +7,8 @@ * This method seems to cause the least number of headaches and override * issues. */ -html { - box-sizing: border-box; -} +html + box-sizing: border-box /* 1 */ -*, *::before, *::after { - box-sizing: inherit; -} +*, *::before, *::after + box-sizing: inherit /* 1 */ diff --git a/src/_embedded-content.scss b/src/_embedded-content.sass similarity index 77% rename from src/_embedded-content.scss rename to src/_embedded-content.sass index 081d2aa..c7fbae5 100644 --- a/src/_embedded-content.scss +++ b/src/_embedded-content.sass @@ -5,29 +5,25 @@ * high specificity and makes it difficult to override. `img` shouldn't * have borders anyway, so no harm no foul. */ -img { - border: none; -} +img + border: none /** * 1. Remove borders from iframes. This isn't 1995 any more. */ -iframe { - border: none; /* 1 */ -} +iframe + border: none /* 1 */ /** * 1. Prevent modern browsers from displaying `audio` without controls. * 2. Remove excess height in iOS 5 devices (from normalize.css). */ -audio:not([controls]) { - display: none; /* 1 */ - height: 0; /* 2 */ -} +audio:not([controls]) + display: none /* 1 */ + height: 0 /* 2 */ /** * Correct overflow not hidden in IE 9/10/11 (from normalize.css). */ -svg:not(:root) { - overflow: hidden; -} +svg:not(:root) + overflow: hidden diff --git a/src/_form-elements.scss b/src/_form-elements.sass similarity index 71% rename from src/_form-elements.scss rename to src/_form-elements.sass index 8669799..09d1ecd 100644 --- a/src/_form-elements.scss +++ b/src/_form-elements.sass @@ -1,21 +1,19 @@ /** * 1. Fully reset fieldsets removing all default styling. */ -fieldset { - margin: 0; /* 1 */ - padding: 0; /* 1 */ - border: none; /* 1 */ -} +fieldset + margin: 0 /* 1 */ + padding: 0 /* 1 */ + border: none /* 1 */ /** * 1. Fully reset lengends removing all default styling. * 2. On Android Chrome browser lengends don't expand to 100%, so we fix that. */ -legend { - border: 0; /* 1 */ - padding: 0; /* 1 */ - width: 100%; /* 2 */ -} +legend + border: 0 /* 1 */ + padding: 0 /* 1 */ + width: 100% /* 2 */ /** * Known limitation: by default, Chrome and Safari on OS X allow very limited @@ -25,14 +23,13 @@ input:not([type="checkbox"]):not([type="radio"]), optgroup, select, textarea, -button { - margin: 0; - padding: 0; - border: none; - background: none; - font: inherit; - color: inherit; -} +button + margin: 0 + padding: 0 + border: none + background: none + font: inherit + color: inherit /** * 1. Remove border-radius in Safari. @@ -41,24 +38,21 @@ button { * Note that this also removes the dropdown arrow in Safari, which isn't * ideal but there is little we can do about it. */ -select { - border-radius: 0; /* 1 */ - -webkit-appearance: none; /* 2 */ -} +select + border-radius: 0 /* 1 */ + -webkit-appearance: none /* 2 */ /** * Remove default vertical scrollbar in IE 8/9/10/11 (from normalize.css). */ -textarea { - overflow: auto; -} +textarea + overflow: auto /** * 1. Address `overflow` set to `hidden` in IE 8/9/10/11 (from normalize.css). */ -button { - overflow: visible; /* 1 */ -} +button + overflow: visible /* 1 */ /** * 1. Address inconsistent `text-transform` inheritance for `button` and @@ -68,20 +62,17 @@ button { * (from normalize.css). */ button, -select { - text-transform: none; /* 1 */ -} +select + text-transform: none /* 1 */ /** * 1. Remove inner padding and border in Firefox 4+ (from normalize.css). */ button, -input { - &::-moz-focus-inner { - border: 0; /* 1 */ - padding: 0; /* 1 */ - } -} +input + &::-moz-focus-inner + border: 0 /* 1 */ + padding: 0 /* 1 */ /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` @@ -91,29 +82,26 @@ input { * `input` and others. */ button, -html input[type="button"], /* 1 */ +html input[type="button"] /* 1 */, input[type="submit"], -input[type="reset"] { - -webkit-appearance: button; /* 2 */ - cursor: pointer; /* 3 */ - text-align: left; -} +input[type="reset"] + -webkit-appearance: button /* 2 */ + cursor: pointer /* 3 */ + text-align: left /** * Re-set default cursor for disabled elements. */ button[disabled], -html input[disabled] { - cursor: default; -} +html input[disabled] + cursor: default /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ -input { - line-height: normal; -} +input + line-height: normal /** * Checkboxes and radio inputs are not styleable in most browsers unfortunately, @@ -123,22 +111,19 @@ input { * 2. Remove excess padding in IE 8/9/10 (from normalize.css). */ input[type="checkbox"], -input[type="radio"] { - box-sizing: border-box; /* 1 */ - padding: 0; /* 2 */ -} +input[type="radio"] + box-sizing: border-box /* 1 */ + padding: 0 /* 2 */ /** * Fix the cursor style for Chrome's increment/decrement buttons. For certain * `font-size` values of the `input`, it causes the cursor style of the * decrement button to change from `default` to `text`. */ -input[type="number"] { +input[type="number"] &::-webkit-inner-spin-button, - &::-webkit-outer-spin-button { - height: auto; - } -} + &::-webkit-outer-spin-button + height: auto /** * 1. Address `appearance` set to `searchfield` in Safari and Chrome which is @@ -151,14 +136,12 @@ input[type="number"] { * safar * */ -input[type="search"] { - -webkit-appearance: textfield; /* 1 */ +input[type="search"] + -webkit-appearance: textfield /* 1 */ &::-webkit-search-cancel-button, - &::-webkit-search-decoration { - -webkit-appearance: none; /* 2 */ - } -} + &::-webkit-search-decoration + -webkit-appearance: none /* 2 */ /** * 1. Update input placeholders to inherit color (IE, Chrome and Safari) and @@ -168,12 +151,9 @@ input[type="search"] { * a known bug (https://bugzilla.mozilla.org/show_bug.cgi?id=1004130) with no * workaround :(. */ -::-webkit-input-placeholder { - color: inherit; /* 1 */ -} -::-moz-placeholder { - opacity: inherit; /* 1 */ -} -:-ms-input-placeholder { - color: inherit; /* 1 */ -}; +::-webkit-input-placeholder + color: inherit /* 1 */ +::-moz-placeholder + opacity: inherit /* 1 */ +:-ms-input-placeholder + color: inherit /* 1 */ diff --git a/src/_hidden.scss b/src/_hidden.sass similarity index 82% rename from src/_hidden.scss rename to src/_hidden.sass index a2fb0e7..302dcd3 100644 --- a/src/_hidden.scss +++ b/src/_hidden.sass @@ -4,6 +4,5 @@ * (from normalize.css). */ [hidden], -template { - display: none; /* 1 */ -} +template + display: none /* 1 */ diff --git a/src/_links.sass b/src/_links.sass new file mode 100644 index 0000000..f79de86 --- /dev/null +++ b/src/_links.sass @@ -0,0 +1,12 @@ +/** + * 1. Fully reset link styling. + * 2. Remove gray background color from active links in IE 10 + * (from normalize.css). + */ +a + color: inherit /* 1 */ + text-decoration: none /* 1 */ + background-color: transparent /* 2 */ + + &:link, &:active, &:visited + color: inherit /* 1 */ diff --git a/src/_links.scss b/src/_links.scss deleted file mode 100644 index c8ea658..0000000 --- a/src/_links.scss +++ /dev/null @@ -1,14 +0,0 @@ -/** - * 1. Fully reset link styling. - * 2. Remove gray background color from active links in IE 10 - * (from normalize.css). - */ -a { - color: inherit; /* 1 */ - text-decoration: none; /* 1 */ - background-color: transparent; /* 2 */ - - &:link, &:active, &:visited { - color: inherit; /* 1 */ - } -} diff --git a/src/_lists.sass b/src/_lists.sass new file mode 100644 index 0000000..49199d8 --- /dev/null +++ b/src/_lists.sass @@ -0,0 +1,7 @@ +ul, ol + margin: 0 + padding: 0 + list-style-type: none + + ol, ul + padding: 0 diff --git a/src/_lists.scss b/src/_lists.scss deleted file mode 100644 index 61f2550..0000000 --- a/src/_lists.scss +++ /dev/null @@ -1,9 +0,0 @@ -ul, ol { - margin: 0; - padding: 0; - list-style-type: none; - - ol, ul { - padding: 0; - } -} diff --git a/src/_responsive.sass b/src/_responsive.sass new file mode 100644 index 0000000..333b1dd --- /dev/null +++ b/src/_responsive.sass @@ -0,0 +1,13 @@ +html + width: 100% + overflow-x: hidden + +input:not([type="checkbox"]):not([type="radio"]), select, textarea, button, meter, progress + width: 100% + +img, video, object, embed, iframe + height: auto + max-width: 100% + +audio + max-width: 100% diff --git a/src/_responsive.scss b/src/_responsive.scss deleted file mode 100644 index 44d9f07..0000000 --- a/src/_responsive.scss +++ /dev/null @@ -1,17 +0,0 @@ -html { - width: 100%; - overflow-x: hidden; -} - -input:not([type="checkbox"]):not([type="radio"]), select, textarea, button, meter, progress { - width: 100%; -} - -img, video, object, embed, iframe { - height: auto; - max-width: 100%; -} - -audio { - max-width: 100%; -} diff --git a/src/_tables.sass b/src/_tables.sass new file mode 100644 index 0000000..9e9134c --- /dev/null +++ b/src/_tables.sass @@ -0,0 +1,9 @@ +table + border-collapse: collapse + border-spacing: 0 + +td, th + padding: 0 + +caption + text-align: inherit diff --git a/src/_tables.scss b/src/_tables.scss deleted file mode 100644 index 62853d5..0000000 --- a/src/_tables.scss +++ /dev/null @@ -1,12 +0,0 @@ -table { - border-collapse: collapse; - border-spacing: 0; -} - -td, th { - padding: 0; -} - -caption { - text-align: inherit; -} diff --git a/src/_typography.sass b/src/_typography.sass new file mode 100644 index 0000000..a4dc81b --- /dev/null +++ b/src/_typography.sass @@ -0,0 +1,85 @@ +/** + * 1. Prevent iOS and IE text size adjust after device orientation change + * without disabling user zoom. + */ +html + -ms-text-size-adjust: 100% /* 1 */ + -webkit-text-size-adjust: 100% /* 1 */ + +/** + * 1. Remove all styling from `h1-6` elements. + */ +h1, h2, h3, h4, h5, h6 + margin: 0 /* 1 */ + font-size: inherit /* 1 */ + font-weight: inherit /* 1 */ + +/** + * 1. Remove extra margin around these elements. + */ +p, dl, dd, pre, figure, blockquote + margin: 0 /* 1 */ + +/** + * 1. Ensure that these elements inherit font-style. + */ +i, cite, em, var, address, dfn + font-style: inherit /* 1 */ + +/** + * 1. Ensure that these elements inherit text-decoration. + */ +u, s, strike, del, ins + text-decoration: inherit /* 1 */ + +/** + * 1. Ensure that these elements inherit font-weight. + */ +dfn, strong, th, b + font-weight: inherit /* 1 */ + +small + font-size: inherit + +/** + * 1. Ensure that font-family is inherited. + * 2. Inherit font size in IE. + */ +tt, code, kbd, samp, pre + font-family: inherit /* 1 */ + font-size: inherit /* 2 */ + +/** + * 1. Remove quotation marks. + */ +q + &::before, &::after + content: '' /* 1 */ + content: none /* 1 */ +blockquote, q + quotes: none /* 1 */ + +/** + * 1. Reset styling for `mark` elements. + */ +mark + background-color: inherit /* 1 */ + color: inherit /* 1 */ + +hr + box-sizing: content-box /* 1 */ + height: 0 /* 1 */ + +/** + * Prevent `sub` and `sup` affecting `line-height` in all browsers + * (from normalize.css). + */ +sub, sup + font-size: 75% + line-height: 0 + position: relative + vertical-align: baseline +sup + top: -0.5em +sub + bottom: -0.25em diff --git a/src/_typography.scss b/src/_typography.scss deleted file mode 100644 index 2342518..0000000 --- a/src/_typography.scss +++ /dev/null @@ -1,101 +0,0 @@ -/** - * 1. Prevent iOS and IE text size adjust after device orientation change - * without disabling user zoom. - */ -html { - -ms-text-size-adjust: 100%; /* 1 */ - -webkit-text-size-adjust: 100%; /* 1 */ -} - -/** - * 1. Remove all styling from `h1-6` elements. - */ -h1, h2, h3, h4, h5, h6 { - margin: 0; /* 1 */ - font-size: inherit; /* 1 */ - font-weight: inherit; /* 1 */ -} - -/** - * 1. Remove extra margin around these elements. - */ -p, dl, dd, pre, figure, blockquote { - margin: 0; /* 1 */ -} - -/** - * 1. Ensure that these elements inherit font-style. - */ -i, cite, em, var, address, dfn { - font-style: inherit; /* 1 */ -} - -/** - * 1. Ensure that these elements inherit text-decoration. - */ -u, s, strike, del, ins { - text-decoration: inherit; /* 1 */ -} - -/** - * 1. Ensure that these elements inherit font-weight. - */ -dfn, strong, th, b { - font-weight: inherit; /* 1 */ -} - -small { - font-size: inherit; -} - -/** - * 1. Ensure that font-family is inherited. - * 2. Inherit font size in IE. - */ -tt, code, kbd, samp, pre { - font-family: inherit; /* 1 */ - font-size: inherit; /* 2 */ -} - -/** - * 1. Remove quotation marks. - */ -q { - &::before, &::after { - content: ""; /* 1 */ - content: none; /* 1 */ - } -} -blockquote, q { - quotes: none; /* 1 */ -} - -/** - * 1. Reset styling for `mark` elements. - */ -mark { - background-color: inherit; /* 1 */ - color: inherit; /* 1 */ -} - -hr { - box-sizing: content-box; - height: 0; -} - -/** - * Prevent `sub` and `sup` affecting `line-height` in all browsers - * (from normalize.css). - */ -sub, sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; -} -sup { - top: -0.5em; -} -sub { - bottom: -0.25em; -} diff --git a/src/total-reset.sass b/src/total-reset.sass new file mode 100644 index 0000000..df81438 --- /dev/null +++ b/src/total-reset.sass @@ -0,0 +1,19 @@ +@import blocks +@import box-sizing +@import links +@import lists +@import typography +@import embedded-content +@import accessibility +@import tables +@import responsive +@import form-elements +@import hidden + +/** + * 1. Remove default padding on body. + * 2. Normalize line-height. + */ +body + margin: 0 /* 1 */ + line-height: 1 /* 2 */ diff --git a/src/total-reset.scss b/src/total-reset.scss deleted file mode 100644 index c1713e6..0000000 --- a/src/total-reset.scss +++ /dev/null @@ -1,20 +0,0 @@ -@import "blocks"; -@import "box-sizing"; -@import "links"; -@import "lists"; -@import "typography"; -@import "embedded-content"; -@import "accessibility"; -@import "tables"; -@import "responsive"; -@import "form-elements"; -@import "hidden"; - -/** - * 1. Remove default padding on body. - * 2. Normalize line-height. - */ -body { - margin: 0; /* 1 */ - line-height: 1; /* 2 */ -} diff --git a/test/index.html b/test/index.html index ffe0449..92b05b7 100644 --- a/test/index.html +++ b/test/index.html @@ -5,7 +5,7 @@ HTML5 Test Page - +