feat(core): responsive page padding

This commit is contained in:
alistair3149 2022-11-16 18:45:45 -05:00
parent d8b2c73e6e
commit 7b33d7e2f1
No known key found for this signature in database
4 changed files with 6 additions and 8 deletions

View file

@ -115,8 +115,6 @@
@media ( min-width: @width-breakpoint-desktop ) { @media ( min-width: @width-breakpoint-desktop ) {
.citizen-footer { .citizen-footer {
padding-right: ~'calc( var(--padding-page ) * 2 )';
padding-left: ~'calc( var(--padding-page ) * 2 )';
margin-bottom: 0; margin-bottom: 0;
} }

View file

@ -158,10 +158,15 @@ html {
--font-size-h3: 1.25rem; --font-size-h3: 1.25rem;
--font-size-h4: 1.125rem; --font-size-h4: 1.125rem;
} }
html {
--padding-page: @padding-page * 1.5;
}
} }
@media ( min-width: @width-breakpoint-desktop ) { @media ( min-width: @width-breakpoint-desktop ) {
html { html {
--padding-page: @padding-page * 2;
--header-card-maxheight: ~'calc( 100vh - var( --space-sm ) * 2 )'; --header-card-maxheight: ~'calc( 100vh - var( --space-sm ) * 2 )';
} }
} }

View file

@ -85,11 +85,6 @@ a.image {
margin-left: var( --header-size ); margin-left: var( --header-size );
} }
.citizen-body-container {
padding-right: ~'calc( var( --padding-page ) * 2 )';
padding-left: ~'calc( var( --padding-page ) * 2 )';
}
.citizen-toc-enabled { .citizen-toc-enabled {
.citizen-body-container { .citizen-body-container {
display: grid; display: grid;

View file

@ -238,7 +238,7 @@
@width-toc: 240px; @width-toc: 240px;
/* Paddings */ /* Paddings */
@padding-page: 20px; @padding-page: 16px;
/* Border */ /* Border */
/* Border colors */ /* Border colors */