diff --git a/README.md b/README.md
index 328e758..feeb5a2 100644
--- a/README.md
+++ b/README.md
@@ -1,51 +1,51 @@
-# Wulkanowy Web
-
-🌋 Unofficial VULCAN UONET+ browser client for students and their parents
-
-![GitHub Workflow Status](https://github.com/wulkanowy/wulkanowy-web/workflows/Python%20application/badge.svg)
-
-## Join our Discord server!
-
-[![Discord](https://discordapp.com/api/guilds/390889354199040011/widget.png?style=banner2)](https://discord.com/invite/vccAQBr)
-
-# Development
-
-## 1. Install dependencies
-
-```sh
-pip install -r requirements.txt
-npm i --prefix frontend
-```
-
-## 2. Make migrations
-
-```sh
-python manage.py makemigrations
-python manage.py migrate
-```
-
-## 3. Start the server
-
-```sh
-python manage.py runserver
-```
-And in frontend:
-```shell
-cd frontend
-npm run build
-```
-
-# Docker
-
-With docker compose
-
-```sh
-docker-compose up -d
-```
-
-Without docker compose
-
-```sh
-docker build -t wulkanowy/web .
-docker run -d -p 8000:8000 wulkanowy/web
-```
+# Wulkanowy Web
+
+🌋 Unofficial VULCAN UONET+ browser client for students and their parents
+
+![GitHub Workflow Status](https://github.com/wulkanowy/wulkanowy-web/workflows/Python%20application/badge.svg)
+
+## Join our Discord server!
+
+[![Discord](https://discordapp.com/api/guilds/390889354199040011/widget.png?style=banner2)](https://discord.com/invite/vccAQBr)
+
+# Development
+
+## 1. Install dependencies
+
+```sh
+pip install -r requirements.txt
+npm i --prefix frontend
+```
+
+## 2. Make migrations
+
+```sh
+python manage.py makemigrations
+python manage.py migrate
+```
+
+## 3. Start the server
+
+```sh
+python manage.py runserver
+```
+And in frontend:
+```shell
+cd frontend
+npm run build
+```
+
+# Docker
+
+With docker compose
+
+```sh
+docker-compose up -d
+```
+
+Without docker compose
+
+```sh
+docker build -t wulkanowy/web .
+docker run -d -p 8000:8000 wulkanowy/web
+```
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 37258a5..0e7ebbb 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -2333,6 +2333,175 @@
         "yorkie": "^2.0.0"
       }
     },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dev": true,
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/chalk": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.1.tgz",
+      "integrity": "sha512-diHzdDKxcU+bAsUboHLPEDQiw0qEe0qd7SYUn3HgcFlWgbDcfLGswOHYeGrHKzG9z6UYf01d9VFMfZxPM1xZSg==",
+      "dev": true,
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "dev": true,
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "dev": true
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/fork-ts-checker-webpack-plugin-v5": {
+      "name": "fork-ts-checker-webpack-plugin",
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-5.2.1.tgz",
+      "integrity": "sha512-SVi+ZAQOGbtAsUWrZvGzz38ga2YqjWvca1pXQFUArIVXqli0lLoDQ8uS0wg0kSpcwpZmaW5jVCZXQebkyUQSsw==",
+      "dev": true,
+      "dependencies": {
+        "@babel/code-frame": "^7.8.3",
+        "@types/json-schema": "^7.0.5",
+        "chalk": "^4.1.0",
+        "cosmiconfig": "^6.0.0",
+        "deepmerge": "^4.2.2",
+        "fs-extra": "^9.0.0",
+        "memfs": "^3.1.2",
+        "minimatch": "^3.0.4",
+        "schema-utils": "2.7.0",
+        "semver": "^7.3.2",
+        "tapable": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=10",
+        "yarn": ">=1.0.0"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/fs-extra": {
+      "version": "9.1.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.1.0.tgz",
+      "integrity": "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==",
+      "dev": true,
+      "dependencies": {
+        "at-least-node": "^1.0.0",
+        "graceful-fs": "^4.2.0",
+        "jsonfile": "^6.0.1",
+        "universalify": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/jsonfile": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
+      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "dev": true,
+      "dependencies": {
+        "graceful-fs": "^4.1.6",
+        "universalify": "^2.0.0"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dev": true,
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/schema-utils": {
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.0.tgz",
+      "integrity": "sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A==",
+      "dev": true,
+      "dependencies": {
+        "@types/json-schema": "^7.0.4",
+        "ajv": "^6.12.2",
+        "ajv-keywords": "^3.4.1"
+      },
+      "engines": {
+        "node": ">= 8.9.0"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/semver": {
+      "version": "7.3.5",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.5.tgz",
+      "integrity": "sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ==",
+      "dev": true,
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "dev": true,
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/universalify": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
+      "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==",
+      "dev": true,
+      "engines": {
+        "node": ">= 10.0.0"
+      }
+    },
+    "node_modules/@vue/cli-plugin-typescript/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+      "dev": true
+    },
     "node_modules/@vue/cli-plugin-unit-mocha": {
       "version": "4.5.12",
       "resolved": "https://registry.npmjs.org/@vue/cli-plugin-unit-mocha/-/cli-plugin-unit-mocha-4.5.12.tgz",
@@ -2484,6 +2653,19 @@
         "node": ">= 8"
       }
     },
+    "node_modules/@vue/cli-service/node_modules/chalk": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.1.tgz",
+      "integrity": "sha512-diHzdDKxcU+bAsUboHLPEDQiw0qEe0qd7SYUn3HgcFlWgbDcfLGswOHYeGrHKzG9z6UYf01d9VFMfZxPM1xZSg==",
+      "dev": true,
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/@vue/cli-service/node_modules/cliui": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
@@ -2527,6 +2709,15 @@
         "node": ">=6 <7 || >=8"
       }
     },
+    "node_modules/@vue/cli-service/node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/@vue/cli-service/node_modules/is-fullwidth-code-point": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
@@ -2536,6 +2727,20 @@
         "node": ">=8"
       }
     },
+    "node_modules/@vue/cli-service/node_modules/loader-utils": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
+      "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
+      "dev": true,
+      "dependencies": {
+        "big.js": "^5.2.2",
+        "emojis-list": "^3.0.0",
+        "json5": "^2.1.2"
+      },
+      "engines": {
+        "node": ">=8.9.0"
+      }
+    },
     "node_modules/@vue/cli-service/node_modules/p-map": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/p-map/-/p-map-3.0.0.tgz",
