The_evening_detective/evening_detective_client
1
0
Fork 0
generated from VLADIMIR/template_frontend
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix

Browse Source
This commit is contained in:
Владимир Фёдоров 2026-03-18 03:29:08 +07:00
parent bf04f83a15
commit 25f1da5a32
1 changed files with 73 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
src/components/GameWindow.vue
View File

@ -209,10 +209,13 @@ onMounted(() => {
<div class="body-custom"> <div class="body-custom">
<div> <div class="game-header">
<div class="game-header-empty-block"></div> <div class="game-header-empty-block"></div>
<img alt="Вечерний детектив" class="logo" src="@/assets/logo_belt.png" /> <img alt="Вечерний детектив" class="logo" src="@/assets/logo_belt.png" />
<BeltMiniBlock class="game-header-belt-mini"></BeltMiniBlock> <div class="game-header-belt-mini-shadow"></div>
<BeltMiniBlock class="game-header-belt-mini">
</BeltMiniBlock>
<div class="game-header-belt-shadow"></div>
<BeltBlock class="game-header-belt center-bold-text"> <BeltBlock class="game-header-belt center-bold-text">
<!-- Вечерний детектив --> <!-- Вечерний детектив -->
<!-- <span class="team-name-block text-truncate">{{ team.name }}</span> --> <!-- <span class="team-name-block text-truncate">{{ team.name }}</span> -->
@ -220,7 +223,9 @@ onMounted(() => {
</div> </div>
<!-- Форма ввода --> <!-- Форма ввода -->
<BeltBlock class="form-custom"> <div class="form-custom">
<div class="game-input-form-shadow"></div>
<BeltBlock class="game-input-form">
<div class="center-block-custom"> <div class="center-block-custom">
<form @submit.prevent="addAction"> <form @submit.prevent="addAction">
<div class="controller"> <div class="controller">
@ -231,6 +236,7 @@ onMounted(() => {
</form> </form>
</div> </div>
</BeltBlock> </BeltBlock>
</div>
<!-- Действия --> <!-- Действия -->
<div class="messages-block" ref="scrollContainer"> <div class="messages-block" ref="scrollContainer">
@ -308,13 +314,30 @@ body {
} }
.form-custom { .form-custom {
border: 1px solid #444444;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
left: 0; left: 0;
width: 100%; width: 100%;
padding: 20px;
color: white; 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 { .message-cloud {
@ -350,9 +373,12 @@ body {
} }
.messages-block { .messages-block {
height: calc(100dvh - 140px - 60px); top: 95px;
height: calc(100dvh - 95px - 90px + 5px);
overflow-y: auto; overflow-y: auto;
scrollbar-width: none; scrollbar-width: none;
position: relative;
padding: 5px 0 15px 0;
} }
@media (min-width: 1025px) { @media (min-width: 1025px) {
@ -408,6 +434,16 @@ body {
display: flex; display: flex;
} }
.game-header {
height: 100px;
position: fixed;
top: 0;
left: 0;
width: 100%;
color: white;
z-index: 1000;
}
.game-header-empty-block { .game-header-empty-block {
height: 5px; height: 5px;
} }
@ -418,6 +454,17 @@ body {
z-index: 10; 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 { .game-header-belt {
height: 60px; height: 60px;
position: relative; position: relative;
@ -425,6 +472,16 @@ body {
z-index: 1; 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 { .logo {
width: 90px; width: 90px;
height: 88px; height: 88px;