fix(html): add prestyling for unregistered host-app

waldronmatt · Apr 9, 2024 · 92b1ac0 · 92b1ac0
1 parent 0426fba
commit 92b1ac0
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 0 deletions.
diff --git a/apps/lit-override/src/html/dynamic.html b/apps/lit-override/src/html/dynamic.html
@@ -6,6 +6,14 @@
   </head>
 
   <body>
+    <style>
+      host-app:not(:defined) {
+        display: block;
+        height: 100vh;
+        opacity: 0;
+        transition: opacity 0.3s ease-in-out;
+      }
+    </style>
     <h1>Override markup and styles on dynamically generated components!</h1>
     <host-app></host-app>
     <br />

diff --git a/apps/lit-override/src/html/lazy-loaded.html b/apps/lit-override/src/html/lazy-loaded.html
@@ -5,6 +5,14 @@
   </head>
 
   <body>
+    <style>
+      host-app:not(:defined) {
+        display: block;
+        height: 100vh;
+        opacity: 0;
+        transition: opacity 0.3s ease-in-out;
+      }
+    </style>
     <template id="childTemplate">
       <slot name="heading"></slot>
       <slot name="sub-heading"></slot>