From 128b7d710146cb2ab15cab0c104cf4d5d6a8e3c3 Mon Sep 17 00:00:00 2001 From: Tilo Mitra Date: Thu, 6 Jun 2013 10:34:11 -0400 Subject: [PATCH 1/3] add outline:none on menu focus state --- src/menus/css/menus-core.css | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/menus/css/menus-core.css b/src/menus/css/menus-core.css index 58275cf1b..3b703e9b0 100644 --- a/src/menus/css/menus-core.css +++ b/src/menus/css/menus-core.css @@ -1,4 +1,4 @@ -/*csslint adjoining-classes:false*/ +/*csslint adjoining-classes:false, outline-none:false*/ /*TODO: Remove this lint rule override after a refactor of this code.*/ .pure-menu ul { @@ -29,6 +29,10 @@ visibility: visible; } +.pure-menu-open > ul:focus { + outline: none; +} + .pure-menu li { position: relative; } .pure-menu a, .pure-menu .pure-menu-heading { From de6a56d826967a698b4e0b0c224a347228452dd3 Mon Sep 17 00:00:00 2001 From: Tilo Mitra Date: Thu, 6 Jun 2013 10:34:39 -0400 Subject: [PATCH 2/3] add focus-state background for menu-items that reveal children --- src/menus/css/menus.css | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/menus/css/menus.css b/src/menus/css/menus.css index 92c83df78..c28611856 100644 --- a/src/menus/css/menus.css +++ b/src/menus/css/menus.css @@ -5,7 +5,7 @@ .pure-menu.pure-menu-open, .pure-menu.pure-menu-horizontal li .pure-menu-children { - background: #ffffff; /* Old browsers */ + background: #fff; /* Old browsers */ border: 1px solid #b7b7b7; } @@ -35,6 +35,10 @@ color: #fff; } +/* Focus style for a dropdown menu-item when the parent has been opened */ +.pure-menu .pure-menu-open { + background: #dedede; +} /* HOVER STATES */ From 2584aa3addc3fa7192381b3dd543ec66454dfd66 Mon Sep 17 00:00:00 2001 From: Tilo Mitra Date: Thu, 6 Jun 2013 10:37:07 -0400 Subject: [PATCH 3/3] add HISTORY.md for commits 128b7d7..de6a56d --- HISTORY.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/HISTORY.md b/HISTORY.md index 15e36b336..4e8a53f2d 100644 --- a/HISTORY.md +++ b/HISTORY.md @@ -46,6 +46,9 @@ NEXT * Added `pure-menu-separator-vertical` classname that can be used to visually separate horizonal menu items. (Issue #53) (codepb, mseri) +* Focused menus have an `outline: none` by default. Instead, menu-items that + have been opened to display children (in a drop-down menu) get a slight + background (`#dedede`) for accessibility. (Issue #22) 0.1.0 (2013-05-24) ------------------