wip: test

This commit is contained in:
2023-12-30 21:12:28 +08:00
parent 6ef544992b
commit 5eab7111cb
4 changed files with 173 additions and 100 deletions

View File

@@ -1,5 +1,7 @@
.taro_page {
background-color: #fff !important;
// background-color: #fff !important;
background-image: url('../static/bj.png');
background-size: 100% 100%;
}
.container {
@@ -11,13 +13,14 @@
display: flex;
justify-content: space-between;
align-items: center;
color: #fff;
.right {
display: flex;
.btn {
padding: 5px 10px;
border: 1px solid #a6a6a6;
border: 1px solid #fff;
border-radius: 10px;
&:active {
@@ -35,10 +38,10 @@
justify-content: space-between;
align-items: center;
margin-top: 40px;
border: 1px solid #a6a6a6;
padding: 20px 50px;
background-color: #f4f4f4;
border-radius: 15px;
padding: 20px;
background-color: #ff0606;
color: #fff;
border-radius: 26px;
.left {
display: flex;
@@ -53,84 +56,111 @@
}
}
}
.right {
width: 200px;
height: 80px;
background-color: rgba(255, 255, 255, 0.4);
border-radius: 40px;
text-align: center;
line-height: 80px;
font-size: 40px;
display: flex;
align-items: center;
justify-content: space-around;
.image {
width: 50px;
height: 50px;
background-image: url('../../../static/dz.png');
background-size: 100% 100%;
}
}
.game_btn {
padding: 10px;
background: linear-gradient(0deg, #ff9600, #feec89);
border-radius: 34px;
color: #ff0606;
font-weight: bold;
text-align: center;
}
}
.turntable {
// width: 500px;
// height: 500px;
// border: 1px solid #a6a6a6;
// border-radius: 50%;
margin: 30px auto;
// position: relative;
// &::before,
// &::after {
// content: '';
// position: absolute;
// width: 100%;
// height: 100%;
// border-radius: 50%;
// background-color: #a6a6a6;
// }
// &::before {
// width: 2px;
// height: 100%;
// left: 50%;
// top: 0;
// transform: translateX(-50%);
// }
// &::after {
// width: 100%;
// height: 2px;
// left: 0;
// top: 50%;
// transform: translateY(-50%);
// }
background-image: url('../static/zpbj.png');
background-size: 100% 100%;
position: relative;
.num-box {
display: flex;
// flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
position: relative;
// padding: 50px;
position: relative;
padding: 80px;
margin: auto;
.item {
width: 200px;
height: 200px;
height: 240px;
text-align: center;
line-height: 200px;
line-height: 240px;
font-size: 80px;
// background-size: cover;
background-repeat: no-repeat;
.icon {
position: absolute;
top: 20%;
width: 70px;
height: 70px;
}
font-weight: bold;
border: 5px solid #833e16;
}
.item:nth-child(1) {
width: 48%;
// height: 240px;
border-radius: 100px 30px 30px 30px;
}
.item:nth-child(2) {
width: 48%;
// height: 240px;
border-radius: 30px 100px 30px 30px;
}
.item:nth-child(3) {
flex: 1;
// height: 240px;
border-radius: 30px 30px 100px 100px;
}
}
.bet-btn {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 170px;
height: 170px;
background: #fbdd36;
border: 5px solid #b72100;
border-radius: 57px;
color: #ff0606;
font-size: 60px;
font-weight: bold;
text-align: center;
line-height: 1.4;
}
}
.kj-box {
background-color: #ff0606;
border-radius: 26px;
padding: 20px 30px;
margin-top: 20px;
color: #fff;
.title {
font-size: 35px;
font-weight: bold;
.num {
color: red;
color: #fbdd36;
}
}
.title-sub {
text-align: center;
margin-top: 20px;
margin-top: 10px;
font-size: 40px;
display: flex;
@@ -143,16 +173,12 @@
.item:nth-child(1) {
font-weight: bold;
color: red;
color: #fbdd36;
}
.item:nth-child(2) {
font-weight: bold;
color: red;
color: #fbdd36;
}
// .item:nth-child(3) {
// font-weight: bold;
// color: red;
// }
}
}
@@ -160,12 +186,14 @@
margin: 30px auto;
width: 100%;
height: 100px;
background-color: #ff0000;
background-color: #fbdd36;
text-align: center;
line-height: 100px;
border-radius: 15px;
color: #fff;
border-radius: 38px;
border: #ff0606 5px solid;
color: #ff0606;
font-size: 40px;
font-weight: bold;
}
.bet-opt {
@@ -176,19 +204,12 @@
.item {
width: 200px;
height: 100px;
border: 1px solid #ff0000;
border-radius: 10px;
// border: 1px solid #ff0000;
border-radius: 26px;
margin-bottom: 20px;
text-align: center;
line-height: 100px;
color: #843e16;
}
}
.rule-box {
color: #ff0000;
font-size: 35px;
font-weight: bold;
margin-top: 20px;
text-align: center;
}
}