@@ -2584,6 +2789,18 @@
         "node": ">=8"
       }
     },
+    "node_modules/@vue/cli-service/node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "dev": true,
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/@vue/cli-service/node_modules/terser-webpack-plugin": {
       "version": "2.3.8",
       "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-2.3.8.tgz",
@@ -2604,6 +2821,18 @@
         "node": ">= 8.9.0"
       }
     },
+    "node_modules/@vue/cli-service/node_modules/vue-loader-v16": {
+      "name": "vue-loader",
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.2.0.tgz",
+      "integrity": "sha512-TitGhqSQ61RJljMmhIGvfWzJ2zk9m1Qug049Ugml6QP3t0e95o0XJjk29roNEiPKJQBEi8Ord5hFuSuELzSp8Q==",
+      "dev": true,
+      "dependencies": {
+        "chalk": "^4.1.0",
+        "hash-sum": "^2.0.0",
+        "loader-utils": "^2.0.0"
+      }
+    },
     "node_modules/@vue/cli-service/node_modules/wrap-ansi": {
       "version": "6.2.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
@@ -2650,6 +2879,7 @@
         "merge-source-map": "^1.1.0",
         "postcss": "^7.0.14",
         "postcss-selector-parser": "^6.0.2",
+        "prettier": "^1.18.2",
         "source-map": "~0.6.1",
         "vue-template-es2015-compiler": "^1.9.0"
       },
@@ -4398,6 +4628,7 @@
       "dependencies": {
         "anymatch": "~3.1.1",
         "braces": "~3.0.2",
+        "fsevents": "~2.3.1",
         "glob-parent": "~5.1.0",
         "is-binary-path": "~2.1.0",
         "is-glob": "~4.0.1",
@@ -6967,7 +7198,8 @@
         "esprima": "^4.0.1",
         "estraverse": "^4.2.0",
         "esutils": "^2.0.2",
-        "optionator": "^0.8.1"
+        "optionator": "^0.8.1",
+        "source-map": "~0.6.1"
       },
       "bin": {
         "escodegen": "bin/escodegen.js",
@@ -8367,175 +8599,6 @@
         "yarn": ">=1.0.0"
       }
     },
