1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2025-01-09 20:21:21 +00:00

Merge pull request from overleaf/jel-plans-toggle

[web] Use input for period toggle on new plans

GitOrigin-RevId: 0e1b76d92aa2143eb6721b9b2cd19505803fb153
This commit is contained in:
Jessica Lawshe 2024-11-20 10:38:09 -06:00 committed by Copybot
parent 44e0428496
commit 5df8cf7ce4
2 changed files with 26 additions and 21 deletions
services/web
frontend/stylesheets/app/plans
locales

View file

@ -214,8 +214,8 @@
}
.plans-new-period-switcher-container {
position: relative;
display: inline-flex;
justify-content: center;
background-color: var(--neutral-10);
border-radius: var(--border-radius-full-new);
padding: var(--spacing-03);
@ -227,46 +227,50 @@
margin-bottom: var(--spacing-09);
}
.plans-new-period-switcher {
label {
display: inline-flex;
align-items: center;
margin: 0;
font-size: var(--font-size-05);
font-weight: 600;
line-height: var(--line-height-04);
text-align: center;
padding: var(--spacing-01) var(--spacing-04);
border-radius: var(--border-radius-full-new);
display: flex;
align-items: center;
border: unset;
background-color: unset;
&:hover {
background-color: var(--neutral-20);
cursor: pointer;
}
}
&.active {
background-color: var(--green-50);
color: white;
box-shadow: 0px 2px 4px 0px rgba(30, 37, 48, 0.16);
.plans-new-discount-badge {
background-color: var(--green-10);
color: var(--green-60);
}
}
input[type='radio'] {
position: absolute;
left: -9999px;
&:focus,
&:focus-visible {
outline: 0;
}
}
&:focus-visible {
.box-shadow-button-input();
}
input[type='radio']:focus-visible + label,
input[type='radio']:checked:focus-visible + label {
.box-shadow-button-input();
}
input[type='radio']:checked + label {
background-color: var(--green-50);
color: white;
box-shadow: 0px 2px 4px 0px rgba(30, 37, 48, 0.16);
.plans-new-discount-badge {
margin-left: 6px;
background-color: var(--green-10);
color: var(--green-60);
}
}
.plans-new-discount-badge {
margin-left: var(--spacing-03);
}
}
.plans-new-discount-badge {

View file

@ -209,6 +209,7 @@
"beta_program_opt_out_action": "Opt-Out of Beta Program",
"better_bibliographies": "Better bibliographies",
"bibliographies": "Bibliographies",
"billing_period_sentence_case": "Billing period",
"binary_history_error": "Preview not available for this file type",
"blank_project": "Blank Project",
"blocked_filename": "This file name is blocked.",