From 48aad4a8b24937dfbad09dafd0450f25207e6ab8 Mon Sep 17 00:00:00 2001 From: Adam Bradley Date: Tue, 26 Nov 2013 11:01:11 -0600 Subject: [PATCH] outline: 0 updates and clean up --- scss/_reset.scss | 165 +++++++++++++++++++++++------------------------ 1 file changed, 80 insertions(+), 85 deletions(-) diff --git a/scss/_reset.scss b/scss/_reset.scss index 4df0465e00..62b564c43b 100755 --- a/scss/_reset.scss +++ b/scss/_reset.scss @@ -26,24 +26,24 @@ article, aside, canvas, details, embed, fieldset, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { - margin: 0; - padding: 0; - border: 0; - vertical-align: baseline; - font: inherit; - font-size: 100%; + margin: 0; + padding: 0; + border: 0; + vertical-align: baseline; + font: inherit; + font-size: 100%; } ol, ul { - list-style: none; + list-style: none; } blockquote, q { - quotes: none; + quotes: none; } blockquote:before, blockquote:after, q:before, q:after { - content: ''; - content: none; + content: ''; + content: none; } /** @@ -52,8 +52,8 @@ q:before, q:after { */ audio:not([controls]) { - display: none; - height: 0; + display: none; + height: 0; } /** @@ -62,7 +62,7 @@ audio:not([controls]) { [hidden], template { - display: none; + display: none; } script { @@ -76,15 +76,15 @@ script { /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling - * user zoom. + * user zoom. */ html { - @include user-select(none); - font-family: sans-serif; /* 1 */ - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100%; /* 2 */ - -webkit-text-size-adjust: 100%; /* 2 */ + @include user-select(none); + font-family: sans-serif; /* 1 */ + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; /* 2 */ + -webkit-text-size-adjust: 100%; /* 2 */ } /** @@ -92,11 +92,23 @@ html { */ body { - margin: 0; - line-height: 1; + margin: 0; + line-height: 1; } +/** + * Remove default outlines. + */ + +:focus, +a:focus, +button:focus, +a:active, +a:hover { + outline: 0; +} + /* * * Remove tap highlight color on Safari */ @@ -105,23 +117,6 @@ a { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } -/** - * Address `outline` inconsistency between Chrome and other browsers. - */ - -a:focus { - outline: thin dotted; -} - -/** - * Improve readability when focused and also mouse hovered in all browsers. - */ - -a:active, -a:hover { - outline: 0; -} - /* ========================================================================== Typography ========================================================================== */ @@ -133,7 +128,7 @@ a:hover { b, strong { - font-weight: bold; + font-weight: bold; } /** @@ -141,7 +136,7 @@ strong { */ dfn { - font-style: italic; + font-style: italic; } /** @@ -149,9 +144,9 @@ dfn { */ hr { - -moz-box-sizing: content-box; - box-sizing: content-box; - height: 0; + -moz-box-sizing: content-box; + box-sizing: content-box; + height: 0; } @@ -163,8 +158,8 @@ code, kbd, pre, samp { - font-size: 1em; - font-family: monospace, serif; + font-size: 1em; + font-family: monospace, serif; } /** @@ -172,7 +167,7 @@ samp { */ pre { - white-space: pre-wrap; + white-space: pre-wrap; } /** @@ -180,7 +175,7 @@ pre { */ q { - quotes: "\201C" "\201D" "\2018" "\2019"; + quotes: "\201C" "\201D" "\2018" "\2019"; } /** @@ -188,7 +183,7 @@ q { */ small { - font-size: 80%; + font-size: 80%; } /** @@ -197,18 +192,18 @@ small { sub, sup { - position: relative; - vertical-align: baseline; - font-size: 75%; - line-height: 0; + position: relative; + vertical-align: baseline; + font-size: 75%; + line-height: 0; } sup { - top: -0.5em; + top: -0.5em; } sub { - bottom: -0.25em; + bottom: -0.25em; } /** @@ -216,9 +211,9 @@ sub { */ fieldset { - margin: 0 2px; - padding: 0.35em 0.625em 0.75em; - border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; + border: 1px solid #c0c0c0; } /** @@ -227,8 +222,8 @@ fieldset { */ legend { - padding: 0; /* 2 */ - border: 0; /* 1 */ + padding: 0; /* 2 */ + border: 0; /* 1 */ } /** @@ -243,13 +238,13 @@ button, input, select, textarea { - margin: 0; /* 3 */ - font-size: 100%; /* 2 */ - font-family: inherit; /* 1 */ - outline-offset: 0; /* 4 */ - outline-style: none; /* 4 */ - outline-width: 0; /* 4 */ - -webkit-font-smoothing: inherit; /* 5 */ + margin: 0; /* 3 */ + font-size: 100%; /* 2 */ + font-family: inherit; /* 1 */ + outline-offset: 0; /* 4 */ + outline-style: none; /* 4 */ + outline-width: 0; /* 4 */ + -webkit-font-smoothing: inherit; /* 5 */ } /** @@ -259,7 +254,7 @@ textarea { button, input { - line-height: normal; + line-height: normal; } /** @@ -271,23 +266,23 @@ input { button, select { - text-transform: none; + text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` - * and `video` controls. + * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type - * `input` and others. + * `input` and others. */ button, html input[type="button"], /* 1 */ input[type="reset"], input[type="submit"] { - cursor: pointer; /* 3 */ - -webkit-appearance: button; /* 2 */ + cursor: pointer; /* 3 */ + -webkit-appearance: button; /* 2 */ } /** @@ -296,20 +291,20 @@ input[type="submit"] { button[disabled], html input[disabled] { - cursor: default; + cursor: default; } /** * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome - * (include `-moz` to future-proof). + * (include `-moz` to future-proof). */ input[type="search"] { - -webkit-box-sizing: content-box; /* 2 */ - -moz-box-sizing: content-box; - box-sizing: content-box; - -webkit-appearance: textfield; /* 1 */ + -webkit-box-sizing: content-box; /* 2 */ + -moz-box-sizing: content-box; + box-sizing: content-box; + -webkit-appearance: textfield; /* 1 */ } /** @@ -319,7 +314,7 @@ input[type="search"] { input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { - -webkit-appearance: none; + -webkit-appearance: none; } /** @@ -328,8 +323,8 @@ input[type="search"]::-webkit-search-decoration { button::-moz-focus-inner, input::-moz-focus-inner { - padding: 0; - border: 0; + padding: 0; + border: 0; } /** @@ -338,8 +333,8 @@ input::-moz-focus-inner { */ textarea { - overflow: auto; /* 1 */ - vertical-align: top; /* 2 */ + overflow: auto; /* 1 */ + vertical-align: top; /* 2 */ } /* ========================================================================== @@ -351,6 +346,6 @@ textarea { */ table { - border-spacing: 0; - border-collapse: collapse; + border-spacing: 0; + border-collapse: collapse; }