fix: fix FeatureList layout

acid-info · Jul 10, 2023 · 4e2f413 · 4e2f413
1 parent 3006a25
commit 4e2f413
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/packages/logos-docusaurus-theme/src/client/components/mdx/FeatureList/FeatureList.scss b/packages/logos-docusaurus-theme/src/client/components/mdx/FeatureList/FeatureList.scss
@@ -29,14 +29,23 @@
 
 .mdx-feature-list__feature {
   border-top: 1px solid rgb(var(--lsd-border-primary));
+  min-height: 332px;
+}
+
+.mdx-feature-list__feature-inner {
+  display: flex;
+  flex-direction: column;
 }
 
 .mdx-feature-list__feature-title {
   margin-top: 1rem;
 }
 
 .mdx-feature-list__feature-description {
-  margin-top: 8.625rem;
+  flex: 1 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
 }
 
 .mdx-feature-list__extra {

diff --git a/packages/logos-docusaurus-theme/src/client/components/mdx/FeatureList/FeatureList.tsx b/packages/logos-docusaurus-theme/src/client/components/mdx/FeatureList/FeatureList.tsx
@@ -55,7 +55,7 @@ export const FeatureList: React.FC<FeatureListProps> = ({
                 component="h3"
                 className="mdx-feature-list__feature-description"
               >
-                {feature.description}
+                <span>{feature.description}</span>
               </Typography>
             </div>
             <div className="mdx-feature-list__feature-border"></div>