Merge branch 'feature/119-Certificate_generation' of git.odit.services:lfk/frontend into feature/119-Certificate_generation

ref #119

.devcontainer/Dockerfile

@@ -0,0 +1,6 @@
+FROM mcr.microsoft.com/vscode/devcontainers/base:alpine-3.12
+RUN apk update
+RUN apk add --upgrade nodejs-current npm
+RUN npm i -g yarn rimraf
+RUN rimraf node_modules
+RUN yarn set version berry

.devcontainer/devcontainer.json

@@ -0,0 +1,20 @@
+{
+	"name": "Node.js",
+	"build": {
+		"dockerfile": "Dockerfile"
+	},
+	"settings": {
+		"terminal.integrated.shell.linux": "/bin/sh"
+	},
+	"extensions": [
+		"dbaeumer.vscode-eslint",
+		"2gua.rainbow-brackets",
+		"christian-kohler.npm-intellisense",
+		"remimarsal.prettier-now",
+		"svelte.svelte-vscode",
+		"lokalise.i18n-ally",
+		"fivethree.vscode-svelte-snippets",
+		"voorjaar.windicss-intellisense"
+	],
+	"postCreateCommand": "yarn && yarn dev --open"
+}

.dockerignore

@@ -1,3 +1 @@
-public/env.sample.js
+public/env.sample.js
-public/workbox-*.js
-public/workbox-*.js.map

.gitignore

@@ -1,11 +1,10 @@
 node_modules
-build
 package-lock.json
 yarn.lock
 *.map
 public/env.js
-public/sw.js
-public/index.html
-public/workbox-*.js
-svelte.config.js
 public/index.html
+/dist
+.yarn
+.pnp.js
+.yarnrc.yml

.vscode/extensions.json

@@ -5,7 +5,8 @@
         "remimarsal.prettier-now",
         "svelte.svelte-vscode",
         "lokalise.i18n-ally",
-        "fivethree.vscode-svelte-snippets"
+        "fivethree.vscode-svelte-snippets",
+        "voorjaar.windicss-intellisense"
     ],
     "unwantedRecommendations": [
         "antfu.i18n-ally"

.vscode/settings.json

@@ -1,4 +1,5 @@
 {
     "i18n-ally.localesPaths": "src/locales",
-    "i18n-ally.keystyle": "nested"
+    "i18n-ally.keystyle": "nested",
+    "windicss.enableCodeFolding": false,
 }

CHANGELOG.md

@@ -2,9 +2,160 @@
 
 All notable changes to this project will be documented in this file. Dates are displayed in UTC.
 
+#### [0.11.0](https://git.odit.services/lfk/frontend/compare/0.10.0...0.11.0)
+
+- Merge pull request 'Generate and print bulk blank cards feature/116-download_blanc_cards' (#117) from feature/116-download_blanc_cards into dev [`25d8b86`](https://git.odit.services/lfk/frontend/commit/25d8b86efd89c442d1bf308a8743134820acfd1f)
+- Added button (including translations [`0614c76`](https://git.odit.services/lfk/frontend/commit/0614c76e924b18b512bab59933a26fec07cf483d)
+- Added button (including translations [`97e338f`](https://git.odit.services/lfk/frontend/commit/97e338f9d4f388596d550990457254c7fa1a3492)
+- Sorted translations [`89bb9c2`](https://git.odit.services/lfk/frontend/commit/89bb9c215e356e0940678f5cabd9e38bc203040e)
+- Added function for generating cards with pdf [`c8d6390`](https://git.odit.services/lfk/frontend/commit/c8d639024a5f2f72d6e30d2ce990b08bd71a5471)
+- Fixed button styling [`08cb079`](https://git.odit.services/lfk/frontend/commit/08cb079e9798392e26515d559af2637e74deea97)
+- Now returning cards on creation with pdf [`1d999d4`](https://git.odit.services/lfk/frontend/commit/1d999d4910acb5efa21b3f9922cdb359babff404)
+- Added comment [`636f018`](https://git.odit.services/lfk/frontend/commit/636f018daa33b99468a257bfc33477e1e644d081)
+- Bumped lfk client js version [`2d18686`](https://git.odit.services/lfk/frontend/commit/2d18686ce782a434ca7bd34c07c36a35b9497273)
+- Bumped lfk-client-js [`7dfaa75`](https://git.odit.services/lfk/frontend/commit/7dfaa7579a22b13194fcdd1c02b4437958261472)
+
+#### [0.10.0](https://git.odit.services/lfk/frontend/compare/0.9.1...0.10.0)
+
+> 26 March 2021
+
+- Added translations [`79c447b`](https://git.odit.services/lfk/frontend/commit/79c447b4c65e55ebb5af71fb0b09174c36e2cecf)
+- Sorted translations 🌍 [`5bd3a46`](https://git.odit.services/lfk/frontend/commit/5bd3a463f00abaf2c98ab554f88e5542d01f364a)
+- Reset can now only be triggered if pw is strong enoug [`75d8f73`](https://git.odit.services/lfk/frontend/commit/75d8f7331b6ae78f3979bb62148188a16f83cb8d)
+- Module now exports functions that check if a password is strong enough and equal to a potential confirmation field [`b2509e9`](https://git.odit.services/lfk/frontend/commit/b2509e9e53ab6b51dfd55e26712e8928160cd64b)
+- 🚀RELEASE v0.10.0 [`f7fc196`](https://git.odit.services/lfk/frontend/commit/f7fc1967a50f302af1d8b668628be2f4ab2975a3)
+- Added more cirteria to the password strength component [`5fa9939`](https://git.odit.services/lfk/frontend/commit/5fa9939696a35d60d762feb0cebef61d31869218)
+- Now using pw strength component [`6aaf838`](https://git.odit.services/lfk/frontend/commit/6aaf8384512185a3a319ce6b3e2505e910468e64)
+- Added a password strength verification [`ad3bd31`](https://git.odit.services/lfk/frontend/commit/ad3bd312e9a5785f81029ea2b7e302ea1addd988)
+- Implemented a custom password strength component [`4956bb0`](https://git.odit.services/lfk/frontend/commit/4956bb0e9c3c1d22d60e849aea5664e35330f897)
+- User creation can now only be triggered if pw is strong enoug [`540304f`](https://git.odit.services/lfk/frontend/commit/540304f947f60a7072c592ca8088996ce7e95cb4)
+- Now using pw strength component for user creation [`7862f44`](https://git.odit.services/lfk/frontend/commit/7862f446532903f1a2eac7b21d5c80c3245785e5)
+- Added missing exports [`962dd0c`](https://git.odit.services/lfk/frontend/commit/962dd0c1bbc0df7f20bcec5b4247188c8935c87e)
+- new license file version [CI SKIP] [`aedb8a7`](https://git.odit.services/lfk/frontend/commit/aedb8a765ba053545adbba9eb014b3bb0e5aac8c)
+- Bumped lfk-client version 🔝 [`cf58bd1`](https://git.odit.services/lfk/frontend/commit/cf58bd15c3541c417ab2be83d96135e931a2b6f6)
+- new license file version [CI SKIP] [`34f4f68`](https://git.odit.services/lfk/frontend/commit/34f4f68524918fd3d1963966a1e259d5b60efaca)
+- Merge pull request 'Implemented password strength test feature/106-password_strength' (#115) from feature/106-password_strength into dev [`09b8144`](https://git.odit.services/lfk/frontend/commit/09b81440804cf98303fcb723a9717d6d0f432da8)
+- Formatting🛠 [`4167819`](https://git.odit.services/lfk/frontend/commit/4167819e7a864d3b1dd95ba48ab1525a454f7f30)
+- Now using pw strength component for reset [`5d5f7c7`](https://git.odit.services/lfk/frontend/commit/5d5f7c7f5c6a69146f41996f4facfeff95791be0)
+
+#### [0.9.1](https://git.odit.services/lfk/frontend/compare/0.9.0...0.9.1)
+
+> 26 March 2021
+
+- 🚀RELEASE v0.9.1 [`2ca63fd`](https://git.odit.services/lfk/frontend/commit/2ca63fd1f675f0da2b18ba43095074dd4823991d)
+- Merge pull request 'Org selfservice Link feature/112-org_registration_links' (#114) from feature/112-org_registration_links into dev [`a5d25e7`](https://git.odit.services/lfk/frontend/commit/a5d25e7d92c7c37e90dbb4ba74b787873f920c6b)
+- Added checkbox to enable registration [`f9fe793`](https://git.odit.services/lfk/frontend/commit/f9fe79357317653b46c09eb95b0db13845cddcf9)
+- Sorted translations [`c074c12`](https://git.odit.services/lfk/frontend/commit/c074c12be75f285612f7a732c106404d9fb4538a)
+- You can now copy the selfservice links to your clipboard [`fcd55f8`](https://git.odit.services/lfk/frontend/commit/fcd55f89d72e6ceb9bb2bdd194cc3420145d6d0d)
+- Formatting [`f185d55`](https://git.odit.services/lfk/frontend/commit/f185d559c0d6476f2f2b9ea74aaad3297411801d)
+- Copy now 100% worX [`a3921b4`](https://git.odit.services/lfk/frontend/commit/a3921b45c70b410293db593a75d2fdd34c131733)
+- Fixed changes in wrong file [`73d95bc`](https://git.odit.services/lfk/frontend/commit/73d95bc0042f8f586ba2f2345342e25da1d280c2)
+- Added check if key exists [`c2d29ff`](https://git.odit.services/lfk/frontend/commit/c2d29ff233f6b3e9dd2555b7e0b845592da2ba35)
+- Added check if key exists [`2316baa`](https://git.odit.services/lfk/frontend/commit/2316baa8984832382be9f3b4549ca62cf9ccb5a3)
+- Added translations [`ddbc293`](https://git.odit.services/lfk/frontend/commit/ddbc293e9ca0525910bf3d995de970ee2c35c56a)
+- new license file version [CI SKIP] [`ded9b58`](https://git.odit.services/lfk/frontend/commit/ded9b589fe087915176c5b54f3c55e412541bc8f)
+- Merge pull request 'first merge to main 🚀' (#71) from dev into main [`9aa8e7e`](https://git.odit.services/lfk/frontend/commit/9aa8e7edffa7e51b00a5ab7a8f16828b7a469181)
+
+#### [0.9.0](https://git.odit.services/lfk/frontend/compare/0.8.7...0.9.0)
+
+> 26 March 2021
+
+- 🚀RELEASE v0.9.0 [`67c3732`](https://git.odit.services/lfk/frontend/commit/67c3732fad5a7c64ae11dcbebaaa095e1a2b387c)
+- Merge pull request 'Runner cards feature/94-runnercard_mgnt' (#111) from feature/94-runnercard_mgnt into dev [`2932f45`](https://git.odit.services/lfk/frontend/commit/2932f4591e62187a4903511051d110e9679c0993)
+- Sorted translations 🌍 [`1665a1a`](https://git.odit.services/lfk/frontend/commit/1665a1a093862a13be78ec65dcdf64eb7d855593)
+- Added translations [`6b5945a`](https://git.odit.services/lfk/frontend/commit/6b5945add86a77630c500872545bb91724b2047f)
+- Sorted translations 🌍 [`d6c315a`](https://git.odit.services/lfk/frontend/commit/d6c315ab8e020bc65b967e2c3f4cd921392d66d5)
+- Sorted translations [`de2fe0e`](https://git.odit.services/lfk/frontend/commit/de2fe0e9f171efb3deeea8cfe638f60e3ca90423)
+- Added basic cards page [`5c5ef95`](https://git.odit.services/lfk/frontend/commit/5c5ef95d2be65c0e951dcd472113c8ce0593c9e0)
+- Moved contract generation to it's own component [`0cfc87f`](https://git.odit.services/lfk/frontend/commit/0cfc87fbe6adfacab5c2fab732866aead3231fbf)
+- Teams now use the new sponsoring contracts module [`014ba3b`](https://git.odit.services/lfk/frontend/commit/014ba3bf6718ff28f35c67c8f732b53aae50723c)
+- Basic card generation worX 🎉🎉 [`d467475`](https://git.odit.services/lfk/frontend/commit/d467475b6d61d50bec3a043ea8792533e8593df6)
+- Orgs now use the new sponsoring contracts module [`8b451b3`](https://git.odit.services/lfk/frontend/commit/8b451b3c6794e7df09898a687533ce8fadd56192)
+- Added runnercard detail/edit modal [`0313f8c`](https://git.odit.services/lfk/frontend/commit/0313f8cc495088df1237d00e6b9ed1a94f019644)
+- Implemented Add card modal [`535b23a`](https://git.odit.services/lfk/frontend/commit/535b23ae917de154e08962f5d486c50d6e091fe0)
+- Added bulk card creation modal [`8a32569`](https://git.odit.services/lfk/frontend/commit/8a32569a3be1ad26ba163f4e2b67a368cfeeb422)
+- Added basic card overview [`c6a1526`](https://git.odit.services/lfk/frontend/commit/c6a15264b3d13d516f3d97ea4b891ed1c328cead)
+- Fixed org generation not hiding the generation toast [`c87321f`](https://git.odit.services/lfk/frontend/commit/c87321f804858f84fcccd85a15b9c3fb003c18be)
+- Working runner runnercard generation [`c907486`](https://git.odit.services/lfk/frontend/commit/c907486c4d1c64114124deb3cd0d0cf11d38a6b1)
+- Implemented bulk creation [`7ad6b73`](https://git.odit.services/lfk/frontend/commit/7ad6b73574174f24f2d6f23b3caf4823881a85e7)
+- Now w/ working dialog🎉🎉🎉 [`ae96730`](https://git.odit.services/lfk/frontend/commit/ae9673070c3959ff6190a37123f3fc609b182c5a)
+- Now w/working editing [`fac059f`](https://git.odit.services/lfk/frontend/commit/fac059f02cae84261443ee95448ec8db06dd755a)
+- Added runnercard generation for teams [`23e0b53`](https://git.odit.services/lfk/frontend/commit/23e0b53107623c505d07a99a51ce836c9324acce)
+- Added bulk creation modal to cards view [`f46ccb6`](https://git.odit.services/lfk/frontend/commit/f46ccb610e01654a4ee5e47d78ab500045dd494b)
+- Added a new runenrcard logo [`acf78a8`](https://git.odit.services/lfk/frontend/commit/acf78a88221d0988f6501ae341e028a4113b578d)
+- Moved modal import to overview for simplification [`1a52aaf`](https://git.odit.services/lfk/frontend/commit/1a52aaf8d1ad19b03d355aec0e1c48182db024f9)
+- Added CardsEmptyState + Emtystate graphic [`2d0beaa`](https://git.odit.services/lfk/frontend/commit/2d0beaaaad4efefd036bbef09f10c8c22bdb2760)
+- Added message for missing runner/blanco card) [`4715978`](https://git.odit.services/lfk/frontend/commit/4715978f810bbb283876f06d147b1ec86d373786)
+- Fixed counting bug [`f5c1ec9`](https://git.odit.services/lfk/frontend/commit/f5c1ec9939d856804c9ec3ead4b3ed869fc2ea63)
+- Added card generation/printing from detail [`4a36fb6`](https://git.odit.services/lfk/frontend/commit/4a36fb6d952d9fe4d5edbe1ed0779c7fbcd50ef0)
+- Formatting [`a516aa7`](https://git.odit.services/lfk/frontend/commit/a516aa7775faa2244862bb2e3c4de623c6405e5b)
+- Moved the pdf generation related componenets to their own folder [`ddd82a7`](https://git.odit.services/lfk/frontend/commit/ddd82a71a7b67ead892626addfd56ba4cc632750)
+- Now routing the cards page [`e852305`](https://git.odit.services/lfk/frontend/commit/e852305400a139f8169350077c30012aed556828)
+- Fuggin snowpack bs [`44bc148`](https://git.odit.services/lfk/frontend/commit/44bc14820fed26d5e0d8b12ecd6b46ca0608ae7b)
+- Formatting [`9f7d223`](https://git.odit.services/lfk/frontend/commit/9f7d2234fb9603a7391ec9a64253724c2c25c333)
+- Now with working org runenrcard generation [`4b3d38b`](https://git.odit.services/lfk/frontend/commit/4b3d38b05b3ed74fc3c0d77e00fa2ed245e6325c)
+- Now importing runner overview [`77e9c20`](https://git.odit.services/lfk/frontend/commit/77e9c205f94cf56c2e3584444899adb1e8bdf3c6)
+- CardsOverview - move to 'enabled' language key [`df53c07`](https://git.odit.services/lfk/frontend/commit/df53c0745035a220d4c07fdce1b5a5e4d763411d)
+- ✒ typo - "Geb" -> "Gebe" [`f794af0`](https://git.odit.services/lfk/frontend/commit/f794af0950de59a7a7b468c30abdcb5c145f65fb)
+- Bumped lfk client lib version [`3cd0468`](https://git.odit.services/lfk/frontend/commit/3cd0468b1921824b131178cb02677540b079f9b0)
+- drop console log - CardDetailModal [`40899e9`](https://git.odit.services/lfk/frontend/commit/40899e9d80ba07a3fbbcac72782db53d98dc318e)
+- Removed debug info [`55693de`](https://git.odit.services/lfk/frontend/commit/55693de93420c2d76af296fcacc6bcad644a3cbf)
+
+#### [0.8.7](https://git.odit.services/lfk/frontend/compare/0.8.6...0.8.7)
+
+> 25 March 2021
+
+- 🚀RELEASE v0.8.7 [`0af2647`](https://git.odit.services/lfk/frontend/commit/0af26479656393b0baea88f6f83c778740a67e62)
+- Fixed listen on wrong permission🐞 [`0844215`](https://git.odit.services/lfk/frontend/commit/08442154f4bf94fc1101808b4585dc1f95afe8b2)
+
+#### [0.8.6](https://git.odit.services/lfk/frontend/compare/0.8.5...0.8.6)
+
+> 25 March 2021
+
+- 🚀RELEASE v0.8.6 [`c3c95bf`](https://git.odit.services/lfk/frontend/commit/c3c95bf2916618efe6764a33d9a42d35764d15be)
+- Merge pull request 'Know Production Bugs 🐞' (#109) from bugfix/107-prod_issues into dev [`d2050b5`](https://git.odit.services/lfk/frontend/commit/d2050b5948890a6077cbb41d82d1a6a1d1106652)
+- Errors now toast errors❌ [`17e0805`](https://git.odit.services/lfk/frontend/commit/17e0805fe64f6d181f55b81afa502ee6443ebabe)
+- Sorted translations 👀 [`82b1811`](https://git.odit.services/lfk/frontend/commit/82b1811971b974b686e7618b8a381e1589c168f6)
+- Fixed missing translations for scanstations🌍 [`aeadef6`](https://git.odit.services/lfk/frontend/commit/aeadef60bbe71da09bb569d20ca7377645beba7f)
+- Sorted translations🌍 [`a1ab65a`](https://git.odit.services/lfk/frontend/commit/a1ab65a0e975c02c01c603bf6d95a79ada1caa0b)
+- Fixed runner import getting triggered with invalid information [`ddd9c39`](https://git.odit.services/lfk/frontend/commit/ddd9c396b6bfd39a7b1627d4975151943b367ebf)
+- Removed middlename search from all files that had it [`6b92405`](https://git.odit.services/lfk/frontend/commit/6b92405bae21e78d694601cbc0b33eed56ef4533)
+- Fixed mail login bug🐞📧 [`0768939`](https://git.odit.services/lfk/frontend/commit/076893981ff4f7f17330746c561acc570339adac)
+- Now disabled search by middlename as a quick workaround 🐞 [`49e87cc`](https://git.odit.services/lfk/frontend/commit/49e87ccb15a7ed5edea22a3c3e235f7bee07d3f4)
+- Fixed conflicting css [`50fffef`](https://git.odit.services/lfk/frontend/commit/50fffef13b8fce885964d8ac277b4ca24d944b2b)
+- Commented out the buggy runner search to prevent bad UX [`fbe74a5`](https://git.odit.services/lfk/frontend/commit/fbe74a5d8090553a35576a17c97019939cf4f386)
+- Fixed outsideclick not clearing import modal🛠 [`ef49e50`](https://git.odit.services/lfk/frontend/commit/ef49e507c175510eeb466d33f222755fac8a2a0b)
+
+#### [0.8.5](https://git.odit.services/lfk/frontend/compare/0.8.4...0.8.5)
+
+> 20 March 2021
+
+- 🚀RELEASE v0.8.5 [`e838e6f`](https://git.odit.services/lfk/frontend/commit/e838e6f321bef1565a7e4316890a3c600b242e5a)
+- Fixed dupliacate mutation 🐞 [`91dd525`](https://git.odit.services/lfk/frontend/commit/91dd5256e9545f62e4342ae5477c36262d6e3401)
+
+#### [0.8.4](https://git.odit.services/lfk/frontend/compare/0.8.3...0.8.4)
+
+> 20 March 2021
+
+- CONFIG: default_username + default_password [`cc926e8`](https://git.odit.services/lfk/frontend/commit/cc926e84fb8bd9d6c9fd37349e25eb802e1bb324)
+- 🚀RELEASE v0.8.4 [`3d4dc2d`](https://git.odit.services/lfk/frontend/commit/3d4dc2d72b129f0134ae9f230810c3301dbd5caa)
+- CONFIG: add 'demo' as default username/password [`ba34710`](https://git.odit.services/lfk/frontend/commit/ba3471068ab00e2d5dbe21d6d763094e662f8347)
+
+#### [0.8.3](https://git.odit.services/lfk/frontend/compare/0.8.2...0.8.3)
+
+> 20 March 2021
+
+- Sorted translation 🌍 [`d6f6d10`](https://git.odit.services/lfk/frontend/commit/d6f6d10cb6b639a1f988e0da4811355750b0f027)
+- Smaller bugfixes [`8e04377`](https://git.odit.services/lfk/frontend/commit/8e0437728bd04223a23cdf1879c6c739ca8ebef7)
+- More small fixes [`1249904`](https://git.odit.services/lfk/frontend/commit/12499045824c13a3ee35c6cc8c3c3a3130dbec12)
+- 🚀RELEASE v0.8.3 [`fff16e6`](https://git.odit.services/lfk/frontend/commit/fff16e6650cce1231a8d0db43531bf8e3e01f84a)
+
 #### [0.8.2](https://git.odit.services/lfk/frontend/compare/0.8.1...0.8.2)
 
+> 20 March 2021
+
 - Now using env base url [`aa8196d`](https://git.odit.services/lfk/frontend/commit/aa8196db3a9ff1bcd2b5f0ce655957bfa4e310ab)
+- 🚀RELEASE v0.8.2 [`fb0c071`](https://git.odit.services/lfk/frontend/commit/fb0c0718e405312f239bc3829b3d9c203d246458)
 
 #### [0.8.1](https://git.odit.services/lfk/frontend/compare/0.8.0...0.8.1)
 

Dockerfile

@@ -1,18 +1,14 @@
 FROM node:15.5.1-alpine3.12
 WORKDIR /app
-RUN npm i -g pnpm
 COPY package.json ./
-RUN pnpm i
+RUN yarn
-COPY package.json *.config.js workbox-config.js template-copy.js index.template.html s-config.template.js ./
+COPY package.json *.config.js index.html ./
 COPY src ./src
 COPY public ./public
-RUN pnpm run build
+RUN yarn build
 # final image
 FROM alpine
-COPY --from=0 /app/build /app
+COPY --from=0 /app/dist /app
-RUN rm -rf /app/build/_dist_/components
-RUN rm -rf /app/build/_dist_/locales
-RUN rm -rf /app/build-manifest.json
 FROM fholzer/nginx-brotli:v1.19.1
 COPY --from=1 /app /usr/share/nginx/html
 COPY ./nginx.conf /etc/nginx/nginx.conf

README.md

@@ -0,0 +1,22 @@
+# @odit/lfk-frontend
+
+## ✒️ Overview
+This is an API client for [https://git.odit.services/lfk/backend](@lfk/backend)
+- WebApp built with [Svelte](https://svelte.dev), [WindiCSS](https://windicss.org/) (to compile [TailwindCSS](https://tailwindcss.com/)) and [Vite](https://vitejs.dev).
+
+This application is intended for use by admin users/ members only.
+
+## 🚀 Getting Started
+```
+yarn
+```
+## Development
+```
+yarn dev
+/
+yarn dev --open
+```
+## Build
+```
+yarn build
+```

env.sample.js

@@ -1,7 +0,0 @@
-const config = {
-	baseurl: 'https://dev.lauf-fuer-kaya.de',
-	documentserver_key: 'NqZSYTy5AFQ7MppbLW5moqpTk7u7YrNUHKYhKYuThnnya2WpCOIU694hIZT1FzYe',
-	fallback_username: 'admin',
-	fallback_password: '72fpTzsev4xUu78QPs2FCbwZ3',
-	prefersHashRouting: true
-};

index.html

@@ -1,23 +1,22 @@
-<!DOCTYPE html>
+<!DOCTYPE html>
-<html lang="en">
+<html lang="en">
-
+
-<head>
+<head>
-  <meta charset="utf-8" />
+  <meta charset="utf-8" />
-  <link rel="icon" href="/favicon.png" />
+  <link rel="icon" href="/favicon.png" />
-  <link rel="manifest" href="/manifest.webmanifest">
+  <link rel="manifest" href="/manifest.webmanifest">
-  <link rel="apple-touch-icon" href="/lfk-logo.png">
+  <link rel="apple-touch-icon" href="/lfk-logo.png">
-  <meta name="theme-color" content="#FFFFFF">
+  <meta name="theme-color" content="#FFFFFF">
-  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
-  <meta name="description" content="Lauf Für Kaya! - Admin" />
+  <meta name="description" content="Lauf Für Kaya! - Admin" />
-  <title>Lauf für Kaya! - Admin</title>
+  <title>Lauf für Kaya! - Admin</title>
-  __TAILWIND_INSERT__
+</head>
-</head>
+
-
+<body>
-<body>
+  <span style="display: none;visibility: hidden;" id="buildinfo">RELEASE_INFO-0.8.4-RELEASE_INFO</span>
-  <span style="display: none;visibility: hidden;" id="buildinfo">RELEASE_INFO-0.8.2-RELEASE_INFO</span>
+  <noscript>You need to enable JavaScript to run this app.</noscript>
-  <noscript>You need to enable JavaScript to run this app.</noscript>
+  <script src="/env.js"></script>
-  <script src="/env.js"></script>
+  <script type="module" src="/src/main.js"></script>
-  <script defer type="module" src="/_dist_/index.js"></script>
+</body>
-</body>
+
-
 </html>

nginx.conf

@@ -6,6 +6,15 @@ http {
     server {
         error_page 404 /index.html;
         root /usr/share/nginx/html;
+        location = /index.html {
+            add_header Cache-Control 'no-store';
+        }
+        location = / {
+            add_header Cache-Control 'no-store';
+        }
+        location = /env.js {
+            add_header Cache-Control 'no-store';
+        }
         location / {
             try_files $uri $uri/ /index.html;
         }

package.json

@@ -1,45 +1,40 @@
 {
 	"name": "@odit/lfk-frontend",
-	"version": "0.8.2",
+	"version": "0.8.4",
 	"scripts": {
 		"i18n-order": "node order.js",
-		"dev:all": "yarn prebuild && snowpack dev",
+		"dev": "vite",
-		"dev": "cross-env NODE_ENV_ODIT=development_fast node template-copy.js && yarn build:sw && snowpack dev",
+		"build": "vite build",
-		"build": "yarn prebuild && snowpack build",
-		"prebuild": "cross-env NODE_ENV_ODIT=production node template-copy.js && yarn build:sw",
-		"build:sw": "workbox generateSW workbox-config.js",
 		"release": "release-it",
 		"licenses:export": "license-exporter --json -o public"
 	},
 	"license": "CC-BY-NC-SA-4.0",
-	"dependencies": {
-		"@odit/lfk-client-js": "0.6.4",
-		"csvtojson": "^2.0.10",
-		"gridjs": "3.3.0",
-		"localforage": "1.9.0",
-		"marked": "^2.0.1",
-		"svelte-focus-trap": "1.0.1",
-		"svelte-i18n": "3.3.7",
-		"svelte-select": "^3.17.0",
-		"tailwindcss": "2.0.3",
-		"tinro": "0.6.1",
-		"toastify-js": "1.9.3",
-		"validator": "13.5.2",
-		"xlsx": "^0.16.9"
-	},
 	"devDependencies": {
-		"@odit/license-exporter": "^0.0.11",
+		"check-password-strength": "2.0.2",
-		"@snowpack/plugin-svelte": "3.5.2",
+		"@odit/lfk-client-js": "0.10.1",
-		"auto-changelog": "^2.2.1",
+		"@odit/license-exporter": "0.0.11",
+		"@sveltejs/vite-plugin-svelte": "1.0.0-next.5",
+		"@types/html-minifier": "4.0.0",
+		"auto-changelog": "2.2.1",
 		"autoprefixer": "10.2.5",
-		"cross-env": "^7.0.3",
+		"csvtojson": "2.0.10",
-		"postcss": "8.2.8",
+		"gridjs": "3.4.0",
-		"postcss-load-config": "3.0.1",
+		"html-minifier": "4.0.0",
-		"release-it": "^14.4.1",
+		"localforage": "1.9.0",
-		"snowpack": "3.0.13",
+		"marked": "2.0.1",
-		"svelte": "3.35.0",
+		"release-it": "14.5.1",
-		"svelte-preprocess": "4.6.9",
+		"svelte": "3.37.0",
-		"workbox-cli": "6.1.2"
+		"svelte-focus-trap": "1.2.0",
+		"svelte-i18n": "3.3.9",
+		"svelte-preprocess": "4.7.0",
+		"svelte-select": "3.17.0",
+		"tailwindcss": "2.0.4",
+		"tinro": "0.6.1",
+		"toastify-js": "1.10.0",
+		"validator": "13.5.2",
+		"vite": "2.1.5",
+		"vite-plugin-windicss": "0.12.2",
+		"xlsx": "0.16.9"
 	},
 	"release-it": {
 		"git": {
@@ -55,7 +50,7 @@
 			"publish": false
 		},
 		"hooks": {
-			"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node versionbuilder.js  && git add index.template.html && node order.js  && git add src/locales"
+			"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node versionbuilder.js  && git add index.html && node order.js  && git add src/locales"
 		}
 	}
 }

public/env.sample.js

@@ -1,6 +1,8 @@
 const config = {
 	baseurl: 'http://localhost:4010',
-	documentserver_key: 'NqZSYTy5AFQ7MppbLW5moqpTk7u7YrNUHKYhKYuThnnya2WpCOIU694hIZT1FzYe'
+	documentserver_key: 'NqZSYTy5AFQ7MppbLW5moqpTk7u7YrNUHKYhKYuThnnya2WpCOIU694hIZT1FzYe',
 	// optional
+	default_username: 'demo',
+	default_password: 'demo',
 	prefersHashRouting: true
 };

public/imprint_en.md

@@ -1 +0,0 @@
-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.

s-config.template.js

@@ -1,6 +0,0 @@
-const sveltePreprocess = require('svelte-preprocess');
-const preprocess = sveltePreprocess(__insert__);
-
-module.exports = {
-	preprocess
-};

snowpack.config.js

@@ -1,26 +0,0 @@
-/** @type {import("snowpack").SnowpackUserConfig } */
-module.exports = {
-	mount: {
-		public: '/',
-		src: '/_dist_'
-	},
-	plugins: [ '@snowpack/plugin-svelte' ],
-	routes: [
-		/* Enable an SPA Fallback in development: */
-		{ match: 'routes', src: '.*', dest: '/index.html' }
-	],
-	packageOptions: {
-		/* ... */
-		sourceMap: false
-	},
-	devOptions: {
-		/* ... */
-	},
-	buildOptions: {
-		/* ... */
-	},
-	alias: {
-		/* ... */
-	},
-	optimize: { bundle: true, minify: true }
-};

src/App.svelte

@@ -1,5 +1,4 @@
 <script>
-  import "./TailwindStyles.svelte";
   import "toastify-js/src/toastify.css";
   import "gridjs/dist/theme/mermaid.css";
   import { Route, router } from "tinro";
@@ -53,7 +52,6 @@
   import { OpenAPI } from "@odit/lfk-client-js";
   import UserDetail from "./components/users/UserDetail.svelte";
   OpenAPI.BASE = config.baseurl;
-  import { register as registerSW } from "./swmodule";
   import TeamDetail from "./components/teams/TeamDetail.svelte";
   import UserPermissions from "./components/users/UserPermissions.svelte";
   import GroupPermissions from "./components/groups/GroupPermissions.svelte";
@@ -69,13 +67,12 @@
   import Donations from "./components/donations/Donations.svelte";
   import DonationDetail from "./components/donations/DonationDetail.svelte";
   import GroupDetail from "./components/groups/GroupDetail.svelte";
-  import ScanStationsOverview from "./components/scanstations/ScanStationsOverview.svelte";
   import ScanStations from "./components/scanstations/ScanStations.svelte";
   import ScanStationDetail from "./components/scanstations/ScanStationDetail.svelte";
   import Scans from "./components/scans/Scans.svelte";
-import ScanDetail from "./components/scans/ScanDetail.svelte";
+  import ScanDetail from "./components/scans/ScanDetail.svelte";
+  import Cards from "./components/cards/Cards.svelte";
   store.init();
-  registerSW();
 </script>
 
 <Route>
@@ -185,6 +182,14 @@ import ScanDetail from "./components/scans/ScanDetail.svelte";
             <DonationDetail {params} />
           </Route>
         </Route>
+        <Route path="/cards/*">
+          <Route path="/">
+            <Cards />
+          </Route>
+          <!-- <Route path="/:scanid" let:params>
+            <ScanDetail {params} />
+          </Route> -->
+        </Route>
         <Route path="/scans/*">
           <Route path="/">
             <Scans />

src/TailwindStyles.svelte

@@ -1,6 +0,0 @@
-<style global>
-  /*! @import */
-  @tailwind base;
-  @tailwind components;
-  @tailwind utilities;
-</style>

src/components/auth/ForgotPassword.svelte

@@ -9,7 +9,7 @@
   let usersEmail = "";
   function reset() {
     if (isEmail(usersEmail)) {
-      AuthService.authControllerGetResetToken({ email: usersEmail })
+      AuthService.authControllerGetResetToken("de", { email: usersEmail })
         .then((resp) => {
           Toastify({
             text: $_("mail-validation-in-progress"),

src/components/auth/Login.svelte

@@ -5,10 +5,11 @@
   store.init();
   import { OpenAPI, AuthService } from "@odit/lfk-client-js";
   import Footer from "../general/Footer.svelte";
+  import isEmail from "validator/es/lib/isEmail";
   import Toastify from "toastify-js";
   // ------
-  let username = "demo";
+  let username = config.default_username || "";
-  let password = "demo";
+  let password = config.default_password || "";
   let is_blocked_by_autologin = false;
   let last_loginclick_processed = true;
 
@@ -36,10 +37,19 @@
         text: $_("login_is_checked"),
         duration: 500,
       }).showToast();
-      AuthService.authControllerLogin({
+      let postdata = {};
-        username,
+      if (isEmail(username)) {
-        password,
+        postdata = {
-      })
+          email: username,
+          password,
+        };
+      } else {
+        postdata = {
+          username,
+          password,
+        };
+      }
+      AuthService.authControllerLogin(postdata)
         .then(async (result) => {
           await localForage.setItem("logindata", result);
           OpenAPI.TOKEN = result.access_token;

src/components/auth/PasswordStrength.svelte

@@ -0,0 +1,52 @@
+<script context="module">
+    import { passwordStrength } from "check-password-strength";
+    export function password_strong_enough(password_change) {
+        let strength = passwordStrength(password_change);
+        return (
+            strength?.contains.includes("lowercase") &&
+            strength?.contains.includes("uppercase") &&
+            strength?.contains.includes("number") &&
+            strength?.length > 9
+        );
+    }
+    export function password_strong_enough_and_equal(
+        password_change,
+        password_confirm
+    ) {
+        return (
+            password_strong_enough(password_change) &&
+            password_change === password_confirm
+        );
+    }
+</script>
+
+<script>
+    import { getLocaleFromNavigator, _ } from "svelte-i18n";
+    import { passwordStrength as Strength } from "check-password-strength";
+    export let password_change;
+    export let password_confirm;
+
+    $: strength = Strength(password_change);
+    $: passwords_match =
+        !password_confirm || password_confirm === password_change;
+</script>
+
+<div class="ml-4">
+    <ul class="list-disc font-medium tracking-wide text-red-500 text-xs">
+        {#if !strength.contains.includes('lowercase')}
+            <li>{$_('must-contain-a-lowercase-letter')}</li>
+        {/if}
+        {#if !strength.contains.includes('uppercase')}
+            <li>{$_('must-contain-a-uppercase-letter')}</li>
+        {/if}
+        {#if !strength.contains.includes('number')}
+            <li>{$_('must-contain-a-number')}</li>
+        {/if}
+        {#if !(strength.length > 9)}
+            <li>{$_('must-be-at-least-10-characters-long')}</li>
+        {/if}
+        {#if !(passwords_match == true)}
+            <li>{$_('passwords-dont-match')}</li>
+        {/if}
+    </ul>
+</div>

src/components/auth/ResetPassword.svelte

@@ -1,38 +1,43 @@
 <script>
-  import {  AuthService } from "@odit/lfk-client-js";
+  import { AuthService } from "@odit/lfk-client-js";
   import { _ } from "svelte-i18n";
   import Toastify from "toastify-js";
   import "toastify-js/src/toastify.css";
+  import PasswordStrength, {
+    password_strong_enough,
+  } from "../auth/PasswordStrength.svelte";
   let state = "reset_in_progress";
   let password = "";
   export let params;
   function set_new_password() {
-      if(password.trim() !== ""){
+    if (password.trim() !== "") {
-        Toastify({
+      Toastify({
-          text: $_('password-reset-in-progress'),
+        text: $_("password-reset-in-progress"),
-          duration: 3500,
+        duration: 3500,
-        }).showToast();
+      }).showToast();
-        AuthService.authControllerResetPassword(atob(params.resetkey),{ password })
+      AuthService.authControllerResetPassword(atob(params.resetkey), {
+        password,
+      })
         .then((resp) => {
           Toastify({
-            text: $_('password-reset-successful'),
+            text: $_("password-reset-successful"),
             duration: 3500,
           }).showToast();
-          state="reset_success";
+          state = "reset_success";
         })
         .catch((err) => {
-          state="reset_error";
+          state = "reset_error";
         });
-      } else {
+    } else {
       Toastify({
-        text: $_('please-provide-a-password'),
+        text: $_("please-provide-a-password"),
         duration: 3500,
       }).showToast();
     }
   }
 </script>
 
-{#if state==="reset_success"}
+{#if state === 'reset_success'}
   <div class="min-h-screen flex items-center justify-center bg-gray-100">
     <div class="max-w-md w-full py-12 px-6">
       <img style="height:10rem;" class="mx-auto" src="/lfk-logo.png" alt="" />
@@ -56,31 +61,31 @@
       </div>
     </div>
   </div>
-{:else if state==="reset_error"}
+{:else if state === 'reset_error'}
-<div class="min-h-screen flex items-center justify-center bg-gray-100">
+  <div class="min-h-screen flex items-center justify-center bg-gray-100">
-  <div class="max-w-md w-full py-12 px-6">
+    <div class="max-w-md w-full py-12 px-6">
-    <img style="height:10rem;" class="mx-auto" src="/lfk-logo.png" alt="" />
+      <img style="height:10rem;" class="mx-auto" src="/lfk-logo.png" alt="" />
-    <p class="mt-6 text-lg text-center font-bold text-gray-900">
+      <p class="mt-6 text-lg text-center font-bold text-gray-900">
-      {$_('application_name')}
+        {$_('application_name')}
-    </p>
+      </p>
-    <p class="mt-2 mb-2 text-sm text-center text-gray-900 font-bold">
+      <p class="mt-2 mb-2 text-sm text-center text-gray-900 font-bold">
-      {$_('password-reset-failed')}
+        {$_('password-reset-failed')}
-    </p>
+      </p>
-    <p class="mt-2 mb-2 text-sm text-center text-gray-900">
+      <p class="mt-2 mb-2 text-sm text-center text-gray-900">
-      {$_('please-request-a-new-reset-mail')}
+        {$_('please-request-a-new-reset-mail')}
-    </p>
+      </p>
-    <div class="mt-6">
       <div class="mt-6">
-        <a
+        <div class="mt-6">
-          href="/forgot_password/"
+          <a
-          class="text-center relative block w-full py-2 px-3 border border-transparent rounded-md text-white font-semibold bg-gray-800 hover:bg-gray-700 focus:bg-gray-900 focus:outline-none focus:shadow-outline sm:text-sm">
+            href="/forgot_password/"
-          {$_('request-a-new-reset-mail')}
+            class="text-center relative block w-full py-2 px-3 border border-transparent rounded-md text-white font-semibold bg-gray-800 hover:bg-gray-700 focus:bg-gray-900 focus:outline-none focus:shadow-outline sm:text-sm">
-        </a>
+            {$_('request-a-new-reset-mail')}
+          </a>
+        </div>
       </div>
     </div>
   </div>
-</div>
+{:else if state === 'reset_in_progress'}
-{:else if state==="reset_in_progress"}
   <div class="min-h-screen flex items-center justify-center bg-gray-100">
     <div class="max-w-md w-full py-12 px-6">
       <img style="height:10rem;" class="mx-auto" src="/lfk-logo.png" alt="" />
@@ -102,11 +107,14 @@
               placeholder={$_('new-password')}
               bind:value={password} />
           </div>
+          <PasswordStrength bind:password_change={password} />
         </div>
 
         <div class="mt-5">
           <button
             on:click={set_new_password}
+            disabled={!password_strong_enough(password)}
+            class:opacity-50={!password_strong_enough(password)}
             type="submit"
             class="relative block w-full py-2 px-3 border border-transparent rounded-md text-white font-semibold bg-gray-800 hover:bg-gray-700 focus:bg-gray-900 focus:outline-none focus:shadow-outline sm:text-sm">
             <span class="absolute left-0 inset-y pl-3">

src/components/cards/AddCardBulkModal.svelte

@@ -0,0 +1,240 @@
+<script>
+  import { _ } from "svelte-i18n";
+  import { clickOutside } from "../base/outsideclick";
+  import { focusTrap } from "svelte-focus-trap";
+  import { RunnerCardService } from "@odit/lfk-client-js";
+  import Toastify from "toastify-js";
+  export let bulk_modal_open;
+  export let current_cards;
+  function focus(el) {
+    el.focus();
+  }
+  $: card_count = 0;
+  $: is_card_count_valid = card_count > 0;
+  $: processed_last_submit = true;
+  $: createbtnenabled = is_card_count_valid;
+  (() => {
+    document.onkeydown = (e) => {
+      e = e || window.event;
+      if (e.key === "Escape") {
+        bulk_modal_open = false;
+      }
+      if (e.keyCode === 13) {
+        if (createbtnenabled === true) {
+          createbtnenabled = false;
+          submit_with_print();
+        }
+      }
+    };
+  })();
+  function submit_without_print() {
+    if (processed_last_submit === true) {
+      processed_last_submit = false;
+      const toast = Toastify({
+        text: $_("creating-blanco-cards"),
+        duration: -1,
+      }).showToast();
+      RunnerCardService.runnerCardControllerPostBlancoBulk(card_count, false)
+        .then((result) => {
+          bulk_modal_open = false;
+          //
+          Toastify({
+            text: $_("created-blanco-cards"),
+            duration: 500,
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          }).showToast();
+        })
+        .catch((err) => {
+          //
+        })
+        .finally(() => {
+          processed_last_submit = true;
+          //
+          toast.hideToast();
+        });
+    }
+  }
+
+  function submit_with_print() {
+    if (processed_last_submit === true) {
+      processed_last_submit = false;
+      const toast = Toastify({
+        text: $_("creating-blanco-cards"),
+        duration: -1,
+      }).showToast();
+      RunnerCardService.runnerCardControllerPostBlancoBulk(card_count, true)
+        .then((result) => {
+          bulk_modal_open = false;
+          //
+          Toastify({
+            text: $_("created-blanco-cards"),
+            duration: 500,
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          }).showToast();
+          current_cards = current_cards.concat(result);
+          const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+          }).showToast();
+          fetch(
+            `${config.baseurl}/documents/cards?&download=true&key=${config.documentserver_key}`,
+            {
+              method: "POST",
+              headers: {
+                "Content-Type": "application/json",
+              },
+              body: JSON.stringify(result),
+            }
+          )
+            .then((response) => {
+              if (response.status != "200") {
+                toast.hideToast();
+                Toastify({
+                  text: $_("pdf-generation-failed"),
+                  duration: 3500,
+                  backgroundColor:
+                    "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                }).showToast();
+              } else {
+                return response.blob();
+              }
+            })
+            .then((blob) => {
+              const url = window.URL.createObjectURL(blob);
+              let a = document.createElement("a");
+              a.href = url;
+              a.download = "Bulkcards.pdf";
+              document.body.appendChild(a);
+              a.click();
+              a.remove();
+              toast.hideToast();
+              Toastify({
+                text: $_("pdf-successfully-generated"),
+                duration: 3500,
+                backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+              }).showToast();
+            })
+            .catch((err) => {
+              console.error(err);
+            });
+        })
+        .catch((err) => {
+          //
+        })
+        .finally(() => {
+          processed_last_submit = true;
+          //
+          toast.hideToast();
+        });
+    }
+  }
+</script>
+
+{#if bulk_modal_open}
+  <div
+    class="fixed z-10 inset-0 overflow-y-auto"
+    use:focusTrap
+    use:clickOutside
+    on:click_outside={() => {
+      bulk_modal_open = false;
+    }}>
+    <div
+      class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
+      <div class="fixed inset-0 transition-opacity" aria-hidden="true">
+        <div
+          class="absolute inset-0 bg-gray-500 opacity-75"
+          data-id="modal_backdrop" />
+      </div>
+      <span
+        class="hidden sm:inline-block sm:align-middle sm:h-screen"
+        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"
+        role="dialog"
+        aria-modal="true"
+        aria-labelledby="modal-headline">
+        <div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
+          <div class="sm:flex sm:items-start">
+            <div
+              class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w- rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
+              <svg
+                class="h-6 w-6 text-blue-600"
+                fill="currentColor"
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 24 24"
+                width="24"
+                height="24"><path fill="none" d="M0 0h24v24H0z" />
+                <path
+                  fill="currentColor"
+                  d="M22 10v10a1 1 0 01-1 1H3a1 1 0 01-1-1V10h20zm0-2H2V4a1 1 0 011-1h18a1 1 0 011 1v4zm-7 8v2h4v-2h-4z" /></svg>
+            </div>
+            <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
+              <h3 class="text-lg leading-6 font-medium text-gray-900">
+                {$_('create-bulk-blanco-cards')}
+              </h3>
+              <div class="mt-2 mb-6">
+                <p class="text-sm text-gray-500">
+                  {$_('just-enter-how-many-you-want-and-the-system-will-create-them')}
+                </p>
+              </div>
+              <div class="grid grid-cols-6 gap-6">
+                <div class="col-span-6">
+                  <label
+                    for="amount"
+                    class="block text-sm font-medium text-gray-700">{$_('amount')}</label>
+                  <div class="mt-1 flex rounded-md shadow-sm">
+                    <input
+                      autocomplete="off"
+                      class:border-red-500={!is_card_count_valid}
+                      class:focus:border-red-500={!is_card_count_valid}
+                      class:focus:ring-red-500={!is_card_count_valid}
+                      bind:value={card_count}
+                      type="number"
+                      step="1"
+                      name="amount"
+                      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-gray-500 p-2"
+                      placeholder="400" />
+                    <span
+                      class="inline-flex items-center px-3 rounded-r-md border border-gray-300 bg-gray-50 text-gray-500 text-sm">{$_('cards')}</span>
+                  </div>
+                  {#if !is_card_count_valid}
+                    <span
+                      class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
+                      {$_('you-must-create-at-least-one-card-or-cancel')}
+                    </span>
+                  {/if}
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
+          <button
+            disabled={!createbtnenabled}
+            class:opacity-50={!createbtnenabled}
+            on:click={submit_with_print}
+            type="button"
+            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('create-and-generate-pdf')}
+          </button>
+          <button
+            disabled={!createbtnenabled}
+            class:opacity-50={!createbtnenabled}
+            on:click={submit_without_print}
+            type="button"
+            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-400 text-base font-medium text-white hover:bg-gray-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('create-without-pdf')}
+          </button>
+          <button
+            on:click={() => {
+              bulk_modal_open = false;
+            }}
+            type="button"
+            class="mr-auto mt-3 w-full inline-flex 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 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('cancel')}
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+{/if}

src/components/cards/AddCardModal.svelte

@@ -0,0 +1,170 @@
+<script>
+  import { _ } from "svelte-i18n";
+  import { clickOutside } from "../base/outsideclick";
+  import { focusTrap } from "svelte-focus-trap";
+  import {
+    RunnerCardService,
+    RunnerService,
+    ScanService,
+  } from "@odit/lfk-client-js";
+  import Select from "svelte-select";
+  import Toastify from "toastify-js";
+  export let modal_open;
+  export let current_cards;
+  const getRunnerLabel = (option) =>
+    option.firstname + " " + (option.middlename || "") + " " + option.lastname;
+  const filterRunners = (label, filterText, option) =>
+    label.toLowerCase().includes(filterText.toLowerCase()) ||
+    option.value.toString().startsWith(filterText.toLowerCase());
+  function focus(el) {
+    el.focus();
+  }
+  $: runner = 0;
+  $: runners = [];
+  $: enabled = true;
+  $: processed_last_submit = true;
+  RunnerService.runnerControllerGetAll().then((val) => {
+    runners = val.map((r) => {
+      return { label: getRunnerLabel(r), value: r };
+    });
+  });
+  $: createbtnenabled = true;
+  (() => {
+    document.onkeydown = (e) => {
+      e = e || window.event;
+      if (e.key === "Escape") {
+        modal_open = false;
+      }
+      if (e.keyCode === 13) {
+        if (createbtnenabled === true) {
+          createbtnenabled = false;
+          submit();
+        }
+      }
+    };
+  })();
+  function submit() {
+    if (processed_last_submit === true) {
+      processed_last_submit = false;
+      const toast = Toastify({
+        text: $_("adding-card"),
+        duration: -1,
+      }).showToast();
+      let postdata = {
+        runner,
+        enabled,
+      };
+      RunnerCardService.runnerCardControllerPost(postdata)
+        .then((result) => {
+          runner = 0;
+          modal_open = false;
+          //
+          Toastify({
+            text: $_("card-added"),
+            duration: 500,
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          }).showToast();
+          current_cards.push(result);
+          current_cards = current_cards;
+        })
+        .catch((err) => {
+          //
+        })
+        .finally(() => {
+          processed_last_submit = true;
+          //
+          toast.hideToast();
+        });
+    }
+  }
+</script>
+
+{#if modal_open}
+  <div
+    class="fixed z-10 inset-0 overflow-y-auto"
+    use:focusTrap
+    use:clickOutside
+    on:click_outside={() => {
+      modal_open = false;
+    }}>
+    <div
+      class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
+      <div class="fixed inset-0 transition-opacity" aria-hidden="true">
+        <div
+          class="absolute inset-0 bg-gray-500 opacity-75"
+          data-id="modal_backdrop" />
+      </div>
+      <span
+        class="hidden sm:inline-block sm:align-middle sm:h-screen"
+        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-lg sm:w-full"
+        role="dialog"
+        aria-modal="true"
+        aria-labelledby="modal-headline">
+        <div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
+          <div class="sm:flex sm:items-start">
+            <div
+              class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
+              <svg
+                class="h-6 w-6 text-blue-600"
+                fill="currentColor"
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 24 24"
+                width="24"
+                height="24"><path fill="none" d="M0 0h24v24H0z" />
+                <path
+                  fill="currentColor"
+                  d="M22 10v10a1 1 0 01-1 1H3a1 1 0 01-1-1V10h20zm0-2H2V4a1 1 0 011-1h18a1 1 0 011 1v4zm-7 8v2h4v-2h-4z" /></svg>
+            </div>
+            <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
+              <h3 class="text-lg leading-6 font-medium text-gray-900">
+                {$_('create-a-new-card')}
+              </h3>
+              <div class="mt-2 mb-6">
+                <p class="text-sm text-gray-500">
+                  {$_('you-can-provide-a-runner-but-you-dont-have-to')}
+                  {$_('if-you-want-to-create-multiple-blanco-cards-try-the-add-bulk-button')}
+                </p>
+              </div>
+              <div class="grid grid-cols-6 gap-6">
+                <div class="col-span-6">
+                  <label
+                    for="donor"
+                    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 rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
+                    itemFilter={(label, filterText, option) => filterRunners(label, filterText, option)}
+                    items={runners}
+                    showChevron={true}
+                    placeholder={$_('search-for-runner-by-name-or-id')}
+                    noOptionsMessage={$_('no-runners-found')}
+                    on:select={(selectedValue) => (runner = selectedValue.detail.value.id)}
+                    on:clear={() => (runner = null)} />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
+          <button
+            disabled={!createbtnenabled}
+            class:opacity-50={!createbtnenabled}
+            on:click={submit}
+            type="button"
+            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('create')}
+          </button>
+          <button
+            on:click={() => {
+              modal_open = false;
+            }}
+            type="button"
+            class="mt-3 w-full inline-flex 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 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('cancel')}
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+{/if}

src/components/cards/CardDetailModal.svelte

@@ -0,0 +1,186 @@
+<script>
+  import { _ } from "svelte-i18n";
+  import { clickOutside } from "../base/outsideclick";
+  import { focusTrap } from "svelte-focus-trap";
+  import { RunnerCardService, RunnerService } from "@odit/lfk-client-js";
+  import Select from "svelte-select";
+  import Toastify from "toastify-js";
+  export let edit_modal_open;
+  export let current_cards;
+  export let runner = {};
+  export let editable = {};
+  export let original_data = {};
+  const getRunnerLabel = (option) =>
+    option.firstname + " " + (option.middlename || "") + " " + option.lastname;
+  const filterRunners = (label, filterText, option) =>
+    label.toLowerCase().includes(filterText.toLowerCase()) ||
+    option.value.toString().startsWith(filterText.toLowerCase());
+  function focus(el) {
+    el.focus();
+  }
+  $: runners = [];
+  $: enabled = true;
+  $: processed_last_submit = true;
+  RunnerService.runnerControllerGetAll().then((val) => {
+    runners = val.map((r) => {
+      return { label: getRunnerLabel(r), value: r };
+    });
+  });
+  $: createbtnenabled = !(
+    JSON.stringify(editable) === JSON.stringify(original_data)
+  );
+  (() => {
+    document.onkeydown = (e) => {
+      e = e || window.event;
+      if (e.key === "Escape") {
+        edit_modal_open = false;
+      }
+      if (e.keyCode === 13) {
+        if (createbtnenabled === true) {
+          createbtnenabled = false;
+          submit();
+        }
+      }
+    };
+  })();
+  function submit() {
+    if (processed_last_submit === true) {
+      processed_last_submit = false;
+      const toast = Toastify({
+        text: $_("updating-card"),
+        duration: -1,
+      }).showToast();
+      RunnerCardService.runnerCardControllerPut(original_data.id, editable)
+        .then((result) => {
+          let id = original_data.id;
+          runner = {};
+          editable = {};
+          original_data = {};
+          edit_modal_open = false;
+          //
+          Toastify({
+            text: $_("card-updated"),
+            duration: 500,
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          }).showToast();
+          current_cards[current_cards.findIndex((c) => c.id === id)] = result;
+          current_cards = current_cards;
+        })
+        .catch((err) => {
+          //
+        })
+        .finally(() => {
+          processed_last_submit = true;
+          //
+          toast.hideToast();
+        });
+    }
+  }
+</script>
+
+{#if edit_modal_open}
+  <div
+    class="fixed z-10 inset-0 overflow-y-auto"
+    use:focusTrap
+    use:clickOutside
+    on:click_outside={() => {
+      edit_modal_open = false;
+    }}>
+    <div
+      class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
+      <div class="fixed inset-0 transition-opacity" aria-hidden="true">
+        <div
+          class="absolute inset-0 bg-gray-500 opacity-75"
+          data-id="modal_backdrop" />
+      </div>
+      <span
+        class="hidden sm:inline-block sm:align-middle sm:h-screen"
+        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-lg sm:w-full"
+        role="dialog"
+        aria-modal="true"
+        aria-labelledby="modal-headline">
+        <div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
+          <div class="sm:flex sm:items-start">
+            <div
+              class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
+              <svg
+                class="h-6 w-6 text-blue-600"
+                fill="currentColor"
+                xmlns="http://www.w3.org/2000/svg"
+                viewBox="0 0 24 24"
+                width="24"
+                height="24"><path fill="none" d="M0 0h24v24H0z" />
+                <path
+                  fill="currentColor"
+                  d="M22 10v10a1 1 0 01-1 1H3a1 1 0 01-1-1V10h20zm0-2H2V4a1 1 0 011-1h18a1 1 0 011 1v4zm-7 8v2h4v-2h-4z" /></svg>
+            </div>
+            <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
+              <h3 class="text-lg leading-6 font-medium text-gray-900">
+                {$_('edit-a-card')}
+              </h3>
+              <div class="mt-2 mb-6">
+                <p class="text-sm text-gray-500">
+                  {$_('you-can-provide-a-runner-but-you-dont-have-to')}
+                </p>
+              </div>
+              <div class="grid grid-cols-6 gap-6">
+                <div class="col-span-6">
+                  <label
+                    for="runner"
+                    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 rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
+                    itemFilter={(label, filterText, option) => filterRunners(label, filterText, option)}
+                    items={runners}
+                    showChevron={true}
+                    placeholder={$_('search-for-runner-by-name-or-id')}
+                    noOptionsMessage={$_('no-runners-found')}
+                    bind:selectedValue={runner}
+                    on:select={(selectedValue) => (editable.runner = selectedValue.detail.value.id)}
+                    on:clear={() => (editable.runner = null)} />
+                </div>
+                <div class="col-span-6">
+                  <p class="text-gray-500">
+                    <input
+                      id="enabled"
+                      on:change={() => {
+                        editable.enabled = !editable.enabled;
+                      }}
+                      name="enabled"
+                      type="checkbox"
+                      checked={editable.enabled}
+                      class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
+                    {$_('this-card-is')}
+                    {#if editable.enabled}
+                      {$_('enabled')}
+                    {:else}{$_('disabled')}{/if}
+                  </p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
+          <button
+            disabled={!createbtnenabled}
+            class:opacity-50={!createbtnenabled}
+            on:click={submit}
+            type="button"
+            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('save-changes')}
+          </button>
+          <button
+            on:click={() => {
+              edit_modal_open = false;
+            }}
+            type="button"
+            class="mt-3 w-full inline-flex 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 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
+            {$_('cancel')}
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+{/if}

src/components/cards/Cards.svelte

@@ -0,0 +1,40 @@
+<script>
+  import { _ } from "svelte-i18n";
+  import store from "../../store";
+  import AddCardBulkModal from "./AddCardBulkModal.svelte";
+  import AddCardModal from "./AddCardModal.svelte";
+  import CardsOverview from "./CardsOverview.svelte";
+  $: current_cards = [];
+  export let modal_open = false;
+  export let bulk_modal_open = false;
+</script>
+
+<section class="container p-5">
+  <span class="mb-1 text-3xl font-extrabold leading-tight">
+    {$_('cards')}
+    {#if store.state.jwtinfo.userdetails.permissions.includes('CARD:CREATE')}
+      <button
+        on:click={() => {
+          modal_open = true;
+        }}
+        type="button"
+        class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+        {$_('add-card')}
+      </button>
+      <button
+        on:click={() => {
+          bulk_modal_open = true;
+        }}
+        type="button"
+        class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+        {$_('create-bulk-cards')}
+      </button>
+    {/if}
+  </span>
+  <CardsOverview bind:current_cards />
+</section>
+
+{#if store.state.jwtinfo.userdetails.permissions.includes('CARD:CREATE')}
+  <AddCardModal bind:current_cards bind:modal_open />
+  <AddCardBulkModal bind:current_cards bind:bulk_modal_open />
+{/if}

src/components/cards/CardsEmptyState.svelte

@@ -0,0 +1,12 @@
+<script>
+  import { _ } from "svelte-i18n";
+  import cards_empty from "./cards.svg";
+</script>
+
+<div class="text-center items-center justify-center">
+  <p class="mb-16 text-lg text-gray-500">
+    <img class="m-auto" style="height:15rem" src={cards_empty} alt="" />
+    <span class="font-bold">{$_('there-are-no-cards-yet')}</span><br />
+    <span>{$_('add-your-first-card')}</span>
+  </p>
+</div>

src/components/cards/CardsOverview.svelte

@@ -0,0 +1,237 @@
+<script>
+  import { getLocaleFromNavigator, json, _ } from "svelte-i18n";
+  import { RunnerCardService } from "@odit/lfk-client-js";
+  import store from "../../store";
+  import Toastify from "toastify-js";
+  import CardsEmptyState from "./CardsEmptyState.svelte";
+  import CardDetailModal from "./CardDetailModal.svelte";
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
+  export let edit_modal_open = false;
+  export let runner = {};
+  export let editable = {};
+  export let original_data = {};
+  export let current_cards = [];
+  $: searchvalue = "";
+  $: active_deletes = [];
+  $: cards_show = current_cards.some(
+    (r) => r.is_selected === true
+  );
+  $: generate_cards = current_cards.filter((r) => r.is_selected === true);
+  const cards_promise = RunnerCardService.runnerCardControllerGetAll().then(
+    (val) => {
+      current_cards = val;
+    }
+  );
+  function should_display_based_on_id(id) {
+    if (searchvalue.toString().slice(-1) === "*") {
+      return id.toString().startsWith(searchvalue.replace("*", ""));
+    }
+    return id.toString() === searchvalue;
+  }
+  const getRunnerLabel = (option) =>
+    option?.firstname + " " + (option?.middlename || "") + " " + (option?.lastname || "{$_('non-blanko')}");
+  function open_edit_modal(card) {
+    if(card.runner?.id){
+      runner = Object.assign(
+        { runner },
+        { label: getRunnerLabel(card.runner), value: card.runner }
+      );
+      card.runner = card.runner.id;
+    }
+    else{
+      card.runner=null;
+      runner = null
+    }
+    editable = Object.assign(editable, card);
+    original_data = Object.assign(original_data, card);
+    edit_modal_open = true;
+  }
+</script>
+
+{#if store.state.jwtinfo.userdetails.permissions.includes('CARD:UPDATE')}
+  <CardDetailModal
+    bind:current_cards
+    bind:edit_modal_open
+    bind:runner
+    bind:editable
+    bind:original_data />
+{/if}
+
+{#if store.state.jwtinfo.userdetails.permissions.includes('CARD:GET')}
+  {#await cards_promise}
+    <div
+      class="bg-teal-lightest border-t-4 border-teal rounded-b text-teal-darkest px-4 py-3 shadow-md my-2"
+      role="alert">
+      <p class="font-bold">{$_('loading-cards')}</p>
+      <p class="text-sm">{$_('this-might-take-a-moment')}</p>
+    </div>
+  {:then}
+    {#if current_cards.length === 0}
+      <CardsEmptyState />
+    {:else}
+      <input
+        type="search"
+        bind:value={searchvalue}
+        placeholder={$_('datatable.search')}
+        aria-label={$_('datatable.search')}
+        class="gridjs-input gridjs-search-input mb-4" />
+        <div class="h-12">
+          <GenerateRunnerCards
+            bind:cards_show
+            bind:generate_cards />
+        </div>
+      <div
+        class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">
+        <table class="divide-y divide-gray-200 w-full">
+          <thead class="bg-gray-50">
+            <tr>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                <span
+                  on:click={() => {
+                    const newstate = !current_cards.some((r) => r.is_selected === true);
+                    current_cards = current_cards.map((r) => {
+                      r.is_selected = newstate;
+                      return r;
+                    });
+                  }}
+                  class="underline cursor-pointer select-none">{#if current_cards.some((r) => r.is_selected === true)}
+                    {$_('deselect-all')}
+                  {:else}{$_('select-all')}{/if}
+                </span>
+              </th>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                {$_('code')}
+              </th>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                {$_('runner')}
+              </th>
+              <th
+                scope="col"
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                {$_('status')}
+              </th>
+              <th scope="col" class="relative px-6 py-3">
+                <span class="sr-only">{$_('action')}</span>
+              </th>
+            </tr>
+          </thead>
+          <tbody class="divide-y divide-gray-200">
+            {#each current_cards as card}
+              {#if card.code
+                .toLowerCase()
+                .includes(
+                  searchvalue.toLowerCase()
+                ) || card.runner?.firstname
+                  .toLowerCase()
+                  .includes(
+                    searchvalue.toLowerCase()
+                  ) || card.runner?.middlename
+                  .toLowerCase()
+                  .includes(
+                    searchvalue.toLowerCase()
+                  ) || card.runner?.lastname
+                  .toLowerCase()
+                  .includes(
+                    searchvalue.toLowerCase()
+                  ) || should_display_based_on_id(card.id)}
+                <tr data-rowid="card_{card.id}">
+                  <td class="px-6 py-4 whitespace-nowrap">
+                    <input
+                      bind:checked={card.is_selected}
+                      type="checkbox"
+                      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">
+                    <div class="flex items-center">{card.code}</div>
+                  </td>
+                  <td class="px-6 py-4 whitespace-nowrap">
+                    <div class="flex items-center">
+                      {#if card.runner}
+                        <a
+                          href="../runners/{card.runner.id}"
+                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{card.runner.firstname}
+                          {card.runner.middlename || ''}
+                          {card.runner.lastname}</a>
+                      {:else}{$_('non-blanko')}{/if}
+                    </div>
+                  </td>
+                  <td class="px-6 py-4 whitespace-nowrap">
+                    <div class="flex items-center">
+                      {#if card.enabled}
+                        <span
+                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">{$_('enabled')}</span>
+                      {:else}
+                        <span
+                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-red-800">{$_('disabled')}</span>
+                      {/if}
+                    </div>
+                  </td>
+
+                  {#if active_deletes[card.id] === true}
+                    <td
+                      class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
+                      <button
+                        on:click={() => {
+                          active_deletes[card.id] = false;
+                        }}
+                        tabindex="0"
+                        class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">{$_('cancel-delete')}</button>
+                      <button
+                        on:click={() => {
+                          RunnerCardService.runnerCardControllerRemove(card.id, false).then(
+                            (resp) => {
+                              current_cards = current_cards.filter(
+                                (obj) => obj.id !== card.id
+                              );
+                              Toastify({
+                                text: $_('card-deleted'),
+                                duration: 500,
+                                backgroundColor:
+                                  'linear-gradient(to right, #00b09b, #96c93d)',
+                              }).showToast();
+                            }
+                          );
+                        }}
+                        tabindex="0"
+                        class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('confirm-delete')}</button>
+                    </td>
+                  {:else}
+                    <td
+                      class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
+                      <button
+                        on:click={() => {
+                          open_edit_modal(card);
+                        }}
+                        class="text-indigo-600 hover:text-indigo-900">{$_('details')}</button>
+                      {#if store.state.jwtinfo.userdetails.permissions.includes('CARD:DELETE')}
+                        <button
+                          on:click={() => {
+                            active_deletes[card.id] = true;
+                          }}
+                          tabindex="0"
+                          class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('delete')}</button>
+                      {/if}
+                    </td>
+                  {/if}
+                </tr>
+              {/if}
+            {/each}
+          </tbody>
+        </table>
+      </div>
+    {/if}
+  {: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}
+{/if}

src/components/cards/cards.svg

@@ -0,0 +1 @@
+<svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 653.9 247.6"><path d="M272 211l-53 12s-11-2-1-17l4-4 27-14v-2l-6-41-2-16 17-17 4-3 44 41v1l-19 33z" fill="#ffb7b7"/><path d="M253 198l-54 13a6 6 0 01-5-7 16 16 0 012-5 48 48 0 016-9l28-14-4-24-1-12-2-8-2-16 21-19 22 21 22 20-3 5-3 7-17 30-3 6z" fill="#ffb7b7"/><path d="M346 190s-20-1-28-15a24 24 0 01-3-14l-8-17-11-23-30-4-2 1-21 19-7 6-10 9-49 44a37 37 0 01-7 9 50 50 0 01-9 7c-10 5-24 9-44 7L10 248 0 176l89-29 131-86 89 23 41 58z" fill="#ffb7b7"/><path d="M648 0H275a5 5 0 00-5 5v221a5 5 0 005 6h373a5 5 0 006-6V5a5 5 0 00-6-5z" fill="#fff"/><path d="M648 0H275a5 5 0 00-5 5v221a5 5 0 005 6h373a5 5 0 006-6V5a5 5 0 00-6-5zm4 226a4 4 0 01-4 4H275a4 4 0 01-3-4V5a4 4 0 013-3h373a4 4 0 014 3z" fill="#3f3d56"/><path d="M312 30a9 9 0 119-9 9 9 0 01-9 9zm0-17a8 8 0 107 8 8 8 0 00-7-8z" fill="#6c63ff"/><path d="M297 21a8 8 0 016-8 8 8 0 100 16 8 8 0 01-6-8zM349 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM368 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM386 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM415 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM434 130a7 7 0 01-7-7v-20a7 7 0 0113 0v20a7 7 0 01-6 7zM452 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM481 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM499 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM518 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM546 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM565 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7zM583 130a7 7 0 01-7-7v-20a7 7 0 0114 0v20a7 7 0 01-7 7z" fill="#6c63ff"/><path d="M396 208h-99a5 5 0 110-10h99a5 5 0 010 10zM364 188h-35a5 5 0 110-10h35a5 5 0 110 10z" fill="#e6e6e6"/><path fill="#3f3d56" d="M271 46h381v2H271z"/><path opacity=".1" d="M228 203l-1-2 33-15 8-27-12-10 1-1 13 10-8 30-34 15zM196 199l-9 4-17 2a50 50 0 01-9 7l-16-1-26-1 88-74 18 4-29 59z"/><path d="M318 175l-8 1-47 4-29 1-38 18-9 4-70 8 95-81 11 2 20 5 22 5 18 1 24 1 20 1a13 13 0 0112 13c0 7-5 14-21 17z" fill="#ffb7b7"/><path d="M325 170s-7-2-9-9c-2-4-1-9 3-15l1 1c-3 6-4 10-3 14 2 5 9 7 9 7zM197 197l34-16v2l-33 16zM218 135l48-19v2l-41 16 35 6v2l-42-7z" opacity=".1"/></svg>

src/components/dashboard/Dashboard.svelte

@@ -1,308 +1,327 @@
-<script>
+<script>
-  import { _ } from "svelte-i18n";
+  import { _ } from "svelte-i18n";
-  import localForage from "localforage";
+  import localForage from "localforage";
-  import store from "../../store";
+  import store from "../../store";
-  import { router } from "tinro";
+  import { router } from "tinro";
-  import NoComponentLoaded from "../base/NoComponentLoaded.svelte";
+  import NoComponentLoaded from "../base/NoComponentLoaded.svelte";
-  import { AuthService } from "@odit/lfk-client-js";
+  import { AuthService } from "@odit/lfk-client-js";
-  $: navOpen = false;
+  $: navOpen = false;
-  function logout() {
+  function logout() {
-    localForage.clear();
+    localForage.clear();
-    location.replace("/");
+    location.replace("/");
-  }
+  }
-</script>
+</script>
-
+
-<section class="min-h-screen bg-gray-50">
+<section class="min-h-screen bg-gray-50">
-  <nav
+  <nav
-    class:-translate-x-full={!navOpen}
+    class:-translate-x-full={!navOpen}
-    class:translate-x-0={navOpen}
+    class:translate-x-0={navOpen}
-    class="select-none fixed top-0 left-0 z-20 h-full pb-10 overflow-x-hidden overflow-y-auto transition origin-left transform border-r w-60 md:translate-x-0 bg-gray-50">
+    class="select-none fixed top-0 left-0 z-20 h-full pb-10 overflow-x-hidden overflow-y-auto transition origin-left transform border-r w-60 md:translate-x-0 bg-gray-50">
-    <a href="/" class="flex items-center px-4 py-5">
+    <a href="/" class="flex items-center px-4 py-5">
-      <img src="/lfk-logo.png" alt="Logo" class="h-10" />
+      <img src="/lfk-logo.png" alt="Logo" class="h-10" />
-      <h3 class="text-lg">Lauf für Kaya! Admin</h3>
+      <h3 class="text-lg">Lauf für Kaya! Admin</h3>
-    </a>
+    </a>
-    <nav class="text-sm font-medium text-gray-600" aria-label="Main Navigation">
+    <nav class="text-sm font-medium text-gray-600" aria-label="Main Navigation">
-      <a
+      <a
-        class:bg-gray-100={$router.path === '/'}
+        class:bg-gray-100={$router.path === '/'}
-        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-        href="/">
+        href="/">
-        <svg
+        <svg
-          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-          xmlns="http://www.w3.org/2000/svg"
+          xmlns="http://www.w3.org/2000/svg"
-          viewBox="0 0 20 20"
+          viewBox="0 0 20 20"
-          fill="currentColor">
+          fill="currentColor">
-          <path
+          <path
-            d="M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 0 001.414-1.414l-7-7z" />
+            d="M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 0 001.414-1.414l-7-7z" />
-        </svg>
+        </svg>
-        <span>{$_('dashboard-title')}</span>
+        <span>{$_('dashboard-title')}</span>
-      </a>
+      </a>
-      {#if store.state.jwtinfo.userdetails.permissions.includes('ORGANIZATION:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('ORGANIZATION:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path.includes('/orgs/')}
+          class:bg-gray-100={$router.path.includes('/orgs/')}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/orgs/">
+          href="/orgs/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
+            viewBox="0 0 24 24"
-            width="24"
+            width="24"
-            height="24"><path fill="none" d="M0 0h24v24H0z" />
+            height="24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              d="M17 19h2v-8h-6v8h2v-6h2v6zM3 19V4a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v5h2v10h1v2H2v-2h1zm4-8v2h2v-2H7zm0 4v2h2v-2H7zm0-8v2h2V7H7z" /></svg>
+              d="M17 19h2v-8h-6v8h2v-6h2v6zM3 19V4a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v5h2v10h1v2H2v-2h1zm4-8v2h2v-2H7zm0 4v2h2v-2H7zm0-8v2h2V7H7z" /></svg>
-          <span>{$_('orgs')}</span>
+          <span>{$_('orgs')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('USER:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('USER:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/users/'}
+          class:bg-gray-100={$router.path === '/users/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/users/">
+          href="/users/">
-          <svg
+          <svg
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            width="24"
+            width="24"
-            height="24"
+            height="24"
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
+            viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              d="M12 14v8H4a8 8 0 018-8zm0-1a6 6 0 110-12 6 6 0 010 12zm2.6 5.81a3.51 3.51 0 010-1.62l-1-.57 1-1.74 1 .58a3.5 3.5 0 011.4-.82V13.5h2v1.15a3.5 3.5 0 011.4.8l1-.57 1 1.74-1 .57a3.51 3.51 0 010 1.62l1 .57-1 1.74-1-.58a3.5 3.5 0 01-1.4.82v1.14h-2v-1.15a3.5 3.5 0 01-1.4-.8l-1 .57-1-1.74 1-.57zM18 17a1 1 0 100 2 1 1 0 000-2z" /></svg>
+              d="M12 14v8H4a8 8 0 018-8zm0-1a6 6 0 110-12 6 6 0 010 12zm2.6 5.81a3.51 3.51 0 010-1.62l-1-.57 1-1.74 1 .58a3.5 3.5 0 011.4-.82V13.5h2v1.15a3.5 3.5 0 011.4.8l1-.57 1 1.74-1 .57a3.51 3.51 0 010 1.62l1 .57-1 1.74-1-.58a3.5 3.5 0 01-1.4.82v1.14h-2v-1.15a3.5 3.5 0 01-1.4-.8l-1 .57-1-1.74 1-.57zM18 17a1 1 0 100 2 1 1 0 000-2z" /></svg>
-          <span>{$_('users')}</span>
+          <span>{$_('users')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('USERGROUP:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('USERGROUP:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/groups/'}
+          class:bg-gray-100={$router.path === '/groups/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/groups/">
+          href="/groups/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            width="24"
+            width="24"
-            height="24"
+            height="24"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 640 512"><path
+            viewBox="0 0 640 512"><path
-              fill="currentColor"
+              fill="currentColor"
-              d="M610.5 341.3c2.6-14.1 2.6-28.5 0-42.6l25.8-14.9c3-1.7 4.3-5.2 3.3-8.5-6.7-21.6-18.2-41.2-33.2-57.4-2.3-2.5-6-3.1-9-1.4l-25.8 14.9c-10.9-9.3-23.4-16.5-36.9-21.3v-29.8c0-3.4-2.4-6.4-5.7-7.1-22.3-5-45-4.8-66.2 0-3.3.7-5.7 3.7-5.7 7.1v29.8c-13.5 4.8-26 12-36.9 21.3l-25.8-14.9c-2.9-1.7-6.7-1.1-9 1.4-15 16.2-26.5 35.8-33.2 57.4-1 3.3.4 6.8 3.3 8.5l25.8 14.9c-2.6 14.1-2.6 28.5 0 42.6l-25.8 14.9c-3 1.7-4.3 5.2-3.3 8.5 6.7 21.6 18.2 41.1 33.2 57.4 2.3 2.5 6 3.1 9 1.4l25.8-14.9c10.9 9.3 23.4 16.5 36.9 21.3v29.8c0 3.4 2.4 6.4 5.7 7.1 22.3 5 45 4.8 66.2 0 3.3-.7 5.7-3.7 5.7-7.1v-29.8c13.5-4.8 26-12 36.9-21.3l25.8 14.9c2.9 1.7 6.7 1.1 9-1.4 15-16.2 26.5-35.8 33.2-57.4 1-3.3-.4-6.8-3.3-8.5l-25.8-14.9zM496 368.5c-26.8 0-48.5-21.8-48.5-48.5s21.8-48.5 48.5-48.5 48.5 21.8 48.5 48.5-21.7 48.5-48.5 48.5zM96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm224 32c1.9 0 3.7-.5 5.6-.6 8.3-21.7 20.5-42.1 36.3-59.2 7.4-8 17.9-12.6 28.9-12.6 6.9 0 13.7 1.8 19.6 5.3l7.9 4.6c.8-.5 1.6-.9 2.4-1.4 7-14.6 11.2-30.8 11.2-48 0-61.9-50.1-112-112-112S208 82.1 208 144c0 61.9 50.1 112 112 112zm105.2 194.5c-2.3-1.2-4.6-2.6-6.8-3.9-8.2 4.8-15.3 9.8-27.5 9.8-10.9 0-21.4-4.6-28.9-12.6-18.3-19.8-32.3-43.9-40.2-69.6-10.7-34.5 24.9-49.7 25.8-50.3-.1-2.6-.1-5.2 0-7.8l-7.9-4.6c-3.8-2.2-7-5-9.8-8.1-3.3.2-6.5.6-9.8.6-24.6 0-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h255.4c-3.7-6-6.2-12.8-6.2-20.3v-9.2zM173.1 274.6C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
+              d="M610.5 341.3c2.6-14.1 2.6-28.5 0-42.6l25.8-14.9c3-1.7 4.3-5.2 3.3-8.5-6.7-21.6-18.2-41.2-33.2-57.4-2.3-2.5-6-3.1-9-1.4l-25.8 14.9c-10.9-9.3-23.4-16.5-36.9-21.3v-29.8c0-3.4-2.4-6.4-5.7-7.1-22.3-5-45-4.8-66.2 0-3.3.7-5.7 3.7-5.7 7.1v29.8c-13.5 4.8-26 12-36.9 21.3l-25.8-14.9c-2.9-1.7-6.7-1.1-9 1.4-15 16.2-26.5 35.8-33.2 57.4-1 3.3.4 6.8 3.3 8.5l25.8 14.9c-2.6 14.1-2.6 28.5 0 42.6l-25.8 14.9c-3 1.7-4.3 5.2-3.3 8.5 6.7 21.6 18.2 41.1 33.2 57.4 2.3 2.5 6 3.1 9 1.4l25.8-14.9c10.9 9.3 23.4 16.5 36.9 21.3v29.8c0 3.4 2.4 6.4 5.7 7.1 22.3 5 45 4.8 66.2 0 3.3-.7 5.7-3.7 5.7-7.1v-29.8c13.5-4.8 26-12 36.9-21.3l25.8 14.9c2.9 1.7 6.7 1.1 9-1.4 15-16.2 26.5-35.8 33.2-57.4 1-3.3-.4-6.8-3.3-8.5l-25.8-14.9zM496 368.5c-26.8 0-48.5-21.8-48.5-48.5s21.8-48.5 48.5-48.5 48.5 21.8 48.5 48.5-21.7 48.5-48.5 48.5zM96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm224 32c1.9 0 3.7-.5 5.6-.6 8.3-21.7 20.5-42.1 36.3-59.2 7.4-8 17.9-12.6 28.9-12.6 6.9 0 13.7 1.8 19.6 5.3l7.9 4.6c.8-.5 1.6-.9 2.4-1.4 7-14.6 11.2-30.8 11.2-48 0-61.9-50.1-112-112-112S208 82.1 208 144c0 61.9 50.1 112 112 112zm105.2 194.5c-2.3-1.2-4.6-2.6-6.8-3.9-8.2 4.8-15.3 9.8-27.5 9.8-10.9 0-21.4-4.6-28.9-12.6-18.3-19.8-32.3-43.9-40.2-69.6-10.7-34.5 24.9-49.7 25.8-50.3-.1-2.6-.1-5.2 0-7.8l-7.9-4.6c-3.8-2.2-7-5-9.8-8.1-3.3.2-6.5.6-9.8.6-24.6 0-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h255.4c-3.7-6-6.2-12.8-6.2-20.3v-9.2zM173.1 274.6C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
-          <span>{$_('user-groups')}</span>
+          <span>{$_('user-groups')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/runners/'}
+          class:bg-gray-100={$router.path === '/runners/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/runners/">
+          href="/runners/">
-          <svg
+          <svg
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
+            viewBox="0 0 24 24"
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            width="24"
+            width="24"
-            height="24"><path fill="none" d="M0 0h24v24H0z" />
+            height="24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              d="M9.83 8.79L8 9.456V13H6V8.05h.015l5.268-1.918c.244-.093.51-.14.782-.131a2.616 2.616 0 0 1 2.427 1.82c.186.583.356.977.51 1.182A4.992 4.992 0 0 0 19 11v2a6.986 6.986 0 0 1-5.402-2.547l-.581 3.297L15 15.67V23h-2v-5.986l-2.05-1.987-.947 4.298-6.894-1.215.348-1.97 4.924.868L9.83 8.79zM13.5 5.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" /></svg>
+              d="M9.83 8.79L8 9.456V13H6V8.05h.015l5.268-1.918c.244-.093.51-.14.782-.131a2.616 2.616 0 0 1 2.427 1.82c.186.583.356.977.51 1.182A4.992 4.992 0 0 0 19 11v2a6.986 6.986 0 0 1-5.402-2.547l-.581 3.297L15 15.67V23h-2v-5.986l-2.05-1.987-.947 4.298-6.894-1.215.348-1.97 4.924.868L9.83 8.79zM13.5 5.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" /></svg>
-          <span>{$_('runners')}</span>
+          <span>{$_('runners')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/teams/'}
+          class:bg-gray-100={$router.path === '/teams/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/teams/">
+          href="/teams/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            width="24"
+            width="24"
-            height="24"
+            height="24"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 640 512"><path
+            viewBox="0 0 640 512"><path
-              fill="currentColor"
+              fill="currentColor"
-              d="M96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm448 0c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm32 32h-64c-17.6 0-33.5 7.1-45.1 18.6 40.3 22.1 68.9 62 75.1 109.4h66c17.7 0 32-14.3 32-32v-32c0-35.3-28.7-64-64-64zm-256 0c61.9 0 112-50.1 112-112S381.9 32 320 32 208 82.1 208 144s50.1 112 112 112zm76.8 32h-8.3c-20.8 10-43.9 16-68.5 16s-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48v-28.8c0-63.6-51.6-115.2-115.2-115.2zm-223.7-13.4C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
+              d="M96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm448 0c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm32 32h-64c-17.6 0-33.5 7.1-45.1 18.6 40.3 22.1 68.9 62 75.1 109.4h66c17.7 0 32-14.3 32-32v-32c0-35.3-28.7-64-64-64zm-256 0c61.9 0 112-50.1 112-112S381.9 32 320 32 208 82.1 208 144s50.1 112 112 112zm76.8 32h-8.3c-20.8 10-43.9 16-68.5 16s-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48v-28.8c0-63.6-51.6-115.2-115.2-115.2zm-223.7-13.4C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
-          <span>{$_('teams')}</span>
+          <span>{$_('teams')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path.includes('/donors/')}
+          class:bg-gray-100={$router.path.includes('/donors/')}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/donors/">
+          href="/donors/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
+            viewBox="0 0 24 24"
-            width="24"
+            width="24"
-            height="24"><path fill="none" d="M0 0h24v24H0z" />
+            height="24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              d="M9.33 11.5h2.17A4.5 4.5 0 0 1 16 16H8.999L9 17h8v-1a5.578 5.578 0 0 0-.886-3H19a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.761 0-5.1-.59-7-1.625L6 10.071A6.967 6.967 0 0 1 9.33 11.5zM5 19a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v9zM18 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm-7-3a3 3 0 1 1 0 6 3 3 0 0 1 0-6z" /></svg>
+              d="M9.33 11.5h2.17A4.5 4.5 0 0 1 16 16H8.999L9 17h8v-1a5.578 5.578 0 0 0-.886-3H19a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.761 0-5.1-.59-7-1.625L6 10.071A6.967 6.967 0 0 1 9.33 11.5zM5 19a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v9zM18 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm-7-3a3 3 0 1 1 0 6 3 3 0 0 1 0-6z" /></svg>
-          <span>{$_('donors')}</span>
+          <span>{$_('donors')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path.includes('/donations/')}
+          class:bg-gray-100={$router.path.includes('/donations/')}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/donations/">
+          href="/donations/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
+            viewBox="0 0 24 24"
-            width="24"
+            width="24"
-            height="24"><path fill="none" d="M0 0h24v24H0z" />
+            height="24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z" /></svg>
+              d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z" /></svg>
-          <span>{$_('donations')}</span>
+          <span>{$_('donations')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('TRACK:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('TRACK:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/tracks/'}
+          class:bg-gray-100={$router.path === '/tracks/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/tracks/">
+          href="/tracks/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            width="24"
+            width="24"
-            height="24"
+            height="24"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 640 512"><path
+            viewBox="0 0 640 512"><path
-              fill="currentColor"
+              fill="currentColor"
-              d="M635.7 167.2L556.1 31.7c-8.8-15-28.3-20.1-43.5-11.5l-69 39.1L503.3 161c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L416 75l-55.2 31.3 27.9 47.4c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L333.2 122 278 153.3 337.8 255c2.2 3.7.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9l-59.7-101.7-55.2 31.3 27.9 47.4c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9l-27.9-47.5-55.2 31.3 59.7 101.7c2.2 3.7.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L84.9 262.9l-69 39.1C.7 310.7-4.6 329.8 4.2 344.8l79.6 135.6c8.8 15 28.3 20.1 43.5 11.5L624.1 210c15.2-8.6 20.4-27.8 11.6-42.8z" /></svg>
+              d="M635.7 167.2L556.1 31.7c-8.8-15-28.3-20.1-43.5-11.5l-69 39.1L503.3 161c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L416 75l-55.2 31.3 27.9 47.4c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L333.2 122 278 153.3 337.8 255c2.2 3.7.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9l-59.7-101.7-55.2 31.3 27.9 47.4c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9l-27.9-47.5-55.2 31.3 59.7 101.7c2.2 3.7.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L84.9 262.9l-69 39.1C.7 310.7-4.6 329.8 4.2 344.8l79.6 135.6c8.8 15 28.3 20.1 43.5 11.5L624.1 210c15.2-8.6 20.4-27.8 11.6-42.8z" /></svg>
-          <span>{$_('tracks')}</span>
+          <span>{$_('tracks')}</span>
-        </a>
+        </a>
-      {/if}
+      {/if}
-      {#if store.state.jwtinfo.userdetails.permissions.includes('SCAN:GET')}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('CARD:GET')}
-        <a
+        <a
-          class:bg-gray-100={$router.path === '/scans/'}
+          class:bg-gray-100={$router.path === '/cards/'}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          href="/scans/">
+          href="/cards/">
-          <svg
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            fill="currentColor"
+            fill="currentColor"
-            width="24"
+            width="24"
-            height="24"
+            height="24"
-            xmlns="http://www.w3.org/2000/svg"
+            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
+            viewBox="0 0 24 24">
-            <path
+            <path fill="none" d="M0 0h24v24H0z" />
-              fill="currentColor"
+            <path
-              d="M2 4h2v16H2V4zm4 0h1v16H6V4zm2 0h2v16H8V4zm3 0h2v16h-2V4zm3 0h2v16h-2V4zm3 0h1v16h-1V4zm2 0h3v16h-3V4z" /></svg>
+              fill="currentColor"
-          <span>Scans</span>
+              d="M22 10v10a1 1 0 01-1 1H3a1 1 0 01-1-1V10h20zm0-2H2V4a1 1 0 011-1h18a1 1 0 011 1v4zm-7 8v2h4v-2h-4z" /></svg>
-        </a>
+          <span>{$_('cards')}</span>
-      {/if}
+        </a>
-      {#if store.state.jwtinfo.userdetails.permissions.includes('CONTACT:GET')}
+      {/if}
-        <a
+      {#if store.state.jwtinfo.userdetails.permissions.includes('SCAN:GET')}
-          class:bg-gray-100={$router.path === '/contacts/'}
+        <a
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class:bg-gray-100={$router.path === '/scans/'}
-          href="/contacts/">
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          <svg
+          href="/scans/">
-            fill="currentColor"
+          <svg
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            xmlns="http://www.w3.org/2000/svg"
+            fill="currentColor"
-            viewBox="0 0 24 24"
+            width="24"
-            width="24"
+            height="24"
-            height="24"><path fill="none" d="M0 0h24v24H0z" />
+            xmlns="http://www.w3.org/2000/svg"
-            <path
+            viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
-              d="M2 22a8 8 0 1 1 16 0H2zm8-9c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6zm10 4h4v2h-4v-2zm-3-5h7v2h-7v-2zm2-5h5v2h-5V7z" /></svg>
+            <path
-          <span>{$_('contacts')}</span>
+              fill="currentColor"
-        </a>
+              d="M2 4h2v16H2V4zm4 0h1v16H6V4zm2 0h2v16H8V4zm3 0h2v16h-2V4zm3 0h2v16h-2V4zm3 0h1v16h-1V4zm2 0h3v16h-3V4z" /></svg>
-      {/if}
+          <span>Scans</span>
-      {#if store.state.jwtinfo.userdetails.permissions.includes('STATION:GET')}
+        </a>
-        <a
+      {/if}
-          class:bg-gray-100={$router.path === '/scanstations/'}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('CONTACT:GET')}
-          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+        <a
-          href="/scanstations/">
+          class:bg-gray-100={$router.path === '/contacts/'}
-          <svg
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+          href="/contacts/">
-            fill="currentColor"
+          <svg
-            width="24"
+            fill="currentColor"
-            height="24"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-            viewBox="0 0 24 24"
+            xmlns="http://www.w3.org/2000/svg"
-            xmlns="http://www.w3.org/2000/svg"><path
+            viewBox="0 0 24 24"
-              fill="none"
+            width="24"
-              d="M0 0h24v24H0z" />
+            height="24"><path fill="none" d="M0 0h24v24H0z" />
-            <path
+            <path
-              fill="currentColor"
+              d="M2 22a8 8 0 1 1 16 0H2zm8-9c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6zm10 4h4v2h-4v-2zm-3-5h7v2h-7v-2zm2-5h5v2h-5V7z" /></svg>
-              d="M4 5v11h16V5H4zM2 4a1 1 0 011-1h18a1 1 0 011 1v14H2V4zM1 19h22v2H1v-2z" /></svg>
+          <span>{$_('contacts')}</span>
-          <span>{$_('scanstations')}</span>
+        </a>
-        </a>
+      {/if}
-      {/if}
+      {#if store.state.jwtinfo.userdetails.permissions.includes('STATION:GET')}
-      <a
+        <a
-        class:bg-gray-100={$router.path === '/settings/'}
+          class:bg-gray-100={$router.path === '/scanstations/'}
-        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+          class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-        href="/settings/">
+          href="/scanstations/">
-        <svg
+          <svg
-          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+            class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-          xmlns="http://www.w3.org/2000/svg"
+            fill="currentColor"
-          viewBox="0 0 20 20"
+            width="24"
-          fill="currentColor">
+            height="24"
-          <path
+            viewBox="0 0 24 24"
-            fill-rule="evenodd"
+            xmlns="http://www.w3.org/2000/svg"><path
-            d="M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z"
+              fill="none"
-            clip-rule="evenodd" />
+              d="M0 0h24v24H0z" />
-        </svg>
+            <path
-        <span>{$_('settings')}</span>
+              fill="currentColor"
-      </a>
+              d="M4 5v11h16V5H4zM2 4a1 1 0 011-1h18a1 1 0 011 1v14H2V4zM1 19h22v2H1v-2z" /></svg>
-      <a
+          <span>{$_('scanstations')}</span>
-        class:bg-gray-100={$router.path === '/about/'}
+        </a>
-        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+      {/if}
-        href="/about/">
+      <a
-        <svg
+        class:bg-gray-100={$router.path === '/settings/'}
-          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-          xmlns="http://www.w3.org/2000/svg"
+        href="/settings/">
-          fill="none"
+        <svg
-          stroke="currentColor"
+          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-          stroke-width="2"
+          xmlns="http://www.w3.org/2000/svg"
-          stroke-linecap="round"
+          viewBox="0 0 20 20"
-          stroke-linejoin="round"
+          fill="currentColor">
-          viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" />
+          <path
-          <path d="M12 16v-4M12 8h.01" /></svg>
+            fill-rule="evenodd"
-        <span>{$_('about')}</span>
+            d="M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z"
-      </a>
+            clip-rule="evenodd" />
-      <span
+        </svg>
-        tabindex="0"
+        <span>{$_('settings')}</span>
-        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
+      </a>
-        on:click={() => {
+      <a
-          AuthService.authControllerLogout();
+        class:bg-gray-100={$router.path === '/about/'}
-          logout();
+        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-        }}>
+        href="/about/">
-        <svg
+        <svg
-          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
+          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-          fill="currentColor"
+          xmlns="http://www.w3.org/2000/svg"
-          width="24"
+          fill="none"
-          height="24"
+          stroke="currentColor"
-          xmlns="http://www.w3.org/2000/svg"
+          stroke-width="2"
-          viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
+          stroke-linecap="round"
-          <path
+          stroke-linejoin="round"
-            d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2a9.985 9.985 0 0 1 8 4h-2.71a8 8 0 1 0 .001 12h2.71A9.985 9.985 0 0 1 12 22zm7-6v-3h-8v-2h8V8l5 4-5 4z" /></svg>
+          viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" />
-        <span>{$_('logout')}</span>
+          <path d="M12 16v-4M12 8h.01" /></svg>
-      </span>
+        <span>{$_('about')}</span>
-    </nav>
+      </a>
-  </nav>
+      <span
-  <div class="ml-0 transition md:ml-60">
+        tabindex="0"
-    <header
+        class="flex items-center px-4 py-3 transition cursor-pointer group hover:bg-gray-100 hover:text-gray-900"
-      on:click={() => {
+        on:click={() => {
-        navOpen = true;
+          AuthService.authControllerLogout();
-      }}
+          logout();
-      class="flex items-center justify-between w-full px-4 bg-white border-b h-14 md:hidden">
+        }}>
-      <button class="block btn btn-light md:hidden">
+        <svg
-        <span class="sr-only">Menu</span><svg
+          class="flex-shrink-0 w-5 h-5 mr-2 text-gray-400 transition group-hover:text-gray-600"
-          class="w-4 h-4"
+          fill="currentColor"
-          xmlns="http://www.w3.org/2000/svg"
+          width="24"
-          viewBox="0 0 20 20"
+          height="24"
-          fill="currentcolor"><path
+          xmlns="http://www.w3.org/2000/svg"
-            fill-rule="evenodd"
+          viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
-            d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4A1 1 0 013 5zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
+          <path
-            clip-rule="evenodd" /></svg></button>
+            d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2a9.985 9.985 0 0 1 8 4h-2.71a8 8 0 1 0 .001 12h2.71A9.985 9.985 0 0 1 12 22zm7-6v-3h-8v-2h8V8l5 4-5 4z" /></svg>
-    </header>
+        <span>{$_('logout')}</span>
-    <slot>
+      </span>
-      <NoComponentLoaded />
+    </nav>
-    </slot>
+  </nav>
-  </div>
+  <div class="ml-0 transition md:ml-60">
-  <div
+    <header
-    on:click={() => {
+      on:click={() => {
-      navOpen = false;
+        navOpen = true;
-    }}
+      }}
-    class:hidden={!navOpen}
+      class="flex items-center justify-between w-full px-4 bg-white border-b h-14 md:hidden">
-    class="fixed inset-0 z-10 w-screen h-screen bg-black bg-opacity-25 md:hidden" />
+      <button class="block btn btn-light md:hidden">
-</section>
+        <span class="sr-only">Menu</span><svg
+          class="w-4 h-4"
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 20 20"
+          fill="currentcolor"><path
+            fill-rule="evenodd"
+            d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4A1 1 0 013 5zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
+            clip-rule="evenodd" /></svg></button>
+    </header>
+    <slot>
+      <NoComponentLoaded />
+    </slot>
+  </div>
+  <div
+    on:click={() => {
+      navOpen = false;
+    }}
+    class:hidden={!navOpen}
+    class="fixed inset-0 z-10 w-screen h-screen bg-black bg-opacity-25 md:hidden" />
+</section>

src/components/dashboard/MainDashContent.svelte

@@ -16,8 +16,7 @@
       -
       {$_('dashboard-greeting')},
       <span
-        class="text-blue-500">{store.state.jwtinfo.userdetails.firstname}</span>
+        class="text-blue-500">{store.state.jwtinfo.userdetails.firstname} {store.state.jwtinfo.userdetails.lastname}</span></span>
-      👋</span>
   </h1>
   <StatCards />
 </div>

src/components/donations/DonationsEmptyState.svelte

@@ -5,8 +5,8 @@
 
 <div class="text-center items-center justify-center">
   <p class="mb-16 text-lg text-gray-500">
-    <img class="w-full" style="height:15rem" src={donations_empty} alt="" />
+    <img class="m-auto" style="height:15rem" src={donations_empty} alt="" />
-    <span class="font-bold">There are no donations yet</span><br />
+    <span class="font-bold">{$_('there-are-no-donations-yet')}</span><br />
-    <span>add your fist donation</span>
+    <span>{$_('add-your-fist-donation')}</span>
   </p>
 </div>

src/components/donations/DonationsOverview.svelte

@@ -74,20 +74,12 @@
                 .toLowerCase()
                 .includes(
                   searchvalue.toLowerCase()
-                ) || donation.donor.middlename
+                ) ||  donation.donor.lastname
-                  .toLowerCase()
-                  .includes(
-                    searchvalue.toLowerCase()
-                  ) || donation.donor.lastname
                   .toLowerCase()
                   .includes(
                     searchvalue.toLowerCase()
                   ) || donation.runner?.firstname
                   .toLowerCase()
-                  .includes(
-                    searchvalue.toLowerCase()
-                  ) || donation.runner?.middlename
-                  .toLowerCase()
                   .includes(
                     searchvalue.toLowerCase()
                   ) || donation.runner?.lastname

src/components/donors/DonorsOverview.svelte

@@ -88,11 +88,7 @@
                 .toLowerCase()
                 .includes(
                   searchvalue.toLowerCase()
-                ) || donor.middlename
+                ) ||  donor.lastname
-                  .toLowerCase()
-                  .includes(
-                    searchvalue.toLowerCase()
-                  ) || donor.lastname
                   .toLowerCase()
                   .includes(
                     searchvalue.toLowerCase()

src/components/general/About.svelte

@@ -189,34 +189,5 @@
         </li>
       </ul>
     </div>
-    <h2 class="mt-4 text-4xl font-display font-semibold md:text-5xl">
-      {$_('faq')}
-    </h2>
-    <div class="mt-6 border-t-2 border-gray-100 pt-10">
-      <dl class="md:grid md:grid-cols-2 md:gap-8">
-        <div>
-          <div>
-            <dt class="text-lg leading-6 font-medium">Q</dt>
-            <dd class="mt-2">
-              <p class="text-base text-gray-500">A</p>
-            </dd>
-          </div>
-        </div>
-        <div class="mt-12 sm:mt-0">
-          <div id="team-pricing">
-            <dt class="text-lg leading-6 font-medium">Q</dt>
-            <dd class="mt-2">
-              <p class="text-base text-gray-500">A</p>
-            </dd>
-          </div>
-          <div class="mt-12">
-            <dt class="text-lg leading-6 font-medium">Q</dt>
-            <dd class="mt-2">
-              <p class="text-base text-gray-500">A</p>
-            </dd>
-          </div>
-        </div>
-      </dl>
-    </div>
   </div>
 </div>

src/components/general/Footer.svelte

@@ -32,6 +32,8 @@
       target="_blank"
       rel="noopener, noreferrer"
       href="https://git.odit.services/lfk/frontend/src/tag/{releaseinfo}">{releaseinfo}</a>
+      -
+    <a class="underline" href="https://docs.lauf-fuer-kaya.de" target="_blank">{$_('documentation')}</a>
     -
     <a class="underline" href="/privacy">{$_('privacy')}</a>
     -

src/components/general/Imprint.svelte

@@ -6,13 +6,15 @@
   let html = "";
   async function load() {
     let md = await fetch("/imprint_" + getLocaleFromNavigator() + ".md");
-    if((await md.text()).includes("<meta")){
+    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 = marked(await md.text());
+    html = marked(text);
   }
   const promise = load();
 </script>

src/components/general/Privacy.svelte

@@ -6,13 +6,15 @@
   let html = "";
   async function load() {
     let md = await fetch("/privacy_" + getLocaleFromNavigator() + ".md");
-    if((await md.text()).includes("<meta")){
+    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 = marked(await md.text());
+    html = marked(text);
   }
   const promise = load();
 </script>

src/components/orgs/OrgDetail.svelte

@@ -10,6 +10,9 @@
   import ImportRunnerModal from "../runners/ImportRunnerModal.svelte";
   import PromiseError from "../base/PromiseError.svelte";
   import Select from "svelte-select";
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
+  import { tick } from "svelte";
   $: delete_triggered = false;
   $: address_valid_or_none =
     (isAddress1Valid && iszipcodevalid && iscityvalid) ||
@@ -18,6 +21,9 @@
   let original = "";
   let original_object = {};
   let contacts = [];
+  let valueCopy = null;
+  let areaDom;
+  let copied = false;
   export let params;
   $: editable = {};
   $: contact = {};
@@ -26,7 +32,10 @@
   $: isAddress1Valid = editable.address?.address1?.trim().length !== 0;
   $: iszipcodevalid = editable.address?.postalcode?.trim().length !== 0;
   $: iscityvalid = editable.address?.city?.trim().length !== 0;
-  $: sponsoring_contracts_download_open = false;
+  $: sponsoring_contracts_show = true;
+  $: cards_show = true;
+  $: generate_orgs = [original_object];
+  $: registrationLink = `${config.baseurl}/selfservice/register/${editable.registrationKey}`;
   const getContactLabel = (option) =>
     option.firstname + " " + (option.middlename || "") + " " + option.lastname;
   const promise = RunnerOrganizationService.runnerOrganizationControllerGetOne(
@@ -60,14 +69,6 @@
   });
   let modal_open = false;
   let delete_org = {};
-  document.addEventListener("click", function (e) {
-    if (
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
-    ) {
-      sponsoring_contracts_download_open = false;
-    }
-  });
   function deleteOrganization() {
     RunnerOrganizationService.runnerOrganizationControllerRemove(
       original_object.id,
@@ -102,6 +103,7 @@
         postdata
       )
         .then((resp) => {
+          editable.registrationKey = resp.registrationKey;
           original_object = Object.assign({}, editable);
           original = JSON.stringify(original_object);
           Toastify({
@@ -114,58 +116,46 @@
     } else {
     }
   }
-  export let import_modal_open = false;
+  async function copy() {
-  async function generateSponsoringContract(locale) {
+    if(!editable.registrationKey){
-    sponsoring_contracts_download_open = false;
+      Toastify({
-    const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
+        text: $_('you-have-to-save-your-changes-to-generate-a-link'),
-      original_object.id
+        duration: 500,
-    );
+        backgroundColor:
-    const toast = Toastify({
+          "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
-      text: $_("generating-pdf"),
+      }).showToast();
-      duration: -1,
+      return;
-    }).showToast();
+    }
-    fetch(
+    valueCopy = registrationLink;
-      `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+    await tick();
-      {
+    areaDom.focus();
-        method: "POST",
+    areaDom.select();
-        headers: {
+    try {
-          "Content-Type": "application/json",
+      const successful = document.execCommand("copy");
-        },
+      if (!successful) {
-        body: JSON.stringify(runners),
+        throw new Error();
       }
-    )
+      Toastify({
-      .then((response) => {
+        text: $_("copied-link-to-clipboard"),
-        if (response.status != "200") {
+        duration: 500,
-          toast.hideToast();
+        backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-          Toastify({
+      }).showToast();
-            text: $_("pdf-generation-failed"),
+      copied = true;
-            duration: 3500,
+    } catch (err) {
-            backgroundColor:
+      Toastify({
-              "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+        text: $_("error-whyile-copying-to-clipboard"),
-          }).showToast();
+        duration: 500,
-        } else {
+        backgroundColor:
-          return response.blob();
+          "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
-        }
+      }).showToast();
-      })
+    }
-      .then((blob) => {
+    // we can notifi by event or storage about copy status
-        const url = window.URL.createObjectURL(blob);
+    valueCopy = null;
-        let a = document.createElement("a");
-        a.href = url;
-        a.download = "Sponsorings_" + original_object.name + ".pdf";
-        document.body.appendChild(a);
-        a.click();
-        a.remove();
-        toast.hideToast();
-        Toastify({
-          text: $_("pdf-successfully-generated"),
-          duration: 3500,
-          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-        }).showToast();
-      })
-      .catch((err) => {});
   }
+  export let import_modal_open = false;
 </script>
 
+{#if valueCopy != null}<textarea bind:this={areaDom}>{valueCopy}</textarea>{/if}
 <ImportRunnerModal
   on:cancelDelete={(event) => {
     import_modal_open = false;
@@ -182,64 +172,10 @@
     <div class="mb-8 text-3xl font-extrabold leading-tight">
       {original_object.name}
       <span data-id="org_actions_${editable.id}">
-        <div id="sponsoring:dropdown" class="relative inline-block">
+        <GenerateSponsoringContracts
-          <div>
+          bind:sponsoring_contracts_show
-            <button
+          bind:generate_orgs />
-              on:click={() => {
+        <GenerateRunnerCards bind:cards_show bind:generate_orgs />
-                sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
-              }}
-              type="button"
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
-              id="options-menu"
-              aria-haspopup="true"
-              aria-expanded="true">
-              {$_('generate-sponsoring-contracts')}
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                width="24"
-                height="24"
-                viewBox="0 0 24 24"
-                class="-mr-1 ml-2 h-5 w-5"><path
-                  fill="none"
-                  d="M0 0h24v24H0z" />
-                <path
-                  fill="currentColor"
-                  d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
-            </button>
-          </div>
-          {#if sponsoring_contracts_download_open}
-            <div
-              class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
-              id="sponsoring:dropdown:menu">
-              <div
-                class="py-1"
-                role="menu"
-                aria-orientation="vertical"
-                aria-labelledby="options-menu">
-                <span
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
-                <button
-                  on:click={() => {
-                    generateSponsoringContract('de');
-                  }}
-                  type="submit"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                  role="menuitem">
-                  {$_('german')}
-                </button>
-                <button
-                  on:click={() => {
-                    generateSponsoringContract('en');
-                  }}
-                  type="submit"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                  role="menuitem">
-                  {$_('english')}
-                </button>
-              </div>
-            </div>
-          {/if}
-        </div>
         {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:IMPORT')}
           <button
             on:click={() => {
@@ -382,99 +318,151 @@
         on:select={(selectedValue) => (editable.contact = selectedValue.detail.value)}
         on:clear={() => (editable.contact = null)} />
     </div>
-    <!--  -->
+    <div>
-    <div class="flex items-start mt-2">
+      <div class="flex items-start mt-2">
-      <div class="flex items-center h-5">
+        <div class="flex items-center h-5">
-        <input
+          <input
-          bind:checked={editable.address_checked}
+            bind:checked={editable.registrationEnabled}
-          id="comments"
+            id="comments"
-          name="comments"
+            name="comments"
-          type="checkbox"
+            type="checkbox"
-          class="focus:ring-indigo-500 h-4 w-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">
+          <label
+            for="comments"
+            class="font-medium text-gray-700">{$_('selfservice-registration')}</label>
+        </div>
       </div>
-      <div class="ml-3 text-sm">
+      <div>
-        <label
+        {#if editable.registrationEnabled}
-          for="comments"
+          <div class="text-sm w-full">
-          class="font-medium text-gray-700">{$_('address')}</label>
+            <div on:click={copy} class="inline-flex w-full">
+              <p
+                name="token"
+                class="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-gray-500 p-2">
+                {#if editable.registrationKey}
+                {registrationLink}
+                {:else}
+                {$_('you-have-to-save-your-changes-to-generate-a-link')}
+                {/if}
+              </p>
+              <div
+                class="bg-gray-200 border-gray-300 border-t border-b border-r text-black rounded-r-md sm:text-sm p-2 mt-1 cursor-pointer">
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  viewBox="0 0 24 24"
+                  width="24"
+                  height="24"><path fill="none" d="M0 0h24v24H0z" />
+                  <path
+                    fill="currentColor"
+                    d="M7 4V2h10v2h3l1 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V5l1-1h3zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z" /></svg>
+              </div>
+            </div>
+            {#if editable.registrationKey}
+            <p class="text-gray-500 text-xs">
+              {$_('click-to-copy-the-link-into-your-clipboard')}
+            </p>
+            {/if}
+          </div>
+        {/if}
+        <!--  -->
+        <div>
+          <div class="flex items-start mt-2">
+            <div class="flex items-center h-5">
+              <input
+                bind:checked={editable.address_checked}
+                id="comments"
+                name="comments"
+                type="checkbox"
+                class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
+            </div>
+            <div class="ml-3 text-sm">
+              <label
+                for="comments"
+                class="font-medium text-gray-700">{$_('address')}</label>
+            </div>
+          </div>
+        </div>
+        {#if editable.address_checked === true}
+          <div class="col-span-6">
+            <label
+              for="address1"
+              class="block text-sm font-medium text-gray-700">{$_('address')}</label>
+            <input
+              autocomplete="off"
+              placeholder="Address"
+              class:border-red-500={!isAddress1Valid}
+              class:focus:border-red-500={!isAddress1Valid}
+              class:focus:ring-red-500={!isAddress1Valid}
+              bind:value={editable.address.address1}
+              type="text"
+              name="address1"
+              class="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-gray-500 rounded-md p-2" />
+            {#if !isAddress1Valid}
+              <span
+                class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
+                {$_('address-is-required')}
+              </span>
+            {/if}
+          </div>
+          <div class="col-span-6">
+            <label
+              for="address2"
+              class="block text-sm font-medium text-gray-700">{$_('apartment-suite-etc')}</label>
+            <input
+              autocomplete="off"
+              placeholder={$_('apartment-suite-etc')}
+              bind:value={editable.address.address2}
+              type="text"
+              name="address2"
+              class="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-gray-500 rounded-md p-2" />
+          </div>
+          <div class="col-span-6">
+            <label
+              for="zipcode"
+              class="block text-sm font-medium text-gray-700">{$_('zip-postal-code')}</label>
+            <input
+              autocomplete="off"
+              placeholder={$_('zip-postal-code')}
+              class:border-red-500={!iszipcodevalid}
+              class:focus:border-red-500={!iszipcodevalid}
+              class:focus:ring-red-500={!iszipcodevalid}
+              bind:value={editable.address.postalcode}
+              type="text"
+              name="zipcode"
+              class="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-gray-500 rounded-md p-2" />
+            {#if !iszipcodevalid}
+              <span
+                class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
+                {$_('valid-zipcode-postal-code-is-required')}
+              </span>
+            {/if}
+          </div>
+          <div class="col-span-6">
+            <label
+              for="city"
+              class="block text-sm font-medium text-gray-700">{$_('city')}</label>
+            <input
+              autocomplete="off"
+              placeholder={$_('city')}
+              class:border-red-500={!iscityvalid}
+              class:focus:border-red-500={!iscityvalid}
+              class:focus:ring-red-500={!iscityvalid}
+              bind:value={editable.address.city}
+              type="text"
+              name="city"
+              class="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-gray-500 rounded-md p-2" />
+            {#if !iscityvalid}
+              <span
+                class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
+                {$_('valid-city-is-required')}
+              </span>
+            {/if}
+          </div>
+        {/if}
       </div>
     </div>
-    {#if editable.address_checked === true}
-      <div class="col-span-6">
-        <label
-          for="address1"
-          class="block text-sm font-medium text-gray-700">{$_('address')}</label>
-        <input
-          autocomplete="off"
-          placeholder="Address"
-          class:border-red-500={!isAddress1Valid}
-          class:focus:border-red-500={!isAddress1Valid}
-          class:focus:ring-red-500={!isAddress1Valid}
-          bind:value={editable.address.address1}
-          type="text"
-          name="address1"
-          class="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-gray-500 rounded-md p-2" />
-        {#if !isAddress1Valid}
-          <span
-            class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-            {$_('address-is-required')}
-          </span>
-        {/if}
-      </div>
-      <div class="col-span-6">
-        <label
-          for="address2"
-          class="block text-sm font-medium text-gray-700">{$_('apartment-suite-etc')}</label>
-        <input
-          autocomplete="off"
-          placeholder={$_('apartment-suite-etc')}
-          bind:value={editable.address.address2}
-          type="text"
-          name="address2"
-          class="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-gray-500 rounded-md p-2" />
-      </div>
-      <div class="col-span-6">
-        <label
-          for="zipcode"
-          class="block text-sm font-medium text-gray-700">{$_('zip-postal-code')}</label>
-        <input
-          autocomplete="off"
-          placeholder={$_('zip-postal-code')}
-          class:border-red-500={!iszipcodevalid}
-          class:focus:border-red-500={!iszipcodevalid}
-          class:focus:ring-red-500={!iszipcodevalid}
-          bind:value={editable.address.postalcode}
-          type="text"
-          name="zipcode"
-          class="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-gray-500 rounded-md p-2" />
-        {#if !iszipcodevalid}
-          <span
-            class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-            {$_('valid-zipcode-postal-code-is-required')}
-          </span>
-        {/if}
-      </div>
-      <div class="col-span-6">
-        <label
-          for="city"
-          class="block text-sm font-medium text-gray-700">{$_('city')}</label>
-        <input
-          autocomplete="off"
-          placeholder={$_('city')}
-          class:border-red-500={!iscityvalid}
-          class:focus:border-red-500={!iscityvalid}
-          class:focus:ring-red-500={!iscityvalid}
-          bind:value={editable.address.city}
-          type="text"
-          name="city"
-          class="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-gray-500 rounded-md p-2" />
-        {#if !iscityvalid}
-          <span
-            class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-            {$_('valid-city-is-required')}
-          </span>
-        {/if}
-      </div>
-    {/if}
   </section>
 {:else}
   {#await promise}

src/components/orgs/OrgOverview.svelte

@@ -1,5 +1,6 @@
 <script>
   import { getLocaleFromNavigator, _ } from "svelte-i18n";
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
   let modal_open = false;
   let delete_org = {};
   import { RunnerOrganizationService } from "@odit/lfk-client-js";
@@ -7,9 +8,12 @@
   import OrgsEmptyState from "./OrgsEmptyState.svelte";
   import Toastify from "toastify-js";
   import ConfirmOrgDeletion from "./ConfirmOrgDeletion.svelte";
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
   $: searchvalue = "";
   $: active_deletes = [];
-  $: sponsoring_contracts_download_open = false;
+  $: sponsoring_contracts_show = current_organizations.some((r) => r.is_selected === true);
+  $: cards_show = current_organizations.some((r) => r.is_selected === true);
+  $: generate_orgs = current_organizations.filter((r) => r.is_selected === true);
   export let current_organizations = [];
 
   const promise = RunnerOrganizationService.runnerOrganizationControllerGetAll().then(
@@ -17,72 +21,6 @@
       current_organizations = val;
     }
   );
-
-  document.addEventListener("click", function (e) {
-    if (
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
-    ) {
-      sponsoring_contracts_download_open = false;
-    }
-  });
-
-  async function generateSponsoringContract(locale) {
-    sponsoring_contracts_download_open = false;
-    const orgs = current_organizations.filter((r) => r.is_selected === true);
-    const toast = Toastify({
-      text: $_("generating-pdfs"),
-      duration: -1,
-    }).showToast();
-    let count = 0;
-    for await (const o of orgs) {
-      const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
-        o.id
-      );
-      fetch(
-        `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
-        {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json",
-          },
-          body: JSON.stringify(runners),
-        }
-      )
-        .then((response) => {
-          if (response.status != "200") {
-            toast.hideToast();
-            Toastify({
-              text: $_("pdf-generation-failed"),
-              duration: 3500,
-              backgroundColor:
-                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
-            }).showToast();
-          } else {
-            return response.blob();
-          }
-        })
-        .then((blob) => {
-          count++;
-          const url = window.URL.createObjectURL(blob);
-          let a = document.createElement("a");
-          a.href = url;
-          a.download = "Sponsorings_" + o.name + ".pdf";
-          document.body.appendChild(a);
-          a.click();
-          a.remove();
-          if (count === orgs.length) {
-            toast.hideToast();
-            Toastify({
-              text: $_("pdfs-successfully-generated"),
-              duration: 3500,
-              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-            }).showToast();
-          }
-        })
-        .catch((err) => {});
-    }
-  }
 </script>
 
 <ConfirmOrgDeletion
@@ -111,56 +49,12 @@
         aria-label={$_('datatable.search')}
         class="gridjs-input gridjs-search-input mb-4" />
       <div class="h-12">
-        {#if current_organizations.some((r) => r.is_selected === true)}
+        <GenerateSponsoringContracts
-        <div id="sponsoring:dropdown" class="relative inline-block">
+            bind:sponsoring_contracts_show
-          <div>
+            bind:generate_orgs />
-            <button
+        <GenerateRunnerCards
-              on:click={() => {
+            bind:cards_show
-                sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+            bind:generate_orgs />
-              }}
-              type="button"
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
-              id="options-menu"
-              aria-haspopup="true"
-              aria-expanded="true">
-              {$_('generate-sponsoring-contracts')}
-              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" class="-mr-1 ml-2 h-5 w-5"><path fill="none" d="M0 0h24v24H0z"/><path fill="currentColor" d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z"/></svg>
-            </button>
-          </div>
-          {#if sponsoring_contracts_download_open}
-            <div
-              class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
-              id="sponsoring:dropdown:menu">
-              <div
-                class="py-1"
-                role="menu"
-                aria-orientation="vertical"
-                aria-labelledby="options-menu">
-                <span
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
-                <button
-                  on:click={() => {
-                    generateSponsoringContract('de');
-                  }}
-                  type="submit"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                  role="menuitem">
-                  {$_('german')}
-                </button>
-                <button
-                  on:click={() => {
-                    generateSponsoringContract('en');
-                  }}
-                  type="submit"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                  role="menuitem">
-                  {$_('english')}
-                </button>
-              </div>
-            </div>
-          {/if}
-        </div>
-        {/if}
       </div>
       <div
         class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">

src/components/pdf_generation/GenerateRunnerCards.svelte

@@ -0,0 +1,339 @@
+<script>
+    import { getLocaleFromNavigator, _ } from "svelte-i18n";
+    import {
+        RunnerCardService,
+        RunnerOrganizationService,
+        RunnerTeamService,
+    } from "@odit/lfk-client-js";
+    import Toastify from "toastify-js";
+    export let cards_show = false;
+    export let generate_cards = [];
+    export let generate_runners = [];
+    export let generate_orgs = [];
+    export let generate_teams = [];
+    $: cards_dropdown_open = false;
+    document.addEventListener("click", function (e) {
+        if (
+            e.target.parentNode?.parentNode?.id != "cards:dropdown" &&
+            e.target.parentNode?.parentNode?.id != "cards:dropdown:menu"
+        ) {
+            cards_dropdown_open = false;
+        }
+    });
+
+    function generateRunnerCards(locale) {
+        cards_dropdown_open = false;
+
+        if (generate_orgs.length > 0) {
+            generateOrgCards(locale);
+        } else if (generate_teams.length > 0) {
+            generateTeamCards(locale);
+        } else if (generate_runners.length > 0) {
+            generateRunnersCards(locale);
+        } else {
+            generateCards(locale);
+        }
+    }
+
+    function generateCards(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        fetch(
+            `${config.baseurl}/documents/cards?locale=${locale}&download=true&key=${config.documentserver_key}`,
+            {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(generate_cards),
+            }
+        )
+            .then((response) => {
+                if (response.status != "200") {
+                    toast.hideToast();
+                    Toastify({
+                        text: $_("pdf-generation-failed"),
+                        duration: 3500,
+                        backgroundColor:
+                            "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                    }).showToast();
+                } else {
+                    return response.blob();
+                }
+            })
+            .then((blob) => {
+                const url = window.URL.createObjectURL(blob);
+                let a = document.createElement("a");
+                a.href = url;
+                a.download = "Runnercards.pdf";
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+                toast.hideToast();
+                Toastify({
+                    text: $_("pdf-successfully-generated"),
+                    duration: 3500,
+                    backgroundColor:
+                        "linear-gradient(to right, #00b09b, #96c93d)",
+                }).showToast();
+            })
+            .catch((err) => {
+                console.error(err);
+            });
+    }
+
+    async function generateRunnersCards(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        const current_cards = await RunnerCardService.runnerCardControllerGetAll();
+        let cards = [];
+        for (let runner of generate_runners) {
+            let card = current_cards.find((c) => c.runner?.id == runner.id);
+            if (!card) {
+                card = await RunnerCardService.runnerCardControllerPost({
+                    runner: runner.id,
+                });
+            }
+            cards.push(card);
+        }
+        fetch(
+            `${config.baseurl}/documents/cards?locale=${locale}&download=true&key=${config.documentserver_key}`,
+            {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(cards),
+            }
+        )
+            .then((response) => {
+                if (response.status != "200") {
+                    toast.hideToast();
+                    Toastify({
+                        text: $_("pdf-generation-failed"),
+                        duration: 3500,
+                        backgroundColor:
+                            "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                    }).showToast();
+                } else {
+                    return response.blob();
+                }
+            })
+            .then((blob) => {
+                const url = window.URL.createObjectURL(blob);
+                let a = document.createElement("a");
+                a.href = url;
+                a.download = "Runnercards.pdf";
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+                toast.hideToast();
+                Toastify({
+                    text: $_("pdf-successfully-generated"),
+                    duration: 3500,
+                    backgroundColor:
+                        "linear-gradient(to right, #00b09b, #96c93d)",
+                }).showToast();
+            })
+            .catch((err) => {});
+    }
+
+    async function generateTeamCards(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdfs"),
+            duration: -1,
+        }).showToast();
+        let count = 0;
+        const current_cards = await RunnerCardService.runnerCardControllerGetAll();
+        for (const t of generate_teams) {
+            const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
+                t.id
+            );
+            let cards = [];
+            for (let runner of runners) {
+                let card = current_cards.find((c) => c.runner?.id == runner.id);
+                if (!card) {
+                    card = await RunnerCardService.runnerCardControllerPost({
+                        runner: runner.id,
+                    });
+                }
+                cards.push(card);
+            }
+            fetch(
+                `${config.baseurl}/documents/cards?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(cards),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    count++;
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Sponsorings_" + t.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_teams.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+
+    async function generateOrgCards(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        let count = 0;
+        const current_cards = await RunnerCardService.runnerCardControllerGetAll();
+        for (const o of generate_orgs) {
+            const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
+                o.id
+            );
+            let cards = [];
+            for (let runner of runners) {
+                let card = current_cards.find((c) => c.runner?.id == runner.id);
+                if (!card) {
+                    card = await RunnerCardService.runnerCardControllerPost({
+                        runner: runner.id,
+                    });
+                }
+                cards.push(card);
+            }
+            fetch(
+                `${config.baseurl}/documents/cards?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(cards),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    count++;
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Sponsorings_" + o.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_orgs.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+</script>
+
+{#if cards_show}
+    <div id="cards:dropdown" class="relative inline-block">
+        <div>
+            <button
+                on:click={() => {
+                    cards_dropdown_open = !cards_dropdown_open;
+                }}
+                type="button"
+                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+                id="options-menu"
+                aria-haspopup="true"
+                aria-expanded="true">
+                {$_('generate-runnercards')}
+                <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    width="24"
+                    height="24"
+                    viewBox="0 0 24 24"
+                    class="-mr-1 ml-2 h-5 w-5"><path
+                        fill="none"
+                        d="M0 0h24v24H0z" />
+                    <path
+                        fill="currentColor"
+                        d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+            </button>
+        </div>
+        {#if cards_dropdown_open}
+            <div
+                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                id="cards:dropdown:menu">
+                <div
+                    class="py-1"
+                    role="menu"
+                    aria-orientation="vertical"
+                    aria-labelledby="options-menu">
+                    <span
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+                    <button
+                        on:click={() => {
+                            generateRunnerCards('de');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('german')}
+                    </button>
+                    <button
+                        on:click={() => {
+                            generateRunnerCards('en');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('english')}
+                    </button>
+                </div>
+            </div>
+        {/if}
+    </div>
+{/if}

src/components/pdf_generation/GenerateRunnerCertificates.svelte

@@ -0,0 +1,273 @@
+<script>
+    import { _ } from "svelte-i18n";
+    import {
+        DonationService,
+        RunnerTeamService,
+        RunnerOrganizationService
+    } from "@odit/lfk-client-js";
+    import Toastify from "toastify-js";
+    export let certificates_show = false;
+    export let generate_runners = [];
+    export let generate_orgs = [];
+    export let generate_teams = [];
+    $: certificates_dropdown_open = false;
+    document.addEventListener("click", function (e) {
+        if (
+            e.target.parentNode?.parentNode?.id != "certificates:dropdown" &&
+            e.target.parentNode?.parentNode?.id != "certificates:dropdown:menu"
+        ) {
+            certificates_dropdown_open = false;
+        }
+    });
+
+    function generateCertificates(locale) {
+        certificates_dropdown_open = false;
+
+        if (generate_orgs.length > 0) {
+            generateOrgCertificates(locale);
+        } else if (generate_teams.length > 0) {
+            generateTeamCertificates(locale);
+        } else {
+            generateRunnerCertificates(locale);
+        }
+    }
+
+    async function generateRunnerCertificates(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        const current_donations = await DonationService.donationControllerGetAll();
+        let certificateRunners = [];
+        for (let runner of generate_runners) {
+            runner.distanceDonations = current_donations.find((d) => d.runner?.id == runner.id) || [];
+            certificateRunners.push(runner);
+        }
+        fetch(
+            `${config.baseurl}/documents/certificates?locale=${locale}&download=true&key=${config.documentserver_key}`,
+            {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(certificateRunners),
+            }
+        )
+            .then((response) => {
+                if (response.status != "200") {
+                    toast.hideToast();
+                    Toastify({
+                        text: $_("pdf-generation-failed"),
+                        duration: 3500,
+                        backgroundColor:
+                            "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                    }).showToast();
+                } else {
+                    return response.blob();
+                }
+            })
+            .then((blob) => {
+                const url = window.URL.createObjectURL(blob);
+                let a = document.createElement("a");
+                a.href = url;
+                a.download = "Certificates.pdf";
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+                toast.hideToast();
+                Toastify({
+                    text: $_("pdf-successfully-generated"),
+                    duration: 3500,
+                    backgroundColor:
+                        "linear-gradient(to right, #00b09b, #96c93d)",
+                }).showToast();
+            })
+            .catch((err) => {});
+    }
+
+    async function generateTeamCertificates(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdfs"),
+            duration: -1,
+        }).showToast();
+        let count = 0;
+        const current_donations = await DonationService.donationControllerGetAll();
+        for (const t of generate_teams) {
+            const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
+                t.id
+                );
+            let certificateRunners = [];
+            for (let runner of runners) {
+                runner.distanceDonations = current_donations.find((d) => d.runner?.id == runner.id) || [];
+                certificateRunners.push(runner);
+            }
+            console.log(certificateRunners)
+            fetch(
+                `${config.baseurl}/documents/certificates?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(certificateRunners),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    count++;
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Certificates_" + t.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_teams.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+
+    async function generateOrgCertificates(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        let count = 0;
+        const current_donations = await DonationService.donationControllerGetAll();
+        for (const o of generate_orgs) {
+            const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
+                o.id
+            );
+            let certificateRunners = [];
+            for (let runner of runners) {
+                runner.distanceDonations = current_donations.find((d) => d.runner?.id == runner.id) || [];
+                certificateRunners.push(runner);
+            }
+            fetch(
+                `${config.baseurl}/documents/certificates?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(certificateRunners),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    count++;
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Certificates_" + o.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_orgs.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+</script>
+
+{#if certificates_show}
+    <div id="certificates:dropdown" class="relative inline-block">
+        <div>
+            <button
+                on:click={() => {
+                    certificates_dropdown_open = !certificates_dropdown_open;
+                }}
+                type="button"
+                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+                id="options-menu"
+                aria-haspopup="true"
+                aria-expanded="true">
+                {$_('generate-runner-certificates')}
+                <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    width="24"
+                    height="24"
+                    viewBox="0 0 24 24"
+                    class="-mr-1 ml-2 h-5 w-5"><path
+                        fill="none"
+                        d="M0 0h24v24H0z" />
+                    <path
+                        fill="currentColor"
+                        d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+            </button>
+        </div>
+        {#if certificates_dropdown_open}
+            <div
+                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                id="certificates:dropdown:menu">
+                <div
+                    class="py-1"
+                    role="menu"
+                    aria-orientation="vertical"
+                    aria-labelledby="options-menu">
+                    <span
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+                    <button
+                        on:click={() => {
+                            generateCertificates('de');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('german')}
+                    </button>
+                    <button
+                        on:click={() => {
+                            generateCertificates('en');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('english')}
+                    </button>
+                </div>
+            </div>
+        {/if}
+    </div>
+{/if}

src/components/pdf_generation/GenerateSponsoringContracts.svelte

@@ -0,0 +1,254 @@
+<script>
+    import { getLocaleFromNavigator, _ } from "svelte-i18n";
+    import {
+        RunnerOrganizationService,
+        RunnerTeamService,
+    } from "@odit/lfk-client-js";
+    import Toastify from "toastify-js";
+    export let sponsoring_contracts_show = false;
+    export let generate_runners = [];
+    export let generate_orgs = [];
+    export let generate_teams = [];
+    $: sponsoring_contracts_download_open = false;
+    document.addEventListener("click", function (e) {
+        if (
+            e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
+            e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
+        ) {
+            sponsoring_contracts_download_open = false;
+        }
+    });
+
+    function generateSponsoringContract(locale) {
+        sponsoring_contracts_download_open = false;
+
+        if (generate_orgs.length > 0) {
+            generateOrgContracts(locale);
+        } else if (generate_teams.length > 0) {
+            generateTeamContracts(locale);
+        } else {
+            generateRunnerContracts(locale);
+        }
+    }
+
+    async function generateTeamContracts(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdfs"),
+            duration: -1,
+        }).showToast();
+        let count = 0;
+        for (const t of generate_teams) {
+            count++;
+            const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
+                t.id
+            );
+            fetch(
+                `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(runners),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Sponsorings_" + t.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_teams.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+
+    async function generateOrgContracts(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        for (const o of generate_orgs) {
+            const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
+                o.id
+            );
+            fetch(
+                `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify(runners),
+                }
+            )
+                .then((response) => {
+                    if (response.status != "200") {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdf-generation-failed"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                        }).showToast();
+                    } else {
+                        return response.blob();
+                    }
+                })
+                .then((blob) => {
+                    count++;
+                    const url = window.URL.createObjectURL(blob);
+                    let a = document.createElement("a");
+                    a.href = url;
+                    a.download = "Sponsorings_" + o.name + ".pdf";
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+                    if (count === generate_orgs.length) {
+                        toast.hideToast();
+                        Toastify({
+                            text: $_("pdfs-successfully-generated"),
+                            duration: 3500,
+                            backgroundColor:
+                                "linear-gradient(to right, #00b09b, #96c93d)",
+                        }).showToast();
+                    }
+                })
+                .catch((err) => {});
+        }
+    }
+
+    function generateRunnerContracts(locale) {
+        const toast = Toastify({
+            text: $_("generating-pdf"),
+            duration: -1,
+        }).showToast();
+        fetch(
+            `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+            {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(generate_runners),
+            }
+        )
+            .then((response) => {
+                if (response.status != "200") {
+                    toast.hideToast();
+                    Toastify({
+                        text: $_("pdf-generation-failed"),
+                        duration: 3500,
+                        backgroundColor:
+                            "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+                    }).showToast();
+                } else {
+                    return response.blob();
+                }
+            })
+            .then((blob) => {
+                const url = window.URL.createObjectURL(blob);
+                let a = document.createElement("a");
+                a.href = url;
+                a.download = "Sponsoring.pdf";
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+                toast.hideToast();
+                Toastify({
+                    text: $_("pdf-successfully-generated"),
+                    duration: 3500,
+                    backgroundColor:
+                        "linear-gradient(to right, #00b09b, #96c93d)",
+                }).showToast();
+            })
+            .catch((err) => {
+                console.error(err);
+            });
+    }
+</script>
+
+{#if sponsoring_contracts_show}
+    <div id="sponsoring:dropdown" class="relative inline-block">
+        <div>
+            <button
+                on:click={() => {
+                    sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+                }}
+                type="button"
+                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+                id="options-menu"
+                aria-haspopup="true"
+                aria-expanded="true">
+                {$_('generate-sponsoring-contracts')}
+                <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    width="24"
+                    height="24"
+                    viewBox="0 0 24 24"
+                    class="-mr-1 ml-2 h-5 w-5"><path
+                        fill="none"
+                        d="M0 0h24v24H0z" />
+                    <path
+                        fill="currentColor"
+                        d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+            </button>
+        </div>
+        {#if sponsoring_contracts_download_open}
+            <div
+                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                id="sponsoring:dropdown:menu">
+                <div
+                    class="py-1"
+                    role="menu"
+                    aria-orientation="vertical"
+                    aria-labelledby="options-menu">
+                    <span
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+                    <button
+                        on:click={() => {
+                            generateSponsoringContract('de');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('german')}
+                    </button>
+                    <button
+                        on:click={() => {
+                            generateSponsoringContract('en');
+                        }}
+                        type="submit"
+                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
+                        role="menuitem">
+                        {$_('english')}
+                    </button>
+                </div>
+            </div>
+        {/if}
+    </div>
+{/if}

src/components/runners/ImportRunnerModal.svelte

@@ -19,6 +19,11 @@
   export let current_runners;
   export let import_modal_open;
   $: searchvalue = "";
+  $: importButtonEnabled =
+    recent_processed &&
+    (!(selected_org_or_team == "" || selected_org_or_team == null) ||
+      !(passed_org?.id == null || passed_org?.id == 0) ||
+      !(passed_team?.id == null || passed_team?.id == 0));
   const dispatch = createEventDispatcher();
   function cancelModal() {
     json_output = [];
@@ -44,7 +49,10 @@
     groups = groups.concat(orgs);
     RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
       const teams = val.map((r) => {
-        return { label: `${r.parentGroup.name} > ${r.name}`, value: `TEAM_${r.id}` };
+        return {
+          label: `${r.parentGroup.name} > ${r.name}`,
+          value: `TEAM_${r.id}`,
+        };
       });
       groups = groups.concat(teams);
     });
@@ -120,6 +128,13 @@
           .catch((err) => {
             toast.hideToast();
             recent_processed = true;
+            Toastify({
+              text: $_("error-during-import"),
+              duration: 500,
+              backgroundColor:
+                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+            }).showToast();
+            cancelModal();
           });
       }
       if (opened_from === "TeamDetail") {
@@ -137,6 +152,13 @@
           .catch((err) => {
             toast.hideToast();
             recent_processed = true;
+            Toastify({
+              text: $_("error-during-import"),
+              duration: 500,
+              backgroundColor:
+                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+            }).showToast();
+            cancelModal();
           });
       }
       if (opened_from === "RunnerOverview") {
@@ -160,6 +182,13 @@
             .catch((err) => {
               toast.hideToast();
               recent_processed = true;
+              Toastify({
+                text: $_("error-during-import"),
+                duration: 500,
+                backgroundColor:
+                  "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+              }).showToast();
+              cancelModal();
             });
         }
         if (selected_org_or_team.includes("TEAM_")) {
@@ -182,6 +211,13 @@
             .catch((err) => {
               toast.hideToast();
               recent_processed = true;
+              Toastify({
+                text: $_("error-during-import"),
+                duration: 500,
+                backgroundColor:
+                  "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+              }).showToast();
+              cancelModal();
             });
         }
       }
@@ -195,7 +231,7 @@
     use:focusTrap
     use:clickOutside
     on:click_outside={() => {
-      import_modal_open = false;
+      cancelModal();
     }}>
     <div
       class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
@@ -349,6 +385,8 @@
                   </table>
                 </div>
                 <button
+                  disabled={!importButtonEnabled}
+                  class:opacity-50={!importButtonEnabled}
                   on:click={importAction}
                   type="button"
                   class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">

src/components/runners/RunnerDetail.svelte

@@ -1,398 +1,302 @@
-<script>
+<script>
-  import { getLocaleFromNavigator, _ } from "svelte-i18n";
+  import { getLocaleFromNavigator, _ } from "svelte-i18n";
-  import store from "../../store";
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
-  import {
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
-    RunnerService,
+  import GenerateRunnerCertificates from "../pdf_generation/GenerateRunnerCertificates.svelte";
-    RunnerTeamService,
+  import store from "../../store";
-    RunnerOrganizationService,
+  import {
-  } from "@odit/lfk-client-js";
+    RunnerService,
-  import Toastify from "toastify-js";
+    RunnerTeamService,
-  import PromiseError from "../base/PromiseError.svelte";
+    RunnerOrganizationService,
-  import isEmail from "validator/es/lib/isEmail";
+  } from "@odit/lfk-client-js";
-  import Select from "svelte-select";
+  import Toastify from "toastify-js";
-  let data_loaded = false;
+  import PromiseError from "../base/PromiseError.svelte";
-  export let params;
+  import isEmail from "validator/es/lib/isEmail";
-  const runner_promise = RunnerService.runnerControllerGetOne(params.runnerid);
+  import Select from "svelte-select";
-  $: delete_triggered = false;
+  let data_loaded = false;
-  $: sponsoring_contracts_download_open = false;
+  export let params;
-  $: original_data_pdf = {};
+  const runner_promise = RunnerService.runnerControllerGetOne(params.runnerid);
-  $: original_data = {};
+  $: delete_triggered = false;
-  $: editable = {};
+  $: original_data_pdf = {};
-  $: group = {}
+  $: original_data = {};
-  $: changes_performed = !(JSON.stringify(original_data) == JSON.stringify(editable));
+  $: editable = {};
-  $: isEmailValid =
+  $: group = {};
-    (editable.email || "") === "" ||
+  $: changes_performed = !(
-    (editable.email && isEmail(editable.email || ""));
+    JSON.stringify(original_data) == JSON.stringify(editable)
-  $: isFirstnameValid = editable.firstname !== "";
+  );
-  $: isLastnameValid = editable.lastname !== "";
+  $: isEmailValid =
-  $: save_enabled =
+    (editable.email || "") === "" ||
-    changes_performed &&
+    (editable.email && isEmail(editable.email || ""));
-    isFirstnameValid &&
+  $: isFirstnameValid = editable.firstname !== "";
-    isLastnameValid &&
+  $: isLastnameValid = editable.lastname !== "";
-    isEmailValid &&
+  $: save_enabled =
-    editable.group != null;
+    changes_performed &&
-  runner_promise.then((data) => {
+    isFirstnameValid &&
-    data_loaded = true;
+    isLastnameValid &&
-    original_data_pdf = Object.assign(original_data_pdf, data);
+    isEmailValid &&
-    data.group = data.group.id;
+    editable.group != null;
-    original_data = Object.assign(original_data, data);
+  $: sponsoring_contracts_show = true;
-    editable = Object.assign(editable, original_data);
+  $: cards_show = true;
-
+  $: certificates_show = true;
-    RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
+  $: generate_runners = [original_data_pdf];
-      const orgs = val.map((r) => {
+  runner_promise.then((data) => {
-        return { label: r.name, value: r };
+    data_loaded = true;
-      });
+    original_data_pdf = Object.assign(original_data_pdf, data);
-      groups = groups.concat(orgs);
+    data.group = data.group.id;
-      RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
+    original_data = Object.assign(original_data, data);
-        const teams = val.map((r) => {
+    editable = Object.assign(editable, original_data);
-          return { label: `${r.parentGroup.name} > ${r.name}`, value: r };
+
-        });
+    RunnerOrganizationService.runnerOrganizationControllerGetAll().then(
-        groups = groups.concat(teams);
+      (val) => {
-        group = groups.find(g => g.value.id == editable.group)
+        const orgs = val.map((r) => {
-      });
+          return { label: r.name, value: r };
-    });
+        });
-  });
+        groups = groups.concat(orgs);
-  document.addEventListener("click", function (e) {
+        RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
-    if (
+          const teams = val.map((r) => {
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
+            return { label: `${r.parentGroup.name} > ${r.name}`, value: r };
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
+          });
-    ) {
+          groups = groups.concat(teams);
-      sponsoring_contracts_download_open = false;
+          group = groups.find((g) => g.value.id == editable.group);
-    }
+        });
-  });
+      }
-  let groups = [];
+    );
-  function submit() {
+  });
-    if (data_loaded === true && save_enabled) {
+  let groups = [];
-      Toastify({
+  function submit() {
-        text: $_("updating-runner"),
+    if (data_loaded === true && save_enabled) {
-        duration: 2500,
+      Toastify({
-      }).showToast();
+        text: $_("updating-runner"),
-      let postdata = {};
+        duration: 2500,
-      postdata = Object.assign(postdata, editable);
+      }).showToast();
-      RunnerService.runnerControllerPut(original_data.id, postdata)
+      let postdata = {};
-        .then((resp) => {
+      postdata = Object.assign(postdata, editable);
-          Object.assign(original_data, editable);
+      RunnerService.runnerControllerPut(original_data.id, postdata)
-          original_data = original_data;
+        .then((resp) => {
-          Toastify({
+          Object.assign(original_data, editable);
-            text: $_("runner-updated"),
+          original_data = original_data;
-            duration: 2500,
+          Toastify({
-            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+            text: $_("runner-updated"),
-          }).showToast();
+            duration: 2500,
-        })
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-        .catch((err) => {});
+          }).showToast();
-    } else {
+        })
-    }
+        .catch((err) => {});
-  }
+    } else {
-  function deleteRunner() {
+    }
-    RunnerService.runnerControllerRemove(original_data.id, true)
+  }
-      .then((resp) => {
+  function deleteRunner() {
-        location.replace("./");
+    RunnerService.runnerControllerRemove(original_data.id, true)
-      })
+      .then((resp) => {
-      .catch((err) => {});
+        location.replace("./");
-  }
+      })
-  function generateSponsoringContract(locale) {
+      .catch((err) => {});
-    sponsoring_contracts_download_open = false;
+  }
-    const toast = Toastify({
+</script>
-      text: $_("generating-pdf"),
+
-      duration: -1,
+{#await runner_promise}
-    }).showToast();
+  {$_('loading-runners')}
-    fetch(
+{:then}
-      `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+  <section class="container p-5 select-none">
-      {
+    <div class="flex flex-row mb-4">
-        method: "POST",
+      <div class="w-full">
-        headers: {
+        <nav class="w-full flex">
-          "Content-Type": "application/json",
+          <ol class="list-none flex flex-row items-center justify-start">
-        },
+            <li class="flex items-center">
-        body: JSON.stringify([original_data_pdf]),
+              <svg
-      }
+                xmlns="http://www.w3.org/2000/svg"
-    )
+                viewBox="0 0 24 24"
-      .then((response) => {
+                class="flex-shrink-0 w-5 h-5 mr-2"
-        if (response.status != "200") {
+                fill="currentColor"
-          toast.hideToast();
+                width="24"
-          Toastify({
+                height="24"><path fill="none" d="M0 0h24v24H0z" />
-            text: $_("pdf-generation-failed"),
+                <path
-            duration: 3500,
+                  d="M9.83 8.79L8 9.456V13H6V8.05h.015l5.268-1.918c.244-.093.51-.14.782-.131a2.616 2.616 0 0 1 2.427 1.82c.186.583.356.977.51 1.182A4.992 4.992 0 0 0 19 11v2a6.986 6.986 0 0 1-5.402-2.547l-.581 3.297L15 15.67V23h-2v-5.986l-2.05-1.987-.947 4.298-6.894-1.215.348-1.97 4.924.868L9.83 8.79zM13.5 5.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" /></svg>
-            backgroundColor:
+            </li>
-              "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+            <li class="flex items-center">
-          }).showToast();
+              <a class="mr-2" href="./">{$_('runners')}</a><svg
-        } else {
+                stroke="currentColor"
-          return response.blob();
+                fill="none"
-        }
+                stroke-width="2"
-      })
+                viewBox="0 0 24 24"
-      .then((blob) => {
+                stroke-linecap="round"
-        const url = window.URL.createObjectURL(blob);
+                stroke-linejoin="round"
-        let a = document.createElement("a");
+                class="h-3 w-3 mr-2 stroke-current"
-        a.href = url;
+                height="1em"
-        a.download =
+                width="1em"
-          "Sponsoring_" +
+                xmlns="http://www.w3.org/2000/svg"><line
-          original_data.firstname +
+                  x1="5"
-          (original_data.middlename || "") +
+                  y1="12"
-          original_data.lastname +
+                  x2="19"
-          ".pdf";
+                  y2="12" />
-        document.body.appendChild(a);
+                <polyline points="12 5 19 12 12 19" /></svg>
-        a.click();
+            </li>
-        a.remove();
+            <li class="flex items-center">
-        toast.hideToast();
+              <span class="mr-2">{original_data.firstname}
-        Toastify({
+                {original_data.middlename || ''}
-          text: $_("pdf-successfully-generated"),
+                {original_data.lastname}</span>
-          duration: 3500,
+            </li>
-          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          </ol>
-        }).showToast();
+        </nav>
-      })
+      </div>
-      .catch((err) => {
+    </div>
-        console.error(err);
+    <div class="mb-8 text-3xl font-extrabold leading-tight">
-      });
+      {original_data.firstname}
-  }
+      {original_data.middlename || ''}
-</script>
+      {original_data.lastname}
-
+      <span data-id="runner_actions_${editable.id}">
-{#await runner_promise}
+        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
-  {$_('loading-runners')}
+          {#if delete_triggered}
-{:then}
+            <button
-  <section class="container p-5 select-none">
+              on:click={deleteRunner}
-    <div class="flex flex-row mb-4">
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('confirm-deletion')}</button>
-      <div class="w-full">
+            <button
-        <nav class="w-full flex">
+              on:click={() => {
-          <ol class="list-none flex flex-row items-center justify-start">
+                delete_triggered = !delete_triggered;
-            <li class="flex items-center">
+              }}
-              <svg
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm">{$_('cancel')}</button>
-                xmlns="http://www.w3.org/2000/svg"
+          {/if}
-                viewBox="0 0 24 24"
+          <GenerateSponsoringContracts
-                class="flex-shrink-0 w-5 h-5 mr-2"
+            bind:sponsoring_contracts_show
-                fill="currentColor"
+            bind:generate_runners />
-                width="24"
+          <GenerateRunnerCards
-                height="24"><path fill="none" d="M0 0h24v24H0z" />
+            bind:cards_show
-                <path
+            bind:generate_runners />
-                  d="M9.83 8.79L8 9.456V13H6V8.05h.015l5.268-1.918c.244-.093.51-.14.782-.131a2.616 2.616 0 0 1 2.427 1.82c.186.583.356.977.51 1.182A4.992 4.992 0 0 0 19 11v2a6.986 6.986 0 0 1-5.402-2.547l-.581 3.297L15 15.67V23h-2v-5.986l-2.05-1.987-.947 4.298-6.894-1.215.348-1.97 4.924.868L9.83 8.79zM13.5 5.5a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" /></svg>
+          <GenerateRunnerCertificates
-            </li>
+            bind:certificates_show
-            <li class="flex items-center">
+            bind:generate_runners />
-              <a class="mr-2" href="./">{$_('runners')}</a><svg
+          {#if !delete_triggered}
-                stroke="currentColor"
+            <button
-                fill="none"
+              on:click={() => {
-                stroke-width="2"
+                delete_triggered = true;
-                viewBox="0 0 24 24"
+              }}
-                stroke-linecap="round"
+              type="button"
-                stroke-linejoin="round"
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('delete-runner')}</button>
-                class="h-3 w-3 mr-2 stroke-current"
+          {/if}
-                height="1em"
+        {/if}
-                width="1em"
+        {#if !delete_triggered}
-                xmlns="http://www.w3.org/2000/svg"><line
+          <button
-                  x1="5"
+            disabled={!save_enabled}
-                  y1="12"
+            class:opacity-50={!save_enabled}
-                  x2="19"
+            type="button"
-                  y2="12" />
+            on:click={submit}
-                <polyline points="12 5 19 12 12 19" /></svg>
+            class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
-            </li>
+        {/if}
-            <li class="flex items-center">
+      </span>
-              <span class="mr-2">{original_data.firstname}
+    </div>
-                {original_data.middlename || ''}
+    <!--  -->
-                {original_data.lastname}</span>
+    <div class="text-sm w-full">
-            </li>
+      <label
-          </ol>
+        for="firstname"
-        </nav>
+        class="font-medium text-gray-700">{$_('first-name')}</label>
-      </div>
+      <input
-    </div>
+        autocomplete="off"
-    <div class="mb-8 text-3xl font-extrabold leading-tight">
+        placeholder={$_('first-name')}
-      {original_data.firstname}
+        type="text"
-      {original_data.middlename || ''}
+        class:border-red-500={!isFirstnameValid}
-      {original_data.lastname}
+        class:focus:border-red-500={!isFirstnameValid}
-      <span data-id="runner_actions_${editable.id}">
+        class:focus:ring-red-500={!isFirstnameValid}
-        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
+        bind:value={editable.firstname}
-          {#if delete_triggered}
+        name="firstname"
-            <button
+        class="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-gray-500 rounded-md p-2" />
-              on:click={deleteRunner}
+      {#if !isFirstnameValid}
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('confirm-deletion')}</button>
+        <span
-            <button
+          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-              on:click={() => {
+          {$_('first-name-is-required')}
-                delete_triggered = !delete_triggered;
+        </span>
-              }}
+      {/if}
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm">{$_('cancel')}</button>
+    </div>
-          {/if}
+    <div class="text-sm w-full">
-          <div id="sponsoring:dropdown" class="relative inline-block">
+      <label
-            <div>
+        for="middlename"
-              <button
+        class="font-medium text-gray-700">{$_('middle-name')}</label>
-                on:click={() => {
+      <input
-                  sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+        autocomplete="off"
-                }}
+        placeholder={$_('middle-name')}
-                type="button"
+        type="text"
-                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+        bind:value={editable.middlename}
-                id="options-menu"
+        name="middlename"
-                aria-haspopup="true"
+        class="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-gray-500 rounded-md p-2" />
-                aria-expanded="true">
+    </div>
-                {$_('generate-sponsoring-contract')}
+    <div class="text-sm w-full">
-                <svg
+      <label
-                  xmlns="http://www.w3.org/2000/svg"
+        for="lastname"
-                  width="24"
+        class="font-medium text-gray-700">{$_('last-name')}</label>
-                  height="24"
+      <input
-                  viewBox="0 0 24 24"
+        autocomplete="off"
-                  class="-mr-1 ml-2 h-5 w-5"><path
+        placeholder={$_('last-name')}
-                    fill="none"
+        type="text"
-                    d="M0 0h24v24H0z" />
+        bind:value={editable.lastname}
-                  <path
+        class:border-red-500={!isLastnameValid}
-                    fill="currentColor"
+        class:focus:border-red-500={!isLastnameValid}
-                    d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+        class:focus:ring-red-500={!isLastnameValid}
-              </button>
+        name="lastname"
-            </div>
+        class="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-gray-500 rounded-md p-2" />
-            {#if sponsoring_contracts_download_open}
+      {#if !isLastnameValid}
-              <div
+        <span
-                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-                id="sponsoring:dropdown:menu">
+          {$_('last-name-is-required')}
-                <div
+        </span>
-                  class="py-1"
+      {/if}
-                  role="menu"
+    </div>
-                  aria-orientation="vertical"
+    <div class="text-sm w-full">
-                  aria-labelledby="options-menu">
+      <label
-                  <span
+        for="email"
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+        class="font-medium text-gray-700">{$_('e-mail-adress')}</label>
-                  <button
+      <input
-                    on:click={() => {
+        autocomplete="off"
-                      generateSponsoringContract('de');
+        placeholder={$_('e-mail-adress')}
-                    }}
+        type="email"
-                    type="submit"
+        bind:value={editable.email}
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+        class:border-red-500={!isEmailValid}
-                    role="menuitem">
+        class:focus:border-red-500={!isEmailValid}
-                    {$_('german')}
+        class:focus:ring-red-500={!isEmailValid}
-                  </button>
+        name="email"
-                  <button
+        class="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-gray-500 rounded-md p-2" />
-                    on:click={() => {
+      {#if !isEmailValid}
-                      generateSponsoringContract('en');
+        <span
-                    }}
+          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-                    type="submit"
+          {$_('valid-email-is-required')}
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+        </span>
-                    role="menuitem">
+      {/if}
-                    {$_('english')}
+    </div>
-                  </button>
+    <div class="text-sm w-full">
-                </div>
+      <label for="phone" class="font-medium text-gray-700">{$_('phone')}</label>
-              </div>
+      <input
-            {/if}
+        autocomplete="off"
-          </div>
+        placeholder={$_('phone')}
-          {#if !delete_triggered}
+        type="tel"
-            <button
+        bind:value={editable.phone}
-              on:click={() => {
+        name="phone"
-                delete_triggered = true;
+        class="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-gray-500 rounded-md p-2" />
-              }}
+    </div>
-              type="button"
+    <div class="text-sm w-full">
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('delete-runner')}</button>
+      <span class="font-medium text-gray-700">{$_('group')}</span>
-          {/if}
+      <Select
-        {/if}
+        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-gray-500 rounded-md p-2"
-        {#if !delete_triggered}
+        itemFilter={(label, filterText, option) => label
-          <button
+            .toLowerCase()
-            disabled={!save_enabled}
+            .includes(
-            class:opacity-50={!save_enabled}
+              filterText.toLowerCase()
-            type="button"
+            ) || option.id.value
-            on:click={submit}
+            .toString()
-            class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
+            .startsWith(filterText.toLowerCase())}
-        {/if}
+        items={groups}
-      </span>
+        showChevron={true}
-    </div>
+        placeholder={$_('search-for-an-organization-or-team-by-name-or-id')}
-    <!--  -->
+        noOptionsMessage={$_('no-organization-or-team-found')}
-    <div class="text-sm w-full">
+        bind:selectedValue={group}
-      <label
+        on:select={(selectedValue) => {
-        for="firstname"
+          editable.group = selectedValue.detail.value.id;
-        class="font-medium text-gray-700">{$_('first-name')}</label>
+        }}
-      <input
+        on:clear={() => (editable.group = null)} />
-        autocomplete="off"
+    </div>
-        placeholder={$_('first-name')}
+    <div class="text-sm w-full">
-        type="text"
+      <span class="font-medium text-gray-700">{$_('distance')}</span>
-        class:border-red-500={!isFirstnameValid}
+      <br />
-        class:focus:border-red-500={!isFirstnameValid}
+      <span class="text-gray-700">{original_data.distance} km</span>
-        class:focus:ring-red-500={!isFirstnameValid}
+    </div>
-        bind:value={editable.firstname}
+  </section>
-        name="firstname"
+{:catch error}
-        class="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-gray-500 rounded-md p-2" />
+  <PromiseError {error} />
-      {#if !isFirstnameValid}
+{/await}
-        <span
-          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-          {$_('first-name-is-required')}
-        </span>
-      {/if}
-    </div>
-    <div class="text-sm w-full">
-      <label
-        for="middlename"
-        class="font-medium text-gray-700">{$_('middle-name')}</label>
-      <input
-        autocomplete="off"
-        placeholder={$_('middle-name')}
-        type="text"
-        bind:value={editable.middlename}
-        name="middlename"
-        class="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-gray-500 rounded-md p-2" />
-    </div>
-    <div class="text-sm w-full">
-      <label
-        for="lastname"
-        class="font-medium text-gray-700">{$_('last-name')}</label>
-      <input
-        autocomplete="off"
-        placeholder={$_('last-name')}
-        type="text"
-        bind:value={editable.lastname}
-        class:border-red-500={!isLastnameValid}
-        class:focus:border-red-500={!isLastnameValid}
-        class:focus:ring-red-500={!isLastnameValid}
-        name="lastname"
-        class="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-gray-500 rounded-md p-2" />
-      {#if !isLastnameValid}
-        <span
-          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-          {$_('last-name-is-required')}
-        </span>
-      {/if}
-    </div>
-    <div class="text-sm w-full">
-      <label
-        for="email"
-        class="font-medium text-gray-700">{$_('e-mail-adress')}</label>
-      <input
-        autocomplete="off"
-        placeholder={$_('e-mail-adress')}
-        type="email"
-        bind:value={editable.email}
-        class:border-red-500={!isEmailValid}
-        class:focus:border-red-500={!isEmailValid}
-        class:focus:ring-red-500={!isEmailValid}
-        name="email"
-        class="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-gray-500 rounded-md p-2" />
-      {#if !isEmailValid}
-        <span
-          class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-          {$_('valid-email-is-required')}
-        </span>
-      {/if}
-    </div>
-    <div class="text-sm w-full">
-      <label for="phone" class="font-medium text-gray-700">{$_('phone')}</label>
-      <input
-        autocomplete="off"
-        placeholder={$_('phone')}
-        type="tel"
-        bind:value={editable.phone}
-        name="phone"
-        class="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-gray-500 rounded-md p-2" />
-    </div>
-    <div class="text-sm w-full">
-      <span class="font-medium text-gray-700">{$_('group')}</span>
-      <Select
-        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-gray-500 rounded-md p-2"
-        itemFilter={(label, filterText, option) => label
-            .toLowerCase()
-            .includes(
-              filterText.toLowerCase()
-            ) || option.id.value.toString().startsWith(filterText.toLowerCase())}
-        items={groups}
-        showChevron={true}
-        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">
-      <span class="font-medium text-gray-700">{$_('distance')}</span>
-      <br />
-      <span class="text-gray-700">{original_data.distance} km</span>
-    </div>
-  </section>
-{:catch error}
-  <PromiseError {error} />
-{/await}

src/components/runners/RunnersOverview.svelte

@@ -1,364 +1,263 @@
-<script>
+<script>
-  import { getLocaleFromNavigator, _ } from "svelte-i18n";
+  import { getLocaleFromNavigator, _ } from "svelte-i18n";
-  import {
+  import {
-    RunnerService,
+    RunnerService,
-    RunnerTeamService,
+    RunnerTeamService,
-    RunnerOrganizationService,
+    RunnerOrganizationService,
-  } from "@odit/lfk-client-js";
+  } from "@odit/lfk-client-js";
-  import store from "../../store";
+  import store from "../../store";
-  import RunnersEmptyState from "./RunnersEmptyState.svelte";
+  import RunnersEmptyState from "./RunnersEmptyState.svelte";
-  import Select from "svelte-select";
+  import Select from "svelte-select";
-  import Toastify from "toastify-js";
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
-  $: searchvalue = "";
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
-  $: active_deletes = [];
+  import GenerateRunnerCertificates from "../pdf_generation/GenerateRunnerCertificates.svelte";
-  export let current_runners = [];
+  $: searchvalue = "";
-  const runners_promise = RunnerService.runnerControllerGetAll().then((val) => {
+  $: active_deletes = [];
-    current_runners = val;
+  export let current_runners = [];
-  });
+  const runners_promise = RunnerService.runnerControllerGetAll().then((val) => {
-  $: selectedFilter_teams = null;
+    current_runners = val;
-  $: selectedFilter = null;
+  });
-  $: filter__teams = selectedFilter_teams || [];
+  $: selectedFilter_teams = null;
-  $: filter__orgs = selectedFilter || [];
+  $: selectedFilter = null;
-  $: filterGroupIDs = filter__teams.concat(filter__orgs).map((i) => i.value);
+  $: filter__teams = selectedFilter_teams || [];
-  $: sponsoring_contracts_download_open = false;
+  $: filter__orgs = selectedFilter || [];
-  $: teams = [];
+  $: filterGroupIDs = filter__teams.concat(filter__orgs).map((i) => i.value);
-  $: orgs = [];
+  $: sponsoring_contracts_show = current_runners.some(
-  $: mappedteams = teams.map(function (g) {
+    (r) => r.is_selected === true
-    return { value: g.id, label: g.parentGroup.name + " > " + g.name };
+  );
-  });
+  $: cards_show = current_runners.some(
-  $: selectgroups = orgs
+    (r) => r.is_selected === true
-    .map(function (g) {
+  );
-      return { value: g.id, label: g.name };
+  $: certificates_show = current_runners.some(
-    })
+    (r) => r.is_selected === true
-    .concat(mappedteams);
+  );
-  document.addEventListener("click", function (e) {
+  $: generate_runners = current_runners.filter((r) => r.is_selected === true);
-    if (
+  $: teams = [];
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
+  $: orgs = [];
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
+  $: mappedteams = teams.map(function (g) {
-    ) {
+    return { value: g.id, label: g.parentGroup.name + " > " + g.name };
-      sponsoring_contracts_download_open = false;
+  });
-    }
+  $: selectgroups = orgs
-  });
+    .map(function (g) {
-  RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
+      return { value: g.id, label: g.name };
-    teams = val;
+    })
-  });
+    .concat(mappedteams);
-  RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
+
-    orgs = val;
+  RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
-  });
+    teams = val;
-  function should_display_based_on_id(id) {
+  });
-    if (searchvalue.toString().slice(-1) === "*") {
+  RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
-      return id.toString().startsWith(searchvalue.replace("*", ""));
+    orgs = val;
-    }
+  });
-    return id.toString() === searchvalue;
+  function should_display_based_on_id(id) {
-  }
+    if (searchvalue.toString().slice(-1) === "*") {
-  function generateSponsoringContract(locale) {
+      return id.toString().startsWith(searchvalue.replace("*", ""));
-    sponsoring_contracts_download_open = false;
+    }
-    const toast = Toastify({
+    return id.toString() === searchvalue;
-      text: $_("generating-pdf"),
+  }
-      duration: -1,
+</script>
-    }).showToast();
+
-    fetch(
+{#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
-      `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+  {#await runners_promise}
-      {
+    <div
-        method: "POST",
+      class="bg-teal-lightest border-t-4 border-teal rounded-b text-teal-darkest px-4 py-3 shadow-md my-2"
-        headers: {
+      role="alert">
-          "Content-Type": "application/json",
+      <p class="font-bold">{$_('runners-are-being-loaded')}</p>
-        },
+      <p class="text-sm">{$_('this-might-take-a-moment')}</p>
-        body: JSON.stringify(
+    </div>
-          current_runners.filter((r) => r.is_selected === true)
+  {:then}
-        ),
+    {#if current_runners.length === 0}
-      }
+      <RunnersEmptyState />
-    )
+    {:else}
-      .then((response) => {
+      <input
-        if (response.status != "200") {
+        type="search"
-          toast.hideToast();
+        bind:value={searchvalue}
-          Toastify({
+        placeholder={$_('datatable.search')}
-            text: $_("pdf-generation-failed"),
+        aria-label={$_('datatable.search')}
-            duration: 3500,
+        class="gridjs-input gridjs-search-input mb-4" />
-            backgroundColor:
+      <div class="block mb-6">
-              "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+        <label
-          }).showToast();
+          for="country"
-        } else {
+          class="text-sm font-medium text-gray-700">{$_('filter-by-organization-team')}</label>
-          return response.blob();
+        <Select
-        }
+          on:select={(event) => {
-      })
+            selectedFilter = event.detail;
-      .then((blob) => {
+          }}
-        const url = window.URL.createObjectURL(blob);
+          selectedValue={selectedFilter}
-        let a = document.createElement("a");
+          placeholder={$_('filter-by-organization-team')}
-        a.href = url;
+          containerClasses="mt-1 py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
-        a.download = "Sponsoring.pdf";
+          items={selectgroups}
-        document.body.appendChild(a);
+          isMulti={true} />
-        a.click();
+      </div>
-        a.remove();
+      <div class="h-12">
-        toast.hideToast();
+        <GenerateSponsoringContracts
-        Toastify({
+          bind:sponsoring_contracts_show
-          text: $_("pdf-successfully-generated"),
+          bind:generate_runners />
-          duration: 3500,
+        <GenerateRunnerCards
-          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+          bind:cards_show
-        }).showToast();
+          bind:generate_runners />
-      })
+        <GenerateRunnerCertificates
-      .catch((err) => {
+          bind:certificates_show
-        console.error(err);
+          bind:generate_runners />
-      });
+      </div>
-  }
+      <div
-</script>
+        class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">
-
+        <table class="divide-y divide-gray-200 w-full">
-{#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:GET')}
+          <thead class="bg-gray-50">
-  {#await runners_promise}
+            <tr>
-    <div
+              <th
-      class="bg-teal-lightest border-t-4 border-teal rounded-b text-teal-darkest px-4 py-3 shadow-md my-2"
+                scope="col"
-      role="alert">
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-      <p class="font-bold">{$_('runners-are-being-loaded')}</p>
+                <span
-      <p class="text-sm">{$_('this-might-take-a-moment')}</p>
+                  on:click={() => {
-    </div>
+                    const newstate = !current_runners.some((r) => r.is_selected === true);
-  {:then}
+                    current_runners = current_runners.map((r) => {
-    {#if current_runners.length === 0}
+                      r.is_selected = newstate;
-      <RunnersEmptyState />
+                      return r;
-    {:else}
+                    });
-      <input
+                  }}
-        type="search"
+                  class="underline cursor-pointer select-none">{#if current_runners.some((r) => r.is_selected === true)}
-        bind:value={searchvalue}
+                    {$_('deselect-all')}
-        placeholder={$_('datatable.search')}
+                  {:else}{$_('select-all')}{/if}
-        aria-label={$_('datatable.search')}
+                </span>
-        class="gridjs-input gridjs-search-input mb-4" />
+              </th>
-      <div class="block mb-6">
+              <th
-        <label
+                scope="col"
-          for="country"
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-          class="text-sm font-medium text-gray-700">{$_('filter-by-organization-team')}</label>
+                {$_('name')}
-        <Select
+              </th>
-          on:select={(event) => {
+              <th
-            selectedFilter = event.detail;
+                scope="col"
-          }}
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-          selectedValue={selectedFilter}
+                {$_('contact-information')}
-          placeholder={$_('filter-by-organization-team')}
+              </th>
-          containerClasses="mt-1 py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
+              <th
-          items={selectgroups}
+                scope="col"
-          isMulti={true} />
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-      </div>
+                {$_('group')}
-      <div class="h-12">
+              </th>
-        {#if current_runners.some((r) => r.is_selected === true)}
+              <th
-          <div id="sponsoring:dropdown" class="relative inline-block">
+                scope="col"
-            <div>
+                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
-              <button
+                {$_('distance-in-km')}
-                on:click={() => {
+              </th>
-                  sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+              <th scope="col" class="relative px-6 py-3">
-                }}
+                <span class="sr-only">{$_('action')}</span>
-                type="button"
+              </th>
-                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+            </tr>
-                id="options-menu"
+          </thead>
-                aria-haspopup="true"
+          <tbody class="divide-y divide-gray-200">
-                aria-expanded="true">
+            {#each current_runners as runner}
-                {$_('generate-sponsoring-contracts')}
+              {#if runner.firstname
-                <svg
+                .toLowerCase()
-                  xmlns="http://www.w3.org/2000/svg"
+                .includes(
-                  width="24"
+                  searchvalue.toLowerCase()
-                  height="24"
+                ) || runner.lastname
-                  viewBox="0 0 24 24"
+                  .toLowerCase()
-                  class="-mr-1 ml-2 h-5 w-5"><path
+                  .includes(
-                    fill="none"
+                    searchvalue.toLowerCase()
-                    d="M0 0h24v24H0z" />
+                  ) || should_display_based_on_id(runner.id)}
-                  <path
+                {#if filterGroupIDs.includes(runner.group.id) || filterGroupIDs.includes(runner.group.parentGroup?.id) || filterGroupIDs.length === 0}
-                    fill="currentColor"
+                  <tr
-                    d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+                    data-rowid="user_{runner.id}"
-              </button>
+                    data-groupid={runner.group.id}>
-            </div>
+                    <td class="px-6 py-4 whitespace-nowrap">
-            {#if sponsoring_contracts_download_open}
+                      <input
-              <div
+                        bind:checked={runner.is_selected}
-                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                        type="checkbox"
-                id="sponsoring:dropdown:menu">
+                        class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
-                <div
+                    </td>
-                  class="py-1"
+                    <td class="px-6 py-4 whitespace-nowrap">
-                  role="menu"
+                      <div class="flex items-center">
-                  aria-orientation="vertical"
+                        <div class="ml-4">
-                  aria-labelledby="options-menu">
+                          <div class="text-sm font-medium text-gray-900">
-                  <span
+                            {runner.firstname}
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+                            {runner.middlename || ''}
-                  <button
+                            {runner.lastname}
-                    on:click={() => {
+                          </div>
-                      generateSponsoringContract('de');
+                        </div>
-                    }}
+                      </div>
-                    type="submit"
+                    </td>
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+                    <td class="px-6 py-4 whitespace-nowrap">
-                    role="menuitem">
+                      {#if runner.email}
-                    {$_('german')}
+                        <div class="text-sm text-gray-500">{runner.email}</div>
-                  </button>
+                      {/if}
-                  <button
+                      {#if runner.phone}
-                    on:click={() => {
+                        <div class="text-sm text-gray-500">{runner.phone}</div>
-                      generateSponsoringContract('en');
+                      {/if}
-                    }}
+                      {#if runner.address.address1 !== null}
-                    type="submit"
+                        {runner.address.address1}<br />
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+                        {runner.address.address2 || ''}<br />
-                    role="menuitem">
+                        {runner.address.postalcode}
-                    {$_('english')}
+                        {runner.address.city}
-                  </button>
+                        {runner.address.country}
-                </div>
+                      {/if}
-              </div>
+                    </td>
-            {/if}
+                    <td class="px-6 py-4 whitespace-nowrap">
-          </div>
+                      {#if runner.group.responseType === 'RUNNERTEAM'}
-        {/if}
+                        <a
-      </div>
+                          href="../teams/{runner.group.id}"
-      <div
+                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
-        class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">
+                      {/if}
-        <table class="divide-y divide-gray-200 w-full">
+                      {#if runner.group.responseType === 'RUNNERORGANIZATION'}
-          <thead class="bg-gray-50">
+                        <a
-            <tr>
+                          href="../orgs/{runner.group.id}"
-              <th
+                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
-                scope="col"
+                      {/if}
-                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                    </td>
-                <span
+                    <td class="px-6 py-4 whitespace-nowrap">
-                  on:click={() => {
+                      {runner.distance}
-                    const newstate = !current_runners.some((r) => r.is_selected === true);
+                    </td>
-                    current_runners = current_runners.map((r) => {
+                    {#if active_deletes[runner.id] === true}
-                      r.is_selected = newstate;
+                      <td
-                      return r;
+                        class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
-                    });
+                        <button
-                  }}
+                          on:click={() => {
-                  class="underline cursor-pointer select-none">{#if current_runners.some((r) => r.is_selected === true)}
+                            active_deletes[runner.id] = false;
-                    {$_('deselect-all')}
+                          }}
-                  {:else}{$_('select-all')}{/if}
+                          tabindex="0"
-                </span>
+                          class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">{$_('cancel-delete')}</button>
-              </th>
+                        <button
-              <th
+                          on:click={() => {
-                scope="col"
+                            RunnerService.runnerControllerRemove(runner.id, true)
-                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                              .then((resp) => {
-                {$_('name')}
+                                current_runners = current_runners.filter((obj) => obj.id !== runner.id);
-              </th>
+                              })
-              <th
+                              .catch((err) => {});
-                scope="col"
+                          }}
-                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                          tabindex="0"
-                {$_('contact-information')}
+                          class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('confirm-delete')}</button>
-              </th>
+                      </td>
-              <th
+                    {:else}
-                scope="col"
+                      <td
-                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                        class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
-                {$_('group')}
+                        <a
-              </th>
+                          href="./{runner.id}"
-              <th
+                          class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
-                scope="col"
+                        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
-                class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                          <button
-                {$_('distance-in-km')}
+                            on:click={() => {
-              </th>
+                              active_deletes[runner.id] = true;
-              <th scope="col" class="relative px-6 py-3">
+                            }}
-                <span class="sr-only">{$_('action')}</span>
+                            tabindex="0"
-              </th>
+                            class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('delete')}</button>
-            </tr>
+                        {/if}
-          </thead>
+                      </td>
-          <tbody class="divide-y divide-gray-200">
+                    {/if}
-            {#each current_runners as runner}
+                  </tr>
-              {#if runner.firstname
+                {/if}
-                .toLowerCase()
+              {/if}
-                .includes(
+            {/each}
-                  searchvalue.toLowerCase()
+          </tbody>
-                ) || runner.middlename
+        </table>
-                  .toLowerCase()
+      </div>
-                  .includes(
+    {/if}
-                    searchvalue.toLowerCase()
+  {:catch error}
-                  ) || runner.lastname
+    <div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
-                  .toLowerCase()
+      <span class="inline-block align-middle mr-8">
-                  .includes(
+        <b class="capitalize">{$_('general_promise_error')}</b>
-                    searchvalue.toLowerCase()
+        {error}
-                  ) || should_display_based_on_id(runner.id)}
+      </span>
-                {#if filterGroupIDs.includes(runner.group.id) || filterGroupIDs.includes(runner.group.parentGroup?.id) || filterGroupIDs.length === 0}
+    </div>
-                  <tr
+  {/await}
-                    data-rowid="user_{runner.id}"
+{/if}
-                    data-groupid={runner.group.id}>
-                    <td class="px-6 py-4 whitespace-nowrap">
-                      <input
-                        bind:checked={runner.is_selected}
-                        type="checkbox"
-                        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">
-                      <div class="flex items-center">
-                        <div class="ml-4">
-                          <div class="text-sm font-medium text-gray-900">
-                            {runner.firstname}
-                            {runner.middlename || ''}
-                            {runner.lastname}
-                          </div>
-                        </div>
-                      </div>
-                    </td>
-                    <td class="px-6 py-4 whitespace-nowrap">
-                      {#if runner.email}
-                        <div class="text-sm text-gray-500">{runner.email}</div>
-                      {/if}
-                      {#if runner.phone}
-                        <div class="text-sm text-gray-500">{runner.phone}</div>
-                      {/if}
-                      {#if runner.address.address1 !== null}
-                        {runner.address.address1}<br />
-                        {runner.address.address2 || ''}<br />
-                        {runner.address.postalcode}
-                        {runner.address.city}
-                        {runner.address.country}
-                      {/if}
-                    </td>
-                    <td class="px-6 py-4 whitespace-nowrap">
-                      {#if runner.group.responseType === 'RUNNERTEAM'}
-                        <a
-                          href="../teams/{runner.group.id}"
-                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
-                      {/if}
-                      {#if runner.group.responseType === 'RUNNERORGANIZATION'}
-                        <a
-                          href="../orgs/{runner.group.id}"
-                          class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{runner.group.name}</a>
-                      {/if}
-                    </td>
-                    <td class="px-6 py-4 whitespace-nowrap">
-                      {runner.distance}
-                    </td>
-                    {#if active_deletes[runner.id] === true}
-                      <td
-                        class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
-                        <button
-                          on:click={() => {
-                            active_deletes[runner.id] = false;
-                          }}
-                          tabindex="0"
-                          class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">{$_('cancel-delete')}</button>
-                        <button
-                          on:click={() => {
-                            RunnerService.runnerControllerRemove(runner.id, true)
-                              .then((resp) => {
-                                current_runners = current_runners.filter((obj) => obj.id !== runner.id);
-                              })
-                              .catch((err) => {});
-                          }}
-                          tabindex="0"
-                          class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('confirm-delete')}</button>
-                      </td>
-                    {:else}
-                      <td
-                        class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
-                        <a
-                          href="./{runner.id}"
-                          class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
-                        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
-                          <button
-                            on:click={() => {
-                              active_deletes[runner.id] = true;
-                            }}
-                            tabindex="0"
-                            class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('delete')}</button>
-                        {/if}
-                      </td>
-                    {/if}
-                  </tr>
-                {/if}
-              {/if}
-            {/each}
-          </tbody>
-        </table>
-      </div>
-    {/if}
-  {: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}
-{/if}

src/components/scans/ScansEmptyState.svelte

@@ -5,7 +5,7 @@
 
 <div class="text-center items-center justify-center">
   <p class="mb-16 text-lg text-gray-500">
-    <img class="w-full" style="height:15rem" src={scans_empty} alt="" />
+    <img class="m-auto" style="height:15rem" src={scans_empty} alt="" />
     <span class="font-bold">{$_('there-are-no-scans-yet')}</span><br />
     <span>{$_('add-your-fist-scan')}</span>
   </p>

src/components/scans/ScansOverview.svelte

@@ -81,10 +81,6 @@
                 .includes(
                   searchvalue.toLowerCase()
                 ) || scan.runner?.firstname
-                  .toLowerCase()
-                  .includes(
-                    searchvalue.toLowerCase()
-                  ) || scan.runner?.middlename
                   .toLowerCase()
                   .includes(
                     searchvalue.toLowerCase()

src/components/scans/scans.svg

@@ -1 +1 @@
-<svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="598.11" height="535.11"><path d="M3.35 120.07a4.6 4.6 0 00-3.18 5.66l76.72 273.98a4.6 4.6 0 005.65 3.18l282.82-79.19a4.6 4.6 0 003.18-5.66L291.82 44.07a4.6 4.6 0 00-5.65-3.19z" fill="#e6e6e6"/><path d="M86.1 389.95l269.5-75.46-72.99-260.67-269.5 75.46z" fill="#fff"/><path d="M48.74 164.1c-1.8.5-2.54 3.48-1.65 6.65s3.07 5.33 4.87 4.83l122.91-34.42c1.8-.5 2.54-3.49 1.66-6.65s-3.08-5.34-4.87-4.84zM58.64 199.44c-1.8.5-2.54 3.5-1.65 6.66s3.07 5.34 4.87 4.83l122.91-34.42c1.8-.5 2.54-3.49 1.65-6.65s-3.07-5.34-4.86-4.83zM68.42 234.39c-1.8.5-2.54 3.49-1.65 6.66s3.07 5.33 4.87 4.83l122.92-34.42c1.8-.5 2.54-3.5 1.65-6.66s-3.07-5.33-4.87-4.83zM78.32 269.74c-1.8.5-2.54 3.49-1.65 6.66s3.07 5.33 4.87 4.83l122.92-34.42c1.8-.5 2.54-3.49 1.65-6.66s-3.07-5.33-4.87-4.83zM234.04 112.61a5.97 5.97 0 103.21 11.5l22.98-6.44a5.97 5.97 0 00-3.22-11.49zM243.74 147.28a5.97 5.97 0 103.22 11.49l22.98-6.43a5.97 5.97 0 00-3.22-11.5zM253.45 181.95a5.97 5.97 0 103.22 11.49l22.98-6.44a5.97 5.97 0 00-3.22-11.49zM263.16 216.61a5.97 5.97 0 003.21 11.5l22.98-6.44a5.97 5.97 0 00-3.21-11.49z" fill="#e6e6e6"/><path d="M272.43 276.7a7.6 7.6 0 104.1 14.64l29.28-8.2a7.6 7.6 0 00-4.1-14.64z" fill="#6c63ff"/><path fill="#e6e6e6" d="M85.9 307.81l216.66-60.67.54 1.93-216.67 60.67z"/><path fill="#a0616a" d="M520.2 506.07l-17.38 4.2-24.47-65.02 25.65-6.2 16.2 67.02z"/><path d="M472.85 535.11l-.12-.48a22.23 22.23 0 0116.37-26.8l34-8.23 5.33 22.08z" fill="#2f2e41"/><path fill="#a0616a" d="M443.28 517.91H425.4l-8.5-68.96h26.38v68.96z"/><path d="M447.6 535.01h-57.18v-.5a22.2 22.2 0 0122.2-22.2h34.99zM416.88 490.99l-17.36-206.87 71.86-13.25.28-.05 21.03 13.52-7.32 76.14 33.7 118.7-29.1 7.65-33.75-110.08-7.73-33.48-3.96 43.5 2.94 107.28z" fill="#2f2e41"/><path d="M397.3 288.81l-.2-.24 24.84-186.96.03-.24.17-.18c.37-.36 9.07-8.96 18.02-8.96 1.3 0 2.52-.03 3.7-.06 6.85-.18 12.26-.32 18.69 6.1 6.55 6.56 27.92 30.47 27.92 63.23 0 31.7 2.88 130.22 2.91 131.21l.04 1.4-1.16-.76c-.3-.19-29.03-18.49-53.14-1.48-7.53 5.32-14.3 7.18-20.09 7.18-13.47 0-21.62-10.1-21.73-10.24z" fill="#6c63ff"/><circle cx="737.3" cy="227.82" r="35.82" transform="rotate(-28.66 229.78 725.57)" fill="#a0616a"/><path d="M381.53 328.99a14.66 14.66 0 00.85-22.47l20.34-47.97-26.63 4.9-15.23 44.8A14.74 14.74 0 00381.53 329z" fill="#a0616a"/><path d="M361.88 291.67l6.55-13.83a2.7 2.7 0 01-.97-1c-6.12-10.6 30.84-98.67 33.3-104.51-.37-3.18-4.25-36.85-1.41-48.2 3.34-13.35 10.2-19.58 22.93-20.81 14.04-1.32 17.83 17.75 17.86 17.94l.02 49.02-16.12 56.43-36.75 74.97z" fill="#6c63ff"/><path d="M440.94 58.87c-4.3.56-7.54-3.83-9.04-7.9s-2.64-8.78-6.38-10.98c-5.1-3-11.62.61-17.45-.38-6.59-1.11-10.87-8.1-11.2-14.76s2.31-13.1 4.92-19.24l.9 7.64A15.16 15.16 0 01409.33 0l-1.17 11.22c.73-6.29 7.5-11.16 13.7-9.85l-.19 6.68c7.6-.9 15.28-1.81 22.91-1.12s15.31 3.1 21.1 8.13c8.64 7.51 11.8 19.89 10.74 31.3s-5.77 22.13-10.68 32.48c-1.23 2.6-2.94 5.54-5.8 5.88-2.58.3-4.93-1.86-5.73-4.32s-.41-5.14.07-7.69c.72-3.84 1.63-7.77.95-11.63s-3.45-7.66-7.33-8.13-7.86 3.97-6 7.4z" fill="#2f2e41"/><path fill="#3f3d56" d="M597.73 535.1H339.99v-2.11h258.12l-.38 2.1z"/></svg>
+<svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 647.6 632.2"><path d="M411 142H237a15 15 0 00-15 15v388l-2 1-43 13a8 8 0 01-10-6L39 137a8 8 0 016-10l66-20 191-58 66-20a8 8 0 0110 5l33 106z" fill="#f2f2f2"/><path d="M449 140L410 12a17 17 0 00-21-11l-93 28-191 59-93 28a17 17 0 00-11 21l134 438a17 17 0 0016 12 17 17 0 005 0l64-20 2-1v-2l-2 1-65 20a15 15 0 01-18-10L3 137a15 15 0 0110-19l92-28 192-59 92-28a15 15 0 015-1 15 15 0 0114 11l39 127 1 2h2z" fill="#3f3d56"/><path d="M123 128a9 9 0 01-9-7l-13-42a9 9 0 016-11l176-54a9 9 0 0111 6l13 42a9 9 0 01-6 12l-176 53a9 9 0 01-2 1z" fill="#6c63ff"/><circle cx="190.2" cy="25" r="20" fill="#6c63ff"/><circle cx="190.2" cy="25" r="12.7" fill="#fff"/><path d="M603 582H265a9 9 0 01-9-8V169a9 9 0 019-9h338a9 9 0 018 9v405a9 9 0 01-8 8z" fill="#e6e6e6"/><path d="M447 140H237a17 17 0 00-17 17v408l2-1V157a15 15 0 0115-15h211zm184 0H237a17 17 0 00-17 17v458a17 17 0 0017 17h394a17 17 0 0017-17V157a17 17 0 00-17-17zm15 475a15 15 0 01-15 15H237a15 15 0 01-15-15V157a15 15 0 0115-15h394a15 15 0 0115 15z" fill="#3f3d56"/><path d="M526 184H342a9 9 0 01-9-9v-44a9 9 0 019-9h184a9 9 0 019 9v44a9 9 0 01-9 9z" fill="#6c63ff"/><circle cx="433.6" cy="105.2" r="20" fill="#6c63ff"/><circle cx="433.6" cy="105.2" r="12.2" fill="#fff"/></svg>

src/components/scanstations/CopyScanStationTokenModal.svelte

@@ -23,14 +23,14 @@
         throw new Error();
       }
       Toastify({
-        text: $_('copied-token-to-clipboard'),
+        text: $_("copied-token-to-clipboard"),
         duration: 500,
         backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
       }).showToast();
       copied = true;
     } catch (err) {
       Toastify({
-        text: $_('error-whyile-copying-to-clipboard'),
+        text: $_("error-whyile-copying-to-clipboard"),
         duration: 500,
         backgroundColor:
           "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
@@ -75,7 +75,9 @@
                   d="M4 5v11h16V5H4zM2 4a1 1 0 011-1h18a1 1 0 011 1v14H2V4zM1 19h22v2H1v-2z" /></svg>
             </div>
             <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
-              <h3 class="text-lg leading-6 font-medium text-gray-900">{$_('token')}</h3>
+              <h3 class="text-lg leading-6 font-medium text-gray-900">
+                {$_('token')}
+              </h3>
               <div class="mt-2 mb-6">
                 <p class="text-sm text-gray-500">
                   {$_('the-scanstations-api-token-will-only-get-displayed-once-you-wont-be-able-to-change-or-view-it-again')}
@@ -86,7 +88,7 @@
               <div class="mt-2 mb-6">
                 <label
                   for="token"
-                  class="block text-sm font-medium text-gray-700">Token</label>
+                  class="block text-sm font-medium text-gray-700">{$_('token')}</label>
                 <div on:click={copy} class="inline-flex">
                   <p
                     name="token"
@@ -106,7 +108,9 @@
                         d="M7 4V2h10v2h3l1 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V5l1-1h3zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z" /></svg>
                   </div>
                 </div>
-                <p class="text-gray-500 text-xs">{$_('click-to-copy-token-to-clipboard')}</p>
+                <p class="text-gray-500 text-xs">
+                  {$_('click-to-copy-token-to-clipboard')}
+                </p>
               </div>
             </div>
           </div>

src/components/settings/Settings.svelte

@@ -4,6 +4,9 @@
   import { MeService } from "@odit/lfk-client-js";
   import Toastify from "toastify-js";
   import ConfirmProfileDeletion from "./ConfirmProfileDeletion.svelte";
+  import PasswordStrength, {
+    password_strong_enough_and_equal,
+  } from "../auth/PasswordStrength.svelte";
   $: data_loaded = false;
   $: delete_triggered = false;
   $: original_data = {};
@@ -15,8 +18,10 @@
     JSON.stringify(editable) === JSON.stringify(original_data)
   );
   $: save_enabled = changes_performed && isEmail(editable.email);
-  $: update_password_enabled =
+  $: update_password_enabled = password_strong_enough_and_equal(
-    password_change.length > 0 && password_change === password_confirm;
+    password_change,
+    password_confirm
+  );
   const user_promise = MeService.meControllerGet().then((data) => {
     data_loaded = true;
     data.groups = data.groups.map((g) => g.id);
@@ -45,7 +50,7 @@
   function changePassword() {
     if (data_loaded === true && update_password_enabled) {
       Toastify({
-        text: $_('changing-your-password'),
+        text: $_("changing-your-password"),
         duration: 2500,
       }).showToast();
       let postdata = Object.assign({}, original_data);
@@ -56,7 +61,7 @@
           password_change = "";
           postdata = {};
           Toastify({
-            text: $_('password-changed'),
+            text: $_("password-changed"),
             duration: 2500,
             backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
           }).showToast();
@@ -242,10 +247,7 @@
                     class="border-gray-300 placeholder-gray-500 appearance-none rounded-md relative block w-full px-3 py-2 border focus:outline-none focus:shadow-outline-blue focus:border-blue-300 focus:z-10 sm:text-sm"
                     placeholder={$_('password')} />
                 </div>
-                {#if password_change != password_confirm && password_change.length > 0}
+                <PasswordStrength bind:password_change bind:password_confirm />
-                  <span
-                    class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">{$_('passwords-dont-match')}</span>
-                {/if}
               </div>
               <div class="px-4 py-3 bg-gray-50 text-right sm:px-6">
                 <button
@@ -257,9 +259,9 @@
                   {$_('update-password')}
                 </button>
                 {#if update_password_enabled}
-                <p>
+                  <p>
-                  {$_('after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that')}
+                    {$_('after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that')}
-                </p>
+                  </p>
                 {/if}
               </div>
             </div>

src/components/teams/TeamDetail.svelte

@@ -1,399 +1,297 @@
-<script>
+<script>
-  import {
+  import {
-    GroupContactService,
+    GroupContactService,
-    RunnerOrganizationService,
+    RunnerOrganizationService,
-    RunnerTeamService,
+    RunnerTeamService,
-  } from "@odit/lfk-client-js";
+  } from "@odit/lfk-client-js";
-  import { getLocaleFromNavigator, _ } from "svelte-i18n";
+  import { getLocaleFromNavigator, _ } from "svelte-i18n";
-  import Toastify from "toastify-js";
+  import Toastify from "toastify-js";
-  import store from "../../store";
+  import store from "../../store";
-  import Select from "svelte-select";
+  import Select from "svelte-select";
-  import ImportRunnerModal from "../runners/ImportRunnerModal.svelte";
+  import ImportRunnerModal from "../runners/ImportRunnerModal.svelte";
-  import PromiseError from "../base/PromiseError.svelte";
+  import PromiseError from "../base/PromiseError.svelte";
-  import ConfirmTeamDeletion from "./ConfirmTeamDeletion.svelte";
+  import ConfirmTeamDeletion from "./ConfirmTeamDeletion.svelte";
-import Teams from "./Teams.svelte";
+  import Teams from "./Teams.svelte";
-  let [teamdata, original, delete_team, orgs, contacts, modal_open] = [
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
-    {},
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
-    {},
+  let [teamdata, original, delete_team, orgs, contacts, modal_open] = [
-    {},
+    {},
-    [],
+    {},
-    [],
+    {},
-    false,
+    [],
-  ];
+    [],
-  export let params;
+    false,
-  export let import_modal_open = false;
+  ];
-  $: delete_triggered = false;
+  export let params;
-  $: save_enabled = !data_changed && teamdata.parentGroup != null;
+  export let import_modal_open = false;
-  $: data_loaded = false;
+  $: delete_triggered = false;
-  $: data_changed = JSON.stringify(teamdata) === JSON.stringify(original);
+  $: save_enabled = !data_changed && teamdata.parentGroup != null;
-  $: sponsoring_contracts_download_open = false;
+  $: data_loaded = false;
-  $: group = {};
+  $: data_changed = JSON.stringify(teamdata) === JSON.stringify(original);
-  $: contact = {};
+  $: sponsoring_contracts_show = true;
-  //
+  $: cards_show = true;
-  const getContactLabel = (option) =>
+  $: generate_teams = [original];
-    option.firstname + " " + (option.middlename || "") + " " + option.lastname;
+  $: group = {};
-  const promise = RunnerTeamService.runnerTeamControllerGetOne(
+  $: contact = {};
-    params.teamid
+  //
-  ).then((value) => {
+  const getContactLabel = (option) =>
-    data_loaded = true;
+    option.firstname + " " + (option.middlename || "") + " " + option.lastname;
-    teamdata = Object.assign(teamdata, value);
+  const promise = RunnerTeamService.runnerTeamControllerGetOne(
-    original = Object.assign(original, value);
+    params.teamid
-    RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
+  ).then((value) => {
-      orgs = val.map((r) => {
+    data_loaded = true;
-        return { label: r.name, value: r };
+    teamdata = Object.assign(teamdata, value);
-      });
+    original = Object.assign(original, value);
-      group = orgs.find((g) => g.value.id == teamdata.parentGroup.id);
+    RunnerOrganizationService.runnerOrganizationControllerGetAll().then(
-    });
+      (val) => {
-    GroupContactService.groupContactControllerGetAll().then((val) => {
+        orgs = val.map((r) => {
-      contacts = val.map((r) => {
+          return { label: r.name, value: r };
-        return { label: getContactLabel(r), value: r };
+        });
-      });
+        group = orgs.find((g) => g.value.id == teamdata.parentGroup.id);
-      if(teamdata.contact){
+      }
-        contact = contacts.find((g) => g.value.id == teamdata.contact.id);
+    );
-      }
+    GroupContactService.groupContactControllerGetAll().then((val) => {
-      else{
+      contacts = val.map((r) => {
-        contact = null;
+        return { label: getContactLabel(r), value: r };
-      }
+      });
-    });
+      if (teamdata.contact) {
-  });
+        contact = contacts.find((g) => g.value.id == teamdata.contact.id);
-  document.addEventListener("click", function (e) {
+      } else {
-    if (
+        contact = null;
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
+      }
-      e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
+    });
-    ) {
+  });
-      sponsoring_contracts_download_open = false;
+  function deleteTeam() {
-    }
+    RunnerTeamService.runnerTeamControllerRemove(original.id, false)
-  });
+      .then((resp) => {
-  function deleteTeam() {
+        Toastify({
-    RunnerTeamService.runnerTeamControllerRemove(original.id, false)
+          text: "Organization deleted",
-      .then((resp) => {
+          duration: 500,
-        Toastify({
+          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-          text: "Organization deleted",
+        }).showToast();
-          duration: 500,
+        location.replace("./");
-          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+      })
-        }).showToast();
+      .catch((err) => {
-        location.replace("./");
+        modal_open = true;
-      })
+        delete_team = original;
-      .catch((err) => {
+      });
-        modal_open = true;
+  }
-        delete_team = original;
+  function submit() {
-      });
+    if (data_loaded === true && save_enabled) {
-  }
+      Toastify({
-  function submit() {
+        text: "updating team",
-    if (data_loaded === true && save_enabled) {
+        duration: 2500,
-      Toastify({
+      }).showToast();
-        text: "updating team",
+      let postdata = teamdata;
-        duration: 2500,
+      postdata.parentGroup = teamdata.parentGroup.id;
-      }).showToast();
+      postdata.contact = teamdata.contact?.id;
-      let postdata = teamdata;
+      RunnerTeamService.runnerTeamControllerPut(original.id, postdata)
-      postdata.parentGroup = teamdata.parentGroup.id;
+        .then((resp) => {
-      postdata.contact = teamdata.contact?.id;
+          Object.assign(original, teamdata);
-      RunnerTeamService.runnerTeamControllerPut(original.id, postdata)
+          original = original;
-        .then((resp) => {
+          Toastify({
-          Object.assign(original, teamdata);
+            text: "updated team",
-          original = original;
+            duration: 2500,
-          Toastify({
+            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-            text: "updated team",
+          }).showToast();
-            duration: 2500,
+        })
-            backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+        .catch((err) => {});
-          }).showToast();
+    }
-        })
+  }
-        .catch((err) => {});
+</script>
-    }
+
-  }
+<ImportRunnerModal
-  async function generateSponsoringContract(locale) {
+  current_runners={[]}
-    sponsoring_contracts_download_open = false;
+  on:cancelDelete={(event) => {
-    const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
+    import_modal_open = false;
-      teamdata.id
+  }}
-    );
+  passed_team={teamdata}
-    const toast = Toastify({
+  passed_orgs={[]}
-      text: $_("generating-pdf"),
+  passed_org={{}}
-      duration: -1,
+  opened_from="TeamDetail"
-    }).showToast();
+  bind:import_modal_open />
-    fetch(
+<ConfirmTeamDeletion bind:modal_open bind:delete_team />
-      `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
+{#if data_loaded}
-      {
+  <section class="container p-5">
-        method: "POST",
+    <div class="mb-8 text-3xl font-extrabold leading-tight">
-        headers: {
+      {original.name}
-          "Content-Type": "application/json",
+      <span data-id="org_actions_${teamdata.id}">
-        },
+        <GenerateSponsoringContracts
-        body: JSON.stringify(runners),
+          bind:sponsoring_contracts_show
-      }
+          bind:generate_teams />
-    )
+        <GenerateRunnerCards
-      .then((response) => {
+          bind:cards_show
-        if (response.status != "200") {
+          bind:generate_teams />
-          toast.hideToast();
+        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:IMPORT')}
-          Toastify({
+          <button
-            text: $_("pdf-generation-failed"),
+            on:click={() => {
-            duration: 3500,
+              import_modal_open = true;
-            backgroundColor:
+            }}
-              "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
+            type="button"
-          }).showToast();
+            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
-        } else {
+            {$_('import-runners')}
-          return response.blob();
+          </button>
-        }
+        {/if}
-      })
+        {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:DELETE')}
-      .then((blob) => {
+          {#if delete_triggered}
-        const url = window.URL.createObjectURL(blob);
+            <button
-        let a = document.createElement("a");
+              on:click={deleteTeam}
-        a.href = url;
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('confirm-delete')}</button>
-        a.download = "Sponsorings_" + teamdata.name + ".pdf";
+            <button
-        document.body.appendChild(a);
+              on:click={() => {
-        a.click();
+                delete_triggered = !delete_triggered;
-        a.remove();
+              }}
-        toast.hideToast();
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm">{$_('cancel')}</button>
-        Toastify({
+          {/if}
-          text: $_("pdf-successfully-generated"),
+          {#if !delete_triggered}
-          duration: 3500,
+            <button
-          backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
+              on:click={() => {
-        }).showToast();
+                delete_triggered = true;
-      })
+              }}
-      .catch((err) => {});
+              type="button"
-  }
+              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('delete-team')}</button>
-</script>
+          {/if}
-
+        {/if}
-<ImportRunnerModal
+        {#if !delete_triggered}
-  current_runners={[]}
+          <button
-  on:cancelDelete={(event) => {
+            on:click={submit}
-    import_modal_open = false;
+            disabled={!save_enabled}
-  }}
+            class:opacity-50={!save_enabled}
-  passed_team={teamdata}
+            type="button"
-  passed_orgs={[]}
+            class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
-  passed_org={{}}
+        {/if}
-  opened_from="TeamDetail"
+      </span>
-  bind:import_modal_open />
+    </div>
-<ConfirmTeamDeletion bind:modal_open bind:delete_team />
+    <div class="flex flex-row mb-4">
-{#if data_loaded}
+      <div class="w-full">
-  <section class="container p-5">
+        <nav class="w-full flex">
-    <div class="mb-8 text-3xl font-extrabold leading-tight">
+          <ol class="list-none flex flex-row items-center justify-start">
-      {original.name}
+            <li class="mr-2 flex items-center">
-      <span data-id="org_actions_${teamdata.id}">
+              <svg
-        <div id="sponsoring:dropdown" class="relative inline-block">
+                stroke="currentColor"
-          <div>
+                fill="none"
-            <button
+                stroke-width="2"
-              on:click={() => {
+                viewBox="0 0 24 24"
-                sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+                stroke-linecap="round"
-              }}
+                stroke-linejoin="round"
-              type="button"
+                class="h-3 w-3 stroke-current"
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+                height="1em"
-              id="options-menu"
+                width="1em"
-              aria-haspopup="true"
+                xmlns="http://www.w3.org/2000/svg"><path
-              aria-expanded="true">
+                  d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
-              {$_('generate-sponsoring-contracts')}
+                <polyline points="9 22 9 12 15 12 15 22" /></svg>
-              <svg
+            </li>
-                xmlns="http://www.w3.org/2000/svg"
+            <li class="flex items-center">
-                width="24"
+              <a class="mr-2" href="/">Home</a><svg
-                height="24"
+                stroke="currentColor"
-                viewBox="0 0 24 24"
+                fill="none"
-                class="-mr-1 ml-2 h-5 w-5"><path
+                stroke-width="2"
-                  fill="none"
+                viewBox="0 0 24 24"
-                  d="M0 0h24v24H0z" />
+                stroke-linecap="round"
-                <path
+                stroke-linejoin="round"
-                  fill="currentColor"
+                class="h-3 w-3 mr-2 stroke-current"
-                  d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
+                height="1em"
-            </button>
+                width="1em"
-          </div>
+                xmlns="http://www.w3.org/2000/svg"><line
-          {#if sponsoring_contracts_download_open}
+                  x1="5"
-            <div
+                  y1="12"
-              class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                  x2="19"
-              id="sponsoring:dropdown:menu">
+                  y2="12" />
-              <div
+                <polyline points="12 5 19 12 12 19" /></svg>
-                class="py-1"
+            </li>
-                role="menu"
+            <li class="mr-2 flex items-center">
-                aria-orientation="vertical"
+              <svg
-                aria-labelledby="options-menu">
+                class="flex-shrink-0 w-5 h-5 mr-2"
-                <span
+                fill="currentColor"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
+                width="24"
-                <button
+                height="24"
-                  on:click={() => {
+                xmlns="http://www.w3.org/2000/svg"
-                    generateSponsoringContract('de');
+                viewBox="0 0 640 512"><path
-                  }}
+                  fill="currentColor"
-                  type="submit"
+                  d="M96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm448 0c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm32 32h-64c-17.6 0-33.5 7.1-45.1 18.6 40.3 22.1 68.9 62 75.1 109.4h66c17.7 0 32-14.3 32-32v-32c0-35.3-28.7-64-64-64zm-256 0c61.9 0 112-50.1 112-112S381.9 32 320 32 208 82.1 208 144s50.1 112 112 112zm76.8 32h-8.3c-20.8 10-43.9 16-68.5 16s-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48v-28.8c0-63.6-51.6-115.2-115.2-115.2zm-223.7-13.4C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+            </li>
-                  role="menuitem">
+            <li class="flex items-center">
-                  {$_('german')}
+              <a class="mr-2" href="./">Teams</a><svg
-                </button>
+                stroke="currentColor"
-                <button
+                fill="none"
-                  on:click={() => {
+                stroke-width="2"
-                    generateSponsoringContract('en');
+                viewBox="0 0 24 24"
-                  }}
+                stroke-linecap="round"
-                  type="submit"
+                stroke-linejoin="round"
-                  class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
+                class="h-3 w-3 mr-2 stroke-current"
-                  role="menuitem">
+                height="1em"
-                  {$_('english')}
+                width="1em"
-                </button>
+                xmlns="http://www.w3.org/2000/svg"><line
-              </div>
+                  x1="5"
-            </div>
+                  y1="12"
-          {/if}
+                  x2="19"
-        </div>
+                  y2="12" />
-        {#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:IMPORT')}
+                <polyline points="12 5 19 12 12 19" /></svg>
-          <button
+            </li>
-            on:click={() => {
+            <li class="flex items-center">
-              import_modal_open = true;
+              <span class="mr-2">Team-Details #{params.teamid}</span>
-            }}
+            </li>
-            type="button"
+          </ol>
-            class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
+        </nav>
-            {$_('import-runners')}
+      </div>
-          </button>
+    </div>
-        {/if}
+    <div class="text-sm w-full">
-        {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:DELETE')}
+      <label for="name" class="font-medium text-gray-700">Name</label>
-          {#if delete_triggered}
+      <input
-            <button
+        autocomplete="off"
-              on:click={deleteTeam}
+        placeholder="Name"
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('confirm-delete')}</button>
+        type="text"
-            <button
+        bind:value={teamdata.name}
-              on:click={() => {
+        name="name"
-                delete_triggered = !delete_triggered;
+        class="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-gray-500 rounded-md p-2" />
-              }}
+    </div>
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm">{$_('cancel')}</button>
+    <div class="text-sm w-full">
-          {/if}
+      <label
-          {#if !delete_triggered}
+        for="contact"
-            <button
+        class="font-medium text-gray-700">{$_('contact')}</label>
-              on:click={() => {
+      <Select
-                delete_triggered = true;
+        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-gray-500 rounded-md p-2"
-              }}
+        itemFilter={(label, filterText, option) => label
-              type="button"
+            .toLowerCase()
-              class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('delete-team')}</button>
+            .includes(
-          {/if}
+              filterText.toLowerCase()
-        {/if}
+            ) || option.value.id
-        {#if !delete_triggered}
+            .toString()
-          <button
+            .startsWith(filterText.toLowerCase())}
-            on:click={submit}
+        items={contacts}
-            disabled={!save_enabled}
+        showChevron={true}
-            class:opacity-50={!save_enabled}
+        placeholder={$_('no-contact-selected')}
-            type="button"
+        noOptionsMessage={$_('no-contact-found')}
-            class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
+        bind:selectedValue={contact}
-        {/if}
+        on:select={(selectedValue) => (teamdata.contact = selectedValue.detail.value)}
-      </span>
+        on:clear={() => (teamdata.contact = null)} />
-    </div>
+    </div>
-    <div class="flex flex-row mb-4">
+    <div class="text-sm w-full">
-      <div class="w-full">
+      <label
-        <nav class="w-full flex">
+        for="org"
-          <ol class="list-none flex flex-row items-center justify-start">
+        class="font-medium text-gray-700">{$_('organization')}</label>
-            <li class="mr-2 flex items-center">
+      <Select
-              <svg
+        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-gray-500 rounded-md p-2"
-                stroke="currentColor"
+        itemFilter={(label, filterText, option) => label
-                fill="none"
+            .toLowerCase()
-                stroke-width="2"
+            .includes(
-                viewBox="0 0 24 24"
+              filterText.toLowerCase()
-                stroke-linecap="round"
+            ) || option.id.value
-                stroke-linejoin="round"
+            .toString()
-                class="h-3 w-3 stroke-current"
+            .startsWith(filterText.toLowerCase())}
-                height="1em"
+        items={orgs}
-                width="1em"
+        showChevron={true}
-                xmlns="http://www.w3.org/2000/svg"><path
+        placeholder={$_('search-for-an-organization-by-name-or-id')}
-                  d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
+        noOptionsMessage={$_('no-organizations-found')}
-                <polyline points="9 22 9 12 15 12 15 22" /></svg>
+        bind:selectedValue={group}
-            </li>
+        on:select={(selectedValue) => (teamdata.parentGroup = selectedValue.detail.value)}
-            <li class="flex items-center">
+        on:clear={() => (teamdata.parentGroup = null)} />
-              <a class="mr-2" href="/">Home</a><svg
+    </div>
-                stroke="currentColor"
+  </section>
-                fill="none"
+{:else}
-                stroke-width="2"
+  {#await promise}
-                viewBox="0 0 24 24"
+    {$_('team-detail-is-being-loaded')}
-                stroke-linecap="round"
+  {:catch error}
-                stroke-linejoin="round"
+    <PromiseError />
-                class="h-3 w-3 mr-2 stroke-current"
+  {/await}
-                height="1em"
+{/if}
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"><line
-                  x1="5"
-                  y1="12"
-                  x2="19"
-                  y2="12" />
-                <polyline points="12 5 19 12 12 19" /></svg>
-            </li>
-            <li class="mr-2 flex items-center">
-              <svg
-                class="flex-shrink-0 w-5 h-5 mr-2"
-                fill="currentColor"
-                width="24"
-                height="24"
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 640 512"><path
-                  fill="currentColor"
-                  d="M96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm448 0c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm32 32h-64c-17.6 0-33.5 7.1-45.1 18.6 40.3 22.1 68.9 62 75.1 109.4h66c17.7 0 32-14.3 32-32v-32c0-35.3-28.7-64-64-64zm-256 0c61.9 0 112-50.1 112-112S381.9 32 320 32 208 82.1 208 144s50.1 112 112 112zm76.8 32h-8.3c-20.8 10-43.9 16-68.5 16s-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48v-28.8c0-63.6-51.6-115.2-115.2-115.2zm-223.7-13.4C161.5 263.1 145.6 256 128 256H64c-35.3 0-64 28.7-64 64v32c0 17.7 14.3 32 32 32h65.9c6.3-47.4 34.9-87.3 75.2-109.4z" /></svg>
-            </li>
-            <li class="flex items-center">
-              <a class="mr-2" href="./">Teams</a><svg
-                stroke="currentColor"
-                fill="none"
-                stroke-width="2"
-                viewBox="0 0 24 24"
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                class="h-3 w-3 mr-2 stroke-current"
-                height="1em"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"><line
-                  x1="5"
-                  y1="12"
-                  x2="19"
-                  y2="12" />
-                <polyline points="12 5 19 12 12 19" /></svg>
-            </li>
-            <li class="flex items-center">
-              <span class="mr-2">Team-Details #{params.teamid}</span>
-            </li>
-          </ol>
-        </nav>
-      </div>
-    </div>
-    <div class="text-sm w-full">
-      <label for="name" class="font-medium text-gray-700">Name</label>
-      <input
-        autocomplete="off"
-        placeholder="Name"
-        type="text"
-        bind:value={teamdata.name}
-        name="name"
-        class="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-gray-500 rounded-md p-2" />
-    </div>
-    <div class="text-sm w-full">
-      <label
-        for="contact"
-        class="font-medium text-gray-700">{$_('contact')}</label>
-      <Select
-        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-gray-500 rounded-md p-2"
-        itemFilter={(label, filterText, option) => label
-            .toLowerCase()
-            .includes(
-              filterText.toLowerCase()
-            ) || option.value.id
-            .toString()
-            .startsWith(filterText.toLowerCase())}
-        items={contacts}
-        showChevron={true}
-        placeholder={$_('no-contact-selected')}
-        noOptionsMessage={$_('no-contact-found')}
-        bind:selectedValue={contact}
-        on:select={(selectedValue)=> teamdata.contact = selectedValue.detail.value}
-        on:clear={() => (teamdata.contact = null)} />
-    </div>
-    <div class="text-sm w-full">
-      <label
-        for="org"
-        class="font-medium text-gray-700">{$_('organization')}</label>
-      <Select
-        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-gray-500 rounded-md p-2"
-        itemFilter={(label, filterText, option) => label
-            .toLowerCase()
-            .includes(
-              filterText.toLowerCase()
-            ) || option.id.value.toString().startsWith(filterText.toLowerCase())}
-        items={orgs}
-        showChevron={true}
-        placeholder={$_('search-for-an-organization-by-name-or-id')}
-        noOptionsMessage={$_('no-organizations-found')}
-        bind:selectedValue={group}
-        on:select={(selectedValue)=> teamdata.parentGroup = selectedValue.detail.value}
-        on:clear={() => (teamdata.parentGroup = null)} />
-    </div>
-  </section>
-{:else}
-  {#await promise}
-    {$_('team-detail-is-being-loaded')}
-  {:catch error}
-    <PromiseError />
-  {/await}
-{/if}

src/components/teams/Teams.svelte

@@ -10,7 +10,7 @@
 <section class="container p-5">
   <span class="mb-1 text-3xl font-extrabold leading-tight">
     {$_('teams')}
-    {#if store.state.jwtinfo.userdetails.permissions.includes('USER:CREATE')}
+    {#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:CREATE')}
       <button
         on:click={() => {
           modal_open = true;
@@ -27,6 +27,6 @@
   <TeamsOverview bind:current_teams />
 </section>
 
-{#if store.state.jwtinfo.userdetails.permissions.includes('USER:CREATE')}
+{#if store.state.jwtinfo.userdetails.permissions.includes('TEAM:CREATE')}
   <AddTeamModal bind:current_teams bind:modal_open />
 {/if}

src/components/teams/TeamsOverview.svelte

@@ -7,9 +7,17 @@
   import TeamsEmptyState from "./TeamsEmptyState.svelte";
   import ConfirmTeamDeletion from "./ConfirmTeamDeletion.svelte";
   import { clickOutside } from "../base/outsideclick";
+  import GenerateSponsoringContracts from "../pdf_generation/GenerateSponsoringContracts.svelte";
+  import GenerateRunnerCards from "../pdf_generation/GenerateRunnerCards.svelte";
   $: searchvalue = "";
   $: active_deletes = [];
-  $: sponsoring_contracts_download_open = false;
+  $: sponsoring_contracts_show = current_teams.some(
+    (r) => r.is_selected === true
+  );
+  $: cards_show = current_teams.some(
+    (r) => r.is_selected === true
+  );
+  $: generate_teams = current_teams.filter((r) => r.is_selected === true);
   export let current_teams = [];
   let modal_open = false;
   let delete_team = {};
@@ -19,70 +27,6 @@
   teams_promise.then((data) => {
     usersstore.set(data);
   });
-  document.addEventListener("click", function (e) {
-      if (
-        e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
-        e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
-      ) {
-        sponsoring_contracts_download_open = false;
-      }
-  });
-  async function generateSponsoringContract(locale) {
-    sponsoring_contracts_download_open = false;
-    const teams = current_teams.filter((r) => r.is_selected === true);
-    const toast = Toastify({
-      text: $_("generating-pdfs"),
-      duration: -1,
-    }).showToast();
-    let count = 0;
-    for await (const t of teams) {
-      count++;
-      const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
-        t.id
-      );
-      fetch(
-        `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
-        {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json",
-          },
-          body: JSON.stringify(runners),
-        }
-      )
-        .then((response) => {
-          if (response.status != "200") {
-            toast.hideToast();
-            Toastify({
-              text: $_("pdf-generation-failed"),
-              duration: 3500,
-              backgroundColor:
-                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
-            }).showToast();
-          } else {
-            return response.blob();
-          }
-        })
-        .then((blob) => {
-          const url = window.URL.createObjectURL(blob);
-          let a = document.createElement("a");
-          a.href = url;
-          a.download = "Sponsorings_" + t.name + ".pdf";
-          document.body.appendChild(a);
-          a.click();
-          a.remove();
-          if (count === teams.length) {
-            toast.hideToast();
-            Toastify({
-              text: $_("pdfs-successfully-generated"),
-              duration: 3500,
-              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
-            }).showToast();
-          }
-        })
-        .catch((err) => {});
-    }
-  }
 </script>
 
 <ConfirmTeamDeletion
@@ -111,69 +55,12 @@
         aria-label={$_('datatable.search')}
         class="gridjs-input gridjs-search-input mb-4" />
       <div class="h-12">
-        {#if current_teams.some((r) => r.is_selected === true)}
+        <GenerateSponsoringContracts
-          <div id="sponsoring:dropdown" class="relative inline-block">
+          bind:sponsoring_contracts_show
-            <div>
+          bind:generate_teams />
-              <button
+        <GenerateRunnerCards
-                on:click={() => {
+          bind:cards_show
-                  sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
+          bind:generate_teams />
-                }}
-                type="button"
-                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
-                id="options-menu"
-                aria-haspopup="true"
-                aria-expanded="true">
-                {$_('generate-sponsoring-contracts')}
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="24"
-                  height="24"
-                  viewBox="0 0 24 24"
-                  class="-mr-1 ml-2 h-5 w-5"><path
-                    fill="none"
-                    d="M0 0h24v24H0z" />
-                  <path
-                    fill="currentColor"
-                    d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
-              </button>
-            </div>
-            {#if sponsoring_contracts_download_open}
-              <div
-                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
-                id="sponsoring:dropdown:menu"
-                on:click_outside={() => {
-                  sponsoring_contracts_download_open = false;
-                }}>
-                <div
-                  class="py-1"
-                  role="menu"
-                  aria-orientation="vertical"
-                  aria-labelledby="options-menu">
-                  <span
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
-                  <button
-                    on:click={() => {
-                      generateSponsoringContract('de');
-                    }}
-                    type="submit"
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                    role="menuitem">
-                    {$_('german')}
-                  </button>
-                  <button
-                    on:click={() => {
-                      generateSponsoringContract('en');
-                    }}
-                    type="submit"
-                    class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900 inline-flex"
-                    role="menuitem">
-                    {$_('english')}
-                  </button>
-                </div>
-              </div>
-            {/if}
-          </div>
-        {/if}
       </div>
       <div
         class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">

src/components/users/AddUserModal.svelte

@@ -5,6 +5,9 @@
   import { UserService } from "@odit/lfk-client-js";
   import isEmail from "validator/es/lib/isEmail";
   import Toastify from "toastify-js";
+  import PasswordStrength, {
+    password_strong_enough,
+  } from "../auth/PasswordStrength.svelte";
   export let modal_open;
   export let current_users;
   let firstname_input;
@@ -28,7 +31,10 @@
   $: isLastnameValid = lastname_input_value.trim().length !== 0;
   $: isFirstnameValid = firstname_input_value.trim().length !== 0;
   $: createbtnenabled =
-    isFirstnameValid && isLastnameValid && isPasswordValid && isEmailValid;
+    isFirstnameValid &&
+    isLastnameValid &&
+    password_strong_enough(password_input_value) &&
+    isEmailValid;
   (function () {
     document.onkeydown = function (e) {
       e = e || window.event;
@@ -203,12 +209,8 @@
                     type="password"
                     name="password"
                     class="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-gray-500 rounded-md p-2" />
-                  {#if !isPasswordValid}
+                  <PasswordStrength
-                    <span
+                    bind:password_change={password_input_value} />
-                      class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
-                      {$_('password-is-required')}
-                    </span>
-                  {/if}
                 </div>
                 <div class="col-span-6">
                   <label

src/index.js

@@ -1,14 +0,0 @@
-import App from './App.svelte';
-
-const app = new App({
-	target: document.body
-});
-
-export default app;
-// HMR
-if (import.meta.hot) {
-	import.meta.hot.accept();
-	import.meta.hot.dispose(() => {
-		app.$destroy();
-	});
-}

src/locales/de.json

@@ -1,375 +1,428 @@
 {
-    "404message": "Die gesuchte Seite wurde leider nicht gefunden.",
+  "404message": "Die gesuchte Seite wurde leider nicht gefunden.",
-    "404title": "Fehler 404",
+  "404title": "Fehler 404",
-    "about": "Über",
+  "about": "Über",
-    "action": "Aktionen",
+  "action": "Aktionen",
-    "active": "Aktiv",
+  "active": "Aktiv",
-    "add-donation": "Sponsoring erstellen",
+  "add-card": "Karte erstellen",
-    "add-donor": "Sponsor:in erstellen",
+  "add-donation": "Sponsoring erstellen",
-    "add-scan": "Scan erstellen",
+  "add-donor": "Sponsor:in erstellen",
-    "add-user-group": "Neue Gruppe erstellen",
+  "add-scan": "Scan erstellen",
-    "add-your-first-contact": "Erstelle den ersten Kontakt",
+  "add-the-first-scanstation": "Erstelle deine erste Scannerstation.",
-    "add-your-first-donor": "Erstelle die erste Sponsor:in",
+  "add-user-group": "Neue Gruppe erstellen",
-    "add-your-first-group": "Erstelle die erste Gruppe",
+  "add-your-first-card": "Erstelle deine erste Läuferkarte",
-    "add-your-first-organization": "Erstelle die erste Organisation",
+  "add-your-first-contact": "Erstelle den ersten Kontakt",
-    "add-your-first-runner": "Erstelle die erste Läufer:in",
+  "add-your-first-donor": "Erstelle die erste Sponsor:in",
-    "add-your-first-team": "Erstelle das erste Team",
+  "add-your-first-group": "Erstelle die erste Gruppe",
-    "add-your-first-track": "Erstelle den ersten Track (Laufstrecke).",
+  "add-your-first-organization": "Erstelle die erste Organisation",
-    "add-your-first-user": "Erstelle die erste Benutzer:in",
+  "add-your-first-runner": "Erstelle die erste Läufer:in",
-    "add-your-fist-scan": "Füge deinene ersten Scan hinzu",
+  "add-your-first-team": "Erstelle das erste Team",
-    "adding-scan": "Scan wird hinzugefügt",
+  "add-your-first-track": "Erstelle den ersten Track (Laufstrecke).",
-    "address": "Adresse",
+  "add-your-first-user": "Erstelle die erste Benutzer:in",
-    "address-is-required": "Du musst eine Adresse angeben",
+  "add-your-fist-donation": "Erstelle dein erstes Sponsoring",
-    "after-deletion-we-cant-restore-your-old-profile": "Nach der Löschung können auch die Admins dein Profil nicht wiederherstellen!",
+  "add-your-fist-scan": "Füge deinen ersten Scan hinzu",
-    "after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that": "Nach der Änderung wirst du abgemeldet - bitte melde dich dann mit deinem neuen Passwort an.",
+  "adding-card": "Karte wird erstellt",
-    "all-associated-donations-will-get-deleted-as-well": "Alle Sponsorings dieser Sponsor:in werden ebenfalls gelöscht",
+  "adding-scan": "Scan wird hinzugefügt",
-    "all-associated-runners-will-be-deleted-too": "Alle zugehörigen Läufer:innen werden auch gelöscht!",
+  "address": "Adresse",
-    "all-associated-teams-and-runners-will-be-deleted-too": "Alle assoziierten Teams und Läufer:innen werden auch gelöscht!",
+  "address-is-required": "Du musst eine Adresse angeben",
-    "amount-per-kilometer": "Betrag pro Kilometer",
+  "after-deletion-we-cant-restore-your-old-profile": "Nach der Löschung können auch die Admins dein Profil nicht wiederherstellen!",
-    "apartment-suite-etc": "Apartment, Wohnung, etc.",
+  "after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that": "Nach der Änderung wirst du abgemeldet - bitte melde dich dann mit deinem neuen Passwort an.",
-    "application_name": "Lauf für Kaya! - Admin",
+  "all-associated-donations-will-get-deleted-as-well": "Alle Sponsorings dieser Sponsor:in werden ebenfalls gelöscht",
-    "applying-changes": "Änderungen anwenden",
+  "all-associated-runners-will-be-deleted-too": "Alle zugehörigen Läufer:innen werden auch gelöscht!",
-    "attention": "Achtung!",
+  "all-associated-teams-and-runners-will-be-deleted-too": "Alle assoziierten Teams und Läufer:innen werden auch gelöscht!",
-    "author": "Autor:in",
+  "amount": "Anzahl",
-    "bitte-bestaetige-diese-laeufer-fuer-den-import": "Bitte die Läufer:innen für den Import bestätigen.",
+  "amount-per-kilometer": "Betrag pro Kilometer",
-    "by": "von",
+  "apartment-suite-etc": "Apartment, Wohnung, etc.",
-    "cancel": "Abbrechen",
+  "application_name": "Lauf für Kaya! - Admin",
-    "cancel-delete": "Löschen abbrechen",
+  "applying-changes": "Änderungen anwenden",
-    "cancel-keep-donor": "Abbrechen, Sponsor:in behalten",
+  "attention": "Achtung!",
-    "cancel-keep-my-profile": "Abbrechen, mein Profil behalten",
+  "author": "Autor:in",
-    "cancel-keep-organization": "Abbrechen und Organisation bearbeiten",
+  "bitte-bestaetige-diese-laeufer-fuer-den-import": "Bitte die Läufer:innen für den Import bestätigen.",
-    "cancel-keep-team": "Abbrechen, Team behalten",
+  "by": "von",
-    "cannot-reset-your-password-directly": "Schade. \nWir können das Passwort leider nicht direkt zurücksetzen.\nBitte sende uns eine Mail in der du deine Identität bestätigst.",
+  "cancel": "Abbrechen",
-    "change-your-password-here": "Hier kannst du dein Passwort ändern",
+  "cancel-delete": "Löschen abbrechen",
-    "changing-your-password": "Passwort wird geändert",
+  "cancel-keep-donor": "Abbrechen, Sponsor:in behalten",
-    "city": "Stadt",
+  "cancel-keep-my-profile": "Abbrechen, mein Profil behalten",
-    "close": "Schließen",
+  "cancel-keep-organization": "Abbrechen und Organisation bearbeiten",
-    "configure-the-tracks-and-minimum-lap-times": "Bearbeite die Tracks und ihre minimale Rundenzeit",
+  "cancel-keep-team": "Abbrechen, Team behalten",
-    "confirm": "Bestätigen",
+  "cannot-reset-your-password-directly": "Schade. \nWir können das Passwort leider nicht direkt zurücksetzen.\nBitte sende uns eine Mail in der du deine Identität bestätigst.",
-    "confirm-delete": "Löschung Bestätigen",
+  "card-added": "Karte wurde hinzugefügt",
-    "confirm-delete-donor-with-all-donations": "Bestätigen, Sponsor:in mit allen Sponsorings löschen",
+  "card-deleted": "Karte gelöscht",
-    "confirm-delete-my-user-profile": "Bestätigung, mein Benutzerprofil löschen",
+  "card-updated": "Karte aktualisiert",
-    "confirm-delete-organization-and-associated-teams-runners": "Bestätugung, lösche die Organisation und alle zugehörigen Teams und Läufer:innen.",
+  "cards": "Läuferkarten",
-    "confirm-delete-team-and-associated-runners": "Bestätigung, lösche das Team mitsamt seinen Läufer:innen.",
+  "change-your-password-here": "Hier kannst du dein Passwort ändern",
-    "confirm-deletion": "Löschung Bestätigen",
+  "changing-your-password": "Passwort wird geändert",
-    "confirm-the-new-password": "Neues Passwort bestätigen",
+  "city": "Stadt",
-    "contact": "Kontakt",
+  "click-to-copy-the-link-into-your-clipboard": "Klicke auf den Link, um ihn in deine Zwischenablage zu kopieren",
-    "contact-deleted": "Kontakt gelöscht",
+  "click-to-copy-token-to-clipboard": "Klicke auf den Token, um ihn in deine Zwischenablage zu kopieren",
-    "contact-information": "Kontaktinformation",
+  "close": "Schließen",
-    "contact-is-being-updated": "Kontakt wird aktualisiert ...",
+  "code": "Code",
-    "contact-is-not-a-member-in-any-group": "Kontakt gehört zu keiner Gruppe",
+  "configure-the-tracks-and-minimum-lap-times": "Bearbeite die Tracks und ihre minimale Rundenzeit",
-    "contacts": "Kontakte",
+  "confirm": "Bestätigen",
-    "contacts-are-being-loaded": "Kontakte werden geladen ...",
+  "confirm-delete": "Löschung Bestätigen",
-    "count_organizations": "Organisationen (Anzahl)",
+  "confirm-delete-donor-with-all-donations": "Bestätigen, Sponsor:in mit allen Sponsorings löschen",
-    "count_teams": "Teams (Anzahl)",
+  "confirm-delete-my-user-profile": "Bestätigung, mein Benutzerprofil löschen",
-    "create": "Erstellen",
+  "confirm-delete-organization-and-associated-teams-runners": "Bestätugung, lösche die Organisation und alle zugehörigen Teams und Läufer:innen.",
-    "create-a-new": "Erstelle eine neue",
+  "confirm-delete-team-and-associated-runners": "Bestätigung, lösche das Team mitsamt seinen Läufer:innen.",
-    "create-a-new-contact": "Kontakt erstellen",
+  "confirm-deletion": "Löschung Bestätigen",
-    "create-a-new-distance-donation": "Erstelle ein neues Sponsoring",
+  "confirm-the-new-password": "Neues Passwort bestätigen",
-    "create-a-new-donor": "Neue Sponsor:in erstellen",
+  "contact": "Kontakt",
-    "create-a-new-fixed-donation": "Erstelle eine neue Festbetragsspende",
+  "contact-deleted": "Kontakt gelöscht",
-    "create-a-new-organization": "Neue Organisation anlegen",
+  "contact-information": "Kontaktinformation",
-    "create-a-new-runner": "Neue Läufer:in erstellen",
+  "contact-is-being-updated": "Kontakt wird aktualisiert ...",
-    "create-a-new-scan-fixed-only": "Neuen Scan erstellen (nur mit Festdistanz)",
+  "contact-is-not-a-member-in-any-group": "Kontakt gehört zu keiner Gruppe",
-    "create-a-new-scanstation": "Neue Station erstellen",
+  "contacts": "Kontakte",
-    "create-a-new-team": "Erstelle ein neues Team",
+  "contacts-are-being-loaded": "Kontakte werden geladen ...",
-    "create-a-new-track": "Neuen Track erstellen",
+  "copied-link-to-clipboard": "Link wurde in die Zwischenablage kopiert",
-    "create-a-new-user": "Neue Benutzer:in anlegen",
+  "copied-token-to-clipboard": "Token wurde in die Zwischenablage kopiert",
-    "create-a-new-user-group": "Erstelle eine neue Gruppe",
+  "count_organizations": "Organisationen (Anzahl)",
-    "create-organization": "Organisation erstellen",
+  "count_teams": "Teams (Anzahl)",
-    "create-team": "Team erstellen",
+  "create": "Erstellen",
-    "create-track": "Track erstellen",
+  "create-a-new": "Erstelle eine neue",
-    "create-user": "Benutzer anlegen",
+  "create-a-new-card": "Neue Läuferkarte erstellen",
-    "credits": "Credits",
+  "create-a-new-contact": "Kontakt erstellen",
-    "csv_import__class": "Klasse",
+  "create-a-new-distance-donation": "Erstelle ein neues Sponsoring",
-    "csv_import__firstname": "Vorname",
+  "create-a-new-donor": "Neue Sponsor:in erstellen",
-    "csv_import__lastname": "Nachname",
+  "create-a-new-fixed-donation": "Erstelle eine neue Festbetragsspende",
-    "csv_import__middlename": "Mittelname",
+  "create-a-new-organization": "Neue Organisation anlegen",
-    "csv_import__team": "Team",
+  "create-a-new-runner": "Neue Läufer:in erstellen",
-    "danger-zone": "Gefahrenzone",
+  "create-a-new-scan-fixed-only": "Neuen Scan erstellen (nur mit Festdistanz)",
-    "dashboard-greeting": "Moin",
+  "create-a-new-scanstation": "Neue Station erstellen",
-    "dashboard-title": "Dashboard",
+  "create-a-new-team": "Erstelle ein neues Team",
-    "datatable": {
+  "create-a-new-track": "Neuen Track erstellen",
-        "search": "🔍 Suche ...",
+  "create-a-new-user": "Neue Benutzer:in anlegen",
-        "an_error_happened_while_fetching_the_data": "Beim Abrufen der Daten ist ein Fehler aufgetreten",
+  "create-a-new-user-group": "Erstelle eine neue Gruppe",
-        "loading": "Wird geladen...",
+  "create-and-generate-pdf": "Erstellen und PDF herunterladen",
-        "next": "Nächste",
+  "create-bulk-blanco-cards": "Blankokarten erstellen",
-        "of": "von",
+  "create-bulk-cards": "Blankokarten erstellen",
-        "previous": "Vorherige",
+  "create-organization": "Organisation erstellen",
-        "to": "bis",
+  "create-team": "Team erstellen",
-        "showing": "Zeige",
+  "create-track": "Track erstellen",
-        "no_matching_records_found": "Keine passenden Einträge gefunden",
+  "create-user": "Benutzer anlegen",
-        "page": "Seite",
+  "create-without-pdf": "Ohne PDF erstellen",
-        "records": "Einträge",
+  "created-blanco-cards": "Blankokarten wurden erstellt",
-        "sort_column_ascending": "Spalte aufsteigend sortieren",
+  "creating-blanco-cards": "Erstelle Blankokarten",
-        "sort_column_descending": "Spalte absteigend sortieren"
+  "credits": "Credits",
-    },
+  "csv_import__class": "Klasse",
-    "delete": "Löschen",
+  "csv_import__firstname": "Vorname",
-    "delete-contact": "Kontakt löschen",
+  "csv_import__lastname": "Nachname",
-    "delete-donation": "Sponsporing löschen",
+  "csv_import__middlename": "Mittelname",
-    "delete-donor": "Sponsor:in löschen",
+  "csv_import__team": "Team",
-    "delete-group": "Gruppe löschen",
+  "danger-zone": "Gefahrenzone",
-    "delete-organization": "Organisation löschen",
+  "dashboard-greeting": "Hallo",
-    "delete-profile": "Profil löschen",
+  "dashboard-title": "Dashboard",
-    "delete-runner": "Läufer:in löschen",
+  "datatable": {
-    "delete-scan": "Scan löschen",
+    "search": "🔍 Suche ...",
-    "delete-station": "Station löschen",
+    "an_error_happened_while_fetching_the_data": "Beim Abrufen der Daten ist ein Fehler aufgetreten",
-    "delete-team": "Team Löschen",
+    "loading": "Wird geladen...",
-    "delete-user": "Benutzer:in löschen",
+    "next": "Nächste",
-    "deleted-scan": "Scan wurde gelöscht",
+    "of": "von",
-    "dependency_name": "Name",
+    "previous": "Vorherige",
-    "description": "Beschreibung",
+    "to": "bis",
-    "description-optional": "Beschreibung (optional)",
+    "showing": "Zeige",
-    "deselect-all": "Alle abwählen",
+    "no_matching_records_found": "Keine passenden Einträge gefunden",
-    "details": "Details",
+    "page": "Seite",
-    "distance": "Distanz",
+    "records": "Einträge",
-    "distance-donation": "Sponsoring",
+    "sort_column_ascending": "Spalte aufsteigend sortieren",
-    "distance-in-km": "Distanz (in KM)",
+    "sort_column_descending": "Spalte absteigend sortieren"
-    "distance-track": "Distanz (+Track)",
+  },
-    "do-you-really-want-to-delete-your-profile": "Möchtest du dein Profil wirklich löschen?",
+  "delete": "Löschen",
-    "do-you-want-to-delete-the-organization-delete_org-name": "Möchtest du die Organisation {orgname} löschen?",
+  "delete-contact": "Kontakt löschen",
-    "do-you-want-to-delete-the-team-delete_team-name": "Möchtest du das Team {teamname} löschen?",
+  "delete-donation": "Sponsporing löschen",
-    "do-you-want-to-delete-this-donor-with-all-related-donations": "Möchtest du diese Sponsor:in mit all ihren Sponsorings löschen?",
+  "delete-donor": "Sponsor:in löschen",
-    "donation-amount": "Sponsoringbetrag",
+  "delete-group": "Gruppe löschen",
-    "donation-amount-must-be-greater-that-0-00eur": "Der Sponsoringbetrag muss größer als 0.00€ sein.",
+  "delete-organization": "Organisation löschen",
-    "donations": "Sponsorings",
+  "delete-profile": "Profil löschen",
-    "donor": "Sponsor:in",
+  "delete-runner": "Läufer:in löschen",
-    "donor-added": "Sponsor:in hinzugefügt",
+  "delete-scan": "Scan löschen",
-    "donor-deleted": "Sponsor:in gelöscht",
+  "delete-station": "Station löschen",
-    "donor-has-no-associated-donations": "Zur Sponsor:in gibt es noch keine Sponsorings",
+  "delete-team": "Team Löschen",
-    "donor-is-being-added": "Sponsor:in wird hinzugefügt...",
+  "delete-user": "Benutzer:in löschen",
-    "donor-is-being-updated": "Sponsor:in wird aktualisiert",
+  "deleted-scan": "Scan wurde gelöscht",
-    "donors": "Sponsor:innen",
+  "dependency_name": "Name",
-    "donors-are-being-loaded": "Sponsor:innen werden geladen",
+  "description": "Beschreibung",
-    "dont-have-your-email-connected": "Deine E-Mail ist nicht verknüpft?",
+  "description-optional": "Beschreibung (optional)",
-    "dont-panic-were-resetting-it": "Keine Panik, wir setzen es zurück ✌",
+  "deselect-all": "Alle abwählen",
-    "e-mail-adress": "E-Mail-Adresse",
+  "details": "Details",
-    "edit": "Bearbeiten",
+  "disabled": "deaktiviert",
-    "edit-permissions": "Berechtigungen bearbeiten",
+  "distance": "Distanz",
-    "email_address_or_username": "E-Mail-Adresse/ Benutzername",
+  "distance-donation": "Sponsoring",
-    "enabled": "aktiviert",
+  "distance-in-km": "Distanz (in KM)",
-    "english": "Englisch",
+  "distance-track": "Distanz (+Track)",
-    "error_on_login": "😢Fehler beim Login",
+  "do-you-really-want-to-delete-your-profile": "Möchtest du dein Profil wirklich löschen?",
-    "erteilte": "Direkt erteilte",
+  "do-you-want-to-delete-the-organization-delete_org-name": "Möchtest du die Organisation {orgname} löschen?",
-    "everything-concerning-your-profile": "Alles zu deinem Profil",
+  "do-you-want-to-delete-the-team-delete_team-name": "Möchtest du das Team {teamname} löschen?",
-    "everything-is-more-fun-together": "Im Team macht's mehr Spaß 🏃‍♂️🏃‍♀️🏃‍♂️",
+  "do-you-want-to-delete-this-donor-with-all-related-donations": "Möchtest du diese Sponsor:in mit all ihren Sponsorings löschen?",
-    "faq": "FAQ",
+  "documentation": "Dokumentation",
-    "filter-by-organization-team": "Filtern nach Organisation / Team",
+  "donation-amount": "Sponsoringbetrag",
-    "first-name": "Vorname",
+  "donation-amount-must-be-greater-that-0-00eur": "Der Sponsoringbetrag muss größer als 0.00€ sein.",
-    "first-name-is-required": "Vorname muss angegeben werden",
+  "donations": "Sponsorings",
-    "first-scan-of-the-day": "Erster Scan des Tages",
+  "donor": "Sponsor:in",
-    "fixed-donation": "Festbetragsspende",
+  "donor-added": "Sponsor:in hinzugefügt",
-    "forgot_password": "Passwort vergessen?",
+  "donor-deleted": "Sponsor:in gelöscht",
-    "geerbte": "geerbte",
+  "donor-has-no-associated-donations": "Zur Sponsor:in gibt es noch keine Sponsorings",
-    "general-stats": "Allgemeine Statistiken",
+  "donor-is-being-added": "Sponsor:in wird hinzugefügt...",
-    "general_promise_error": "😢 Ein unbekannter Fehler ist aufgetreten",
+  "donor-is-being-updated": "Sponsor:in wird aktualisiert",
-    "generate-sponsoring-contract": "Sponsoringvertrag generieren",
+  "donors": "Sponsor:innen",
-    "generate-sponsoring-contracts": "Sponsoringverträge generieren",
+  "donors-are-being-loaded": "Sponsor:innen werden geladen",
-    "generating-pdf": "Pdf wird generiert...",
+  "dont-have-your-email-connected": "Deine E-Mail ist nicht verknüpft?",
-    "generating-pdfs": "PDFs werden generiert...",
+  "dont-panic-were-resetting-it": "Keine Panik, wir setzen es zurück ✌",
-    "generic-ui-logic-error": "Etwas ist in der Benutzeroberfläche schiefgelaufen.",
+  "e-mail-adress": "E-Mail-Adresse",
-    "german": "Deutsch",
+  "edit": "Bearbeiten",
-    "go-to-login": "Zum Login",
+  "edit-a-card": "Läuferkarte bearbeiten",
-    "goback": "Zur Startseite",
+  "edit-permissions": "Berechtigungen bearbeiten",
-    "granted": "Gewährt",
+  "email_address_or_username": "E-Mail-Adresse/ Benutzername",
-    "group": "Gruppe",
+  "enabled": "aktiviert",
-    "group-added": "Gruppe hinzugefügt",
+  "enabled_large": "Aktiviert",
-    "group-is-being-added": "Gruppe wird erstellt",
+  "english": "Englisch",
-    "group-name-is-required": "Der Gruppenname muss angegeben werden.",
+  "error-during-import": "Fehler beim Importieren",
-    "group-updated": "Gruppe aktualisiert",
+  "error-whyile-copying-to-clipboard": "Fehler beim Kopieren in die Zwischenablage",
-    "groups": "Gruppen",
+  "error_on_login": "😢Fehler beim Login",
-    "groups-are-being-loaded": "Gruppen werden geladen",
+  "erteilte": "Direkt erteilte",
-    "home": "Start",
+  "everything-concerning-your-profile": "Alles zu deinem Profil",
-    "icon-image-credits": "Wir möchten uns außerdem für die verwendeten Icons und Bilder bedanken bei:",
+  "everything-is-more-fun-together": "Im Team macht's mehr Spaß 🏃‍♂️🏃‍♀️🏃‍♂️",
-    "import-finished": "Import abgeschlossen",
+  "faq": "FAQ",
-    "import-runners": "Läufer:innen importieren",
+  "filter-by-organization-team": "Filtern nach Organisation / Team",
-    "import__target-organization": "Ziel Organisation",
+  "first-name": "Vorname",
-    "imprint": "Impressum ",
+  "first-name-is-required": "Vorname muss angegeben werden",
-    "imprint-loading": "Impressum lädt...",
+  "first-scan-of-the-day": "Erster Scan des Tages",
-    "inactive": "Inaktiv",
+  "fixed-donation": "Festbetragsspende",
-    "installed-version": "Installierte Version",
+  "forgot_password": "Passwort vergessen?",
-    "internal-error": "Interner Fehler",
+  "geerbte": "geerbte",
-    "invalid": "Ungültig",
+  "general-stats": "Allgemeine Statistiken",
-    "invalid-mail-reset": "Das ist keine gültige E-Mail",
+  "general_promise_error": "😢 Ein unbekannter Fehler ist aufgetreten",
-    "laeufer-hinzufuegen": "Läufer:in hinzufügen",
+  "generate-runnercards": "Läuferkarten generieren",
-    "laeufer-importieren": "Läufer:innen importieren",
+  "generate-sponsoring-contract": "Sponsoringvertrag generieren",
-    "laptime": "Rundenzeit",
+  "generate-sponsoring-contracts": "Sponsoringverträge generieren",
-    "last-name": "Nachname",
+  "generating-pdf": "Pdf wird generiert...",
-    "last-name-is-required": "Nachname muss angegeben werden",
+  "generating-pdfs": "PDFs werden generiert...",
-    "lfk-is-os": "Das \"Lauf für Kaya!\" Frontend ist (wie alle anderen Projekte für den \"LfK!\" auch) ein OpenSource Projekt.",
+  "generic-ui-logic-error": "Etwas ist in der Benutzeroberfläche schiefgelaufen.",
-    "license": "Lizenz",
+  "german": "Deutsch",
-    "licenses-are-being-loaded": "Lizenzen werden geladen...",
+  "go-to-login": "Zum Login",
-    "loading-contact-details": "Kontaktdaten werden geladen ...",
+  "goback": "Zur Startseite",
-    "loading-donation-details": "Lade Sponsoringdetails",
+  "granted": "Gewährt",
-    "loading-donor-details": "Lade Details",
+  "group": "Gruppe",
-    "loading-group-detail": "Lade Gruppendetails...",
+  "group-added": "Gruppe hinzugefügt",
-    "loading-profile-data": "Lade Profildaten",
+  "group-is-being-added": "Gruppe wird erstellt",
-    "loading-runners": "Läufer:innen werden geladen...",
+  "group-name-is-required": "Der Gruppenname muss angegeben werden.",
-    "loading-station-details": "Lade Scanstation-Details ...",
+  "group-updated": "Gruppe aktualisiert",
-    "log_in": "Anmelden",
+  "groups": "Gruppen",
-    "log_in_to_your_account": "Bitte melde dich an",
+  "groups-are-being-loaded": "Gruppen werden geladen",
-    "login_is_checked": "Login wird überprüft",
+  "home": "Start",
-    "logout": "Abmelden",
+  "icon-image-credits": "Wir möchten uns außerdem für die verwendeten Icons und Bilder bedanken bei:",
-    "mail-validation-in-progress": "E-Mail Verifizierung läuft... ",
+  "if-you-want-to-create-multiple-blanco-cards-try-the-add-bulk-button": "Wenn du mehrere Blankokarten erstellen willst, nutze doch den \"Blankokarten erstellen\" Knopf.",
-    "manage-admin-users": "Nutzer verwalten",
+  "import-finished": "Import abgeschlossen",
-    "middle-name": "Mittelname",
+  "import-runners": "Läufer:innen importieren",
-    "minimum-lap-time-in-s": "Minimale Rundenzeit (in Sekunden)",
+  "import__target-organization": "Ziel Organisation",
-    "minimum-lap-time-must-be-a-positive-number-or-0": "Die minimale Rundenzeit muss eine positive Zahl oder 0 sein",
+  "imprint": "Impressum ",
-    "name": "Name",
+  "imprint-loading": "Impressum lädt...",
-    "name-is-required": "Der Gruppenname muss angegeben werden",
+  "inactive": "Inaktiv",
-    "new-password": "Neues Passwort",
+  "installed-version": "Installierte Version",
-    "no-contact-found": "Keine Kontakte gefunden",
+  "internal-error": "Interner Fehler",
-    "no-contact-selected": "Kein Kontakt ausgewählt",
+  "invalid": "Ungültig",
-    "no-contact-specified": "Kein Kontakt angegeben",
+  "invalid-mail-reset": "Das ist keine gültige E-Mail",
-    "no-donors-found": "Keine Spender:innen gefunden",
+  "just-enter-how-many-you-want-and-the-system-will-create-them": "Gebe einfach ein, wie viele Blankokarten das System erstellen soll.",
-    "no-license-text-could-be-found": "Kein Lizenz-Text gefunden 😢",
+  "laeufer-hinzufuegen": "Läufer:in hinzufügen",
-    "no-organization-or-team-found": "Keine Organisationen oder Teams gefunden",
+  "laeufer-importieren": "Läufer:innen importieren",
-    "no-organization-specified": "Keine Organisation angegeben",
+  "laptime": "Rundenzeit",
-    "no-organizations-found": "Keine Organisationen gefunden",
+  "last-name": "Nachname",
-    "no-runners-found": "Keine Läufer:innen gefunden",
+  "last-name-is-required": "Nachname muss angegeben werden",
-    "no-tracks-added-yet": "Es wurden noch keine Tracks erstellt.",
+  "lfk-is-os": "Das \"Lauf für Kaya!\" Frontend ist (wie alle anderen Projekte für den \"LfK!\" auch) ein OpenSource Projekt.",
-    "organization": "Organisation",
+  "license": "Lizenz",
-    "organization-added": "Organisation hinzugefügt",
+  "licenses-are-being-loaded": "Lizenzen werden geladen...",
-    "organization-deleted": "Organisation gelöscht",
+  "loading-cards": "Läuferkarten werden geladen",
-    "organization-detail-is-being-loaded": "Organisationsdetails werden geladen ...",
+  "loading-contact-details": "Kontaktdaten werden geladen ...",
-    "organization-is-being-added": "Organisation wird hinzugefügt ...",
+  "loading-donation-details": "Lade Sponsoringdetails",
-    "organization-name-is-required": "Der Name muss angegeben werden",
+  "loading-donor-details": "Lade Details",
-    "organizations": "Organisationen",
+  "loading-group-detail": "Lade Gruppendetails...",
-    "organizations-are-being-loaded": "Organisationen werden geladen ...",
+  "loading-profile-data": "Lade Profildaten",
-    "orgs": "Organisationen",
+  "loading-runners": "Läufer:innen werden geladen...",
-    "oss_credit_description": "Wir verwenden eine Menge Open Source-Software bei diesen Projekten und möchten uns bei den folgenden Projekten und Mitwirkenden bedanken, die dazu beitragen, Open Source großartig zu machen!",
+  "loading-station-details": "Lade Scanstation-Details ...",
-    "password": "Passwort",
+  "log_in": "Anmelden",
-    "password-changed": "Passwort wurde aktualisiert!",
+  "log_in_to_your_account": "Bitte melde dich an",
-    "password-is-required": "Passwort muss angegeben werden",
+  "login_is_checked": "Login wird überprüft",
-    "password-reset-failed": "Passwort zurücksetzen ist fehlgeschlagen!",
+  "logout": "Abmelden",
-    "password-reset-in-progress": "Passwort wird zurückgesetzt...",
+  "mail-validation-in-progress": "E-Mail Verifizierung läuft... ",
-    "password-reset-mail-sent": "Passwort-Reset Mail wurde an \"{usersEmail}\" geschickt.",
+  "manage-admin-users": "Nutzer verwalten",
-    "password-reset-successful": "Passwort erfolgreich zurückgesetzt!",
+  "middle-name": "Mittelname",
-    "passwords-dont-match": "Die Passwörter stimmen nicht überein.",
+  "minimum-lap-time-in-s": "Minimale Rundenzeit (in Sekunden)",
-    "pdf-generation-failed": "PDF Generierung fehlgeschlagen!",
+  "minimum-lap-time-must-be-a-positive-number-or-0": "Die minimale Rundenzeit muss eine positive Zahl oder 0 sein",
-    "pdf-successfully-generated": "PDF wurde erfolgreich generiert!",
+  "must-be-at-least-10-characters-long": "Passwort muss mindestens 10 Zeichen lang sein!",
-    "pdfs-successfully-generated": "Alle PDFs wurden generiert!",
+  "must-contain-a-lowercase-letter": "Passwort muss einen Großbuchstaben enthalten!",
-    "per-kilometer": "pro Kilometer",
+  "must-contain-a-number": "Passwort muss eine Zahl enthalten!",
-    "permissions": "Berechtigungen",
+  "must-contain-a-uppercase-letter": "Passwort muss einen Kleinbuchstaben enthalten!",
-    "permissions-updated": "Berechtigungen aktualisiert!",
+  "name": "Name",
-    "phone": "Telefon",
+  "name-is-required": "Der Gruppenname muss angegeben werden",
-    "please-provide-a-password": "Bitte gebe ein Passwort an...",
+  "new-password": "Neues Passwort",
-    "please-provide-the-nessecary-information-to-add-a-new-donor": "Bitte mach die Notwendigen Angaben, um eine neue Sponsor:in zu erstellen",
+  "no-contact-found": "Keine Kontakte gefunden",
-    "please-provide-the-nessecary-information-to-create-a-new-donation": "Bitte gebe alle für das Sponsoring notwendigen Daten an.",
+  "no-contact-selected": "Kein Kontakt ausgewählt",
-    "please-provide-the-nessecary-information-to-create-a-new-scan": "Bitte gebe alle notwendigen Informationen an, um einen neuen Scan zu erstellen.",
+  "no-contact-specified": "Kein Kontakt angegeben",
-    "please-provide-the-required-csv-xlsx-file": "Bitte eine CSV oder XLSX Datei hochladen.",
+  "no-donors-found": "Keine Spender:innen gefunden",
-    "please-provide-the-required-information-for-creating-a-new-user-group": "Bitte gebe alle für eine neue Gruppe notwendigen Informationen an.",
+  "no-license-text-could-be-found": "Kein Lizenz-Text gefunden 😢",
-    "please-provide-the-required-information-to-add-a-new-contact": "Bitte gebe alle nötigen Informationen an, im den neuen Kontakt zu erstellen.",
+  "no-organization-or-team-found": "Keine Organisationen oder Teams gefunden",
-    "please-provide-the-required-information-to-add-a-new-organization": "Bitte gebe alle nötigen Informationen an, im die neue Organisation zu erstellen.",
+  "no-organization-specified": "Keine Organisation angegeben",
-    "please-provide-the-required-information-to-add-a-new-runner": "Bitte die benötigten Informationen angeben.",
+  "no-organizations-found": "Keine Organisationen gefunden",
-    "please-provide-the-required-information-to-add-a-new-team": "Bitte gebe alle nötigen Informationen an, im das neue Team zu erstellen.",
+  "no-runners-found": "Keine Läufer:innen gefunden",
-    "please-provide-the-required-information-to-add-a-new-track": "Bitte die benötigten Informationen angeben.",
+  "no-tracks-added-yet": "Es wurden noch keine Tracks erstellt.",
-    "please-provide-the-required-information-to-add-a-new-user": "Bitte gebe alle nötigen Informationen an, im die neue Benutzer:in zu erstellen.",
+  "non-blanko": "Keine/Blankokarte",
-    "please-request-a-new-reset-mail": "Bitte eine neue Passwortreset-Mail anfordern...",
+  "organization": "Organisation",
-    "privacy": "Datenschutz",
+  "organization-added": "Organisation hinzugefügt",
-    "privacy-loading": "Datenschutzerklärung lädt...",
+  "organization-deleted": "Organisation gelöscht",
-    "profile": "Profil",
+  "organization-detail-is-being-loaded": "Organisationsdetails werden geladen ...",
-    "profile-picture": "Profilbild",
+  "organization-is-being-added": "Organisation wird hinzugefügt ...",
-    "profile-updated": "Profil wurde aktualisiert!",
+  "organization-name-is-required": "Der Name muss angegeben werden",
-    "read-license": "Lizenz-Text lesen",
+  "organizations": "Organisationen",
-    "receipt-needed": "Spendenquittung benötigt",
+  "organizations-are-being-loaded": "Organisationen werden geladen ...",
-    "repo_link": "Link",
+  "orgs": "Organisationen",
-    "request-a-new-reset-mail": "Neue Reset-Mail anfordern",
+  "oss_credit_description": "Wir verwenden eine Menge Open Source-Software bei diesen Projekten und möchten uns bei den folgenden Projekten und Mitwirkenden bedanken, die dazu beitragen, Open Source großartig zu machen!",
-    "reset-my-password": "Passwort zurücksetzen",
+  "password": "Passwort",
-    "reset-password": "Passwort zurücksetzen",
+  "password-changed": "Passwort wurde aktualisiert!",
-    "runner": "Läufer:in",
+  "password-is-required": "Passwort muss angegeben werden",
-    "runner-added": "Läufer:in hinzugefügt",
+  "password-reset-failed": "Passwort zurücksetzen ist fehlgeschlagen!",
-    "runner-import": "Läufer:innen Import",
+  "password-reset-in-progress": "Passwort wird zurückgesetzt...",
-    "runner-is-being-added": "Läufer:in wird hinzugefügt...",
+  "password-reset-mail-sent": "Passwort-Reset Mail wurde an \"{usersEmail}\" geschickt.",
-    "runner-updated": "Läufer:in aktualisiert!",
+  "password-reset-successful": "Passwort erfolgreich zurückgesetzt!",
-    "runnerimport_verify_runners_org": "Bitte die Läufer:innen für den Import in die Organisation \"{org_name}\" bestätigen",
+  "passwords-dont-match": "Die Passwörter stimmen nicht überein!",
-    "runners": "Läufer",
+  "pdf-generation-failed": "PDF Generierung fehlgeschlagen!",
-    "runners-are-being-imported": "Läufer:innen werden importiert ...",
+  "pdf-successfully-generated": "PDF wurde erfolgreich generiert!",
-    "runners-are-being-loaded": "Läufer:innen werden geladen ...",
+  "pdfs-successfully-generated": "Alle PDFs wurden generiert!",
-    "save": "Speichern",
+  "per-kilometer": "pro Kilometer",
-    "save-changes": "Änderungen speichern",
+  "permissions": "Berechtigungen",
-    "scan-added": "Scan hinzugefügt",
+  "permissions-updated": "Berechtigungen aktualisiert!",
-    "scan-is-being-updated": "Scan wird aktualisiert",
+  "phone": "Telefon",
-    "scan-with-fixed-distance": "Scan mit Festdistanz",
+  "please-copy-the-token-and-store-it-somewhere-save": "Bitte kopiere dir den Token und bewahre ihn gut auf.",
-    "scans": "Scans",
+  "please-provide-a-password": "Bitte gebe ein Passwort an...",
-    "scans-are-being-loaded": "Scans werden geladen",
+  "please-provide-the-nessecary-information-to-add-a-new-donor": "Bitte mach die Notwendigen Angaben, um eine neue Sponsor:in zu erstellen",
-    "scanstation": "Scanner Station",
+  "please-provide-the-nessecary-information-to-create-a-new-donation": "Bitte gebe alle für das Sponsoring notwendigen Daten an.",
-    "scanstations": "Scanner Stationen",
+  "please-provide-the-nessecary-information-to-create-a-new-scan": "Bitte gebe alle notwendigen Informationen an, um einen neuen Scan zu erstellen.",
-    "scanstations-are-being-loaded": "Scannerstationen werden geladen...",
+  "please-provide-the-required-csv-xlsx-file": "Bitte eine CSV oder XLSX Datei hochladen.",
-    "search-for-an-organization-by-name-or-id": "Suche eine Organisation (via Name oder Id)",
+  "please-provide-the-required-information-for-creating-a-new-user-group": "Bitte gebe alle für eine neue Gruppe notwendigen Informationen an.",
-    "search-for-an-organization-or-team-by-name-or-id": "Suche eine Organisation oder ein Team (via Name oder Id)",
+  "please-provide-the-required-information-to-add-a-new-contact": "Bitte gebe alle nötigen Informationen an, im den neuen Kontakt zu erstellen.",
-    "search-for-donor-name-or-id": "Suche eine Spender:in (via Name oder Id)",
+  "please-provide-the-required-information-to-add-a-new-organization": "Bitte gebe alle nötigen Informationen an, im die neue Organisation zu erstellen.",
-    "search-for-permission": "Berechtigungen durchsuchen",
+  "please-provide-the-required-information-to-add-a-new-runner": "Bitte die benötigten Informationen angeben.",
-    "search-for-runner-by-name-or-id": "Suche eine Läufer:in (via Name oder Id)",
+  "please-provide-the-required-information-to-add-a-new-team": "Bitte gebe alle nötigen Informationen an, im das neue Team zu erstellen.",
-    "select-all": "Alle auswählen",
+  "please-provide-the-required-information-to-add-a-new-track": "Bitte die benötigten Informationen angeben.",
-    "select-language": "Sprache auswählen",
+  "please-provide-the-required-information-to-add-a-new-user": "Bitte gebe alle nötigen Informationen an, im die neue Benutzer:in zu erstellen.",
-    "send-a-mail-to-lfk-odit-services": "Sende eine Mail an lfk@odit.services",
+  "please-provide-the-required-information-to-create-a-new-scanstation": "Bitte gebe alle für eine Scannerstation notwendigen Informationen an",
-    "set-the-user-active-inactive": "Den Benutzer auf (in)aktiv setzen",
+  "please-request-a-new-reset-mail": "Bitte eine neue Passwortreset-Mail anfordern...",
-    "settings": "Einstellungen",
+  "privacy": "Datenschutz",
-    "settings-for-your-profile": "Die Einstellungen deines Accounts",
+  "privacy-loading": "Datenschutzerklärung lädt...",
-    "something-about-the-group": "Infos zur Gruppe",
+  "profile": "Profil",
-    "stats-are-being-loaded": "Die Statistiken werden geladen...",
+  "profile-picture": "Profilbild",
-    "status": "Status",
+  "profile-updated": "Profil wurde aktualisiert!",
-    "stuff-that-could-harm-your-profile": "Einstellungen, die deinem Profil nachhaltig schaden können",
+  "read-license": "Lizenz-Text lesen",
-    "successful-password-reset": "Passwort erfolgreich zurückgesetzt!",
+  "receipt-needed": "Spendenquittung benötigt",
-    "team": "Team",
+  "repo_link": "Link",
-    "team-detail-is-being-loaded": "Team wird geladen...",
+  "request-a-new-reset-mail": "Neue Reset-Mail anfordern",
-    "team-name": "Teamname",
+  "reset-my-password": "Passwort zurücksetzen",
-    "team-name-is-required": "Teamname ist erforderlich",
+  "reset-password": "Passwort zurücksetzen",
-    "teams": "Teams",
+  "runner": "Läufer:in",
-    "teams-are-being-loaded": "Teams werden geladen ...",
+  "runner-added": "Läufer:in hinzugefügt",
-    "the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number": "Die angegebene Telefonnummer ist nicht korrekt. <br /> Bitte gebe eine Telefonnummer im internationalen Format an...",
+  "runner-import": "Läufer:innen Import",
-    "the-scans-distance-must-be-greater-than-0m": "Die Distanz muss größer als 0m sein.",
+  "runner-is-being-added": "Läufer:in wird hinzugefügt...",
-    "there-are-no-contacts-added-yet": "Es wurden noch keine Kontakte hinzugefügt.",
+  "runner-updated": "Läufer:in aktualisiert!",
-    "there-are-no-donors-yet": "Es gibt noch keine Sponsor:innen",
+  "runnerimport_verify_runners_org": "Bitte die Läufer:innen für den Import in die Organisation \"{org_name}\" bestätigen",
-    "there-are-no-groups-yet": "Es gibt noch keine Gruppen",
+  "runners": "Läufer",
-    "there-are-no-organizations-added-yet": "Es wurden noch keine Organisationen hinzugefügt.",
+  "runners-are-being-imported": "Läufer:innen werden importiert ...",
-    "there-are-no-runners-added-yet": "Es wurden noch keine Läufer:innen hinzugefügt.",
+  "runners-are-being-loaded": "Läufer:innen werden geladen ...",
-    "there-are-no-scans-yet": "Es gibt noch keine scans",
+  "save": "Speichern",
-    "there-are-no-teams-added-yet": "Es wurden noch keine Teams hinzugefügt.",
+  "save-changes": "Änderungen speichern",
-    "there-are-no-users-added-yet": "Es wurden noch keine Benutzer hinzugefügt.",
+  "scan-added": "Scan hinzugefügt",
-    "this-might-take-a-moment": "Das könnte einen kleinen Moment dauern",
+  "scan-is-being-updated": "Scan wird aktualisiert",
-    "this-scanstation-is": "Diese Station ist",
+  "scan-with-fixed-distance": "Scan mit Festdistanz",
-    "total-distance": "gelaufene Strecke",
+  "scans": "Scans",
-    "total-donation-amount": "Gesamtbetrag",
+  "scans-are-being-loaded": "Scans werden geladen",
-    "total-donations": "Spendensumme",
+  "scanstation": "Scanner Station",
-    "total-scans": "gesamte Scans",
+  "scanstation-added": "Station wurde erstellt",
-    "track": "Track",
+  "scanstation-is-being-added": "Scannerstation wird angelegt...",
-    "track-added": "Track hinzugefügt",
+  "scanstations": "Scanner Stationen",
-    "track-data-is-being-loaded": "Trackdaten werden geladen",
+  "scanstations-are-being-loaded": "Scannerstationen werden geladen...",
-    "track-is-being-added": "Track wird hinzugefügt...",
+  "search-for-an-organization-by-name-or-id": "Suche eine Organisation (via Name oder Id)",
-    "track-length-in-m": "Tracklänge (in Metern)",
+  "search-for-an-organization-or-team-by-name-or-id": "Suche eine Organisation oder ein Team (via Name oder Id)",
-    "track-length-must-be-greater-than-0": "Die Länge muss größer als 0 (Meter) sein",
+  "search-for-donor-name-or-id": "Suche eine Spender:in (via Name oder Id)",
-    "track-name": "Trackname",
+  "search-for-permission": "Berechtigungen durchsuchen",
-    "track-name-must-not-be-empty": "Der Name muss angegeben werden",
+  "search-for-runner-by-name-or-id": "Suche eine Läufer:in (via Name oder Id)",
-    "tracks": "Tracks",
+  "select-all": "Alle auswählen",
-    "update-password": "Passwort ändern",
+  "select-language": "Sprache auswählen",
-    "updated-contact": "Kontakt aktualisiert!",
+  "selfservice-registration": "Selfservice Registrierung",
-    "updated-donor": "Sponsor:in wurde aktualisiert",
+  "send-a-mail-to-lfk-odit-services": "Sende eine Mail an lfk@odit.services",
-    "updated-organization": "Organisation wurde aktualisiert",
+  "set-the-user-active-inactive": "Den Benutzer auf (in)aktiv setzen",
-    "updated-scan": "Scan wurde aktualisiert",
+  "settings": "Einstellungen",
-    "updateing-group": "Gruppe wird aktualisiert...",
+  "settings-for-your-profile": "Die Einstellungen deines Accounts",
-    "updating-organization": "Organisation wird aktualisiert",
+  "something-about-the-group": "Infos zur Gruppe",
-    "updating-permissions": "Berechtigungen werden aktualisiert...",
+  "stats-are-being-loaded": "Die Statistiken werden geladen...",
-    "updating-runner": "Läufer:in wird aktualisiert.",
+  "status": "Status",
-    "updating-user": "Benutzer:in wird aktualisiert...",
+  "stuff-that-could-harm-your-profile": "Einstellungen, die deinem Profil nachhaltig schaden können",
-    "updating-your-profile": "Profil wird aktualisiert...",
+  "successful-password-reset": "Passwort erfolgreich zurückgesetzt!",
-    "user-added": "Benutzer hinzugefügt",
+  "team": "Team",
-    "user-groups": "Benutzergruppen",
+  "team-detail-is-being-loaded": "Team wird geladen...",
-    "user-is-being-added": "Benutzer wird hinzugefügt ...",
+  "team-name": "Teamname",
-    "user-updated": "Benutzer:in wurde aktualisiert",
+  "team-name-is-required": "Teamname ist erforderlich",
-    "username": "Benutzername",
+  "teams": "Teams",
-    "users": "Benutzer",
+  "teams-are-being-loaded": "Teams werden geladen ...",
-    "valid": "Gültig",
+  "the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number": "Die angegebene Telefonnummer ist nicht korrekt. <br /> Bitte gebe eine Telefonnummer im internationalen Format an...",
-    "valid-city-is-required": "Du musst eine Stadt angeben",
+  "the-scans-distance-must-be-greater-than-0m": "Die Distanz muss größer als 0m sein.",
-    "valid-email-is-required": "Es wird eine valide E-Mail Adresse benötigt",
+  "the-scanstations-api-token-will-only-get-displayed-once-you-wont-be-able-to-change-or-view-it-again": "Der Scannerstation Token wird nur einmal angezeigt - du kannst ihn nicht ändern oder ihn dir nochmal anzeigen lassen!",
-    "valid-international-phone-number-is-required": "Du musst eine Telefonnummer im internationalen Format angeben...",
+  "there-are-no-cards-yet": "Es gibt noch keine Läuferkarten.",
-    "valid-zipcode-postal-code-is-required": "Du musst eine valide Postleitzahl angeben",
+  "there-are-no-contacts-added-yet": "Es wurden noch keine Kontakte hinzugefügt.",
-    "verfuegbare": "Verfügbar",
+  "there-are-no-donations-yet": "Es gibt noch keine Sponsorings",
-    "welcome_wavinghand": "Willkommen 👋",
+  "there-are-no-donors-yet": "Es gibt noch keine Sponsor:innen",
-    "yes-i-copied-the-token": "Ja, ich habe den Token kopiert",
+  "there-are-no-groups-yet": "Es gibt noch keine Gruppen",
-    "you-are-going-to-loose-all-permissions-and-access-to-the-runner-system": "Du wirst all deine Berechtigungen und den Zugriff aufs Läufersystem verlieren!",
+  "there-are-no-organizations-added-yet": "Es wurden noch keine Organisationen hinzugefügt.",
-    "you-can-now-use-your-new-password-to-log-in-to-your-account": "Du kannst dich jetzt mit deinem neuen Passwort anmelden! 🎉",
+  "there-are-no-runners-added-yet": "Es wurden noch keine Läufer:innen hinzugefügt.",
-    "you-have-to-provide-an-organization": "Du musst eine Organisation angeben",
+  "there-are-no-scans-yet": "Es gibt noch keine Scans",
-    "zip-postal-code": "Postleitzahl"
+  "there-are-no-teams-added-yet": "Es wurden noch keine Teams hinzugefügt.",
-}
+  "there-are-no-users-added-yet": "Es wurden noch keine Benutzer hinzugefügt.",
+  "this-card-is": "Diese Karte ist",
+  "this-might-take-a-moment": "Das könnte einen kleinen Moment dauern",
+  "this-scanstation-is": "Diese Station ist",
+  "token": "Token",
+  "total-distance": "gelaufene Strecke",
+  "total-donation-amount": "Gesamtbetrag",
+  "total-donations": "Spendensumme",
+  "total-scans": "gesamte Scans",
+  "track": "Track",
+  "track-added": "Track hinzugefügt",
+  "track-data-is-being-loaded": "Trackdaten werden geladen",
+  "track-is-being-added": "Track wird hinzugefügt...",
+  "track-length-in-m": "Tracklänge (in Metern)",
+  "track-length-must-be-greater-than-0": "Die Länge muss größer als 0 (Meter) sein",
+  "track-name": "Trackname",
+  "track-name-must-not-be-empty": "Der Name muss angegeben werden",
+  "tracks": "Tracks",
+  "update-password": "Passwort ändern",
+  "updated-contact": "Kontakt aktualisiert!",
+  "updated-donor": "Sponsor:in wurde aktualisiert",
+  "updated-organization": "Organisation wurde aktualisiert",
+  "updated-scan": "Scan wurde aktualisiert",
+  "updateing-group": "Gruppe wird aktualisiert...",
+  "updating-card": "Karte wird aktualisiert",
+  "updating-organization": "Organisation wird aktualisiert",
+  "updating-permissions": "Berechtigungen werden aktualisiert...",
+  "updating-runner": "Läufer:in wird aktualisiert.",
+  "updating-user": "Benutzer:in wird aktualisiert...",
+  "updating-your-profile": "Profil wird aktualisiert...",
+  "user-added": "Benutzer hinzugefügt",
+  "user-groups": "Benutzergruppen",
+  "user-is-being-added": "Benutzer wird hinzugefügt ...",
+  "user-updated": "Benutzer:in wurde aktualisiert",
+  "username": "Benutzername",
+  "users": "Benutzer",
+  "valid": "Gültig",
+  "valid-city-is-required": "Du musst eine Stadt angeben",
+  "valid-email-is-required": "Es wird eine valide E-Mail Adresse benötigt",
+  "valid-international-phone-number-is-required": "Du musst eine Telefonnummer im internationalen Format angeben...",
+  "valid-zipcode-postal-code-is-required": "Du musst eine valide Postleitzahl angeben",
+  "verfuegbare": "Verfügbar",
+  "welcome_wavinghand": "Willkommen 👋",
+  "yes-i-copied-the-token": "Ja, ich habe den Token kopiert",
+  "you-are-going-to-loose-all-permissions-and-access-to-the-runner-system": "Du wirst all deine Berechtigungen und den Zugriff aufs Läufersystem verlieren!",
+  "you-can-now-use-your-new-password-to-log-in-to-your-account": "Du kannst dich jetzt mit deinem neuen Passwort anmelden! 🎉",
+  "you-can-provide-a-runner-but-you-dont-have-to": "Du kannst eine Läufer:in angeben, musst aber nicht.",
+  "you-dont-have-any-scanstations-yet": "Es gibt noch keine Scannerstationen",
+  "you-have-to-provide-an-organization": "Du musst eine Organisation angeben",
+  "you-have-to-save-your-changes-to-generate-a-link": "Du musst deine Änderungen speichern, um einen Link zu generieren.",
+  "you-must-create-at-least-one-card-or-cancel": "Du musst mindestens eine Blankokarte erstellen (oder abbrechen).",
+  "zip-postal-code": "Postleitzahl",
+  "generate-runner-certificates": "Urkunden generieren"
+}

src/locales/en.json

@@ -1,375 +1,429 @@
 {
-    "404message": "Sorry, the page you are looking for could not be found.",
+  "404message": "Sorry, the page you are looking for could not be found.",
-    "404title": "Error 404",
+  "404title": "Error 404",
-    "about": "About",
+  "about": "About",
-    "action": "Action",
+  "action": "Action",
-    "active": "Active",
+  "active": "Active",
-    "add-donation": "Add donation",
+  "add-card": "Add Card",
-    "add-donor": "add donor",
+  "add-donation": "Add donation",
-    "add-scan": "Add scan",
+  "add-donor": "add donor",
-    "add-user-group": "Add User Group",
+  "add-scan": "Add scan",
-    "add-your-first-contact": "Add your first contact",
+  "add-the-first-scanstation": "Add your first scanstation.",
-    "add-your-first-donor": "add your first donor",
+  "add-user-group": "Add User Group",
-    "add-your-first-group": "Add your first group",
+  "add-your-first-card": "Add your first card",
-    "add-your-first-organization": "Add your first organization",
+  "add-your-first-contact": "Add your first contact",
-    "add-your-first-runner": "Add your first runner",
+  "add-your-first-donor": "add your first donor",
-    "add-your-first-team": "Add your first team",
+  "add-your-first-group": "Add your first group",
-    "add-your-first-track": "Add your first track.",
+  "add-your-first-organization": "Add your first organization",
-    "add-your-first-user": "Add your first user",
+  "add-your-first-runner": "Add your first runner",
-    "add-your-fist-scan": "Add your fist scan",
+  "add-your-first-team": "Add your first team",
-    "adding-scan": "Adding Scan",
+  "add-your-first-track": "Add your first track.",
-    "address": "Address",
+  "add-your-first-user": "Add your first user",
-    "address-is-required": "Address is required",
+  "add-your-fist-donation": "Add your fist donation",
-    "after-deletion-we-cant-restore-your-old-profile": "After deletion we can't restore your old profile!",
+  "add-your-fist-scan": "Add your fist scan",
-    "after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that": "After the update you'll get logged out - Please login with your new password after that.",
+  "adding-card": "Adding Card",
-    "all-associated-donations-will-get-deleted-as-well": "All associated donations will get deleted as well",
+  "adding-scan": "Adding Scan",
-    "all-associated-runners-will-be-deleted-too": "All associated runners will be deleted too!",
+  "address": "Address",
-    "all-associated-teams-and-runners-will-be-deleted-too": "All associated teams and runners will be deleted too!",
+  "address-is-required": "Address is required",
-    "amount-per-kilometer": "Amount per kilometer",
+  "after-deletion-we-cant-restore-your-old-profile": "After deletion we can't restore your old profile!",
-    "apartment-suite-etc": "Apartment, suite, etc.",
+  "after-the-update-youll-get-logged-out-please-login-with-your-new-password-after-that": "After the update you'll get logged out - Please login with your new password after that.",
-    "application_name": "Lauf für Kaya! - Admin",
+  "all-associated-donations-will-get-deleted-as-well": "All associated donations will get deleted as well",
-    "applying-changes": "Applying Changes",
+  "all-associated-runners-will-be-deleted-too": "All associated runners will be deleted too!",
-    "attention": "Attention!",
+  "all-associated-teams-and-runners-will-be-deleted-too": "All associated teams and runners will be deleted too!",
-    "author": "Author",
+  "amount": "Amount",
-    "bitte-bestaetige-diese-laeufer-fuer-den-import": "Please confirm these runners for import.",
+  "amount-per-kilometer": "Amount per kilometer",
-    "by": "by",
+  "apartment-suite-etc": "Apartment, suite, etc.",
-    "cancel": "Cancel",
+  "application_name": "Lauf für Kaya! - Admin",
-    "cancel-delete": "Cancel Delete",
+  "applying-changes": "Applying Changes",
-    "cancel-keep-donor": "Cancel, keep donor",
+  "attention": "Attention!",
-    "cancel-keep-my-profile": "Cancel, keep my profile",
+  "author": "Author",
-    "cancel-keep-organization": "Cancel, keep organization",
+  "bitte-bestaetige-diese-laeufer-fuer-den-import": "Please confirm these runners for import.",
-    "cancel-keep-team": "Cancel, keep team",
+  "by": "by",
-    "cannot-reset-your-password-directly": "Bummer. We unfortunately cannot reset your password directly. Please send us a mail and confirm your identity",
+  "cancel": "Cancel",
-    "change-your-password-here": "Change your password here",
+  "cancel-delete": "Cancel Delete",
-    "changing-your-password": "Changing your password",
+  "cancel-keep-donor": "Cancel, keep donor",
-    "city": "City",
+  "cancel-keep-my-profile": "Cancel, keep my profile",
-    "close": "Close",
+  "cancel-keep-organization": "Cancel, keep organization",
-    "configure-the-tracks-and-minimum-lap-times": "configure the tracks & minimum lap times",
+  "cancel-keep-team": "Cancel, keep team",
-    "confirm": "Confirm",
+  "cannot-reset-your-password-directly": "Bummer. We unfortunately cannot reset your password directly. Please send us a mail and confirm your identity",
-    "confirm-delete": "Confirm Delete",
+  "card-added": "Card added",
-    "confirm-delete-donor-with-all-donations": "Confirm, delete donor with all donations",
+  "card-deleted": "Card deleted",
-    "confirm-delete-my-user-profile": "Confirm, delete my user profile",
+  "card-updated": "Card updated",
-    "confirm-delete-organization-and-associated-teams-runners": "Confirm, delete organization and associated teams+runners.",
+  "cards": "Cards",
-    "confirm-delete-team-and-associated-runners": "Confirm, delete team and associated runners.",
+  "change-your-password-here": "Change your password here",
-    "confirm-deletion": "Confirm Deletion",
+  "changing-your-password": "Changing your password",
-    "confirm-the-new-password": "Confirm the new password",
+  "city": "City",
-    "contact": "Contact",
+  "click-to-copy-the-link-into-your-clipboard": "Click to copy the link into your clipboard",
-    "contact-deleted": "Contact deleted",
+  "click-to-copy-token-to-clipboard": "Click to copy the token to your clipboard",
-    "contact-information": "Contact Information",
+  "close": "Close",
-    "contact-is-being-updated": "Contact is being updated...",
+  "code": "Code",
-    "contact-is-not-a-member-in-any-group": "Contact is not a member in any group",
+  "configure-the-tracks-and-minimum-lap-times": "configure the tracks & minimum lap times",
-    "contacts": "Contacts",
+  "confirm": "Confirm",
-    "contacts-are-being-loaded": "contacts are being loaded...",
+  "confirm-delete": "Confirm Delete",
-    "count_organizations": "# Organizations",
+  "confirm-delete-donor-with-all-donations": "Confirm, delete donor with all donations",
-    "count_teams": "# Teams",
+  "confirm-delete-my-user-profile": "Confirm, delete my user profile",
-    "create": "Create",
+  "confirm-delete-organization-and-associated-teams-runners": "Confirm, delete organization and associated teams+runners.",
-    "create-a-new": "Create a new",
+  "confirm-delete-team-and-associated-runners": "Confirm, delete team and associated runners.",
-    "create-a-new-contact": "Create a new contact",
+  "confirm-deletion": "Confirm Deletion",
-    "create-a-new-distance-donation": "Create a new distance donation",
+  "confirm-the-new-password": "Confirm the new password",
-    "create-a-new-donor": "Create a new donor",
+  "contact": "Contact",
-    "create-a-new-fixed-donation": "Create a new fixed donation",
+  "contact-deleted": "Contact deleted",
-    "create-a-new-organization": "Create a new Organization",
+  "contact-information": "Contact Information",
-    "create-a-new-runner": "Create a new Runner",
+  "contact-is-being-updated": "Contact is being updated...",
-    "create-a-new-scan-fixed-only": "Create a new scan (fixed only)",
+  "contact-is-not-a-member-in-any-group": "Contact is not a member in any group",
-    "create-a-new-scanstation": "Create a new station",
+  "contacts": "Contacts",
-    "create-a-new-team": "Create a new team",
+  "contacts-are-being-loaded": "contacts are being loaded...",
-    "create-a-new-track": "Create a new Track",
+  "copied-link-to-clipboard": "Copied link to clipboard",
-    "create-a-new-user": "Create a new User",
+  "copied-token-to-clipboard": "Copied token to clipboard",
-    "create-a-new-user-group": "Create a new user group",
+  "count_organizations": "# Organizations",
-    "create-organization": "Create Organization",
+  "count_teams": "# Teams",
-    "create-team": "Create Team",
+  "create": "Create",
-    "create-track": "Create Track",
+  "create-a-new": "Create a new",
-    "create-user": "Create User",
+  "create-a-new-card": "Create a new card",
-    "credits": "Credits",
+  "create-a-new-contact": "Create a new contact",
-    "csv_import__class": "Class",
+  "create-a-new-distance-donation": "Create a new distance donation",
-    "csv_import__firstname": "Firstname",
+  "create-a-new-donor": "Create a new donor",
-    "csv_import__lastname": "Lastname",
+  "create-a-new-fixed-donation": "Create a new fixed donation",
-    "csv_import__middlename": "Middlename",
+  "create-a-new-organization": "Create a new Organization",
-    "csv_import__team": "Team",
+  "create-a-new-runner": "Create a new Runner",
-    "danger-zone": "Danger zone",
+  "create-a-new-scan-fixed-only": "Create a new scan (fixed only)",
-    "dashboard-greeting": "hello there",
+  "create-a-new-scanstation": "Create a new station",
-    "dashboard-title": "Dashboard",
+  "create-a-new-team": "Create a new team",
-    "datatable": {
+  "create-a-new-track": "Create a new Track",
-        "search": "🔍 Search...",
+  "create-a-new-user": "Create a new User",
-        "sort_column_ascending": "Sort column ascending",
+  "create-a-new-user-group": "Create a new user group",
-        "sort_column_descending": "Sort column descending",
+  "create-and-generate-pdf": "Create and generate PDF",
-        "previous": "Previous",
+  "create-bulk-blanco-cards": "Create bulk blanco cards",
-        "next": "Next",
+  "create-bulk-cards": "Add blanco cards",
-        "page": "Page",
+  "create-organization": "Create Organization",
-        "showing": "Showing",
+  "create-team": "Create Team",
-        "records": "Records",
+  "create-track": "Create Track",
-        "of": "of",
+  "create-user": "Create User",
-        "to": "to",
+  "create-without-pdf": "Create without PDF",
-        "loading": "Loading...",
+  "created-blanco-cards": "Created blanco cards",
-        "no_matching_records_found": "No matching records found",
+  "creating-blanco-cards": "Creating blanco cards",
-        "an_error_happened_while_fetching_the_data": "An error happened while fetching the data"
+  "credits": "Credits",
-    },
+  "csv_import__class": "Class",
-    "delete": "Delete",
+  "csv_import__firstname": "Firstname",
-    "delete-contact": "Delete Contact",
+  "csv_import__lastname": "Lastname",
-    "delete-donation": "Delete Donation",
+  "csv_import__middlename": "Middlename",
-    "delete-donor": "Delete donor",
+  "csv_import__team": "Team",
-    "delete-group": "Delete Group",
+  "danger-zone": "Danger zone",
-    "delete-organization": "Delete Organization",
+  "dashboard-greeting": "Hello",
-    "delete-profile": "Delete Profile",
+  "dashboard-title": "Dashboard",
-    "delete-runner": "Delete Runner",
+  "datatable": {
-    "delete-scan": "Delete scan",
+    "search": "🔍 Search...",
-    "delete-station": "Delete station",
+    "sort_column_ascending": "Sort column ascending",
-    "delete-team": "Delete Team",
+    "sort_column_descending": "Sort column descending",
-    "delete-user": "Delete User",
+    "previous": "Previous",
-    "deleted-scan": "Deleted scan",
+    "next": "Next",
-    "dependency_name": "Name",
+    "page": "Page",
-    "description": "description",
+    "showing": "Showing",
-    "description-optional": "Description (optional)",
+    "records": "Records",
-    "deselect-all": "deselect all",
+    "of": "of",
-    "details": "Details",
+    "to": "to",
-    "distance": "Distance",
+    "loading": "Loading...",
-    "distance-donation": "distance donation",
+    "no_matching_records_found": "No matching records found",
-    "distance-in-km": "Distance in km",
+    "an_error_happened_while_fetching_the_data": "An error happened while fetching the data"
-    "distance-track": "Distance (+Track)",
+  },
-    "do-you-really-want-to-delete-your-profile": "Do you really want to delete your profile?",
+  "delete": "Delete",
-    "do-you-want-to-delete-the-organization-delete_org-name": "Do you want to delete the organization {orgname}?",
+  "delete-contact": "Delete Contact",
-    "do-you-want-to-delete-the-team-delete_team-name": "Do you want to delete the team {teamname}?",
+  "delete-donation": "Delete Donation",
-    "do-you-want-to-delete-this-donor-with-all-related-donations": "Do you want to delete this donor with all related donations",
+  "delete-donor": "Delete donor",
-    "donation-amount": "Donation amount",
+  "delete-group": "Delete Group",
-    "donation-amount-must-be-greater-that-0-00eur": "Donation amount must be greater that 0.00€",
+  "delete-organization": "Delete Organization",
-    "donations": "Donations",
+  "delete-profile": "Delete Profile",
-    "donor": "Donor",
+  "delete-runner": "Delete Runner",
-    "donor-added": "Donor added",
+  "delete-scan": "Delete scan",
-    "donor-deleted": "donor deleted",
+  "delete-station": "Delete station",
-    "donor-has-no-associated-donations": "Donor has no associated donations.",
+  "delete-team": "Delete Team",
-    "donor-is-being-added": "Donor is being added...",
+  "delete-user": "Delete User",
-    "donor-is-being-updated": "Donor is being updated",
+  "deleted-scan": "Deleted scan",
-    "donors": "Donors",
+  "dependency_name": "Name",
-    "donors-are-being-loaded": "donors are being loaded",
+  "description": "description",
-    "dont-have-your-email-connected": "Don't have your email connected?",
+  "description-optional": "Description (optional)",
-    "dont-panic-were-resetting-it": "Don't panic, we're resetting it ✌",
+  "deselect-all": "deselect all",
-    "e-mail-adress": "E-Mail Adress",
+  "details": "Details",
-    "edit": "Edit",
+  "disabled": "disabled",
-    "edit-permissions": "edit permissions",
+  "distance": "Distance",
-    "email_address_or_username": "Email / username",
+  "distance-donation": "distance donation",
-    "enabled": "enabled",
+  "distance-in-km": "Distance in km",
-    "english": "English",
+  "distance-track": "Distance (+Track)",
-    "error_on_login": "Error on login",
+  "do-you-really-want-to-delete-your-profile": "Do you really want to delete your profile?",
-    "erteilte": "Directly granted",
+  "do-you-want-to-delete-the-organization-delete_org-name": "Do you want to delete the organization {orgname}?",
-    "everything-concerning-your-profile": "Everything concerning your profile",
+  "do-you-want-to-delete-the-team-delete_team-name": "Do you want to delete the team {teamname}?",
-    "everything-is-more-fun-together": "everything is more fun together 🏃‍♂️🏃‍♀️🏃‍♂️",
+  "do-you-want-to-delete-this-donor-with-all-related-donations": "Do you want to delete this donor with all related donations",
-    "faq": "FAQ",
+  "documentation": "Documentation",
-    "filter-by-organization-team": "Filter by Organization/ Team",
+  "donation-amount": "Donation amount",
-    "first-name": "First name",
+  "donation-amount-must-be-greater-that-0-00eur": "Donation amount must be greater that 0.00€",
-    "first-name-is-required": "First Name is required",
+  "donations": "Donations",
-    "first-scan-of-the-day": "First scan of the day.",
+  "donor": "Donor",
-    "fixed-donation": "fixed donation",
+  "donor-added": "Donor added",
-    "forgot_password": "Forgot your password?",
+  "donor-deleted": "donor deleted",
-    "geerbte": "inherited",
+  "donor-has-no-associated-donations": "Donor has no associated donations.",
-    "general-stats": "General Stats",
+  "donor-is-being-added": "Donor is being added...",
-    "general_promise_error": "😢 Error",
+  "donor-is-being-updated": "Donor is being updated",
-    "generate-sponsoring-contract": "generate sponsoring contract",
+  "donors": "Donors",
-    "generate-sponsoring-contracts": "generate sponsoring contracts",
+  "donors-are-being-loaded": "donors are being loaded",
-    "generating-pdf": "generating PDF...",
+  "dont-have-your-email-connected": "Don't have your email connected?",
-    "generating-pdfs": "generating PDFs...",
+  "dont-panic-were-resetting-it": "Don't panic, we're resetting it ✌",
-    "generic-ui-logic-error": "Something went wrong in the UI logic",
+  "e-mail-adress": "E-Mail Adress",
-    "german": "German",
+  "edit": "Edit",
-    "go-to-login": "Go To Login",
+  "edit-a-card": "Edit a card",
-    "goback": "Go Home",
+  "edit-permissions": "edit permissions",
-    "granted": "granted",
+  "email_address_or_username": "Email / username",
-    "group": "Group",
+  "enabled": "enabled",
-    "group-added": "Group added",
+  "enabled_large": "Enabled",
-    "group-is-being-added": "Group is being added...",
+  "english": "English",
-    "group-name-is-required": "Group name is required",
+  "error-during-import": "Error during import",
-    "group-updated": "group updated",
+  "error-whyile-copying-to-clipboard": "Error while copying to clipboard",
-    "groups": "Groups",
+  "error_on_login": "Error on login",
-    "groups-are-being-loaded": "Groups are being loaded",
+  "erteilte": "Directly granted",
-    "home": "Home",
+  "everything-concerning-your-profile": "Everything concerning your profile",
-    "icon-image-credits": "We also want to thank these projects for illustrations and icons:",
+  "everything-is-more-fun-together": "everything is more fun together 🏃‍♂️🏃‍♀️🏃‍♂️",
-    "import-finished": "Import finished",
+  "faq": "FAQ",
-    "import-runners": "Import runners",
+  "filter-by-organization-team": "Filter by Organization/ Team",
-    "import__target-organization": "Target Organization",
+  "first-name": "First name",
-    "imprint": "Imprint",
+  "first-name-is-required": "First Name is required",
-    "imprint-loading": "Imprint loading...",
+  "first-scan-of-the-day": "First scan of the day.",
-    "inactive": "Inactive",
+  "fixed-donation": "fixed donation",
-    "installed-version": "Installed version",
+  "forgot_password": "Forgot your password?",
-    "internal-error": "Internal Error",
+  "geerbte": "inherited",
-    "invalid": "Invalid",
+  "general-stats": "General Stats",
-    "invalid-mail-reset": "the provided email is invalid",
+  "general_promise_error": "😢 Error",
-    "laeufer-hinzufuegen": "Add runner",
+  "generate-runnercards": "Generate Runnercards",
-    "laeufer-importieren": "Läufer importieren",
+  "generate-sponsoring-contract": "generate sponsoring contract",
-    "laptime": "Laptime",
+  "generate-sponsoring-contracts": "generate sponsoring contracts",
-    "last-name": "Last name",
+  "generating-pdf": "generating PDF...",
-    "last-name-is-required": "Last Name is required",
+  "generating-pdfs": "generating PDFs...",
-    "lfk-is-os": "The \"Lauf für Kaya!\" Frontend is (like all other projects for the \"LfK!\" Also) an open source project.",
+  "generic-ui-logic-error": "Something went wrong in the UI logic",
-    "license": "License",
+  "german": "German",
-    "licenses-are-being-loaded": "Licenses are being loaded...",
+  "go-to-login": "Go To Login",
-    "loading-contact-details": "Loading contact details...",
+  "goback": "Go Home",
-    "loading-donation-details": "Loading donation details",
+  "granted": "granted",
-    "loading-donor-details": "Loading donor details",
+  "group": "Group",
-    "loading-group-detail": "Loading group detail...",
+  "group-added": "Group added",
-    "loading-profile-data": "Loading profile data",
+  "group-is-being-added": "Group is being added...",
-    "loading-runners": "loading runners...",
+  "group-name-is-required": "Group name is required",
-    "loading-station-details": "Loading station details",
+  "group-updated": "group updated",
-    "log_in": "Log in",
+  "groups": "Groups",
-    "log_in_to_your_account": "Log in to your account",
+  "groups-are-being-loaded": "Groups are being loaded",
-    "login_is_checked": "Login is being checked...",
+  "home": "Home",
-    "logout": "Logout",
+  "icon-image-credits": "We also want to thank these projects for illustrations and icons:",
-    "mail-validation-in-progress": "mail validation in progress...",
+  "if-you-want-to-create-multiple-blanco-cards-try-the-add-bulk-button": "If you want to create multiple blanco cards: Try the 'Add blanco cards' button.",
-    "manage-admin-users": "manage admin users",
+  "import-finished": "Import finished",
-    "middle-name": "Middle name",
+  "import-runners": "Import runners",
-    "minimum-lap-time-in-s": "minimum lap time in s",
+  "import__target-organization": "Target Organization",
-    "minimum-lap-time-must-be-a-positive-number-or-0": "minimum lap time must be a positive number or 0",
+  "imprint": "Imprint",
-    "name": "Name",
+  "imprint-loading": "Imprint loading...",
-    "name-is-required": "Name is required",
+  "inactive": "Inactive",
-    "new-password": "New password",
+  "installed-version": "Installed version",
-    "no-contact-found": "No contacts found",
+  "internal-error": "Internal Error",
-    "no-contact-selected": "No contact selected",
+  "invalid": "Invalid",
-    "no-contact-specified": "no contact specified",
+  "invalid-mail-reset": "the provided email is invalid",
-    "no-donors-found": "No donors found",
+  "just-enter-how-many-you-want-and-the-system-will-create-them": "Just enter how many you want and the system will create them",
-    "no-license-text-could-be-found": "No license text could be found 😢",
+  "laeufer-hinzufuegen": "Add runner",
-    "no-organization-or-team-found": "No organization or team found",
+  "laeufer-importieren": "Läufer importieren",
-    "no-organization-specified": "no organization specified",
+  "laptime": "Laptime",
-    "no-organizations-found": "No organizations found",
+  "last-name": "Last name",
-    "no-runners-found": "No runners found",
+  "last-name-is-required": "Last Name is required",
-    "no-tracks-added-yet": "there are no tracks added yet.",
+  "lfk-is-os": "The \"Lauf für Kaya!\" Frontend is (like all other projects for the \"LfK!\" Also) an open source project.",
-    "organization": "Organization",
+  "license": "License",
-    "organization-added": "Organization added",
+  "licenses-are-being-loaded": "Licenses are being loaded...",
-    "organization-deleted": "Organization deleted",
+  "loading-cards": "Loading cards",
-    "organization-detail-is-being-loaded": "organization detail is being loaded...",
+  "loading-contact-details": "Loading contact details...",
-    "organization-is-being-added": "Organization is being added...",
+  "loading-donation-details": "Loading donation details",
-    "organization-name-is-required": "Organization name is required",
+  "loading-donor-details": "Loading donor details",
-    "organizations": "Organizations",
+  "loading-group-detail": "Loading group detail...",
-    "organizations-are-being-loaded": "organizations are being loaded...",
+  "loading-profile-data": "Loading profile data",
-    "orgs": "Organizations",
+  "loading-runners": "loading runners...",
-    "oss_credit_description": "We use a lot of open source software on these projects, and would like to thank the following projects and contributors who help make open source great!",
+  "loading-station-details": "Loading station details",
-    "password": "Password",
+  "log_in": "Log in",
-    "password-changed": "Password changed!",
+  "log_in_to_your_account": "Log in to your account",
-    "password-is-required": "Password is required",
+  "login_is_checked": "Login is being checked...",
-    "password-reset-failed": "Password reset failed!",
+  "logout": "Logout",
-    "password-reset-in-progress": "Password Reset in Progress...",
+  "mail-validation-in-progress": "mail validation in progress...",
-    "password-reset-mail-sent": "Password reset mail was sent to \"{usersEmail}\".",
+  "manage-admin-users": "manage admin users",
-    "password-reset-successful": "Password Reset successful!",
+  "middle-name": "Middle name",
-    "passwords-dont-match": "Passwords don't match",
+  "minimum-lap-time-in-s": "minimum lap time in s",
-    "pdf-generation-failed": "PDF generation failed!",
+  "minimum-lap-time-must-be-a-positive-number-or-0": "minimum lap time must be a positive number or 0",
-    "pdf-successfully-generated": "PDF successfully generated!",
+  "must-be-at-least-10-characters-long": "Must be at least 10 characters long!",
-    "pdfs-successfully-generated": "PDFs successfully generated!",
+  "must-contain-a-lowercase-letter": "Must contain a lowercase letter!",
-    "per-kilometer": "per Kilometer",
+  "must-contain-a-number": "Must contain a number!",
-    "permissions": "Permissions",
+  "must-contain-a-uppercase-letter": "Must contain a uppercase letter!",
-    "permissions-updated": "Permissions updated!",
+  "name": "Name",
-    "phone": "Phone",
+  "name-is-required": "Name is required",
-    "please-provide-a-password": "Please provide a password...",
+  "new-password": "New password",
-    "please-provide-the-nessecary-information-to-add-a-new-donor": "Please provide the nessecary information to add a new donor",
+  "no-contact-found": "No contacts found",
-    "please-provide-the-nessecary-information-to-create-a-new-donation": "Please provide the nessecary information to create a new donation",
+  "no-contact-selected": "No contact selected",
-    "please-provide-the-nessecary-information-to-create-a-new-scan": "Please provide the nessecary information to create a new scan.",
+  "no-contact-specified": "no contact specified",
-    "please-provide-the-required-csv-xlsx-file": "Please provide the required csv/ xlsx file",
+  "no-donors-found": "No donors found",
-    "please-provide-the-required-information-for-creating-a-new-user-group": "Please provide the required information for creating a new user group.",
+  "no-license-text-could-be-found": "No license text could be found 😢",
-    "please-provide-the-required-information-to-add-a-new-contact": "Please provide the required information to add a new contact.",
+  "no-organization-or-team-found": "No organization or team found",
-    "please-provide-the-required-information-to-add-a-new-organization": "Please provide the required information to add a new organization.",
+  "no-organization-specified": "no organization specified",
-    "please-provide-the-required-information-to-add-a-new-runner": "Please provide the required information to add a new runner.",
+  "no-organizations-found": "No organizations found",
-    "please-provide-the-required-information-to-add-a-new-team": "Please provide the required information to add a new team.",
+  "no-runners-found": "No runners found",
-    "please-provide-the-required-information-to-add-a-new-track": "Please provide the required information to add a new track.",
+  "no-tracks-added-yet": "there are no tracks added yet.",
-    "please-provide-the-required-information-to-add-a-new-user": "Please provide the required information to add a new user.",
+  "non-blanko": "Non/Blanko",
-    "please-request-a-new-reset-mail": "Please request a new reset mail...",
+  "organization": "Organization",
-    "privacy": "Privacy",
+  "organization-added": "Organization added",
-    "privacy-loading": "Privacy loading...",
+  "organization-deleted": "Organization deleted",
-    "profile": "Profile",
+  "organization-detail-is-being-loaded": "organization detail is being loaded...",
-    "profile-picture": "Profile Picture",
+  "organization-is-being-added": "Organization is being added...",
-    "profile-updated": "Profile updated!",
+  "organization-name-is-required": "Organization name is required",
-    "read-license": "Read License",
+  "organizations": "Organizations",
-    "receipt-needed": "Receipt needed",
+  "organizations-are-being-loaded": "organizations are being loaded...",
-    "repo_link": "Link",
+  "orgs": "Organizations",
-    "request-a-new-reset-mail": "Request a new reset mail",
+  "oss_credit_description": "We use a lot of open source software on these projects, and would like to thank the following projects and contributors who help make open source great!",
-    "reset-my-password": "Reset my password",
+  "password": "Password",
-    "reset-password": "Reset your password",
+  "password-changed": "Password changed!",
-    "runner": "Runner",
+  "password-is-required": "Password is required",
-    "runner-added": "Runner added",
+  "password-reset-failed": "Password reset failed!",
-    "runner-import": "Runner Import",
+  "password-reset-in-progress": "Password Reset in Progress...",
-    "runner-is-being-added": "Runner is being added...",
+  "password-reset-mail-sent": "Password reset mail was sent to \"{usersEmail}\".",
-    "runner-updated": "Runner updated!",
+  "password-reset-successful": "Password Reset successful!",
-    "runnerimport_verify_runners_org": "Please confirm these runners for import into the organization \"{org_name}\"",
+  "passwords-dont-match": "Passwords don't match!",
-    "runners": "Runners",
+  "pdf-generation-failed": "PDF generation failed!",
-    "runners-are-being-imported": "Runners are being imported...",
+  "pdf-successfully-generated": "PDF successfully generated!",
-    "runners-are-being-loaded": "runners are being loaded...",
+  "pdfs-successfully-generated": "PDFs successfully generated!",
-    "save": "Save",
+  "per-kilometer": "per Kilometer",
-    "save-changes": "Save Changes",
+  "permissions": "Permissions",
-    "scan-added": "Scan added",
+  "permissions-updated": "Permissions updated!",
-    "scan-is-being-updated": "Scan is being updated",
+  "phone": "Phone",
-    "scan-with-fixed-distance": "Scan with fixed distance",
+  "please-copy-the-token-and-store-it-somewhere-save": "Please copy the token and store it somewhere safe.",
-    "scans": "Scans",
+  "please-provide-a-password": "Please provide a password...",
-    "scans-are-being-loaded": "Scans are being loaded",
+  "please-provide-the-nessecary-information-to-add-a-new-donor": "Please provide the nessecary information to add a new donor",
-    "scanstation": "Scanstation",
+  "please-provide-the-nessecary-information-to-create-a-new-donation": "Please provide the nessecary information to create a new donation",
-    "scanstations": "Scanstations",
+  "please-provide-the-nessecary-information-to-create-a-new-scan": "Please provide the nessecary information to create a new scan.",
-    "scanstations-are-being-loaded": "Loading scanstations...",
+  "please-provide-the-required-csv-xlsx-file": "Please provide the required csv/ xlsx file",
-    "search-for-an-organization-by-name-or-id": "Search for an organization (by name or id)",
+  "please-provide-the-required-information-for-creating-a-new-user-group": "Please provide the required information for creating a new user group.",
-    "search-for-an-organization-or-team-by-name-or-id": "Search for an organization or team (by name or id)",
+  "please-provide-the-required-information-to-add-a-new-contact": "Please provide the required information to add a new contact.",
-    "search-for-donor-name-or-id": "Search for donor (by name or id)",
+  "please-provide-the-required-information-to-add-a-new-organization": "Please provide the required information to add a new organization.",
-    "search-for-permission": "Search for permission",
+  "please-provide-the-required-information-to-add-a-new-runner": "Please provide the required information to add a new runner.",
-    "search-for-runner-by-name-or-id": "Search for runner (by name or id)",
+  "please-provide-the-required-information-to-add-a-new-team": "Please provide the required information to add a new team.",
-    "select-all": "select all",
+  "please-provide-the-required-information-to-add-a-new-track": "Please provide the required information to add a new track.",
-    "select-language": "Select language",
+  "please-provide-the-required-information-to-add-a-new-user": "Please provide the required information to add a new user.",
-    "send-a-mail-to-lfk-odit-services": "send a mail to lfk@odit.services",
+  "please-provide-the-required-information-to-create-a-new-scanstation": "Please provide the required information to create a new scanstation",
-    "set-the-user-active-inactive": "set the user active/ inactive",
+  "please-request-a-new-reset-mail": "Please request a new reset mail...",
-    "settings": "Settings",
+  "privacy": "Privacy",
-    "settings-for-your-profile": "Settings for your profile",
+  "privacy-loading": "Privacy loading...",
-    "something-about-the-group": "Something about the group...",
+  "profile": "Profile",
-    "stats-are-being-loaded": "stats are being loaded...",
+  "profile-picture": "Profile Picture",
-    "status": "Status",
+  "profile-updated": "Profile updated!",
-    "stuff-that-could-harm-your-profile": "Stuff that could harm your profile",
+  "read-license": "Read License",
-    "successful-password-reset": "Successful password reset!",
+  "receipt-needed": "Receipt needed",
-    "team": "Team",
+  "repo_link": "Link",
-    "team-detail-is-being-loaded": "team detail is being loaded...",
+  "request-a-new-reset-mail": "Request a new reset mail",
-    "team-name": "Team name",
+  "reset-my-password": "Reset my password",
-    "team-name-is-required": "team name is required",
+  "reset-password": "Reset your password",
-    "teams": "Teams",
+  "runner": "Runner",
-    "teams-are-being-loaded": "teams are being loaded...",
+  "runner-added": "Runner added",
-    "the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number": "the provided phone number is invalid.<br />please enter a valid international number...",
+  "runner-import": "Runner Import",
-    "the-scans-distance-must-be-greater-than-0m": "The scan's distance must be greater than 0m",
+  "runner-is-being-added": "Runner is being added...",
-    "there-are-no-contacts-added-yet": "There are no contacts added yet.",
+  "runner-updated": "Runner updated!",
-    "there-are-no-donors-yet": "There are no donors yet",
+  "runnerimport_verify_runners_org": "Please confirm these runners for import into the organization \"{org_name}\"",
-    "there-are-no-groups-yet": "There are no groups yet",
+  "runners": "Runners",
-    "there-are-no-organizations-added-yet": "There are no organizations added yet.",
+  "runners-are-being-imported": "Runners are being imported...",
-    "there-are-no-runners-added-yet": "There are no runners added yet.",
+  "runners-are-being-loaded": "runners are being loaded...",
-    "there-are-no-scans-yet": "There are no scans yet",
+  "save": "Save",
-    "there-are-no-teams-added-yet": "There are no teams added yet.",
+  "save-changes": "Save Changes",
-    "there-are-no-users-added-yet": "There are no users added yet.",
+  "scan-added": "Scan added",
-    "this-might-take-a-moment": "This might take a moment 👀",
+  "scan-is-being-updated": "Scan is being updated",
-    "this-scanstation-is": "This scanstation is",
+  "scan-with-fixed-distance": "Scan with fixed distance",
-    "total-distance": "total distance",
+  "scans": "Scans",
-    "total-donation-amount": "total donation amount",
+  "scans-are-being-loaded": "Scans are being loaded",
-    "total-donations": "total donations",
+  "scanstation": "Scanstation",
-    "total-scans": "total scans",
+  "scanstation-added": "Scanstation added",
-    "track": "Track",
+  "scanstation-is-being-added": "Adding scanstation...",
-    "track-added": "Track added",
+  "scanstations": "Scanstations",
-    "track-data-is-being-loaded": "Track data is being loaded",
+  "scanstations-are-being-loaded": "Loading scanstations...",
-    "track-is-being-added": "Track is being added...",
+  "search-for-an-organization-by-name-or-id": "Search for an organization (by name or id)",
-    "track-length-in-m": "Track Length in m",
+  "search-for-an-organization-or-team-by-name-or-id": "Search for an organization or team (by name or id)",
-    "track-length-must-be-greater-than-0": "Track length must be greater than 0",
+  "search-for-donor-name-or-id": "Search for donor (by name or id)",
-    "track-name": "Track name",
+  "search-for-permission": "Search for permission",
-    "track-name-must-not-be-empty": "Track name must not be empty",
+  "search-for-runner-by-name-or-id": "Search for runner (by name or id)",
-    "tracks": "Tracks",
+  "select-all": "select all",
-    "update-password": "Update password",
+  "select-language": "Select language",
-    "updated-contact": "Updated contact!",
+  "selfservice-registration": "Selfservice registration",
-    "updated-donor": "updated donor",
+  "send-a-mail-to-lfk-odit-services": "send a mail to lfk@odit.services",
-    "updated-organization": "updated organization",
+  "set-the-user-active-inactive": "set the user active/ inactive",
-    "updated-scan": "updated scan",
+  "settings": "Settings",
-    "updateing-group": "updateing group...",
+  "settings-for-your-profile": "Settings for your profile",
-    "updating-organization": "updating organization",
+  "something-about-the-group": "Something about the group...",
-    "updating-permissions": "updating permissions...",
+  "stats-are-being-loaded": "stats are being loaded...",
-    "updating-runner": "Updating runner...",
+  "status": "Status",
-    "updating-user": "updating user...",
+  "stuff-that-could-harm-your-profile": "Stuff that could harm your profile",
-    "updating-your-profile": "Updating your profile...",
+  "successful-password-reset": "Successful password reset!",
-    "user-added": "User added",
+  "team": "Team",
-    "user-groups": "User Groups",
+  "team-detail-is-being-loaded": "team detail is being loaded...",
-    "user-is-being-added": "User is being added...",
+  "team-name": "Team name",
-    "user-updated": "User updated",
+  "team-name-is-required": "team name is required",
-    "username": "Username",
+  "teams": "Teams",
-    "users": "Users",
+  "teams-are-being-loaded": "teams are being loaded...",
-    "valid": "Valid",
+  "the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number": "the provided phone number is invalid.<br />please enter a valid international number...",
-    "valid-city-is-required": "Valid city is required",
+  "the-scans-distance-must-be-greater-than-0m": "The scan's distance must be greater than 0m",
-    "valid-email-is-required": "valid email is required",
+  "the-scanstations-api-token-will-only-get-displayed-once-you-wont-be-able-to-change-or-view-it-again": "The scanstation api token will only get displayed once - you won't be able to change or view it again!",
-    "valid-international-phone-number-is-required": "valid international phone number is required...",
+  "there-are-no-cards-yet": "There are no cards yet.",
-    "valid-zipcode-postal-code-is-required": "Valid zipcode/ postal code is required",
+  "there-are-no-contacts-added-yet": "There are no contacts added yet.",
-    "verfuegbare": "availdable",
+  "there-are-no-donations-yet": "There are no donations yet",
-    "welcome_wavinghand": "Welcome 👋",
+  "there-are-no-donors-yet": "There are no donors yet",
-    "yes-i-copied-the-token": "Yes, I copied the token",
+  "there-are-no-groups-yet": "There are no groups yet",
-    "you-are-going-to-loose-all-permissions-and-access-to-the-runner-system": "You are going to loose all permissions and access to the runner system!",
+  "there-are-no-organizations-added-yet": "There are no organizations added yet.",
-    "you-can-now-use-your-new-password-to-log-in-to-your-account": "You can now use your new password to log in to your account! 🎉",
+  "there-are-no-runners-added-yet": "There are no runners added yet.",
-    "you-have-to-provide-an-organization": "You have to provide an organization",
+  "there-are-no-scans-yet": "There are no scans yet",
-    "zip-postal-code": "ZIP/ postal code"
+  "there-are-no-teams-added-yet": "There are no teams added yet.",
-}
+  "there-are-no-users-added-yet": "There are no users added yet.",
+  "this-card-is": "This card is",
+  "this-might-take-a-moment": "This might take a moment 👀",
+  "this-scanstation-is": "This scanstation is",
+  "token": "Token",
+  "total-distance": "total distance",
+  "total-donation-amount": "total donation amount",
+  "total-donations": "total donations",
+  "total-scans": "total scans",
+  "track": "Track",
+  "track-added": "Track added",
+  "track-data-is-being-loaded": "Track data is being loaded",
+  "track-is-being-added": "Track is being added...",
+  "track-length-in-m": "Track Length in m",
+  "track-length-must-be-greater-than-0": "Track length must be greater than 0",
+  "track-name": "Track name",
+  "track-name-must-not-be-empty": "Track name must not be empty",
+  "tracks": "Tracks",
+  "update-card": "Update Card",
+  "update-password": "Update password",
+  "updated-contact": "Updated contact!",
+  "updated-donor": "updated donor",
+  "updated-organization": "updated organization",
+  "updated-scan": "updated scan",
+  "updateing-group": "updateing group...",
+  "updating-card": "Updating card",
+  "updating-organization": "updating organization",
+  "updating-permissions": "updating permissions...",
+  "updating-runner": "Updating runner...",
+  "updating-user": "updating user...",
+  "updating-your-profile": "Updating your profile...",
+  "user-added": "User added",
+  "user-groups": "User Groups",
+  "user-is-being-added": "User is being added...",
+  "user-updated": "User updated",
+  "username": "Username",
+  "users": "Users",
+  "valid": "Valid",
+  "valid-city-is-required": "Valid city is required",
+  "valid-email-is-required": "valid email is required",
+  "valid-international-phone-number-is-required": "valid international phone number is required...",
+  "valid-zipcode-postal-code-is-required": "Valid zipcode/ postal code is required",
+  "verfuegbare": "availdable",
+  "welcome_wavinghand": "Welcome 👋",
+  "yes-i-copied-the-token": "Yes, I copied the token",
+  "you-are-going-to-loose-all-permissions-and-access-to-the-runner-system": "You are going to loose all permissions and access to the runner system!",
+  "you-can-now-use-your-new-password-to-log-in-to-your-account": "You can now use your new password to log in to your account! 🎉",
+  "you-can-provide-a-runner-but-you-dont-have-to": "You can provide a runner, but you don't have to.",
+  "you-dont-have-any-scanstations-yet": "You don't have any scanstations yet",
+  "you-have-to-provide-an-organization": "You have to provide an organization",
+  "you-have-to-save-your-changes-to-generate-a-link": "You have to save your changes to generate a link.",
+  "you-must-create-at-least-one-card-or-cancel": "You must create at least one card (or cancel).",
+  "zip-postal-code": "ZIP/ postal code",
+  "generate-runner-certificates": "Generate runner certificates"
+}

src/main.js

@@ -0,0 +1,9 @@
+import 'windi.css';
+import "toastify-js/src/toastify.css";
+import "gridjs/dist/theme/mermaid.css";
+import App from './App.svelte';
+
+const app = new App({
+	target: document.body
+});
+export default app;

src/swmodule.js

@@ -1,14 +0,0 @@
-export const register = () => {
-	if ('serviceWorker' in navigator) {
-		window.addEventListener('load', () => {
-			navigator.serviceWorker.register('/sw.js').then(
-				(registration) => {
-					// console.log(`sw successful with scope: ${registration.scope}`);
-				},
-				(err) => {
-					// console.log(`sw failed: ${err}`);
-				}
-			);
-		});
-	}
-};

tailwind.config.js

@@ -1,14 +1,13 @@
 module.exports = {
-	purge: {
-		content: [ './src/**/*.svelte' ]
-	},
-	// darkMode: 'media',
-	variants: {},
-	plugins: [],
 	theme: {
-		container: {
+		extend: {
-			center: true,
+			colors: {
-			padding: '1.5rem'
+				reepolee: {
+					500: '#b40000',
+					600: '#9c0000',
+					700: '#750000'
+				}
+			}
 		}
 	}
 };

template-copy.js

@@ -1,19 +0,0 @@
-const fs = require('fs');
-let content_svelteconfig = fs.readFileSync('./s-config.template.js', { encoding: 'utf8' });
-let content_html = fs.readFileSync('./index.template.html', { encoding: 'utf8' });
-if (process.env.NODE_ENV_ODIT == 'development_fast') {
-	content_html = content_html.replace(
-		'__TAILWIND_INSERT__',
-		'<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/tailwindcss@2.0.2/dist/tailwind.min.css">'
-	);
-	content_svelteconfig = content_svelteconfig.replace('__insert__', '{postcss:{}}');
-} else {
-	content_html = content_html.replace('__TAILWIND_INSERT__', '');
-	content_svelteconfig = content_svelteconfig.replace(
-		'__insert__',
-		"{postcss:{plugins:[require('tailwindcss'),require('autoprefixer')]}}"
-	);
-}
-fs.writeFileSync('./public/index.html', content_html);
-fs.writeFileSync('./svelte.config.js', content_svelteconfig);
-console.info('dev setup script done');

versionbuilder.js

@@ -1,5 +1,5 @@
 const fs = require('fs');
 const package = JSON.parse(fs.readFileSync(`./package.json`, { encoding: 'utf-8' }));
-const original = fs.readFileSync(`./index.template.html`, { encoding: 'utf-8' });
+const original = fs.readFileSync(`./index.html`, { encoding: 'utf-8' });
 let out = original.replace(/RELEASE_INFO-(\S)+-RELEASE_INFO/gi, 'RELEASE_INFO-' + package.version + '-RELEASE_INFO');
-fs.writeFileSync(`./index.template.html`, out);
+fs.writeFileSync(`./index.html`, out);

vite.config.js

@@ -0,0 +1,50 @@
+import svelte from '@sveltejs/vite-plugin-svelte';
+import windiCSS from 'vite-plugin-windicss';
+import { minify } from 'html-minifier';
+import { defineConfig } from 'vite';
+//
+const indexReplace = () => {
+	return {
+		name: 'html-transform',
+		transformIndexHtml(html) {
+			return minify(html, {
+				collapseWhitespace: true
+			});
+		}
+	};
+};
+
+export default defineConfig(({ command, mode }) => {
+	const isProduction = mode === 'production';
+	return {
+		// base: './',
+		build: {
+			polyfillDynamicImport: false,
+			cssCodeSplit: false,
+			minify: isProduction
+		},
+		plugins: [
+			windiCSS({
+				//@ts-ignore
+				verbose: true,
+				silent: false,
+				debug: true,
+				config: 'tailwind.config.js', // tailwind config file path (optional)
+				compile: false, // false: interpretation mode; true: compilation mode
+				prefix: 'windi-', // set compilation mode style prefix
+				globalPreflight: true, // set preflight style is global or scoped
+				globalUtility: true // set utility style is global or scoped
+			}),
+			svelte({
+				//@ts-ignore
+				hot: !isProduction,
+				emitCss: true,
+				extensions: [ '.md', '.svx', '.svelte' ],
+				preprocess: [
+					//
+				]
+			}),
+			indexReplace()
+		]
+	};
+});

workbox-config.js

@@ -1,9 +0,0 @@
-module.exports = {
-	globDirectory: 'public',
-	globPatterns: [ '**/*.{js,ico,png,svg,html,webmanifest,txt,json}' ],
-	globIgnores: [ 'env.js', 'env.sample.js' ],
-	swDest: 'public/sw.js',
-	cleanupOutdatedCaches: true,
-	mode: 'production',
-	sourcemap: false
-};