Merge branch 'main' into Swino4ka

2025-12-09 19:59:27 +02:00 · 2024-04-17 17:05:57 +02:00
parent 73efda2f93 c90f249eb6
commit 327dd6c7e9
47 changed files with 2242 additions and 112 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,363 @@
+## Ignore Visual Studio temporary files, build results, and
+## files generated by popular Visual Studio add-ons.
+##
+## Get latest from https://github.com/github/gitignore/blob/master/VisualStudio.gitignore
+
+# User-specific files
+*.rsuser
+*.suo
+*.user
+*.userosscache
+*.sln.docstates
+
+# User-specific files (MonoDevelop/Xamarin Studio)
+*.userprefs
+
+# Mono auto generated files
+mono_crash.*
+
+# Build results
+[Dd]ebug/
+[Dd]ebugPublic/
+[Rr]elease/
+[Rr]eleases/
+x64/
+x86/
+[Ww][Ii][Nn]32/
+[Aa][Rr][Mm]/
+[Aa][Rr][Mm]64/
+bld/
+[Bb]in/
+[Oo]bj/
+[Oo]ut/
+[Ll]og/
+[Ll]ogs/
+
+# Visual Studio 2015/2017 cache/options directory
+.vs/
+# Uncomment if you have tasks that create the project's static files in wwwroot
+#wwwroot/
+
+# Visual Studio 2017 auto generated files
+Generated\ Files/
+
+# MSTest test Results
+[Tt]est[Rr]esult*/
+[Bb]uild[Ll]og.*
+
+# NUnit
+*.VisualState.xml
+TestResult.xml
+nunit-*.xml
+
+# Build Results of an ATL Project
+[Dd]ebugPS/
+[Rr]eleasePS/
+dlldata.c
+
+# Benchmark Results
+BenchmarkDotNet.Artifacts/
+
+# .NET Core
+project.lock.json
+project.fragment.lock.json
+artifacts/
+
+# ASP.NET Scaffolding
+ScaffoldingReadMe.txt
+
+# StyleCop
+StyleCopReport.xml
+
+# Files built by Visual Studio
+*_i.c
+*_p.c
+*_h.h
+*.ilk
+*.meta
+*.obj
+*.iobj
+*.pch
+*.pdb
+*.ipdb
+*.pgc
+*.pgd
+*.rsp
+*.sbr
+*.tlb
+*.tli
+*.tlh
+*.tmp
+*.tmp_proj
+*_wpftmp.csproj
+*.log
+*.vspscc
+*.vssscc
+.builds
+*.pidb
+*.svclog
+*.scc
+
+# Chutzpah Test files
+_Chutzpah*
+
+# Visual C++ cache files
+ipch/
+*.aps
+*.ncb
+*.opendb
+*.opensdf
+*.sdf
+*.cachefile
+*.VC.db
+*.VC.VC.opendb
+
+# Visual Studio profiler
+*.psess
+*.vsp
+*.vspx
+*.sap
+
+# Visual Studio Trace Files
+*.e2e
+
+# TFS 2012 Local Workspace
+$tf/
+
+# Guidance Automation Toolkit
+*.gpState
+
+# ReSharper is a .NET coding add-in
+_ReSharper*/
+*.[Rr]e[Ss]harper
+*.DotSettings.user
+
+# TeamCity is a build add-in
+_TeamCity*
+
+# DotCover is a Code Coverage Tool
+*.dotCover
+
+# AxoCover is a Code Coverage Tool
+.axoCover/*
+!.axoCover/settings.json
+
+# Coverlet is a free, cross platform Code Coverage Tool
+coverage*.json
+coverage*.xml
+coverage*.info
+
+# Visual Studio code coverage results
+*.coverage
+*.coveragexml
+
+# NCrunch
+_NCrunch_*
+.*crunch*.local.xml
+nCrunchTemp_*
+
+# MightyMoose
+*.mm.*
+AutoTest.Net/
+
+# Web workbench (sass)
+.sass-cache/
+
+# Installshield output folder
+[Ee]xpress/
+
+# DocProject is a documentation generator add-in
+DocProject/buildhelp/
+DocProject/Help/*.HxT
+DocProject/Help/*.HxC
+DocProject/Help/*.hhc
+DocProject/Help/*.hhk
+DocProject/Help/*.hhp
+DocProject/Help/Html2
+DocProject/Help/html
+
+# Click-Once directory
+publish/
+
+# Publish Web Output
+*.[Pp]ublish.xml
+*.azurePubxml
+# Note: Comment the next line if you want to checkin your web deploy settings,
+# but database connection strings (with potential passwords) will be unencrypted
+*.pubxml
+*.publishproj
+
+# Microsoft Azure Web App publish settings. Comment the next line if you want to
+# checkin your Azure Web App publish settings, but sensitive information contained
+# in these scripts will be unencrypted
+PublishScripts/
+
+# NuGet Packages
+*.nupkg
+# NuGet Symbol Packages
+*.snupkg
+# The packages folder can be ignored because of Package Restore
+**/[Pp]ackages/*
+# except build/, which is used as an MSBuild target.
+!**/[Pp]ackages/build/
+# Uncomment if necessary however generally it will be regenerated when needed
+#!**/[Pp]ackages/repositories.config
+# NuGet v3's project.json files produces more ignorable files
+*.nuget.props
+*.nuget.targets
+
+# Microsoft Azure Build Output
+csx/
+*.build.csdef
+
+# Microsoft Azure Emulator
+ecf/
+rcf/
+
+# Windows Store app package directories and files
+AppPackages/
+BundleArtifacts/
+Package.StoreAssociation.xml
+_pkginfo.txt
+*.appx
+*.appxbundle
+*.appxupload
+
+# Visual Studio cache files
+# files ending in .cache can be ignored
+*.[Cc]ache
+# but keep track of directories ending in .cache
+!?*.[Cc]ache/
+
+# Others
+ClientBin/
+~$*
+*~
+*.dbmdl
+*.dbproj.schemaview
+*.jfm
+*.pfx
+*.publishsettings
+orleans.codegen.cs
+
+# Including strong name files can present a security risk
+# (https://github.com/github/gitignore/pull/2483#issue-259490424)
+#*.snk
+
+# Since there are multiple workflows, uncomment next line to ignore bower_components
+# (https://github.com/github/gitignore/pull/1529#issuecomment-104372622)
+#bower_components/
+
+# RIA/Silverlight projects
+Generated_Code/
+
+# Backup & report files from converting an old project file
+# to a newer Visual Studio version. Backup files are not needed,
+# because we have git ;-)
+_UpgradeReport_Files/
+Backup*/
+UpgradeLog*.XML
+UpgradeLog*.htm
+ServiceFabricBackup/
+*.rptproj.bak
+
+# SQL Server files
+*.mdf
+*.ldf
+*.ndf
+
+# Business Intelligence projects
+*.rdl.data
+*.bim.layout
+*.bim_*.settings
+*.rptproj.rsuser
+*- [Bb]ackup.rdl
+*- [Bb]ackup ([0-9]).rdl
+*- [Bb]ackup ([0-9][0-9]).rdl
+
+# Microsoft Fakes
+FakesAssemblies/
+
+# GhostDoc plugin setting file
+*.GhostDoc.xml
+
+# Node.js Tools for Visual Studio
+.ntvs_analysis.dat
+node_modules/
+
+# Visual Studio 6 build log
+*.plg
+
+# Visual Studio 6 workspace options file
+*.opt
+
+# Visual Studio 6 auto-generated workspace file (contains which files were open etc.)
+*.vbw
+
+# Visual Studio LightSwitch build output
+**/*.HTMLClient/GeneratedArtifacts
+**/*.DesktopClient/GeneratedArtifacts
+**/*.DesktopClient/ModelManifest.xml
+**/*.Server/GeneratedArtifacts
+**/*.Server/ModelManifest.xml
+_Pvt_Extensions
+
+# Paket dependency manager
+.paket/paket.exe
+paket-files/
+
+# FAKE - F# Make
+.fake/
+
+# CodeRush personal settings
+.cr/personal
+
+# Python Tools for Visual Studio (PTVS)
+__pycache__/
+*.pyc
+
+# Cake - Uncomment if you are using it
+# tools/**
+# !tools/packages.config
+
+# Tabs Studio
+*.tss
+
+# Telerik's JustMock configuration file
+*.jmconfig
+
+# BizTalk build output
+*.btp.cs
+*.btm.cs
+*.odx.cs
+*.xsd.cs
+
+# OpenCover UI analysis results
+OpenCover/
+
+# Azure Stream Analytics local run output
+ASALocalRun/
+
+# MSBuild Binary and Structured Log
+*.binlog
+
+# NVidia Nsight GPU debugger configuration file
+*.nvuser
+
+# MFractors (Xamarin productivity tool) working folder
+.mfractor/
+
+# Local History for Visual Studio
+.localhistory/
+
+# BeatPulse healthcheck temp database
+healthchecksdb
+
+# Backup folder for Package Reference Convert tool in Visual Studio 2017
+MigrationBackup/
+
+# Ionide (cross platform F# VS Code tools) working folder
+.ionide/
+
+# Fody - auto-generated XML schema
+FodyWeavers.xsd
--- a/luckydiamond/src/assets/css/ComponentsStyles/asidebar.css
+++ b/luckydiamond/src/assets/css/ComponentsStyles/asidebar.css
@@ -28,14 +28,14 @@
 .menu__content--chest-icon {
    margin-left: -1px;
    transition: 250ms;
-    width: 100%;
-    height: 100%;
+    width: 80px;
+    height: 80px;
 }

 .menu__content--chest-icon:hover {
-    margin-left: -5px;
-    height: 125%;
-    width: 125%;
+    margin-left: -2px;
+    height: 100px;
+    width: 100px;
 }

 .menu__btn--home {
--- a/luckydiamond/src/assets/css/ComponentsStyles/developer.css
+++ b/luckydiamond/src/assets/css/ComponentsStyles/developer.css
@@ -4,10 +4,10 @@
    align-items: center;
    display: flex;
    justify-content: center;
-    width: 1332px;
+    width: 100%;
    height: 732px;
    margin-top: 10px;
-    margin-left: 65px;
+   
 }
 .bottom_card {
    width: 1332px;
@@ -18,8 +18,7 @@
    margin-left: 295px;
 }
 .top_card {
-    width: 1204px;
-    height: 443px;
+    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-left: 287px;
@@ -397,7 +396,84 @@
    display: flex;
 }
 /*the and FUpir_card 1*/
