COMPLETED: Card sub-components

TODO: fixed styles for :active state

src/styles/card.sass

@@ -2,20 +2,26 @@
 
 $padding: 16px
 
-.m3:not(:first-child):is(.m3-card)
-    padding: $padding
+@function padding-calculating($has-padding)
+    @if($has-padding == true)
+        @return $padding
+    @else
+        @return 0px
 
-:is(div.m3-card-footer, header.m3-card-header, section.m3-card-body).m3
-    padding: $padding
+div.m3.m3-card > .m3-card-media:first-child
+    padding: padding-calculating(false)
+    border-radius: 12px !important
+
+:is(div.m3-card-footer, header.m3-card-header, section.m3-card-body, img.m3-card-media).m3
+    padding: padding-calculating(true)
     display: block
     box-sizing: border-box
 
 .m3.m3-card-media
     &.m3-rounded
-        border-radius: 12px
+        border-radius: 12px + padding-calculating(true)
 
     width: 100%
-    height: 100%
     display: block
     contain: content
     position: relative