From b005d5974ec031c50dd18a1e294d862f3209a166 Mon Sep 17 00:00:00 2001
From: Jessica Lawshe <5312836+lawshe@users.noreply.github.com>
Date: Tue, 30 Jul 2024 09:16:25 -0500
Subject: [PATCH] Merge pull request #19618 from overleaf/jel-light-touch-btns

[web] Light touch plans redesign CTAs

GitOrigin-RevId: 7b9be331420044fda08eac563567f1cce4c0c1c2
---
 .../plans/light-redesign/_table_ctas.pug      |  6 ++---
 .../app/plans/plans-light-touch-redesign.less | 23 ++++++++++---------
 services/web/locales/en.json                  |  1 -
 3 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/services/web/app/views/subscriptions/plans/light-redesign/_table_ctas.pug b/services/web/app/views/subscriptions/plans/light-redesign/_table_ctas.pug
index 948a298ffb..0deee3ea99 100644
--- a/services/web/app/views/subscriptions/plans/light-redesign/_table_ctas.pug
+++ b/services/web/app/views/subscriptions/plans/light-redesign/_table_ctas.pug
@@ -42,8 +42,7 @@ mixin btn_buy_group_collaborator(highlighted, eventTrackingKey)
 		data-ol-location='table-header'
 		class=(highlighted ? 'btn-primary' : 'btn-secondary')
 	)
-		span.visible-mobile #{translate("customize")}
-		span.visible-tablet #{translate("customize_plan")}
+		span.visible-mobile-and-tablet #{translate("customize")}
 		span.visible-desktop #{translate("customize_your_plan")}
 
 mixin btn_buy_group_professional(highlighted, eventTrackingKey) 
@@ -55,8 +54,7 @@ mixin btn_buy_group_professional(highlighted, eventTrackingKey)
 		data-ol-location='table-header'
 		class=(highlighted ? 'btn-primary' : 'btn-secondary')
 	)
-		span.visible-mobile #{translate("customize")}
-		span.visible-tablet #{translate("customize_plan")}
+		span.visible-mobile-and-tablet #{translate("customize")}
 		span.visible-desktop #{translate("customize_your_plan")}
 
 mixin btn_buy_group_organization(highlighted, eventTrackingKey) 
diff --git a/services/web/frontend/stylesheets/app/plans/plans-light-touch-redesign.less b/services/web/frontend/stylesheets/app/plans/plans-light-touch-redesign.less
index 3e37555023..6abc2d3ecc 100644
--- a/services/web/frontend/stylesheets/app/plans/plans-light-touch-redesign.less
+++ b/services/web/frontend/stylesheets/app/plans/plans-light-touch-redesign.less
@@ -531,9 +531,12 @@
       // padding
       > div {
         padding: var(--spacing-05) var(--spacing-08);
-        @media (max-width: @screen-xs-max) {
+        @media (max-width: @screen-sm-max) {
           padding: var(--spacing-05);
         }
+        @media (max-width: @screen-xs-max) {
+          padding: var(--spacing-03);
+        }
       }
       // padding adjustments
       &.plans-table-th > div {
@@ -944,26 +947,24 @@
     @media (max-width: @screen-xs-max) {
       display: flex;
       flex-direction: column;
+
+      .btn {
+        .btn-xs;
+      }
     }
   }
 
   .visible-desktop,
-  .visible-tablet,
-  .visible-mobile {
+  .visible-mobile-and-tablet {
     display: none;
   }
-  @media (min-width: (@screen-md-max+1)) {
+  @media (min-width: (@screen-lg-min)) {
     .visible-desktop {
       display: inline-block;
     }
   }
-  @media (min-width: (@screen-xs-max+1)) and (max-width: @screen-md-max) {
-    .visible-tablet {
-      display: inline-block;
-    }
-  }
-  @media (max-width: @screen-xs-max) {
-    .visible-mobile {
+  @media (max-width: @screen-md-max) {
+    .visible-mobile-and-tablet {
       display: inline-block;
     }
   }
diff --git a/services/web/locales/en.json b/services/web/locales/en.json
index ab2083c983..1c73bd3bf5 100644
--- a/services/web/locales/en.json
+++ b/services/web/locales/en.json
@@ -390,7 +390,6 @@
   "custom_resource_portal_info": "You can have your own custom portal page on Overleaf. This is a great place for your users to find out more about Overleaf, access templates, FAQs and Help resources, and sign up to Overleaf.",
   "customer_resource_portal": "Customer resource portal",
   "customize": "Customize",
-  "customize_plan": "Customize plan",
   "customize_your_group_subscription": "Customize your group subscription",
   "customize_your_plan": "Customize your plan",
   "customizing_figures": "Customizing figures",