diff --git a/src/components/GameWindow.vue b/src/components/GameWindow.vue
index f628908..f1fca99 100644
--- a/src/components/GameWindow.vue
+++ b/src/components/GameWindow.vue
@@ -209,10 +209,13 @@ onMounted(() => {
-
+
-
-
-
+
@@ -308,13 +314,30 @@ body {
}
.form-custom {
- border: 1px solid #444444;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
- padding: 20px;
color: white;
+ z-index: 1000;
+}
+
+.game-input-form {
+ height: 90px;
+ padding: 20px;
+ position: relative;
+ z-index: 1000;
+}
+
+.game-input-form-shadow {
+ height: 90px;
+ width: 120%;
+ left: -10%;
+ top: 3px;
+ position: absolute;
+ box-shadow: 0px -5px 10px black;
+ z-index: 9;
+ background-color: aqua;
}
.message-cloud {
@@ -350,9 +373,12 @@ body {
}
.messages-block {
- height: calc(100dvh - 140px - 60px);
+ top: 95px;
+ height: calc(100dvh - 95px - 90px + 5px);
overflow-y: auto;
scrollbar-width: none;
+ position: relative;
+ padding: 5px 0 15px 0;
}
@media (min-width: 1025px) {
@@ -408,6 +434,16 @@ body {
display: flex;
}
+.game-header {
+ height: 100px;
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ color: white;
+ z-index: 1000;
+}
+
.game-header-empty-block {
height: 5px;
}
@@ -418,6 +454,17 @@ body {
z-index: 10;
}
+.game-header-belt-mini-shadow {
+ height: 20px;
+ width: 120%;
+ left: -10%;
+ position: absolute;
+ top: 10px;
+ box-shadow: 0px 5px 10px black;
+ z-index: 9;
+ background-color: aqua;
+}
+
.game-header-belt {
height: 60px;
position: relative;
@@ -425,6 +472,16 @@ body {
z-index: 1;
}
+.game-header-belt-shadow {
+ width: 120%;
+ left: -10%;
+ height: 60px;
+ top: 30px;
+ position: absolute;
+ background-color: aqua;
+ box-shadow: 0px 5px 10px black;
+}
+
.logo {
width: 90px;
height: 88px;