wip: test
This commit is contained in:
@@ -56,47 +56,48 @@
|
||||
}
|
||||
|
||||
.turntable {
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
border: 1px solid #a6a6a6;
|
||||
border-radius: 50%;
|
||||
margin: 50px auto;
|
||||
position: relative;
|
||||
// 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,
|
||||
// &::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%);
|
||||
}
|
||||
// &::before {
|
||||
// width: 2px;
|
||||
// height: 100%;
|
||||
// left: 50%;
|
||||
// top: 0;
|
||||
// transform: translateX(-50%);
|
||||
// }
|
||||
|
||||
&::after {
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
// &::after {
|
||||
// width: 100%;
|
||||
// height: 2px;
|
||||
// left: 0;
|
||||
// top: 50%;
|
||||
// transform: translateY(-50%);
|
||||
// }
|
||||
|
||||
.num-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
// flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
padding: 50px;
|
||||
// padding: 50px;
|
||||
position: relative;
|
||||
|
||||
.item {
|
||||
width: 200px;
|
||||
@@ -104,9 +105,14 @@
|
||||
text-align: center;
|
||||
line-height: 200px;
|
||||
font-size: 80px;
|
||||
// background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
.icon {
|
||||
position: absolute;
|
||||
top: 20%;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -27,11 +27,12 @@
|
||||
:key="index"
|
||||
:style="{
|
||||
color: item.active ? '#ff0000' : '#000',
|
||||
backgroundImage: `url(${item.optActive ? require('../../../static/dz.png') : 'none'})`,
|
||||
}"
|
||||
@click="handleClick(item)"
|
||||
>
|
||||
<text>{{ item.value }}</text>
|
||||
<image v-show="item.optActive" class="icon" src="../../../static/dz.png" />
|
||||
<!-- <image class="icon" v-show="item.optActive" src="../../../static/dz.png" /> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
Reference in New Issue
Block a user