Merge pull request #19722 from overleaf/jel-green-50

[web] Use `green-50` instead of `emerald-green`

GitOrigin-RevId: e329fc520f414dfac65f02866aadd940e1feef92

services/web/frontend/stylesheets/app/base.less

@@ -191,7 +191,7 @@
     font-size: @font-size-extra-small;
 
     & > a {
-      color: var(--emerald-green);
+      color: var(--green-50);
 
       &:hover {
         color: var(--green-60);
@@ -207,7 +207,7 @@
       font-size: @font-size-extra-small;
 
       & > a {
-        color: var(--emerald-green);
+        color: var(--green-50);
 
         &:hover {
           color: var(--green-60);

services/web/frontend/stylesheets/app/homepage.less

@@ -203,12 +203,6 @@
 
     .tos-agreement-notice {
       font-size: 0.75rem;
-
-      a {
-        color: @green-60;
-        text-decoration: underline;
-        font-weight: 400;
-      }
     }
   }
 

services/web/frontend/stylesheets/app/login-register.less

@@ -163,7 +163,7 @@
   .login-register-other-links {
     padding: @line-height-computed 0;
     a {
-      color: var(--emerald-green);
+      color: var(--green-50);
       text-decoration: underline;
       // text-decoration-;skip-ink is for letter with descender (like 'g' and 'y')
       // this will force underline to not skip the descender
@@ -175,7 +175,7 @@
 
       // for accessibility with keyboard navigation
       &:focus {
-        outline: 2px solid var(--emerald-green);
+        outline: 2px solid var(--green-50);
         outline-offset: 1px;
       }
     }
@@ -339,7 +339,7 @@
     font-size: 12px;
 
     a {
-      color: var(--emerald-green);
+      color: var(--green-50);
       text-decoration: underline;
       // text-decoration-;skip-ink is for letter with descender (like 'g' and 'y')
       // this will force underline to not skip the descender
@@ -351,7 +351,7 @@
 
       // for accessibility with keyboard navigation
       &:focus {
-        outline: 2px solid var(--emerald-green);
+        outline: 2px solid var(--green-50);
         outline-offset: 1px;
       }
     }
@@ -364,7 +364,7 @@
       font-size: 12px;
 
       a {
-        color: var(--emerald-green);
+        color: var(--green-50);
         text-decoration: underline;
         // text-decoration-;skip-ink is for letter with descender (like 'g' and 'y')
         // this will force underline to not skip the descender
@@ -376,7 +376,7 @@
 
         // for accessibility with keyboard navigation
         &:focus {
-          outline: 2px solid var(--emerald-green);
+          outline: 2px solid var(--green-50);
           outline-offset: 1px;
         }
       }
@@ -385,7 +385,7 @@
 
   .register-header-logo {
     &:focus {
-      outline: 2px solid var(--emerald-green);
+      outline: 2px solid var(--green-50);
     }
   }
 }

services/web/frontend/stylesheets/app/website-redesign.less

@@ -964,7 +964,7 @@
   }
 
   .inline-green-link {
-    color: var(--emerald-green);
+    color: var(--green-50);
     text-decoration: underline;
     // text-decoration-;skip-ink is for letter with descender (like 'g' and 'y')
     // this will force underline to not skip the descender
@@ -976,7 +976,7 @@
 
     // for accessibility with keyboard navigation
     &:focus {
-      outline: 2px solid var(--emerald-green);
+      outline: 2px solid var(--green-50);
       outline-offset: 1px;
     }
   }
@@ -992,7 +992,7 @@
 
   .btn-primary {
     &:not([disabled]) {
-      background: var(--emerald-green);
+      background: var(--green-50);
       color: var(--white);
 
       &:hover {

services/web/frontend/stylesheets/components/navbar.less

@@ -678,7 +678,7 @@
       }
 
       > li.primary > a {
-        .btn-borderless(@white, @emerald-green, @green-60);
+        .btn-borderless(@white, @green-50, @green-60);
       }
 
       > li.secondary > a {

services/web/frontend/stylesheets/components/tabs.less

@@ -78,11 +78,11 @@
       li.active > a {
         background-color: transparent !important;
         border: 0 !important;
-        border-bottom: 3px solid @emerald-green !important;
+        border-bottom: 3px solid var(--green-50) !important;
         color: @neutral-90 !important;
 
         &:hover {
-          border-bottom: 3px solid @emerald-green !important;
+          border-bottom: 3px solid var(--green-50) !important;
         }
       }
 

services/web/frontend/stylesheets/variables/colors.less

@@ -93,7 +93,6 @@
 @content-placeholder: @content-placeholder-on-light-bg;
 
 // == Website Redesign ==
-@emerald-green: #098842;
 @ceil: #9597c9;
 @caramel: #f9d38f;
 @dark-jungle-green: #0f271a;

services/web/frontend/stylesheets/variables/css-variables.less

@@ -81,7 +81,6 @@
   --premium-gradient: @premium-gradient;
 
   // website-redesign
-  --emerald-green: @emerald-green;
   --ceil: @ceil;
   --caramel: @caramel;
   --dark-jungle-green: @dark-jungle-green;