use the new toast in md-editor

This commit is contained in:
ed
2021-07-26 19:20:36 +02:00
parent 7671d791fa
commit f3dc6a217b
8 changed files with 97 additions and 104 deletions

View File

@@ -8,20 +8,52 @@ html, body {
font-family: sans-serif;
line-height: 1.5em;
}
#tt {
#tt, #toast {
position: fixed;
max-width: 34em;
background: #222;
border: 0 solid #777;
box-shadow: 0 .2em .5em #222;
border-radius: .4em;
z-index: 9001;
}
#tt {
overflow: hidden;
margin-top: 1em;
padding: 0 1.3em;
height: 0;
opacity: .1;
transition: opacity 0.14s, height 0.14s, padding 0.14s;
box-shadow: 0 .2em .5em #222;
border-radius: .4em;
z-index: 9001;
}
#toast {
top: 1.4em;
right: -1em;
padding: 1em 1.3em;
border-width: .4em 0;
transform: translateX(100%);
transition: all .3s cubic-bezier(.2, 1.2, .5, 1);
text-shadow: 1px 1px 0 #000;
color: #fff;
}
#toast.vis {
right: 1.3em;
transform: unset;
}
#toast.inf {
background: #07a;
border-color: #0be;
}
#toast.ok {
background: #4a0;
border-color: #8e4;
}
#toast.warn {
background: #970;
border-color: #fc0;
}
#toast.err {
background: #b00;
border-color: #f00;
}
#tt.b {
padding: 0 2em;
@@ -49,6 +81,24 @@ html, body {
#tt em {
color: #f6a;
}
html.light #tt {
background: #fff;
border-color: #888 #000 #777 #000;
}
html.light #tt,
html.light #toast {
box-shadow: 0 .3em 1em rgba(0,0,0,0.4);
}
html.light #tt code {
background: #060;
color: #fff;
}
html.light #tt em {
color: #d38;
}
#mtw {
display: none;
}