From c73534f44805ea2eb33631db23f700977018bb2a Mon Sep 17 00:00:00 2001
From: Michael Weimann <mail@michael-weimann.eu>
Date: Sun, 19 Sep 2021 10:39:22 +0200
Subject: [PATCH 1/8] update boostrap

---
 .gitignore        |  1 +
 package-lock.json | 42 ++++++++++++++++++++++++++++++++++--------
 2 files changed, 35 insertions(+), 8 deletions(-)

diff --git a/.gitignore b/.gitignore
index 5c0d718..361c1a3 100644
--- a/.gitignore
+++ b/.gitignore
@@ -23,3 +23,4 @@ pnpm-debug.log*
 *.njsproj
 *.sln
 *.sw?
+jsconfig.json
diff --git a/package-lock.json b/package-lock.json
index 40e3980..2205725 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1209,6 +1209,17 @@
         "node": ">= 6"
       }
     },
+    "node_modules/@popperjs/core": {
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.10.1.tgz",
+      "integrity": "sha512-HnUhk1Sy9IuKrxEMdIRCxpIqPw6BFsbYSEUO9p/hNw5sMld/+3OLMWQP80F8/db9qsv3qUjs7ZR5bS/R+iinXw==",
+      "dev": true,
+      "peer": true,
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/popperjs"
+      }
+    },
     "node_modules/@soda/friendly-errors-webpack-plugin": {
       "version": "1.8.0",
       "resolved": "https://registry.npm.taobao.org/@soda/friendly-errors-webpack-plugin/download/@soda/friendly-errors-webpack-plugin-1.8.0.tgz?cache=0&sync_timestamp=1607927625608&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40soda%2Ffriendly-errors-webpack-plugin%2Fdownload%2F%40soda%2Ffriendly-errors-webpack-plugin-1.8.0.tgz",
@@ -2840,10 +2851,17 @@
       "dev": true
     },
     "node_modules/bootstrap": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.0.1.tgz",
-      "integrity": "sha512-Fl79+wsLOZKoiU345KeEaWD0ik8WKRI5zm0YSPj2oF1Qr+BO7z0fco6GbUtqjoG1h4VI89PeKJnMsMMVQdKKTw==",
-      "dev": true
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.1.1.tgz",
+      "integrity": "sha512-/jUa4sSuDZWlDLQ1gwQQR8uoYSvLJzDd8m5o6bPKh3asLAMYVZKdRCjb1joUd5WXf0WwCNzd2EjwQQhupou0dA==",
+      "dev": true,
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/bootstrap"
+      },
+      "peerDependencies": {
+        "@popperjs/core": "^2.10.1"
+      }
     },
     "node_modules/brace-expansion": {
       "version": "1.1.11",
@@ -15629,6 +15647,13 @@
       "integrity": "sha1-K1o6s/kYzKSKjHVMCBaOPwPrphs=",
       "dev": true
     },
+    "@popperjs/core": {
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.10.1.tgz",
+      "integrity": "sha512-HnUhk1Sy9IuKrxEMdIRCxpIqPw6BFsbYSEUO9p/hNw5sMld/+3OLMWQP80F8/db9qsv3qUjs7ZR5bS/R+iinXw==",
+      "dev": true,
+      "peer": true
+    },
     "@soda/friendly-errors-webpack-plugin": {
       "version": "1.8.0",
       "resolved": "https://registry.npm.taobao.org/@soda/friendly-errors-webpack-plugin/download/@soda/friendly-errors-webpack-plugin-1.8.0.tgz?cache=0&sync_timestamp=1607927625608&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40soda%2Ffriendly-errors-webpack-plugin%2Fdownload%2F%40soda%2Ffriendly-errors-webpack-plugin-1.8.0.tgz",
@@ -17130,10 +17155,11 @@
       "dev": true
     },
     "bootstrap": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.0.1.tgz",