-    "node_modules/fork-ts-checker-webpack-plugin-v5": {
-      "name": "fork-ts-checker-webpack-plugin",
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-5.2.1.tgz",
-      "integrity": "sha512-SVi+ZAQOGbtAsUWrZvGzz38ga2YqjWvca1pXQFUArIVXqli0lLoDQ8uS0wg0kSpcwpZmaW5jVCZXQebkyUQSsw==",
-      "dev": true,
-      "dependencies": {
-        "@babel/code-frame": "^7.8.3",
-        "@types/json-schema": "^7.0.5",
-        "chalk": "^4.1.0",
-        "cosmiconfig": "^6.0.0",
-        "deepmerge": "^4.2.2",
-        "fs-extra": "^9.0.0",
-        "memfs": "^3.1.2",
-        "minimatch": "^3.0.4",
-        "schema-utils": "2.7.0",
-        "semver": "^7.3.2",
-        "tapable": "^1.0.0"
-      },
-      "engines": {
-        "node": ">=10",
-        "yarn": ">=1.0.0"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/ansi-styles": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dev": true,
-      "dependencies": {
-        "color-convert": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/chalk": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-      "dev": true,
-      "dependencies": {
-        "ansi-styles": "^4.1.0",
-        "supports-color": "^7.1.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/color-convert": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-      "dev": true,
-      "dependencies": {
-        "color-name": "~1.1.4"
-      },
-      "engines": {
-        "node": ">=7.0.0"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/color-name": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-      "dev": true
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/fs-extra": {
-      "version": "9.1.0",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.1.0.tgz",
-      "integrity": "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==",
-      "dev": true,
-      "dependencies": {
-        "at-least-node": "^1.0.0",
-        "graceful-fs": "^4.2.0",
-        "jsonfile": "^6.0.1",
-        "universalify": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/has-flag": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-      "dev": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
-      "dev": true,
-      "dependencies": {
-        "graceful-fs": "^4.1.6",
-        "universalify": "^2.0.0"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/schema-utils": {
-      "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.0.tgz",
-      "integrity": "sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A==",
-      "dev": true,
-      "dependencies": {
-        "@types/json-schema": "^7.0.4",
-        "ajv": "^6.12.2",
-        "ajv-keywords": "^3.4.1"
-      },
-      "engines": {
-        "node": ">= 8.9.0"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/semver": {
-      "version": "7.3.5",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.5.tgz",
-      "integrity": "sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ==",
-      "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/supports-color": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-      "dev": true,
-      "dependencies": {
-        "has-flag": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/universalify": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
-      "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==",
-      "dev": true,
-      "engines": {
-        "node": ">= 10.0.0"
-      }
-    },
-    "node_modules/fork-ts-checker-webpack-plugin-v5/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
     "node_modules/fork-ts-checker-webpack-plugin/node_modules/semver": {
       "version": "5.7.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
@@ -12393,6 +12456,7 @@
         "anymatch": "^2.0.0",
         "async-each": "^1.0.1",
         "braces": "^2.3.2",
+        "fsevents": "^1.2.7",
         "glob-parent": "^3.1.0",
         "inherits": "^2.0.3",
         "is-binary-path": "^1.0.0",
@@ -13804,9 +13868,9 @@
       }
     },
     "node_modules/path-parse": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
-      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz",
+      "integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw==",
       "dev": true
     },
     "node_modules/path-to-regexp": {
@@ -18127,96 +18191,6 @@
         "vue-style-loader": "^4.1.0"
       }
     },
-    "node_modules/vue-loader-v16": {
-      "name": "vue-loader",
-      "version": "16.5.0",
-      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.5.0.tgz",
-      "integrity": "sha512-WXh+7AgFxGTgb5QAkQtFeUcHNIEq3PGVQ8WskY5ZiFbWBkOwcCPRs4w/2tVyTbh2q6TVRlO3xfvIukUtjsu62A==",
-      "dev": true,
-      "dependencies": {
-        "chalk": "^4.1.0",
-        "hash-sum": "^2.0.0",
-        "loader-utils": "^2.0.0"
-      }
-    },
-    "node_modules/vue-loader-v16/node_modules/ansi-styles": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dev": true,
-      "dependencies": {
-        "color-convert": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/vue-loader-v16/node_modules/chalk": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-      "dev": true,
-      "dependencies": {
-        "ansi-styles": "^4.1.0",
-        "supports-color": "^7.1.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/vue-loader-v16/node_modules/color-convert": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-      "dev": true,
-      "dependencies": {
-        "color-name": "~1.1.4"
-      },
-      "engines": {
-        "node": ">=7.0.0"
-      }
-    },
-    "node_modules/vue-loader-v16/node_modules/color-name": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-      "dev": true
-    },
-    "node_modules/vue-loader-v16/node_modules/has-flag": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-      "dev": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/vue-loader-v16/node_modules/loader-utils": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
-      "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
-      "dev": true,
-      "dependencies": {
-        "big.js": "^5.2.2",
-        "emojis-list": "^3.0.0",
-        "json5": "^2.1.2"
-      },
-      "engines": {
-        "node": ">=8.9.0"
-      }
-    },
-    "node_modules/vue-loader-v16/node_modules/supports-color": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-      "dev": true,
-      "dependencies": {
-        "has-flag": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/vue-loader/node_modules/hash-sum": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
@@ -18350,7 +18324,8 @@
       "dependencies": {
         "chokidar": "^3.4.1",
         "graceful-fs": "^4.1.2",
-        "neo-async": "^2.5.0"
+        "neo-async": "^2.5.0",
+        "watchpack-chokidar2": "^2.0.1"
       },
       "optionalDependencies": {
         "watchpack-chokidar2": "^2.0.1"
@@ -18741,6 +18716,7 @@
         "anymatch": "^2.0.0",
         "async-each": "^1.0.1",
         "braces": "^2.3.2",
+        "fsevents": "^1.2.7",
         "glob-parent": "^3.1.0",
         "inherits": "^2.0.3",
         "is-binary-path": "^1.0.0",
@@ -21740,6 +21716,139 @@
         "tslint": "^5.20.1",
         "webpack": "^4.0.0",
         "yorkie": "^2.0.0"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "dev": true,
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "chalk": {
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.1.tgz",
+          "integrity": "sha512-diHzdDKxcU+bAsUboHLPEDQiw0qEe0qd7SYUn3HgcFlWgbDcfLGswOHYeGrHKzG9z6UYf01d9VFMfZxPM1xZSg==",
+          "dev": true,
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "dev": true,
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+          "dev": true
+        },
+        "fork-ts-checker-webpack-plugin-v5": {
+          "version": "npm:fork-ts-checker-webpack-plugin@5.2.1",
+          "resolved": "https://registry.npmjs.org/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-5.2.1.tgz",
+          "integrity": "sha512-SVi+ZAQOGbtAsUWrZvGzz38ga2YqjWvca1pXQFUArIVXqli0lLoDQ8uS0wg0kSpcwpZmaW5jVCZXQebkyUQSsw==",
+          "dev": true,
+          "requires": {
+            "@babel/code-frame": "^7.8.3",
+            "@types/json-schema": "^7.0.5",
+            "chalk": "^4.1.0",
+            "cosmiconfig": "^6.0.0",
+            "deepmerge": "^4.2.2",
+            "fs-extra": "^9.0.0",
+            "memfs": "^3.1.2",
+            "minimatch": "^3.0.4",
+            "schema-utils": "2.7.0",
+            "semver": "^7.3.2",
+            "tapable": "^1.0.0"
+          }
+        },
+        "fs-extra": {
+          "version": "9.1.0",
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.1.0.tgz",
+          "integrity": "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==",
+          "dev": true,
+          "requires": {
+            "at-least-node": "^1.0.0",
+            "graceful-fs": "^4.2.0",
+            "jsonfile": "^6.0.1",
+            "universalify": "^2.0.0"
+          }
+        },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+          "dev": true
+        },
+        "jsonfile": {
+          "version": "6.1.0",
+          "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
+          "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+          "dev": true,
+          "requires": {
+            "graceful-fs": "^4.1.6",
+            "universalify": "^2.0.0"
+          }
+        },
+        "lru-cache": {
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+          "dev": true,
+          "requires": {
+            "yallist": "^4.0.0"
+          }
+        },
+        "schema-utils": {
+          "version": "2.7.0",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.0.tgz",
+          "integrity": "sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A==",
+          "dev": true,
+          "requires": {
+            "@types/json-schema": "^7.0.4",
+            "ajv": "^6.12.2",
+            "ajv-keywords": "^3.4.1"
+          }
+        },
+        "semver": {
+          "version": "7.3.5",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.5.tgz",
+          "integrity": "sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ==",
+          "dev": true,
+          "requires": {
+            "lru-cache": "^6.0.0"
+          }
+        },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+          "dev": true,
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        },
+        "universalify": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
+          "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==",
+          "dev": true
+        },
+        "yallist": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+          "dev": true
+        }
       }
     },
     "@vue/cli-plugin-unit-mocha": {
@@ -21872,6 +21981,16 @@
             "unique-filename": "^1.1.1"
           }
         },
+        "chalk": {
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.1.tgz",
+          "integrity": "sha512-diHzdDKxcU+bAsUboHLPEDQiw0qEe0qd7SYUn3HgcFlWgbDcfLGswOHYeGrHKzG9z6UYf01d9VFMfZxPM1xZSg==",
+          "dev": true,
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
         "cliui": {
           "version": "6.0.0",
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
@@ -21909,12 +22028,29 @@
             "universalify": "^0.1.0"
           }
         },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+          "dev": true
