update

src/components/GameWindow.vue

@@ -217,7 +217,7 @@ onMounted(() => {
       </BeltMiniBlock>
       <BeltBlock class="game-header-belt center-bold-text">
         <div class="position-right-center">
-          <span class="logo-text">Вечерний детектив</span>
+          <span class="text-with-font">Вечерний детектив</span>
           <MetalPlate class="team-name-block">
             <div class="text-middle-wrapper text-truncate">
               <p>...</p>
@@ -235,10 +235,13 @@ onMounted(() => {
         <div class="center-block-custom">
           <form @submit.prevent="addAction">
             <div class="controller">
-              <input class="game-input-run" v-model="place" type="text" placeholder="Место назначения (А-1, а-1, а1)"
+              <div class="game-input">
+                <div class="game-input-run-left"></div>
+                <input id="run" class="game-input-run" v-model="place" type="text" placeholder="Место назначения"
                   :disabled="gameState !== 'RUN'">
+              </div>
               <div class="game-button-run-shadow"></div>
-              <button class="game-button-run" type="submit" :disabled="gameState !== 'RUN'">Поехали</button>
+              <button class="game-button-run text-with-font" type="submit" :disabled="gameState !== 'RUN'">Поехали</button>
             </div>
           </form>
         </div>
@@ -317,7 +320,7 @@ body {
 
 .form-custom {
   position: fixed;
-  bottom: 0;
+  bottom: 10px;
   left: 0;
   width: 100%;
   color: white;
@@ -519,11 +522,42 @@ body {
   /* TODO */
 }
 
-.game-input-run {
-  margin-top: 14px;
-  margin-left: 25px;
+.game-input {
+  position: relative;
+  top: 14px;
+  left: 25px;
   height: 50px;
-  width: calc(100% - 150px);
+  width: calc(100% - 150px - 50px);
+}
+
+.game-input-run-left {
+  height: 50px;
+  width: 25px;
+  position: absolute;
+  left: 0px;
+  background-image: url("@/assets/input_left.png");
+  background-size: cover;
+}
+
+.game-input-run {
+  height: 100%;
+  width: 100%;
+  margin-left: 15px;
+  padding-left: 12px;
+  background-image: url("@/assets/input_center.png");
+  background-size: cover;
+  border: 0;
+  font-size: 18px;
+  font-family: a_OldTyper;
+}
+
+.game-input-run::placeholder {
+  color: #333333;
+}
+
+.game-input-run:focus {
+  border: 0;
+  outline: none;
 }
 
 .controller-metal {
@@ -541,12 +575,12 @@ body {
   right: -15px;
 }
 
-.logo-text {
+.text-with-font {
   font-family: a_OldTyper;
-  line-height: 20px;
-  font-size: 22px;
-  color: #a1825f;
+  color: #bfa07d;
   font-weight: 600;
   letter-spacing: 2px;
+  line-height: 20px;
+  font-size: 22px;
 }
 </style>