From 56a0a33b7033f7b20be9d0b01f54901425412730 Mon Sep 17 00:00:00 2001
From: M Fahru <m.fahru@overleaf.com>
Date: Wed, 24 Apr 2024 05:13:35 -0700
Subject: [PATCH] Merge pull request #17994 from
 overleaf/mf-create-config-contact-form-website-redesign

[web][website-redesign] Migrate "for government" and "back to school 2023" CMS page to website redesign style by repurposing the "new page style" option on CMS

GitOrigin-RevId: 5f5b3bde7be21746c48718253252c8634a20bb19
---
 .../frontend/stylesheets/app/cms-page.less    | 44 ++++++++++++++-----
 .../frontend/stylesheets/components/card.less |  7 +++
 .../web/frontend/stylesheets/core/page.less   | 34 +-------------
 3 files changed, 42 insertions(+), 43 deletions(-)

diff --git a/services/web/frontend/stylesheets/app/cms-page.less b/services/web/frontend/stylesheets/app/cms-page.less
index e4af549ab5..2c3f5e6dac 100644
--- a/services/web/frontend/stylesheets/app/cms-page.less
+++ b/services/web/frontend/stylesheets/app/cms-page.less
@@ -4,17 +4,16 @@
   including About and Blog
 */
 .cms-page {
-  &.page-style {
-    /*
-    Links and Buttons
-  */
-
-    a {
-      color: @link-color;
-      &:hover {
-        color: @link-hover-color;
-      }
+  &.website-redesign {
+    h1 {
+      font-size: 2rem; // 32px
     }
+
+    h2 {
+      font-size: 1.5rem; // 24px
+    }
+
+    /* Buttons */
     // correct color property set on <a> above:
     .reset-btns;
     .alert {
@@ -25,6 +24,31 @@
         .btn-alert-info;
       }
     }
+
+    blockquote.quote-picture-bottom {
+      padding: (@line-height-computed / 2) @line-height-computed;
+
+      .quote-picture-and-person {
+        font-size: 18px;
+      }
+
+      .quote-by-position {
+        font-weight: 400;
+      }
+    }
+  }
+
+  .section-row {
+    margin: 0 auto;
+    /* match .col-sm-12 */
+    /* @grid-gutter-width  is used for margins */
+    max-width: (@screen-sm) - @grid-gutter-width!important;
+    @media (min-width: @screen-md-min) {
+      max-width: (@screen-md) - @grid-gutter-width!important;
+    }
+    @media (min-width: @screen-lg-min) {
+      max-width: (@screen-lg) - @grid-gutter-width!important;
+    }
   }
 
   padding-bottom: 0;
diff --git a/services/web/frontend/stylesheets/components/card.less b/services/web/frontend/stylesheets/components/card.less
index 8ca195e337..2c0c10af1b 100644
--- a/services/web/frontend/stylesheets/components/card.less
+++ b/services/web/frontend/stylesheets/components/card.less
@@ -87,3 +87,10 @@
   background-color: @ol-blue-gray-1;
   border-radius: @card-border-radius;
 }
+
+.website-redesign {
+  .card {
+    background-color: @card-gray-bg-color;
+    border-radius: 24px;
+  }
+}
diff --git a/services/web/frontend/stylesheets/core/page.less b/services/web/frontend/stylesheets/core/page.less
index 33296008d5..d679f1baf9 100644
--- a/services/web/frontend/stylesheets/core/page.less
+++ b/services/web/frontend/stylesheets/core/page.less
@@ -1,37 +1,5 @@
-.page-style {
-  background-color: @white;
-
-  a:not(.btn) {
-    text-decoration: underline;
-  }
-
-  .page-header {
-    border-bottom: none;
-    margin: 0;
-    margin-top: 60px !important;
-    padding: 0;
-    text-align: center;
-  }
-
-  .card {
-    background-color: @card-gray-bg-color;
-    border-radius: 24px;
-  }
-
+.website-redesign {
   video {
     clip-path: inset(0 0); // fix Safari bug that will sometimes add border
   }
-
-  .section-row {
-    margin: 0 auto;
-    /* match .col-sm-12 */
-    /* @grid-gutter-width  is used for margins */
-    max-width: (@screen-sm) - @grid-gutter-width!important;
-    @media (min-width: @screen-md-min) {
-      max-width: (@screen-md) - @grid-gutter-width!important;
-    }
-    @media (min-width: @screen-lg-min) {
-      max-width: (@screen-lg) - @grid-gutter-width!important;
-    }
-  }
 }