diff --git a/luckydiamond/src/assets/css/PagesStyles/games-pages/double.css b/luckydiamond/src/assets/css/PagesStyles/games-pages/double.css
index ecd43d5..05bd2f2 100644
--- a/luckydiamond/src/assets/css/PagesStyles/games-pages/double.css
+++ b/luckydiamond/src/assets/css/PagesStyles/games-pages/double.css
@@ -28,14 +28,16 @@
transform: scale(0.95);
/* Уменьшение при нажатии */
}
+
.bet-button.active {
- opacity: 0.7; /* Пример изменения стиля активной кнопки */
- }
+ opacity: 0.7;
+ /* Пример изменения стиля активной кнопки */
+}
/* Можно добавить тени для кнопок, чтобы они выглядели объемнее */
.bet-button {
margin: 1.2% 0 0 5.8%;
- margin-bottom:1vh;
+ margin-bottom: 1vh;
box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}
@@ -287,6 +289,22 @@
font-size: 24px;
}
+.double-carousel-arrow-animate {
+ animation: blink 1s infinite;
+}
+
+@keyframes blink {
+
+ 0%,
+ 100% {
+ opacity: 1;
+ }
+
+ 50% {
+ opacity: 0;
+ }
+}
+
.double-carousel-arrow-upper {
position: absolute;
top: -3vh;
diff --git a/luckydiamond/src/pages/games-pages/DoublePage.vue b/luckydiamond/src/pages/games-pages/DoublePage.vue
index 4d21953..83ddcb4 100644
--- a/luckydiamond/src/pages/games-pages/DoublePage.vue
+++ b/luckydiamond/src/pages/games-pages/DoublePage.vue
@@ -87,8 +87,8 @@
-
▲
-
▲
+
▲
+
▲
{
const dataDoubleParse = JSON.parse(dataDouble);
-
+ addClassById('arrow', 'double-carousel-arrow-animate');
+ addClassById('arrow-upper', 'double-carousel-arrow-animate');
if (dataDoubleParse.Players.length > 0) {
processUsersInGame(dataDoubleParse.Players);
}
@@ -437,11 +438,16 @@ export default {
if (dataDoubleParse.Status == "InGame") {
autoPlay.value = 20;
targetColor.value = dataDoubleParse.WInColor;
+ removeClassById('arrow', 'double-carousel-arrow-animate');
+ removeClassById('arrow-upper', 'double-carousel-arrow-animate');
}
if (dataDoubleParse.Status == "GameEnd") {
targetColor.value = dataDoubleParse.WInColor;
endGame.value = true;
autoPlay.value = 150;
+ removeClassById('arrow', 'double-carousel-arrow-animate');
+ removeClassById('arrow-upper', 'double-carousel-arrow-animate');
+
addWinEffectTouUsers(
dataDoubleParse.Players,
@@ -451,6 +457,19 @@ export default {
}
});
});
+ function addClassById(id, className) {
+ const element = document.getElementById(id);
+ if (element) {
+ element.classList.add(className);
+ }
+ }
+
+ function removeClassById(id, className) {
+ const element = document.getElementById(id);
+ if (element) {
+ element.classList.remove(className);
+ }
+ }
function addWinEffectTouUsers(usersArray, winColor) {
usersArray.forEach((user) => {