From a885adabb27c62ee145aab3a063a13ee1e6be98d Mon Sep 17 00:00:00 2001
From: Jessica Lawshe <5312836+lawshe@users.noreply.github.com>
Date: Wed, 3 Jul 2024 08:31:38 -0500
Subject: [PATCH] Merge pull request #19210 from overleaf/jel-cms-flex

[web] Add flex layout handling for CMS pages

GitOrigin-RevId: d7c2806449fba19dc81356deef9b9f61deff14c4
---
 .../frontend/stylesheets/app/cms-page.less    | 27 +++++++++++++++++++
 .../frontend/stylesheets/components/card.less |  1 -
 2 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/services/web/frontend/stylesheets/app/cms-page.less b/services/web/frontend/stylesheets/app/cms-page.less
index 639c635b6c..929cbac3d0 100644
--- a/services/web/frontend/stylesheets/app/cms-page.less
+++ b/services/web/frontend/stylesheets/app/cms-page.less
@@ -398,6 +398,23 @@
   bottom: 1px;
 }
 
+// `Layout | Grid` display options
+.row-equal-column-heights {
+  @media (min-width: @screen-sm-min) {
+    display: flex;
+    flex-flow: row wrap;
+
+    div[class*='col-'] {
+      display: flex;
+      flex-direction: column;
+      .card,
+      .no-card {
+        height: 100%;
+      }
+    }
+  }
+}
+
 .vertically-center-col {
   // remove margin to better vertically align
   // some elements need to be nested within a container, and others are directly within .no-card/.card
@@ -618,3 +635,13 @@
     }
   }
 }
+
+.bottom-align-last-entry {
+  display: flex;
+  flex-direction: column;
+  * {
+    &:last-child {
+      margin-top: auto;
+    }
+  }
+}
diff --git a/services/web/frontend/stylesheets/components/card.less b/services/web/frontend/stylesheets/components/card.less
index 7fc0ecf63f..993ebfd0bd 100644
--- a/services/web/frontend/stylesheets/components/card.less
+++ b/services/web/frontend/stylesheets/components/card.less
@@ -114,7 +114,6 @@
   &.card-purple-top-border {
     background-color: white;
     border-radius: 8px;
-    height: 100%;
     box-shadow:
       0px 2px 4px 0px #1e253014,
       0px 4px 12px 0px #1e25301f;