github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-21 20:47:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #19937 from overleaf/jel-new-period-toggle

Browse source 
[web] Add space between options in new plans period toggle

GitOrigin-RevId: fee13d4e933a5f2d16f14bbd1fd0b9b130a0084e
This commit is contained in:
Jessica Lawshe 2024-08-14 09:46:03 -05:00 committed by Copybot
parent 5496e13640
commit ac06b0530c
1 changed files with 15 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
services/web/frontend/stylesheets/app/plans/plans-new-design.less
View file

@ -8,14 +8,7 @@
@highlighted-heading-line-height + (2 * @highlighted-heading-padding-vertical)
);
@switcher-container-width: 270px;
@switcher-container-height: 44px;
@switcher-container-border-radius: @switcher-container-height / 2;
@switcher-container-padding: 6px;
@switcher-container-margin-bottom: @highlighted-heading-height + @spacing-10;
@switcher-padding-vertical: 2px;
@switcher-height: @switcher-container-height - 2 * @switcher-container-padding;
@switcher-border-radius: @switcher-height / 2;
@nondiscounted-price-element-height: var(--line-height-02);
@ -211,21 +204,19 @@
display: flex;
justify-content: center;
background-color: var(--neutral-10);
width: @switcher-container-width;
height: @switcher-container-height;
border-radius: @switcher-container-border-radius;
padding: @switcher-container-padding;
margin-top: @spacing-09;
border-radius: var(--border-radius-full-new);
padding: var(--spacing-03);
margin-top: var(--spacing-09);
margin-bottom: @switcher-container-margin-bottom;
gap: var(--spacing-04);
.plans-new-period-switcher {
font-size: var(--font-size-05);
font-weight: 600;
line-height: var(--line-height-04);
text-align: center;
padding: 2px 8px;
height: @switcher-height;
border-radius: @switcher-border-radius;
padding: var(--spacing-01) var(--spacing-04);
border-radius: var(--border-radius-full-new);
display: flex;
align-items: center;
border: unset;
@ -246,6 +237,15 @@
}
}
&:focus,
&:focus-visible {
outline: 0;
}
&:focus-visible {
.box-shadow-button-input();
}
.plans-new-discount-badge {
margin-left: 6px;
}