From 39a499b25a2cabed7ba7fcd6055fb735e4c6e404 Mon Sep 17 00:00:00 2001
From: Tim Down <158919+timdown@users.noreply.github.com>
Date: Thu, 14 Nov 2024 12:05:44 +0000
Subject: [PATCH] Merge pull request #21622 from
 overleaf/td-settings-link-colour

Enable redesign for account settings page and use application link colour

GitOrigin-RevId: dad039810256bda47061799ef56a9c87a663ab3d
---
 services/web/app/views/layout-base.pug           |  6 +++++-
 services/web/app/views/layout-react.pug          |  3 +++
 services/web/app/views/user/settings.pug         |  1 +
 .../bootstrap-5/pages/website-redesign.scss      | 16 +++++++++-------
 4 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/services/web/app/views/layout-base.pug b/services/web/app/views/layout-base.pug
index a1a4dc0576..8ff0f4a3b7 100644
--- a/services/web/app/views/layout-base.pug
+++ b/services/web/app/views/layout-base.pug
@@ -9,9 +9,12 @@ html(
 	- let bootstrap5PageStatus = 'disabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
 	- let bootstrap5PageSplitTest = '' // Limits Bootstrap 5 usage on this page to users with an assignment of "enabled" for the specified split test. If left empty and bootstrap5PageStatus is "enabled", the page always uses Bootstrap 5.
 	- let isWebsiteRedesign = false
+	- let isApplicationPage = false	
 
 	block entrypointVar
 
+	block isApplicationPageVar
+
 	block vars
 
 	head
@@ -77,7 +80,8 @@ html(
 
 	body(class={
 		'thin-footer': showThinFooter,
-		'website-redesign': isWebsiteRedesign === true || websiteRedesignOverride
+		'website-redesign': isWebsiteRedesign === true || websiteRedesignOverride,
+		'application-page': isApplicationPage
 	}, data-theme="default")
 		if(settings.recaptcha && settings.recaptcha.siteKeyV3)
 			script(type="text/javascript", nonce=scriptNonce, src="https://www.recaptcha.net/recaptcha/api.js?render=" + settings.recaptcha.siteKeyV3, defer=deferScripts)
diff --git a/services/web/app/views/layout-react.pug b/services/web/app/views/layout-react.pug
index 0e9b375c3e..e03d70e41b 100644
--- a/services/web/app/views/layout-react.pug
+++ b/services/web/app/views/layout-react.pug
@@ -8,6 +8,9 @@ include ./_mixins/bootstrap_js
 block entrypointVar
 	- entrypoint = 'marketing'
 		
+block isApplicationPageVar
+	- isApplicationPage = true
+		
 block append meta
 	if bootstrapVersion === 5
 		- const canDisplayAdminMenu = hasAdminAccess()
diff --git a/services/web/app/views/user/settings.pug b/services/web/app/views/user/settings.pug
index 28bd7633bc..aee09abc2b 100644
--- a/services/web/app/views/user/settings.pug
+++ b/services/web/app/views/user/settings.pug
@@ -6,6 +6,7 @@ block entrypointVar
 block vars
 	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
 	- bootstrap5PageSplitTest = 'bootstrap-5'
+	- isWebsiteRedesign = true
 
 block append meta
 	meta(name="ol-hasPassword" data-type="boolean" content=hasPassword)
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 b393b67756..84631d281b 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/website-redesign.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/website-redesign.scss
@@ -29,9 +29,15 @@
 }
 
 .website-redesign {
-  --link-color: var(--link-web);
-  --link-hover-color: var(--link-web-hover);
-  --link-visited-color: var(--link-web-visited);
+  &:not(.application-page) {
+    --link-color: var(--link-web);
+    --link-hover-color: var(--link-web-hover);
+    --link-visited-color: var(--link-web-visited);
+
+    &:hover {
+      text-decoration: underline;
+    }
+  }
 
   // hero section of features, enterprises, and universities will have an image that will overflow the page
 
@@ -40,10 +46,6 @@
   overflow-x: hidden;
 
   a {
-    &:hover {
-      text-decoration: underline;
-    }
-
     &:focus,
     &:focus-visible {
       outline: 0;