Adjust site design

This commit is contained in:
hensm
2019-01-13 09:14:33 +00:00
parent da88804131
commit 8590a92bc8

View File

@@ -49,11 +49,10 @@ body {
margin: auto; margin: auto;
display: grid; display: grid;
font-size: 13px; font-size: 13px;
grid-gap: 3rem;
grid-column-gap: 6rem;
grid-template-columns: min-content min-content; grid-template-columns: min-content min-content;
grid-template-rows: min-content min-content; grid-template-rows: min-content min-content min-content;
grid-template-areas: grid-template-areas:
"header preview"
"main preview" "main preview"
"footer preview"; "footer preview";
overflow-x: hidden; overflow-x: hidden;
@@ -61,17 +60,20 @@ body {
} }
.main { .main {
min-width: inherit; display: contents;
align-items: flex-end;
flex-direction: column;
display: flex;
justify-content: center;
grid-area: main;
} }
.main-header, .main-header {
align-items: flex-end;
justify-content: flex-end;
flex-direction: column;
display: flex;
grid-area: header;
}
.main-content { .main-content {
display: contents; display: flex;
flex-direction: column;
grid-area: main;
} }
.main-content > * { .main-content > * {
@@ -92,13 +94,15 @@ body {
} }
.description { .description {
width: 45ch;
font-size: 1.75rem; font-size: 1.75rem;
padding-inline-end: 40px;
text-align: right; text-align: right;
width: 45ch;
z-index: 1;
} }
.discription__disclaimer { .discription__disclaimer {
font-size: 0.8em;
color: var(--text-color-secondary); color: var(--text-color-secondary);
font-size: 0.8em;
} }
.description p { .description p {
@@ -142,19 +146,21 @@ body {
} }
.preview--bg { .preview--bg {
height: auto; mask-image: linear-gradient(to right, black, transparent);
max-height: 712px; max-height: 712px;
max-width: 912px; max-width: 912px;
opacity: 0.65; opacity: 0.65;
width: auto; width: 500px;
object-fit: none;
object-position: left;
} }
.preview--fg { .preview--fg {
margin-inline-start: -40px; margin-inline-start: -60px;
max-height: 281px; max-height: 281px;
max-width: 462px; max-width: 462px;
position: relative; position: relative;
top: 115px; grid-row-start: 2;
} }
.footer { .footer {