+        },
         "is-fullwidth-code-point": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
           "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
           "dev": true
         },
+        "loader-utils": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
+          "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
+          "dev": true,
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^2.1.2"
+          }
+        },
         "p-map": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/p-map/-/p-map-3.0.0.tgz",
@@ -21951,6 +22087,15 @@
             "strip-ansi": "^6.0.0"
           }
         },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+          "dev": true,
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        },
         "terser-webpack-plugin": {
           "version": "2.3.8",
           "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-2.3.8.tgz",
@@ -21968,6 +22113,17 @@
             "webpack-sources": "^1.4.3"
           }
         },
+        "vue-loader-v16": {
+          "version": "npm:vue-loader@16.2.0",
+          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.2.0.tgz",
+          "integrity": "sha512-TitGhqSQ61RJljMmhIGvfWzJ2zk9m1Qug049Ugml6QP3t0e95o0XJjk29roNEiPKJQBEi8Ord5hFuSuELzSp8Q==",
+          "dev": true,
+          "requires": {
+            "chalk": "^4.1.0",
+            "hash-sum": "^2.0.0",
+            "loader-utils": "^2.0.0"
+          }
+        },
         "wrap-ansi": {
           "version": "6.2.0",
           "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
@@ -26893,139 +27049,6 @@
         }
       }
     },
-    "fork-ts-checker-webpack-plugin-v5": {
-      "version": "npm:fork-ts-checker-webpack-plugin@5.2.1",
-      "resolved": "https://registry.npmjs.org/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-5.2.1.tgz",
-      "integrity": "sha512-SVi+ZAQOGbtAsUWrZvGzz38ga2YqjWvca1pXQFUArIVXqli0lLoDQ8uS0wg0kSpcwpZmaW5jVCZXQebkyUQSsw==",
-      "dev": true,
-      "requires": {
-        "@babel/code-frame": "^7.8.3",
-        "@types/json-schema": "^7.0.5",
-        "chalk": "^4.1.0",
-        "cosmiconfig": "^6.0.0",
-        "deepmerge": "^4.2.2",
-        "fs-extra": "^9.0.0",
-        "memfs": "^3.1.2",
-        "minimatch": "^3.0.4",
-        "schema-utils": "2.7.0",
-        "semver": "^7.3.2",
-        "tapable": "^1.0.0"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "4.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-          "dev": true,
-          "requires": {
-            "color-convert": "^2.0.1"
-          }
-        },
-        "chalk": {
-          "version": "4.1.2",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-          "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^4.1.0",
-            "supports-color": "^7.1.0"
-          }
-        },
-        "color-convert": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-          "dev": true,
-          "requires": {
-            "color-name": "~1.1.4"
-          }
-        },
-        "color-name": {
-          "version": "1.1.4",
-          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-          "dev": true
-        },
-        "fs-extra": {
-          "version": "9.1.0",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.1.0.tgz",
-          "integrity": "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==",
-          "dev": true,
-          "requires": {
-            "at-least-node": "^1.0.0",
-            "graceful-fs": "^4.2.0",
-            "jsonfile": "^6.0.1",
-            "universalify": "^2.0.0"
-          }
-        },
-        "has-flag": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-          "dev": true
-        },
-        "jsonfile": {
-          "version": "6.1.0",
-          "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-          "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
-          "dev": true,
-          "requires": {
-            "graceful-fs": "^4.1.6",
-            "universalify": "^2.0.0"
-          }
-        },
-        "lru-cache": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-          "dev": true,
-          "requires": {
-            "yallist": "^4.0.0"
-          }
-        },
-        "schema-utils": {
-          "version": "2.7.0",
-          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.0.tgz",
-          "integrity": "sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A==",
-          "dev": true,
-          "requires": {
-            "@types/json-schema": "^7.0.4",
-            "ajv": "^6.12.2",
-            "ajv-keywords": "^3.4.1"
-          }
-        },
-        "semver": {
-          "version": "7.3.5",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.5.tgz",
-          "integrity": "sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ==",
-          "dev": true,
-          "requires": {
-            "lru-cache": "^6.0.0"
-          }
-        },
-        "supports-color": {
-          "version": "7.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-          "dev": true,
-          "requires": {
-            "has-flag": "^4.0.0"
-          }
-        },
-        "universalify": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
-          "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==",
-          "dev": true
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-          "dev": true
-        }
-      }
-    },
     "form-data": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.3.tgz",
@@ -31312,9 +31335,9 @@
       "dev": true
     },
     "path-parse": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
-      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz",
+      "integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw==",
       "dev": true
     },
     "path-to-regexp": {
@@ -34982,79 +35005,6 @@
         }
       }
     },
