mirror of
https://github.com/shoelace-style/webawesome.git
synced 2026-01-12 04:09:12 +00:00
Reapply "Fix missing content issue, closes #198"
This reverts commit 60c7c91e8a.
Also used a longer timeout
This commit is contained in:
@@ -43,15 +43,23 @@ body {
|
||||
-webkit-text-size-adjust: none;
|
||||
}
|
||||
|
||||
/* Show custom elements only after they're registered */
|
||||
:where(:not(:defined, [did-ssr])),
|
||||
:where(:not(:defined, [did-ssr])) * {
|
||||
opacity: 0;
|
||||
@keyframes wa-fade-in {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
:where(:defined) {
|
||||
opacity: 1;
|
||||
transition: 0.1s opacity;
|
||||
/* Show custom elements only after they're registered */
|
||||
:where(:not(:defined, [did-ssr])) {
|
||||
&,
|
||||
& * {
|
||||
/*
|
||||
* if an element gets defined earlier than 800ms, the animation stops applying so it just appears (no fade)
|
||||
* If it takes somewhere between 800 and 1000 ms, then you may get an interrupted fade
|
||||
* If an element takes longer than 1000ms to get defined, it fades in over 200ms
|
||||
*/
|
||||
animation: 200ms 800ms wa-fade-in both;
|
||||
}
|
||||
}
|
||||
|
||||
/* Content flow */
|
||||
|
||||
Reference in New Issue
Block a user