diff --git a/package.json b/package.json
index 0ce468e..1f1cc3a 100644
--- a/package.json
+++ b/package.json
@@ -1,12 +1,12 @@
 {
   "devDependencies": {
     "@babel/core": "^7.14.3",
-    "@babel/eslint-parser": "^7.14.3",
+    "@babel/eslint-parser": "^7.14.4",
     "@babel/plugin-proposal-class-properties": "^7.13.0",
     "@babel/plugin-proposal-decorators": "^7.14.2",
-    "@babel/plugin-proposal-object-rest-spread": "^7.14.2",
+    "@babel/plugin-proposal-object-rest-spread": "^7.14.4",
     "@babel/plugin-transform-runtime": "^7.14.3",
-    "@babel/preset-env": "^7.14.2",
+    "@babel/preset-env": "^7.14.4",
     "@types/file-saver": "^2.0.2",
     "@types/prismjs": "^1.16.5",
     "@types/uikit": "^3.3.1",
@@ -15,18 +15,18 @@
     "babel-loader": "^8.2.2",
     "clipboard": "^2.0.8",
     "codejar": "^3.4.0",
-    "core-js": "^3.13.0",
+    "core-js": "^3.13.1",
     "css-loader": "^5.2.6",
-    "date-fns": "^2.21.3",
+    "date-fns": "^2.22.1",
     "eslint": "^7.27.0",
     "eslint-config-prettier": "^8.3.0",
-    "eslint-plugin-import": "^2.23.3",
+    "eslint-plugin-import": "^2.23.4",
     "eslint-plugin-prettier": "^3.4.0",
     "eslint-plugin-sort-imports-es6-autofix": "^0.6.0",
     "file-saver": "^2.0.5",
     "git-revision-webpack-plugin": "^5.0.0",
     "html-webpack-plugin": "^5.3.1",
-    "i18next": "^20.3.0",
+    "i18next": "^20.3.1",
     "mini-css-extract-plugin": "^1.6.0",
     "node-sass": "^6.0.0",
     "normalize.css": "^8.0.1",
@@ -37,11 +37,11 @@
     "raw-loader": "^4.0.2",
     "sass-loader": "^11.1.1",
     "ts-loader": "^9.2.2",
-    "typescript": "^4.2.4",
+    "typescript": "^4.3.2",
     "uikit": "^3.6.22",
-    "webpack": "^5.37.1",
+    "webpack": "^5.38.1",
     "webpack-cli": "^4.7.0",
     "webpack-dev-server": "^3.11.2",
-    "z-pagerouter": "^1.0.2"
+    "z-pagerouter": "^1.0.5"
   }
 }
diff --git a/src/allPages.ts b/src/allPages.ts
index 8e49260..71d97b1 100644
--- a/src/allPages.ts
+++ b/src/allPages.ts
@@ -107,6 +107,7 @@ class PageList {
   constructor(pages: pagesList) {
     this.pages = pages;
   }
+
   private pages: pagesList;
 
   async getPageIDs(): Promise<string[]> {
diff --git a/src/main.tsx b/src/main.tsx
index d489589..82505e5 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -46,12 +46,14 @@ async function onLoad(): Promise<void> {
     document.body,
   );
 
-  const pageRouter = new PageRouter(
-    pageList,
-    pageState,
-    document.getElementById("pageContent"),
-    document.getElementById("pageTitle"),
-  );
+  const pageRouter = new PageRouter({
+    pageList: pageList,
+    state: pageState,
+    pageTitleElement: document.querySelector("#pageTitle"),
+    pageContentElement: document.querySelector("#pageContent"),
+    resetElementContent: !true,
+  });
+
 
   reloadNavBar(pageRouter);
 
diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx
index 177c9e3..793a1b3 100644
--- a/src/pages/Login.tsx
+++ b/src/pages/Login.tsx
@@ -45,7 +45,7 @@ export class TokenLoginForm extends Component<{ page: Page }, unknown> {
       await page.router.changePage("HOME");
     } catch (e: unknown) {
       const error = e as Error;
-      document.getElementById("tokenInput").classList.add("uk-form-danger");
+      document.querySelector("#tokenInput").classList.add("uk-form-danger");
       if (error.message == "permission denied") {
         setErrorText(i18next.t("log_in_token_login_error"));
       } else {
@@ -104,8 +104,8 @@ export class UsernameLoginForm extends Component<{ page: Page }, unknown> {
       await page.router.changePage("HOME");
     } catch (e: unknown) {
       const error = e as Error;
-      document.getElementById("usernameInput").classList.add("uk-form-danger");
-      document.getElementById("passwordInput").classList.add("uk-form-danger");
+      document.querySelector("#usernameInput").classList.add("uk-form-danger");
+      document.querySelector("#passwordInput").classList.add("uk-form-danger");
       setErrorText(error.message);
     }
   }