Fix Home page card heights (#15)

swirle13 · Nov 15, 2023 · 7b6aef5 · 7b6aef5
1 parent dcdc25b
commit 7b6aef5
Showing 1 changed file with 10 additions and 7 deletions.
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
@@ -18,17 +18,20 @@ export default function Home({ t }): JSX.Element {
             <Row xs={1} md={2} lg={3} className="g-4 p-3">
                 {t("home.linkedPages").map((_, idx) => (
                     <Col key={idx}>
-                        <Card>
+                        <Card className="h-100">
                             <Card.Img variant="top" src="" />
-                            <Card.Body>
-                                <Card.Title>{_.name}</Card.Title>
-                                <Card.Text>{_.desc}</Card.Text>
-                                <Row className='self-end m-1'>
-                                    <Button variant="secondary" href={_.link} className='align-bottom'>
+                            <Col id="horizontalCardTextCol" className="px-0 d-flex">
+                                <Row id="horizontalCardTextRow" className="g-0 flex-grow-1 d-flex" /* xs={1} */>
+                                    <Card.Body>
+                                        <Card.Title>{_.name}</Card.Title>
+                                        <Card.Text>{_.desc}</Card.Text>
+                                    </Card.Body>
+                                    <Button variant="secondary" className='align-self-end pt-auto m-3 flex-shrink-1'
+                                        href={_.link}>
                                         {_.btn}
                                     </Button>
                                 </Row>
-                            </Card.Body>
+                            </Col>
                         </Card>
                     </Col>
                 ))}