Merge branch 'main' of github.com:JannexNet/SHX-Theme

snippets/shx-loading-screen.liquid

@@ -2,7 +2,13 @@
 
 {% if content_type == 'body' %}
   <div id="shx-loading-screen">
-    <div class="loader"></div>
+    <div class="loader-text">
+      Shinnex
+      <svg viewBox="0 0 500 100">
+          <text x="50%" y="50%" text-anchor="middle" dy=".35em">Shinnex</text>
+          <path d="M50 50 H450" />
+      </svg>
+  </div>
   </div>
 {% elsif content_type == 'head' %}
   <style>
@@ -27,20 +33,34 @@
       pointer-events: none;
     }
 
-    /* CSS für den Ladeindikator */
-    .loader { 
-      display: block !important;
-      border: 16px solid #f3f3f3;
-      border-top: 16px solid #3498db;
-      border-radius: 50%;
-      width: 120px;
-      height: 120px;
-      animation: spin 2s linear infinite;
+    //* CSS für den animierten Text */
+    @keyframes borderAnimation {
+      0% { stroke-dashoffset: 100%; }
+      100% { stroke-dashoffset: 0; }
     }
 
-    @keyframes spin {
-      0% { transform: rotate(0deg); }
-      100% { transform: rotate(360deg); }
+    .loader-text {
+      font-size: 50px;
+      font-weight: bold;
+      color: black;
+      position: relative;
+    }
+
+    .loader-text svg {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+    }
+
+    .loader-text path {
+      fill: none;
+      stroke: black;
+      stroke-width: 2;
+      stroke-dasharray: 100%;
+      stroke-dashoffset: 100%;
+      animation: borderAnimation 2s linear infinite;
     }
   </style>