fix: update icon sizing for resource cards (#273)

* fix: update icon sizing for resource cards * chore: update image size styles * fix: add min width * chore: add min-height * add position static to gatsby image wrapper * chore: fix icon for real this time * chore: cleanup style order
carbon-design-system · Jul 30, 2019 · c8db707 · c8db707 · vercel · Jul 30, 2019
1 parent faf8664
commit c8db707
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/.gitignore b/.gitignore
@@ -69,4 +69,5 @@ yarn-error.log
 .yarn-integrity
 
 # Vscode settings
-.vscode/settings.json
+.vscode/settings.json
+.vscode/tasks.json
diff --git a/packages/gatsby-theme-carbon/src/components/ResourceCard/resource-card.scss b/packages/gatsby-theme-carbon/src/components/ResourceCard/resource-card.scss
@@ -28,8 +28,10 @@
   position: absolute;
   bottom: 1rem;
   left: 1rem;
-  width: 32px;
+  min-width: 32px;
   min-height: 32px;
+  display: flex;
+  align-items: flex-end;
 }
 
 .#{$prefix}--resource-card__icon--img .gatsby-resp-image-wrapper,
@@ -38,6 +40,10 @@
   margin-bottom: 0;
 }
 
+.#{$prefix}--resource-card__icon--img .gatsby-resp-image-wrapper {
+  position: static !important; //important needed to override inline style added by Gatsby
+}
+
 .#{$prefix}--resource-card__icon--action {
   position: absolute;
   bottom: 1rem;