Editor Menubar Example: Visual design to distinguish between menuitem…

…radio and meuitemcheckbox (pull #853) Resolves issue #605 by: * Indicating menuitemcheckbox elements are checked with a checkmark icon. * Indicating menuitemradio elements are checked with a filled in circle icon.
w3c · Dec 12, 2018 · 08e5fe0 · 08e5fe0
1 parent 301cb0d
commit 08e5fe0
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/examples/menubar/menubar-2/css/menubarAction.css b/examples/menubar/menubar-2/css/menubarAction.css
@@ -95,12 +95,16 @@ ul[role="menubar"] [role="menuitemradio"][aria-checked='true'] {
   padding-right: 1.25em;
 }
 
-ul[role="menubar"] [role="menuitemcheckbox"][aria-checked='true']:before,
-ul[role="menubar"] [role="menuitemradio"][aria-checked='true']:before {
+ul[role="menubar"] [role="menuitemcheckbox"][aria-checked='true']:before {
   content: url('../images/check-brown.png');
   padding-right: 0.3em;
 }
 
+ul[role="menubar"] [role="menuitemradio"][aria-checked='true']:before {
+  content: url('../images/dot-brown.png');
+  padding-right: 0.3em;
+}
+
 
 /*
 * Text area styles

diff --git a/examples/menubar/menubar-2/images/dot-brown.png b/examples/menubar/menubar-2/images/dot-brown.png