Permalink
Browse files

Boot Crap! Rules for Twitter Bootstrap

  • Loading branch information...
Heydon committed Jul 7, 2014
1 parent af25286 commit 8e0a85d2327976b997b5bb56d40a38f40f3f7a10
Showing with 47 additions and 1 deletion.
  1. +47 −1 revenge.css
View
@@ -66,7 +66,15 @@ dt + *:not(dd):after,
abbr div:after, b div:after, i div:after, span div:after, em div:after,
strong div:after, small div:after, cite div:after, q div:after, code div:after,
label div:after,
[tabindex]:not([tabindex="0"]):not([tabindex="-1"]):after
[tabindex]:not([tabindex="0"]):not([tabindex="-1"]):after,
li.divider:not([role="separator"]):after, li:empty:not([role="separator"]):after,
li.dropdown-header:after,
.btn:not(button):not([href]):after,
li.disabled > a[href]:not([tabindex="-1"]):after,
li.disabled > button:not([disabled]):after,
a.disabled[href]:not([tabindex="-1"]):after,
button.disabled:not([disabled]):after,
[data-toggle="dropdown"]:not([aria-haspopup]):after
{
display: inline-block !important;
background: #dc143c !important;
@@ -271,3 +279,41 @@ label div:after {
content: 'Do not disrupt the natural tab order.';
}
/* Boot Crap (specific to Twitter BootStrap class misuse)
-----------------------------------------------------------------------------*/
/* Don't use list elements to divide up list elements.
Use a class-based style on the preceeding or proceeding element or use role="separator"
on the item in question */
li.divider:not([role="separator"]):after, li:empty:not([role="separator"]):after {
content: 'Do not use list items to divide up lists unless they have role = separator';
}
/* For obvious reasons, a header for a list should not be an item in that list.
Make two lists! */
li.dropdown-header:after {
content: 'Do not use list items as headers for lists, obvs';
}
/* Only <button>s and, to a lesser extent, <a>s WITH HREFS are keyboard functional as "buttons" */
.btn:not(button):not([href]):after {
content: 'This is not an accessible control. Use a <button> or a <a> with href.';
}
/* Disabled links and buttons should be disabled correctly */
li.disabled > a[href]:not([tabindex="-1"]):after,
li.disabled > button:not([disabled]):after,
a.disabled[href]:after,
button.disabled:not([disabled]):after {
content: 'Disable buttons with disabled attr and links by removing href';
}
/* The submenu should be indicated with aria-haspopup */
[data-toggle="dropdown"]:not([aria-haspopup]):after {
content: 'Indicate the hidden menu with aria-haspopup';
}

0 comments on commit 8e0a85d

Please sign in to comment.