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

Merge pull request #21766 from overleaf/mf-checkout-main-layout-flexbox

Browse source 
[web] Use flex for layout of the new payment page to match figma width on the left card

GitOrigin-RevId: ca2b104ee50b7df0f352c3baaa610514e0432ffd
This commit is contained in:
M Fahru 2024-11-12 07:29:40 -07:00 committed by Copybot
parent 52eb08ae96
commit c5e1c63959
1 changed files with 34 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
services/web/frontend/stylesheets/bootstrap-5/pages/subscription.scss
View file

@ -141,13 +141,22 @@
.payment-container { .payment-container {
padding-top: var(--spacing-13); padding-top: var(--spacing-13);
.payment-row {
display: flex; display: flex;
gap: var(--spacing-10); gap: var(--spacing-10);
justify-content: center; justify-content: center;
@include media-breakpoint-down(lg) {
flex-direction: column;
align-items: center;
}
.payment-review-panel { .payment-review-panel {
width: 339px;
@include media-breakpoint-down(lg) {
width: 100%;
}
h4 { h4 {
color: var(--neutral-70); color: var(--neutral-70);
font-weight: 600; font-weight: 600;
@ -179,13 +188,6 @@
.payment-right-section { .payment-right-section {
padding: var(--spacing-08); padding: var(--spacing-08);
} }
}
@include media-breakpoint-up(md) {
.payment-review-panel {
padding: 0;
}
}
} }
.group-heading { .group-heading {