mirror of
https://github.com/yawaflua/LuckyDiamond.git
synced 2025-12-15 17:56:29 +02:00
Merge branch 'DevelopMadara'
This commit is contained in:
307
luckydiamond/src/assets/css/PagesStyles/games-pages/double.css
Normal file
307
luckydiamond/src/assets/css/PagesStyles/games-pages/double.css
Normal file
@@ -0,0 +1,307 @@
|
||||
.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-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;
|
||||
}
|
||||
@@ -47,17 +47,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;
|
||||
|
||||
@@ -150,7 +150,8 @@
|
||||
#diamonds-input {
|
||||
/* width: 347px;
|
||||
height: 38px; */
|
||||
width: 37vh;
|
||||
/* width: 37vh; */
|
||||
width: 36vh;
|
||||
height: 4vh;
|
||||
}
|
||||
|
||||
|
||||
@@ -97,7 +97,7 @@
|
||||
|
||||
.bg-early{
|
||||
border-radius: 40px;
|
||||
background: #969B9E;
|
||||
background: #EF4444;
|
||||
box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
@@ -357,7 +357,7 @@
|
||||
.gamemode__twoline--first__element {
|
||||
width: 100%;
|
||||
margin: 2% 3.6% 0 5.5%;
|
||||
min-height: 180px;
|
||||
min-height: 209px;
|
||||
}
|
||||
|
||||
.linecontent-3 {
|
||||
@@ -370,23 +370,13 @@
|
||||
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%;
|
||||
@@ -406,6 +396,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 +435,7 @@
|
||||
}
|
||||
|
||||
.title-twoline {
|
||||
font-size: 60px;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.line__img__jackpot {
|
||||
@@ -472,11 +477,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;
|
||||
@@ -506,7 +507,7 @@
|
||||
}
|
||||
|
||||
.title-twoline {
|
||||
font-size: 40px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.line__img__jackpot {
|
||||
@@ -549,11 +550,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 +572,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;
|
||||
}
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
Reference in New Issue
Block a user