From e4b3ee8988f632cfe8cb49d68f637f14cb2e2c2b Mon Sep 17 00:00:00 2001
From: Jessica Lawshe <5312836+lawshe@users.noreply.github.com>
Date: Tue, 24 Sep 2024 10:19:38 -0500
Subject: [PATCH] Merge pull request #20508 from
 overleaf/as-cms-bs5-link-colours

[web] Adjust link behaviour for Website Redesign in BS5

GitOrigin-RevId: d09831de1f51c4e2a9bc06b0c9fd9f4a1909d7f0
---
 .../stylesheets/bootstrap-5/base/links.scss   |  8 +++----
 .../bootstrap-5/foundations/colors.scss       |  8 +++----
 .../bootstrap-5/pages/website-redesign.scss   | 23 ++++++++++++++++---
 3 files changed, 28 insertions(+), 11 deletions(-)

diff --git a/services/web/frontend/stylesheets/bootstrap-5/base/links.scss b/services/web/frontend/stylesheets/bootstrap-5/base/links.scss
index 92506fdfc8..a44df31efb 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/base/links.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/base/links.scss
@@ -10,13 +10,13 @@
 a {
   color: var(--link-color);
 
-  &:hover {
-    color: var(--link-hover-color);
-  }
-
   &:visited {
     color: var(--link-visited-color);
   }
+
+  &:hover {
+    color: var(--link-hover-color);
+  }
 }
 
 .link-monospace {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/foundations/colors.scss b/services/web/frontend/stylesheets/bootstrap-5/foundations/colors.scss
index d106d3618d..019b40bbea 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/foundations/colors.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/foundations/colors.scss
@@ -96,9 +96,9 @@ $border-disabled: $neutral-20;
 $border-active: $blue-50;
 $border-danger: $red-50;
 $border-divider: $neutral-20;
-$link-web: $green-60;
+$link-web: $green-50;
 $link-web-hover: $green-70;
-$link-web-visited: $green-70;
+$link-web-visited: $green-50;
 $link-ui: $blue-50;
 $link-ui-hover: $blue-60;
 $link-ui-visited: $blue-60;
@@ -213,9 +213,9 @@ $link-ui-visited-dark: $blue-40;
   --border-active: var(--blue-50);
   --border-danger: var(--red-50);
   --border-divider: var(--neutral-20);
-  --link-web: var(--green-60);
+  --link-web: var(--green-50);
   --link-web-hover: var(--green-70);
-  --link-web-visited: var(--green-70);
+  --link-web-visited: var(--green-50);
   --link-ui: var(--blue-50);
   --link-ui-hover: var(--blue-60);
   --link-ui-visited: var(--blue-60);
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/website-redesign.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/website-redesign.scss
index c6c09a24d8..57241fe304 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/website-redesign.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/website-redesign.scss
@@ -27,6 +27,10 @@
 }
 
 .website-redesign {
+  --link-color: var(--link-web);
+  --link-hover-color: var(--link-web-hover);
+  --link-visited-color: var(--link-web-visited);
+
   // hero section of features, enterprises, and universities will have an image that will overflow the page
 
   --bs-body-color: var(--neutral-70);
@@ -34,7 +38,9 @@
   overflow-x: hidden;
 
   a {
-    text-decoration: none;
+    &:hover {
+      text-decoration: underline;
+    }
 
     &:focus,
     &:focus-visible {
@@ -45,8 +51,6 @@
       @include box-shadow-button-input;
     }
 
-    // TODO: remove visited?
-
     i {
       vertical-align: middle;
       margin-left: var(--spacing-02);
@@ -61,6 +65,19 @@
         line-height: inherit;
       }
     }
+
+    // Specific overrides for link styles
+    &.link-monospace {
+      text-decoration: none;
+
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+
+    &.btn:hover {
+      text-decoration: none;
+    }
   }
 
   h1,