From dc9b9015082ef4e07bc3961ace02000aa8c5f210 Mon Sep 17 00:00:00 2001
From: Jessica Lawshe <jessica.lawshe@overleaf.com>
Date: Thu, 17 Nov 2022 09:29:59 -0600
Subject: [PATCH] Merge pull request #10497 from overleaf/jel-cms-new-style

[web] Add new CMS page style

GitOrigin-RevId: 320e02dc2ccfd211396548d7b813bd4c675e6f84
---
 .../stylesheets/app/content_page.less         | 20 +++++++++++++++----
 .../frontend/stylesheets/core/page-style.less | 19 ++++++++++++++++++
 .../frontend/stylesheets/core/variables.less  |  1 +
 .../web/frontend/stylesheets/main-style.less  |  1 +
 services/web/frontend/stylesheets/style.less  |  1 +
 5 files changed, 38 insertions(+), 4 deletions(-)
 create mode 100644 services/web/frontend/stylesheets/core/page-style.less

diff --git a/services/web/frontend/stylesheets/app/content_page.less b/services/web/frontend/stylesheets/app/content_page.less
index 9d2d49c93d..b10baaa3d2 100644
--- a/services/web/frontend/stylesheets/app/content_page.less
+++ b/services/web/frontend/stylesheets/app/content_page.less
@@ -8,10 +8,22 @@
   /*
     Links and Buttons
   */
-  a {
-    color: @link-color-alt;
-    &:hover {
-      color: @link-hover-color-alt;
+  &:not(.page-style) {
+    a {
+      color: @link-color-alt;
+      &:hover {
+        color: @link-hover-color-alt;
+      }
+    }
+    // correct color property set on <a> above:
+    .reset-btns;
+    .alert {
+      .alert;
+    }
+    .alert-info {
+      .btn-info {
+        .btn-alert-info;
+      }
     }
   }
 
diff --git a/services/web/frontend/stylesheets/core/page-style.less b/services/web/frontend/stylesheets/core/page-style.less
new file mode 100644
index 0000000000..4345171418
--- /dev/null
+++ b/services/web/frontend/stylesheets/core/page-style.less
@@ -0,0 +1,19 @@
+.page-style {
+  background-color: @white;
+
+  a {
+    text-decoration: underline;
+  }
+
+  .page-header {
+    border-bottom: none;
+    margin: 0;
+    padding: 0;
+    text-align: center;
+  }
+
+  .card {
+    background-color: @blue-10;
+    border-radius: 24px;
+  }
+}
diff --git a/services/web/frontend/stylesheets/core/variables.less b/services/web/frontend/stylesheets/core/variables.less
index 9fd99c8270..03d6d26d21 100644
--- a/services/web/frontend/stylesheets/core/variables.less
+++ b/services/web/frontend/stylesheets/core/variables.less
@@ -29,6 +29,7 @@
 @ol-dark-red: #a6312b;
 
 @blue: #405ebf;
+@blue-10: #f1f4f9;
 @blueDark: #040d2d;
 @green: #46a546;
 @red: #a93529;
diff --git a/services/web/frontend/stylesheets/main-style.less b/services/web/frontend/stylesheets/main-style.less
index a9cf7b195f..56b6a1fd0b 100644
--- a/services/web/frontend/stylesheets/main-style.less
+++ b/services/web/frontend/stylesheets/main-style.less
@@ -29,6 +29,7 @@
 @import (less) 'vendor/codemirror-show-hint.css';
 
 // Core CSS
+@import 'core/page-style.less';
 @import 'core/scaffolding.less';
 @import 'core/type.less';
 @import 'core/grid.less';
diff --git a/services/web/frontend/stylesheets/style.less b/services/web/frontend/stylesheets/style.less
index 090e08f407..6a77ed6d56 100644
--- a/services/web/frontend/stylesheets/style.less
+++ b/services/web/frontend/stylesheets/style.less
@@ -10,6 +10,7 @@
 // Core variables and mixins
 @import 'core/variables.less';
 @import 'core/css-variables.less';
+@import 'core/page-style.less';
 @import 'app/ol-style-guide.less';
 @import '_style_includes.less';
 @import '_ol_style_includes.less';