Răsfoiți Sursa

Merge pull request #18870 from overleaf/mf-new-plans-page-table-individual

[web] Create new plans page table for individual plans

GitOrigin-RevId: 82bfcf5a5e7886517bab9b67dfb4a712350f8c33
M Fahru 2 ani în urmă
părinte
comite
9309df9a13

+ 0 - 4
services/web/frontend/fonts/material-symbols.css

@@ -30,7 +30,3 @@
   font-feature-settings: 'liga';
   -webkit-font-smoothing: antialiased;
 }
-
-.material-symbols-xl {
-  font-size: 56px;
-}

+ 72 - 0
services/web/frontend/stylesheets/app/plans/plans-new-design.less

@@ -400,6 +400,78 @@
     }
   }
 
+  .plans-new-table-heading-row {
+    // this means min-height, min-height does not work in table layout
+    // https://stackoverflow.com/questions/7790222
+    height: 64px;
+  }
+
+  .plans-new-table-heading-text {
+    padding: var(--spacing-05) var(--spacing-08) var(--spacing-05)
+      var(--spacing-05);
+    font-weight: 600;
+    font-size: var(--font-size-04);
+    line-height: var(--line-height-03);
+    vertical-align: bottom;
+  }
+
+  .plans-new-table-feature-row {
+    &:nth-child(even) {
+      background-color: var(--neutral-10);
+    }
+  }
+
+  .plans-new-table-section-without-header-row {
+    &:nth-child(odd):not(.plans-new-table-heading-row) {
+      background-color: var(--neutral-10);
+    }
+    &:nth-child(even):not(.plans-new-table-heading-row) {
+      background-color: white;
+    }
+  }
+
+  .plans-new-table-feature-th {
+    padding: var(--spacing-05) var(--spacing-08) var(--spacing-05)
+      var(--spacing-05);
+
+    .plans-new-table-feature-th-content {
+      line-height: var(--line-height-03);
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+
+      .plans-new-table-feature-tooltip-icon {
+        cursor: help;
+        margin-left: var(--spacing-05);
+      }
+
+      .tooltip.in {
+        opacity: 1;
+      }
+
+      .tooltip-inner {
+        padding: var(--spacing-04) var(--spacing-06);
+        max-width: 258px;
+        width: 258px;
+        font-family: Lato, sans-serif;
+        font-size: var(--font-size-02);
+        text-align: left;
+        background-color: var(--neutral-90);
+        border-radius: var(--border-radius-base);
+      }
+    }
+  }
+
+  .plans-new-table-feature-td {
+    padding: var(--spacing-05) var(--spacing-08);
+    text-align: center;
+    line-height: var(--line-height-03);
+
+    .green-round-background {
+      margin-right: 0;
+    }
+  }
+
   // ------------------------------------------------------------------
   // ------------------------------------------------------------------
   // These comments will be deleted before merging this PR

+ 21 - 2
services/web/frontend/stylesheets/components/icons.less

@@ -3,7 +3,26 @@
   color: @accent-color-secondary!important;
 }
 
-// Sizes
 .icon-lg {
-  font-size: @font-size-h1;
+  font-size: 32px !important;
+  width: 32px !important;
+  height: 32px !important;
+}
+
+.icon-md {
+  font-size: 24px !important;
+  width: 24px !important;
+  height: 24px !important;
+}
+
+.icon-sm {
+  font-size: 20px !important;
+  width: 20px !important;
+  height: 20px !important;
+}
+
+.icon-xs {
+  font-size: 16px !important;
+  width: 16px !important;
+  height: 16px !important;
 }

+ 1 - 0
services/web/frontend/stylesheets/variables/all.less

@@ -1,5 +1,6 @@
 @import 'colors.less';
 @import 'z-index.less';
+@import 'border-radius.less';
 
 //
 // Variables

+ 4 - 0
services/web/frontend/stylesheets/variables/border-radius.less

@@ -0,0 +1,4 @@
+@border-radius-base: 4px;
+@border-radius-medium: 8px;
+@border-radius-large: 16px;
+@border-radius-full: 9999px;

+ 6 - 0
services/web/frontend/stylesheets/variables/css-variables.less

@@ -143,4 +143,10 @@
   --line-height-10: @line-height-10;
   --line-height-11: @line-height-11;
   --line-height-12: @line-height-12;
+
+  // border-radius
+  --border-radius-base: @border-radius-base;
+  --border-radius-medium: @border-radius-medium;
+  --border-radius-large: @border-radius-large;
+  --border-radius-full: @border-radius-full;
 }

+ 14 - 0
services/web/locales/en.json

@@ -283,9 +283,11 @@
   "compile_mode": "Compile Mode",
   "compile_servers": "Compile servers",
   "compile_servers_info": "Compiles for users on premium plans always run on a dedicated pool of the fastest available servers.",
+  "compile_servers_info_new": "The servers used to compile your project. Compiles for users on paid plans always run on the fastest available servers.",
   "compile_terminated_by_user": "The compile was cancelled using the ‘Stop Compilation’ button. You can download the raw logs to see where the compile stopped.",
   "compile_timeout_short": "Compile timeout",
   "compile_timeout_short_info_basic": "This is how much time you get to compile your project on the Overleaf servers. You may need additional time for longer or more complex projects.",
+  "compile_timeout_short_info_new": "This is how much time you get to compile your project on Overleaf. You may need additional time for longer or more complex projects.",
   "compiler": "Compiler",
   "compiling": "Compiling",
   "complete": "Complete",
