wip

.gitea/workflows/release.yaml

@@ -14,7 +14,7 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: 19
-      - run: npm i -g pnpm@10.8 && pnpm i
+      - run: npm i -g pnpm@10.7 && pnpm i
       - run: pnpm licenses:export
       - name: Login to registry
         uses: docker/login-action@v3

CHANGELOG.md

@@ -2,93 +2,8 @@
 
 All notable changes to this project will be documented in this file. Dates are displayed in UTC.
 
-#### [1.12.1](https://git.odit.services/lfk/frontend/compare/1.12.0...1.12.1)
-
-- fix(donations): Don't show enter payment for anon donations [`32f72df`](https://git.odit.services/lfk/frontend/commit/32f72df10583a08efb26e0983c0c5c829ab03e19)
-- chore(deps): Fresh lock [`1ec8e21`](https://git.odit.services/lfk/frontend/commit/1ec8e2186bdcd69c2acbc785feef4927973bc986)
-- fix(donations): Support anon donations in deletion modal [`27187b4`](https://git.odit.services/lfk/frontend/commit/27187b428da1e757f85392d77d49670f51a19829)
-- fix(donations): Don't show details for anon donations [`ecd418c`](https://git.odit.services/lfk/frontend/commit/ecd418c5db0910d64cdf5336d72a10ebff38e065)
-- refactor(i18n): Update translations [`77a4328`](https://git.odit.services/lfk/frontend/commit/77a432817ef644ff1be8a5ebcd284b7d67f742bd)
-- fix(donations): Remove paid from anon donations [`31a4ff9`](https://git.odit.services/lfk/frontend/commit/31a4ff9d909742df3ed3d6cecae57870e287afcc)
-- fix(donations): Move amount to extra line [`edd5da8`](https://git.odit.services/lfk/frontend/commit/edd5da89a7e741d48078125f68b6dd6d3d88a7a1)
-- refactor(i18n): Shortened translation [`657fb04`](https://git.odit.services/lfk/frontend/commit/657fb04f1b5b439ef5fac834740ba00548b758de)
-- feat(donation): Use new endpoint for creating anon donations [`e28f543`](https://git.odit.services/lfk/frontend/commit/e28f543d89efff80a84131df59bfb26a5ea92d14)
-- fix(donations): Translate modal title [`dc1e6b7`](https://git.odit.services/lfk/frontend/commit/dc1e6b7a67c4761a007ffe3b71fd851fb569fb7c)
-- chore(deps): Bump @odit/lfk-client-js [`cb315d9`](https://git.odit.services/lfk/frontend/commit/cb315d94fd2331bd49aa6d54b9ca0bfbf11f00d9)
-- feat(shared): Hide link while keeping width [`724e844`](https://git.odit.services/lfk/frontend/commit/724e84441e8b71b7d89a8c3804467edebfd58365)
-
-#### [1.12.0](https://git.odit.services/lfk/frontend/compare/1.11.5...1.12.0)
-
-> 28 April 2025
-
-- feat: anonymous donations [`9c03e35`](https://git.odit.services/lfk/frontend/commit/9c03e359a4e8f43452475b02bcabcb354987ab75)
-- refactor: use modern tailwindcss features [`1505080`](https://git.odit.services/lfk/frontend/commit/1505080afdd8b272b76584e2777df732001ce004)
-- chore(release): 1.12.0 [`5dcb4cb`](https://git.odit.services/lfk/frontend/commit/5dcb4cb508b204c5634804811a9f37db78e764ce)
-
-#### [1.11.5](https://git.odit.services/lfk/frontend/compare/1.11.4...1.11.5)
-
-> 25 April 2025
-
-- chore(release): 1.11.5 [`8cb6093`](https://git.odit.services/lfk/frontend/commit/8cb6093f0b3474c0952a8a51a47683262fc31f8f)
-- fix(cards): Update table for edit events [`27396e1`](https://git.odit.services/lfk/frontend/commit/27396e17f2cd8be72c9c8100afe6ec75ac66dceb)
-
-#### [1.11.4](https://git.odit.services/lfk/frontend/compare/1.11.3...1.11.4)
-
-> 25 April 2025
-
-- feat(CardAssign): styled buttons [`f9993c6`](https://git.odit.services/lfk/frontend/commit/f9993c60f565d7270b3a269e934b42b945c24b99)
-- chore(release): 1.11.4 [`fefd5c8`](https://git.odit.services/lfk/frontend/commit/fefd5c8237b91ac7fd7ecf467a6feb1100f84811)
-- feat(CardAssignment): support EAN13 [`8e314f8`](https://git.odit.services/lfk/frontend/commit/8e314f8676e5c189c09a33c9a382a8b984af5e30)
-
-#### [1.11.3](https://git.odit.services/lfk/frontend/compare/1.11.2...1.11.3)
-
-> 25 April 2025
-
-- chore(deps): Updated lock [`bce6d48`](https://git.odit.services/lfk/frontend/commit/bce6d484a9b1d7c40d4575a64ad528da2cc8fb3c)
-- chore(release): 1.11.3 [`98a3b07`](https://git.odit.services/lfk/frontend/commit/98a3b072370f029f82f79a75b8f809bc1b41d82f)
-- fix(cards): Z-Index for bulk card modal [`efad6fd`](https://git.odit.services/lfk/frontend/commit/efad6fdf2eae12c904575727b61fc61ed8a27d14)
-
-#### [1.11.2](https://git.odit.services/lfk/frontend/compare/1.11.1...1.11.2)
-
-> 23 April 2025
-
-- chore(release): 1.11.2 [`2dea19d`](https://git.odit.services/lfk/frontend/commit/2dea19df8990b34a56a345fef05487684ecec8c4)
-- fix(cardassignment): handle card not found [`6c98646`](https://git.odit.services/lfk/frontend/commit/6c986467d39344a32e598b834a115932ab8c9a1f)
-
-#### [1.11.1](https://git.odit.services/lfk/frontend/compare/1.11.0...1.11.1)
-
-> 22 April 2025
-
-- chore(release): 1.11.1 [`3cedbeb`](https://git.odit.services/lfk/frontend/commit/3cedbebe40b7699e39edc133e4bcbc16f4e7eb56)
-- ci: fix build [`dc986e4`](https://git.odit.services/lfk/frontend/commit/dc986e4fe5d462909e34b8bbf9a3c10accb2a00b)
-
-#### [1.11.0](https://git.odit.services/lfk/frontend/compare/1.10.6...1.11.0)
-
-> 22 April 2025
-
-- chore: move to tailwind v4 [`81a8ce0`](https://git.odit.services/lfk/frontend/commit/81a8ce002cd5a470f5ac4f064360c09bcf815ac8)
-- chore(deps): bump [`244be47`](https://git.odit.services/lfk/frontend/commit/244be471f07a6ab77768fb599cc2381a319e4e22)
-- chore: move privacy & imprint to website links [`3288ffb`](https://git.odit.services/lfk/frontend/commit/3288ffb3cc52bcfbb2b94c373932e9d614fba80f)
-- fix: modal position & z index [`a12c4f8`](https://git.odit.services/lfk/frontend/commit/a12c4f87d2db2271a6b123c3a009bd8d2f7663a4)
-- chore: tailwind class cleanup [`80ab4e0`](https://git.odit.services/lfk/frontend/commit/80ab4e037e44edf1f076d4a365ef36c614e7cb0a)
-- fix(cardassignment): debounce w/ immediate start [`1d6ed99`](https://git.odit.services/lfk/frontend/commit/1d6ed990736c6156b67f0715ee1f86aeb2be0390)
-- fix(RunnerDetail): move to standard html select for groups [`e1bf435`](https://git.odit.services/lfk/frontend/commit/e1bf435080a3845a4a29f9b8bce7aba3e9220cf9)
-- chore(release): 1.11.0 [`cae6be6`](https://git.odit.services/lfk/frontend/commit/cae6be6f867aece8997799e90f783a7b5f9b7602)
-- feat(ImportRunnerModal): sort groups by name [`3124574`](https://git.odit.services/lfk/frontend/commit/312457494cb0da805df5ec2811604ea45a09963d)
-- feat(cards): badge style for runner links [`1605b0f`](https://git.odit.services/lfk/frontend/commit/1605b0f7b2c12d2b247f40aefc03d2d053fea60d)
-
-#### [1.10.6](https://git.odit.services/lfk/frontend/compare/1.10.5...1.10.6)
-
-> 22 April 2025
-
-- feat: improved mobile card assignment [`d841727`](https://git.odit.services/lfk/frontend/commit/d841727439e42c940d56001f08da4ae2399176a7)
-- chore(release): 1.10.6 [`3fab344`](https://git.odit.services/lfk/frontend/commit/3fab3447799a5a28db741643189a2c4217b03714)
-
 #### [1.10.5](https://git.odit.services/lfk/frontend/compare/1.10.4...1.10.5)
 
-> 22 April 2025
-
-- chore(release): 1.10.5 [`87df34b`](https://git.odit.services/lfk/frontend/commit/87df34bb56c04c1efd22ecbe0b857198358f93d5)
 - feat(runners): add distance sorting [`9c3b742`](https://git.odit.services/lfk/frontend/commit/9c3b742a98e17837fbcabe308fb2774dc13b03b8)
 
 #### [1.10.4](https://git.odit.services/lfk/frontend/compare/1.10.3...1.10.4)

Dockerfile

@@ -2,8 +2,8 @@ FROM registry.odit.services/hub/library/node:23.10.0-alpine3.21 AS build
 ARG NPM_REGISTRY_URL=https://registry.npmjs.org
 WORKDIR /app
 
-COPY package.json pnpm-lock.yaml vite.config.js index.html ./
+COPY package.json pnpm-lock.yaml vite.config.js tailwind.config.cjs postcss.config.cjs index.html ./
-RUN npm config set registry $NPM_REGISTRY_URL && npm i -g pnpm@10.8
+RUN npm config set registry $NPM_REGISTRY_URL && npm i -g pnpm@10.7
 RUN mkdir /pnpm && pnpm config set store-dir /pnpm && pnpm i
 
 COPY src ./src

index.html

@@ -13,7 +13,7 @@
 
   <body>
     <span style="display: none; visibility: hidden" id="buildinfo"
-      >RELEASE_INFO-1.12.1-RELEASE_INFO</span
+      >RELEASE_INFO-1.10.5-RELEASE_INFO</span
     >
     <noscript>You need to enable JavaScript to run this app.</noscript>
     <script src="/env.js"></script>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@odit/lfk-frontend",
-  "version": "1.12.1",
+  "version": "1.10.5",
   "type": "module",
   "scripts": {
     "i18n-order": "node order.js",
@@ -14,14 +14,15 @@
   "devDependencies": {
     "@odit/license-exporter": "0.2.0",
     "@sveltejs/vite-plugin-svelte": "2.1.1",
-    "@types/papaparse": "^5.3.15",
-    "@types/underscore": "^1.13.0",
     "auto-changelog": "2.5.0",
+    "autoprefixer": "10.4.21",
+    "postcss": "8.5.3",
     "prettier": "3.5.3",
     "prettier-plugin-svelte": "3.3.3",
     "release-it": "17.10.0",
     "svelte-select": "3.17.0",
-    "vite": "6.3.2"
+    "tailwindcss": "3.4.15",
+    "vite": "4.3.3"
   },
   "release-it": {
     "git": {
@@ -41,22 +42,20 @@
     }
   },
   "dependencies": {
-    "@bwip-js/browser": "^4.6.0",
     "@fontsource/athiti": "^5.2.5",
-    "@odit/lfk-client-js": "1.2.5",
+    "@odit/lfk-client-js": "1.2.4",
     "@paralleldrive/cuid2": "2.2.2",
-    "@tailwindcss/vite": "^4.1.4",
     "@tanstack/svelte-table": "8.9.1",
+    "bwip-js": "3.4.0",
     "check-password-strength": "2.0.10",
+    "csvtojson": "2.0.10",
     "html5-qrcode": "^2.3.8",
     "localforage": "1.10.0",
-    "papaparse": "^5.5.2",
+    "marked": "4.3.0",
     "svelte": "3.58.0",
     "svelte-french-toast": "1.2.0",
-    "svelte-i18n": "4.0.1",
+    "svelte-i18n": "3.6.0",
-    "tailwindcss": "^4.1.4",
     "tinro": "0.6.12",
-    "underscore": "^1.13.7",
     "validator": "13.15.0",
     "xlsx": "0.18.5"
   },

postcss.config.cjs

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+};

public/privacy_en.md

@@ -0,0 +1 @@
+Nostrud tempor dolor aute ea excepteur aute mollit elit eiusmod exercitation. Magna laborum pariatur adipisicing pariatur cupidatat exercitation duis aliquip pariatur sint exercitation deserunt labore. Consectetur id laboris dolore nostrud do velit ipsum. Eu laboris velit do commodo ad ea sint ex cillum. Cillum ipsum qui eiusmod laborum mollit sunt dolore incididunt. Cillum sunt culpa veniam voluptate et qui ut magna anim occaecat ut mollit dolor. Duis irure proident eu incididunt dolore sunt nisi aute dolore amet eu fugiat laboris quis.

src/App.svelte

@@ -54,6 +54,8 @@
   import UserPermissions from "./components/users/UserPermissions.svelte";
   import GroupPermissions from "./components/groups/GroupPermissions.svelte";
   import RunnerDetail from "./components/runners/RunnerDetail.svelte";
+  import Imprint from "./components/general/Imprint.svelte";
+  import Privacy from "./components/general/Privacy.svelte";
   import ResetPassword from "./components/auth/ResetPassword.svelte";
   import Contacts from "./components/contacts/Contacts.svelte";
   import ContactDetail from "./components/contacts/ContactDetail.svelte";
@@ -86,6 +88,14 @@
     <Route path="/about">
       <About />
     </Route>
+  {:else if $router.path === "/imprint"}
+    <Route path="/imprint">
+      <Imprint />
+    </Route>
+  {:else if $router.path === "/privacy"}
+    <Route path="/privacy">
+      <Privacy />
+    </Route>
   {:else if $store.isLoggedIn}
     <Dashboard>
       <Transition>

src/components/base/PromiseError.svelte

@@ -5,7 +5,7 @@
 
 <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
   <span class="inline-block align-middle mr-8">
-    <b>{$_("general_promise_error")}</b>
+    <b class="capitalize">{$_("general_promise_error")}</b>
     {error}
   </span>
 </div>

src/components/cards/AddCardBulkModal.svelte

@@ -111,7 +111,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-2xl sm:w-full relative z-10"
+        class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-2xl sm:w-full"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -122,7 +122,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"

src/components/cards/AddCardModal.svelte

@@ -104,7 +104,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -115,7 +115,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
@@ -148,7 +148,7 @@
                     >{$_("runner")}</label
                   >
                   <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                     itemFilter={(label, filterText, option) =>
                       filterRunners(label, filterText, option)}
                     items={runners}

src/components/cards/CardDetailModal.svelte

@@ -98,7 +98,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -109,7 +109,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
@@ -139,7 +139,7 @@
                     >{$_("runner")}</label
                   >
                   <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                     itemFilter={(label, filterText, option) =>
                       filterRunners(label, filterText, option)}
                     items={runners}
@@ -162,7 +162,7 @@
                       name="enabled"
                       type="checkbox"
                       checked={editable.enabled}
-                      class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
                     />
                     {$_("this-card-is")}
                     {#if editable.enabled}

src/components/cards/CardRunner.svelte

@@ -6,7 +6,7 @@
 {#if !runner}
   {$_("non-blanko")}
 {:else}
-  <a class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full border border-current bg-blue-100 text-blue-800" href={`/runners/${runner.id}`}>
+  <a href={`/runners/${runner.id}`}>
     {#if runner.middlename}
       {runner.firstname} {runner.middlename} {runner.lastname}
     {:else}

src/components/cards/CardsOverview.svelte

@@ -180,9 +180,11 @@
     bind:runner
     bind:editable
     bind:original_data
-    on:dataUpdated={(editevent) => {
+    on:dataUpdated={(event) => {
-      console.log(editevent.detail.card)
+      current_cards[
-      current_cards = current_cards.filter((c) => c.id !== editevent.detail.card.id).concat([editevent.detail.card]).sort((a, b) => a.code - b.code);
+        current_cards.findIndex((c) => c.id === event.detail.card.id)
+      ] = event.detail.card;
+      current_cards = current_cards;
       options.update((options) => ({
         ...options,
         data: current_cards,

src/components/cards/DeleteCardModal.svelte

@@ -54,7 +54,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -65,7 +65,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"

src/components/contacts/AddContactModal.svelte

@@ -156,7 +156,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -167,7 +167,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
@@ -345,7 +345,7 @@
                       id="comments"
                       name="comments"
                       type="checkbox"
-                      class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
                     />
                   </div>
                   <div class="ml-3 text-sm">

src/components/contacts/ContactDetail.svelte

@@ -300,7 +300,7 @@
 					id="comments"
 					name="comments"
 					type="checkbox"
-					class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+					class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
 				/>
 			</div>
 			<div class="ml-3 text-sm">

src/components/contacts/ContactsOverview.svelte

@@ -190,7 +190,7 @@
 	{:catch error}
 		<div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
 			<span class="inline-block align-middle mr-8">
-				<b>{$_("general_promise_error")}</b>
+				<b class="capitalize">{$_("general_promise_error")}</b>
 				{error}
 			</span>
 		</div>

src/components/dashboard/Dashboard.svelte

@@ -60,7 +60,7 @@
 						/>
 					</svg>
 
-					<span>{$_('card_assignment_menu')}</span>
+					<span>Card Assignment</span>
 				</a>
 				<a
 					class:activenav={$router.path.includes("/runners/")}

src/components/dashboard/MainDashContent.svelte

@@ -255,7 +255,7 @@
 	{:catch error}
 		<div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
 			<span class="inline-block align-middle mr-8">
-				<b>{$_("general_promise_error")}</b>
+				<b class="capitalize">{$_("general_promise_error")}</b>
 				{error}
 			</span>
 		</div>

src/components/donations/AddDonationModal.svelte

@@ -21,7 +21,7 @@
   $: runner = 0;
   $: donors = [];
   $: runners = [];
-	$: type = "distance";
+  $: is_fixed = false;
   $: is_paid = false;
   $: amount_input = 0;
   $: processed_last_submit = true;
@@ -46,7 +46,7 @@
       let amount_cent = Math.floor(amount_input * 100);
       processed_last_submit = false;
       toast.loading($_("adding-donation"));
-			if (type === "fixed") {
+      if (is_fixed) {
         let postdata = {
           donor,
           amount: amount_cent,
@@ -72,26 +72,7 @@
           .finally(() => {
             processed_last_submit = true;
           });
-			} else if (type === "anonymous") {
+      } else {
-				let postdata = {
-					amount: amount_cent,
-				};
-				DonationService.donationControllerPostAnonymous(postdata)
-					.then((result) => {
-						amount_input = 0;
-						modal_open = false;
-						//
-						toast.dismiss();
-						toast.success($_("donation_added"));
-						dispatch("created", { donations: [result] });
-					})
-					.catch((err) => {
-						//
-					})
-					.finally(() => {
-						processed_last_submit = true;
-					});
-			} else if (type === "distance") {
         let postdata = {
           donor,
           runner,
@@ -119,12 +100,16 @@
   }
 
   onMount(async () => {
-		donors = (await DonorService.donorControllerGetAll()).map((r) => {
+    donors = (await DonorService.donorControllerGetAll()).map(
+      (r) => {
         return { label: getDonorLabel(r), value: r };
-		});
+      }
-		runners = (await RunnerService.runnerControllerGetAll()).map((r) => {
+    );
+    runners = (await RunnerService.runnerControllerGetAll()).map(
+      (r) => {
         return { label: getDonorLabel(r), value: r };
-		});
+      }
+    );
   });
 </script>
 
@@ -141,7 +126,7 @@
     >
       <div class="fixed inset-0 transition-opacity" aria-hidden="true">
         <div
-					class="absolute inset-0 bg-neutral-500 opacity-75"
+          class="absolute inset-0 bg-gray-500 opacity-75"
           data-id="modal_backdrop"
         />
       </div>
@@ -150,7 +135,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -161,7 +146,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-								class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
@@ -174,97 +159,40 @@
               >
             </div>
             <div class="mt-3">
-              <h3 class="text-xl leading-6 font-medium text-neutral-900">
+              <h3 class="text-lg leading-6 font-medium text-gray-900">
-                {$_("add-donation")}
+                {#if is_fixed}
+                  {$_("create-a-new-fixed-donation")}
+                {:else}{$_("create-a-new-distance-donation")}{/if}
               </h3>
-							<nav
+              <label class="content-center align-middle object-center">
-								class="relative z-0 flex border border-neutral-200 rounded-xl overflow-hidden mb-2"
+                <span class="text-base" class:text-gray-300={is_fixed}
+                  >{$_("distance-donation")}</span
                 >
-								<button
-									on:click={() => {
-										type = "distance";
-									}}
-									type="button"
-									id="bar-with-underline-item-1"
-									class:donation_active_tab={type === "distance"}
-									class:donation_inactive_tab={type !== "distance"}
-									aria-selected={type === "distance"}
-									role="tab"
-								>
-									{$_("spende_pro_km")}
-								</button>
-								<button
-									on:click={() => {
-										type = "fixed";
-									}}
-									type="button"
-									id="bar-with-underline-item-2"
-									class:donation_active_tab={type === "fixed"}
-									class:donation_inactive_tab={type !== "fixed"}
-									aria-selected={type === "fixed"}
-									role="tab"
-								>
-									{$_("festbetrag")}
-								</button>
-								<button
-									on:click={() => {
-										type = "anonymous";
-									}}
-									type="button"
-									id="bar-with-underline-item-3"
-									class:donation_active_tab={type === "anonymous"}
-									class:donation_inactive_tab={type !== "anonymous"}
-									aria-selected={type === "anonymous"}
-									role="tab"
-								>
-									{$_("anonyme_spende")}
-								</button>
-							</nav>
-
-							<div class="grid grid-cols-6 gap-2 lg:gap-6 text-left">
-								{#if type === "anonymous"}
-									<div class="col-span-6">
-										<label
-											for="donation_amount_eur"
-											class="block text-sm font-medium text-neutral-900"
-										>
-											{$_("donation-amount")}</label
-										>
-										<div class="mt-1 flex rounded-md shadow-sm">
                 <input
-												autocomplete="off"
+                  class="toggle relative w-10 h-5 transition-all duration-200 ease-in-out bg-gray-400 rounded-full shadow-inner outline-none appearance-none align-middle"
-												class:border-red-500={!is_amount_valid}
+                  type="checkbox"
-												class:focus:border-red-500={!is_amount_valid}
+                  bind:checked={is_fixed}
-												class:focus:ring-red-500={!is_amount_valid}
-												bind:value={amount_input}
-												type="number"
-												step="0.01"
-												name="donation_amount_eur"
-												class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-l-md sm:text-sm border-neutral-300 border bg-neutral-50 text-neutral-800 p-2"
-												placeholder="2.00"
                 />
-											<span
+                <span class="ml-2 text-base" class:text-gray-300={!is_fixed}
-												class="inline-flex items-center px-3 rounded-r-md border border-neutral-300 bg-neutral-50 text-neutral-500 text-sm"
+                  >{$_("fixed-donation")}</span
-												>€</span
                 >
+              </label>
+              <div class="mb-6">
+                <p class="text-sm text-gray-500">
+                  {$_(
+                    "please-provide-the-nessecary-information-to-create-a-new-donation"
+                  )}
+                </p>
               </div>
-										{#if !is_amount_valid}
+              <div class="grid grid-cols-6 gap-2 lg:gap-6 text-left">
-											<span
-												class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
-											>
-												{$_("donation-amount-must-be-greater-that-0-00eur")}
-											</span>
-										{/if}
-									</div>
-								{:else}
                 <div class="col-span-6">
                   <label
                     for="donor"
-											class="block text-sm font-medium text-neutral-900"
+                    class="block text-sm font-medium text-gray-700"
                     >{$_("donor")}</label
                   >
                   <Select
-											containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-neutral-300 border bg-neutral-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                     itemFilter={(label, filterText, option) =>
                       filterDonors(label, filterText, option)}
                     items={donors}
@@ -276,15 +204,15 @@
                     on:clear={() => (donors = null)}
                   />
                 </div>
-									{#if type === "distance"}
+                {#if !is_fixed}
                   <div class="col-span-6">
                     <label
                       for="donor"
-												class="block text-sm font-medium text-neutral-900"
+                      class="block text-sm font-medium text-gray-700"
                       >{$_("runner")}</label
                     >
                     <Select
-												containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-neutral-300 border bg-neutral-50 text-neutral-800 rounded-md p-2"
+                      containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                       itemFilter={(label, filterText, option) =>
                         filterDonors(label, filterText, option)}
                       items={runners}
@@ -300,11 +228,11 @@
                 <div class="col-span-6">
                   <label
                     for="donation_amount_eur"
-											class="block text-sm font-medium text-neutral-900"
+                    class="block text-sm font-medium text-gray-700"
                   >
-											{#if type === "fixed"}
+                    {#if !is_fixed}
-												{$_("donation-amount")}
+                      {$_("amount-per-kilometer")}
-											{:else}{$_("amount-per-kilometer")}{/if}</label
+                    {:else}{$_("donation-amount")}{/if}</label
                   >
                   <div class="mt-1 flex rounded-md shadow-sm">
                     <input
@@ -316,11 +244,11 @@
                       type="number"
                       step="0.01"
                       name="donation_amount_eur"
-												class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-l-md sm:text-sm border-neutral-300 border bg-neutral-50 text-neutral-800 p-2"
+                      class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 p-2"
                       placeholder="2.00"
                     />
                     <span
-												class="inline-flex items-center px-3 rounded-r-md border border-neutral-300 bg-neutral-50 text-neutral-500 text-sm"
+                      class="inline-flex items-center px-3 rounded-r-md border border-gray-300 bg-gray-50 text-gray-500 text-sm"
                       >€</span
                     >
                   </div>
@@ -332,29 +260,36 @@
                     </span>
                   {/if}
                 </div>
-								{/if}
+                {#if is_fixed}
-								{#if type === "fixed"}
+                  <div class="col-span-6">
-									<div class="flex">
-										<input
-											bind:checked={is_paid}
-											type="checkbox"
-											class="shrink-0 mt-0.5 border-neutral-200 rounded-sm text-blue-600 focus:ring-blue-500 checked:border-blue-500 disabled:opacity-50 disabled:pointer-events-none"
-											id="hs-default-checkbox"
-										/>
                     <label
-											for="hs-default-checkbox"
+                      for="paid"
-											class="text-base text-neutral-900 ms-2 font-medium"
+                      class="block text-sm font-medium text-gray-700"
                       >{$_("already-paid")}</label
                     >
+                    <p class="text-gray-500">
+                      <input
+                        id="paid"
+                        bind:checked={is_paid}
+                        name="paid"
+                        type="checkbox"
+                        class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
+                      />
+                      <span class="align-text-bottom">
+                        {#if is_paid}
+                          {$_("paid")}
+                        {:else}
+                          {$_("open")}
+                        {/if}
+                      </span>
+                    </p>
                   </div>
                 {/if}
               </div>
             </div>
           </div>
         </div>
-				<div
+        <div class="bg-gray-50 px-4 lg:py-3 sm:px-6 grid gap-2 lg:rounded-b-xl pt-3 pb-10">
-					class="bg-neutral-50 px-4 lg:py-3 sm:px-6 grid gap-2 lg:rounded-b-xl pt-3 pb-10"
-				>
           <button
             disabled={!createbtnenabled}
             class:opacity-50={!createbtnenabled}
@@ -369,7 +304,7 @@
               modal_open = false;
             }}
             type="button"
-						class="w-full justify-center rounded-md border border-neutral-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-neutral-900 hover:bg-neutral-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 hidden lg:block"
+            class="w-full justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 hidden lg:block"
           >
             {$_("cancel")}
           </button>
@@ -378,3 +313,28 @@
     </div>
   </div>
 {/if}
+
+<style>
+  .toggle:before {
+    content: "";
+    position: absolute;
+    width: 1.25rem;
+    height: 1.25rem;
+    border-radius: 50%;
+    top: 0;
+    left: 0;
+    transform: scale(1.1);
+    box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.2);
+    background-color: white;
+    transition: 0.2s ease-in-out;
+  }
+
+  .toggle:checked {
+    /* @apply: bg-indigo-400; */
+    background-color: #7f9cf5;
+  }
+
+  .toggle:checked:before {
+    left: 1.25rem;
+  }
+</style>

src/components/donations/AddDonationPaymentModal.svelte

@@ -96,7 +96,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -107,7 +107,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"

src/components/donations/DeleteDonationModal.svelte

@@ -13,7 +13,6 @@
       firstname: "",
       lastname: "",
     },
-    amount: 0,
   };
   const dispatch = createEventDispatcher();
   onMount(() => {
@@ -58,7 +57,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -69,7 +68,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
@@ -87,12 +86,8 @@
               </h3>
               <div class="w-full">
                 <span class="inline-block"
-                  >{#if delete_donation.donor}<b>{$_("donor")}</b>: {delete_donation.donor.firstname}
+                  ><b>{$_("donor")}</b>: {delete_donation.donor.firstname}
-                  {delete_donation.donor.lastname}{:else}{$_("anonymer_sponsor")}{/if}
+                  {delete_donation.donor.lastname}</span
-                  <br>
-                  <b>{$_("amount")}</b>: {`${(delete_donation.amount / 100)
-          .toFixed(2)
-          .toLocaleString("de-DE", { valute: "EUR" })}€`}</span
                 >
               </div>
             </div>

src/components/donations/DonationDetail.svelte

@@ -236,7 +236,7 @@
 				>{$_("donor")}</label
 			>
 			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 				itemFilter={(label, filterText, option) =>
 					filterDonors(label, filterText, option)}
 				items={current_donors}
@@ -259,7 +259,7 @@
 					>{$_("runner")}</label
 				>
 				<Select
-					containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+					containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 					itemFilter={(label, filterText, option) =>
 						filterDonors(label, filterText, option)}
 					items={current_runners}

src/components/donations/DonationDonor.svelte

@@ -4,10 +4,7 @@
 </script>
 
 {#if !donor || donor.firstname == 0}
-	<span
+  {$_("donor-has-no-associated-donations")}
-		class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800 border border-current"
-		>{$_('anonymer_sponsor')}</span
-	>
 {:else}
   <div class="flex items-center">
     <a

src/components/donations/DonationTableAction.svelte

@@ -9,15 +9,10 @@
   export let paymentAction;
 </script>
 
-{#if paymentAction}
 <button
   on:click={paymentAction}
   class="text-[#025a21] hover:text-green-900 mr-4">{$_("enter-payment")}</button
 >
-{:else}
-<span class="inline-block opacity-0 cursor-default mr-4" style="">{$_("enter-payment")}</span>
-
-{/if}
 <TableActions
   bind:detailsAction
   bind:detailsLink

src/components/donations/DonationsOverview.svelte

@@ -112,25 +112,18 @@
       accessorKey: "actions",
       header: () => $_("action"),
       cell: (info) => {
-        let detailsLink
-        let paymentAction
-        if (info.row.original.donor != undefined){
-          detailsLink = `./${info.row.original.id}`
-          paymentAction = () => {
-            active_edits = current_donations.filter(
-              (r) => r.id == info.row.original.id
-            );
-          }
-        }
-        
         return renderComponent(DonationTableAction, {
-          detailsLink: detailsLink,
+          detailsLink: `./${info.row.original.id}`,
           deleteAction: () => {
             active_deletes = current_donations.filter(
               (r) => r.id == info.row.original.id
             );
           },
-          paymentAction: paymentAction,
+          paymentAction: () => {
+            active_edits = current_donations.filter(
+              (r) => r.id == info.row.original.id
+            );
+          },
           deleteEnabled:
             store.state.jwtinfo.userdetails.permissions.includes(
               "DONATION:DELETE"

src/components/donors/AddDonorModal.svelte

@@ -144,7 +144,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -155,7 +155,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
@@ -309,7 +309,7 @@
                       id="comments"
                       name="comments"
                       type="checkbox"
-                      class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
                     />
                   </div>
                   <div class="ml-3 text-sm">

src/components/donors/ConfirmDonorDeletion.svelte

@@ -34,7 +34,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
@@ -45,7 +45,7 @@
 							class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
 						>
 							<svg
-								class="size-6 text-blue-600"
+								class="h-6 w-6 text-blue-600"
 								fill="currentColor"
 								xmlns="http://www.w3.org/2000/svg"
 								viewBox="0 0 24 24"

src/components/donors/DonorDetail.svelte

@@ -314,7 +314,7 @@
 					id="comments"
 					name="comments"
 					type="checkbox"
-					class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+					class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
 				/>
 			</div>
 			<div class="ml-3">

src/components/general/About.svelte

@@ -44,7 +44,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
@@ -56,7 +56,7 @@
 						>
 							<svg
 								fill="currentColor"
-								class="size-6 text-blue-600"
+								class="h-6 w-6 text-blue-600"
 								xmlns="http://www.w3.org/2000/svg"
 								viewBox="0 0 24 24"
 								width="24"
@@ -158,7 +158,7 @@
 				class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
 			>
 				<span class="inline-block align-middle mr-8">
-					<b>{$_("general_promise_error")}</b>
+					<b class="capitalize">{$_("general_promise_error")}</b>
 					{error}
 				</span>
 			</div>

src/components/general/CardAssignment.svelte

@@ -389,12 +389,6 @@
 				:paused={!scannerActive}
 				on:detect={(e) => {
 					if (scannerActive) {
-						if (`${e.detail.decodedText}`.length === 13) {
-							e.detail.decodedText = e.detail.decodedText.substring(
-								0,
-								e.detail.decodedText.length - 1
-							);
-						}
 						scannerActive = false;
 						console.log({ type: "DETECT", code: e.detail.decodedText });
 						if (runnerinfo.id === 0) {
@@ -439,7 +433,7 @@
 								state = "assigning";
 								RunnerCardService.runnerCardControllerGetAll()
 									.then((cards) => {
-										// console.log(cards);
+										console.log(cards);
 										const card = cards.find((c) => c.code === cardCode);
 										if (card) {
 											console.log("card found", card);
@@ -456,10 +450,7 @@
 													scannerActive = false;
 												});
 										} else {
-											console.log("card not found");
+											scannerActive = true;
-											// scannerActive = true;
-											state = "error_card";
-											scannerActive = false;
 										}
 									})
 									.catch(() => {

src/components/general/Footer.svelte

@@ -44,12 +44,8 @@
       target="_blank">{$_("documentation")}</a
     >
     -
-		<a class="underline" href="https://lauf-fuer-kaya.de/datenschutz/"
+    <a class="underline" href="/privacy">{$_("privacy")}</a>
-			>{$_("privacy")}</a
-		>
     -
-		<a class="underline" href="https://lauf-fuer-kaya.de/impressum/"
+    <a class="underline" href="/imprint">{$_("imprint")}</a>
-			>{$_("imprint")}</a
-		>
   </p>
 </footer>

src/components/general/Imprint.svelte

@@ -0,0 +1,52 @@
+<script>
+  import { _, getLocaleFromNavigator } from "svelte-i18n";
+  import { parse } from "marked";
+  import Footer from "./Footer.svelte";
+  // import * as css from "../base/simple.css";
+  let html = "";
+  async function load() {
+    let md = await fetch("/imprint_" + getLocaleFromNavigator() + ".md");
+    let text = (await md.text()).toString();
+    if (text.includes("<meta")) {
+      md.ok = false;
+    }
+    if (!md.ok) {
+      md = await fetch("/imprint_en.md");
+      text = await md.text();
+    }
+    html = parse(text);
+  }
+  const promise = load();
+</script>
+
+<div class="pt-12 px-4 sm:px-6 lg:px-8 lg:pt-20 bg-gray-900 pb-12">
+  <div class="text-center mb-8">
+    <h1
+      class="mt-9 font-display text-4xl leading-none font-semibold text-white sm:text-5xl lg:text-6xl"
+    >
+      {$_("imprint")}
+    </h1>
+  </div>
+</div>
+
+<div class="pt-0 pb-16 overflow-hidden lg:pt-12 lg:py-24">
+  <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
+    {#await promise}
+      <p class="text-center w-full">{$_("imprint-loading")}</p>
+    {:then}
+      <div class="simplecontent">
+        {@html html}
+      </div>
+    {:catch error}
+      <div
+        class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
+      >
+        <span class="inline-block align-middle mr-8">
+          <b class="capitalize">{$_("general_promise_error")}</b>
+          {error}
+        </span>
+      </div>
+    {/await}
+  </div>
+</div>
+<Footer />

src/components/general/Privacy.svelte

@@ -0,0 +1,52 @@
+<script>
+  import { _, getLocaleFromNavigator } from "svelte-i18n";
+  import { parse } from "marked";
+  import Footer from "./Footer.svelte";
+  // import * as css from "../base/simple.css?inline";
+  let html = "";
+  async function load() {
+    let md = await fetch("/privacy_" + getLocaleFromNavigator() + ".md");
+    let text = (await md.text()).toString();
+    if (text.includes("<meta")) {
+      md.ok = false;
+    }
+    if (!md.ok) {
+      md = await fetch("/privacy_en.md");
+      text = await md.text();
+    }
+    html = parse(text);
+  }
+  const promise = load();
+</script>
+
+<div class="pt-12 px-4 sm:px-6 lg:px-8 lg:pt-20 bg-gray-900 pb-12">
+  <div class="text-center mb-8">
+    <h1
+      class="mt-9 font-display text-4xl leading-none font-semibold text-white sm:text-5xl lg:text-6xl"
+    >
+      {$_("privacy")}
+    </h1>
+  </div>
+</div>
+
+<div class="pt-0 pb-16 overflow-hidden lg:pt-12 lg:py-24">
+  <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
+    {#await promise}
+      <p class="text-center w-full">{$_("privacy-loading")}</p>
+    {:then}
+      <div class="simplecontent">
+        {@html html}
+      </div>
+    {:catch error}
+      <div
+        class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
+      >
+        <span class="inline-block align-middle mr-8">
+          <b class="capitalize">{$_("general_promise_error")}</b>
+          {error}
+        </span>
+      </div>
+    {/await}
+  </div>
+</div>
+<Footer />

src/components/general/QrCodeScanner.svelte

@@ -4,8 +4,8 @@
 		Html5QrcodeScanner,
 		Html5QrcodeScanType,
 		Html5QrcodeSupportedFormats,
+		Html5QrcodeScannerState,
 	} from "html5-qrcode";
-	import { debounce } from "underscore";
 
 	export let width;
 	export let height;
@@ -13,17 +13,23 @@
 
 	const dispatch = createEventDispatcher();
 
-	const debouncedDispatch = debounce(
+	const debounceFunc = (func, delay) => {
-		function (decodedText) {
+		let timer;
-			// console.log("dispatchEvent");
+		return function (...args) {
+			const context = this;
+			clearTimeout(timer);
+			timer = setTimeout(() => {
+				func.apply(context, args);
+			}, delay);
+		};
+	};
+
+	const debouncedDispatch = debounceFunc(function (decodedText) {
+		console.log("dispatchEvent");
 		dispatch("detect", { decodedText });
-		},
+	}, 500);
-		500,
-		true
-	);
 
 	function onScanSuccess(decodedText, decodedResult) {
-		// console.log("onScanSuccess", decodedText);
 		if (!paused) {
 			debouncedDispatch(decodedText);
 		}

src/components/general/Sidebar.svelte

@@ -0,0 +1,103 @@
+<script>
+  let open = false;
+</script>
+
+<div class="md:flex flex-col md:flex-row h-screen w-full">
+  <div
+    class="flex flex-col w-full md:w-64 text-gray-700 bg-white dark-mode:text-gray-200 dark-mode:bg-gray-800 flex-shrink-0"
+  >
+    <div
+      class="flex-shrink-0 px-8 py-4 flex flex-row items-center justify-between"
+    >
+      <a
+        href="/#/test"
+        class="text-lg font-semibold tracking-widest text-gray-900 uppercase rounded-lg dark-mode:text-white focus:outline-none focus:shadow-outline"
+        >Sidebar</a
+      >
+      <button
+        class="rounded-lg md:hidden focus:outline-none focus:shadow-outline"
+      >
+        <svg fill="currentColor" viewBox="0 0 20 20" class="w-6 h-6">
+          {#if open}
+            <path
+              fill-rule="evenodd"
+              d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
+              clip-rule="evenodd"
+            />
+          {/if}
+          {#if !open}
+            <path
+              fill-rule="evenodd"
+              d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM9 15a1 1 0 011-1h6a1 1 0 110 2h-6a1 1 0 01-1-1z"
+              clip-rule="evenodd"
+            />
+          {/if}
+        </svg>
+      </button>
+    </div>
+    <nav
+      :class:block={open}
+      :class:hidden={!open}
+      class="flex-grow md:block px-4 pb-4 md:pb-0 md:overflow-y-auto"
+    >
+      <a
+        class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 bg-gray-200 rounded-lg dark-mode:bg-gray-700 dark-mode:hover:bg-gray-600 dark-mode:focus:bg-gray-600 dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:text-gray-200 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
+        href="#">Blog</a
+      >
+      <a
+        class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 bg-transparent rounded-lg dark-mode:bg-transparent dark-mode:hover:bg-gray-600 dark-mode:focus:bg-gray-600 dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:text-gray-200 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
+        href="#">Portfolio</a
+      >
+      <a
+        class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 bg-transparent rounded-lg dark-mode:bg-transparent dark-mode:hover:bg-gray-600 dark-mode:focus:bg-gray-600 dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:text-gray-200 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
+        href="#">About</a
+      >
+      <a
+        class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 bg-transparent rounded-lg dark-mode:bg-transparent dark-mode:hover:bg-gray-600 dark-mode:focus:bg-gray-600 dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:text-gray-200 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
+        href="#">Contact</a
+      >
+      <div class="relative">
+        <button
+          on:click={() => {
+            open = !open;
+          }}
+          class="flex flex-row items-center w-full px-4 py-2 mt-2 text-sm font-semibold text-left bg-transparent rounded-lg dark-mode:bg-transparent dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:focus:bg-gray-600 dark-mode:hover:bg-gray-600 md:block hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
+        >
+          <span>Dropdown</span>
+          <svg
+            fill="currentColor"
+            viewBox="0 0 20 20"
+            class="inline w-4 h-4 mt-1 ml-1 transition-transform duration-200 transform md:-mt-1"
+            ><path
+              fill-rule="evenodd"
+              d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
+              clip-rule="evenodd"
+            /></svg
+          >
+        </button>
+        <div
+          class:block={open}
+          class:hidden={!open}
+          class="absolute right-0 w-full mt-2 origin-top-right rounded-md shadow-lg"
+        >
+          <div
+            class="px-2 py-2 bg-white rounded-md shadow dark-mode:bg-gray-800"
+          >
+            <a
+              class="block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg dark-mode:bg-transparent dark-mode:hover:bg-gray-600 dark-mode:focus:bg-gray-600 dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:text-gray-200 md:mt-0 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
+              href="#">Link #1</a
+            >
+            <a
+              class="block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg dark-mode:bg-transparent dark-mode:hover:bg-gray-600 dark-mode:focus:bg-gray-600 dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:text-gray-200 md:mt-0 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
+              href="#">Link #2</a
+            >
+            <a
+              class="block px-4 py-2 mt-2 text-sm font-semibold bg-transparent rounded-lg dark-mode:bg-transparent dark-mode:hover:bg-gray-600 dark-mode:focus:bg-gray-600 dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:text-gray-200 md:mt-0 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline"
+              href="#">Link #3</a
+            >
+          </div>
+        </div>
+      </div>
+    </nav>
+  </div>
+</div>

src/components/groups/AddGroupModal.svelte

@@ -79,7 +79,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -92,7 +92,7 @@
               <svg
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 640 512"
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 width="24"
                 height="24"

src/components/groups/UserGroupsOverview.svelte

@@ -140,7 +140,7 @@
   {:catch error}
     <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
       <span class="inline-block align-middle mr-8">
-        <b>{$_("general_promise_error")}</b>
+        <b class="capitalize">{$_("general_promise_error")}</b>
         {error}
       </span>
     </div>

src/components/orgs/AddOrgModal.svelte

@@ -102,7 +102,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -113,7 +113,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
@@ -170,7 +170,7 @@
                       id="comments"
                       name="comments"
                       type="checkbox"
-                      class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
                     />
                   </div>
                   <div class="ml-3 text-sm">

src/components/orgs/ConfirmOrgDeletionModal.svelte

@@ -45,7 +45,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
@@ -56,7 +56,7 @@
 							class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
 						>
 							<svg
-								class="size-6 text-blue-600"
+								class="h-6 w-6 text-blue-600"
 								fill="currentColor"
 								width="24"
 								height="24"

src/components/orgs/OrgDetail.svelte

@@ -224,7 +224,7 @@
 				>{$_("contact")}</label
 			>
 			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 				itemFilter={(label, filterText, option) =>
 					label.toLowerCase().includes(filterText.toLowerCase()) ||
 					option.value.id.toString().startsWith(filterText.toLowerCase())}
@@ -246,7 +246,7 @@
 						id="toggle_selfservice_feature"
 						name="toggle_selfservice_feature"
 						type="checkbox"
-						class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+						class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
 					/>
 				</div>
 				<div class="ml-3 text-sm">
@@ -303,7 +303,7 @@
 								id="toggle_address_checkbox"
 								name="toggle_address_checkbox"
 								type="checkbox"
-								class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+								class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
 							/>
 						</div>
 						<div class="ml-3 text-sm">

src/components/orgs/Orgs.svelte

@@ -159,7 +159,7 @@
 											<input
 												bind:checked={o.is_selected}
 												type="checkbox"
-												class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+												class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
 											/>
 										</td>
 										<td class="px-6 py-4 whitespace-nowrap">
@@ -230,7 +230,7 @@
 				class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
 			>
 				<span class="inline-block align-middle mr-8">
-					<b>{$_("general_promise_error")}</b>
+					<b class="capitalize">{$_("general_promise_error")}</b>
 					{error}
 				</span>
 			</div>

src/components/pdf_generation/DownloadProgressModal.svelte

@@ -42,7 +42,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
@@ -55,7 +55,7 @@
 							<svg
 								xmlns="http://www.w3.org/2000/svg"
 								viewBox="0 0 24 24"
-								class="size-6 text-blue-600"
+								class="h-6 w-6 text-blue-600"
 								fill="currentColor"
 								width="24"
 								height="24"

src/components/runners/AddRunnerModal.svelte

@@ -137,7 +137,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -150,7 +150,7 @@
               <svg
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 width="24"
                 height="24"
@@ -248,7 +248,7 @@
                     >{$_("team")}</label
                   >
                   <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                     itemFilter={(label, filterText, option) =>
                       label.toLowerCase().includes(filterText.toLowerCase()) ||
                       option.value.id

src/components/runners/DeleteRunnerModal.svelte

@@ -51,7 +51,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -64,7 +64,7 @@
               <svg
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 width="24"
                 height="24"

src/components/runners/ImportRunnerModal.svelte

@@ -1,5 +1,5 @@
 <script>
-	import { parse } from "papaparse";
+	import csv from "csvtojson";
 	import { read as readXlsx, utils as xlsx_utils } from "xlsx";
 	import { _ } from "svelte-i18n";
 	import { clickOutside } from "../base/outsideclick";
@@ -10,6 +10,7 @@
 		RunnerOrganizationService,
 	} from "@odit/lfk-client-js";
 	import { createEventDispatcher } from "svelte";
+	import Select from "svelte-select";
 	import toast from "svelte-french-toast";
 	export let opened_from;
 	export let passed_org;
@@ -45,7 +46,6 @@
 			return { label: r.name, value: `ORG_${r.id}` };
 		});
 		groups = groups.concat(orgs);
-		groups.sort((a, b) => a.label.localeCompare(b.label));
 		RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
 			const teams = val.map((r) => {
 				return {
@@ -54,7 +54,6 @@
 				};
 			});
 			groups = groups.concat(teams);
-			groups.sort((a, b) => a.label.localeCompare(b.label));
 		});
 	});
 	let selected_org;
@@ -63,14 +62,13 @@
 	let recent_processed = true;
 	$: json_output = [];
 	$: {
-		if (json_output.length === 0) {
 		if (files) {
 			if (
 				files[0].type ===
 				"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
 			) {
 				const reader = new FileReader();
-					reader.addEventListener("loadend", (e) => {
+				reader.addEventListener("load", async (e) => {
 					const data = new Uint8Array(e.target.result);
 					const out = readXlsx(data, { type: "array" });
 					json_output = xlsx_utils.sheet_to_json(
@@ -80,17 +78,16 @@
 				reader.readAsArrayBuffer(files[0]);
 			} else {
 				const reader = new FileReader();
-					reader.addEventListener("loadend", (e) => {
+				reader.addEventListener("load", async (e) => {
-						json_output = parse(e.target.result, {
+					json_output = await csv({
-							delimitersToGuess: [";", ","],
+						delimiter: [";", ","],
-							header: true,
+						trim: true,
-						}).data;
+					}).fromString(e.target.result);
 				});
 				reader.readAsText(files[0]);
 			}
 		}
 	}
-	}
 	function importAction() {
 		if (recent_processed === true) {
 			toast.loading($_("runners-are-being-imported"));
@@ -210,7 +207,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
@@ -225,7 +222,7 @@
 							<svg
 								xmlns="http://www.w3.org/2000/svg"
 								viewBox="0 0 24 24"
-								class="size-6 text-blue-600"
+								class="h-6 w-6 text-blue-600"
 								fill="currentColor"
 								width="24"
 								height="24"

src/components/runners/RunnerDetail.svelte

@@ -52,17 +52,12 @@
 					return { label: r.name, value: r };
 				});
 				groups = groups.concat(orgs);
-				groups.sort((a, b) => a.label.localeCompare(b.label));
 				RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
 					const teams = val.map((r) => {
 						return { label: `${r.parentGroup.name} > ${r.name}`, value: r };
 					});
 					groups = groups.concat(teams);
-					groups.sort((a, b) => a.label.localeCompare(b.label));
+					group = groups.find((g) => g.value.id == editable.group);
-					let tmp_group = groups.find((g) => g.value.id == editable.group);
-					if (tmp_group) {
-						group = tmp_group.value.id;
-					}
 				});
 			}
 		);
@@ -275,14 +270,21 @@
 		</div>
 		<div class="text-sm w-full mt-2">
 			<span class="font-semibold text-gray-700">{$_("group")}</span>
-			<select
+			<Select
-				class="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
-				bind:value={editable.group}
+				itemFilter={(label, filterText, option) =>
-			>
+					label.toLowerCase().includes(filterText.toLowerCase()) ||
-				{#each groups as g}
+					option.id.value.toString().startsWith(filterText.toLowerCase())}
-					<option value={g.value.id}>{g.label}</option>
+				items={groups}
-				{/each}
+				showChevron={true}
-			</select>
+				placeholder={$_("search-for-an-organization-or-team-by-name-or-id")}
+				noOptionsMessage={$_("no-organization-or-team-found")}
+				bind:selectedValue={group}
+				on:select={(selectedValue) => {
+					editable.group = selectedValue.detail.value.id;
+				}}
+				on:clear={() => (editable.group = null)}
+			/>
 		</div>
 		<div class="text-sm w-full mt-2">
 			<span class="font-semibold text-gray-700">{$_("distance")}</span>
@@ -290,7 +292,7 @@
 			<span class="text-gray-700">{original_data.distance / 1000} km</span>
 		</div>
 		<div class="text-sm w-full mt-2">
-			<span class="font-semibold text-gray-700">{$_("created_via")}</span>
+			<span class="font-semibold text-gray-700">{$_('created_via')}</span>
 			<br />
 			<span class="text-gray-700">{original_data.created_via}</span>
 		</div>

src/components/scans/AddScanModal.svelte

@@ -88,7 +88,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -99,7 +99,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
@@ -131,7 +131,7 @@
                     >{$_("runner")}</label
                   >
                   <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                     itemFilter={(label, filterText, option) =>
                       filterRunners(label, filterText, option)}
                     items={runners}

src/components/scans/DeleteScanModal.svelte

@@ -53,7 +53,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -66,7 +66,7 @@
               <svg
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 width="24"
                 height="24"

src/components/scans/ScanDetail.svelte

@@ -218,7 +218,7 @@
 				>{$_("runner")}</label
 			>
 			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 				itemFilter={(label, filterText, option) =>
 					filterRunners(label, filterText, option)}
 				items={current_runners}

src/components/scanstations/AddScanStationModal.svelte

@@ -92,7 +92,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -103,7 +103,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
@@ -133,7 +133,7 @@
                     class="block text-sm font-medium text-gray-700">Track</label
                   >
                   <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                     itemFilter={(label, filterText, option) =>
                       label.toLowerCase().includes(filterText.toLowerCase()) ||
                       option.value.id
@@ -178,7 +178,7 @@
                       name="enabled"
                       type="checkbox"
                       checked={enabled}
-                      class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
                     />
                     {$_("this-scanstation-is")}
                     {#if enabled}{$_("enabled")}{:else}{$_("disabled")}{/if}

src/components/scanstations/ConfirmScanStationDeletion.svelte

@@ -42,7 +42,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -53,7 +53,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"

src/components/scanstations/CopyScanStationTokenModal.svelte

@@ -1,7 +1,7 @@
 <script>
 	import { _ } from "svelte-i18n";
 	import { tick } from "svelte";
-	import { toCanvas } from "@bwip-js/browser";
+	import bwipjs from "bwip-js";
 	import toast from "svelte-french-toast";
 
 	export let copy_modal_open;
@@ -51,7 +51,7 @@
 		if (bcid == "code128") {
 			codeconfig.height = 10;
 		}
-		toCanvas(canvas, codeconfig);
+		bwipjs.toCanvas(canvas, codeconfig);
 		return canvas.toDataURL("image/png");
 	}
 </script>
@@ -75,7 +75,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
@@ -86,7 +86,7 @@
 							class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
 						>
 							<svg
-								class="size-6 text-blue-600"
+								class="h-6 w-6 text-blue-600"
 								fill="currentColor"
 								xmlns="http://www.w3.org/2000/svg"
 								viewBox="0 0 24 24"
@@ -184,9 +184,7 @@
 						/>
 					</div>
 				</div>
-				<div
+				<div class="bg-gray-50 px-4 lg:py-3 sm:px-6 grid gap-2 lg:rounded-b-xl pt-3 pb-10">
-					class="bg-gray-50 px-4 lg:py-3 sm:px-6 grid gap-2 lg:rounded-b-xl pt-3 pb-10"
-				>
 					<button
 						on:click={close}
 						type="button"

src/components/scanstations/ScanStationDetail.svelte

@@ -178,7 +178,7 @@
 					name="enabled"
 					type="checkbox"
 					checked={editable.enabled}
-					class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+					class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
 				/>
 				{$_("this-scanstation-is")}
 				{#if editable.enabled}{$_("enabled")}{:else}{$_("disabled")}{/if}

src/components/scanstations/ScanStations.svelte

@@ -210,7 +210,7 @@
 				class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
 			>
 				<span class="inline-block align-middle mr-8">
-					<b>{$_("general_promise_error")}</b>
+					<b class="capitalize">{$_("general_promise_error")}</b>
 					{error}
 				</span>
 			</div>

src/components/settings/ConfirmProfileDeletion.svelte

@@ -43,7 +43,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -54,7 +54,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"

src/components/shared/TableActions.svelte

@@ -15,8 +15,6 @@
 	<button on:click={detailsAction} class="text-indigo-600 hover:text-indigo-900"
 		>{$_("details")}</button
 	>
-{:else}
-<span class="inline-block opacity-0 cursor-default" style="">{$_("details")}</span>
 {/if}
 {#if deleteEnabled}
 	<button

src/components/statsclients/AddStatsClientModal.svelte

@@ -78,7 +78,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -89,7 +89,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"

src/components/statsclients/ConfirmStatsClientDeletion.svelte

@@ -41,7 +41,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -52,7 +52,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"

src/components/statsclients/CopyStatsClientTokenModal.svelte

@@ -52,7 +52,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -63,7 +63,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"

src/components/statsclients/StatsClientsOverview.svelte

@@ -161,7 +161,7 @@
   {:catch error}
     <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
       <span class="inline-block align-middle mr-8">
-        <b>{$_("general_promise_error")}</b>
+        <b class="capitalize">{$_("general_promise_error")}</b>
         {error}
       </span>
     </div>

src/components/teams/AddTeamModal.svelte

@@ -89,7 +89,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -100,7 +100,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 width="24"
                 height="24"
@@ -158,7 +158,7 @@
                     >{$_("organization")}</label
                   >
                   <Select
-                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+                    containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
                     itemFilter={(label, filterText, option) =>
                       label.toLowerCase().includes(filterText.toLowerCase()) ||
                       option.value.id

src/components/teams/ConfirmTeamDeletionModal.svelte

@@ -44,7 +44,7 @@
 				aria-hidden="true">&#8203;</span
 			>
 			<div
-				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+				class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
 				role="dialog"
 				aria-modal="true"
 				aria-labelledby="modal-headline"
@@ -55,7 +55,7 @@
 							class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
 						>
 							<svg
-								class="size-6 text-blue-600"
+								class="h-6 w-6 text-blue-600"
 								fill="currentColor"
 								width="24"
 								height="24"

src/components/teams/TeamDetail.svelte

@@ -212,7 +212,7 @@
 				>{$_("contact")}</label
 			>
 			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 				itemFilter={(label, filterText, option) =>
 					label.toLowerCase().includes(filterText.toLowerCase()) ||
 					option.value.id.toString().startsWith(filterText.toLowerCase())}
@@ -231,7 +231,7 @@
 				>{$_("organization")}</label
 			>
 			<Select
-				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
+				containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-neutral-800 rounded-md p-2"
 				itemFilter={(label, filterText, option) =>
 					label.toLowerCase().includes(filterText.toLowerCase()) ||
 					option.id.value.toString().startsWith(filterText.toLowerCase())}

src/components/teams/Teams.svelte

@@ -144,7 +144,7 @@
 											<input
 												bind:checked={t.is_selected}
 												type="checkbox"
-												class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+												class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
 											/>
 										</td>
 										<td class="px-6 py-4 whitespace-nowrap">
@@ -215,7 +215,7 @@
 				class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500"
 			>
 				<span class="inline-block align-middle mr-8">
-					<b>{$_("general_promise_error")}</b>
+					<b class="capitalize">{$_("general_promise_error")}</b>
 					{error}
 				</span>
 			</div>

src/components/tracks/AddTrackModal.svelte

@@ -87,7 +87,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -98,7 +98,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="none"
                 width="24"
                 height="24"

src/components/tracks/TracksOverview.svelte

@@ -259,7 +259,7 @@
   {:catch error}
     <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
       <span class="inline-block align-middle mr-8">
-        <b>{$_("general_promise_error")}</b>
+        <b class="capitalize">{$_("general_promise_error")}</b>
         {error}
       </span>
     </div>

src/components/users/AddUserModal.svelte

@@ -104,7 +104,7 @@
         aria-hidden="true">&#8203;</span
       >
       <div
-        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw] relative z-10"
+        class="inline-block align-bottom text-left shadow-xl transform transition-all sm:align-middle w-full lg:w-auto min-w-auto lg:min-w-[35vw]"
         role="dialog"
         aria-modal="true"
         aria-labelledby="modal-headline"
@@ -115,7 +115,7 @@
               class="flex-shrink-0 flex items-center justify-center size-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
             >
               <svg
-                class="size-6 text-blue-600"
+                class="h-6 w-6 text-blue-600"
                 fill="currentColor"
                 width="24"
                 height="24"

src/components/users/UserDetail.svelte

@@ -192,7 +192,7 @@
 					name="enabled"
 					type="checkbox"
 					checked={editable_userdata.enabled}
-					class="focus:ring-indigo-500 size-4 text-indigo-600 border-gray-300 rounded"
+					class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
 				/>
 				{$_("set-the-user-active-inactive")}
 			</p>

src/components/users/UsersOverview.svelte

@@ -182,7 +182,7 @@
   {:catch error}
     <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
       <span class="inline-block align-middle mr-8">
-        <b>{$_("general_promise_error")}</b>
+        <b class="capitalize">{$_("general_promise_error")}</b>
         {error}
       </span>
     </div>

src/locales/de.json

@@ -41,8 +41,6 @@
   "already-paid": "Bereits bezahlt",
   "amount": "Anzahl",
   "amount-per-kilometer": "Betrag pro Kilometer",
-    "anonyme_spende": "Anonyme Spende",
-    "anonymer_sponsor": "👻 Anonym",
   "apartment-suite-etc": "Apartment, Wohnung, etc.",
   "api-endpoint": "API-Endpunkt",
   "application_name": "Lauf für Kaya! - Admin",
@@ -66,9 +64,6 @@
   "card-added": "Karte wurde erstellt",
   "card-deleted": "Karte gelöscht",
   "card-updated": "Karte aktualisiert",
-    "card_assignment_for_mobile": "Mobile Kartenzuweisung",
-    "card_assignment_menu": "Kartenzuweisung",
-    "card_not_found": "Läuferkarte nicht gefunden...",
   "cards": "Läuferkarten",
   "cards-deleted": "Karten gelöscht",
   "certificates": "Urkunden",
@@ -79,7 +74,6 @@
   "click-to-copy-token-to-clipboard": "Klicke auf den Token, um ihn in deine Zwischenablage zu kopieren",
   "close": "Schließen",
   "code": "Code",
-    "code_128_barcode": "Code 128 Barcode",
   "config-codes": "Konfigurations-Codes",
   "confirm": "Bestätigen",
   "confirm-delete": "Löschung Bestätigen",
@@ -200,7 +194,6 @@
   "donation_added": "Sponsoring hinzugefügt",
   "donations": "Sponsorings",
   "donations-are-being-loaded": "Sponsorings werden geladen...",
-    "done": "✅ Fertig",
   "donor": "Sponsor",
   "donor-added": "Sponsor hinzugefügt",
   "donor-deleted": "Sponsor gelöscht",
@@ -226,7 +219,6 @@
   "error_on_login": "😢Fehler beim Login",
   "everything-concerning-your-profile": "Alles zu deinem Profil",
   "faq": "FAQ",
-    "festbetrag": "Festbetrag",
   "filename_sponsoringquittungsliste": "SponsoringQuittungsListe",
   "filter-by-organization-team": "Filtern nach Organisation / Team",
   "first-name": "Vorname",
@@ -262,6 +254,7 @@
   "import-runners": "Läufer importieren",
   "import__target-organization": "Ziel Organisation",
   "imprint": "Impressum ",
+  "imprint-loading": "Impressum lädt...",
   "inactive": "Inaktiv",
   "inherited-permissions": "geerbte",
   "installed-version": "Installierte Version",
@@ -303,7 +296,6 @@
   "name": "Name",
   "name-is-required": "Der Gruppenname muss angegeben werden",
   "new-password": "Neues Passwort",
-    "next_runner": "Nächster Läufer",
   "no-address": "Keine Adresse hinterlegt",
   "no-contact-found": "Keine Kontakte gefunden",
   "no-contact-selected": "Kein Kontakt ausgewählt",
@@ -365,9 +357,9 @@
   "please-provide-the-required-information-to-create-a-new-statsclient": "Bitte gebe alle für einen Statsclient notwendigen Informationen an",
   "please-request-a-new-reset-mail": "Bitte eine neue Passwortreset-Mail anfordern...",
   "please-wait-a-moment-your-login-is-still-being-processed": "Bitte warte einen Moment, deine Anmeldung wird verarbeitet",
-    "please_wait_a_moment_while_we_assign_the_card": "Karte wird zugewiesen...",
   "prefix": "Prefix",
   "privacy": "Datenschutz",
+  "privacy-loading": "Datenschutzerklärung lädt...",
   "profile": "Profil",
   "profile-deleted": "Profil gelöscht!",
   "profile-picture": "Profilbild",
@@ -384,7 +376,6 @@
   "runner-import": "Läufer Import",
   "runner-is-being-added": "Läufer wird hinzugefügt...",
   "runner-updated": "Läufer aktualisiert!",
-    "runner_not_found": "Läufer nicht gefunden...",
   "runner_via_selfservice": "Läufer via Selfservice",
   "runnercards": "Laeuferkarten",
   "runnerimport_verify_runners_org": "Bitte die Läufer für den Import in die Organisation \"{org_name}\" bestätigen",
@@ -398,8 +389,6 @@
   "scan-deleted": "Scan gelöscht",
   "scan-is-being-updated": "Scan wird aktualisiert",
   "scan-with-fixed-distance": "Scan mit Festdistanz",
-    "scan_card": "Läuferkarte scannen",
-    "scan_runner": "Läufer scannen",
   "scans": "Scans",
   "scans-are-being-loaded": "Scans werden geladen",
   "scanstation": "Scanner Station",
@@ -415,13 +404,11 @@
   "select-all": "Alle auswählen",
   "select-language": "Sprache auswählen",
   "selfservice-registration": "Selfservice Registrierung",
-    "selfservice_qr_registration_barcode": "Kiosk QR/ Selfservice Barcode",
   "send-a-mail-to-lfk-odit-services": "Sende eine Mail an lfk@odit.services",
   "set-the-user-active-inactive": "Den Benutzer auf (in)aktiv setzen",
   "settings": "Einstellungen",
   "settings-for-your-profile": "Die Einstellungen deines Accounts",
   "something-about-the-group": "Infos zur Gruppe",
-    "spende_pro_km": "Spende pro km",
   "sponsoring-quittungs-liste_herunterladen": "Sponsoring-Quittungs-Liste herunterladen",
   "sponsorings": "Sponsoringerklaerungen",
   "station-deleted": "Scannerstation gelöscht",
@@ -485,7 +472,6 @@
   "track-updated": "Laufstrecke aktualisiert",
   "track-was-updated": "Laufstrecke wurde aktualisiert",
   "tracks": "Laufstrecken",
-    "try_again": "erneut versuchen",
   "unpaid": "Offen",
   "update-card": "Karte aktualisieren",
   "update-password": "Passwort ändern",
@@ -526,5 +512,16 @@
   "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.",
-    "zip-postal-code": "Postleitzahl"
+  "zip-postal-code": "Postleitzahl",
+  "card_assignment_for_mobile": "Mobile Kartenzuweisung",
+  "code_128_barcode": "Code 128 Barcode",
+  "done": "✅ Fertig",
+  "next_runner": "Nächster Läufer",
+  "please_wait_a_moment_while_we_assign_the_card": "Karte wird zugewiesen...",
+  "runner_not_found": "Läufer nicht gefunden...",
+  "scan_card": "Läuferkarte scannen",
+  "scan_runner": "Läufer scannen",
+  "selfservice_qr_registration_barcode": "Kiosk QR/ Selfservice Barcode",
+  "try_again": "erneut versuchen",
+  "card_not_found": "Läuferkarte nicht gefunden..."
 }

src/locales/en.json

@@ -41,8 +41,6 @@
   "already-paid": "Already paid",
   "amount": "Amount",
   "amount-per-kilometer": "Amount per kilometer",
-    "anonyme_spende": "Anonymous",
-    "anonymer_sponsor": "👻 Anonymous",
   "apartment-suite-etc": "Apartment, suite, etc.",
   "api-endpoint": "API-Endpoint",
   "application_name": "Lauf für Kaya! - Admin",
@@ -66,9 +64,6 @@
   "card-added": "Card added",
   "card-deleted": "Card deleted",
   "card-updated": "Card updated",
-    "card_assignment_for_mobile": "Card Assignment for Mobile",
-    "card_assignment_menu": "Card Assignment",
-    "card_not_found": "Card not found...",
   "cards": "Cards",
   "cards-deleted": "Cards deleted",
   "certificates": "Certificates",
@@ -79,7 +74,6 @@
   "click-to-copy-token-to-clipboard": "Click to copy the token to your clipboard",
   "close": "Close",
   "code": "Code",
-    "code_128_barcode": "Code 128 Barcode",
   "config-codes": "Config codes",
   "confirm": "Confirm",
   "confirm-delete": "Confirm Delete",
@@ -200,7 +194,6 @@
   "donation_added": "Donation_added",
   "donations": "Donations",
   "donations-are-being-loaded": "donations are being loaded",
-    "done": "✅ Done",
   "donor": "Donor",
   "donor-added": "Donor added",
   "donor-deleted": "donor deleted",
@@ -226,7 +219,6 @@
   "error_on_login": "Error on login",
   "everything-concerning-your-profile": "Everything concerning your profile",
   "faq": "FAQ",
-    "festbetrag": "Fixed amount",
   "filename_sponsoringquittungsliste": "DonorReceiptList",
   "filter-by-organization-team": "Filter by Organization/ Team",
   "first-name": "First name",
@@ -262,6 +254,7 @@
   "import-runners": "Import runners",
   "import__target-organization": "Target Organization",
   "imprint": "Imprint",
+  "imprint-loading": "Imprint loading...",
   "inactive": "Inactive",
   "inherited-permissions": "inherited",
   "installed-version": "Installed version",
@@ -303,7 +296,6 @@
   "name": "Name",
   "name-is-required": "Name is required",
   "new-password": "New password",
-    "next_runner": "Next Runner",
   "no-address": "no address",
   "no-contact-found": "No contacts found",
   "no-contact-selected": "No contact selected",
@@ -365,9 +357,9 @@
   "please-provide-the-required-information-to-create-a-new-statsclient": "Please provide the required information to create a new statsclient",
   "please-request-a-new-reset-mail": "Please request a new reset mail...",
   "please-wait-a-moment-your-login-is-still-being-processed": "Please wait a moment, your login is still being processed",
-    "please_wait_a_moment_while_we_assign_the_card": "Please wait a moment while we assign the card...",
   "prefix": "Prefix",
   "privacy": "Privacy",
+  "privacy-loading": "Privacy loading...",
   "profile": "Profile",
   "profile-deleted": "Profile deleted!",
   "profile-picture": "Profile Picture",
@@ -384,7 +376,6 @@
   "runner-import": "Runner Import",
   "runner-is-being-added": "Runner is being added...",
   "runner-updated": "Runner updated!",
-    "runner_not_found": "Runner not found...",
   "runner_via_selfservice": "Runner via Selfservice",
   "runnercards": "Runnercards",
   "runnerimport_verify_runners_org": "Please confirm these runners for import into the organization \"{org_name}\"",
@@ -398,8 +389,6 @@
   "scan-deleted": "scan deleted",
   "scan-is-being-updated": "Scan is being updated",
   "scan-with-fixed-distance": "Scan with fixed distance",
-    "scan_card": "Scan Card",
-    "scan_runner": "Scan Runner",
   "scans": "Scans",
   "scans-are-being-loaded": "Scans are being loaded",
   "scanstation": "Scanstation",
@@ -415,13 +404,11 @@
   "select-all": "select all",
   "select-language": "Select language",
   "selfservice-registration": "Selfservice registration",
-    "selfservice_qr_registration_barcode": "Kiosk QR/ Selfservice Barcode",
   "send-a-mail-to-lfk-odit-services": "send a mail to lfk@odit.services",
   "set-the-user-active-inactive": "set the user active/ inactive",
   "settings": "Settings",
   "settings-for-your-profile": "Settings for your profile",
   "something-about-the-group": "Something about the group...",
-    "spende_pro_km": "Per Kilometer",
   "sponsoring-quittungs-liste_herunterladen": "Download donor receipt list",
   "sponsorings": "Sponsorings",
   "station-deleted": "station deleted",
@@ -485,7 +472,6 @@
   "track-updated": "Track deleted",
   "track-was-updated": "Track was updated!",
   "tracks": "Tracks",
-    "try_again": "Try Again",
   "unpaid": "Unpaid",
   "update-card": "Update Card",
   "update-password": "Update password",
@@ -526,5 +512,16 @@
   "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.",
-    "zip-postal-code": "ZIP/ postal code"
+  "zip-postal-code": "ZIP/ postal code",
+  "card_assignment_for_mobile": "Card Assignment for Mobile",
+  "done": "✅ Done",
+  "next_runner": "Next Runner",
+  "please_wait_a_moment_while_we_assign_the_card": "Please wait a moment while we assign the card...",
+  "runner_not_found": "Runner not found...",
+  "try_again": "Try Again",
+  "scan_runner": "Scan Runner",
+  "selfservice_qr_registration_barcode": "Kiosk QR/ Selfservice Barcode",
+  "scan_card": "Scan Card",
+  "code_128_barcode": "Code 128 Barcode",
+  "card_not_found": "Card not found..."
 }

src/style.css

@@ -1,5 +1,5 @@
-@import "tailwindcss";
+@tailwind base;
-
+@tailwind components;
 .activenav {
   @apply bg-gray-300;
   @apply text-black;
@@ -7,27 +7,4 @@
 * {
   font-family: Athiti;
 }
-.html5-qrcode-element {
+@tailwind utilities;
-	@apply block;
-	@apply w-full;
-	@apply p-4;
-}
-#qr-scanner__dashboard_section_csr {
-	/* padding-right: 20px; */
-	padding: 1rem;
-}
-#html5-qrcode-select-camera {
-	@apply px-2 py-2 inline-flex text-lg leading-5 font-semibold rounded-md border border-current bg-neutral-100 text-neutral-800 mb-2;
-}
-#html5-qrcode-button-camera-start {
-	@apply px-2 inline-flex text-lg leading-5 font-semibold rounded-md border border-current bg-green-100 text-green-800 mb-2 cursor-pointer;
-}
-#html5-qrcode-button-camera-stop {
-	@apply px-2 inline-flex text-lg leading-5 font-semibold rounded-md border border-current bg-red-100 text-red-800 mb-2 cursor-pointer;
-}
-.donation_inactive_tab {
-	@apply min-w-0 flex-1 bg-white first:border-s-0 border-s border-b-2 border-neutral-200 py-4 px-4 text-neutral-800 hover:text-neutral-700 text-sm font-medium text-center overflow-hidden hover:bg-neutral-200 cursor-pointer focus:z-10 focus:outline-hidden focus:bg-neutral-200 disabled:opacity-50 disabled:pointer-events-none;
-}
-.donation_active_tab {
-	@apply min-w-0 flex-1 bg-blue-400 text-white first:border-s-0 border-s border-b-2 border-neutral-200 py-4 px-4 text-sm font-medium text-center overflow-hidden cursor-pointer focus:outline-hidden;
-}

tailwind.config.cjs

@@ -0,0 +1,16 @@
+module.exports = {
+  darkMode: 'selector',
+  mode: "jit",
+  content: ["./src/**/*.svelte"],
+  theme: {
+    extend: {
+      colors: {
+        reepolee: {
+          500: "#b40000",
+          600: "#9c0000",
+          700: "#750000",
+        },
+      },
+    },
+  },
+};

vite.config.js

@@ -1,8 +1,11 @@
 // vite.config.js
 import { defineConfig } from "vite";
 import { svelte } from "@sveltejs/vite-plugin-svelte";
-import tailwindcss from "@tailwindcss/vite";
 
 export default defineConfig({
-	plugins: [svelte(), tailwindcss()],
+  plugins: [
+    svelte({
+      /* plugin options */
+    }),
+  ],
 });