-      "integrity": "sha512-Fl79+wsLOZKoiU345KeEaWD0ik8WKRI5zm0YSPj2oF1Qr+BO7z0fco6GbUtqjoG1h4VI89PeKJnMsMMVQdKKTw==",
-      "dev": true
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.1.1.tgz",
+      "integrity": "sha512-/jUa4sSuDZWlDLQ1gwQQR8uoYSvLJzDd8m5o6bPKh3asLAMYVZKdRCjb1joUd5WXf0WwCNzd2EjwQQhupou0dA==",
+      "dev": true,
+      "requires": {}
     },
     "brace-expansion": {
       "version": "1.1.11",

From ec8bc47ec74c851fabda4b8b5027f76d5dd9c9ce Mon Sep 17 00:00:00 2001
From: Michael Weimann <mail@michael-weimann.eu>
Date: Sun, 19 Sep 2021 11:21:23 +0200
Subject: [PATCH 2/8] style footer #14

---
 src/App.vue                       |  12 ++--
 src/assets/global.scss            |   4 --
 src/assets/img/wtf_logo_white.svg | 100 ++++++++++++++++++++++++++++++
 src/assets/variables.scss         |   1 +
 src/views/partials/Footer.vue     |  41 ++++++++++++
 5 files changed, 148 insertions(+), 10 deletions(-)
 create mode 100644 src/assets/img/wtf_logo_white.svg
 create mode 100644 src/views/partials/Footer.vue

diff --git a/src/App.vue b/src/App.vue
index caf930a..1be75b1 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -82,16 +82,16 @@
     </nav>
   </header>
   <router-view />
-  <footer>
-    <a href="https://wtf-eg.de/impressum/" class="m-4">Impressum</a>
-    <a href="https://wtf-eg.de/datenschutz/" class="m-4">Datenschutz</a>
-    <a href="https://git.wtf-eg.de/kompetenzinventar" class="m-4">git(ea)</a>
-    <a href="https://git.wtf-eg.de/kompetenzinventar/ki-frontend/issues/new" class="m-4">Problem melden</a>
-  </footer>
+  <Footer />
 </template>
 <script>
+import Footer from '@/views/partials/Footer.vue'
+
 export default {
   name: "App",
+  components: {
+    Footer
+  },
   data() {
     return {
       showMobileNavbar: false,
diff --git a/src/assets/global.scss b/src/assets/global.scss
index 9ffe129..5f64cc5 100644
--- a/src/assets/global.scss
+++ b/src/assets/global.scss
@@ -4,7 +4,3 @@
 
 @import "variables";
 @import "bootstrap/scss/bootstrap";
-
-.container{
-  min-height: calc(100vh - 70px - 24px);
-}
diff --git a/src/assets/img/wtf_logo_white.svg b/src/assets/img/wtf_logo_white.svg
new file mode 100644
index 0000000..dd3d935
--- /dev/null
+++ b/src/assets/img/wtf_logo_white.svg
@@ -0,0 +1,100 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 1476 617" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g id="Background" transform="matrix(1,0,0,1,-184.291,-861.078)">
+        <rect x="184.291" y="861.078" width="1475.62" height="616.639" style="fill:none;"/>
+    </g>
+    <g id="Logo" transform="matrix(1,0,0,1,-184.236,-860.997)">
+        <g id="WTF-Koorperative-eG" serif:id="WTF Koorperative eG">
+            <g id="eG" transform="matrix(4.16667,0,0,4.16667,-389.557,-181.762)">
+                <g transform="matrix(15.962,0,0,15.962,431.653,372.57)">
+                    <path d="M0.288,-0.434C0.271,-0.434 0.255,-0.431 0.241,-0.424C0.227,-0.417 0.214,-0.407 0.202,-0.395C0.191,-0.383 0.181,-0.368 0.172,-0.351C0.164,-0.334 0.157,-0.315 0.152,-0.295C0.193,-0.3 0.227,-0.306 0.252,-0.313C0.277,-0.32 0.296,-0.327 0.31,-0.335C0.324,-0.343 0.333,-0.352 0.337,-0.361C0.342,-0.37 0.344,-0.38 0.344,-0.39C0.344,-0.395 0.343,-0.4 0.341,-0.405C0.339,-0.41 0.335,-0.415 0.331,-0.419C0.326,-0.423 0.32,-0.427 0.313,-0.43C0.306,-0.433 0.298,-0.434 0.288,-0.434ZM0.142,-0.209C0.142,-0.128 0.176,-0.088 0.244,-0.088C0.259,-0.088 0.272,-0.089 0.283,-0.092C0.294,-0.095 0.304,-0.098 0.313,-0.103C0.321,-0.107 0.329,-0.111 0.336,-0.116C0.343,-0.121 0.349,-0.126 0.355,-0.13C0.361,-0.134 0.366,-0.137 0.372,-0.14C0.378,-0.143 0.384,-0.144 0.391,-0.144C0.395,-0.144 0.398,-0.143 0.402,-0.141C0.406,-0.139 0.41,-0.136 0.413,-0.133L0.444,-0.095C0.426,-0.077 0.409,-0.062 0.392,-0.049C0.375,-0.036 0.358,-0.025 0.34,-0.017C0.322,-0.009 0.304,-0.003 0.284,0.002C0.264,0.006 0.243,0.008 0.22,0.008C0.19,0.008 0.163,0.002 0.139,-0.008C0.114,-0.018 0.093,-0.032 0.076,-0.051C0.059,-0.069 0.045,-0.092 0.036,-0.118C0.026,-0.144 0.022,-0.173 0.022,-0.206C0.022,-0.233 0.024,-0.259 0.03,-0.285C0.036,-0.311 0.045,-0.336 0.056,-0.359C0.067,-0.382 0.08,-0.404 0.096,-0.424C0.112,-0.443 0.13,-0.46 0.15,-0.475C0.17,-0.489 0.193,-0.5 0.217,-0.508C0.241,-0.516 0.267,-0.52 0.295,-0.52C0.321,-0.52 0.345,-0.516 0.365,-0.509C0.385,-0.501 0.402,-0.491 0.415,-0.479C0.429,-0.467 0.439,-0.453 0.446,-0.438C0.452,-0.423 0.456,-0.408 0.456,-0.394C0.456,-0.371 0.451,-0.35 0.442,-0.331C0.433,-0.312 0.416,-0.295 0.393,-0.28C0.369,-0.265 0.337,-0.252 0.297,-0.241C0.256,-0.23 0.204,-0.222 0.142,-0.216L0.142,-0.209Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(15.962,0,0,15.962,440.065,372.57)">
+                    <path d="M0.41,-0.361L0.635,-0.361L0.599,-0.07C0.562,-0.043 0.522,-0.024 0.48,-0.011C0.438,0.002 0.389,0.008 0.335,0.008C0.291,0.008 0.25,0 0.214,-0.016C0.178,-0.032 0.147,-0.054 0.121,-0.083C0.095,-0.111 0.076,-0.145 0.062,-0.184C0.048,-0.223 0.041,-0.266 0.041,-0.313C0.041,-0.353 0.045,-0.392 0.054,-0.428C0.063,-0.465 0.076,-0.498 0.092,-0.53C0.109,-0.561 0.129,-0.588 0.152,-0.613C0.175,-0.638 0.201,-0.659 0.23,-0.677C0.259,-0.694 0.29,-0.708 0.323,-0.717C0.357,-0.726 0.392,-0.731 0.429,-0.731C0.458,-0.731 0.484,-0.728 0.508,-0.723C0.532,-0.718 0.554,-0.711 0.573,-0.702C0.592,-0.693 0.61,-0.683 0.625,-0.671C0.64,-0.659 0.654,-0.646 0.666,-0.633L0.624,-0.579C0.617,-0.569 0.609,-0.563 0.6,-0.561C0.59,-0.559 0.58,-0.561 0.57,-0.568C0.56,-0.574 0.551,-0.581 0.541,-0.587C0.531,-0.593 0.521,-0.599 0.509,-0.604C0.498,-0.608 0.485,-0.612 0.47,-0.616C0.455,-0.619 0.438,-0.62 0.419,-0.62C0.383,-0.62 0.349,-0.613 0.32,-0.598C0.29,-0.584 0.264,-0.563 0.242,-0.537C0.22,-0.51 0.204,-0.478 0.192,-0.441C0.18,-0.404 0.174,-0.363 0.174,-0.317C0.174,-0.282 0.178,-0.251 0.187,-0.224C0.196,-0.197 0.208,-0.173 0.224,-0.155C0.24,-0.135 0.259,-0.121 0.282,-0.111C0.304,-0.101 0.329,-0.095 0.357,-0.096C0.384,-0.095 0.408,-0.098 0.429,-0.103C0.45,-0.108 0.47,-0.116 0.489,-0.126L0.505,-0.263L0.425,-0.263C0.417,-0.263 0.41,-0.265 0.406,-0.27C0.402,-0.274 0.4,-0.28 0.401,-0.287L0.41,-0.361Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+            </g>
+            <g id="Kooperative" transform="matrix(4.16667,0,0,4.16667,896.411,1370.07)">
+                <g transform="matrix(18.037,0,0,18.037,0,0)">
+                    <path d="M0.786,-0.365C0.786,-0.312 0.776,-0.263 0.758,-0.218C0.74,-0.172 0.715,-0.133 0.682,-0.099C0.649,-0.066 0.609,-0.04 0.562,-0.021C0.516,-0.002 0.464,0.008 0.408,0.008C0.351,0.008 0.299,-0.002 0.253,-0.021C0.206,-0.04 0.166,-0.066 0.133,-0.099C0.1,-0.133 0.074,-0.172 0.056,-0.218C0.038,-0.263 0.029,-0.312 0.029,-0.365C0.029,-0.417 0.038,-0.466 0.056,-0.512C0.074,-0.557 0.1,-0.596 0.133,-0.63C0.166,-0.663 0.206,-0.689 0.253,-0.708C0.299,-0.727 0.351,-0.737 0.408,-0.737C0.464,-0.737 0.516,-0.727 0.562,-0.708C0.609,-0.689 0.649,-0.662 0.682,-0.629C0.715,-0.596 0.74,-0.556 0.758,-0.511C0.776,-0.466 0.786,-0.417 0.786,-0.365ZM0.613,-0.365C0.613,-0.401 0.608,-0.433 0.599,-0.462C0.589,-0.491 0.576,-0.515 0.558,-0.535C0.541,-0.555 0.519,-0.57 0.494,-0.581C0.469,-0.592 0.44,-0.597 0.408,-0.597C0.375,-0.597 0.346,-0.592 0.32,-0.581C0.295,-0.57 0.273,-0.555 0.256,-0.535C0.238,-0.515 0.225,-0.491 0.216,-0.462C0.206,-0.433 0.202,-0.401 0.202,-0.365C0.202,-0.328 0.206,-0.296 0.216,-0.267C0.225,-0.238 0.238,-0.214 0.256,-0.194C0.273,-0.173 0.295,-0.158 0.32,-0.148C0.346,-0.137 0.375,-0.132 0.408,-0.132C0.44,-0.132 0.469,-0.137 0.494,-0.148C0.519,-0.158 0.541,-0.173 0.558,-0.194C0.576,-0.214 0.589,-0.238 0.599,-0.267C0.608,-0.296 0.613,-0.328 0.613,-0.365Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(18.037,0,0,18.037,14.6911,0)">
+                    <path d="M0.786,-0.365C0.786,-0.312 0.776,-0.263 0.758,-0.218C0.74,-0.172 0.715,-0.133 0.682,-0.099C0.649,-0.066 0.609,-0.04 0.562,-0.021C0.516,-0.002 0.464,0.008 0.408,0.008C0.351,0.008 0.299,-0.002 0.253,-0.021C0.206,-0.04 0.166,-0.066 0.133,-0.099C0.1,-0.133 0.074,-0.172 0.056,-0.218C0.038,-0.263 0.029,-0.312 0.029,-0.365C0.029,-0.417 0.038,-0.466 0.056,-0.512C0.074,-0.557 0.1,-0.596 0.133,-0.63C0.166,-0.663 0.206,-0.689 0.253,-0.708C0.299,-0.727 0.351,-0.737 0.408,-0.737C0.464,-0.737 0.516,-0.727 0.562,-0.708C0.609,-0.689 0.649,-0.662 0.682,-0.629C0.715,-0.596 0.74,-0.556 0.758,-0.511C0.776,-0.466 0.786,-0.417 0.786,-0.365ZM0.613,-0.365C0.613,-0.401 0.608,-0.433 0.599,-0.462C0.589,-0.491 0.576,-0.515 0.558,-0.535C0.541,-0.555 0.519,-0.57 0.494,-0.581C0.469,-0.592 0.44,-0.597 0.408,-0.597C0.375,-0.597 0.346,-0.592 0.32,-0.581C0.295,-0.57 0.273,-0.555 0.256,-0.535C0.238,-0.515 0.225,-0.491 0.216,-0.462C0.206,-0.433 0.202,-0.401 0.202,-0.365C0.202,-0.328 0.206,-0.296 0.216,-0.267C0.225,-0.238 0.238,-0.214 0.256,-0.194C0.273,-0.173 0.295,-0.158 0.32,-0.148C0.346,-0.137 0.375,-0.132 0.408,-0.132C0.44,-0.132 0.469,-0.137 0.494,-0.148C0.519,-0.158 0.541,-0.173 0.558,-0.194C0.576,-0.214 0.589,-0.238 0.599,-0.267C0.608,-0.296 0.613,-0.328 0.613,-0.365Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(18.037,0,0,18.037,29.3823,0)">
+                    <path d="M0.328,-0.371C0.372,-0.371 0.403,-0.382 0.423,-0.403C0.442,-0.424 0.452,-0.453 0.452,-0.491C0.452,-0.507 0.449,-0.522 0.444,-0.536C0.439,-0.55 0.431,-0.561 0.421,-0.571C0.411,-0.581 0.398,-0.589 0.383,-0.594C0.367,-0.599 0.349,-0.602 0.328,-0.602L0.24,-0.602L0.24,-0.371L0.328,-0.371ZM0.328,-0.729C0.379,-0.729 0.423,-0.722 0.46,-0.71C0.497,-0.698 0.527,-0.681 0.551,-0.66C0.575,-0.639 0.592,-0.614 0.604,-0.585C0.615,-0.556 0.621,-0.524 0.621,-0.491C0.621,-0.454 0.615,-0.421 0.603,-0.391C0.591,-0.36 0.574,-0.334 0.55,-0.313C0.526,-0.291 0.495,-0.274 0.458,-0.262C0.421,-0.25 0.378,-0.243 0.328,-0.244L0.24,-0.244L0.24,-0L0.071,-0L0.071,-0.729L0.328,-0.729Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(18.037,0,0,18.037,40.8538,0)">
+                    <path d="M0.241,-0.599L0.241,-0.429L0.47,-0.429L0.47,-0.304L0.241,-0.304L0.241,-0.13L0.54,-0.13L0.54,-0L0.071,-0L0.071,-0.729L0.54,-0.729L0.54,-0.599L0.241,-0.599Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(18.037,0,0,18.037,51.189,0)">
+                    <path d="M0.308,-0.386C0.331,-0.386 0.35,-0.389 0.366,-0.395C0.382,-0.401 0.396,-0.409 0.406,-0.419C0.416,-0.429 0.424,-0.441 0.429,-0.455C0.433,-0.469 0.436,-0.484 0.436,-0.5C0.436,-0.532 0.425,-0.557 0.404,-0.575C0.383,-0.593 0.351,-0.602 0.308,-0.602L0.24,-0.602L0.24,-0.386L0.308,-0.386ZM0.667,-0L0.514,-0C0.485,-0 0.465,-0.011 0.453,-0.032L0.332,-0.244C0.326,-0.253 0.32,-0.259 0.313,-0.263C0.306,-0.267 0.296,-0.27 0.283,-0.27L0.24,-0.27L0.24,-0L0.071,-0L0.071,-0.729L0.308,-0.729C0.36,-0.729 0.405,-0.723 0.442,-0.712C0.479,-0.701 0.51,-0.686 0.533,-0.667C0.557,-0.648 0.574,-0.625 0.585,-0.599C0.595,-0.572 0.601,-0.544 0.601,-0.513C0.601,-0.489 0.597,-0.467 0.591,-0.446C0.585,-0.425 0.575,-0.405 0.563,-0.387C0.551,-0.369 0.535,-0.354 0.517,-0.34C0.499,-0.326 0.478,-0.314 0.455,-0.305C0.466,-0.299 0.476,-0.292 0.486,-0.284C0.495,-0.275 0.504,-0.265 0.512,-0.254L0.667,-0Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(18.037,0,0,18.037,63.0483,0)">
+                    <path d="M0.456,-0.279L0.388,-0.478C0.383,-0.491 0.378,-0.506 0.372,-0.523C0.366,-0.54 0.361,-0.559 0.355,-0.579C0.35,-0.558 0.345,-0.539 0.339,-0.522C0.333,-0.505 0.328,-0.49 0.323,-0.477L0.256,-0.279L0.456,-0.279ZM0.724,-0L0.593,-0C0.578,-0 0.567,-0.003 0.558,-0.01C0.549,-0.017 0.542,-0.026 0.537,-0.037L0.494,-0.164L0.217,-0.164L0.174,-0.037C0.17,-0.027 0.164,-0.019 0.154,-0.011C0.145,-0.004 0.133,-0 0.119,-0L-0.013,-0L0.269,-0.729L0.442,-0.729L0.724,-0Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(18.037,0,0,18.037,74.592,0)">
+                    <path d="M0.594,-0.595L0.389,-0.595L0.389,-0L0.22,-0L0.22,-0.595L0.015,-0.595L0.015,-0.729L0.594,-0.729L0.594,-0.595Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(18.037,0,0,18.037,85.5765,0)">
+                    <rect x="0.071" y="-0.729" width="0.17" height="0.729" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(18.037,0,0,18.037,91.1861,0)">
+                    <path d="M0.724,-0.729L0.432,-0L0.279,-0L-0.013,-0.729L0.123,-0.729C0.138,-0.729 0.15,-0.725 0.159,-0.718C0.168,-0.711 0.174,-0.703 0.179,-0.692L0.32,-0.302C0.327,-0.285 0.333,-0.266 0.34,-0.246C0.346,-0.226 0.352,-0.205 0.358,-0.183C0.362,-0.205 0.367,-0.226 0.373,-0.246C0.379,-0.266 0.385,-0.285 0.392,-0.302L0.532,-0.692C0.536,-0.701 0.542,-0.71 0.552,-0.717C0.561,-0.725 0.573,-0.729 0.587,-0.729L0.724,-0.729Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(18.037,0,0,18.037,104.01,0)">
+                    <path d="M0.241,-0.599L0.241,-0.429L0.47,-0.429L0.47,-0.304L0.241,-0.304L0.241,-0.13L0.54,-0.13L0.54,-0L0.071,-0L0.071,-0.729L0.54,-0.729L0.54,-0.599L0.241,-0.599Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(18.037,0,0,18.037,-13.068,0)">
+                    <path d="M0.24,-0.434L0.267,-0.434C0.292,-0.434 0.31,-0.441 0.321,-0.457L0.485,-0.695C0.494,-0.708 0.505,-0.716 0.516,-0.721C0.527,-0.726 0.541,-0.729 0.558,-0.729L0.705,-0.729L0.489,-0.434C0.473,-0.414 0.457,-0.399 0.439,-0.39C0.452,-0.385 0.463,-0.379 0.474,-0.371C0.484,-0.362 0.494,-0.351 0.503,-0.338L0.723,-0L0.572,-0C0.562,-0 0.554,-0.001 0.547,-0.002C0.54,-0.003 0.534,-0.005 0.529,-0.008C0.524,-0.011 0.52,-0.014 0.516,-0.018C0.512,-0.022 0.509,-0.026 0.506,-0.031L0.341,-0.285C0.335,-0.294 0.327,-0.3 0.318,-0.304C0.309,-0.308 0.296,-0.31 0.281,-0.31L0.24,-0.31L0.24,-0L0.071,-0L0.071,-0.729L0.24,-0.729L0.24,-0.434Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+            </g>
+            <g id="WTF" transform="matrix(4.16667,0,0,4.16667,-363.557,-181.762)">
+                <g transform="matrix(63.848,0,0,63.848,353.279,347.753)">
+                    <path d="M0.59,-0.605L0.378,-0.605L0.378,-0L0.227,-0L0.227,-0.605L0.015,-0.605L0.015,-0.726L0.59,-0.726L0.59,-0.605Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(63.848,0,0,63.848,391.843,347.753)">
+                    <path d="M0.227,-0.608L0.227,-0.408L0.488,-0.408L0.488,-0.29L0.227,-0.29L0.227,-0L0.076,-0L0.076,-0.726L0.538,-0.726L0.538,-0.608L0.227,-0.608Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+                <g transform="matrix(63.848,0,0,63.848,282.658,347.753)">
+                    <path d="M1.052,-0.726L0.827,-0L0.692,-0L0.543,-0.475C0.541,-0.481 0.538,-0.489 0.536,-0.497C0.534,-0.505 0.532,-0.513 0.53,-0.522C0.528,-0.513 0.525,-0.505 0.523,-0.497C0.521,-0.489 0.518,-0.481 0.516,-0.475L0.366,-0L0.23,-0L0.006,-0.726L0.132,-0.726C0.145,-0.725 0.155,-0.723 0.164,-0.717C0.173,-0.711 0.179,-0.703 0.182,-0.693L0.294,-0.284C0.297,-0.272 0.299,-0.26 0.302,-0.247C0.305,-0.234 0.308,-0.22 0.311,-0.205C0.314,-0.22 0.317,-0.234 0.32,-0.247C0.323,-0.26 0.327,-0.272 0.331,-0.284L0.462,-0.693C0.465,-0.701 0.47,-0.708 0.479,-0.715C0.488,-0.722 0.499,-0.725 0.512,-0.726L0.556,-0.726C0.569,-0.725 0.579,-0.722 0.587,-0.716C0.595,-0.71 0.602,-0.702 0.606,-0.693L0.736,-0.284C0.74,-0.273 0.744,-0.261 0.747,-0.249C0.75,-0.236 0.753,-0.223 0.757,-0.209C0.759,-0.223 0.762,-0.236 0.764,-0.249C0.767,-0.261 0.769,-0.273 0.772,-0.284L0.885,-0.693C0.887,-0.701 0.893,-0.709 0.902,-0.716C0.911,-0.722 0.921,-0.725 0.934,-0.726L1.052,-0.726Z" style="fill:#fff;fill-rule:nonzero;"/>
+                </g>
+            </g>
+        </g>
+        <g id="Einhorn" transform="matrix(1,0,0,1,-31.2941,-563.989)">
+            <path d="M450.529,1662.06L400.757,1697.42L401.385,1712.12C401.385,1712.12 401.392,1712.51 401.318,1712.69C401.189,1713.12 400.944,1713.39 400.944,1713.39L450.529,1662.06Z" style="fill:#fff;"/>
+            <path d="M736.631,1698.47L756.815,1695.93C756.815,1695.93 757.296,1695.91 757.696,1695.65C758.083,1695.4 758.264,1695.06 758.264,1695.06L750.801,1710.64C750.801,1710.64 750.463,1711.42 749.582,1711.56C748.632,1711.72 748.087,1711.18 748.087,1711.18L743.517,1707.05L745.991,1710.95C745.991,1710.95 746.486,1711.78 746.06,1712.62C745.565,1713.62 744.582,1713.64 744.582,1713.64L734.515,1714.3C734.515,1714.3 735.304,1714.06 735.548,1713.76C735.8,1713.44 736.025,1712.42 736.025,1712.42L736.631,1698.47Z" style="fill:#fff;"/>
+            <g transform="matrix(-1,0,0,1,1133.78,-0.317371)">
+                <path d="M736.631,1698.47L756.815,1695.93C756.815,1695.93 757.296,1695.91 757.696,1695.65C758.083,1695.4 758.264,1695.06 758.264,1695.06L750.801,1710.64C750.801,1710.64 750.463,1711.42 749.582,1711.56C748.632,1711.72 748.087,1711.18 748.087,1711.18L743.517,1707.05L745.991,1710.95C745.991,1710.95 746.486,1711.78 746.06,1712.62C745.565,1713.62 744.582,1713.64 744.582,1713.64L734.515,1714.3C734.515,1714.3 735.304,1714.06 735.548,1713.76C735.8,1713.44 736.025,1712.42 736.025,1712.42L736.631,1698.47Z" style="fill:#fff;"/>
+            </g>
+            <path d="M392.458,1653.33L445.559,1660.94L398.452,1694.68L377.352,1692.04C377.352,1692.04 376.875,1691.98 376.441,1692.17C375.813,1692.44 375.559,1692.97 375.559,1692.97L392.458,1653.33Z" style="fill:#fff;"/>
+            <g transform="matrix(-1,0,0,1,1133.82,0.344083)">
+                <path d="M392.458,1653.33L445.559,1660.94L398.452,1694.68L377.352,1692.04C377.352,1692.04 376.875,1691.98 376.441,1692.17C375.813,1692.44 375.559,1692.97 375.559,1692.97L392.458,1653.33Z" style="fill:#fff;"/>
+            </g>
+            <path d="M671.12,1573.37L702.593,1592.58L707.544,1588.92L698.064,1578.83L687.348,1576.59L689.224,1568.43C689.224,1568.43 689.271,1568.29 689.281,1568.09C689.288,1567.93 689.255,1567.77 689.255,1567.77L686.724,1550.74C686.724,1550.74 686.529,1549.58 685.362,1549.35C684.059,1549.08 683.457,1550.14 683.457,1550.14L674.166,1565.5C674.166,1565.5 674.065,1565.68 674.02,1565.84C673.954,1566.06 673.947,1566.24 673.947,1566.24L673.835,1574.13L671.12,1573.37Z" style="fill:#fff;"/>
+            <g transform="matrix(-1,0,0,1,1133.81,-0.623595)">
+                <path d="M670.409,1573.25L702.616,1592.94L707.454,1589.14L698.064,1578.83L687.348,1576.59L689.224,1568.43C689.224,1568.43 689.271,1568.29 689.281,1568.09C689.288,1567.93 689.255,1567.77 689.255,1567.77L686.724,1550.74C686.724,1550.74 686.529,1549.58 685.362,1549.35C684.059,1549.08 683.457,1550.14 683.457,1550.14L674.166,1565.5C674.166,1565.5 674.065,1565.68 674.02,1565.84C673.954,1566.06 673.947,1566.24 673.947,1566.24L673.84,1573.91L670.409,1573.25Z" style="fill:#fff;"/>
+            </g>
+            <path d="M427.91,1594.32L407.278,1606.88L315.202,1511.83C315.202,1511.83 314.118,1510.66 315.278,1509.41C316.302,1508.31 317.631,1509.24 317.631,1509.24L427.91,1594.32Z" style="fill:#fff;"/>
+            <g transform="matrix(-1,0,0,1,1133.84,0.346916)">
+                <path d="M427.91,1594.32L407.278,1606.88L315.202,1511.83C315.202,1511.83 314.118,1510.66 315.278,1509.41C316.302,1508.31 317.631,1509.24 317.631,1509.24L427.91,1594.32Z" style="fill:#fff;"/>
+            </g>
+            <path d="M352.629,1973.55L412.821,1957.45L564.149,1813.8L502.768,1776.15L352.629,1973.55Z" style="fill:#fff;"/>
+            <path d="M724.493,1958.33L791.81,1974.99L636.355,1779.22L570.066,1813.9L724.493,1958.33Z" style="fill:#fff;"/>
+            <path d="M567.109,1811.42L634.096,1776.37L566.931,1691.79L504.928,1773.31L567.109,1811.42Z" style="fill:#fff;"/>
+            <path d="M501.388,1771.76L565.007,1688.47L507.888,1603.52L471.991,1672.38L501.388,1771.76Z" style="fill:#fff;"/>
+            <path d="M568.964,1688.62L636.117,1772.79L662.194,1673.36L625.972,1603.85L568.964,1688.62Z" style="fill:#fff;"/>
+            <path d="M628.44,1600.9L663.644,1574.69L681.595,1659.26L664.468,1669.99L628.44,1600.9Z" style="fill:#fff;"/>
+            <path d="M452.254,1658.94L469.378,1669.67L505.406,1600.56L470.221,1574.36L452.254,1658.94Z" style="fill:#fff;"/>
+            <path d="M409.728,1609.57L466.44,1574.95L449.265,1655.87L409.728,1609.57ZM419.698,1608.4C418.738,1609.21 418.917,1610.78 420.06,1611.35L425.353,1613.99C426.003,1614.31 426.771,1614.21 427.32,1613.75L432.618,1609.17C433.604,1608.31 433.359,1606.71 432.159,1606.19C425.3,1602.76 425.728,1603.15 420.361,1607.83C420.143,1608.01 419.68,1608.37 419.698,1608.4Z" style="fill:#fff;"/>
+            <g transform="matrix(-1,0,0,1,1133.87,0.365109)">
+                <path d="M450.529,1662.06L400.757,1697.42L401.402,1712.11C401.402,1712.11 401.412,1712.43 401.327,1712.69C401.198,1713.08 400.954,1713.36 400.954,1713.36L450.529,1662.06Z" style="fill:#fff;"/>
+            </g>
+            <path d="M667.407,1575.3L724.122,1609.91L684.599,1656.21L667.407,1575.3ZM707.873,1603.98C707.655,1603.99 707.437,1604.03 707.227,1604.13L701.695,1606.53C700.477,1607.05 700.242,1608.66 701.232,1609.52L706.538,1614.1C707.075,1614.57 707.86,1614.67 708.506,1614.34L713.79,1611.69C714.933,1611.11 715.121,1609.57 714.156,1608.74L709.095,1604.41C708.754,1604.12 708.323,1603.97 707.873,1603.98Z" style="fill:#fff;"/>
+            <path d="M687.949,1657.75L740.377,1650.89C740.377,1650.89 731.48,1619.35 729.222,1611.36C729.041,1610.72 728.918,1610.57 728.71,1610.53C728.604,1610.5 728.323,1610.47 727.692,1611.21C721.177,1618.84 687.949,1657.75 687.949,1657.75Z" style="fill:#fff;"/>
+            <g transform="matrix(-1,0,0,1,1133.99,0.137922)">
+                <path d="M688.136,1657.23L740.413,1650.04C740.413,1650.04 731.949,1620.01 729.672,1611.95C729.314,1610.68 728.761,1610.52 728.548,1610.52C728.308,1610.52 728.093,1610.44 727.596,1611.02C721.135,1618.59 688.136,1657.23 688.136,1657.23Z" style="fill:#fff;"/>
+            </g>
+        </g>
+    </g>
+</svg>
diff --git a/src/assets/variables.scss b/src/assets/variables.scss
index 691bc07..e4588b8 100644
--- a/src/assets/variables.scss
+++ b/src/assets/variables.scss
@@ -1 +1,2 @@
 $primary: #0790a9;
+$dark: #344b5d;
diff --git a/src/views/partials/Footer.vue b/src/views/partials/Footer.vue
new file mode 100644
index 0000000..804f9ec
--- /dev/null
+++ b/src/views/partials/Footer.vue
@@ -0,0 +1,41 @@
+<template>
+<footer class="bg-dark py-5">
+  <div class="container">
+    <div class="row text-center text-sm-start">
+      <div class="col-sm-6 d-sm-flex justify-content-center mb-3 mb-sm-0">
+        <div class="d-inline-block">
+          <div class="fw-bold text-white mb-2">Kompetenzinventar</div>
+          <ul class="list-unstyled">
+            <li><a href="https://git.wtf-eg.de/kompetenzinventar">Quellcode</a></li>
+            <li><a href="https://git.wtf-eg.de/kompetenzinventar/ki-frontend/issues/new">Problem melden</a></li>
+          </ul>
+        </div>
+      </div>
+      <div class="col-sm-6 d-sm-flex justify-content-center">
+        <div class="d-inline-block">
+          <ul class="list-unstyled">
+            <li><a href="https://wtf-eg.de/impressum/">Impressum</a></li>
+            <li><a href="https://wtf-eg.de/datenschutz/">Datenschutzerklärung</a></li>
+          </ul>
+          <img class="wtf-logo wtf-logo--footer" src="@/assets/img/wtf_logo_white.svg">
+        </div>
+      </div>
+    </div>
+  </div>
+</footer>
+</template>
+<style scoped>
+a {
+  color: #fff;
+  text-decoration: none;
+}
+
+a:hover {
+  color: #fff;
+  text-decoration: underline;
+}
+
+.wtf-logo--footer {
+  max-width: 200px;
+}
+</style>

From 6a5b468bb2936a186526eb29ae19ee23c7995a85 Mon Sep 17 00:00:00 2001
From: Michael Weimann <mail@michael-weimann.eu>
Date: Sun, 19 Sep 2021 12:19:40 +0200
Subject: [PATCH 3/8] fix vue 404 #26

---
 Dockerfile                    |  1 +
 etc/nginx/conf.d/default.conf | 45 +++++++++++++++++++++++++++++++++++
 2 files changed, 46 insertions(+)
 create mode 100644 etc/nginx/conf.d/default.conf

diff --git a/Dockerfile b/Dockerfile
index 32033ec..7ba9a5e 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -8,3 +8,4 @@ RUN npm ci && npm run build
 FROM nginx as ki-frontend
 
 COPY --from=builder /dist/ /usr/share/nginx/html/
+COPY etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf
diff --git a/etc/nginx/conf.d/default.conf b/etc/nginx/conf.d/default.conf
new file mode 100644
index 0000000..0c3122d
--- /dev/null
+++ b/etc/nginx/conf.d/default.conf
@@ -0,0 +1,45 @@
+server {
+    listen       80;
+    listen  [::]:80;
+    server_name  localhost;
+
+    #access_log  /var/log/nginx/host.access.log  main;
+
+    location / {
+        root   /usr/share/nginx/html;
+        index  index.html index.htm;
+        try_files $uri $uri/ /index.html;
+    }
+
+    #error_page  404              /404.html;
+
+    # redirect server error pages to the static page /50x.html
+    #
+    error_page   500 502 503 504  /50x.html;
+    location = /50x.html {
+        root   /usr/share/nginx/html;
+    }
+
+    # proxy the PHP scripts to Apache listening on 127.0.0.1:80
+    #
+    #location ~ \.php$ {
+    #    proxy_pass   http://127.0.0.1;
+    #}
+
+    # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
+    #
+    #location ~ \.php$ {
+    #    root           html;
+    #    fastcgi_pass   127.0.0.1:9000;
+    #    fastcgi_index  index.php;
+    #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
+    #    include        fastcgi_params;
+    #}
+
+    # deny access to .htaccess files, if Apache's document root
+    # concurs with nginx's one
+    #
+    #location ~ /\.ht {
+    #    deny  all;
+    #}
+}

From ebb078310393a3c04096caf0fb1982ff668cd035 Mon Sep 17 00:00:00 2001
From: Michael Weimann <mail@michael-weimann.eu>
Date: Sun, 19 Sep 2021 12:55:33 +0200
Subject: [PATCH 4/8] add reuse compliance #5

---
 .drone.yml                      |   2 ++
 .reuse/dep5                     |  28 +++++++++++++++++----
 Dockerfile                      |   4 +++
 LICENSES/LicenseRef-WTF.txt     |   1 +
 LICENSES/OFL-1.1-RFN.txt        |  43 ++++++++++++++++++++++++++++++++
 README.md                       |   7 ++++++
 babel.config.js                 |   4 +++
 etc/nginx/conf.d/default.conf   |   4 +++
 public/apple-touch-icon.png     |   3 ---
 public/config.js.dev            |   3 +++
 public/config.js.int            |   3 +++
 public/favicon-96x96.png        |   3 ---
 public/favicon.ico              | Bin 1150 -> 0 bytes
 public/index.html               |   6 +++++
 src/App.vue                     |   7 +++++-
 src/assets/global.scss          |   2 ++
 src/assets/variables.scss       |   6 +++++
 src/components/AutoComplete.vue |   7 +++++-
 src/components/ProfileList.vue  |   7 +++++-
 src/main.js                     |   3 +++
 src/mixins/request.mixin.js     |   4 +++
 src/router/index.js             |   3 +++
 src/views/Index.vue             |   7 +++++-
 src/views/Search.vue            |   7 +++++-
 src/views/partials/Footer.vue   |   6 +++++
 src/views/profile/Edit.vue      |   7 +++++-
 src/views/profile/View.vue      |   7 +++++-
 27 files changed, 166 insertions(+), 18 deletions(-)
 create mode 100644 LICENSES/LicenseRef-WTF.txt
 create mode 100644 LICENSES/OFL-1.1-RFN.txt
 delete mode 100644 public/apple-touch-icon.png
 delete mode 100644 public/favicon-96x96.png
 delete mode 100644 public/favicon.ico

diff --git a/.drone.yml b/.drone.yml
index 2cb7cbf..670e327 100644
--- a/.drone.yml
+++ b/.drone.yml
@@ -7,6 +7,8 @@ type: docker
 name: default
 
 steps:
+- name: reuse
+  image: fsfe/reuse:latest
 - name: docker-publish
   image: plugins/docker
   settings:
diff --git a/.reuse/dep5 b/.reuse/dep5
index 16c06ba..2847c45 100644
--- a/.reuse/dep5
+++ b/.reuse/dep5
@@ -3,8 +3,26 @@ Upstream-Name: ki-frontend
 Upstream-Contact: Scammo <kontakt@samuelbrinkmann.de>
 Source: https://git.wtf-eg.de/kompetenzinventar/ki-frontend
 
-# Sample paragraph, commented out:
-#
-# Files: src/*
-# Copyright: $YEAR $NAME <$CONTACT>
-# License: ...
+Files: package.json package-lock.json
+Copyright: WTF Kooperative eG <https://wtf-eg.de/>
+License: AGPL-3.0-or-later
+
+Files: .browserslistrc .dockerignore .eslintrc.js .gitignore 
+Copyright: WTF Kooperative eG <https://wtf-eg.de/>
+License: AGPL-3.0-or-later
+
+Files: public/img/wtf_logo.svg src/assets/img/wtf_logo_white.svg
+Copyright: WTF Kooperative eG <https://wtf-eg.de/>
+License: LicenseRef-WTF
+
+Files: src/assets/language_level.json src/assets/skill_level.json
+Copyright: WTF Kooperative eG <https://wtf-eg.de/>
+License: AGPL-3.0-or-later
+
+Files: public/img/bootstrap-icons-1.5.0/*
+Copyright: Copyright (c) 2019-2020 The Bootstrap Authors
+License: MIT
+
+Files: public/fonts/Lato*
+Copyright: 2010-2015, Łukasz Dziedzic (dziedzic@typoland.com)
+License: OFL-1.1-RFN
diff --git a/Dockerfile b/Dockerfile
index 7ba9a5e..62199ac 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,3 +1,7 @@
+# SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+#
+# SPDX-License-Identifier: AGPL-3.0-or-later
+
 FROM node:14-alpine as builder
 
 COPY . ./
diff --git a/LICENSES/LicenseRef-WTF.txt b/LICENSES/LicenseRef-WTF.txt
new file mode 100644
index 0000000..200df4a
--- /dev/null
+++ b/LICENSES/LicenseRef-WTF.txt
@@ -0,0 +1 @@
+Alle Rechte vorbehalten
diff --git a/LICENSES/OFL-1.1-RFN.txt b/LICENSES/OFL-1.1-RFN.txt
new file mode 100644
index 0000000..6fe84ee
--- /dev/null
+++ b/LICENSES/OFL-1.1-RFN.txt
@@ -0,0 +1,43 @@
+SIL OPEN FONT LICENSE
+
+Version 1.1 - 26 February 2007
+
+PREAMBLE
+
+The goals of the Open Font License (OFL) are to stimulate worldwide development of collaborative font projects, to support the font creation efforts of academic and linguistic communities, and to provide a free and open framework in which fonts may be shared and improved in partnership with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and redistributed freely as long as they are not sold by themselves. The fonts, including any derivative works, can be bundled, embedded, redistributed and/or sold with any software provided that any reserved names are not used by derivative works. The fonts and derivatives, however, cannot be released under any other type of license. The requirement for fonts to remain under this license does not apply to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+
+"Font Software" refers to the set of files released by the Copyright Holder(s) under this license and clearly marked as such. This may include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting, or substituting — in part or in whole — any of the components of the Original Version, by changing formats or by porting the Font Software to a new environment.
+
+"Author" refers to any designer, engineer, programmer, technical writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of the Font Software, to use, study, copy, merge, embed, modify, redistribute, and sell modified and unmodified copies of the Font Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components, in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled, redistributed and/or sold with any software, provided that each copy contains the above copyright notice and this license. These can be included either as stand-alone text files, human-readable headers or in the appropriate machine-readable metadata fields within text or binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font Name(s) unless explicit written permission is granted by the corresponding Copyright Holder. This restriction only applies to the primary font name as presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font Software shall not be used to promote, endorse or advertise any Modified Version, except to acknowledge the contribution(s) of the Copyright Holder(s) and the Author(s) or with their explicit written permission.
+
+5) The Font Software, modified or unmodified, in part or in whole, must be distributed entirely under this license, and must not be distributed under any other license. The requirement for fonts to remain under this license does not apply to any document created using the Font Software.
+
+TERMINATION
+
+This license becomes null and void if any of the above conditions are not met.
+
+DISCLAIMER
+
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM OTHER DEALINGS IN THE FONT SOFTWARE.
diff --git a/README.md b/README.md
index a91b106..2580adf 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,13 @@
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
 # ki-frontend
 
 [![Build Status](https://drone.wtf-eg.de/api/badges/kompetenzinventar/ki-frontend/status.svg)](https://drone.wtf-eg.de/kompetenzinventar/ki-frontend)
+[![REUSE status](https://api.reuse.software/badge/git.wtf-eg.de/kompetenzinventar/ki-frontend)](https://api.reuse.software/info/git.wtf-eg.de/kompetenzinventar/ki-frontend)
 
 ## Über
 
diff --git a/babel.config.js b/babel.config.js
index e955840..78befaf 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -1,3 +1,7 @@
+// SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+//
+// SPDX-License-Identifier: AGPL-3.0-or-later
+
 module.exports = {
   presets: [
     '@vue/cli-plugin-babel/preset'
diff --git a/etc/nginx/conf.d/default.conf b/etc/nginx/conf.d/default.conf
index 0c3122d..8b91bec 100644
--- a/etc/nginx/conf.d/default.conf
+++ b/etc/nginx/conf.d/default.conf
@@ -1,3 +1,7 @@
+# SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+#
+# SPDX-License-Identifier: AGPL-3.0-or-later
+
 server {
     listen       80;
     listen  [::]:80;
diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png
deleted file mode 100644
index 5b05aaf..0000000
--- a/public/apple-touch-icon.png
+++ /dev/null
@@ -1,3 +0,0 @@
-version https://git-lfs.github.com/spec/v1
-oid sha256:78047c1b779820271298de92cbeaae9fc9be8e7305cc1d04050046dcbeab57bc
-size 22506
diff --git a/public/config.js.dev b/public/config.js.dev
index 583034c..31f295d 100644
--- a/public/config.js.dev
+++ b/public/config.js.dev
@@ -1,4 +1,7 @@
+// SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+//
 // SPDX-License-Identifier: AGPL-3.0-or-later
+
 window.ki = {
   apiUrl: 'http://localhost:5000'
 }
diff --git a/public/config.js.int b/public/config.js.int
index 30f1e84..1f864fb 100644
--- a/public/config.js.int
+++ b/public/config.js.int
@@ -1,4 +1,7 @@
+// SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+//
 // SPDX-License-Identifier: AGPL-3.0-or-later
+
 window.ki = {
   apiUrl: 'http://localhost:13338'
 }
diff --git a/public/favicon-96x96.png b/public/favicon-96x96.png
deleted file mode 100644
index 187af2e..0000000
--- a/public/favicon-96x96.png
+++ /dev/null
@@ -1,3 +0,0 @@
-version https://git-lfs.github.com/spec/v1
-oid sha256:c943b50d7fc442cf26577f30ca7d71faae3d368cf94d5283cad0395fc724a51b
-size 10248
diff --git a/public/favicon.ico b/public/favicon.ico
deleted file mode 100644
index 37ced2eb4b3b098e43ab62e26dbc423c411f1280..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1150
zcmbVMSxA&o6h5;wsg0?XHYnoqP)%5fC<Q@1xJ~*bnp!B%WMCMs58=Yl1d5Ic;Q}({
zmW@k@sDr4uF)}E*fm`lbj*2n~Y8nYzf8QM&um@kdKi@t7J<Gjkx#tq`@Y&lFW_Nlj
zByu96YXDf_9P>elATyjlhIx(2%F2r8=;%mpZf+LVX_RLXNF)+sHa0dkyoiX18`ag-
zF;!Jn*PWc4_#%;rsW}7pfnXpO2n3vce0(S+CB?e2vGHzsdATAmFwi|LEKJ<h)uo=B
zoBPt;-Tf>xGt&yXcYx=>3!ny20M><tg)So_BX1WM7fm{yE?F!V3kwPgC@Cq)c6fML
zv%bFm6SUgj-#-BQzQ9A^F(B1ywYO(yXAK)08wdUU{Yqb7-!o}xX%G>Wl$20LM#hD)
zv9a2%tu1b0VPOP520_FR4-Xf0c6Q2FR#uFV9SsZ&6d-2ntgI}vtz|+EC^t7(GBGis
z+u7OSR##WQVGm_TN5|{U&CMU%+uOf~hK4kWiHWv(d3hGIe`rff3l$X=xsQ&H>JcOJ
z<JVtsgM)(&N~Q8*X=&*{HYXQ+KA#Q`52>!ME_-HXhTGfQ<92s<x$*JwUzL@WF@1e~
zC)LgWuCA`+<>kc-4i3H<5)yI=Og>`xU^E)J<>h5=X=#aDTU+Dc`zwy)C^R(GRVI^3
z6A}`Lo#)}<!S)eUR8(k@gZB!B!W+KN?C<Y$sKwgk<fMuHPfbnfk+++*wY6PkWo2r%
zmp~vO2L}g&J~cNt%k_HwK|@2sXT*HSa@N|~`lz?JH{E119ZgS9|E#aC|7tK8zN3}_
zZEbC4|JjtEpHC{4>N<FvEN;}9>*?uvgZm}Q&d#>OzPkDOdFBJx)YSATH8oX|o}O;D
zPfkvz*w|Q6adGhzwOXx3?u@9}JKRGTRwvYuz`xqw-ma^usaeEX6{yhzKR-V~e0)3!
zg+h^BE|=xx<j5i;BgM$$9o#>0Kmfaf$0H~xh_Jo@e{SL2bMQ4RIy(9;qyqGir?<Da
zr$(dU#l^*0OirayQBkai1X8K=3VO{2is<V98mym%x6APcu!jOe1&&@o^z|&!jvdhf
Zo&?oJ06fNLc=-}e>xnLZB)WG*^ar-gi0%LY

diff --git a/public/index.html b/public/index.html
index a0bb7df..311fd69 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1,3 +1,9 @@
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
 <!DOCTYPE html>
 <html lang="de">
   <head>
diff --git a/src/App.vue b/src/App.vue
index 1be75b1..a46ea33 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,4 +1,9 @@
-<!-- SPDX-License-Identifier: AGPL-3.0-or-later -->
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
 <template>
   <div class="alert alert-success text-center mb-0" role="alert">
     Willkommen beim Alpha-Test!
diff --git a/src/assets/global.scss b/src/assets/global.scss
index 5f64cc5..221bd2a 100644
--- a/src/assets/global.scss
+++ b/src/assets/global.scss
@@ -1,4 +1,6 @@
 /*
+ * SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+ *
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
diff --git a/src/assets/variables.scss b/src/assets/variables.scss
index e4588b8..3482ec6 100644
--- a/src/assets/variables.scss
+++ b/src/assets/variables.scss
@@ -1,2 +1,8 @@
+/*
+ * SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+ *
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
 $primary: #0790a9;
 $dark: #344b5d;
diff --git a/src/components/AutoComplete.vue b/src/components/AutoComplete.vue
index 526de5f..c1372eb 100644
--- a/src/components/AutoComplete.vue
+++ b/src/components/AutoComplete.vue
@@ -1,4 +1,9 @@
-<!-- SPDX-License-Identifier: AGPL-3.0-or-later -->
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
 <template>
   <div>
     <label for="searchText" class="form-label fw-bold">{{ label }}</label>
diff --git a/src/components/ProfileList.vue b/src/components/ProfileList.vue
index 26482f8..3aad96e 100644
--- a/src/components/ProfileList.vue
+++ b/src/components/ProfileList.vue
@@ -1,4 +1,9 @@
-<!-- SPDX-License-Identifier: AGPL-3.0-or-later -->
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
 <template>
   <ul>
     <li v-for="(value, valueKey) in values" :key="value.id">
diff --git a/src/main.js b/src/main.js
index a5ed6f4..ddfcee9 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,4 +1,7 @@
+// SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+//
 // SPDX-License-Identifier: AGPL-3.0-or-later
+
 import { createApp } from 'vue/dist/vue.esm-bundler'
 import App from './App.vue'
 import router from './router'
diff --git a/src/mixins/request.mixin.js b/src/mixins/request.mixin.js
index 98ee516..a98b420 100644
--- a/src/mixins/request.mixin.js
+++ b/src/mixins/request.mixin.js
@@ -1,3 +1,7 @@
+// SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+//
+// SPDX-License-Identifier: AGPL-3.0-or-later
+
 import axios from "axios";
 
 export default {
diff --git a/src/router/index.js b/src/router/index.js
index 08d12ae..ac49c07 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,4 +1,7 @@
+// SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+//
 // SPDX-License-Identifier: AGPL-3.0-or-later
+
 import { createRouter, createWebHistory } from 'vue-router'
 import Index from '@/views/Index.vue'
 import Search from '@/views/Search.vue'
diff --git a/src/views/Index.vue b/src/views/Index.vue
index 1fe63e2..01af15d 100644
--- a/src/views/Index.vue
+++ b/src/views/Index.vue
@@ -1,4 +1,9 @@
-<!-- SPDX-License-Identifier: AGPL-3.0-or-later -->
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
 <template>
   <div class="container">
     <h1>WTF Kompetenzinventar</h1>
diff --git a/src/views/Search.vue b/src/views/Search.vue
index 90f3d46..20f2173 100644
--- a/src/views/Search.vue
+++ b/src/views/Search.vue
@@ -1,4 +1,9 @@
-<!-- SPDX-License-Identifier: AGPL-3.0-or-later -->
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
 <template>
   <div class="container">
     <h1>Suche</h1>
diff --git a/src/views/partials/Footer.vue b/src/views/partials/Footer.vue
index 804f9ec..a7b3c42 100644
--- a/src/views/partials/Footer.vue
+++ b/src/views/partials/Footer.vue
@@ -1,3 +1,9 @@
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
 <template>
 <footer class="bg-dark py-5">
   <div class="container">
diff --git a/src/views/profile/Edit.vue b/src/views/profile/Edit.vue
index b4122ed..85ea3eb 100644
--- a/src/views/profile/Edit.vue
+++ b/src/views/profile/Edit.vue
@@ -1,4 +1,9 @@
-<!-- SPDX-License-Identifier: AGPL-3.0-or-later -->
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
 <template>
   <div class="container">
     <h1>Profil bearbeiten</h1>
diff --git a/src/views/profile/View.vue b/src/views/profile/View.vue
index 9586efe..3ec8be4 100644
--- a/src/views/profile/View.vue
+++ b/src/views/profile/View.vue
@@ -1,4 +1,9 @@
-<!-- SPDX-License-Identifier: AGPL-3.0-or-later -->
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
 <template>
   <div v-if="profile" class="container">
     <h1>

From a13314327cd520e0c5c3b66539f5099769eea019 Mon Sep 17 00:00:00 2001
From: Michael Weimann <mail@michael-weimann.eu>
Date: Sun, 19 Sep 2021 15:55:18 +0200
Subject: [PATCH 5/8] replace axios by fetch #13

---
 package-lock.json           |  19 -----
 package.json                |   1 -
 src/mixins/request.mixin.js | 144 +++++++++++++++++++++++-------------
 3 files changed, 92 insertions(+), 72 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 2205725..4fa14de 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,7 +13,6 @@
         "@vue/cli-plugin-router": "~4.5.0",
         "@vue/cli-service": "~4.5.0",
         "@vue/compiler-sfc": "^3.0.0",
-        "axios": "^0.21.1",
         "babel-eslint": "^10.1.0",
         "bootstrap": "^5.0.1",
         "core-js": "^3.6.5",
@@ -2587,15 +2586,6 @@
       "integrity": "sha1-1h9G2DslGSUOJ4Ta9bCUeai0HFk=",
       "dev": true
     },
-    "node_modules/axios": {
-      "version": "0.21.1",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
-      "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
-      "dev": true,
-      "dependencies": {
-        "follow-redirects": "^1.10.0"
-      }
-    },
     "node_modules/babel-eslint": {
       "version": "10.1.0",
       "resolved": "https://registry.npm.taobao.org/babel-eslint/download/babel-eslint-10.1.0.tgz",
@@ -16912,15 +16902,6 @@
       "integrity": "sha1-1h9G2DslGSUOJ4Ta9bCUeai0HFk=",
       "dev": true
     },
-    "axios": {
-      "version": "0.21.1",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
-      "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
-      "dev": true,
-      "requires": {
-        "follow-redirects": "^1.10.0"
-      }
-    },
     "babel-eslint": {
       "version": "10.1.0",
       "resolved": "https://registry.npm.taobao.org/babel-eslint/download/babel-eslint-10.1.0.tgz",
diff --git a/package.json b/package.json
index 0d93fa3..2c0f6d9 100644
--- a/package.json
+++ b/package.json
@@ -12,7 +12,6 @@
     "@vue/cli-plugin-router": "~4.5.0",
     "@vue/cli-service": "~4.5.0",
     "@vue/compiler-sfc": "^3.0.0",
-    "axios": "^0.21.1",
     "babel-eslint": "^10.1.0",
     "bootstrap": "^5.0.1",
     "core-js": "^3.6.5",
diff --git a/src/mixins/request.mixin.js b/src/mixins/request.mixin.js
index a98b420..06c33b0 100644
--- a/src/mixins/request.mixin.js
+++ b/src/mixins/request.mixin.js
@@ -2,29 +2,33 @@
 //
 // SPDX-License-Identifier: AGPL-3.0-or-later
 
-import axios from "axios";
-
 export default {
   methods: {
     async submitLogin() {
       this.showErrorMessage = false;
       try {
-        const loginResult = await axios.post(
-          `${this.apiUrl}/users/login`,
-          {
-            username: this.username,
-            password: this.password,
-          }
-        );
-        if (loginResult.status === 200) {
-          this.showErrorMessage = false;
-          //success login
-          localStorage.setItem("token", loginResult.data.token);
-          localStorage.setItem("user_id", loginResult.data.user_id);
-          this.$router.push({ path: "/s/search" });
-        } else {
-          this.showErrorMessage = true;
+        const data = JSON.stringify({
+          username: this.username,
+          password: this.password,
+        })
+
+        const response = await fetch(`${this.apiUrl}/users/login`, {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: data
+        })
+
+        if (!response.ok) {
+          this.showErrorMessage = true
+          return
         }
+
+        const responseData = await response.json()
+        localStorage.setItem('token', responseData.token);
+        localStorage.setItem('user_id', responseData.user_id);
+        this.$router.push({ path: '/s/search' });
       } catch (error) {
         console.error(error);
         this.showErrorMessage = true;
@@ -32,23 +36,28 @@ export default {
     },
     async search() {
       try {
-        const request = await axios.get(
-          `${this.apiUrl}/${this.type}s?search=${this.searchText}`,
-          {
+        const response = await fetch(`${this.apiUrl}/${this.type}s?search=${this.searchText}`, {
             headers: {
               Authorization: `Bearer ${localStorage.getItem("token")}`,
             },
           }
         );
-        if (request.status === 200) {
-          this.searchResults = request.data[`${this.type}s`];
-          if (
-            !this.values
-              .map((item) => item[this.type].name.toLowerCase())
-              .includes(this.searchText.toLowerCase())
-          ) {
-            this.searchResults.unshift({ name: this.searchText });
-          }
+
+        if (!response.ok) {
+          console.error();
+          this.showErrorMessage = true;
+          return
+        }
+
+        const responseData = await response.json()
+        this.searchResults = responseData[`${this.type}s`];
+
+        if (
+          !this.values
+          .map((item) => item[this.type].name.toLowerCase())
+          .includes(this.searchText.toLowerCase())
+        ) {
+          this.searchResults.unshift({ name: this.searchText });
         }
       } catch (error) {
         console.error();
@@ -56,36 +65,52 @@ export default {
       }
     },
     async initEditPage() {
+      const userId = localStorage.getItem('user_id')
+      const url = `${this.apiUrl}/users/${userId}/profile`
+
       try {
-        const userProfile = await axios.get(
-          `${this.apiUrl}/users/${localStorage.getItem("user_id")}/profile`,
-          {
-            headers: { Authorization: `Bearer ${localStorage.getItem("token")}` },
+        const response = await fetch(url, {
+            headers: { 
+              Authorization: `Bearer ${localStorage.getItem("token")}` 
+            },
           }
         );
-        this.profile = userProfile.data.profile;
+
+        if (!response.ok) {
+          return
+        }
+
+        const responseData = await response.json()
+        
+        this.profile = responseData.profile;
       } catch (error) {
         console.error(error);
       }
     },
     async submitFormEdit() {
+      this.showErrorMessage = false
+      this.showSuccessMessage = false
+
       try {
-        const formSubmitResult = await axios.post(
+        const body = JSON.stringify(this.profile)
+        const response = await fetch(
           `${this.apiUrl}/users/${localStorage.getItem("user_id")}/profile`,
-          this.profile,
           {
+            method: 'POST',
             headers: {
               Authorization: `Bearer ${localStorage.getItem("token")}`,
+              'Content-Type': 'application/json',
             },
+            body
           }
         );
-        if (formSubmitResult.status === 200) {
-          // success
-          this.showSuccessMessage = true;
-        } else {
-          // failure
-          this.showErrorMessage = true;
+
+        if (!response.ok) {
+          this.showErrorMessage = true
+          return
         }
+        
+        this.showSuccessMessage = true
       } catch (error) {
         console.error(error);
         this.showErrorMessage = true;
@@ -93,35 +118,50 @@ export default {
     },
     async initViewPage() {
       try {
-        const userProfile = await axios.get(
-          `${this.apiUrl}/users/${this.$route.params.memberId}/profile`,
-          {
+        const response = await fetch(`${this.apiUrl}/users/${this.$route.params.memberId}/profile`, {
             headers: { Authorization: `Bearer ${localStorage.getItem("token")}` },
           }
         );
-        this.profile = userProfile.data.profile;
+
+        if (!response.ok) {
+          return
+        }
+
+        const responseData = await response.json()
+        this.profile = responseData.profile;
       } catch (error) {
         console.error(error);
       }
     },
     async submitSearch() {
       this.showErrorMessage = false;
+
       try {
-        let url = `${this.apiUrl}/users/profiles`;
+        const url = new URL(`${this.apiUrl}/users/profiles`)
+
         if (this.searchText != "") {
-          url += `?nickname=${this.searchText}`;
+          url.searchParams.append('nickname', this.searchText)
         }
-        const result = await axios.get(url, {
+
+        const response = await fetch(url, {
           headers: {
             Authorization: `Bearer ${localStorage.getItem("token")}`,
           },
         });
-        this.searchResults = result.data.profiles;
-        this.searchTotal = result.data.total;
+
+        if (!response.ok) {
+          this.showErrorMessage = true
+          return
+        }
+
+        const responseData = await response.json()
+
+        this.searchResults = responseData.profiles;
+        this.searchTotal = responseData.total;
       } catch (error) {
         console.error(error);
         this.showErrorMessage = true;
       }
     },
   },
-}
\ No newline at end of file
+}

From a1546849c8ba7f02a63b4cb4d7c4116dd3be6851 Mon Sep 17 00:00:00 2001
From: Michael Weimann <mail@michael-weimann.eu>
Date: Sun, 19 Sep 2021 15:56:48 +0200
Subject: [PATCH 6/8] apply login view design #29

---
 .reuse/dep5                             |  2 +-
 src/App.vue                             | 84 ++-----------------------
 src/assets/global.scss                  |  4 ++
 {public => src/assets}/img/wtf_logo.svg |  0
 src/assets/variables.scss               | 10 ++-
 src/views/Index.vue                     | 51 +++++++++------
 src/views/partials/Navbar.vue           | 83 ++++++++++++++++++++++++
 7 files changed, 133 insertions(+), 101 deletions(-)
 rename {public => src/assets}/img/wtf_logo.svg (100%)
 create mode 100644 src/views/partials/Navbar.vue

diff --git a/.reuse/dep5 b/.reuse/dep5
index 2847c45..688310d 100644
--- a/.reuse/dep5
+++ b/.reuse/dep5
@@ -11,7 +11,7 @@ Files: .browserslistrc .dockerignore .eslintrc.js .gitignore
 Copyright: WTF Kooperative eG <https://wtf-eg.de/>
 License: AGPL-3.0-or-later
 
-Files: public/img/wtf_logo.svg src/assets/img/wtf_logo_white.svg
+Files: src/assets/img/wtf_logo*
 Copyright: WTF Kooperative eG <https://wtf-eg.de/>
 License: LicenseRef-WTF
 
diff --git a/src/App.vue b/src/App.vue
index a46ea33..269650f 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -5,97 +5,21 @@ SPDX-License-Identifier: AGPL-3.0-or-later
 -->
 
 <template>
-  <div class="alert alert-success text-center mb-0" role="alert">
-    Willkommen beim Alpha-Test!
-    <a target="_blank" href="https://git.wtf-eg.de/kompetenzinventar/ki-frontend/issues/new">Problem gefunden? Bitte hier ein Issue anlegen.</a>
-  </div>
   <header v-if="this.$route.path.includes('/s/')">
-    <nav class="navbar navbar-expand-lg navbar-light bg-light">
-      <div class="container-fluid">
-        <a class="navbar-brand" href="#">KI</a>
-        <button
-          @click="showMobileNavbar = !showMobileNavbar"
-          class="navbar-toggler"
-          type="button"
-          data-bs-toggle="collapse"
-          data-bs-target="#navbarSupportedContent"
-          aria-controls="navbarSupportedContent"
-          aria-expanded="false"
-          aria-label="Toggle navigation"
-        >
-          <span class="navbar-toggler-icon"></span>
-        </button>
-        <div
-          class="collapse navbar-collapse"
-          :class="{
-            show: showMobileNavbar,
-          }"
-          id="navbarSupportedContent"
-        >
-          <ul class="navbar-nav me-auto mb-2 mb-lg-0">
-            <li class="nav-item">
-              <router-link
-                class="nav-link"
-                :to="{ path: `/s/search` }"
-                active-class="active"
-                >Suche</router-link
-              >
-            </li>
-            <li class="nav-item">
-              <router-link
-                class="nav-link"
-                :to="{ path: `/s/profile/${memberId}` }"
-                active-class="active"
-                >Mein Profil</router-link
-              >
-            </li>
-            <li class="nav-item">
-              <router-link
-                class="nav-link"
-                :to="{ path: `/s/profile-edit` }"
-                active-class="active"
-                >Bearbeiten</router-link
-              >
-            </li>
-            <li class="nav-item">
-              <button class="btn btn-outline-danger" @click="logout()">
-                Logout
-              </button>
-              <a class="nav-link active" aria-current="page" href="#"></a>
-            </li>
-          </ul>
-          <form class="d-flex" @submit.prevent="searchRedirect()">
-            <input
-              class="form-control me-2"
-              v-model="searchText"
-              type="search"
-              placeholder="Profile durchsuchen"
-              aria-label="Search"
-            />
-            <button
-              class="btn btn-outline-primary"
-              type="submit"
-            >
-              <img
-                src="/img/bootstrap-icons-1.5.0/search.svg"
-                alt="Suche Icon"
-              />
-            </button>
-          </form>
-        </div>
-      </div>
-    </nav>
+    <Navbar />
   </header>
   <router-view />
   <Footer />
 </template>
 <script>
 import Footer from '@/views/partials/Footer.vue'
+import Navbar from '@/views/partials/Navbar.vue'
 
 export default {
   name: "App",
   components: {
-    Footer
+    Footer,
+    Navbar,
   },
   data() {
     return {
diff --git a/src/assets/global.scss b/src/assets/global.scss
index 221bd2a..204a732 100644
--- a/src/assets/global.scss
+++ b/src/assets/global.scss
@@ -6,3 +6,7 @@
 
 @import "variables";
 @import "bootstrap/scss/bootstrap";
+
+.btn-primary {
+  color: #fff !important;
+}
diff --git a/public/img/wtf_logo.svg b/src/assets/img/wtf_logo.svg
similarity index 100%
rename from public/img/wtf_logo.svg
rename to src/assets/img/wtf_logo.svg
diff --git a/src/assets/variables.scss b/src/assets/variables.scss
index 3482ec6..2e88ee0 100644
--- a/src/assets/variables.scss
+++ b/src/assets/variables.scss
@@ -4,5 +4,13 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
+$gray-100: #edefeb;
+$gray-800: #344b5d;
+
 $primary: #0790a9;
-$dark: #344b5d;
+$dark: $gray-800;
+
+$body-bg: $gray-100;
+
+$link-decoration: none;
+$link-hover-decoration: underline;
diff --git a/src/views/Index.vue b/src/views/Index.vue
index 01af15d..083bbbc 100644
--- a/src/views/Index.vue
+++ b/src/views/Index.vue
@@ -5,12 +5,15 @@ SPDX-License-Identifier: AGPL-3.0-or-later
 -->
 
 <template>
-  <div class="container">
-    <h1>WTF Kompetenzinventar</h1>
-    <form @submit.prevent="submitLogin()">
+  <div class="container pt-5">
+    <div class="text-center mb-5">
+      <img class="wtf-logo wtf-logo--index" src="@/assets/img/wtf_logo.svg">
+      <h1>Kompetenzinventar</h1>
+    </div>
+    <form @submit.prevent="submitLogin()" class="bg-white p-3 login-form">
       <div class="mb-3">
-        <label for="exampleInputusername1" class="form-label"
-          >Benutzername:
+        <label for="exampleInputusername1" class="form-label" >
+          WTF-Benutzername:
         </label>
         <input
           type="username"
@@ -30,21 +33,16 @@ SPDX-License-Identifier: AGPL-3.0-or-later
           required
         />
       </div>
-      <button type="submit" class="btn btn-primary mb-4">Login</button>
+      <button type="submit" class="btn btn-primary">Login</button>
+      <a class="btn btn-link" href="https://resetpw.wtf-eg.de/">Passwort vergessen?</a>
+      <div
+        class="alert alert-danger mt-3 mb-0"
+        role="alert"
+        v-if="showErrorMessage"
+      >
+        Dein Benutzername oder Passwort ist falsch.<br>Versuche es noch einmal.
+      </div>
     </form>
-    <a href="https://resetpw.wtf-eg.de/">Globales WTF Passwort zurücksetzen</a>
-    <div
-      class="alert alert-danger mb-4 mt-4"
-      role="alert"
-      v-if="showErrorMessage"
-    >
-      Mit deinen Login Daten ist ein Fehler aufgetreten. Versuch es nochmal oder
-      <a href="https://resetpw.wtf-eg.de/">hast du dein Passwort vergessen?</a>.
-    </div>
-    <p>
-      Das Login gilt nur für WTF eG Mitglieder. Du kannst dein LDAP Passwort
-      hier ändern.
-    </p>
   </div>
 </template>
 <script>
@@ -62,3 +60,18 @@ export default {
   },
 };
 </script>
+
+<style scoped>
+.container {
+  min-height: 100vh;
+}
+
+.login-form {
+  margin: 0 auto;
+  max-width: 500px;
+}
+
+.wtf-logo--index {
+  max-width: 200px;
+}
+</style>
diff --git a/src/views/partials/Navbar.vue b/src/views/partials/Navbar.vue
new file mode 100644
index 0000000..9acaf06
--- /dev/null
+++ b/src/views/partials/Navbar.vue
@@ -0,0 +1,83 @@
+<!--
+SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+
+SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+
+<template>
+  <nav class="navbar navbar-expand-lg navbar-light bg-light">
+    <div class="container-fluid">
+      <a class="navbar-brand" href="#">KI</a>
+      <button
+        @click="showMobileNavbar = !showMobileNavbar"
+        class="navbar-toggler"
+        type="button"
+        data-bs-toggle="collapse"
+        data-bs-target="#navbarSupportedContent"
+        aria-controls="navbarSupportedContent"
+        aria-expanded="false"
+        aria-label="Toggle navigation"
+      >
+        <span class="navbar-toggler-icon"></span>
+      </button>
+      <div
+        class="collapse navbar-collapse"
+        :class="{
+          show: showMobileNavbar,
+        }"
+        id="navbarSupportedContent"
+      >
+        <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+          <li class="nav-item">
+            <router-link
+              class="nav-link"
+              :to="{ path: `/s/search` }"
+              active-class="active"
+              >Suche</router-link
+            >
+          </li>
+          <li class="nav-item">
+            <router-link
+              class="nav-link"
+              :to="{ path: `/s/profile/${memberId}` }"
+              active-class="active"
+              >Mein Profil</router-link
+            >
+          </li>
+          <li class="nav-item">
+            <router-link
+              class="nav-link"
+              :to="{ path: `/s/profile-edit` }"
+              active-class="active"
+              >Bearbeiten</router-link
+            >
+          </li>
+          <li class="nav-item">
+            <button class="btn btn-outline-danger" @click="logout()">
+              Logout
+            </button>
+            <a class="nav-link active" aria-current="page" href="#"></a>
+          </li>
+        </ul>
+        <form class="d-flex" @submit.prevent="searchRedirect()">
+          <input
+            class="form-control me-2"
+            v-model="searchText"
+            type="search"
+            placeholder="Profile durchsuchen"
+            aria-label="Search"
+          />
+          <button
+            class="btn btn-outline-primary"
+            type="submit"
+          >
+            <img
+              src="/img/bootstrap-icons-1.5.0/search.svg"
+              alt="Suche Icon"
+            />
+          </button>
+        </form>
+      </div>
+    </div>
+  </nav>
+</template>

From 94d2a98b961bdf2302fc4bb4b41b476b3feeb9aa Mon Sep 17 00:00:00 2001
From: Michael Weimann <mail@michael-weimann.eu>
Date: Sun, 19 Sep 2021 16:38:43 +0200
Subject: [PATCH 7/8] apply navbar style #15

---
 src/App.vue                                   | 15 +----
 src/{views/partials => components}/Footer.vue |  0
 src/{views/partials => components}/Navbar.vue | 56 ++++++++++++++++---
 3 files changed, 49 insertions(+), 22 deletions(-)
 rename src/{views/partials => components}/Footer.vue (100%)
 rename src/{views/partials => components}/Navbar.vue (66%)

diff --git a/src/App.vue b/src/App.vue
index 269650f..2727711 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -12,8 +12,8 @@ SPDX-License-Identifier: AGPL-3.0-or-later
   <Footer />
 </template>
 <script>
-import Footer from '@/views/partials/Footer.vue'
-import Navbar from '@/views/partials/Navbar.vue'
+import Footer from '@/components/Footer.vue'
+import Navbar from '@/components/Navbar.vue'
 
 export default {
   name: "App",
@@ -23,9 +23,7 @@ export default {
   },
   data() {
     return {
-      showMobileNavbar: false,
       memberId: null,
-      searchText: "",
     };
   },
   created() {
@@ -34,14 +32,5 @@ export default {
   updated() {
     this.memberId = localStorage.getItem("user_id");
   },
-  methods: {
-    logout() {
-      localStorage.clear();
-      this.$router.push({ path: "/" });
-    },
-    searchRedirect() {
-      this.$router.push({ path: `/s/search?text`, query: { query: this.searchText } } );
-    },
-  },
 };
 </script>
diff --git a/src/views/partials/Footer.vue b/src/components/Footer.vue
similarity index 100%
rename from src/views/partials/Footer.vue
rename to src/components/Footer.vue
diff --git a/src/views/partials/Navbar.vue b/src/components/Navbar.vue
similarity index 66%
rename from src/views/partials/Navbar.vue
rename to src/components/Navbar.vue
index 9acaf06..2356735 100644
--- a/src/views/partials/Navbar.vue
+++ b/src/components/Navbar.vue
@@ -5,15 +5,20 @@ SPDX-License-Identifier: AGPL-3.0-or-later
 -->
 
 <template>
-  <nav class="navbar navbar-expand-lg navbar-light bg-light">
+  <nav class="navbar navbar-expand-lg navbar-light bg-white">
     <div class="container-fluid">
-      <a class="navbar-brand" href="#">KI</a>
+      <router-link
+        class="navbar-brand"
+        :to="{ path:'/s/search' }"
+      >
+        <img class="wtf-logo wtf-logo--navbar" src="@/assets/img/wtf_logo.svg">
+        <span class="d-none d-sm-inline">Kompetenzinventar</span>
+        <span class="d-sm-none">KI</span>
+      </router-link>
       <button
         @click="showMobileNavbar = !showMobileNavbar"
         class="navbar-toggler"
         type="button"
-        data-bs-toggle="collapse"
-        data-bs-target="#navbarSupportedContent"
         aria-controls="navbarSupportedContent"
         aria-expanded="false"
         aria-label="Toggle navigation"
@@ -22,9 +27,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
       </button>
       <div
         class="collapse navbar-collapse"
-        :class="{
-          show: showMobileNavbar,
-        }"
+        :class="{ show: showMobileNavbar }"
         id="navbarSupportedContent"
       >
         <ul class="navbar-nav me-auto mb-2 mb-lg-0">
@@ -39,7 +42,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
           <li class="nav-item">
             <router-link
               class="nav-link"
-              :to="{ path: `/s/profile/${memberId}` }"
+              :to="{ path: `/s/profile/${$root.memberId}` }"
               active-class="active"
               >Mein Profil</router-link
             >
@@ -56,7 +59,6 @@ SPDX-License-Identifier: AGPL-3.0-or-later
             <button class="btn btn-outline-danger" @click="logout()">
               Logout
             </button>
-            <a class="nav-link active" aria-current="page" href="#"></a>
           </li>
         </ul>
         <form class="d-flex" @submit.prevent="searchRedirect()">
@@ -81,3 +83,39 @@ SPDX-License-Identifier: AGPL-3.0-or-later
     </div>
   </nav>
 </template>
+
+<script>
+
+import RequestMixin from "@/mixins/request.mixin"
+
+export default {
+  name: "Navbar",
+  mixins: [RequestMixin],
+  data() {
+    return {
+      showMobileNavbar: false,
+      searchText: ''
+    }
+  },
+  methods: {
+    logout() {
+      localStorage.clear();
+      this.$router.push({ path: "/" });
+    },
+    searchRedirect() {
+      this.$router.push({ path: `/s/search?text`, query: { query: this.searchText } } );
+    },
+  }
+}
+
+</script>
+
+<style>
+
+.wtf-logo--navbar {
+  height: 40px;
+  margin-bottom: -5px;
+  margin-top: -5px;
+}
+
+</style>

From a408cae6864439a875edf7877b147f9ad0d76e45 Mon Sep 17 00:00:00 2001
From: Michael Weimann <mail@michael-weimann.eu>
Date: Sun, 19 Sep 2021 17:30:37 +0200
Subject: [PATCH 8/8] introduce vuex

---
 package-lock.json               | 24 +++++++++++++++-
 package.json                    |  3 +-
 src/App.vue                     | 17 ++---------
 src/components/AutoComplete.vue |  8 ++++--
 src/components/Navbar.vue       | 26 +++++++++++------
 src/main.js                     |  2 ++
 src/mixins/request.mixin.js     | 22 ++++++++-------
 src/router/index.js             |  9 ++++--
 src/store.js                    | 50 +++++++++++++++++++++++++++++++++
 src/views/profile/View.vue      | 14 +++++----
 10 files changed, 129 insertions(+), 46 deletions(-)
 create mode 100644 src/store.js

diff --git a/package-lock.json b/package-lock.json
index 4fa14de..5ce9315 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,7 +21,8 @@
         "sass": "^1.37.5",
         "sass-loader": "^10.2.0",
         "vue": "^3.0.0",
-        "vue-router": "^4.0.0-0"
+        "vue-router": "^4.0.0-0",
+        "vuex": "^4.0.2"
       }
     },
     "node_modules/@babel/code-frame": {
@@ -13335,6 +13336,18 @@
       "integrity": "sha1-HuO8mhbsv1EYvjNLsV+cRvgvWCU=",
       "dev": true
     },
+    "node_modules/vuex": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/vuex/-/vuex-4.0.2.tgz",
+      "integrity": "sha512-M6r8uxELjZIK8kTKDGgZTYX/ahzblnzC4isU1tpmEuOIIKmV+TRdc+H4s8ds2NuZ7wpUTdGRzJRtoj+lI+pc0Q==",
+      "dev": true,
+      "dependencies": {
+        "@vue/devtools-api": "^6.0.0-beta.11"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.2"
+      }
+    },
     "node_modules/watchpack": {
       "version": "1.7.5",
       "resolved": "https://registry.nlark.com/watchpack/download/watchpack-1.7.5.tgz?cache=0&sync_timestamp=1621437900992&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fwatchpack%2Fdownload%2Fwatchpack-1.7.5.tgz",
@@ -25940,6 +25953,15 @@
       "integrity": "sha1-HuO8mhbsv1EYvjNLsV+cRvgvWCU=",
       "dev": true
     },
+    "vuex": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/vuex/-/vuex-4.0.2.tgz",
+      "integrity": "sha512-M6r8uxELjZIK8kTKDGgZTYX/ahzblnzC4isU1tpmEuOIIKmV+TRdc+H4s8ds2NuZ7wpUTdGRzJRtoj+lI+pc0Q==",
+      "dev": true,
+      "requires": {
+        "@vue/devtools-api": "^6.0.0-beta.11"
+      }
+    },
     "watchpack": {
       "version": "1.7.5",
       "resolved": "https://registry.nlark.com/watchpack/download/watchpack-1.7.5.tgz?cache=0&sync_timestamp=1621437900992&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fwatchpack%2Fdownload%2Fwatchpack-1.7.5.tgz",
diff --git a/package.json b/package.json
index 2c0f6d9..088c008 100644
--- a/package.json
+++ b/package.json
@@ -20,6 +20,7 @@
     "sass": "^1.37.5",
     "sass-loader": "^10.2.0",
     "vue": "^3.0.0",
-    "vue-router": "^4.0.0-0"
+    "vue-router": "^4.0.0-0",
+    "vuex": "^4.0.2"
   }
 }
diff --git a/src/App.vue b/src/App.vue
index 2727711..e221db0 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -8,7 +8,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
   <header v-if="this.$route.path.includes('/s/')">
     <Navbar />
   </header>
-  <router-view />
+  <router-view :key="$route.fullPath" />
   <Footer />
 </template>
 <script>
@@ -16,21 +16,10 @@ import Footer from '@/components/Footer.vue'
 import Navbar from '@/components/Navbar.vue'
 
 export default {
-  name: "App",
+  name: 'App',
   components: {
     Footer,
     Navbar,
-  },
-  data() {
-    return {
-      memberId: null,
-    };
-  },
-  created() {
-    this.memberId = localStorage.getItem("user_id");
-  },
-  updated() {
-    this.memberId = localStorage.getItem("user_id");
-  },
+  }
 };
 </script>
diff --git a/src/components/AutoComplete.vue b/src/components/AutoComplete.vue
index c1372eb..43fd420 100644
--- a/src/components/AutoComplete.vue
+++ b/src/components/AutoComplete.vue
@@ -58,8 +58,9 @@ SPDX-License-Identifier: AGPL-3.0-or-later
   </div>
 </template>
 <script>
-import RequestMixin from "@/mixins/request.mixin"
+import { mapState } from 'vuex'
 
+import RequestMixin from "@/mixins/request.mixin"
 import ProfileList from "@/components/ProfileList";
 
 export default {
@@ -87,6 +88,9 @@ export default {
       showErrorMessage: false,
     };
   },
+  computed: {
+    ...mapState(['currentUserId'])
+  },
   methods: {
     addResult(result = false) {
       if (!result) result = this.searchResults[0];
@@ -98,7 +102,7 @@ export default {
 
       let changeValues = Object.assign(this.values);
       let newValue = {
-        profile_id: localStorage.getItem("user_id"),
+        profile_id: this.currentUserId,
       };
       if (this.type != "contacttype") {
         newValue.level = 1;
diff --git a/src/components/Navbar.vue b/src/components/Navbar.vue
index 2356735..c6b5c5f 100644
--- a/src/components/Navbar.vue
+++ b/src/components/Navbar.vue
@@ -16,7 +16,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
         <span class="d-sm-none">KI</span>
       </router-link>
       <button
-        @click="showMobileNavbar = !showMobileNavbar"
+        @click="toggleMobileNav"
         class="navbar-toggler"
         type="button"
         aria-controls="navbarSupportedContent"
@@ -27,7 +27,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
       </button>
       <div
         class="collapse navbar-collapse"
-        :class="{ show: showMobileNavbar }"
+        :class="{ show: showMobileNav }"
         id="navbarSupportedContent"
       >
         <ul class="navbar-nav me-auto mb-2 mb-lg-0">
@@ -42,7 +42,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
           <li class="nav-item">
             <router-link
               class="nav-link"
-              :to="{ path: `/s/profile/${$root.memberId}` }"
+              :to="{ path: `/s/profile/${currentUserId}` }"
               active-class="active"
               >Mein Profil</router-link
             >
@@ -86,21 +86,29 @@ SPDX-License-Identifier: AGPL-3.0-or-later
 
 <script>
 
-import RequestMixin from "@/mixins/request.mixin"
+import { mapState } from 'vuex'
+
+import RequestMixin from '@/mixins/request.mixin'
 
 export default {
-  name: "Navbar",
+  name: 'Navbar',
   mixins: [RequestMixin],
   data() {
     return {
-      showMobileNavbar: false,
-      searchText: ''
+      searchText: '',
+      showMobileNav: false
     }
   },
+  computed: {
+    ...mapState(['currentUserId'])
+  },
   methods: {
+    toggleMobileNav() {
+      this.showMobileNav = !this.showMobileNav
+    },
     logout() {
-      localStorage.clear();
-      this.$router.push({ path: "/" });
+      this.$store.dispatch('clear')
+      this.$router.push({ path: '/' });
     },
     searchRedirect() {
       this.$router.push({ path: `/s/search?text`, query: { query: this.searchText } } );
diff --git a/src/main.js b/src/main.js
index ddfcee9..9cf7246 100644
--- a/src/main.js
+++ b/src/main.js
@@ -5,12 +5,14 @@
 import { createApp } from 'vue/dist/vue.esm-bundler'
 import App from './App.vue'
 import router from './router'
+import store from '@/store'
 
 import './assets/global.scss'
 
 const app = createApp(App)
 
 app.use(router)
+app.use(store)
 
 app.config.globalProperties.apiUrl = window.ki.apiUrl
 
diff --git a/src/mixins/request.mixin.js b/src/mixins/request.mixin.js
index 06c33b0..ea042c3 100644
--- a/src/mixins/request.mixin.js
+++ b/src/mixins/request.mixin.js
@@ -2,6 +2,8 @@
 //
 // SPDX-License-Identifier: AGPL-3.0-or-later
 
+import store from '@/store'
+
 export default {
   methods: {
     async submitLogin() {
@@ -26,8 +28,8 @@ export default {
         }
 
         const responseData = await response.json()
-        localStorage.setItem('token', responseData.token);
-        localStorage.setItem('user_id', responseData.user_id);
+        store.commit('setCurrentUserId', parseInt(responseData.user_id, 10))
+        store.commit('setToken', responseData.token)
         this.$router.push({ path: '/s/search' });
       } catch (error) {
         console.error(error);
@@ -38,7 +40,7 @@ export default {
       try {
         const response = await fetch(`${this.apiUrl}/${this.type}s?search=${this.searchText}`, {
             headers: {
-              Authorization: `Bearer ${localStorage.getItem("token")}`,
+              Authorization: `Bearer ${store.state.token}`,
             },
           }
         );
@@ -65,13 +67,13 @@ export default {
       }
     },
     async initEditPage() {
-      const userId = localStorage.getItem('user_id')
+      const userId = store.state.currentUserId
       const url = `${this.apiUrl}/users/${userId}/profile`
 
       try {
         const response = await fetch(url, {
             headers: { 
-              Authorization: `Bearer ${localStorage.getItem("token")}` 
+              Authorization: `Bearer ${store.state.token}` 
             },
           }
         );
@@ -94,11 +96,11 @@ export default {
       try {
         const body = JSON.stringify(this.profile)
         const response = await fetch(
-          `${this.apiUrl}/users/${localStorage.getItem("user_id")}/profile`,
+          `${this.apiUrl}/users/${store.currentUserId}/profile`,
           {
             method: 'POST',
             headers: {
-              Authorization: `Bearer ${localStorage.getItem("token")}`,
+              Authorization: `Bearer ${store.state.token}`,
               'Content-Type': 'application/json',
             },
             body
@@ -119,7 +121,7 @@ export default {
     async initViewPage() {
       try {
         const response = await fetch(`${this.apiUrl}/users/${this.$route.params.memberId}/profile`, {
-            headers: { Authorization: `Bearer ${localStorage.getItem("token")}` },
+            headers: { Authorization: `Bearer ${store.state.token}` },
           }
         );
 
@@ -128,7 +130,7 @@ export default {
         }
 
         const responseData = await response.json()
-        this.profile = responseData.profile;
+        store.commit('setCurrentProfile', responseData.profile)
       } catch (error) {
         console.error(error);
       }
@@ -145,7 +147,7 @@ export default {
 
         const response = await fetch(url, {
           headers: {
-            Authorization: `Bearer ${localStorage.getItem("token")}`,
+            Authorization: `Bearer ${store.state.token}`,
           },
         });
 
diff --git a/src/router/index.js b/src/router/index.js
index ac49c07..4688ce1 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -3,6 +3,9 @@
 // SPDX-License-Identifier: AGPL-3.0-or-later
 
 import { createRouter, createWebHistory } from 'vue-router'
+
+import store from '@/store'
+
 import Index from '@/views/Index.vue'
 import Search from '@/views/Search.vue'
 import Edit from '@/views/profile/Edit.vue'
@@ -16,9 +19,9 @@ const routes = [
       template: "<router-view/>",
     },
     beforeEnter: (to, from, next) => {
-      if(localStorage.getItem('token') !== null){
+      if (store.state.token){
         next()
-      }else{
+      } else {
         next({path: '/', query: {url: to.fullPath, access: false}})
       }
     },
@@ -52,4 +55,4 @@ const router = createRouter({
   routes
 })
 
-export default router
\ No newline at end of file
+export default router
diff --git a/src/store.js b/src/store.js
new file mode 100644
index 0000000..c6eaf60
--- /dev/null
+++ b/src/store.js
@@ -0,0 +1,50 @@
+// SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
+//
+// SPDX-License-Identifier: AGPL-3.0-or-later
+
+import { createStore } from 'vuex'
+
+const localStorageKeys = {
+  currentUserId: 'ki_current_user_id',
+  token: 'ki_token',
+}
+
+export default createStore({
+  state() {
+    return {
+      currentUserId: JSON.parse(localStorage.getItem(localStorageKeys.currentUserId)),
+      token: JSON.parse(localStorage.getItem(localStorageKeys.token)),
+      currentProfile: null
+    }
+  },
+  mutations: {
+    clearCurrentUserId(state) {
+      state.currentUserId = null
+      localStorage.removeItem(localStorageKeys.currentUserId)
+    },
+    setCurrentUserId(state, currentUserId) {
+      state.currentUserId = currentUserId
+      localStorage.setItem(
+        localStorageKeys.currentUserId, 
+        JSON.stringify(currentUserId)
+      )
+    },
+    clearToken(state) {
+      state.token = null
+      localStorage.removeItem(localStorageKeys.token)
+    },
+    setToken(state, token) {
+      state.token = token
+      localStorage.setItem(localStorageKeys.token, JSON.stringify(token))
+    },
+    setCurrentProfile(state, profile) {
+      state.currentProfile = profile
+    }
+  },
+  actions: {
+    clear(context) {
+      context.commit('clearCurrentUserId')
+      context.commit('clearToken')
+    }
+  }
+})
diff --git a/src/views/profile/View.vue b/src/views/profile/View.vue
index 3ec8be4..bce1417 100644
--- a/src/views/profile/View.vue
+++ b/src/views/profile/View.vue
@@ -40,9 +40,11 @@ SPDX-License-Identifier: AGPL-3.0-or-later
   </div>
 </template>
 <script>
-import RequestMixin from "@/mixins/request.mixin"
+import { mapState } from 'vuex'
 
-import ProfileList from "@/components/ProfileList";
+import RequestMixin from '@/mixins/request.mixin'
+
+import ProfileList from '@/components/ProfileList';
 
 export default {
   name: "profileView",
@@ -50,10 +52,10 @@ export default {
   components: {
     ProfileList,
   },
-  data() {
-    return {
-        profile: null
-    };
+  computed: {
+    ...mapState({
+      profile: 'currentProfile'
+    })
   },
   async created() {
     await this.initViewPage();