[chore] Webkit frontend fixes (#1492)

* fix webkit profile preview layout

* general page layout
This commit is contained in:
f0x52 2023-02-14 11:58:57 +01:00 committed by GitHub
parent 6c6f042290
commit 700ed7769f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 19 additions and 25 deletions

View file

@ -47,7 +47,6 @@ html, body {
body {
line-height: 1.5em;
min-height: 100vh;
position: relative;
}
@ -56,11 +55,8 @@ body {
}
.page {
position: absolute;
display: grid;
min-height: 100%;
min-width: 100%;
width: 100%;
min-height: 100vh;
grid-template-columns: auto minmax(auto, 50rem) auto;
grid-template-columns: auto min(92%, 50rem) auto;

View file

@ -30,7 +30,6 @@ main {
.profile {
background: $bg-accent;
display: grid;
grid-template-rows: auto auto auto;
grid-template-columns: 100%;
gap: 0.5rem;
margin-bottom: 0.2rem;

View file

@ -35,9 +35,9 @@ section {
#root {
display: grid;
grid-template-columns: 1fr 90ch 1fr;
width: 100vw;
max-width: 100vw;
/* keep in sync with base.css .page {} */
grid-template-columns: auto minmax(auto, 50rem) auto;
grid-template-columns: auto min(92%, 50rem) auto;
box-sizing: border-box;
section.with-sidebar {
@ -319,22 +319,25 @@ section.with-sidebar > div, section.with-sidebar > form {
display: grid;
grid-template-columns: 70% 30%;
grid-template-rows: 100%;
gap: 1rem;
.profile {
.basic {
margin-bottom: 0.5rem;
/* margin-top: 0; */
}
}
.files {
width: 100%;
margin: 1rem;
margin-right: 0;
display: flex;
flex-direction: column;
justify-content: center;
gap: 1rem;
h3 {
margin-top: 0;
margin-bottom: 0.5rem;
}
div:first-child {
margin-bottom: 1rem;
margin: 0;
margin-bottom: 0.3rem;
}
span {
@ -456,7 +459,8 @@ span.form-info {
}
}
@media screen and (max-width: 100ch) {
@media screen and (max-width: 60rem) {
/* vertical layout */
#root {
padding: 1rem;
grid-template-columns: 100%;
@ -484,13 +488,8 @@ span.form-info {
}
.user-profile .overview {
grid-template-columns: 100%;
grid-template-rows: auto auto;
.files {
margin: 0;
margin-top: 1rem;
}
grid-template-columns: auto;
grid-template-rows: auto 1fr;
}
main section {