diff --git a/landing/competitor-feature-card.css b/landing/competitor-feature-card.css --- a/landing/competitor-feature-card.css +++ b/landing/competitor-feature-card.css @@ -15,3 +15,7 @@ color: var(--violet-dark-100); margin-top: 16px; } + +.descriptionText { + min-height: 80px; +} diff --git a/landing/competitor-feature-card.react.js b/landing/competitor-feature-card.react.js --- a/landing/competitor-feature-card.react.js +++ b/landing/competitor-feature-card.react.js @@ -40,6 +40,7 @@ comingSoon={comingSoon} competitorDescription={competitorDescription} commDescription={commDescription} + descriptionTextClassName={css.descriptionText} />
Read more
diff --git a/landing/competitor-feature.css b/landing/competitor-feature.css --- a/landing/competitor-feature.css +++ b/landing/competitor-feature.css @@ -11,6 +11,9 @@ margin-bottom: 16px; flex-wrap: wrap; row-gap: 8px; + /* We use 34px to match the coming soon badge's height and this + keep everything aligned */ + min-height: 34px; } .headingText { @@ -42,7 +45,6 @@ .descriptionText { color: var(--white-80); - min-height: 80px; margin-top: 8px; } diff --git a/landing/competitor-feature.react.js b/landing/competitor-feature.react.js --- a/landing/competitor-feature.react.js +++ b/landing/competitor-feature.react.js @@ -40,6 +40,7 @@ +comingSoon: boolean, +competitorDescription: string | $ReadOnlyArray