Deploying to gh-pages from @ 5efa783 🚀

neozhu · May 29, 2024 · d708ceb · d708ceb
1 parent 8543173
commit d708ceb
Show file tree

Hide file tree

Showing 23 changed files with 115 additions and 22 deletions.
diff --git a/_framework/BlazorPocket.Shared.pdb.gz b/_framework/BlazorPocket.Shared.pdb.gz
diff --git a/_framework/BlazorPocket.Shared.wasm b/_framework/BlazorPocket.Shared.wasm
diff --git a/_framework/BlazorPocket.Shared.wasm.br b/_framework/BlazorPocket.Shared.wasm.br
diff --git a/_framework/BlazorPocket.Shared.wasm.gz b/_framework/BlazorPocket.Shared.wasm.gz
diff --git a/_framework/BlazorPocket.WebAssembly.pdb.gz b/_framework/BlazorPocket.WebAssembly.pdb.gz
diff --git a/_framework/BlazorPocket.WebAssembly.wasm b/_framework/BlazorPocket.WebAssembly.wasm
diff --git a/_framework/BlazorPocket.WebAssembly.wasm.br b/_framework/BlazorPocket.WebAssembly.wasm.br
diff --git a/_framework/BlazorPocket.WebAssembly.wasm.gz b/_framework/BlazorPocket.WebAssembly.wasm.gz
diff --git a/_framework/PocketBaseClient.BlazorPocket.pdb.gz b/_framework/PocketBaseClient.BlazorPocket.pdb.gz
diff --git a/_framework/PocketBaseClient.BlazorPocket.wasm b/_framework/PocketBaseClient.BlazorPocket.wasm
diff --git a/_framework/PocketBaseClient.BlazorPocket.wasm.br b/_framework/PocketBaseClient.BlazorPocket.wasm.br
diff --git a/_framework/PocketBaseClient.BlazorPocket.wasm.gz b/_framework/PocketBaseClient.BlazorPocket.wasm.gz
diff --git a/_framework/PocketBaseClient.wasm b/_framework/PocketBaseClient.wasm
diff --git a/_framework/PocketBaseClient.wasm.br b/_framework/PocketBaseClient.wasm.br
diff --git a/_framework/PocketBaseClient.wasm.gz b/_framework/PocketBaseClient.wasm.gz
diff --git a/_framework/blazor.boot.json b/_framework/blazor.boot.json
@@ -1,7 +1,7 @@
 {
   "mainAssemblyName": "BlazorPocket.WebAssembly",
   "resources": {
-    "hash": "sha256-f7AmTydFEnqdTJOV0Tw9B2sKd824Maxcx6pO2tHaAbg=",
+    "hash": "sha256-UlObug02lHSEh6H0XNwXJt1KkiqIGwcAxjdXEGmJB7M=",
     "jsModuleNative": {
       "dotnet.native.8.0.6.p2zhvh10d9.js": "sha256-yAar1XpT0Z/8++kmgzed5w7Fz2fIErVsqPXPhuhnRMw="
     },
@@ -18,8 +18,8 @@
     },
     "assembly": {
       "Blazored.LocalStorage.wasm": "sha256-OaMAAd5n7ORfyur5e3QIyEVKJ76MKIvwbg7/icnnYcU=",
-      "BlazorPocket.Shared.wasm": "sha256-mrDJFEHTwUJCJNCUoZLkvCABajjiHylVlaRAjDfe0ls=",
-      "BlazorPocket.WebAssembly.wasm": "sha256-a7qwZhDE5ttw9UOWISV5vWMhP26fTMOd+bgCCXTOnR0=",
+      "BlazorPocket.Shared.wasm": "sha256-j+0yy/5bw0c23qYJUuiHS0XNfBs/lnCg+Jc5pKQzH8M=",
+      "BlazorPocket.WebAssembly.wasm": "sha256-mooZvD6TzdIQsEFePDZp8JvgnD1q47eZ4T3KohJDnow=",
       "Microsoft.AspNetCore.Authorization.wasm": "sha256-YNrFibgoOVRaN0slDRYnx66ZDadSKoqD1lacUUAg3vs=",
       "Microsoft.AspNetCore.Components.Authorization.wasm": "sha256-Rm/jgDAWvQejFnNSlHMv3dg+unVxM1X65LZatFCyJjc=",
       "Microsoft.AspNetCore.Components.Forms.wasm": "sha256-12en422vNI9840bTNcyhSq4XoyzcRAvWJGR7dE+hJb0=",
@@ -44,9 +44,9 @@
       "MimeMapping.wasm": "sha256-Xp2/rIWfToiZFOmoSCELufZ7bsFCRn7lZQhhCgxm5BE=",
       "MudBlazor.wasm": "sha256-zJh0BnUudZk2ZDtJFZbbB2UlkjjIZQlEveYXdL6pGXY=",
       "netstandard.wasm": "sha256-Y2Q3cMEbEwaHgZssUV7NwLTLKMo8EUtxWco60lXLbXM=",
-      "pocketbase-csharp-sdk.wasm": "sha256-UUABmbLuYlg16Bz0oAI1HXu6TrlYRH5NQjOJWaWpdU4=",
-      "PocketBaseClient.BlazorPocket.wasm": "sha256-Vw20BCDGuxgnuWJTMzOyd85G9VHLjTGioDyw6eoCuFA=",
-      "PocketBaseClient.wasm": "sha256-G3tjQvWfUvnwbhW/cbC054vYpz7D+QSjcqW8KzKCBdk=",
+      "pocketbase-csharp-sdk.wasm": "sha256-wGA+2mb/BnOp4NU9gDs0kPNii5ClIIhPMSEvku4u0CA=",
+      "PocketBaseClient.BlazorPocket.wasm": "sha256-qtg/5NRK+E0dv7vgdBoAcZw6s7SInE6lS5ZaJTX/arI=",
+      "PocketBaseClient.wasm": "sha256-nu5OktvO9ztZ4qsQeAN2FgYJxEI8jAlH2x37I66/Mik=",
       "System.Collections.Concurrent.wasm": "sha256-tchzZU/V21NBWCuDPqGKn8UqFSMM389SfvstAGM9AJY=",
       "System.Collections.Immutable.wasm": "sha256-oSd8NAed1HDZbk5cjyZbypllxPOeG1x7mjtMzwKSJmU=",
       "System.Collections.NonGeneric.wasm": "sha256-hYwQfCavxnKjAdbzca708h7wiRxp51b2p0ZX+Rdyf3E=",

diff --git a/_framework/blazor.boot.json.br b/_framework/blazor.boot.json.br
diff --git a/_framework/blazor.boot.json.gz b/_framework/blazor.boot.json.gz
diff --git a/_framework/pocketbase-csharp-sdk.pdb.gz b/_framework/pocketbase-csharp-sdk.pdb.gz
diff --git a/_framework/pocketbase-csharp-sdk.wasm b/_framework/pocketbase-csharp-sdk.wasm
diff --git a/_framework/pocketbase-csharp-sdk.wasm.br b/_framework/pocketbase-csharp-sdk.wasm.br
diff --git a/_framework/pocketbase-csharp-sdk.wasm.gz b/_framework/pocketbase-csharp-sdk.wasm.gz
diff --git a/index.html b/index.html
@@ -6,7 +6,6 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>BlazorPocket.WebAssembly</title>
     <base href="https://neozhu.github.io/BlazorPocketApp/" />
-    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
     <link rel="stylesheet" href="css/app.css" />
     <!-- If you add any scoped CSS files, uncomment the following to load them
     <link href="BlazorPocket.WebAssembly.styles.css" rel="stylesheet" />  -->
@@ -16,11 +15,12 @@
     <link rel="apple-touch-icon" sizes="192x192" href="icon-192.png" />
     <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
     <link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" />
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.1/anime.min.js"></script>
+
 </head>
 
 <body>
     <div id="app">
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.1/anime.min.js"></script>
         <div class="site-logo">
             <figure id="logo">
                 <svg width="100%" height="100%" viewBox="0 0 148 128">
@@ -36,7 +36,7 @@
             </figure>
             <div class="site-title">
                 <div id="logo-text" class="site-title-text">
-                    Blazor<span>Pocket</span>
+                    <span class="blazor">B</span><span class="blazor">l</span><span class="blazor">a</span><span class="blazor">z</span><span class="blazor">o</span><span class="blazor">r</span><span class="highlight">P</span><span class="highlight">o</span><span class="highlight">c</span><span class="highlight">k</span><span class="highlight">e</span><span class="highlight">t</span>
                     <p> Loading ...</p>
                     <div class="progress">
                         <div id="progressbar" class="progress-bar progress-bar-striped active" role="progressbar" style="width: var(--blazor-load-percentage, 0%)"></div>
@@ -48,6 +48,47 @@
             * {
                 box-sizing: border-box;
             }
+            /* Style for the progress container */
+            .progress {
+                width: 100%;
+                height: 1rem;
+                background-color: #f3f3f3;
+                border-radius: 0.25rem;
+                overflow: hidden;
+                margin-top: 1px;
+                margin-bottom: 0px;
+                position: relative;
+            }
+
+            /* Style for the progress bar */
+            .progress-bar {
+                height: 100%;
+                background-color: #1E3A8A;
+                transition: width 0.6s ease;
+                border-radius: 0.25rem 0 0 0.25rem;
+            }
+
+            /* Style for the striped effect */
+            .progress-bar-striped {
+                background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+                background-size: 1rem 1rem;
+            }
+
+                /* Active animation for the progress bar */
+                .progress-bar-striped.active {
+                    animation: progress-bar-stripes 1s linear infinite;
+                }
+
+            /* Keyframes for the striped animation */
+            @keyframes progress-bar-stripes {
+                from {
+                    background-position: 1rem 0;
+                }
+
+                to {
+                    background-position: 0 0;
+                }
+            }
 
             body {
                 display: flex;
@@ -95,17 +136,50 @@
             }
 
                 .site-title-text span {
-                    margin-left: 0.015625rem;
-                    color: #1E3A8A;
+                    display: inline-block;
+                    color: #3f3c3c;
+                    opacity: 0;
                 }
 
+                    .site-title-text span.highlight {
+                        color: #1E3A8A;
+                    }
+
                 .site-title-text p {
                     font-size: 0.8125rem;
                     font-weight: 500;
                     padding-bottom: 0.15rem;
                     margin-bottom: 1px;
                 }
 
+                .site-title-text span.light::before {
+                    content: '';
+                    position: absolute;
+                    top: 0;
+                    left: 0;
+                    right: 0;
+                    bottom: 0;
+                    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.6), transparent);
+                    background-size: 200%;
+                    z-index: 1;
+                    opacity: 0;
+                    transition: opacity 0.3s ease-in-out;
+                }
+
+            @keyframes light-sweep {
+                0% {
+                    background-position: -200%;
+                }
+
+                100% {
+                    background-position: 200%;
+                }
+            }
+
+            .site-title-text span.light::before {
+                animation: light-sweep 2s infinite;
+                opacity: 1;
+            }
         </style>
         <script>
             const logoAnimation = anime.timeline({
@@ -118,33 +192,52 @@
                 translateY: [-100, 0],
                 opacity: [0, 1],
                 elasticity: 600,
-                duration: 800
+                duration: 900
             }).add({
                 targets: '#logo-hexagon',
-                rotate: [-90, 0],
-                duration: 600,
+                rotate: [-180, 0],
+                duration: 1000,
                 elasticity: 600,
-                offset: '-=400'
+                offset: '-=200'
             }).add({
                 targets: '#logo-circle',
                 scale: [0, 1],
                 duration: 600,
                 elasticity: 600,
-                offset: '-=500'
+                offset: '-=100'
             }).add({
                 targets: '#logo-mask',
                 scale: [0, 1],
                 duration: 500,
                 elasticity: 600,
-                offset: '-=550'
+                offset: '-=350'
             }).add({
-                targets: '#logo-text',
-                translateX: ['-100%', 0],
+                targets: '#logo-text span',
                 opacity: [0, 1],
-                duration: 500,
+                translateX: ['-0.5em', 0],
                 easing: 'easeOutExpo',
-                offset: '-=400'
-            });
+                duration: 300,
+                offset: '-=350',
+                delay: anime.stagger(100, { start: 500 }) // delay each character
+            }).add({
+                    targets: '#logo-text p',
+                    opacity: [0, 1],
+                    translateX: ['-0.5em', 0],
+                    easing: 'easeOutExpo',
+                    duration: 100,
+            })
+    .add({
+        targets: '#logo-text .progress',
+        opacity: [0, 1],
+        translateX: ['-0.5em', 0],
+        easing: 'easeOutExpo',
+        duration: 100,
+    })
+                .finished.then(() => {
+                    document.querySelectorAll('.site-title-text span.blazor').forEach(span => {
+                        span.classList.add('light');
+                    });
+                });;
 
         </script>
     </div>