@@ -443,6 +445,7 @@
   "drag_here": "drag here",
   "drag_here_paste_an_image_or": "Drag here, paste an image, or ",
   "drop_files_here_to_upload": "Drop files here to upload",
+  "dropbox": "Dropbox",
   "dropbox_already_linked_error": "Your Dropbox account cannot be linked as it is already linked with another Overleaf account.",
   "dropbox_already_linked_error_with_email": "Your Dropbox account cannot be linked as it is already linked with another Overleaf account using email address __otherUsersEmail__.",
   "dropbox_checking_sync_status": "Checking Dropbox for updates",
@@ -482,6 +485,7 @@
   "edit_sso_configuration": "Edit SSO Configuration",
   "edit_tag": "Edit Tag",
   "editing": "Editing",
+  "editing_and_collaboration": "Editing and collaboration",
   "editing_captions": "Editing captions",
   "editor_and_pdf": "Editor & PDF",
   "editor_disconected_click_to_reconnect": "Editor disconnected, click anywhere to reconnect.",
@@ -702,6 +706,7 @@
   "git_integration_info": "With Git integration, you can clone your Overleaf projects with Git. For full instructions on how to do this, read <0>our help page</0>.",
   "git_integration_lowercase": "Git integration",
   "git_integration_lowercase_info": "You can clone your Overleaf project to a local repository, treating your Overleaf project as a remote repository that changes can be pushed to and pulled from.",
+  "github": "GitHub",
   "github_commit_message_placeholder": "Commit message for changes made in __appName__...",
   "github_credentials_expired": "Your GitHub authorization credentials have expired",
   "github_empty_repository_error": "It looks like your GitHub repository is empty or not yet available. Create a new file on GitHub.com then try again.",
@@ -1235,6 +1240,9 @@
   "notification_project_invite_accepted_message": "You’ve joined <b>__projectName__</b>",
   "notification_project_invite_message": "<b>__userName__</b> would like you to join <b>__projectName__</b>",
   "november": "November",
+  "number_collab": "Number of collaborators",
+  "number_collab_info": "The number of people you can invite to work on a project with you. The limit is per project, so you can invite different people to each project.",
+  "number_of_projects": "Number of projects",
   "number_of_users": "Number of users",
   "number_of_users_info": "The number of users that can upgrade their Overleaf account if you purchase this plan.",
   "number_of_users_with_colon": "Number of users:",
@@ -1247,6 +1255,7 @@
   "on_free_plan_upgrade_to_access_features": "You are on the __appName__ Free plan. Upgrade to access these <0>Premium Features</0>",
   "one_collaborator": "Only one collaborator",
   "one_free_collab": "One free collaborator",
+  "one_per_project": "1 per project",
   "one_step_away_from_professional_features": "You are one step away from accessing <0>Overleaf Professional features</0>!",
   "one_user": "1 user",
   "online_latex_editor": "Online LaTeX Editor",
@@ -1464,6 +1473,7 @@
   "ready_to_join_x": "You’re ready to join __inviterName__",
   "ready_to_join_x_in_group_y": "You’re ready to join __inviterName__ in __groupName__",
   "ready_to_set_up": "Ready to set up",
+  "ready_to_use_templates": "Ready-to-use templates",
   "real_time_track_changes": "Real-time <0>track-changes</0>",
   "realtime_track_changes": "Real-time track changes",
   "realtime_track_changes_info_v2": "Switch on track changes to see who made every change, accept or reject others’ changes, and write comments.",
@@ -1489,6 +1499,7 @@
   "reference_error_relink_hint": "If this error persists, try re-linking your account here:",
   "reference_managers": "Reference managers",
   "reference_search": "Advanced reference search",
+  "reference_search_info_new": "Find your references easily—search by author, title, year, or journal.",
   "reference_search_info_v2": "It’s easy to find your references - you can search by author, title, year or journal. You can still search by citation key too.",
   "reference_sync": "Reference manager sync",
   "refresh": "Refresh",
@@ -1835,6 +1846,7 @@
   "success_sso_set_up": "Success! Single sign-on is all set up for you.",
   "suggested": "Suggested",
   "suggestion": "Suggestion",
+  "support": "Support",
   "sure_you_want_to_cancel_plan_change": "Are you sure you want to revert your scheduled plan change? You will remain subscribed to the <0>__planName__</0> plan.",
   "sure_you_want_to_change_plan": "Are you sure you want to change plan to <0>__planName__</0>?",
   "sure_you_want_to_delete": "Are you sure you want to permanently delete the following files?",
@@ -1845,6 +1857,7 @@
   "symbol_palette": "Symbol palette",
   "symbol_palette_highlighted": "<0>Symbol</0> palette",
   "symbol_palette_info": "A quick and convenient way to insert math symbols into your document.",
+  "symbol_palette_info_new": "Insert math symbols into your document with the click of a button.",
   "sync": "Sync",
   "sync_dropbox_github": "Sync with Dropbox and GitHub",
   "sync_project_to_github_explanation": "Any changes you have made in __appName__ will be committed and merged with any updates in GitHub.",
@@ -1878,6 +1891,7 @@
   "templates_admin_source_project": "Admin: Source Project",
   "templates_page_summary": "Start your projects with quality LaTeX templates for journals, CVs, resumes, papers, presentations, assignments, letters, project reports, and more. Search or browse below.",
   "templates_page_title": "Templates - Journals, CVs, Presentations, Reports and More",
+  "ten_per_project": "10 per project",
   "terminated": "Compilation cancelled",
   "terms": "Terms",
   "test": "Test",