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

修改样式

Browse Source
This commit is contained in:
dragon
2025-01-14 15:43:33 +08:00
parent bb4ef6ae11
commit faaa55dc68
14 changed files with 116 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
view/molistar/modules/newRank/css/index.css
View File

@@ -11,7 +11,7 @@ body {
line-height: 0.58667rem;
position: fixed;
left: 0;
top: 1.33333rem;
top: 1.2rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
@@ -41,6 +41,22 @@ body {
font-weight: 600;
}
.newText1 {
width: 100%;
position: fixed;
height: 2rem;
background: #000;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: 0.42667rem;
font-weight: 600;
line-height: 3rem;
transition: all 0.5s;
height: 0;
overflow: hidden;
}
.header {
width: 10rem;
height: 17rem;

19
view/molistar/modules/newRank/css/index.scss
View File

@@ -15,7 +15,7 @@ body {
line-height: px2rem(44);
position: fixed;
left: 0;
top: px2rem(100);
top: px2rem(90);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
@@ -45,6 +45,23 @@ body {
}
}
.newText1 {
width: 100%;
position: fixed;
height: 2rem;
// background: rgba(0, 0, 0, .8);
background: #000;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: px2rem(32);
font-weight: 600;
line-height: 3rem;
transition: all 0.5s;
height: 0;
overflow: hidden;
}
.header {
width: px2rem(750);
// height: px2rem(1229);

35
view/molistar/modules/newRank/css/monthlyRewards.css
View File

@@ -6,12 +6,12 @@ body {
}
.back {
width: 100%;
width: 0.66667rem;
height: 0.58667rem;
line-height: 0.58667rem;
position: fixed;
left: 0;
top: 1.33333rem;
top: 1.2rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
@@ -41,6 +41,22 @@ body {
font-weight: 600;
}
.newText2 {
width: 100%;
position: fixed;
height: 2rem;
background: #000;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: 0.42667rem;
font-weight: 600;
line-height: 3rem;
transition: all 0.5s;
height: 0;
overflow: hidden;
}
.header {
width: 10rem;
height: 17rem;
@@ -50,8 +66,8 @@ body {
.header .tabBox {
width: 10rem;
height: 1.12rem;
line-height: 1.12rem;
height: 0.8rem;
line-height: 0.8rem;
display: flex;
justify-content: space-evenly;
position: absolute;
@@ -65,14 +81,14 @@ body {
.header .tabBox div {
position: relative;
width: 2.32rem;
height: 1.12rem;
width: 2.13333rem;
height: 0.8rem;
border-radius: 0.8rem;
color: #FFF8C2;
font-size: 0.37333rem;
font-weight: 600;
background: url(../images/tab.png) no-repeat;
background-size: 100% 100%;
text-align: center;
background: rgba(0, 0, 0, 0.5);
}
.header .tabBox div span {
@@ -90,8 +106,7 @@ body {
.header .tabBox .act {
color: #000;
font-weight: bold;
background: url(../images/tabAct.png) no-repeat;
background-size: 100% 100%;
background: linear-gradient(0deg, #FFDC7D, #FFEEBC);
}
.header .tabBox .act span {

36
view/molistar/modules/newRank/css/monthlyRewards.scss
View File

@@ -10,12 +10,12 @@ body {
}
.back {
width: 100%;
width: px2rem(50);
height: px2rem(44);
line-height: px2rem(44);
position: fixed;
left: 0;
top: px2rem(100);
top: px2rem(90);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
@@ -45,6 +45,23 @@ body {
}
}
.newText2 {
width: 100%;
position: fixed;
height: 2rem;
// background:rgba(0, 0, 0, .65);
background: #000;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: px2rem(32);
font-weight: 600;
line-height: 3rem;
transition: all 0.5s;
height: 0;
overflow: hidden;
}
.header {
width: px2rem(750);
// height: px2rem(1229);
@@ -54,8 +71,8 @@ body {
.tabBox {
width: px2rem(750);
height: px2rem(84);
line-height: px2rem(84);
height: px2rem(60);
line-height: px2rem(60);
display: flex;
justify-content: space-evenly;
position: absolute;
@@ -68,14 +85,14 @@ body {
div {
position: relative;
width: px2rem(174);
height: px2rem(84);
width: px2rem(160);
height: px2rem(60);
border-radius: px2rem(60);
color: #FFF8C2;
font-size: px2rem(28);
font-weight: 600;
background: url(../images/tab.png) no-repeat;
background-size: 100% 100%;
text-align: center;
background: rgba(0, 0, 0, .5);
span {
width: px2rem(37);
@@ -93,8 +110,7 @@ body {
.act {
color: #000;
font-weight: bold;
background: url(../images/tabAct.png) no-repeat;
background-size: 100% 100%;
background: linear-gradient(0deg, #FFDC7D, #FFEEBC);
span {
display: block;

BIN
view/molistar/modules/newRank/images/reward1.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 425 KiB

After

Width:  |  Height:  |  Size: 425 KiB

BIN
view/molistar/modules/newRank/images/reward3.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 310 KiB

After

Width:  |  Height:  |  Size: 308 KiB

1
view/molistar/modules/newRank/index.html
View File

@@ -15,6 +15,7 @@
<img src="./images/travel/back.png" alt="">
<!-- <p class="newText1">Honor Ranking</p> -->
</div>
<p class="newText1"></p>
<!-- 头部 -->
<div class="header header1">
<div class="tabBox">

12
view/molistar/modules/newRank/js/index.js
View File

@@ -294,4 +294,14 @@ $('ul').on('click', 'li .tx', function () {
// 跳转奖励页面
$('.header .monthlyRewards').click(function () {
window.location.href = './monthlyRewards.html'
})
})
window.addEventListener('scroll', function () {
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
console.log('页面下滑距顶部的距离:', scrollTop);
if (scrollTop >= 30) {
$('.newText1').css('height', '2rem')
} else if (scrollTop < 30) {
$('.newText1').css('height', '0rem')
}
});

13
view/molistar/modules/newRank/js/monthlyRewards.js
View File

@@ -257,4 +257,15 @@ $('.header .top .ts').click(function () {
window.androidJsObj.openPersonPage(uid);
}
}
})
})
window.addEventListener('scroll', function () {
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
console.log('页面下滑距顶部的距离:', scrollTop);
if (scrollTop >= 30) {
$('.newText2').css('height', '2rem')
} else if (scrollTop < 30) {
$('.newText2').css('height', '0rem')
}
});

2
view/molistar/modules/newRank/local/ar.js
View File

@@ -13,7 +13,7 @@ langAr = {
text6: 'أسبوعي ',
text7: 'غير مدرج',
newText1: 'تصنيف الشرف',
newText2: 'شهري',
newText2: 'شهري المكافآت',
newText3: 'خلف',
newText4: 'شهري',
newText5: 'المكافآت',

2
view/molistar/modules/newRank/local/en.js
View File

@@ -13,7 +13,7 @@ langEn = {
text6: "Weekly ",
text7: "Not Listed",
newText1:`Honor Ranking`,
newText2:`Monthly`,
newText2:`Monthly Rewards`,
newText3:`Behind`,
newText4:`Monthly`,
newText5:`Rewards`,

2
view/molistar/modules/newRank/local/tr.js
View File

@@ -13,7 +13,7 @@ langTr = {
text6: 'Haftalık ',
text7: 'Listeye Girmedi',
newText1: 'Onur Sıralaması',
newText2: 'Aylık',
newText2: 'Aylık Ödüller',
newText3: 'Geride',
newText4: 'Aylık',
newText5: 'Ödüller',

2
view/molistar/modules/newRank/local/zh.js
View File

@@ -13,7 +13,7 @@ langZh = {
text6: '每週 ',
text7: '未上榜',
newText1: '榮譽排行',
newText2: '每月',
newText2: '每月獎勵',
newText3: '落後',
newText4: '每月',
newText5: '獎勵',

3
view/molistar/modules/newRank/monthlyRewards.html
View File

@@ -13,8 +13,9 @@
<!-- 頂部返回 -->
<div class="back">
<img src="./images/travel/back.png" alt="">
<!-- <p class="newText1">Honor Ranking</p> -->
<!-- -->
</div>
<p class="newText2">Honor Ranking</p>
<!-- 头部 -->
<div class="header header1">
<div class="tabBox">