Refactor, implement two buttons pt.1

Signed-off-by: mctaylors <cantsendmails@mctaylors.ru>

assets/css/style.css

@@ -24,7 +24,7 @@
 
 p, button {
     color: white;
-    font-family: Nintendo;
+    font-family: Nintendo, sans-serif;
     font-weight: bold;
     font-size: 24px;
     line-height: 40px;
@@ -37,7 +37,6 @@ p, button {
     height: 355px;
     left: 50%;
     top: 50%;
-    -webkit-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     background-color: var(--background);
     backdrop-filter: blur(4px);
@@ -45,7 +44,7 @@ p, button {
     border-radius: 4px;
 }
 
-.dialog > .errorcode {
+.dialog > .error-code {
     margin-top: 40px;
     margin-left: 60px;
     color: lightgray;
@@ -65,17 +64,30 @@ p, button {
     position: absolute;
     bottom: 0;
     background-color: transparent;
-    border: 0px;
+    border: 0;
     border-top: 2px solid var(--border);
     width: 100%;
     height: 74px;
 }
 
+.dialog button.left, .dialog button.right {
+    width: 50%;
+}
+
+.dialog button.left {
+    border-right: 1px solid var(--border);
+}
+
+.dialog button.right {
+    border-left: 1px solid var(--border);
+    left: 50%;
+}
+
 .dialog button:hover {
     background-color: var(--background-active);
     border-radius: 4px;
     outline: 5px solid;
-    box-shadow: 0px 0px 12px var(--light-blue);
+    box-shadow: 0 0 12px var(--light-blue);
     animation: 500ms infinite alternate ease-out hover-outline;
 }
 

assets/js/main.js

@@ -1,13 +1,18 @@
 window.onload = function() {
     play("error");
-};
+}
 
-function play(audio) {
-    var audio = document.getElementById(audio);
-    audio.play();
-};
+function play(audioId) {
+    let audioElement = document.getElementById(audioId);
+    audioElement.play();
+}
 
-async function ok_button(href) {
+function close_button(href) {
     play("click");
     window.location.href = href;
-};
+}
+
+function details_button() {
+    play("click");
+    // TODO: this button does nothing for now :)
+}