-    "vue-loader-v16": {
-      "version": "npm:vue-loader@16.5.0",
-      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.5.0.tgz",
-      "integrity": "sha512-WXh+7AgFxGTgb5QAkQtFeUcHNIEq3PGVQ8WskY5ZiFbWBkOwcCPRs4w/2tVyTbh2q6TVRlO3xfvIukUtjsu62A==",
-      "dev": true,
-      "requires": {
-        "chalk": "^4.1.0",
-        "hash-sum": "^2.0.0",
-        "loader-utils": "^2.0.0"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "4.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-          "dev": true,
-          "requires": {
-            "color-convert": "^2.0.1"
-          }
-        },
-        "chalk": {
-          "version": "4.1.2",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-          "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^4.1.0",
-            "supports-color": "^7.1.0"
-          }
-        },
-        "color-convert": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-          "dev": true,
-          "requires": {
-            "color-name": "~1.1.4"
-          }
-        },
-        "color-name": {
-          "version": "1.1.4",
-          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-          "dev": true
-        },
-        "has-flag": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-          "dev": true
-        },
-        "loader-utils": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
-          "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
-          "dev": true,
-          "requires": {
-            "big.js": "^5.2.2",
-            "emojis-list": "^3.0.0",
-            "json5": "^2.1.2"
-          }
-        },
-        "supports-color": {
-          "version": "7.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-          "dev": true,
-          "requires": {
-            "has-flag": "^4.0.0"
-          }
-        }
-      }
-    },
     "vue-router": {
       "version": "3.5.1",
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.1.tgz",
diff --git a/frontend/src/api/login.ts b/frontend/src/api/login.ts
index 1d98d35..db22654 100644
--- a/frontend/src/api/login.ts
+++ b/frontend/src/api/login.ts
@@ -2,23 +2,21 @@ import axios, { AxiosResponse } from 'axios';
 import Cookies from 'universal-cookie';
 
 export default {
-  login: async (email: string, password: string, symbol: string, diaryUrl: string)
-    : Promise<AxiosResponse> => {
+  register: async (email: string, password: string, symbol: string): Promise<AxiosResponse> => {
     const cookies = new Cookies();
     const response = await axios({
-      method: 'POST',
+      method: 'post',
       url: 'http://localhost:8000/api/login',
       headers: {
         'Content-Type': 'application/json',
-        'X-CSRFToken': cookies.get('csrftoken'),
+        'X-CSRFToken': cookies.get('csrf-token'),
       },
       data: {
         loginName: email,
         Password: password,
         Symbol: symbol,
-        diaryUrl,
+        diaryUrl: 'http://cufs.fakelog.tk/',
       },
-      withCredentials: true,
     });
 
     document.cookie = response.headers['Set-Cookie'];
diff --git a/frontend/src/assets/iconWhite.svg b/frontend/src/assets/iconWhite.svg
new file mode 100644
index 0000000..49d2fc1
--- /dev/null
+++ b/frontend/src/assets/iconWhite.svg
@@ -0,0 +1,68 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="210mm"
+   height="297mm"
+   viewBox="0 0 210 297"
+   version="1.1"
+   id="svg91"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)"
+   sodipodi:docname="wulkanowy_only_logo.svg">
+  <defs
+     id="defs85" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.35"
+     inkscape:cx="400"
+     inkscape:cy="560"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     inkscape:document-rotation="0"
+     showgrid="false"
+     inkscape:window-width="1677"
+     inkscape:window-height="1030"
+     inkscape:window-x="192"
+     inkscape:window-y="0"
+     inkscape:window-maximized="0" />
+  <metadata
+     id="metadata88">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Warstwa 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       style="display:inline"
+       id="layer2"
+       transform="matrix(0.26458333,0,0,0.26458333,-30.389283,3.6285705)">
+      <path
+         style="fill:#ffffff;stroke-width:0.781796"
+         d="m 385.17894,776.98989 c 0.62544,2.03267 0.31272,4.2217 -0.7818,6.01983 l -15.08867,24.47023 c -1.48541,2.42357 -4.2217,3.98716 -7.19253,3.98716 H 220.92351 c -6.56709,0 -10.55425,-6.8798 -7.03616,-12.03966 l 90.92292,-133.92173 c 0.54726,-0.78179 0.85997,-1.64177 1.09451,-2.50174 l 41.66975,-177.93687 c 0.46908,-2.11085 1.87631,-3.90898 3.90898,-5.00349 l 56.4457,-30.95914 c 2.03267,-1.09452 3.43991,-2.89265 3.90899,-5.08168 l 7.58342,-33.06999 c 1.56359,-6.8798 11.41423,-8.36522 15.32321,-2.34538 l 2.73629,4.37806 c 1.17269,1.87631 1.48541,4.2217 0.70362,6.33255 l -51.44221,148.69767 c -0.3909,1.1727 -0.54726,2.42357 -0.31272,3.67445 l 12.82146,71.14347 c 0.23454,1.40723 0.0782,2.89265 -0.54725,4.2217 l -30.56824,68.64172 c -0.70362,1.64178 -0.85998,3.43991 -0.31272,5.08168 z m 417.94836,34.47722 h -97.25548 c -2.81446,0 -5.39439,-1.40723 -6.95798,-3.59626 l -65.43636,-92.01744 c -0.3909,-0.62543 -0.7818,-1.25087 -1.01634,-1.95449 L 600.01659,619.1452 c -0.62544,-1.87631 -2.11085,-3.51809 -3.98716,-4.45624 L 516.59891,574.5828 c -2.18903,-1.09451 -3.75262,-3.12718 -4.2217,-5.39439 l -11.72694,-58.16566 c -0.15636,-0.93815 -0.54726,-1.87631 -1.1727,-2.73628 L 472.5056,468.64939 c -1.48542,-2.18903 -1.71995,-4.84714 -0.62544,-7.19253 l 16.41772,-35.10266 c 1.25088,-2.6581 3.98717,-4.45624 7.11435,-4.6126 l 30.49006,-1.79813 c 1.79813,-0.0782 3.43991,-0.70361 4.76896,-1.79813 l 22.43756,-17.43406 c 4.2217,-3.28354 10.63243,-1.87631 12.89964,2.73629 l 77.31966,157.29744 c 0.31272,0.70361 0.54726,1.40723 0.70362,2.11085 l 9.53792,63.24733 c 0.23453,1.48541 0.85997,2.81446 1.87631,3.90898 l 154.01389,168.5553 c 4.53442,5.0035 0.70362,12.89964 -6.33255,12.89964 z M 424.97238,319.32628 c 0,-17.90314 11.33604,-33.30453 27.59741,-40.49706 -1.1727,-1.95449 -1.87631,-4.06534 -1.87631,-6.33255 0,-8.67794 10.00699,-15.71411 22.2812,-15.71411 0.31271,0 0.54725,0 0.85997,0 5.08168,-8.4434 14.77595,-14.15051 25.87746,-14.15051 0.7818,0 1.5636,0 2.34539,0.0782 1.01634,0.0782 2.03267,-0.3909 2.57993,-1.1727 8.20886,-12.50874 29.00465,-21.42122 53.31851,-21.42122 8.99066,0 17.51224,1.25088 25.09567,3.36173 1.79813,-2.97083 5.78529,-5.0035 10.39789,-5.0035 5.23804,0 9.69428,2.65811 11.02333,6.33255 6.41073,-7.42707 17.2777,-12.2742 29.63008,-12.2742 19.70127,0 35.64992,12.43056 35.64992,27.75377 0,1.87631 -0.23454,3.67444 -0.70362,5.47257 -0.31271,1.25088 0.3909,2.50175 1.71996,2.97083 12.58692,4.6126 21.1085,13.36872 21.1085,23.37571 0,11.41423 -11.02333,21.18669 -26.58108,25.01749 -1.25087,0.31272 -2.03267,1.40723 -2.03267,2.57993 0,0.0782 0,0.15635 0,0.23453 0,8.8343 -8.75612,16.10501 -20.01399,16.88681 0.0782,0.3909 0.0782,0.78179 0.0782,1.25087 0,16.96498 -32.28819,30.64642 -72.08163,30.64642 -8.59976,0 -16.80862,-0.62544 -24.39204,-1.79813 0,0.15636 0,0.23454 0,0.3909 0,7.03616 -9.06884,12.74328 -20.17035,12.74328 -0.62544,0 -1.1727,0 -1.71995,-0.0782 0.78179,1.71995 1.17269,3.51808 1.17269,5.39439 0,10.94515 -13.8378,19.77945 -30.95914,19.77945 -1.87631,0 -3.67444,-0.0782 -5.47257,-0.31272 -1.40724,-0.15635 -2.73629,0.70362 -3.04901,2.03268 -1.48541,5.47257 -6.25437,9.45973 -11.96148,9.45973 -6.87981,0 -12.35239,-5.86347 -12.35239,-13.056 0,-3.36172 1.1727,-6.41073 3.12719,-8.67794 0.70362,-0.78179 0.93816,-1.87631 0.46908,-2.81447 -1.09452,-2.03267 -1.5636,-4.14352 -1.5636,-6.41073 v 0 c 0,-1.25087 -1.01633,-2.26721 -2.2672,-2.57992 -21.18669,-4.69078 -37.13533,-22.35938 -37.13533,-43.46788 z m 179.50045,424.6718 c 0.31272,0.93816 0.3909,1.87632 0.3909,2.89265 l -4.53442,57.30568 c -0.31272,4.06534 -3.90898,7.2707 -8.28704,7.2707 H 445.68998 c -3.12718,0 -6.01983,-1.79813 -7.42707,-4.37806 l -24.1575,-44.87511 c -0.15636,-0.23454 -0.23454,-0.46908 -0.31272,-0.70362 l -22.75028,-55.11664 c -0.85997,-1.95449 -0.70361,-4.2217 0.23454,-6.09802 l 37.76077,-73.87976 c 0.93815,-1.79813 1.09451,-3.90898 0.3909,-5.78529 l -18.4504,-51.12948 c -0.62544,-1.79814 -0.54726,-3.83081 0.23454,-5.55076 l 30.80278,-65.59272 c 3.12718,-6.56709 13.36872,-6.01983 15.55775,0.85998 l 9.61609,29.86462 29.31737,78.49236 c 0.78179,2.18903 2.6581,3.90898 5.00349,4.69078 l 62.54372,21.34304 c 2.42357,0.85998 4.29988,2.65811 5.08167,4.92532 z"
+         id="XMLID_42_" />
+      <g
+         id="text4752"
+         style="font-style:normal;font-variant:normal;font-weight:300;font-stretch:normal;font-size:341.333px;line-height:1.25;font-family:Roboto;-inkscape-font-specification:'Roboto Light';letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
+         aria-label="WULKANOWY" />
+    </g>
+  </g>
+</svg>
diff --git a/frontend/src/assets/wulkanowy.svg b/frontend/src/assets/wulkanowy.svg
index 49d2fc1..198488a 100644
--- a/frontend/src/assets/wulkanowy.svg
+++ b/frontend/src/assets/wulkanowy.svg
@@ -1,4 +1,4 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+5<?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <svg
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    xmlns:cc="http://creativecommons.org/ns#"
diff --git a/frontend/src/components/Login/Baner.vue b/frontend/src/components/Login/Baner.vue
index 9a45493..5bd48dc 100644
--- a/frontend/src/components/Login/Baner.vue
+++ b/frontend/src/components/Login/Baner.vue
@@ -1,56 +1,32 @@
 <template>
-    <div class="card" style="float: left;">
-        <v-col>
-           <v-row align="center">
-              <v-card dark color="#d32f2f" style="height: 524px; margin-right: 35px; width: 350px;">
-                <v-card-text>
-                  <div style="width: 140; height: 140;">
-                    <img src="../../assets/wulkanowy.svg"
-                    width="140"
-                    class="logo"/>
-                  </div>
-                <div id="headlineRed">Wulkanowy</div>
-                <div id="headlineTwo">Nieoficjalna aplikacja przeglądarkowa ucznia i
-                  rodzica dla dziennika Vulcan UONET+
-                  </div>
-                <br><br><br>
-                <a href="#" target="_blank" style="color: white;">Polityka prywatności</a>
-                <br>
-                <div id="headlineTwo">v 0.1.0</div>
-                </v-card-text>
-              </v-card>
-           </v-row>
-        </v-col>
+  <div>
+    <div class="pa-1 text-center justify-center">
+      <img
+        src="../../assets/iconWhite.svg"
+        width="140"
+        style="text-shadow: -1px 2px 0px rgba(157,0,0,0.73);"
+      />
     </div>
+    <v-card-title
+      style="text-shadow: -1px 2px 0px rgba(157,0,0,0.73);"
+      class="white--text text-center justify-center pa-2 headline"
+    >Wulkanowy</v-card-title>
+    <v-card-text class="white--text text-center pa-2">
+      Nieoficjalna aplikacja przeglądarkowa ucznia i
+      rodzica dla dziennika Vulcan UONET+
+    </v-card-text>
+    <br><br><br>
+    <v-card-subtitle
+      class="white--text"
+      style="position: absolute; bottom: 0px;"
+    >
+      v 0.1.0
+      <v-icon class="white--text">mdi-circle-small</v-icon>
+      <a
+        href="#"
+        target="_blank"
+        class="white--text"
+      >Polityka prywatności</a>
+    </v-card-subtitle>
+  </div>
 </template>
-<style>
-.cardTwo{
-  float: left;
-  height: 500px;
-  top: 5%;
-  margin-bottom: 50px;
-  width: 450px;
-}
-#headlineRed{
-  text-align: center;
-  font-weight: 300;
-  font-size: 2pc;
-  margin-bottom: 1pc;
-  color: white;
-  font-weight: 400;
-  text-shadow: -1px 2px 0px rgba(157,0,0,0.73);
-  margin-top: 10px;
-}
-
-#headlineTwo{
-  text-align: center;
-  font-weight: 300;
-  font-size: 1pc;
-  margin-bottom: 1.5pc;
-  color: white;
-  padding: 10px;
-}
-.logo img{
-  text-shadow: -1px 2px 0px rgba(157,0,0,0.73);
-}
-</style>
diff --git a/frontend/src/components/Login/Loading.vue b/frontend/src/components/Login/Loading.vue
index 8a8d8d1..821c833 100644
--- a/frontend/src/components/Login/Loading.vue
+++ b/frontend/src/components/Login/Loading.vue
@@ -1,19 +1,14 @@
 <template>
-<div id="App" style="height: 476px; margin: 0;">
-  <v-row align="center">
-    <v-col cols="12">
-      <v-progress-circular
+<div>
+  <v-row
+    align="center"
+    justify="center"
+  >
+    <v-progress-circular
       indeterminate
       color="red"
-      style="margin-top: 200px;"
-      ></v-progress-circular>
-    </v-col>
+      style="position: absolute; top: 50%; bottom: 50%;"
+    ></v-progress-circular>
   </v-row>
 </div>
 </template>
-
-<script>
-export default {
-  name: 'Loading',
-};
-</script>
diff --git a/frontend/src/components/Login/SelectStudent.vue b/frontend/src/components/Login/SelectStudent.vue
index 5ce170b..a5dd88d 100644
--- a/frontend/src/components/Login/SelectStudent.vue
+++ b/frontend/src/components/Login/SelectStudent.vue
@@ -1,8 +1,10 @@
 <template>
-<div id="App" style="min-height: 476px; margin: 0;">
+<div>
   <v-row align="center">
     <v-col cols="12">
-      <div id="nag">Wybierz ucznia</div>
+      <p class="justify-center text-center headline font-weight-light">Wybierz Ucznia</p>
+    </v-col>
+    <v-col cols="12">
       <v-radio-group>
         <v-radio
           v-model="selectedStudent"
@@ -13,8 +15,12 @@
       </v-radio-group>
     </v-col>
     <v-col cols="12">
-      <v-btn id="buttonTwo" dark color="red" elevation="2"
-        @click="chooseClicked()" :disabled="inputDisabled"
+      <v-btn
+        dark
+        color="red"
+        elevation="2"
+        @click="chooseClicked()"
+        :disabled="inputDisabled"
       >Wybierz</v-btn>
     </v-col>
   </v-row>
@@ -49,22 +55,3 @@ export default {
   },
 };
 </script>
