From ad634c7e88a4e867a809f726000e2e35674c3d9a Mon Sep 17 00:00:00 2001
From: Jimmy Domagala-Tang <Jimmy.Domagala-Tang@overleaf.com>
Date: Wed, 13 Nov 2024 06:37:10 -0800
Subject: [PATCH] Merge pull request #21692 from
 overleaf/jdt-premium-secondary-button

Add premium-secondary button style

GitOrigin-RevId: 79ac9004a0b081eb1e7ac2af88ca1f976b997fe0
---
 .../js/features/ui/components/types/button-props.ts   |  1 +
 services/web/frontend/stories/ui/button.stories.tsx   |  1 +
 .../stylesheets/bootstrap-5/components/button.scss    | 11 +++++++++++
 .../web/frontend/stylesheets/components/buttons.less  |  5 +++++
 4 files changed, 18 insertions(+)

diff --git a/services/web/frontend/js/features/ui/components/types/button-props.ts b/services/web/frontend/js/features/ui/components/types/button-props.ts
index 79254434ca..e98538e168 100644
--- a/services/web/frontend/js/features/ui/components/types/button-props.ts
+++ b/services/web/frontend/js/features/ui/components/types/button-props.ts
@@ -32,5 +32,6 @@ export type ButtonProps = {
     | 'danger'
     | 'danger-ghost'
     | 'premium'
+    | 'premium-secondary'
     | 'link'
 }
diff --git a/services/web/frontend/stories/ui/button.stories.tsx b/services/web/frontend/stories/ui/button.stories.tsx
index 60e07c950b..27f113dcdb 100644
--- a/services/web/frontend/stories/ui/button.stories.tsx
+++ b/services/web/frontend/stories/ui/button.stories.tsx
@@ -41,6 +41,7 @@ const meta: Meta<typeof Button> = {
         'danger',
         'danger-ghost',
         'premium',
+        'premium-secondary',
       ],
     },
   },
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/button.scss b/services/web/frontend/stylesheets/bootstrap-5/components/button.scss
index 286a46b8f8..536799f09c 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/button.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/button.scss
@@ -91,6 +91,17 @@
       background: var(--blue-70);
     }
   }
+
+  &.btn-premium-secondary {
+    @include ol-button-variant(
+      $color: var(--blue-60),
+      $background: var(--bg-light-primary),
+      $border: var(--blue-60),
+      $hover-background: var(--bg-info-03),
+      $hover-border: var(--blue-60),
+      $borderless: false
+    );
+  }
 }
 
 // Link buttons
diff --git a/services/web/frontend/stylesheets/components/buttons.less b/services/web/frontend/stylesheets/components/buttons.less
index 448ae4afa9..4ce8459bc2 100755
--- a/services/web/frontend/stylesheets/components/buttons.less
+++ b/services/web/frontend/stylesheets/components/buttons.less
@@ -132,6 +132,11 @@
   }
 }
 
+.btn-premium-secondary {
+  .btn-bordered();
+  .button-variant(@blue-60, @white, @blue-60);
+}
+
 .reset-btns {
   // reset all buttons back to their original colors
   .btn-danger {