fix(ArticleCard): add missing styles for subtitle on dark cards (#439)

carbon-design-system · Sep 24, 2019 · 7719fba · 7719fba · vercel · Sep 24, 2019
1 parent 38fe06b
commit 7719fba
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/packages/example/src/pages/components/ArticleCard.mdx b/packages/example/src/pages/components/ArticleCard.mdx
@@ -63,6 +63,7 @@ The `<ArticleCard>` component should generally be used inside of a `<Row>` and `
 </Column>
 <Column colMd={4} colLg={4} noGutterMdLeft>
     <ArticleCard
+      subTitle="subTitle"
       title="Explore & Create"
       author="Josh Black"
       readTime="Read time: 5 min"
@@ -77,6 +78,7 @@ The `<ArticleCard>` component should generally be used inside of a `<Row>` and `
 </Column>
 <Column colMd={4} colLg={4} noGutterMdLeft>
     <ArticleCard
+      subTitle="subTitle"
       title="Explore & Create"
       author="Josh Black"
       date="April 29, 2019"

diff --git a/packages/gatsby-theme-carbon/src/components/ArticleCard/article-card.scss b/packages/gatsby-theme-carbon/src/components/ArticleCard/article-card.scss
@@ -66,7 +66,8 @@
   background: $carbon--gray-80; //$hover-ui for gray 90 theme
 }
 
-.#{$prefix}--article-card--dark .#{$prefix}--article-card__title {
+.#{$prefix}--article-card--dark .#{$prefix}--article-card__title,
+.#{$prefix}--article-card--dark .#{$prefix}--article-card__subtitle {
   color: $text-04;
 }
 
@@ -89,6 +90,7 @@
 }
 
 .#{$prefix}--article-card--disabled .#{$prefix}--article-card__title,
+.#{$prefix}--article-card--disabled .#{$prefix}--article-card__subtitle,
 .#{$prefix}--article-card--disabled .#{$prefix}--article-card__info {
   color: $disabled-03;
 }
@@ -107,6 +109,8 @@
 
 .#{$prefix}--article-card--disabled.#{$prefix}--article-card--dark
   .#{$prefix}--article-card__title,
+.#{$prefix}--article-card--disabled.#{$prefix}--article-card--dark
+  .#{$prefix}--article-card__subtitle,
 .#{$prefix}--article-card--disabled.#{$prefix}--article-card--dark
   .#{$prefix}--article-card__info {
   color: $carbon--gray-50; //$disabled-03 for gray 90