+/*beginning Swino4ka_card 1*/
+.Swino4ka_card {
+    width: 250px;
+    height: 443px;
+    background-color: #6b4d3f;
+    border: 3px solid #595959 ;
+    border-color: #595959;
+    border-radius: 22px;
+}
+.Swino4ka_text_2 {
+    width: 244px;
+    height: 221.5px;
+    display: inline-block;
+    flex-flow: column-reverse;
+    
+}

+.Swino4ka_aboutinfo_2 {
+    margin-top: 30px;
+    margin-left: 19px;
+    
+}
+.Swino4ka_aboutinfo_2 p {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 14px;
+    width: 79px;
+    height: 19px;
+    margin-left: 4px;
+}
+.Swino4ka_aboutinfo_2 h1 {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 32px;
+    width: 177px;
+    height: 37px;
+    line-height: 30px;
+}
+.Swino4ka_whatjob_1 {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    margin-left: 19px;
+    font-family: 'Montserrat';
+    margin-top: 30px;
+    
+}
+.Swino4ka_whatjob_1 img {
+    width: 15px;
+    height: 17px;
+}
+.Swino4ka_whatjob_1 p {
+    margin-left: 3px;
+    
+}
+
+.Swino4ka_skin_2 {
+    width: 244px;
+    height: 221.5px;
+    display: inline-block;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.Swino4ka_skin_2_skin {
+    width: 212px;
+    height: 212px;
+    background-image: url(https://avatar.spworlds.ru/front/212/Swino4ka.png);
+    justify-content: space-around;
+    display: flex;
+    align-items: flex-end;
+    margin-bottom: 3px;
+}
+.Swino4ka_skinicons1 {
+   justify-content: space-around;
+    display: flex;
+}
+/*the and Swino4ka_card 1*/
 /*beginning busha888_card 1*/
 .busha888_card {
    width: 422px;
@@ -485,10 +561,11 @@
 }
 /*the and busha888_card 1*/

-/*beginning megatntmega_card 1*/
-.megatntmega_card {
+/*beginning GEDPOOL31_card 1*/
+.GEDPOOL31_card {
    width: 422px;
    height: 269px;
+    flex-direction: row;
    border-radius: 22px;
    border: 3px solid #595959 ;
    border-color: #595959;
@@ -498,32 +575,33 @@

 }

-.megatntmega_text {
-    width: 211px;
+.GEDPOOL31_text {
+    width: 200px;
    height: 269px;

 
 }
-.megatntmega_aboutinfo {
+.GEDPOOL31_aboutinfo {
    margin-top: 30px;
    margin-left: 15px;
    
    
 }
-.megatntmega_aboutinfo p {
+.GEDPOOL31_aboutinfo p {
    font-family: 'Montserrat';
    color: white;
    font-size: 14px;
-    
+    width: 200px;
    height: 16px;
+   
 }
-.megatntmega_aboutinfo h1 {
+.GEDPOOL31_aboutinfo h1 {
    font-family: 'Montserrat';
    color: white;
    font-size: 32px;
    
 }
-.megatntmega_whatjob {
+.GEDPOOL31_whatjob {
    display: flex;
    width: 183px;
    height: 16px;
@@ -533,15 +611,15 @@
   
    margin-top: 30px;
 }
-.megatntmega_whatjob p {
+.GEDPOOL31_whatjob p {
    margin-left: 3px;
    margin-top: 3px;
 }
-.megatntmega_whatjob img {
+.GEDPOOL31_whatjob img {
    width: 25px;
-    height: 24px;
+    height: 25px;
 }
-.megatntmega_icons {
+.GEDPOOL31_icons {
    width: 79px;
    height: 36px; 
    justify-content: space-around;
@@ -550,23 +628,23 @@
    margin-left: 72px;
    margin-bottom: 11px;
 }
-.megatntmega_icons img {
+.GEDPOOL31_icons img {
+    display: flex;
    width: 36px;
    height: 36px;
 }
-.megatntmega_skin {
+.GEDPOOL31_skin {   
    margin-top: 51px;
    margin-bottom: 3px;
    display: flex;
    width: 212px;
    height: 212px;
-    background-image: url(https://avatar.spworlds.ru/front/212/megatntmega.png);
 }
-.megatntmega_skin img {
+.GEDPOOL31_skin img {
    width: 212px;
    height: 212px;
 }
-/*the and megatntmega_card 1*/
+/*the and GEDPOOL31_card 1*/

 /*beginning CLARFFY_card 1*/
 .CLARFFY_card {
@@ -659,11 +737,15 @@
        align-items: center;
        display: flex;
        justify-content: center;
-        width: 1332px;
+        width: 100%;
        height: 732px;
        margin-top: 80px;
-        margin-left: 142px;
+       
        
+        
+    }
+    .top_card {
+        width: 90%;
    }
 }

--- a/luckydiamond/src/assets/css/PagesStyles/games-pages/crash.css
+++ b/luckydiamond/src/assets/css/PagesStyles/games-pages/crash.css
@@ -1,3 +1,12 @@
+.classMenegerCrash {
+    display: flex;
+   
+   flex-direction: row;
+  }
+  .classNoMenegerCrash {
+    margin-top: 7.4vh;
+    margin-left: 1vh;
+  }
 .crash-content {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
--- a/luckydiamond/src/assets/css/PagesStyles/games-pages/double.css
+++ b/luckydiamond/src/assets/css/PagesStyles/games-pages/double.css
@@ -0,0 +1,325 @@
+.bet-button {
+    border: none;
+    padding: 10px 20px;
+    margin: 5px;
+    border-radius: 10px;
+    color: white;
+    font-weight: bold;
+    cursor: pointer;
+    transition: transform 0.1s ease;
+    outline: none;
+}
+
+/* Цвета для кнопок */
+.bet-button.red {
+    background-color: #863443;
+}
+
+.bet-button.green {
+    background-color: #2D4940;
+}
+
+.bet-button.black {
+    background-color: #202333;
+}
+
+/* Стили для нажатой кнопки */
+.bet-button:active {
+    transform: scale(0.95);
+    /* Уменьшение при нажатии */
+}
+
+.bet-button.active {
+    opacity: 0.7;
+    /* Пример изменения стиля активной кнопки */
+}
+
+/* Можно добавить тени для кнопок, чтобы они выглядели объемнее */
+.bet-button {
+    margin: 1.2% 0 0 5.8%;
+    margin-bottom: 1vh;
+    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
+}
+
+/* Стиль для тени при нажатии (опционально) */
+.bet-button:active {
+    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);
+}
+
+.double-start {
+    z-index: 1;
+    border-radius: 20px;
+    background: #1D223E;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 42vh;
+    height: 37vh;
+    border: 1px solid #262C55;
+    margin: 2.6%;
+    margin-top: 0px;
+}
+
+.double-game {
+    z-index: 1;
+    border-radius: 20px;
+    width: 69%;
+    height: 94%;
+}
+
+.double-ui-component {
+    display: flex;
+    align-items: center;
+    background-color: #25325A;
+    border-radius: 15px;
+    /* padding: 10px 20px; */
+    padding-right: 2vh;
+    padding-bottom: 1vh;
+    padding-top: 1vh;
+    padding-left: 2vh;
+    margin-bottom: 1vh;
+    max-width: 300px;
+    color: white;
+    font-family: Arial, sans-serif;
+    /* background: linear-gradient(to right, #1C213390 50%, #2F5139); */
+}
+
+.double-ui-component-gradient {
+    background: linear-gradient(to right, #1C213390 50%, #2F5139);
+}
+
+/* .double-ui-component img {} */
+
+.double-ui-component .double-username {
+    flex-grow: 1;
+    text-align: left;
+    margin-left: 1vh;
+    font-size: 18px;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: #515D83;
+}
+
+.double-ui-component .double-score {
+    display: flex;
+    align-items: center;
+}
+
+.double-score {
+    font-size: 20px;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: #748985;
+}
+
+.double-img-user {
+    margin-top: 6px;
+}
+
+.double-ui-component .double-score img {
+    width: 3vh;
+    height: 3vh;
+    margin-left: 10px;
+}
+
+.double-members-ingame-red {
+    overflow-y: auto;
+    background: linear-gradient(to bottom right,
+            #A9373C,
+            #1C2133 20%);
+    z-index: 1;
+    border: 2px solid #3B4260;
+    border-radius: 15px;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    margin-top: 1vh;
+    width: 100%;
+    height: 49vh;
+    /* height: 94%; */
+    padding: 2vh;
+}
+
+.double-members-ingame-green {
+    overflow-y: auto;
+    background: linear-gradient(to bottom right,
+            #345D3B,
+            #1C2133 20%);
+    z-index: 1;
+    border: 2px solid #3B4260;
+    border-radius: 15px;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    margin-top: 1vh;
+    width: 100%;
+    height: 49vh;
+    /* height: 94%; */
+    padding: 2vh;
+}
+
+.double-members-ingame-black {
+    overflow-y: auto;
+    background: linear-gradient(to bottom right,
+            #1B1A1A,
+            #1C2133 26%);
+    z-index: 1;
+    border: 2px solid #3B4260;
+    border-radius: 15px;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    margin-top: 1vh;
+    margin-top: 1vh;
+    width: 100%;
+    /* height: 94%; */
+    height: 49vh;
+    padding: 2vh;
+}
+
+.double-members-flex-container {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    color: white;
+    margin-bottom: 2vh;
+}
+
+.double-red-box {
+    display: flex;
+    align-items: baseline;
+    font-size: 18px;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: #B64848;
+}
+
+.double-white-box {
+    display: flex;
+    align-items: baseline;
+    font-size: 18px;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: FEEBEB;
+}
+
+.double-green-box {
+    display: flex;
+    align-items: baseline;
+    font-size: 18px;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: #5EA25C;
+}
+
+.double-number-color {
+    color: #56629A;
+    font-weight: bold;
+    font-size: 18px;
+    font-family: Montserrat;
+}
+
+.double-red-box span {
+    font-size: larger;
+    /* Or any specific size */
+    margin-left: 5px;
+    /* Spacing between RED and X2 */
+}
+
+.double-user-icon {
+    display: flex;
+    align-items: center;
+}
+
+.double-user-icon .double-user-icon-span {
+    background-image: url('../../../icons-games/double-game/MembersInGame.png');
+    width: 20px;
+    height: 20px;
+    margin-right: 5px;
+}
+
+.double-game {
+    z-index: 1;
+    border-radius: 20px;
+    width: 69%;
+    height: 94%;
+}
+
+.double-game-main-box {
+    border-radius: 10px;
+    border: 1px solid #262C55;
+    padding-top: 4vh;
+    padding-bottom: 4vh;
+    padding-left: 0vh !important;
+    padding-right: 0vh !important;
+    background: #1A1F37;
+    margin-bottom: 1vh !important;
+}
+
+.double-carousel {
+    z-index: 1;
+    position: relative;
+    background: #2E2D37;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 100%;
+    margin-top: 1px;
+    border: 1vh solid #2E2D37;
+    border-right: 0vh !important;
+    border-left: 0vh !important;
+    height: 95%;
+}
+
+.container-double-history-text {
+    display: flex;
+}
+
+.double-history-text {
+    background-color: #728DF8;
+    border: none;
+    color: #0E1220;
+    padding-right: 1vh;
+    padding-left: 1vh;
+    font-size: 16px;
+    margin: 4px 2px;
+    border-radius: 5px;
+    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
+    font-size: 18px;
+    font-family: Montserrat;
+    font-weight: bold;
+}
+
+.double-carousel-arrow {
+    position: absolute;
+    bottom: -3vh;
+    left: 50%;
+    transform: translateX(-50%);
+    color: #728DF8;
+    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;
+    left: 50%;
+    transform: translateX(-50%) rotate(180deg);
+    color: #728DF8;
+    font-size: 24px;
+}
+
+.double-game-history-main-box {
+    border-radius: 20px;
+    border: 1px solid #262C55;
+    padding-top: 1vh;
+    padding-bottom: 0vh;
+    padding-left: 1vh;
+    padding-right: 0vh;
+    background: #1A1F37;
+}
--- a/luckydiamond/src/assets/css/PagesStyles/games-pages/jackpot.css
+++ b/luckydiamond/src/assets/css/PagesStyles/games-pages/jackpot.css
@@ -11,6 +11,15 @@
    /* margin-top: 2.6%; */
    margin: 2.6%;
 }
+.classMeneger {
+    display: flex;
+   
+   flex-direction: row;
+  }
+  .classNoMeneger {
+    margin-left: 1vh;
+    margin-top: 2.4vh;
+  }

 .jackpot-loading-bar {
    z-index: 1;
@@ -47,17 +56,12 @@
 .carousel-arrow {
    position: absolute;
    bottom: -20px;
-    /* Регулируйте положение стрелки относительно нижнего края карусели */
    left: 50%;
-    /* Центрирование стрелки по горизонтали */
    transform: translateX(-50%);
-    /* Дополнительное центрирование, чтобы точка указывала точно на центр */
    color: #728DF8;
-    /* Цвет стрелки */
    font-size: 24px;
-    /* Размер стрелки */
-    /* Добавьте любые дополнительные стили, такие как цвет фона, границы и т.д. */
 }
+
 .jackpot-useringame-list{
    margin-top: 3.5%;
    overflow-y: auto;
--- a/luckydiamond/src/assets/css/PagesStyles/games-pages/saper.css
+++ b/luckydiamond/src/assets/css/PagesStyles/games-pages/saper.css
@@ -6,7 +6,15 @@
    backdrop-filter: blur(100px);
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
 }
-
+.classMenegerSaper {
+    display: flex;
+   
+   flex-direction: row;
+  }
+  .classNoMenegerSaper {
+    margin-left: 1vh;
+    margin-top: 2.4vh;
+  }
 .bg {
    background: #293561;
    filter: blur(120px);
@@ -150,7 +158,8 @@
 #diamonds-input {
    /* width: 347px;
    height: 38px; */
-    width: 37vh;
+    /* width: 37vh; */
+    width: 36vh;
    height: 4vh;
 }

--- a/luckydiamond/src/assets/css/PagesStyles/home.css
+++ b/luckydiamond/src/assets/css/PagesStyles/home.css
@@ -37,6 +37,7 @@
    text-transform: uppercase;
 }

+
@keyframes RaindowAnimate {
    from {
        color: #6EEB21;
@@ -90,6 +91,7 @@
 }

 .bg-card {
+   
    border-radius: 40px;
    background: #EF4444;
    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
@@ -97,8 +99,9 @@

 .bg-early{
    border-radius: 40px;
-    background: #969B9E;
+    background: #EF4444;
    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    height: 21.5vh;
 }

 .gamemode__main {
@@ -260,6 +263,29 @@
    position: relative;
    bottom: 5%;
    left: 2%;
+    transition: 250ms;  
+    height: 7vh; 
+    
+}
+
+
+.line__btn--doubl {
+    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%;
+    height: 7.4vh;
+    width: 16vh;
    transition: 250ms;   
 }

@@ -268,6 +294,7 @@
    opacity: 0;
    transition: 250ms;
    right: 20;
+    
  }

 .line__btn--crash:hover span:after {
@@ -281,7 +308,28 @@
  }

 .line__btn--crash:active {
-    left: 5%;
+    left: 2%;
+  }
+  .line__btn--doubl span:after {
+    content: '\00bb';
+    opacity: 0;
+    transition: 250ms;
+    right: 0;
+  }
+
+.line__btn--doubl:hover span:after {
+    opacity: 1;
+    right: 0;
+    padding-right: 0px;
+  }
+
+.line__btn--doubl:hover {
+    padding:11px 11px 11px 22px ;
+    width: 20vh;
+  }
+
+.line__btn--doubl-:active {
+    left: 2%;
  }

 .line__btn__jackpot {
@@ -325,6 +373,7 @@
 .line__btn--elm {
    color: #000;
    font-size: 38px ;
+    
 }

 .line__btn--elm--saper {
@@ -357,7 +406,7 @@
 .gamemode__twoline--first__element {
    width: 100%;
    margin: 2% 3.6% 0 5.5%;
-    min-height: 180px;
+    min-height: 209px;
 }

 .linecontent-3 {
@@ -370,35 +419,40 @@
    color: #fff;
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    font-family: Montserrat Alternates;
-    font-size: 80px;
+    font-size: 60px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 4.5% 2.2%;
 }

-.gamemode__twoline--first__element .container {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}

-.gamemode__twoline--first__element .container a {
-    margin-right: 10%;
-    padding: 12px 10px;
-    margin-bottom: 3%;
-}

 .gamemode__twoline--two__element {
    margin-top: 2%;
    width: 100%;
    min-height: 180px;
+    height:22.3vh ;
+    
 }
-
+.container {}
 .gamemode__twoline--two__element .container {
    display: flex;
    justify-content: center;
+    
+   
+   
+}
+.linecontent-4 {
+    
+}
+.iconsGame {
+    bottom:  20px;
+    height: 20vh;
+}
+.ButtonPlayDouble {
+    width: 20vh;
+    margin-top: 1.6vh;
 }
-
 .gamemode__twoline--two__element .container a {
    margin-right: 10%;
 }
@@ -406,6 +460,21 @@
 .cumming_soon--img {
    margin-bottom: 4%;
 }
+.gamemode__twoline--two__element {
+    margin-top: 2%;
+    width: 100%;
+    min-height: 180px;
+}
+
+.gamemode__twoline--first__element .container {
+    display: flex;
+    justify-content: center;
+    
+}
+
+.gamemode__twoline--first__element .container a {
+    margin-right: 10%;
+}

 /* /GameMode */

@@ -430,7 +499,7 @@
    }

    .title-twoline {
-        font-size: 60px;
+        font-size: 40px;
    }

    .line__img__jackpot {
@@ -472,11 +541,7 @@
        width: 80px;
    }

-    .gamemode__twoline--first__element .container a {
-        margin-right: 10%;
-        padding: 2px 11px 11px 11px;
-        margin-bottom: 3%;
-    }
+    

    .line__btn__jackpot {
        border-radius: 16px;
@@ -490,8 +555,8 @@
    }

    .crash--img {
-        height: 60px;
-        width: 60px;
+        height: 128px;
+        width: 128px;
    }

    .line__content {
@@ -506,7 +571,7 @@
    }

    .title-twoline {
-        font-size: 40px;
+        font-size: 20px;
    }

    .line__img__jackpot {
@@ -549,11 +614,7 @@
        width: 80px;
    }

-    .gamemode__twoline--first__element .container a {
-        margin-right: 10%;
-        padding: 2px 11px 11px 11px;
-        margin-bottom: 3%;
-    }
+    

    .line__btn__jackpot {
        border-radius: 10px;
@@ -575,15 +636,16 @@
        height: 265px;
    }

-    .gamemode__twoline--first__element {
-        width: 100%;
-        margin: 0 3.6% 0 5.5%;
-        min-height: 60px;
-    }
+    

    .gamemode__twoline--two__element {
        margin-top: 0;
        width: 100%;
        min-height: 60px;
    }
+    .gamemode__twoline--first__element {
+        margin-top: 0;
+        width: 100%;
+        min-height: 60px;
+    }
 }
--- a/luckydiamond/src/assets/css/PagesStyles/jackpot-history.css
+++ b/luckydiamond/src/assets/css/PagesStyles/jackpot-history.css
@@ -0,0 +1,67 @@
+.jackpot-history__content {
+    display: flex;
+    max-height: 800px;
+    overflow-y: auto;
+    margin: 0 auto;
+}
+
+.jackpot-history__element {
+    display: flex;
+    flex-direction: column;
+    flex-wrap: wrap;
+    margin: 15px;
+}
+
+.abc {
+
+}
+
+.element-info {
+    display: flex;
+    align-items: center;
+}
+
+.element-info .element-info__icon img {
+    height: 50px;
+}
+
+.element-info .element-info__user-info {
+    margin-left: 4px;
+}
+
+.element-info .element-info__user-info .username {
+    color: #515D83;
+    font-family: 'Montserrat';
+    font-weight: 700;
+    font-size: 20px;
+}
+
+.element-info .element-info__user-info .user-deposit {
+    font-family: 'Montserrat';
+    font-weight: 700;
+    font-size: 20px;
+
+}
+
+.element-info .element-info__user-info .img-width img {
+    width: 16px;
+    height: 16px;
+}
+
+.element-chance {
+    margin-top: 10px;
+}
+
+.element-chance h2 {
+    font-family: 'Montserrat';
+    font-weight: 700;
+    font-size: 18px;
+    text-align: center;
+    background: #27345C;
+    border-radius: 7px;
+}
+
+.element-chance .chance-style {
+    color: #EF4444;
+    margin-left: 2px;
+}
--- a/luckydiamond/src/assets/css/PagesStyles/settings.css
+++ b/luckydiamond/src/assets/css/PagesStyles/settings.css
@@ -76,3 +76,56 @@
  background: red; /* Цвет фона трека для Firefox */
  height: 8px; /* Высота трека для Firefox */
 }
+
+
+     
+/* toggle in label designing */
+.toggle {
+  position : relative ;
+  display : flex;
+  width : 60px;
+  height : 32px;
+  background-color: #000413;
+  border-radius: 5px;
+  justify-content: center;
+ align-items: center;
+ 
+  
+}
+     
+/* After slide changes */
+.toggle:after {
+  content: '';
+  position: absolute;
+  width: 22px;
+  height: 22px;
+  border-radius: 5px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ align-content: center;
+  background-color: #EF4444;
+  top: 5px; 
+  left: 6px;
+  transition:  all 0.5s;
+}
+     
+/* Toggle text */
+.toggle p {
+  font-family: Arial, Helvetica, sans-serif;
+  font-weight: bold;
+}
+     
+/* Checkbox checked effect */
+.checkbox:checked + .toggle::after {
+  
+  left : 34px; 
+}
+     
+/* Checkbox checked toggle label bg color */
+
+     
+/* Checkbox vanished */
+.checkbox { 
+  display : none;
+}
--- a/luckydiamond/src/assets/css/global.css
+++ b/luckydiamond/src/assets/css/global.css
@@ -109,6 +109,38 @@ button {
    grid-gap: 0.625rem;
 }

+.content-grid--double {
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-template-areas:
+        "menu header header header header header header"
+        "menu double double double double double chat"
+        "menu double double double double double chat"
+        "menu double double double double double chat"
+        "menu double double double double double chat"
+        "menu double double double double double chat"
+        "menu double double double double double chat";
+    grid-gap: 0.625rem;
+}
+
+.jackpot-history__content-grid {
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-template-areas:
+        "menu header header header header header header"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat";
+    grid-gap: 0.625rem;
+}
+
 .grid-crash {
    display: grid;
    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
@@ -163,7 +195,7 @@ button {
    height: 86vh;
    position: relative;
    z-index: 3;
-   
+
 }

 /* /Chat */
@@ -211,9 +243,22 @@ button {
    margin: 0.625rem 2.438rem 1.125rem 1.125rem; */
 }

+.jackpot-history {
+    grid-area: jackpot-history;
+    background: #17181C;
+    border-radius: 20px;
+    height: 97%;
+}
+
+.double {
+    display: flex;
+    grid-area: double;
+   
+}
+
 .about {
    grid-area: about;
-    
+
 }


@@ -279,7 +324,7 @@ button {
    grid-area: help;
    display: flex;
    /* height:99%; */
-    height:86vh;
+    height: 86vh;
    border-radius: 3.125rem;
    background: #17181C;
    box-shadow: 0.25rem 0.25rem 0.25rem 0px rgba(0, 0, 0, 0.25);
@@ -287,7 +332,7 @@ button {
    /*height: 96.2%;*/
    width: 1000px;
    margin: 0 auto;
-    
+
 }


@@ -314,8 +359,9 @@ button {
    height: 35%;
    z-index: 0;
 }
+
 /* /Crash */

 /* Media */

-/* /Media */
+/* /Media */
--- a/luckydiamond/src/assets/icons-developcard/VK-Icons.svg
+++ b/luckydiamond/src/assets/icons-developcard/VK-Icons.svg
--- a/luckydiamond/src/assets/icons-developcard/YouTube-Icons.png
+++ b/luckydiamond/src/assets/icons-developcard/YouTube-Icons.png
--- a/luckydiamond/src/assets/icons-developcard/YouTube-Icons.svg
+++ b/luckydiamond/src/assets/icons-developcard/YouTube-Icons.svg
--- a/luckydiamond/src/assets/icons-developcard/YouTube-Icons1.png
+++ b/luckydiamond/src/assets/icons-developcard/YouTube-Icons1.png
--- a/luckydiamond/src/assets/icons-developcard/YouTube-Icons2.png
+++ b/luckydiamond/src/assets/icons-developcard/YouTube-Icons2.png
--- a/luckydiamond/src/assets/icons-developcard/tech-support.svg
+++ b/luckydiamond/src/assets/icons-developcard/tech-support.svg
--- a/luckydiamond/src/assets/icons-developcard/video
+++ b/luckydiamond/src/assets/icons-developcard/video
--- a/luckydiamond/src/assets/icons-developcard/video-1-(3).png
+++ b/luckydiamond/src/assets/icons-developcard/video-1-(3).png
--- a/luckydiamond/src/assets/icons-developcard/video.png
+++ b/luckydiamond/src/assets/icons-developcard/video.png
--- a/luckydiamond/src/assets/icons-games/double-game/DoubleLogo.svg
+++ b/luckydiamond/src/assets/icons-games/double-game/DoubleLogo.svg
--- a/luckydiamond/src/assets/icons-games/double-game/HistoryRectangleBlackDouble.png
+++ b/luckydiamond/src/assets/icons-games/double-game/HistoryRectangleBlackDouble.png
--- a/luckydiamond/src/assets/icons-games/double-game/HistoryRectangleGreenDouble.png
+++ b/luckydiamond/src/assets/icons-games/double-game/HistoryRectangleGreenDouble.png
--- a/luckydiamond/src/assets/icons-games/double-game/HistoryRectangleRedDouble.png
+++ b/luckydiamond/src/assets/icons-games/double-game/HistoryRectangleRedDouble.png
--- a/luckydiamond/src/assets/icons-games/double-game/MembersInGame.png
+++ b/luckydiamond/src/assets/icons-games/double-game/MembersInGame.png
--- a/luckydiamond/src/assets/icons-games/double-game/RectangleBlackDouble.png
+++ b/luckydiamond/src/assets/icons-games/double-game/RectangleBlackDouble.png
--- a/luckydiamond/src/assets/icons-games/double-game/RectangleGreenDouble.png
+++ b/luckydiamond/src/assets/icons-games/double-game/RectangleGreenDouble.png
--- a/luckydiamond/src/assets/icons-games/double-game/RectangleRedDouble.png
+++ b/luckydiamond/src/assets/icons-games/double-game/RectangleRedDouble.png
--- a/luckydiamond/src/assets/icons-games/double-game/info.svg
+++ b/luckydiamond/src/assets/icons-games/double-game/info.svg
@@ -0,0 +1,9 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<rect width="20" height="20" fill="url(#pattern0_3764_2)"/>
+<defs>
+<pattern id="pattern0_3764_2" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_3764_2" transform="scale(0.0078125)"/>
+</pattern>
+<image id="image0_3764_2" width="128" height="128" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAACXBIWXMAAAsTAAALEwEAmpwYAAAHQklEQVR4nO1dS2xUVRhGBd8PLOLbrdG1iRtfRJuIBjRGgRgT1iaQYEw0gYXdYowLN0pBUUBdzKrOq7czNePCB9YRxYIuXbQ+VghLoFK/b3ponHY6M525Z/7/3PN/yZdBLNP7f9937z33nHPPWbPGYDAYDAaDwWAwGAwGg8FgMBgyg4mJiRuSJLkPfAB/fmh8fHwYfN5xmH/H/8ef4c9KH6+hR8DAIRj4DEx9HRzFf9fAv8D5VfJP928P8Lv4nfxu6foMS8Cz1Z3N+8E6TPq3B7O7Jb/7NIMFbqvVauul648SuVzuOhjwMswo4fOiR8PbEr/7Aj6L4A6E4VppXTIPnO2PQ/SPIPg5KdPbhOEsPg/h8zFpnTKF+fn5K2D8Vgh7XNrkVYThJ3zuHBkZuVJav2BB8Wg8hPxR2tA+gjDNIOD2sFZaz6AA45+EeL9JG5gi2XDcJK2rehSLxTsh1lGIdUmBaT6uCIVyuXyvtM7qwMs9xNmTKGzceQgBG4u72baR1l0FcEZshCjj0sYIcJJXPGn9RQHzn4D3fygwQ+pq8Dc7saR9GDh4yYcAb4Fz0iZIkx1Z4L5obgl8JELBh6WFV8hj9Xp9nbQ/XuH67csKxNbK6tjY2E3SPnkBihuC+d8oEFk7p/L5/G3SfqUKFoTCTisQNwiyB7FarW6Q9i0VwPzr7czvKQTfo710o7R/fYGNGrvn98VqLpe7WtrHnsDHGpj/iQIRgyY0/CzIUcVk4TlfXMAsECHYK+3nqsAevsQ6edIMwMVgJprgWf/2mLt3PXJG/eOhG9WbUCBWJskGter2gBvSFRcqy4TGu6R9bgkObbqxbnGRMs5z0Pkuab+XAQf2uQJxoiACcETa7yZwDp+0KF3wO77M0Q35swqOt10ALnGKvLTvDeRyuatwQL9Ki9IFc93WxJ9VcLydQjCtokGIg3lFWowYA+BCsN2ntx3hununpYWIOAA/i84kKpfLL0iLEHMASL4849PjTkJNSQsQewA4bOzT4xXBVqh08RaABeJK/KhPr1vCvaUrXrwFoHEVOOjT62Xgu/D4pf9IF24BWAzAWa6Z4NPzJrjFGcQLtwA0hWCbT8+bEOg0r6wHIO/T80WgwXGz5LIsxhUDcGEgk0jxy7ZIF2tckZsHEYB3FRRqbM23BxGAEwoKNbYgbgM/+DZ/KPG7Dp+xP84Vi8VbvQUADcBnFRRpbE9/7QAumaqgQGMbcl6mzwCMShdo7BiA970FAL/gK+kCjR0D8KXPAPSy6rZxsJz1Yj57mRQU1w9nkoUu3m44o+B4eyInjPKV/NQDwAUOpYvrk5keC1gSgvTfG6hUKg9KF2YB6I6lUun+1AOAL35YujALQHfk9jepByCQlz8sAEnjFrAp9QBwcyXpwiwAXQfgOQuABSBd2C0gHHq5BSTWCAyGXhqB9hgYDr08BlpHUDj00hGUga7gKALgrSvYCRPyYFAUAUh8DQY5YUIeDo4iAF6HgwOfEBJLAPxNCAl8SlgsAfA3JcxtoS5epAWgbQCe9haAJOxp4TEEwO+0cCdOqHv5xhCAKZ/eN4BLzDsKCrUAtCC82e/T+wYCfjkkhgD4u/9fBrc146vI0sVaAJbxPLfl8+n9/wUqKijYAtDMMZ+eLxVoh4KCLQDNfNGn502wRaJ0ceCLRDmRDkkXbgFY5AGfXrcENzFSULgFIGnMAHrEp9fthPpWuvjYA4AT8bhPj9sisJnCmQwAuMWnx23BpcpxAL8oECHKAIgvF08EtGpo5gKAe/9LPr3tCtwyJglja/isBeCkii1jCL6IwMmICkRpx0xtGiWyRHw74KA+lRYmIn4s7fcyTE5O3hFg72CIPMP9maX9bgkc3G4FAmWaOMlelfZ5RbhdxPLSImWYJfHHvk5A42QjDnRWgVhZo/7t4y+DG0rZngLpkVqK9ff3Chz0PmnhskJo+aa0n6uGaw8clhYvAzym/r6/Eur1+joUUFIgYpDECVSo1WprpX3sC5ypgkK+lhYzNHKYd2CTPH2jWq1uQFGnpEUNiBxhHZL2LVXwlSW7EnQmz/xgHvdWC65ckYQ5pXxQ5he8re6hBW74+ENpsbUR5h9ho1nan4HAPSLutc6ihU4e8I1gH/X6QbKw9uDv0iYIcia4Hr60wQZPEmFfAe/3fDqS1l8F3C1hVyTzCc5wSDfKS34n8IzgQlQBTC/r5YxnTUfVTubQBDeaOC1tWoo8qW4On3ZwxiuCsJX74SowsFeyR28nH32l9QwaCMFwonym7hKe4Oxiu8+nDF5GIexBpY1FNu5Go3+sGwTc+gTb+SglvFzNefALvqGDcF4jrUuUYN85bxFcIYuDTZ4DMYfvr+PzPV7i8dRyi3T9hiXgqCMM2gy+Bn7AxZOT3iapzrp/y+/YwxW4cOVZL12foUfwSlEoFO7hbhrcUgWX7Kf4ejvJP/Pv+P8qlcrdmR+RMxgMBoPBYDAYDAaDwWAwGAyR4T8v9J98K6ZdvgAAAABJRU5ErkJggg=="/>
+</defs>
+</svg>
--- a/luckydiamond/src/assets/icons-games/saper-game/arrowTop.png
+++ b/luckydiamond/src/assets/icons-games/saper-game/arrowTop.png
--- a/luckydiamond/src/assets/icons-menu/duable-icons.svg
+++ b/luckydiamond/src/assets/icons-menu/duable-icons.svg
--- a/luckydiamond/src/assets/js/chat/ChatLogic.js
+++ b/luckydiamond/src/assets/js/chat/ChatLogic.js
@@ -29,10 +29,14 @@ export function ConnectToChat() {
                    return;
                }

+                if (dataObject.MessageType == 'DoubleGameState') {
+                    eventBus.emit('doubleGame', event.data)
+                    return;
+                }
+
                if (dataObject.MessageType == "CrashGameState") {
                    eventBus.emit('crash', event.data);
                    return;
-
                }

                if (Array.isArray(dataObject.CurrentGame.PlayerList)) {
@@ -41,7 +45,7 @@ export function ConnectToChat() {
                }

            } catch (error) {
-                void(error);
+                void (error);
            }
        };

--- a/luckydiamond/src/assets/js/games/double/DoubleApi.js
+++ b/luckydiamond/src/assets/js/games/double/DoubleApi.js
@@ -0,0 +1,69 @@
+import { BackendApiUrl } from '@/properties/Сonfig.js';
+import {
+    GetCookie
+} from "@/assets/js/storage/CookieStorage.js";
+
+
+export async function GetNewestDoubleGames() {
+    try {
+        const response = await fetch(`${BackendApiUrl}/GameDouble/GetNewestDoubleGames`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            redirect: 'follow'
+        })
+
+        if (!response.ok) {
+            console.log('Fetch error:', response.status)
+        }
+
+        return await response
+    }
+    catch (error) {
+        console.log('Fetch error')
+    }
+}
+
+export async function JoinGame(amount, betColor) {
+
+   let betColorInt = 0;
+    if (betColor == "red") {
+        betColorInt = 0;
+    }
+    if (betColor == "green") {
+        betColorInt = 1;
+    }
+    if (betColor == "black") {
+        betColorInt = 2;
+    }
+
+    const data = {
+        UserCredentials: {
+            SearchToken: GetCookie("SearchToken"),
+            AUTHTOKEN: GetCookie("AUTHTOKEN")
+        },
+        bet: amount,
+        betColor: betColorInt
+    }
+
+    try {
+        const response = await fetch(`${BackendApiUrl}/GameDouble/JoinGame`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(data),
+            redirect: 'follow'
+        })
+
+        if (!response.ok) {
+            console.log('Fetch error:', response.status)
+        }
+
+        return await response.json()
+    }
+    catch (error) {
+        console.log('Fetch error')
+    }
+}
--- a/luckydiamond/src/assets/js/jackpot/JackpotLogic.js
+++ b/luckydiamond/src/assets/js/jackpot/JackpotLogic.js
@@ -85,3 +85,25 @@ export async function JoinJackpotGame(userData, amount) {
        console.log('Fetch error')
    }
 }
+
+export async function getJackpotHistoryGame () {
+    try {
+        const response = await fetch(`${BackendApiUrl}/GameJackpot/GetNewestJackpotGames`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            redirect: "follow"
+        })
+
+        if (!response.ok) {
+            console.log('Fetch error:', response.status)
+        }
+
+        console.log(response)
+        return await response.json()
+    }
+    catch (error) {
+        console.log('Fetch error')
+    }
+}
--- a/luckydiamond/src/components/AsidebarComponent.vue
+++ b/luckydiamond/src/components/AsidebarComponent.vue
@@ -9,7 +9,7 @@
          <!-- <div class="fotosloti"><a href="#"><img  src="../assets/icons-menu/slots-icon.svg" ></a></div> -->
          <a href="#" @click="$router.push({ name: 'jackpot' })"><img  class="menu__content--jackpot-icon" src="../assets/icons-menu/jackpot-icon.svg"></a>
          <a href="#" @click="$router.push({ name: 'crash' })"><img  class="menu__content--cruch-icon" src="../assets/icons-menu/crush-icon.svg"></a>
-          <a href="#"><img class="menu__content--chest-icon" src="../assets/icons-menu/case-icon.png"></a>
+          <a href="#" @click="$router.push({ name: 'double' })"><img  class="menu__content--chest-icon" src="../assets/icons-menu/duable-icons.svg"></a>
           <!-- <a href="#" @click="$router.push({ name: 'saper' })"><img  class="menu__content--bomb-icon" src="../assets/icons-menu/bomb-icon.svg"></a> -->
          <a href="#" @click="$router.push({ name: 'saper' })"><img  class="menu__content--bomb-icon" src="../assets/icons-menu/bomb-icon.svg"></a>
        </div>
--- a/luckydiamond/src/components/ChatComponent.vue
+++ b/luckydiamond/src/components/ChatComponent.vue
@@ -29,6 +29,8 @@
          </li>
        </transition-group>
      </ul>
+    
+    
    </div>
    <writechat-component @send="ClaimDatamsg"></writechat-component>
    <!-- <div class="chat__mute-button">
--- a/luckydiamond/src/components/DevelopComponent.vue
+++ b/luckydiamond/src/components/DevelopComponent.vue
@@ -106,25 +106,49 @@
        </div>
      
    </div>
+    <div class="Swino4ka_card">
+      <div class="Swino4ka_text_2">
+        <div class="Swino4ka_aboutinfo_2">
+          <p>Фронтэндер</p>
+          <h1>Swino4ka</h1>
+        </div>
+        <div class="Swino4ka_whatjob_1">
+          <img src="@/assets/icons-developcard/html.png" alt="html">
+          <p>HTML 5,CSS</p>
+        </div>
+        </div>
+        <div class="Swino4ka_skin_2">
+          <div class="Swino4ka_skin_2_skin">
+            
+            <div class="Swino4ka_skinicons1">
+            <a href="https://t.me/Swino4ka_pon" target="_blank" ><img src="@/assets/icons-developcard/telegram.png" alt=""></a>
+            <a href="https://discordapp.com/users/472393576010088449" target="_blank" ><img src="@/assets/icons-developcard/discord.png" alt=""></a>
+            <a href="https://github.com/swino4ka/" target="_blank" ><img src="@/assets/icons-developcard/github.png" alt=""></a>
+           
+            </div>
+          </div>
+        </div>
+      
+    </div>
  </div>
  <div class="bottom_card">
-    <div class="megatntmega_card">
-      <div class="megatntmega_text">
-        <div class="megatntmega_aboutinfo">
-          <p>Дизайнер</p>
-          <h1>megatntmega</h1>
+    <div class="GEDPOOL31_card">
+      <div class="GEDPOOL31_text">
+        <div class="GEDPOOL31_aboutinfo">
+          <p>Техническая поддержка</p>
+          <h1>GEDPOOL31</h1>
        </div>
-        <div class="megatntmega_whatjob">
-          <img src="@/assets/icons-developcard/Figma.png" alt="html">
-          <p>Designer</p>
+        <div class="GEDPOOL31_whatjob">
+          <img src="@/assets/icons-developcard/tech-support.svg" alt="html">
+          <p>Tech-Support</p>
        </div>
-        <div class="megatntmega_icons">
-          <a href="https://t.me/random_ak" target="_blank" ><img src="@/assets/icons-developcard/telegram.png" alt=""></a>
-          <a href="https://discordapp.com/users/531420425255911424" target="_blank" ><img src="@/assets/icons-developcard/discord.png" alt=""></a>
+        <div class="GEDPOOL31_icons">
+          <a href="https://t.me/GEDPOOL31" target="_blank" ><img src="@/assets/icons-developcard/telegram.png" alt=""></a>
+          <a href="https://discord.com/users/1044186204884701227" target="_blank" ><img src="@/assets/icons-developcard/discord.png" alt=""></a>
        </div>
      </div>
-      <div class="megatntmega_skin">
-        
+      <div class="GEDPOOL31_skin">
+        <img src="https://avatar.spworlds.ru/front/212/GEDPOOL31.png" alt="">
        </div>
    </div>
    <div class="busha888_card">
--- a/luckydiamond/src/main.js
+++ b/luckydiamond/src/main.js
@@ -11,7 +11,7 @@ const siteIsOff = false;

 import router from "@/router/router";
 import mitt from 'mitt'
-import { Mixins } from "@/mixins/mixin";
+import { Mixins } from "@/mixins/mixin";    
 import {
    ConnectToChat
 } from "@/assets/js/chat/ChatLogic.js";
@@ -22,6 +22,7 @@ export const eventBus = mitt()
 // const app = createApp(App)
 const app = createApp(siteIsOff ? SiteOff : App);

+
 if (!siteIsOff) {
    app.use(router);
    app.mixin(Mixins);
@@ -32,6 +33,20 @@ if (!siteIsOff) {
 // app.use(router)
 // app.mixin(Mixins)

+app.config.warnHandler = (msg) => {
+    // Intercept specific warning message and suppress it
+    if (msg.includes('Property or method "clickedBtn" is not defined on the instance but referenced during render.')) {
+      // You can simply return to ignore it, or even better, log it somewhere if you have a logging system
+      return;
+    }
+  
+    // Log or handle other warnings as you see fit
+  };
+
+app.use(router)
+app.mixin(Mixins)
+
+
 app.mount('#app')
 // app.provide(eventBus)

--- a/luckydiamond/src/pages/HomePage.vue
+++ b/luckydiamond/src/pages/HomePage.vue
@@ -79,15 +79,23 @@
          <div class="gamemode__twolines">
            <div class="gamemode__twoline--first__element bg-early">
              <ul>
-                <li v-for="mode in twolinefirstelementGameMode" :key="mode">
+                <li v-for="mode in twolinetwoelementGameMode" :key="mode.id">
                  <div :class="'linecontent-' + mode.id">
-                    <h3 class="title-twoline">скоро</h3>
+                    <h3 class="title-twoline">рулетка</h3>
                  </div>
                  <div class="container">
-                    <a href="#" class="cumming_soon_btn"
+                    <!-- <a href="#" class="line__btn">play <span class="line__btn--elm">></span></a> -->
+                     
+                    <a
+                      href="#"
+                      @click="$router.push({ name: 'double' })"
+                      class="line__btn--crash"
                      >play <span class="line__btn--elm"></span></a
                    >
-                    <img src="@/assets/icons-gamemodes/slots-icon.png" class="cumming_soon--img" />
+                 
+                    
+                    <img class="double--img" src="@/assets/icons-games/double-game/DoubleLogo.svg" />
+                 
                  </div>
                </li>
              </ul>
@@ -106,6 +114,7 @@
                      class="line__btn--crash"
                      >play <span class="line__btn--elm"></span></a
                    >
+                    
                    <img class="crash--img" src="@/assets/icons-gamemodes/crush-icon.svg" />
                  </div>
                </li>
--- a/luckydiamond/src/pages/JackopthistoryPage.vue
+++ b/luckydiamond/src/pages/JackopthistoryPage.vue
@@ -0,0 +1,70 @@
+t<template>
+  <div class="jackpot-history__content-grid">
+    <aside-bar-element/>
+
+    <chat-component/>
+
+    <header-element-page/>
+
+    <div class="jackpot-history">
+      <div class="jackpot-history__content">
+        <ul class="jackpot-history__element">
+          <li v-for="(game, index) in historyGame" :key="index">
+            <div class="abc">
+              <div class="jackpot-history__element">
+                <div class="element-info">
+                  <div class="element-info__icon">
+                    <img :src="`https://avatar.spworlds.ru/face/55/${game.winnerUserName}`">
+                  </div>
+                  <div class="element-info__user-info">
+                    <h2 class="username">{{ game.winnerUserName }}</h2>
+                    <h2 class="user-deposit">
+                      {{ game.winStake.toFixed(2) }}
+                      <span class="img-width"><img src="@/assets/icons-profile/icon-diamond-ore.png"></span>
+                    </h2>
+                  </div>
+                </div>
+                <div class="element-chance">
+                  <h2>
+                    Шанс <span class="chance-style">{{ game.winnerPercentage.toFixed(2) }}%</span>
+                  </h2>
+                </div>
+              </div>
+            </div>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { onMounted, reactive } from "vue";
+
+import ChatComponent from "@/components/ChatComponent.vue";
+import AsideBarElement from "@/components/AsidebarComponent.vue";
+import HeaderElementPage from "@/components/HeaderComponent.vue";
+
+import '@/assets/css/PagesStyles/jackpot-history.css'
+import {getJackpotHistoryGame} from "@/assets/js/jackpot/JackpotLogic";
+
+export default {
+  components: {HeaderElementPage, ChatComponent, AsideBarElement},
+  setup() {
+    let historyGame = reactive({})
+
+    onMounted(() => {
+      getJackpotHistoryGame()
+          .then(response => {
+            Object.assign(historyGame, response)
+          })
+    })
+
+    return { historyGame }
+  }
+}
+</script>
+
+<style>
+
+</style>
--- a/luckydiamond/src/pages/JackpothistoryPage.vue
+++ b/luckydiamond/src/pages/JackpothistoryPage.vue
@@ -0,0 +1,70 @@
+t<template>
+  <div class="jackpot-history__content-grid">
+    <aside-bar-element/>
+
+    <chat-component/>
+
+    <header-element-page/>
+
+    <div class="jackpot-history">
+      <div class="jackpot-history__content">
+        <ul class="jackpot-history__element">
+          <li v-for="(game, index) in historyGame" :key="index">
+            <div class="abc">
+              <div class="jackpot-history__element">
+                <div class="element-info">
+                  <div class="element-info__icon">
+                    <img :src="`https://avatar.spworlds.ru/face/55/${game.winnerUserName}`">
+                  </div>
+                  <div class="element-info__user-info">
+                    <h2 class="username">{{ game.winnerUserName }}</h2>
+                    <h2 class="user-deposit">
+                      {{ game.winStake.toFixed(2) }}
+                      <span class="img-width"><img src="@/assets/icons-profile/icon-diamond-ore.png"></span>
+                    </h2>
+                  </div>
+                </div>
+                <div class="element-chance">
+                  <h2>
+                    Шанс <span class="chance-style">{{ game.winnerPercentage.toFixed(2) }}%</span>
+                  </h2>
+                </div>
+              </div>
+            </div>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { onMounted, reactive } from "vue";
+
+import ChatComponent from "@/components/ChatComponent.vue";
+import AsideBarElement from "@/components/AsidebarComponent.vue";
+import HeaderElementPage from "@/components/HeaderComponent.vue";
+
+import '@/assets/css/PagesStyles/jackpot-history.css'
+import {getJackpotHistoryGame} from "@/assets/js/jackpot/JackpotLogic";
+
+export default {
+  components: {HeaderElementPage, ChatComponent, AsideBarElement},
+  setup() {
+    let historyGame = reactive({})
+
+    onMounted(() => {
+      getJackpotHistoryGame()
+          .then(response => {
+            Object.assign(historyGame, response)
+          })
+    })
+
+    return { historyGame }
+  }
+}
+</script>
+
+<style>
+
+</style>
--- a/luckydiamond/src/pages/SettingsPage.vue
+++ b/luckydiamond/src/pages/SettingsPage.vue
@@ -12,19 +12,32 @@
    <button id="volume-down" @click="volumeDown">-</button>
  </div>
     -->
-      <div class="volume-section">
-        <h1 class="volume-text">Звук</h1>
-        <input
-          id="volumeControl"
-          type="range"
-          min="0"
-          max="10"
-          v-model="volume"
-          @input="handleVolumeChange"
-          ref="volumeControl"
-        />
-        <h1 class="volume-text--grey">Данная страница находится в разработке, и будет полностью переделанна</h1>
+      <div class="classssboxxxx">
+        <div class="volume-section">
+          <h1 class="volume-text">Звук</h1>
+          <input
+            id="volumeControl"
+            type="range"
+            min="0"
+            max="10"
+            v-model="volume"
+            @input="handleVolumeChange"
+            ref="volumeControl"
+          />
+        </div>

+        <!-- 3/23/2024 DT I turned off the chat off button because it wasn't working and wasn't displaying correctly on the frontend  -->
+        <!-- <div class="buttonbox">
+        <input type="checkbox"
+               id="switch"
+               class="checkbox" />
+                
+        <label for="switch"
+               class="toggle">
+            
+        </label>
+        <p>скрыть чат</p>
+      </div> -->
      </div>
    </section>
  </div>
--- a/luckydiamond/src/pages/games-pages/CrashgamePage.vue
+++ b/luckydiamond/src/pages/games-pages/CrashgamePage.vue
@@ -11,7 +11,16 @@
      <section class="crash-game">
        <div class="crash-game__content">
          <div class="crash-game__start-window">
-            <h2 class="crash__game-name">Краш</h2>
+            <div class="classMenegerCrash">
+              <h2 class="crash__game-name">Краш</h2>
+              <div class="classNoMenegerCrash">
+              <a href="https://docs.google.com/document/d/13jJx5IC0AC8pOpbSG5CU1i9tIQof0Vb0IUFzcR0aKcE" target="_blank">
+                <img src="@/assets/icons-games/double-game/info.svg" alt="" />
+             </a>
+            </div>
+              
+            </div>
+           
            <p>Жди момента и забирай выигрыш</p>
            <div class="crash-game-window__inputs">
              <div class="crash-deposit">
--- a/luckydiamond/src/pages/games-pages/DoublePage.vue
+++ b/luckydiamond/src/pages/games-pages/DoublePage.vue
@@ -0,0 +1,715 @@
+<template>
+  <div class="content-grid--double">
+    <aside-bar-component></aside-bar-component>
+    <chat-component></chat-component>
+    <header-component></header-component>
+    <div class="bg-gradient-left"></div>
+    <section class="double">
+      <div class="double-start">
+        <div
+          class="jackpot-start__content title-saper padding-elements-jackpot"
+        >
+          
+          <div class="classMenegerDouble">
+            <h2>Рулетка</h2>
+            <div class="classNoMenegerDouble">
+            <a href="https://docs.google.com/document/d/1oeL3kHp_5Mjcgsb2i87yMgjjNO2HdUa0_5TK1mJk9S0" target="_blank">
+              <img src="@/assets/icons-games/double-game/info.svg" alt="" />
+           </a>
+          </div>
+            
+          </div>
+          <p>Крути, ставь, побеждай!</p>
+          <div class="saper-start__choises diamonds diamonds-input__margin">
+            <h3>Цвет победной ячейки</h3>
+            <button
+              class="bet-button red"
+              :class="{ active: activeButton === 'red' }"
+              @click="handleClick('red')"
+            >
+              x2
+            </button>
+            <button
+              class="bet-button green"
+              :class="{ active: activeButton === 'green' }"
+              @click="handleClick('green')"
+            >
+              x20
+            </button>
+            <button
+              class="bet-button black"
+              :class="{ active: activeButton === 'black' }"
+              @click="handleClick('black')"
+            >
+              x2
+            </button>
+
+            <div class="diamonds__choises">
+              <img
+                class="diamond-icon"
+                src="@/assets/icons-games/saper-game/icon-diamond-ore-saper.png"
+              />
+              <input
+                v-model="amountDeposit"
+                type="number"
+                id="diamonds-input"
+              />
+              <div class="diamonds__btns btn-style__diamonds">
+                <ul class="diamonds-btns__display">
+                  <li v-for="(item, index) in JackpotNumbers" :key="index">
+                    <button
+                      @click="clickedBtnChoice(index, item.diamonds)"
+                      :class="{
+                        'btn-click': clickedBtn === index,
+                        [index]: clickedBtn === index,
+                      }"
+                      :id="item.diamonds === 'max' ? 'max-button' : null"
+                      v-if="item.diamonds !== undefined"
+                    >
+                      {{ item.diamonds }}
+                    </button>
+                  </li>
+                </ul>
+              </div>
+            </div>
+          </div>
+          <div class="jackpot-start__btns">
+            <div class="error-block" v-if="ErrorClick">
+              <h2>Ошибка при заполнении</h2>
+            </div>
+            <button
+              class="btn-start"
+              :class="{ 'animate-start-btn': ErrorClick }"
+              @click="clickPlayBtn"
+            >
+              Начать игру
+            </button>
+            <!-- <button class="btn-claim" v-if="winningAmount === 0">Забрать {{ winningAmount }} АР</button>
+                  <button class="btn-claim" @click="claimWinningAmount()" v-else>Забрать {{ winningAmount.toFixed(2) }} АР</button> -->
+          </div>
+        </div>
+      </div>
+      <!-- </div> -->
+      <div class="double-game">
+        <div class="bootstrap-wrapper">
+          <div class="container">
+            <div class="row">
+              <div class="col-md-12 double-game-main-box">
+                <div class="double-carousel">
+                  <div class="double-carousel-arrow" id="arrow">▲</div>
+                  <div class="double-carousel-arrow-upper" id="arrow-upper">▲</div>
+                  <Carousel
+                    ref="carousel"
+                    :wrapAround="true"
+                    :autoplay="autoPlay"
+                    class="no-pointer-events"
+                    :transition="150"
+                    :itemsToShow="10"
+                    @slide-start="handleStepCarousel"
+                  >
+                    <Slide v-for="(slide, index) in slides" :key="index">
+                      <div>
+                        <img
+                          :src="slide.img"
+                          onerror="this.onerror=null;this.src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';"
+                        />
+                      </div>
+                    </Slide>
+                  </Carousel>
+                </div>
+              </div>
+              <div class="col-md-12 double-game-history-main-box">
+                <div class="container-double-history-text">
+                  <span class="double-history-text">история</span>
+                </div>
+
+                <div class="double--history-carousel">
+                  <Carousel
+                    ref="carouselHistory"
+                    class="no-pointer-events"
+                    :transition="150"
+                    :itemsToShow="24"
+                  >
+                    <Slide v-for="(slide, index) in slidesHistory" :key="index">
+                      <div>
+                        <img
+                          :src="slide.img"
+                          onerror="this.onerror=null;this.src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';"
+                        />
+                      </div>
+                    </Slide>
+                  </Carousel>
+                </div>
+              </div>
+              <div class="col-md-4" style="padding-left: 0px">
+                <div class="double-members-ingame-red">
+                  <div class="double-members-flex-container">
+                    <div class="double-red-box">RED X2</div>
+                    <div class="double-user-icon">
+                      <span class="double-user-icon-span"></span>
+                      <span class="double-number-color">{{
+                        numberUserCountRed
+                      }}</span>
+                    </div>
+                  </div>
+
+                  <div
+                    v-for="user in usersRed"
+                    :key="user.name"
+                    class="double-ui-component"
+                    :id="`user-${user.name}`"
+                  >
+                    <img :src="user.image" alt="User" width="40" height="40" />
+
+                    <div class="double-username">{{ user.name }}</div>
+
+                    <div class="double-score">
+                      {{ user.amount }}
+
+                      <img
+                        class="double-img-user"
+                        src="@/assets/icons-header/diamond-ore-icon.png"
+                      />
+                    </div>
+                  </div>
+                  <!-- </div> -->
+                </div>
+              </div>
+              <div class="col-md-4" style="padding-left: 0px">
+                <div class="double-members-ingame-green">
+                  <div class="double-members-flex-container">
+                    <div class="double-green-box">GREEN X20</div>
+                    <div class="double-user-icon">
+                      <span class="double-user-icon-span"></span>
+                      <span class="double-number-color">{{
+                        numberUserCountGreen
+                      }}</span>
+                    </div>
+                  </div>
+                  <div
+                    v-for="user in usersGreen"
+                    :key="user.name"
+                    class="double-ui-component"
+                    :id="`user-${user.name}`"
+                  >
+                    <img :src="user.image" alt="User" width="40" height="40" />
+
+                    <div class="double-username">{{ user.name }}</div>
+
+                    <div class="double-score">
+                      {{ user.amount }}
+
+                      <img
+                        class="double-img-user"
+                        src="@/assets/icons-header/diamond-ore-icon.png"
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="col-md-4"
+                style="padding-left: 0px; padding-right: 0px"
+              >
+                <div class="double-members-ingame-black">
+                  <div class="double-members-flex-container">
+                    <div class="double-white-box">BLACK X2</div>
+                    <div class="double-user-icon">
+                      <span class="double-user-icon-span"></span>
+                      <span class="double-number-color">{{
+                        numberUserCountBlack
+                      }}</span>
+                    </div>
+                  </div>
+                  <div
+                    v-for="user in usersBlack"
+                    :key="user.name"
+                    class="double-ui-component"
+                    :id="`user-${user.name}`"
+                  >
+                    <img :src="user.image" alt="User" width="40" height="40" />
+
+                    <div class="double-username">{{ user.name }}</div>
+
+                    <div class="double-score">
+                      {{ user.amount }}
+
+                      <img
+                        class="double-img-user"
+                        src="@/assets/icons-header/diamond-ore-icon.png"
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+</template>
+<script>
+import { reactive, ref, onMounted } from "vue";
+
+import AsideBarComponent from "@/components/AsidebarComponent.vue";
+import HeaderComponent from "@/components/HeaderComponent.vue";
+import ChatComponent from "@/components/ChatComponent.vue";
+import JackpotNumbers from "@/mocks/JackpotNumbers";
+import {
+  GetNewestDoubleGames,
+  JoinGame,
+} from "@/assets/js/games/double/DoubleApi";
+import { GetCurrentMoney } from "@/assets/js/rest/RestMethods";
+import { GetCookie } from "@/assets/js/storage/CookieStorage";
+import { Carousel, Slide } from "vue3-carousel";
+import "vue3-carousel/dist/carousel.css";
+
+import "@/assets/css/PagesStyles/games-pages/jackpot.css";
+import "@/assets/css/PagesStyles/games-pages/double.css";
+import "@/assets/css/global.css";
+import { eventBus } from "@/main";
+import { useVuelidate } from "@vuelidate/core";
+import {
+  maxValue,
+  minValue,
+  required,
+  numeric,
+  integer,
+} from "@vuelidate/validators";
+
+export default {
+  components: {
+    HeaderComponent,
+    AsideBarComponent,
+    ChatComponent,
+    Carousel,
+    Slide,
+  },
+  data() {
+    return {
+      JackpotNumbers,
+      clickedColor: "",
+      amountDeposit: 0,
+      activeButton: null,
+    };
+  },
+  methods: {
+    async clickedBtnChoice(index, content) {
+      this.clickedBtn = index;
+      if (content === "max") {
+        await GetCurrentMoney(
+          GetCookie("AUTHTOKEN"),
+          GetCookie("SearchToken")
+        ).then((response) => {
+          const responseBalance = response.currentMoney;
+
+          if (responseBalance === this.balance) {
+            this.amountDeposit = parseInt(responseBalance);
+          }
+        });
+      } else {
+        this.amountDeposit = content;
+      }
+    },
+    async handleClick(color) {
+      this.clickedColor = color;
+      this.activeButton = color;
+    },
+    async clickPlayBtn() {
+      this.v$.$touch();
+      this.offBtn = true;
+
+      if (
+        this.balance < this.amountDeposit ||
+        !Number.isInteger(Number(this.amountDeposit))
+      ) {
+        this.textError = "Некорректное значение. Введите целое число.";
+        this.offBtn = false;
+      }
+
+      await JoinGame(this.amountDeposit, this.clickedColor).then((response) => {
+        if (
+          response === `You can't join to started or ended game` ||
+          response === "Player alredy in the game."
+        ) {
+          this.offBtn = false;
+
+          if (response === `You can't join to started or ended game`) {
+            this.textError = "Игра уже началась или только закончилась!";
+          } else if (response === "Player alredy in the game.") {
+            this.textError = "Вы уже в игре!";
+          }
+
+          return;
+        }
+
+        if (!response.ok) {
+          this.textError = "Пожалуйста подождите";
+        }
+      });
+      this.offBtn = false;
+    },
+  },
+  validations() {
+    return {
+      amountDeposit: {
+        required,
+        numeric,
+        minValue: minValue(1),
+        maxValue: maxValue(this.balance),
+        integer,
+      },
+    };
+  },
+  async created() {},
+
+  setup() {
+    const v$ = useVuelidate();
+
+    const usersRed = ref([]);
+
+    const usersGreen = ref([]);
+
+    const usersBlack = ref([]);
+
+    const numberUserCountRed = ref(0);
+
+    const numberUserCountGreen = ref(0);
+
+    const numberUserCountBlack = ref(0);
+
+    const slides = reactive([
+      {
+        img: require("@/assets/icons-games/double-game/RectangleGreenDouble.png"),
+        target: "Green",
+      },
+      {
+        img: require("@/assets/icons-games/double-game/RectangleRedDouble.png"),
+        target: "Red",
+      },
+      {
+        img: require("@/assets/icons-games/double-game/RectangleBlackDouble.png"),
+        target: "Black",
+      },
+      {
+        img: require("@/assets/icons-games/double-game/RectangleRedDouble.png"),
+        target: "Red",
+      },
+      {
+        img: require("@/assets/icons-games/double-game/RectangleBlackDouble.png"),
+        target: "Black",
+      },
+      {
+        img: require("@/assets/icons-games/double-game/RectangleGreenDouble.png"),
+        target: "Green",
+      },
+      {
+        img: require("@/assets/icons-games/double-game/RectangleBlackDouble.png"),
+        target: "Black",
+      },
+      {
+        img: require("@/assets/icons-games/double-game/RectangleRedDouble.png"),
+        target: "Red",
+      },
+      {
+        img: require("@/assets/icons-games/double-game/RectangleBlackDouble.png"),
+        target: "Black",
+      },
+      {
+        img: require("@/assets/icons-games/double-game/RectangleRedDouble.png"),
+        target: "Red",
+      },
+    ]);
+
+    const slidesHistory = reactive([]);
+
+    let doubleData = reactive({});
+
+    let autoPlay = ref(0);
+    let targetColor = ref("");
+    let timeToGame = ref(0);
+    let endGame = ref(false);
+
+    onMounted(() => {
+      loadGameHistory();
+
+      // usersRed.value = fetchUsersRed();
+
+      eventBus.on("doubleGame", (dataDouble) => {
+        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);
+        }
+        if (endGame.value != true) {
+          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,
+              dataDoubleParse.WInColor
+            );
+          }
+        }
+      });
+    });
+    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) => {
+        if (user.BetColor == winColor) {
+          setTimeout(() => {
+            addGradientClassToUser(user);
+          }, 2000);
+        }
+      });
+    }
+
+    function addGradientClassToUser(user) {
+      const element = document.getElementById("user-" + user.UserName);
+
+      if (element) {
+        element.classList.add("double-ui-component-gradient");
+      }
+    }
+
+    function addUserIfNotExist(usersArray, newUser, BetColor) {
+      const userExists = usersArray.some((user) => user.name === newUser.name);
+
+      if (!userExists) {
+        if (BetColor == "Red") {
+          numberUserCountRed.value += 1;
+        }
+        if (BetColor == "Green") {
+          numberUserCountGreen.value += 1;
+        }
+        if (BetColor == "Black") {
+          numberUserCountBlack.value += 1;
+        }
+        usersArray.push(newUser);
+      }
+    }
+
+    function handleStepCarousel(data) {
+      try {
+        if (endGame.value == true) {
+          let { currentSlideIndex } = data;
+          if (
+            slides[currentSlideIndex + 1].target == targetColor.value &&
+            endGame.value == true
+          ) {
+            stopAutoPlay();
+
+            setTimeout(() => {
+              setTimeout(() => {
+                if (
+                  usersRed.value.length > 0 ||
+                  usersBlack.value.length > 0 ||
+                  usersGreen.value.length > 0
+                ) {
+                  usersRed.value = [];
+                  usersGreen.value = [];
+                  usersBlack.value = [];
+                }
+              }, 4000);
+
+              loadGameHistory();
+            }, 2000);
+          }
+        }
+      } catch (error) {
+        void error;
+      }
+    }
+
+    function processUsersInGame(users) {
+      users.forEach((user) => {
+        if (user.BetColor == "Red") {
+          const newUser = {
+            name: user.UserName,
+            image:
+              "https://avatar.spworlds.ru/face/55/" + user.UserName + ".png",
+            amount: user.Bet,
+            hasGradient: false,
+          };
+
+          addUserIfNotExist(usersRed.value, newUser, "Red");
+        }
+        if (user.BetColor == "Green") {
+          const newUser = {
+            name: user.UserName,
+            image:
+              "https://avatar.spworlds.ru/face/55/" + user.UserName + ".png",
+            amount: user.Bet,
+            hasGradient: false,
+          };
+
+          addUserIfNotExist(usersGreen.value, newUser, "Green");
+        }
+        if (user.BetColor == "Black") {
+          const newUser = {
+            name: user.UserName,
+            image:
+              "https://avatar.spworlds.ru/face/55/" + user.UserName + ".png",
+            amount: user.Bet,
+            hasGradient: false,
+          };
+
+          addUserIfNotExist(usersBlack.value, newUser, "Black");
+        }
+      });
+    }
+
+    async function loadGameHistory() {
+      try {
+        await GetNewestDoubleGames()
+          .then((response) => {
+            return response.json();
+          })
+          .then((data) => {
+            slidesHistory.value = [];
+            slidesHistory.length = 0;
+            for (let i = 0; i < 25; i++) {
+              // doubleData = Object.assign(doubleData, dataDoubleParse);
+
+              // timeToGame.value = doubleData.WaitingTime;
+              if (data[i].winColor == "Red") {
+                slidesHistory.push({
+                  img: require("@/assets/icons-games/double-game/HistoryRectangleRedDouble.png"),
+                  target: "Red",
+                });
+              }
+              if (data[i].winColor == "Black") {
+                slidesHistory.push({
+                  img: require("@/assets/icons-games/double-game/HistoryRectangleBlackDouble.png"),
+                  target: "Black",
+                });
+              }
+              if (data[i].winColor == "Green") {
+                slidesHistory.push({
+                  img: require("@/assets/icons-games/double-game/HistoryRectangleGreenDouble.png"),
+                  target: "Green",
+                });
+              }
+            }
+
+            console.log(data);
+          })
+          .catch((error) => {
+            void error;
+          });
+      } catch (error) {
+        void error;
+      }
+    }
+
+    function stopAutoPlay() {
+      autoPlay.value = 0;
+      endGame.value = false;
+      targetColor.value = "";
+    }
+
+    return {
+      slides,
+      slidesHistory,
+      autoPlay,
+      doubleData,
+      targetColor,
+      timeToGame,
+      handleStepCarousel,
+      stopAutoPlay,
+      usersRed,
+      usersBlack,
+      usersGreen,
+      v$,
+    };
+  },
+};
+</script>
+
+<style scoped>
+.carousel__slide {
+  padding: 1px;
+}
+.classMenegerDouble {
+  display: flex;
+ 
+ flex-direction: row;
+}
+.classNoMenegerDouble {
+  margin-left: 1vh;
+  margin-top: 2.4vh;
+}
+
+.carousel__viewport {
+  perspective: 2000px;
+}
+
+.carousel__track {
+  transform-style: preserve-3d;
+}
+
+.carousel__slide--sliding {
+  transition: 0.5s;
+}
+
+.carousel__slide {
+  opacity: 0.9;
+  transform: rotateY(-20deg) scale(0.9);
+}
+
+.carousel__slide--active ~ .carousel__slide {
+  transform: rotateY(20deg) scale(0.9);
+}
+
+.carousel__slide--prev {
+  opacity: 1;
+  transform: rotateY(-10deg) scale(0.95);
+}
+
+.carousel__slide--next {
+  opacity: 1;
+  transform: rotateY(10deg) scale(0.95);
+}
+
+.carousel__slide--active {
+  opacity: 1;
+  transform: rotateY(0) scale(1.1);
+}
+.double--history-carousel {
+  opacity: 1 !important;
+  transform: rotateY(0) scale(1) !important;
+}
+.double--history-carousel .carousel__slide--active ~ .carousel__slide,
+.double--history-carousel .carousel__slide--prev,
+.double--history-carousel .carousel__slide--next,
+.double--history-carousel .carousel__slide--active {
+  opacity: 1;
+  transform: rotateY(0) scale(1);
+}
+</style>
--- a/luckydiamond/src/pages/games-pages/JackpotPage.vue
+++ b/luckydiamond/src/pages/games-pages/JackpotPage.vue
@@ -43,8 +43,17 @@
        <div
          class="jackpot-start__content title-saper padding-elements-jackpot"
        >
+        <div class="classMeneger">
          <h2>Джекпот</h2>
+          <div class="classNoMeneger">
+          <a href="https://docs.google.com/document/d/1kW8bPmIZPrjK9EtKo6xsPLv989uOkgUn4wFk_uYOCUI/edit?usp=sharing" target="_blank">
+            <img src="@/assets/icons-games/double-game/info.svg" alt="" />
+         </a>
+        </div>
+          
+        </div>
          <p>Больше ставь, больше побеждай!</p>
+          

          <div class="saper-start__choises diamonds diamonds-input__margin">
            <h3>Сумма депозита</h3>
--- a/luckydiamond/src/pages/games-pages/SapergamePage.vue
+++ b/luckydiamond/src/pages/games-pages/SapergamePage.vue
@@ -11,7 +11,16 @@
      <div class="bg-two"></div>
      <div class="saper-start" :class="{ 'game-start__menu-off' : gameStart }">
        <div class="saper-start__content title-saper padding-elements">
-          <h2>Сапёр</h2>
+          <div class="classMenegerSaper">
+            <h2>Сапёр</h2>
+            <div class="classNoMenegerSaper">
+            <a href="https://docs.google.com/document/d/1aoN7tqLxWxOBJ-NXUs4GHK8Nl2n2Q-Kw6JHzmujku6A" target="_blank">
+              <img src="@/assets/icons-games/double-game/info.svg" alt="" />
+           </a>
+          </div>
+            
+          </div>
+          
          <p>Находи изумруды на поле и избегай кристалы</p>
          <div class="saper-start__choises crystals">
            <h3>Количество кристалов</h3>
--- a/luckydiamond/src/router/router.js
+++ b/luckydiamond/src/router/router.js
@@ -6,6 +6,8 @@ import SapergamePage from "@/pages/games-pages/SapergamePage.vue";
 import SettingsPage from "@/pages/SettingsPage.vue";
 import CrashGamePage from "@/pages/games-pages/CrashgamePage.vue";
 import JackpotPage from "@/pages/games-pages/JackpotPage.vue";
+import JackopthistoryPage from "@/pages/JackopthistoryPage.vue";
+import DoublePage from "@/pages/games-pages/DoublePage.vue";
 import AboutPage from "@/pages/AboutPage.vue";
 import HelpPage from "@/pages/HelpPage.vue" ;

@@ -17,6 +19,8 @@ export default createRouter({
        { path: '/game/saper', component: SapergamePage, name: 'saper' },
        { path: '/game/crash', component: CrashGamePage, name: 'crash' },
        { path: '/game/jackpot', component: JackpotPage, name: 'jackpot' },
+        { path: '/game/jackpot/history', component: JackopthistoryPage, name: 'jackpot-history' },
+        { path: '/game/double', component: DoublePage, name: 'double' },
        { path: '/settings', component: SettingsPage, name: 'settings' },
        { path: '/about', component: AboutPage, name: 'about' },
        { path: '/help', component: HelpPage, name: 'help' },