fix(card): Fix border wrapping images on cards

Author: Adam Raider

packages/ray/lib/_card.scss

@@ -1,14 +1,20 @@
 $card-padding: 1rem;
-$card-border-color: #e6e6e6;
+$card-border-color: $gray35;
 
 .card {
   width: 100%;
-  border: 1px solid $card-border-color;
   border-radius: $border-radius;
   background-color: $white;
   overflow: hidden;
 
   &__content {
     padding: $card-padding;
+    border: 1px solid $card-border-color;
+
+    &:not(:first-child) {
+      border-bottom-left-radius: $border-radius;
+      border-bottom-right-radius: $border-radius;
+      border-top: 0;
+    }
   }
 }

packages/ray/lib/_image.scss

@@ -4,7 +4,7 @@
   height: auto;
   position: relative;
   overflow: hidden;
-  background-color: $gray30;
+  background-color: $gray35;
 
   img {
     position: absolute;
@@ -31,7 +31,7 @@
   display: block;
   width: 100%;
   height: auto;
-  background-color: $gray30;
+  background-color: $gray35;
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;