moliparty/peko-h5
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增卡牌数字

Browse Source
This commit is contained in:
Dragon
2023-12-11 19:16:12 +08:00
parent b9a031ca48
commit dcd37e0628
3 changed files with 65 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
view/peko/modules/luckyTarot/css/index.css
View File

@@ -226,21 +226,36 @@ body {
z-index: 3;
}
.tarotBox .cardBox span {
text-align: center;
font-size: 0.34667rem;
font-weight: 600;
position: absolute;
left: 0.3rem;
top: 0.3rem;
}
.tarotBox .card1 {
background: url(../images/card.png) no-repeat;
background-size: 100% 100%;
color: #64CCF3;
text-shadow: #000 0.01333rem 0.01333rem 0.01333rem;
}
.tarotBox .card2 {
background: url(../images/card2.png) no-repeat;
background-size: 100% 100%;
display: none;
color: #DC8FF0;
text-shadow: #000 0.01333rem 0.01333rem 0.01333rem;
}
.tarotBox .card3 {
background: url(../images/card3.png) no-repeat;
background-size: 100% 100%;
display: none;
color: #FFEB3B;
text-shadow: #000 0.01333rem 0.01333rem 0.01333rem;
}
.tarotBox .card1_active {

22
view/peko/modules/luckyTarot/css/index.scss
View File

@@ -1,5 +1,5 @@
@function px2rem($px, $rem:75) {
@return $px / $rem+rem;
@function px2rem($px) {
@return $px / 75+rem;
}
html {}
@@ -228,14 +228,28 @@ body {
.cardBox {
width: px2rem(148);
height: px2rem(241);
// line-height: px2rem(241);
position: absolute;
z-index: 3;
// transition: all 1s;
span {
text-align: center;
font-size: px2rem(26);
font-weight: 600;
position: absolute;
// left: px2rem(13);
// top: px2rem(10);
left: 0.3rem;
top: 0.3rem;
}
}
.card1 {
background: url(../images/card.png) no-repeat;
background-size: 100% 100%;
color: #64CCF3;
text-shadow:#000 px2rem(1) px2rem(1) px2rem(1);
}
@@ -243,6 +257,8 @@ body {
background: url(../images/card2.png) no-repeat;
background-size: 100% 100%;
display: none;
color: #DC8FF0;
text-shadow:#000 px2rem(1) px2rem(1) px2rem(1);
}
@@ -250,6 +266,8 @@ body {
background: url(../images/card3.png) no-repeat;
background-size: 100% 100%;
display: none;
color: #FFEB3B;
text-shadow:#000 px2rem(1) px2rem(1) px2rem(1);
}
.card1_active {

60
view/peko/modules/luckyTarot/index.html
View File

@@ -47,38 +47,38 @@
<img src="./images/add.png" alt="" class="add">
</div>
<!-- 默認卡片 -->
<div class="cardBox cardBox0 card1"></div>
<div class="cardBox cardBox1 card1"></div>
<div class="cardBox cardBox2 card1"></div>
<div class="cardBox cardBox3 card1"></div>
<div class="cardBox cardBox4 card1"></div>
<div class="cardBox cardBox5 card1"></div>
<div class="cardBox cardBox6 card1"></div>
<div class="cardBox cardBox7 card1"></div>
<div class="cardBox cardBox8 card1"></div>
<div class="cardBox cardBox9 card1"></div>
<div class="cardBox cardBox0 card1"><span>0</span></div>
<div class="cardBox cardBox1 card1"><span>1</span></div>
<div class="cardBox cardBox2 card1"><span>2</span></div>
<div class="cardBox cardBox3 card1"><span>3</span></div>
<div class="cardBox cardBox4 card1"><span>4</span></div>
<div class="cardBox cardBox5 card1"><span>5</span></div>
<div class="cardBox cardBox6 card1"><span>6</span></div>
<div class="cardBox cardBox7 card1"><span>7</span></div>
<div class="cardBox cardBox8 card1"><span>8</span></div>
<div class="cardBox cardBox9 card1"><span>9</span></div>
<!-- 中級卡片 -->
<div class="cardBox cardBox0 card2"></div>
<div class="cardBox cardBox1 card2"></div>
<div class="cardBox cardBox2 card2"></div>
<div class="cardBox cardBox3 card2"></div>
<div class="cardBox cardBox4 card2"></div>
<div class="cardBox cardBox5 card2"></div>
<div class="cardBox cardBox6 card2"></div>
<div class="cardBox cardBox7 card2"></div>
<div class="cardBox cardBox8 card2"></div>
<div class="cardBox cardBox9 card2"></div>
<div class="cardBox cardBox0 card2"><span>0</span></div>
<div class="cardBox cardBox1 card2"><span>1</span></div>
<div class="cardBox cardBox2 card2"><span>2</span></div>
<div class="cardBox cardBox3 card2"><span>3</span></div>
<div class="cardBox cardBox4 card2"><span>4</span></div>
<div class="cardBox cardBox5 card2"><span>5</span></div>
<div class="cardBox cardBox6 card2"><span>6</span></div>
<div class="cardBox cardBox7 card2"><span>7</span></div>
<div class="cardBox cardBox8 card2"><span>8</span></div>
<div class="cardBox cardBox9 card2"><span>9</span></div>
<!-- 高級卡片 -->
<div class="cardBox cardBox0 card3"></div>
<div class="cardBox cardBox1 card3"></div>
<div class="cardBox cardBox2 card3"></div>
<div class="cardBox cardBox3 card3"></div>
<div class="cardBox cardBox4 card3"></div>
<div class="cardBox cardBox5 card3"></div>
<div class="cardBox cardBox6 card3"></div>
<div class="cardBox cardBox7 card3"></div>
<div class="cardBox cardBox8 card3"></div>
<div class="cardBox cardBox9 card3"></div>
<div class="cardBox cardBox0 card3"><span>0</span></div>
<div class="cardBox cardBox1 card3"><span>1</span></div>
<div class="cardBox cardBox2 card3"><span>2</span></div>
<div class="cardBox cardBox3 card3"><span>3</span></div>
<div class="cardBox cardBox4 card3"><span>4</span></div>
<div class="cardBox cardBox5 card3"><span>5</span></div>
<div class="cardBox cardBox6 card3"><span>6</span></div>
<div class="cardBox cardBox7 card3"><span>7</span></div>
<div class="cardBox cardBox8 card3"><span>8</span></div>
<div class="cardBox cardBox9 card3"><span>9</span></div>
<!-- 女神眷顧妳 -->
<div class="cardBoxText_gift">願幸運之神眷顧妳</div>
<!-- 中獎文按提示 -->