From 1f2e1dd41936b9de67ae451f81e800b30efe54b7 Mon Sep 17 00:00:00 2001
From: IliaMiheev <imiheev774@gmail.com>
Date: Fri, 5 Jun 2026 11:15:32 +0300
Subject: [PATCH] =?UTF-8?q?=D0=A4=D0=B8=D0=BA=D1=81=20=D0=BC=D0=B5=D1=80?=
 =?UTF-8?q?=D0=B6=D0=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                 |  3 +++
 src/components/MyDialog.vue |  1 +
 src/views/PlannerView.vue   | 37 +++++++++++++++++++++----------------
 3 files changed, 25 insertions(+), 16 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 907955e..196e7db 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -9,6 +9,9 @@
 
 html {
     background-image: radial-gradient(#23aae3e2, #222222);
+    background-repeat: no-repeat;
+        background-attachment: fixed;
+
 }
 
 body {
diff --git a/src/components/MyDialog.vue b/src/components/MyDialog.vue
index aa1e827..d60551f 100644
--- a/src/components/MyDialog.vue
+++ b/src/components/MyDialog.vue
@@ -89,6 +89,7 @@ useEventListener("keydown", handleKeydown);
 .modal-footer {
     padding: 10px;
     display: flex;
+    justify-content: flex-end;
 }
 
 .modal-header {
diff --git a/src/views/PlannerView.vue b/src/views/PlannerView.vue
index eb4a22c..b543f33 100644
--- a/src/views/PlannerView.vue
+++ b/src/views/PlannerView.vue
@@ -384,11 +384,11 @@ function onContextMenu(e, item) {
                 <p v-else>Выстройте маршрут перед сохранением кода.</p>
             </main>
             <template #footer>
-                <div v-if="listOfTrips.length">
+                <template v-if="listOfTrips.length">
                     <button @click="openPreviewFromModal">Предпросмотр</button>
                     <button @click="handleDownloadBtn">Скачать код</button>
                     <button @click="copyAndToast(finallyText)">Скопировать код</button>
-                </div>
+                </template>
             </template>
         </MyDialog>
     </div>
@@ -396,7 +396,8 @@ function onContextMenu(e, item) {
 
 <style>
 :root {
-    --side: 75px;
+    --side: 8vh;
+    --sizeActions: 5vh;
 }
 
 .wraper {
@@ -409,36 +410,40 @@ function onContextMenu(e, item) {
     display: grid;
     padding: 3px;
     grid-template-columns: repeat(10, var(--side));
+    grid-template-rows: repeat(10, var(--side));
     gap: 5px;
     user-select: none;
 }
 
 .square {
-    width: var(--side);
-    height: var(--side);
+    width: 100%;
+    height: 100%;
+    text-align: center;
     background-size: cover;
-    border: 3px solid rgb(251, 251, 251);
+    border: 3px solid #ffffff;
     cursor: pointer;
     overflow-y: scroll;
 
     background-blend-mode: multiply;
-    background-color: transparent;
+    background-color: #ffffff;
     transition: background-color 0.3s ease;
 
-    color: white;
-    text-shadow: -1px -1px 0 black,
-        1px -1px 0 black,
-        -1px 1px 0 black,
-        1px 1px 0 black;
+    color: #2267fce2;
+    text-shadow: -1px -1px 0 #fff,
+    1px -1px 0 #fff,
+    -1px 1px 0 #fff,
+    1px 1px 0 #fff;
     box-sizing: border-box;
+    font-size: 1.1rem;
+    font-weight: bold
 }
 
 .square:hover {
-    background-color: rgb(166, 162, 162);
+    background-color: #949494;
 }
 
 .square:active {
-    background-color: rgb(164, 162, 162);
+    background-color: #747474;;
 }
 
 .square::-webkit-scrollbar {
@@ -466,8 +471,8 @@ function onContextMenu(e, item) {
 }
 
 .actions svg {
-    width: 40px;
-    height: 40px;
+    width: var(--sizeActions);
+    height: var(--sizeActions);
     transition: color 0.4s;
 }