Boot Crap! Rules for Twitter Bootstrap

revenge.css

@@ -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';
+}