-
-<style>
-  #nag{
-    text-align: center;
-    font-weight: 300;
-    font-size: 1.3pc;
-    margin-bottom: 1pc;
-  }
-
-  #App{
-    padding: 10px;
-  }
-
-  #buttonTwo{
-    margin-top: auto;
-    margin-left: auto;
-    display: flex;
-  }
-</style>
diff --git a/frontend/src/components/Login/UserLogin.vue b/frontend/src/components/Login/UserLogin.vue
index ea88bf0..cc2c0c7 100644
--- a/frontend/src/components/Login/UserLogin.vue
+++ b/frontend/src/components/Login/UserLogin.vue
@@ -1,48 +1,69 @@
 <template>
-  <div id="App" style="height: 476px; margin: 0;">
-    <v-row align="center">
-      <v-col cols="12">
-              <div id="nag">Zaloguj się za pomocą konta ucznia lub rodzica</div>
-              <v-text-field color="red" v-model="login" :disabled="inputDisabled"
-              label="E-mail" outlined></v-text-field>
-              <v-text-field color="red" v-model="password" :disabled="inputDisabled"
-              label="Hasło" outlined type="password"></v-text-field>
-              <v-text-field color="red" v-model="symbol" :disabled="inputDisabled"
-              label="Symbol" outlined></v-text-field>
-              <v-select color="red" v-model="selectedSymbol" :disabled="inputDisabled"
-              label="Wybierz odmianę dziennika UONET+" outlined :items="item"
-              v-on:change="fakelog()"
-              item-color="red"></v-select>
-              <v-btn id="buttonTwo" dark color="red" elevation="2"
-              @click="loginUser()">Zaloguj się</v-btn>
-      </v-col>
-    </v-row>
+  <div>
+    <v-col cols="12">
+      <p class="justify-center text-center headline font-weight-light">
+        Zaloguj się za pomocą konta ucznia lub rodzica
+      </p>
+    </v-col>
+    <v-col cols="12">
+      <v-text-field
+        color="red"
+        v-model="login"
+        :disabled="inputDisabled"
+        label="E-mail"
+        outlined
+      />
+      <v-text-field
+        color="red"
+        v-model="password"
+        :disabled="inputDisabled"
+        label="Hasło"
+        outlined
+        type="password"
+      />
+      <v-text-field
+        color="red"
+        v-model="symbol"
+        :disabled="inputDisabled"
+        label="Symbol"
+        outlined
+      />
+      <v-select
+        color="red"
+        v-model="selectedSymbol"
+        :disabled="inputDisabled"
+        label="Wybierz odmianę dziennika UONET+"
+        outlined
+        :items="domains"
+        v-on:change="fakelog()"
+        item-color="red"
+      />
+    </v-col>
+    <v-col cols="12">
+      <v-btn
+        dark
+        color="red"
+        elevation="2"
+        @click="loginUser()"
+        class="justify-end"
+      >Zaloguj się</v-btn>
+    </v-col>
   </div>
 </template>
