AAAA ANIMACII

Мега много анимаций прикиньте да?

luckydiamond/src/assets/css/ComponentsStyles/header.css

@@ -24,6 +24,11 @@
     font-weight: 700;
     font-size: 18px;
     margin-right: 3em;
+    transition: 250ms;
+}
+
+.header__nav nav a:hover {
+    color: #EF4444;
 }
 
 .header__nav--now {
@@ -84,6 +89,7 @@
     padding: 20px 23px 20px 23px;
     text-decoration: none;
     margin-left: -15%;
+    transition: 200ms;
 }
 
 .header__auth--discord {

luckydiamond/src/assets/css/PagesStyles/home.css

@@ -137,6 +137,7 @@
     font-weight: 700;
     text-transform: uppercase;
     text-align: center;
+    padding: 0px 0px 0px 28px;
 }
 
 .line__footer {
@@ -175,13 +176,36 @@
 
 .line__img__jackpot {
     display: flex;
-    margin:  1% 6.6% 1% 4.7%;
+    margin:  1% 6.6% 1% 0%;
 }
 
 .display-firstline {
     display: flex;
 }
 
+.cumming_soon_btn {
+    border-radius: 21px;
+    background: #FFF;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    color: #000;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 36px;
+    font-weight: 700;
+    padding: 11px 0px 11px 11px;
+    text-decoration: none;
+    text-transform: uppercase;
+    position: relative;
+    bottom: 5%;
+    left: 2%;
+    transition: 250ms;
+    cursor: default;
+}
+
+.cumming_soon_btn:hover {
+    background-color: #525252;
+}
+
 .line__btn {
     border-radius: 21px;
     background: #FFF;
@@ -191,14 +215,31 @@
     font-family: Montserrat Alternates;
     font-size: 36px;
     font-weight: 700;
-    padding: 11px 11px;
+    padding: 11px 0px 11px 11px;
     text-decoration: none;
     text-transform: uppercase;
     position: relative;
     bottom: 5%;
     left: 2%;
+    transition: 250ms;
 }
 
+.line__btn span:after {
+    content: '\00bb';
+    opacity: 0;
+    transition: 250ms;
+  }
+
+.line__btn:hover span:after {
+    opacity: 1;
+    right: 0;
+    padding-right: 0px;
+  }
+
+.line__btn:hover {
+    padding:11px 11px 11px 22px ;
+  }
+
 .line__btn__jackpot {
     border-radius: 21px;
     background: #FFF;
@@ -208,14 +249,31 @@
     font-family: Montserrat Alternates;
     font-size: 36px;
     font-weight: 700;
-    padding: 11px 11px;
+    padding: 11px 0px 11px 11px;
     text-decoration: none;
     text-transform: uppercase;
     position: relative;
     bottom: 4%;
     left: 6%;
+    transition: 250ms;
 }
 
+.line__btn__jackpot span:after {
+    content: '\00bb';
+    opacity: 0;
+    transition: 250ms;
+  }
+
+.line__btn__jackpot:hover span:after {
+    opacity: 1;
+    right: 0;
+    padding-right: 0px;
+  }
+
+.line__btn__jackpot:hover {
+    padding:11px 11px 11px 22px ;
+  }
+
 .line__btn--elm {
     color: #000;
     font-size: 38px ;

luckydiamond/src/pages/HomePage.vue

@@ -42,7 +42,7 @@
                       href="#"
                       @click="$router.push({ name: 'saper' })"
                       class="line__btn"
-                      >play <span class="line__btn--elm--saper">></span></a
+                      >play <span class="line__btn--elm--saper"></span></a
                     >
                   </div>
                 </div>
@@ -66,7 +66,7 @@
                       href="#"
                       @click="$router.push({ name: 'jackpot' })"
                       class="line__btn__jackpot"
-                      >play <span class="line__btn--elm">></span></a
+                      >   play <span class="line__btn--elm"></span></a
                     >
                   </div>
                 </div>
@@ -84,8 +84,8 @@
                     <h3 class="title-twoline">скоро</h3>
                   </div>
                   <div class="container">
-                    <a href="#" class="line__btn"
-                      >play <span class="line__btn--elm">></span></a
+                    <a href="#" class="cumming_soon_btn"
+                      >play <span class="line__btn--elm"></span></a
                     >
                     <img src="@/assets/icons-gamemodes/slots-icon.png" style="margin-bottom: 4%;" />
                   </div>
@@ -104,7 +104,7 @@
                       href="#"
                       @click="$router.push({ name: 'crash' })"
                       class="line__btn"
-                      >play <span class="line__btn--elm">></span></a
+                      >play <span class="line__btn--elm"></span></a
                     >
                     <img src="@/assets/icons-gamemodes/crush-icon.svg" />
                   </div>

src/css/style.css

@@ -72,6 +72,12 @@
     font-family: Montserrat Alternates;
     font-size: 18px;
     font-weight: 700;
+    transition: 250ms;
+}
+
+.header_other_text_menu:hover {
+    color: #EF4444;
+
 }
 
 .flex-container {