src/components/auth/Login.svelte

@@ -6,7 +6,7 @@
   import { OpenAPI, AuthService } from "@odit/lfk-client-js";
   import Footer from "../general/Footer.svelte";
   import isEmail from "validator/es/lib/isEmail";
-  import toast from "svelte-french-toast";
+  import Toastify from "toastify-js";
   // ------
   let username = config.default_username || "";
   let password = config.default_password || "";
@@ -20,7 +20,11 @@
         OpenAPI.TOKEN = value.access_token;
         const jwtinfo = JSON.parse(atob(OpenAPI.TOKEN.split(".")[1]));
         store.login(value, jwtinfo);
-        toast($_("welcome_wavinghand"));
+        Toastify({
+          text: $_("welcome_wavinghand"),
+          duration: 500,
+          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+        }).showToast();
       }
     }
   });
@@ -29,7 +33,10 @@
     // prevent login button spamming
     if (last_loginclick_processed && is_blocked_by_autologin === false) {
       last_loginclick_processed = false;
-      toast.loading($_("login_is_checked"));
+      Toastify({
+        text: $_("login_is_checked"),
+        duration: 500,
+      }).showToast();
       let postdata = {};
       if (isEmail(username)) {
         postdata = {
@@ -49,19 +56,31 @@
           const jwtinfo = JSON.parse(atob(OpenAPI.TOKEN.split(".")[1]));
           store.login(result.access_token, jwtinfo);
           location.replace("/");
-          toast.dismiss();
-          toast($_("welcome_wavinghand"));
+          Toastify({
+            text: $_("welcome_wavinghand"),
+            duration: 500,
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          }).showToast();
         })
         .catch((err) => {
-          toast.dismiss();
-          toast.error($_("error_on_login"));
+          Toastify({
+            text: $_("error_on_login"),
+            duration: 500,
+            backgroundColor:
+              "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+          }).showToast();
         })
         .finally(() => {
           last_loginclick_processed = true;
         });
       // last login was not processed yet
     } else {
-      toast($_("please-wait-a-moment-your-login-is-still-being-processed"));
+      Toastify({
+        text: $_('please-wait-a-moment-your-login-is-still-being-processed'),
+        duration: 1500,
+        backgroundColor:
+          "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+      }).showToast();
     }
   };
   function handleKeydown(e) {
@@ -72,37 +91,34 @@
 </script>
 
 <div
-  class="min-h-screen flex items-center justify-center bg-gray-100 text-gray-900"
->
+  class="min-h-screen flex items-center justify-center bg-gray-100 text-gray-900">
   <div class="max-w-md w-full py-12 px-6" role="main">
     <img style="height:10rem;" class="mx-auto" src="/lfk-logo.png" alt="" />
-    <p class="mt-6 text-lg text-center font-bold">{$_("application_name")}</p>
-    <p class="mt-6 text-sm text-center">{$_("log_in_to_your_account")}</p>
+    <p class="mt-6 text-lg text-center font-bold">{$_('application_name')}</p>
+    <p class="mt-6 text-sm text-center">{$_('log_in_to_your_account')}</p>
     <div>
       <div class="rounded-md shadow-sm">
         <div>
           <!-- svelte-ignore a11y-autofocus -->
           <input
             autofocus
-            aria-label={$_("email_address_or_username")}
+            aria-label={$_('email_address_or_username')}
             type="text"
             required=""
             class="border-gray-300 placeholder-gray-500 appearance-none rounded-none relative block w-full px-3 py-2 border rounded-t-md focus:outline-none focus:shadow-outline-blue focus:border-blue-300 focus:z-10 sm:text-sm"
             on:keydown={handleKeydown}
-            placeholder={$_("email_address_or_username")}
-            bind:value={username}
-          />
+            placeholder={$_('email_address_or_username')}
+            bind:value={username} />
         </div>
         <div class="-mt-px relative">
           <input
-            aria-label={$_("password")}
+            aria-label={$_('password')}
             type="password"
             required=""
             bind:value={password}
             class="border-gray-300 placeholder-gray-500 appearance-none rounded-none relative block w-full px-3 py-2 border rounded-b-md focus:outline-none focus:shadow-outline-blue focus:border-blue-300 focus:z-10 sm:text-sm"
             on:keydown={handleKeydown}
-            placeholder={$_("password")}
-          />
+            placeholder={$_('password')} />
         </div>
       </div>
 
@@ -110,31 +126,27 @@
         <button
           on:click={login}
           type="submit"
-          class="relative block w-full py-2 px-3 border border-transparent rounded-md text-white font-semibold bg-gray-800 hover:bg-gray-700 focus:bg-gray-900 focus:outline-none focus:shadow-outline sm:text-sm"
-        >
+          class="relative block w-full py-2 px-3 border border-transparent rounded-md text-white font-semibold bg-gray-800 hover:bg-gray-700 focus:bg-gray-900 focus:outline-none focus:shadow-outline sm:text-sm">
           <span class="absolute left-0 inset-y pl-3">
             <svg
               class="h-5 w-5 text-gray-500"
               fill="currentColor"
-              viewBox="0 0 20 20"
-            >
+              viewBox="0 0 20 20">
               <path
                 fill-rule="evenodd"
                 d="M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z"
-                clip-rule="evenodd"
-              />
+                clip-rule="evenodd" />
             </svg>
           </span>
-          {$_("log_in")}
+          {$_('log_in')}
         </button>
       </div>
     </div>
     <div class="mt-2">
       <a
         href="/forgot_password"
-        class="block w-full text-center py-2 px-3 border border-gray-300 rounded-md font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm"
-      >
-        {$_("forgot_password")}
+        class="block w-full text-center py-2 px-3 border border-gray-300 rounded-md font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm">
+        {$_('forgot_password')}
       </a>
     </div>
   </div>

src/components/cards/CardsOverview.svelte

@@ -152,7 +152,7 @@
   }
 
   onMount(async () => {
-    toast.loading($_("loading-cards"));
+    toast.loading("Karten werden geladen...");
     let page = 0;
     while (page >= 0) {
       const cards = await RunnerCardService.runnerCardControllerGetAll(
@@ -173,7 +173,8 @@
       page++;
     }
     toast.dismiss();
-    toast.success($_('all-cards-loaded'));
+    toast.success("All cards loaded");
+    console.log("All cards loaded");
   });
 </script>
 

src/components/dashboard/MainDashContent.svelte

@@ -143,7 +143,7 @@
       <StatCard
         title={$_("total-distance")}
         value={`${stats.total_distance / 1000} km`}
-        href="/scans/"
+        href="#"
       >
         <svg
           fill="currentColor"
@@ -159,7 +159,7 @@
       <StatCard
         title={$_("average-distance")}
         value={`${(stats.average_distance / 1000).toFixed(2)} km`}
-        href="/scans/"
+        href="#"
       >
         <svg
           fill="currentColor"

src/locales/de.json

@@ -35,7 +35,6 @@
     "all-associated-runners-will-be-deleted-too": "Alle zugehörigen Läufer:innen werden auch gelöscht!",
     "all-associated-scans-will-get-deleted-as-well": "Alle Scans dieser Station werden ebenfalls gelöscht",
     "all-associated-teams-and-runners-will-be-deleted-too": "Alle assoziierten Teams und Läufer:innen werden auch gelöscht!",
-    "all-cards-loaded": "Alle Karten geladen",
     "already-paid": "Bereits bezahlt",
     "amount": "Anzahl",
     "amount-per-kilometer": "Betrag pro Kilometer",
@@ -95,8 +94,8 @@
     "contacts-are-being-loaded": "Kontakte werden geladen ...",
     "copied-link-to-clipboard": "Link wurde in die Zwischenablage kopiert",
     "copied-token-to-clipboard": "Token wurde in die Zwischenablage kopiert",
-    "count_organizations": "Organisationen",
-    "count_teams": "Teams",
+    "count_organizations": "Organisationen (Anzahl)",
+    "count_teams": "Teams (Anzahl)",
     "create": "Erstellen",
     "create-a-new": "Erstelle eine neue",
     "create-a-new-card": "Neue Läuferkarte erstellen",
@@ -440,11 +439,11 @@
     "token": "Token",
     "total-distance": "gelaufene Strecke",
     "total-donation-amount": "Gesamtbetrag",
-    "total-donation-count": "Sponsorings",
+    "total-donation-count": "Gesamte Sponsorings",
     "total-donations": "Spendensumme",
-    "total-donors": "Sponsor:innen",
+    "total-donors": "gesamte Sponsor:innen",
     "total-paid-amount": "Gezahlt",
-    "total-scans": "Scans",
+    "total-scans": "gesamte Scans",
     "total_donation_amount_in_eur": "Gesamtbetrag in €",
     "track": "Track",
     "track-added": "Track hinzugefügt",
@@ -496,6 +495,6 @@
     "you-dont-have-any-scanstations-yet": "Es gibt noch keine Scannerstationen",
     "you-have-to-provide-an-organization": "Du musst eine Organisation angeben",
     "you-have-to-save-your-changes-to-generate-a-link": "Du musst deine Änderungen speichern, um einen Link zu generieren.",
-    "you-must-create-at-least-one-card-or-cancel": "Du musst mindestens eine Blankokarte erstellen.",
+    "you-must-create-at-least-one-card-or-cancel": "Du musst mindestens eine Blankokarte erstellen (oder abbrechen).",
     "zip-postal-code": "Postleitzahl"
 }

src/locales/en.json

@@ -35,7 +35,6 @@
     "all-associated-runners-will-be-deleted-too": "All associated runners will be deleted too!",
     "all-associated-scans-will-get-deleted-as-well": "All associated scans will get deleted as well",
     "all-associated-teams-and-runners-will-be-deleted-too": "All associated teams and runners will be deleted too!",
-    "all-cards-loaded": "All cards loaded",
     "already-paid": "Already paid",
     "amount": "Amount",
     "amount-per-kilometer": "Amount per kilometer",
@@ -496,6 +495,6 @@
     "you-dont-have-any-scanstations-yet": "You don't have any scanstations yet",
     "you-have-to-provide-an-organization": "You have to provide an organization",
     "you-have-to-save-your-changes-to-generate-a-link": "You have to save your changes to generate a link.",
-    "you-must-create-at-least-one-card-or-cancel": "You must create at least one card.",
+    "you-must-create-at-least-one-card-or-cancel": "You must create at least one card (or cancel).",
     "zip-postal-code": "ZIP/ postal code"
 }