Fixed negative border-radius valuein card headers #185

Office-of-Digital-Services · Feb 4, 2022 · 94e2e12 · 94e2e12
1 parent 4d0f15f
commit 94e2e12
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 21 deletions.
diff --git a/css/cagov.core.css b/css/cagov.core.css
@@ -20977,7 +20977,7 @@ select:focus {
 .card .toggle-more {
   display: inline-block;
   color: #777777;
-  font-family: 'CaGov';
+  font-family: "CaGov";
   font-size: 22px;
   margin-left: -11px;
   /* Change icon to minus */
@@ -21022,23 +21022,23 @@ select:focus {
 }
 
 .card-header:first-child {
-  border-radius: -1px -1px 0 0;
+  border-radius: 0 0 0 0;
 }
 
 .card-footer {
   padding: 1rem 1rem;
 }
 
 .card-footer:last-child {
-  border-radius: 0 0 -1px -1px;
+  border-radius: 0 0 0 0;
 }
 
 .card-img-top {
-  border-radius: -1px -1px 0 0;
+  border-radius: 0 0 0 0;
 }
 
 .card-img-bottom {
-  border-radius: 0 0 -1px -1px;
+  border-radius: 0 0 0 0;
 }
 
 /* -----------------------------------------

diff --git a/css/cagov.core.min.css b/css/cagov.core.min.css
diff --git a/source/scss/cagov/cards.scss b/source/scss/cagov/cards.scss
@@ -8,25 +8,25 @@
     background-color: $white;
     border: $card-border-width solid $card-border-color;
     border-radius: $card-border-radius;
-    
+
     .btn-block {
-            margin-top:5px;
+        margin-top: 5px;
     }
-    
+
     .toggle-more {
         display: inline-block;
         color: $gray-light;
-        font-family: 'CaGov';
+        font-family: "CaGov";
         font-size: 22px;
         margin-left: -11px;
-        
+
         &:before {
-            content:"\e050";       // .ca-gov-icon-plus-fill
+            content: "\e050"; // .ca-gov-icon-plus-fill
         }
-        
+
         /* Change icon to minus */
         &.active:before {
-            content:"\e04f";       // .ca-gov-icon-minus-fill
+            content: "\e04f"; // .ca-gov-icon-minus-fill
         }
     }
 }
@@ -37,7 +37,7 @@
 
 .card-title {
     margin-bottom: $card-spacer-y;
-    margin-top:0;
+    margin-top: 0;
 }
 
 .card-subtitle {
@@ -59,8 +59,6 @@
     }
 }
 
-
-
 //
 // Optional textual caps
 //
@@ -71,7 +69,7 @@
     //border-bottom: $card-border-width solid $card-border-color;
 
     &:first-child {
-            border-radius:$card-border-radius-inner $card-border-radius-inner 0 0;
+        border-radius: $card-border-radius-inner $card-border-radius-inner 0 0;
     }
 }
 
@@ -85,11 +83,10 @@
     }
 }
 
-
 // Card image caps
 .card-img-top {
     border-radius: $card-border-radius-inner $card-border-radius-inner 0 0;
 }
 .card-img-bottom {
     border-radius: 0 0 $card-border-radius-inner $card-border-radius-inner;
-}
+}
diff --git a/source/scss/variables.scss b/source/scss/variables.scss
@@ -176,7 +176,7 @@ $caret-width-large: 5px !default;
 $card-border-width: 1px;
 $card-border-radius: $border-radius-base;
 $card-border-color: #ddd;
-$card-border-radius-inner: ($card-border-radius - $card-border-width);
+$card-border-radius-inner: ($card-border-radius);
 $card-cap-bg: rgba(0, 0, 0, 0.065);
 $card-bg: $body-bg;
 $card-link-hover-color: $body-bg;