_card.scss in active_frontend-17.0.0

- old
+ new

@@ -29,11 +29,11 @@
       float: none;
       margin: 0;
       width: 1%;
 
       > a {
-        padding: 15px 0 14px;
+        padding: 16px 0;
         text-align: center;
       }
     }
   }
 
@@ -42,66 +42,64 @@
   .table-responsive {
     border-radius: 0;
     border-width: 0;
   }
 }
+.card-header,
 .card-body,
-.card-footer { padding: 10px 15px; }
+.card-footer { padding: 12px 20px; }
 .card-header {
   border-bottom-style: solid;
   border-bottom-width: 1px;
   font-weight: text-weight(semibold);
-  padding: 9px 15px 11px;
+  padding-bottom: 13px;
+  padding-top: 11px;
 }
 .card-wizard {
   border-collapse: separate;
   box-sizing: border-box;
   display: table;
-  font-size: text-size(s);
+  font-size: text-size(xs);
   font-weight: text-weight(normal);
   list-style-type: none;
   margin: 0;
   padding: 0;
   position: relative;
   table-layout: fixed;
   white-space: nowrap;
 
   > a,
   > li {
+    background: color(light-haze);
+    color: color(gray);
     display: table-cell;
-    padding: 9px 0;
+    padding: 2px 0;
     text-align: center;
     vertical-align: middle;
     width: 1%;
 
     &:not(:first-child) {
       border-left-style: solid;
       border-left-width: 1px;
     }
-
-    &.current {
-      background: background-hover-color(light-haze);
-      color: color(primary);
-    }
-    &.completed {
-      background: color(light-haze);
-      color: color(gray);
-    }
+    &.current,
+    &.completed { background: color(white); }
+    &.current { color: color(primary); }
   }
 
   &.dark {
     > a,
     > li {
-      &.current { background: background-hover-color(slate); }
-      &.completed { background: color(slate); }
+      &.current,
+      &.completed { background: color(light-slate); }
     }
   }
   &.light {
     > a,
     > li {
-      &.current { background: background-hover-color(haze); }
-      &.completed { background: color(haze); }
+      &.current,
+      &.completed { background: color(dark-haze); }
     }
   }
 }
 .card-wizard,
 .card-body {
@@ -124,11 +122,12 @@
   display: table;
   width: 100%;
 
   a {
     display: table-cell;
+    font-size: text-size(b);
     line-height: 1;
-    padding: 15px 0;
+    padding: 17px 0;
     text-align: center;
     width: 1%;
 
     &:not(:last-child) {
       border-right-style: solid;