ywana-core8 0.1.63 → 0.1.65

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ywana-core8",
-  "version": "0.1.63",
+  "version": "0.1.65",
   "description": "ywana-core8",
   "homepage": "https://ywana.github.io/workspace",
   "author": "Ernesto Roldan Garcia",

package/src/site/dialog.css

@@ -10,6 +10,17 @@
   justify-content: center;
   background: rgba(77, 77, 77, 0.7);
   z-index: 100;
+
+  animation: overlay-fade-in 0.3s ease;
+}
+
+@keyframes overlay-fade-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 0.5;
+  }
 }
 
 .overlay.prompt {
@@ -36,6 +47,19 @@
   box-shadow: var(--shadow1);
   overflow: auto;
   border: solid 1px var(--divider-color);
+
+  animation: dialogFadeIn 0.3s ease;
+}
+
+@keyframes dialogFadeIn {
+  from {
+      opacity: 0;
+      transform: scale(0.95);
+  }
+  to {
+      opacity: 1;
+      transform: scale(1);
+  }
 }
 
 .dialog-panel > header {

package/src/site/site.css

@@ -120,19 +120,22 @@
 
 .site-page-container {
     position: relative;
-    transition: all 0.3s ease;
+    transition: all 0.3s ease-in-out;   
     opacity: 1;
-    transform: translateX(0);
+}
+
+.site-page-container.fullscreen {
+    position: static;
+    width: 100vw;
+    height: 100vh;
 }
 
 .site-page-container.page-out {
     opacity: 0;
-    transform: translateX(-30px);
 }
 
 .site-page-container.page-in {
     opacity: 1;
-    transform: translateX(0);
 }
 
 .site6>main {

package/src/site/site.js

@@ -283,9 +283,10 @@ const SitePage = ({ children, init }) => {
 
     const allChildren = React.Children.toArray(children)
     const current = allChildren.find(child => child.props?.id === displayedPage)
+    const fullscreen = current?.props?.fullscreen
 
     return (
-        <main className={`site-page-container ${isExiting ? 'page-out' : 'page-in'}`}>
+        <main className={`site-page-container ${isExiting ? 'page-out' : 'page-in'} ${fullscreen ? 'fullscreen' : ''}`}>
             {current}
         </main>
     )