-<script lang="ts">
+<script>
 import Vue from 'vue';
 import login from '../../api/login';
-import diary from '../../assets/data/diary.json';
 
-interface Login {
-  login: string
-  password: string
-  diaryNames: Array<string>
-  selectedDiary: string,
-  selectedSymbol: string,
-  symbol: string
-}
-
-export default Vue.extend({
+export default {
   name: 'UserLogin',
   data() {
     return {
       inputDisabled: false,
       login: '',
       password: '',
-      selectedSymbol: '',
-      symbol: '',
-      item: [
+      selectedSymbols: '',
+      symbols: '',
+      domains: [
         'Vulcan',
         'Fakelog',
       ],
@@ -71,7 +92,7 @@ export default Vue.extend({
       }
     },
   },
-});
+};
 </script>
 <style>
   #App{
diff --git a/frontend/src/components/Panel/Drawer.vue b/frontend/src/components/Panel/Drawer.vue
index 82f4245..567c040 100644
--- a/frontend/src/components/Panel/Drawer.vue
+++ b/frontend/src/components/Panel/Drawer.vue
@@ -99,22 +99,6 @@
             </v-list-item-icon>
             <v-list-item-title>School</v-list-item-title>
           </v-list-item>
-
-          <v-divider></v-divider>
-
-          <v-list-item @click="clickMenu(settings)">
-            <v-list-item-icon>
-              <v-icon>mdi-cog</v-icon>
-            </v-list-item-icon>
-            <v-list-item-title>Settings</v-list-item-title>
-          </v-list-item>
-
-          <v-list-item @click="clickMenu(about)">
-            <v-list-item-icon>
-              <v-icon>mdi-information-outline</v-icon>
-            </v-list-item-icon>
-            <v-list-item-title>About</v-list-item-title>
-          </v-list-item>
        </v-list-item-group>
       </v-list>
     </v-navigation-drawer>
diff --git a/frontend/src/plugins/vuetify.ts b/frontend/src/plugins/vuetify.ts
index 6d13a7b..94826d0 100644
--- a/frontend/src/plugins/vuetify.ts
+++ b/frontend/src/plugins/vuetify.ts
@@ -8,7 +8,7 @@ export default new Vuetify({
   theme: {
     themes: {
       light: {
-        primary: colors.red.darken1, // #E53935
+        primary: colors.red.darken2, // #E53935
         secondary: colors.red.lighten4, // #FFCDD2
         accent: colors.indigo.base, // #3F51B5
       },
diff --git a/frontend/src/props/LoginForm.ts b/frontend/src/props/LoginForm.ts
new file mode 100644
index 0000000..9c13c12
--- /dev/null
+++ b/frontend/src/props/LoginForm.ts
@@ -0,0 +1,6 @@
+interface LoginForm {
+  login: String,
+  password: String,
+  domains: Array<String>,
+  selectedSymbol: String
+}
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index 01e064c..d5fddbe 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -10,14 +10,6 @@ const routes: Array<RouteConfig> = [
     name: 'Login',
     component: Login,
   },
-  {
-    path: '/about',
-    name: 'About',
-    // route level code-splitting
-    // this generates a separate chunk (about.[hash].js) for this route
-    // which is lazy-loaded when the route is visited.
-    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue'),
-  },
   {
     path: '/user',
     name: 'User',
diff --git a/frontend/src/views/Login.vue b/frontend/src/views/Login.vue
index a4c8be4..18298fc 100644
--- a/frontend/src/views/Login.vue
+++ b/frontend/src/views/Login.vue
@@ -1,15 +1,21 @@
 <template>
   <div id="login">
     <v-main style="width: 100%;">
-      <div style="clear: both;"></div>
       <v-card
         elevation="10"
         id="login-form"
         class="mx-auto"
+        :tile="window.width < 900"
         >
-        <Baner v-if="window.width > 900"></Baner>
-        <div class="card">
-          <v-col>
+        <v-row no-gutters>
+          <v-col
+            class="red darken-2 rounded-l-sm"
+            cols="12"
+            md="5"
+            style="min-height: 500px;"
+            v-if="window.width > 900"
+          ><Baner v-if="window.width > 900"></Baner></v-col>
+          <v-col cols="12" md="7">
             <form>
               <v-container>
                 <UserLogin
@@ -22,7 +28,7 @@
               </v-container>
             </form>
           </v-col>
-        </div>
+        </v-row>
       </v-card>
     </v-main>
   </div>
@@ -80,13 +86,14 @@ export default {
   overflow: hidden;
   background-image: url("../assets/wallpaper.jpg");
   background-size: cover;
-  height: 100%;
+  min-height: 100vh;
   width: 100%;
 }
 #login-form {
   top: 15%;
   width: 850px;
   margin-bottom: 200px;
+  min-height: 500px;
 }
 .login-input {
   margin: 10px;
@@ -94,4 +101,13 @@ export default {
 .login-button {
   margin: 10px;
 }
+
+@media only screen and (max-width: 900px) {
+  #login-form {
+    top: 0%;
+    margin: 0;
+    width: 100vw;
+    min-height: 100vh;
+  }
+}
 </style>
diff --git a/frontend/src/views/Panel.vue b/frontend/src/views/Panel.vue
index af86453..e7f7ca2 100644
--- a/frontend/src/views/Panel.vue
+++ b/frontend/src/views/Panel.vue
@@ -1,9 +1,10 @@
 <template>
-<div id="App" style="margin: 0;">
-    <div id="appbar">
-      <Appbar></Appbar>
-      <Drawer></Drawer>
-    </div>
+<div>
+  <div id="appbar">
+    <Appbar></Appbar>
+    <Drawer></Drawer>
+  </div>
+  <v-main></v-main>
 </div>
 </template>
 
@@ -19,6 +20,3 @@ export default {
   },
 };
 </script>
-
-<style scoped>
-</style>
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index a79aa82..25566f5 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -9,7 +9,6 @@
     "skipLibCheck": true,
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
-    "resolveJsonModule": true,
     "sourceMap": true,
     "baseUrl": ".",
     "types": [