Fix 1px border-collapse padding bug.

predixdesignsystem · Mar 15, 2016 · a6d5a38 · a6d5a38
1 parent b7cdada
commit a6d5a38
Show file tree

Hide file tree

Showing 8 changed files with 113 additions and 210 deletions.
diff --git a/css/aha-table-sketch.css b/css/aha-table-sketch.css
@@ -184,9 +184,7 @@ html {
   /*! Comment to prevent cssmin munging this rule with html above and borking Safari */
   box-sizing: border-box; }
 
-*,
-*:before,
-*:after {
+*, *:before, *:after {
   box-sizing: inherit; }
 
 /**
@@ -249,15 +247,13 @@ a {
   /**
  * Improve readability when focused and also mouse hovered in all browsers.
  */ }
-  a:link,
-  a:visited {
+  a:link, a:visited {
     color: #3e87e8; }
   a:hover {
     color: #3573c5; }
   a:active {
     color: #2b5ea2; }
-  a:active,
-  a:hover {
+  a:active, a:hover {
     outline: 0; }
 
 /**
@@ -340,9 +336,9 @@ a {
   padding: 0 !important;
   clip: rect(0 0 0 0) !important; }
 
-.a11y.focusable:active,
-.a11y.focusable:focus,
-.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
+.a11y.focusable:active, .a11y.focusable:focus,
+.visuallyhidden.focusable:active,
+.visuallyhidden.focusable:focus {
   position: static;
   overflow: visible;
   width: auto;
@@ -628,9 +624,9 @@ textarea {
   box-shadow: inset 0 0 0 1px #e4e4ea;
   background-color: #efeff4;
   color: black; }
-  .text-input[readonly],
-  .text-input[disabled],
-  textarea[readonly], textarea[disabled] {
+  .text-input[readonly], .text-input[disabled],
+  textarea[readonly],
+  textarea[disabled] {
     box-shadow: none; }
   .text-input[readonly],
   textarea[readonly] {
@@ -701,8 +697,7 @@ select::-ms-expand {
 .text-input {
   height: 2em;
   line-height: 1; }
-  .text-input + [type=checkbox],
-  .text-input + [type=radio] {
+  .text-input + [type=checkbox], .text-input + [type=radio] {
     margin-left: 1.3333333333rem; }
   .text-input + .label--inline {
     margin-left: 0.6666666667rem; }
@@ -714,8 +709,7 @@ select::-ms-expand {
   .text-input:-moz-placeholder {
     padding-top: 1px; }
 
-.text-input + [type=submit],
-.text-input [type=cancel],
+.text-input + [type=submit], .text-input [type=cancel],
 .label--inline + [type=submit],
 .label--inline [type=cancel] {
   margin-left: 1.3333333333rem; }
@@ -733,8 +727,7 @@ textarea {
   cursor: pointer; }
   [type=checkbox][disabled], [type=radio][disabled] {
     cursor: not-allowed; }
-    [type=checkbox][disabled] + .label--inline,
-    [type=radio][disabled] + .label--inline {
+    [type=checkbox][disabled] + .label--inline, [type=radio][disabled] + .label--inline {
       cursor: not-allowed; }
 
 [type=checkbox] + .label--inline {
@@ -787,14 +780,12 @@ textarea {
   width: 100%;
   border-collapse: collapse;
   border-spacing: 0; }
-  .table th,
-  .table .th,
+  .table th, .table .th,
   .table td,
   .table .td {
     border: 1px solid #b1b1bc;
     padding: 0.6666666667rem; }
-  .table th,
-  .table .th {
+  .table th, .table .th {
     text-align: left; }
 
 /**
@@ -806,17 +797,15 @@ textarea {
 /**
    * Tightly packed cells.
    */
-.table--small th,
-.table--small .th,
+.table--small th, .table--small .th,
 .table--small td,
 .table--small .td {
   padding: 0.3333333333rem; }
 
 /**
    * Tables with widely padded cells.
    */
-.table--large th,
-.table--large .th,
+.table--large th, .table--large .th,
 .table--large td,
 .table--large .td {
   padding: 1rem; }
@@ -833,8 +822,7 @@ textarea {
 
 .table--rows {
   border-top-width: 1px; }
-  .table--rows th,
-  .table--rows .th,
+  .table--rows th, .table--rows .th,
   .table--rows td,
   .table--rows .td {
     border-bottom-width: 1px; }
@@ -851,8 +839,7 @@ textarea {
 
 .table--columns {
   border-left-width: 1px; }
-  .table--columns th,
-  .table--columns .th,
+  .table--columns th, .table--columns .th,
   .table--columns td,
   .table--columns .td {
     border-right-width: 1px; }
@@ -943,11 +930,7 @@ textarea {
   text-transform: none;
   white-space: nowrap;
   background-color: #e4e4ea; }
-  .btn,
-  .btn:link,
-  .btn:visited,
-  .btn:hover,
-  .btn:active {
+  .btn, .btn:link, .btn:visited, .btn:hover, .btn:active {
     color: black; }
   .btn:hover {
     border-color: #9999a3;
@@ -985,12 +968,7 @@ button.btn {
   border-radius: 0;
   padding: 0;
   line-height: inherit; }
-  .btn--bare,
-  .btn--bare:link,
-  .btn--bare:visited,
-  .btn--bare:hover,
-  .btn--bare:active,
-  .btn--bare:focus {
+  .btn--bare, .btn--bare:link, .btn--bare:visited, .btn--bare:hover, .btn--bare:active, .btn--bare:focus {
     box-shadow: none;
     background: none;
     color: inherit; }
@@ -1002,11 +980,7 @@ button.btn {
   border-color: #2b5ea2;
   box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15);
   background-color: #3e87e8; }
-  .btn--primary,
-  .btn--primary:link,
-  .btn--primary:visited,
-  .btn--primary:hover,
-  .btn--primary:active {
+  .btn--primary, .btn--primary:link, .btn--primary:visited, .btn--primary:hover, .btn--primary:active {
     color: white; }
   .btn--primary:hover {
     border-color: transparent;
@@ -1018,11 +992,7 @@ button.btn {
 /**
    * Change button colors for disabled buttons
    */
-.btn--disabled,
-.btn--disabled:link,
-.btn--disabled:visited,
-.btn--disabled:hover,
-.btn--disabled:active,
+.btn--disabled, .btn--disabled:link, .btn--disabled:visited, .btn--disabled:hover, .btn--disabled:active,
 .btn[disabled],
 .btn[disabled]:link,
 .btn[disabled]:visited,
@@ -1091,6 +1061,8 @@ button.btn {
   overflow-x: scroll;
   margin-bottom: 1rem;
   padding-left: 1px;
+  /*firefox border collapse fix*/
+  padding-right: 1px;
   /*firefox border collapse fix*/ }
 
 th, .th {