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 #20759 from overleaf/jel-cms-col-gap

Browse source 
[web] Replace margin on `Style | Group` with gap on `Layout | Grid`

GitOrigin-RevId: 297a5c9f6953a22818de31062f8ad5258db4691b
This commit is contained in:
Jessica Lawshe 2024-10-02 09:34:55 -05:00 committed by Copybot
parent ecfc8a1f9a
commit fd5e1df2e1
1 changed files with 55 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

98
services/web/frontend/stylesheets/bootstrap-5/pages/cms.scss
View file

@ -2,6 +2,29 @@
CMS Generated Pages: CMS Generated Pages:
/about/*, /contact, /legal, /blog/*, /for/*, /events/* /about/*, /contact, /legal, /blog/*, /for/*, /events/*
*/ */
@mixin section-row-custom-gap($spacing) {
// only update the padding between columns
// not the padding before the first column
// or the padding after the last column
// rows can be nested, so only select direct col in row
> div[class*='col-'] {
&:not(:first-child, :last-child) {
padding-left: $spacing;
padding-right: $spacing;
}
&:first-child {
padding-right: $spacing;
}
&:last-child {
padding-left: $spacing;
}
}
}
.cms-page { .cms-page {
.sales-contact-form-left-column { .sales-contact-form-left-column {
.sales-contact-form-heading-title { .sales-contact-form-heading-title {
@ -481,6 +504,38 @@
align-self: center; align-self: center;
} }
} }
.section-row-gap-spacing-16 {
@include section-row-custom-gap(calc(var(--spacing-16) / 2));
}
.section-row-gap-spacing-15 {
@include section-row-custom-gap(calc(var(--spacing-15) / 2));
}
.section-row-gap-spacing-14 {
@include section-row-custom-gap(calc(var(--spacing-14) / 2));
}
.section-row-gap-spacing-13 {
@include section-row-custom-gap(calc(var(--spacing-13) / 2));
}
.section-row-gap-spacing-12 {
@include section-row-custom-gap(calc(var(--spacing-12) / 2));
}
.section-row-gap-spacing-11 {
@include section-row-custom-gap(calc(var(--spacing-11) / 2));
}
.section-row-gap-spacing-10 {
@include section-row-custom-gap(calc(var(--spacing-10) / 2));
}
.section-row-gap-spacing-09 {
@include section-row-custom-gap(calc(var(--spacing-09) / 2));
}
} }
// Mobile layout options depdendent on mobile breakpoint // Mobile layout options depdendent on mobile breakpoint
@ -509,49 +564,6 @@
} }
} }
// TODO: will be deprecated and gap option used instead
@include media-breakpoint-up(lg) {
.desktop-left-margin-sm {
margin-left: var(--spacing-05);
}
.desktop-left-margin-md {
margin-left: var(--spacing-07);
}
.desktop-left-margin-lg {
margin-left: var(--spacing-09);
}
.desktop-left-margin-xl {
margin-left: var(--spacing-10);
}
.desktop-left-margin-xxl {
margin-left: var(--spacing-11);
}
.desktop-right-margin-sm {
margin-right: var(--spacing-05);
}
.desktop-right-margin-md {
margin-right: var(--spacing-07);
}
.desktop-right-margin-lg {
margin-right: var(--spacing-09);
}
.desktop-right-margin-xl {
margin-right: var(--spacing-10);
}
.desktop-right-margin-xxl {
margin-right: var(--spacing-11);
}
}
.top-margin-sm { .top-margin-sm {
margin-top: var(--spacing-05); margin-top: var(--spacing-05);
} }