improvement: Make dialogs look more like dialogs (#2686)

Co-authored-by: Jed Fox <git@jedfox.com>
Co-authored-by: dwelle <luzar.david@gmail.com>
This commit is contained in:
Lipis
2021-01-03 11:50:41 +02:00
committed by GitHub
parent eb1f717d35
commit 69878167c2
6 changed files with 24 additions and 28 deletions

View File

@@ -7,6 +7,9 @@
margin-top: 0;
grid-template-columns: 1fr calc(var(--space-factor) * 7);
grid-gap: var(--metric);
padding: calc(var(--space-factor) * 2);
text-align: center;
font-variant: small-caps;
}
.Dialog__titleContent {
@@ -18,6 +21,10 @@
margin: 0;
}
.Dialog__content {
padding: 0 16px 16px;
}
@media #{$is-mobile-query} {
.Dialog {
--metric: calc(var(--space-factor) * 4);
@@ -30,13 +37,8 @@
var(--space-factor) * 7
);
position: sticky;
top: calc(-1 * var(--metric));
margin: calc(-1 * var(--inset-right));
margin-top: calc(-1 * var(--metric));
margin-bottom: var(--metric);
top: 0;
padding: calc(var(--space-factor) * 2);
padding-left: var(--inset-left);
padding-right: var(--inset-right);
background: var(--bg-color-island);
font-size: 1.25em;