From 0c1bcc2d033b28ffb226af42aa6cdbf016d256e7 Mon Sep 17 00:00:00 2001 From: Harry Roberts Date: Tue, 19 Mar 2013 08:27:23 +0000 Subject: [PATCH 1/6] [refs #182] Use new headings mixin courtesy of @thierrylemoulec --- generic/_mixins.scss | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/generic/_mixins.scss b/generic/_mixins.scss index aef0bc10..ea9e1c73 100644 --- a/generic/_mixins.scss +++ b/generic/_mixins.scss @@ -28,17 +28,19 @@ } } * - * With thanks to @lar_zzz, @paranoida and @rowanmanning for refining and - * improving my initial mixin. + * With thanks to @lar_zzz, @paranoida, @rowanmanning and ultimately + * @thierrylemoulec for refining and improving my initial mixin. */ @mixin headings($from: 1, $to: 6){ + %base-heading { + @content + } + @if $from >= 1 and $to <= 6{ - $heading-selector: (unquote("")); - @for $i from $from through $to { - $heading-selector: $heading-selector, unquote("h#{$i}") - } - #{$heading-selector}{ - @content + @for $i from $from through $to{ + h#{$i}{ + @extend %base-heading; + } } } } From aa49931763f8ef8b1bf7780108a84fc75a099a66 Mon Sep 17 00:00:00 2001 From: Harry Roberts Date: Tue, 19 Mar 2013 08:42:58 +0000 Subject: [PATCH 2/6] v5.0.1 updates --- CHANGELOG.md | 8 +++++++- component.json | 2 +- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index a41cff88..53949c7e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,7 +3,7 @@ This changelog only exists as of v5.0 onward, for previous inuit.css versions’ history please browse the commit logs. -## v5.0 +## v5.0.0 This major version bump saw the introduction of the [inuit.css web template](https://github.com/csswizardry/inuit.css-web-template), @@ -18,3 +18,9 @@ updates from GitHub whilst avoiding having to touch any library code. classes. * Added a few more helper classes and mixins. * Introduced switches to turn objects and abstractions on/off. + +## v5.1.1 + +* Convert special character to unicode. +* Fix/change the `headings` mixin. +* Fix some typos pertaining to the renaming of the spriting object. diff --git a/component.json b/component.json index ae1034ff..d746826d 100644 --- a/component.json +++ b/component.json @@ -1,5 +1,5 @@ { "name": "inuit.css", - "version": "5.0.0", + "version": "5.0.1", "dependencies": {} } From 5f55e86a6b5aec74f4f41382ec11cdcd532404d0 Mon Sep 17 00:00:00 2001 From: Peter Wilson Date: Sun, 12 May 2013 14:48:56 +1000 Subject: [PATCH 3/6] Add Nicolas Carlo credit for LESS port --- README.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index a593a392..3a9ba747 100644 --- a/README.md +++ b/README.md @@ -307,8 +307,9 @@ at the [inuit.css Trello board](https://trello.com/board/inuit-css/50a16487543de ## Looking for a little LESS? -[Peter Wilson](http://twitter.com/pwcc) is maintaining a LESS port of inuit.css: -check [the GitHub repo](https://github.com/peterwilsoncc/inuit.css). +[Peter Wilson](http://twitter.com/pwcc) and +[Nicolas Carlo](https://twitter.com/nicoespeon) are maintaining a LESS port of +inuit.css: check [the GitHub repo](https://github.com/peterwilsoncc/inuit.css). ## Using Compass? From c9df72365d4f83da18d196fd69a3a9aeb0032894 Mon Sep 17 00:00:00 2001 From: firewalker06 Date: Tue, 31 Dec 2013 10:35:22 +0700 Subject: [PATCH 4/6] Change to bower.json to meet new Bower requirement Updated since https://github.com/bower/json/commit/db4901b6a3e3f05070948e8638cc6cf1f2f51974 --- component.json => bower.json | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename component.json => bower.json (100%) diff --git a/component.json b/bower.json similarity index 100% rename from component.json rename to bower.json From 844d81258566fc5f8afdbfa50e293c498336ee6a Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Fri, 14 Feb 2014 13:37:07 -0800 Subject: [PATCH 5/6] Update link to Bootstrap in README --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 3a9ba747..d47d954c 100644 --- a/README.md +++ b/README.md @@ -31,7 +31,7 @@ _lot_ more. **Do not use inuit.css if:** * You need a framework that supplies design (I’d recommend - [Bootstrap](http://twitter.github.com/bootstrap/) for that). + [Bootstrap](http://getbootstrap.com) for that). ## Browser support From b11a8c46a8e77476b8a7cfbb0ab8dad3272eeca8 Mon Sep 17 00:00:00 2001 From: Emmanuel Barachant Date: Sat, 22 Feb 2014 19:39:44 +0100 Subject: [PATCH 6/6] Add default var and mixin for a11y requirements --- _defaults.scss | 9 +++++++ generic/_mixins.scss | 16 ++++++++++++ generic/_normalize.scss | 3 ++- generic/_reset.scss | 3 ++- objects/_beautons.scss | 55 +++++++++++++++++++++-------------------- 5 files changed, 57 insertions(+), 29 deletions(-) diff --git a/_defaults.scss b/_defaults.scss index be2b5af9..07bf63a9 100644 --- a/_defaults.scss +++ b/_defaults.scss @@ -21,6 +21,15 @@ $debug-mode: false!default; +/*------------------------------------*\ + $A11Y +\*------------------------------------*/ +/** + * This mode provide accessibility requirements + * Check http://www.w3.org/WAI/intro/wcag + */ +$a11y-mode: false!default; + /*------------------------------------*\ diff --git a/generic/_mixins.scss b/generic/_mixins.scss index ea9e1c73..42fc5d36 100644 --- a/generic/_mixins.scss +++ b/generic/_mixins.scss @@ -19,6 +19,22 @@ } +/** + * Set outline:none if you don't care about people with disabilities + * Use $a11y-mode default variable + * + `@include outline-none();` + * + * Manifest http://www.outlinenone.com/ + * WCAG2.0 level AA: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#navigation-mechanisms-focus-visible + */ +@mixin outline-none(){ + @if $a11y-mode == false{ + outline: none; + } +} + + /** * Style any number of headings in one fell swoop, e.g.: * diff --git a/generic/_normalize.scss b/generic/_normalize.scss index 714c6b96..de3f0e53 100644 --- a/generic/_normalize.scss +++ b/generic/_normalize.scss @@ -89,11 +89,12 @@ a:focus { /* * Improve readability when focused and also mouse hovered in all browsers. + * This is conditionned by outline-none() mixin and $a11y-mode default var. */ a:active, a:hover { - outline: 0; + @include outline-none(); } /* ========================================================================== diff --git a/generic/_reset.scss b/generic/_reset.scss index 1d91a299..b4bf377d 100644 --- a/generic/_reset.scss +++ b/generic/_reset.scss @@ -62,6 +62,7 @@ img{ /** * Give form elements some cursor interactions... + * Use outline-none() a11y mixin on active, focus states of form elems. */ label, input, @@ -76,5 +77,5 @@ option{ textarea:active, textarea:focus{ cursor:text; - outline:none; + @include outline-none(); } diff --git a/objects/_beautons.scss b/objects/_beautons.scss index 77f25b4d..f9df8c6e 100644 --- a/objects/_beautons.scss +++ b/objects/_beautons.scss @@ -41,45 +41,46 @@ /** * Base button styles. * - * 1. Allow us to better style box model properties. - * 2. Line different sized buttons up a little nicer. - * 3. Stop buttons wrapping and looking broken. - * 4. Make buttons inherit font styles. - * 5. Force all elements using beautons to appear clickable. - * 6. Normalise box model styles. - * 7. If the button’s text is 1em, and the button is (3 * font-size) tall, then - * there is 1em of space above and below that text. We therefore apply 1em - * of space to the left and right, as padding, to keep consistent spacing. - * 8. Basic cosmetics for default buttons. Change or override at will. - * 9. Don’t allow buttons to have underlines; it kinda ruins the illusion. + * 1. Allow us to better style box model properties. + * 2. Line different sized buttons up a little nicer. + * 3. Stop buttons wrapping and looking broken. + * 4. Make buttons inherit font styles. + * 5. Force all elements using beautons to appear clickable. + * 6. Normalise box model styles. + * 7. If the button’s text is 1em, and the button is (3 * font-size) tall, then + * there is 1em of space above and below that text. We therefore apply 1em + * of space to the left and right, as padding, to keep consistent spacing. + * 8. Basic cosmetics for default buttons. Change or override at will. + * 9. Don’t allow buttons to have underlines; it kinda ruins the illusion. + * 10. Apply outline:none if $a11y-mode default variable is false. */ .btn{ - display:inline-block; /* [1] */ - vertical-align:middle; /* [2] */ - white-space:nowrap; /* [3] */ - font-family:inherit; /* [4] */ - font-size:100%; /* [4] */ - cursor:pointer; /* [5] */ - border:none; /* [6] */ - margin:0; /* [6] */ - padding-top: 0; /* [6] */ - padding-bottom:0; /* [6] */ - line-height:3; /* [7] */ - padding-right:1em; /* [7] */ - padding-left: 1em; /* [7] */ - border-radius:$brand-round; /* [8] */ + display:inline-block; /* [1] */ + vertical-align:middle; /* [2] */ + white-space:nowrap; /* [3] */ + font-family:inherit; /* [4] */ + font-size:100%; /* [4] */ + cursor:pointer; /* [5] */ + border:none; /* [6] */ + margin:0; /* [6] */ + padding-top: 0; /* [6] */ + padding-bottom:0; /* [6] */ + line-height:3; /* [7] */ + padding-right:1em; /* [7] */ + padding-left: 1em; /* [7] */ + border-radius:$brand-round; /* [8] */ } .btn{ &, &:hover{ - text-decoration:none; /* [9] */ + text-decoration:none; /* [9] */ } &:active, &:focus{ - outline:none; + @include outline-none(); /* [10] */ } }