Fix for scrolling background.

This commit is contained in:
Kremitzl 2019-04-29 14:35:18 +02:00
parent ec37177d2b
commit 308d63230e
2 changed files with 7 additions and 7 deletions

View File

@ -21,8 +21,7 @@ section {
--square: 100vh; } } --square: 100vh; } }
body { body {
font-size: calc(0.035 * var(--square)); font-size: calc(0.035 * var(--square)); }
background: var(--secondary); }
body .layout-content-and-preview, body .layout-content-and-preview,
body .layout-content-only { body .layout-content-only {
display: grid; display: grid;
@ -59,13 +58,15 @@ body {
grid-template-areas: ". . ." ". content ." ". . ."; grid-template-areas: ". . ." ". content ." ". . .";
background: linear-gradient(to right, var(--secondary) 0%, var(--secondary) calc((100% - var(--square)) / 2), white calc((100% - var(--square)) / 2), white calc(100% - (100% - var(--square)) / 2), var(--secondary) calc(100% - (100% - var(--square)) / 2), var(--secondary) 100%); } } background: linear-gradient(to right, var(--secondary) 0%, var(--secondary) calc((100% - var(--square)) / 2), white calc((100% - var(--square)) / 2), white calc(100% - (100% - var(--square)) / 2), var(--secondary) calc(100% - (100% - var(--square)) / 2), var(--secondary) 100%); } }
body .layout-content { body .layout-content {
background: white;
grid-area: content; grid-area: content;
position: relative; } position: relative; }
body .layout-preview { body .layout-preview {
grid-area: preview; grid-area: preview;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; } justify-content: center;
background: var(--secondary); }
body .layout-preview img { body .layout-preview img {
width: auto; width: auto;
height: auto; height: auto;

View File

@ -23,7 +23,6 @@ section {
body { body {
font-size: calc(0.035 * var(--square)); font-size: calc(0.035 * var(--square));
background: var(--secondary);
.layout-content-and-preview, .layout-content-and-preview,
.layout-content-only { .layout-content-only {
@ -34,7 +33,7 @@ body {
max-width: 100vw; max-width: 100vw;
overflow: auto; overflow: auto;
} }
.layout-content-and-preview { .layout-content-and-preview {
grid-template-rows: var(--square) auto; grid-template-rows: var(--square) auto;
grid-template-columns: auto; grid-template-columns: auto;
@ -88,7 +87,7 @@ body {
} }
.layout-content { .layout-content {
// background: white; background: white;
grid-area: content; grid-area: content;
position: relative; position: relative;
} }
@ -98,7 +97,7 @@ body {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
// background: var(--secondary); background: var(--secondary);
img { img {
width: auto; width: auto;
height: auto; height: auto;