add live statistics

src/layouts/admin/AdminLayout.astro

@@ -1,8 +1,7 @@
 ---
-import '@assets/admin_layout.css';
+import '@styles/adminLayout.css';
 import BaseLayout from '../BaseLayout.astro';
 import { ClientRouter } from 'astro:transitions';
-import { Icon } from 'astro-icon/components';
 import Popup from '@components/popup/Popup.svelte';
 import ConfirmPopup from '@components/popup/ConfirmPopup.svelte';
 import { Session } from '@util/session.ts';
@@ -19,24 +18,24 @@ const preTabs = [
   {
     href: '',
     name: 'Startseite',
-    icon: 'heroicons:computer-desktop-20-solid'
+    iconClass: 'iconify-[heroicons--computer-desktop-20-solid]'
   }
 ];
 const adminTabs = [
   {
     href: 'admin/users',
     name: 'Registrierte Nutzer',
-    icon: 'heroicons:user',
+    iconClass: 'iconify-[heroicons--user]',
     subTabs: [
       {
         href: 'admin/users/direct_invitations',
         name: 'Direkte Einladungen',
-        icon: 'heroicons:envelope'
+        iconClass: 'iconify-[heroicons--envelope]'
       },
       {
         href: 'admin/users/blocked',
         name: 'Blockierte Nutzer',
-        icon: 'heroicons:user-minus'
+        iconClass: 'iconify-[heroicons--user-minus]'
       }
     ],
     enabled: session?.permissions.users
@@ -44,24 +43,24 @@ const adminTabs = [
   {
     href: 'admin/reports',
     name: 'Reports',
-    icon: 'heroicons:flag',
+    iconClass: 'iconify-[heroicons--flag]',
     enabled: session?.permissions.reports
   },
   {
     href: 'admin/feedback',
     name: 'Feedback',
-    icon: 'heroicons:book-open',
+    iconClass: 'iconify-[heroicons--book-open]',
     enabled: session?.permissions.feedback
   },
   {
     href: 'admin/admins',
     name: 'Website Admins',
-    icon: 'heroicons:code-bracket-16-solid',
+    iconClass: 'iconify-[heroicons--code-bracket-16-solid]',
     subTabs: [
       {
         href: 'admin/admins/strike_reasons',
         name: 'Strikegründe',
-        icon: 'heroicons:shield-exclamation'
+        iconClass: 'iconify-[heroicons--shield-exclamation]'
       }
     ],
     enabled: session?.permissions.admin
@@ -69,13 +68,13 @@ const adminTabs = [
   {
     href: 'admin/settings',
     name: 'Einstellungen',
-    icon: 'heroicons:adjustments-horizontal',
+    iconClass: 'iconify-[heroicons--adjustments-horizontal]',
     enabled: session?.permissions.settings
   },
   {
     href: 'admin/tools',
     name: 'Tools',
-    icon: 'heroicons:wrench-screwdriver',
+    iconClass: 'iconify-[heroicons--wrench-screwdriver]',
     enabled: session?.permissions.tools
   }
 ];
@@ -89,7 +88,7 @@ const adminTabs = [
         preTabs.map((tab) => (
           <li>
             <a href={tab.href}>
-              <Icon name={tab.icon} />
+              <span class="iconify" class:list={tab.iconClass} />
               <span>{tab.name}</span>
             </a>
           </li>
@@ -102,7 +101,7 @@ const adminTabs = [
             tab.enabled && (
               <li>
                 <a href={tab.href}>
-                  <Icon name={tab.icon} />
+                  <span class="iconify" class:list={tab.iconClass} />
                   <span>{tab.name}</span>
                 </a>
                 {tab.subTabs && (
@@ -110,7 +109,7 @@ const adminTabs = [
                     {tab.subTabs.map((subTab) => (
                       <li>
                         <a href={subTab.href}>
-                          <Icon name={subTab.icon} />
+                          <span class="iconify" class:list={subTab.iconClass} />
                           <span>{subTab.name}</span>
                         </a>
                       </li>
@@ -130,7 +129,7 @@ const adminTabs = [
       }
       <li class:list={[Astro.slots.has('actions') ? null : 'mt-auto']}>
         <button id="logout">
-          <Icon name="heroicons:arrow-left-end-on-rectangle" />
+          <span class="iconify iconify-[heroicons--arrow-left-end-on-rectangle]"></span>
           <span>Ausloggen</span>
         </button>
       </li>