diff --git a/view/peko/activity/act-2023-qx/css/index.css b/view/peko/activity/act-2023-qx/css/index.css index 5277291..ac03e39 100644 --- a/view/peko/activity/act-2023-qx/css/index.css +++ b/view/peko/activity/act-2023-qx/css/index.css @@ -3,7 +3,7 @@ body { height: 21.6533333333rem; background: linear-gradient(90deg, #9980FF, #EB8FEA); margin: 0 auto; - box-sizing: border-box; + padding-bottom: 0.6266666667rem; } .back { @@ -129,6 +129,7 @@ body { list-style: none; position: absolute; display: flex; + animation: scrollLeft 11s linear infinite; } .blessingBag .blessingBag_in ul li { width: 1.8666666667rem; @@ -176,7 +177,7 @@ body { } @keyframes scrollLeft { 100% { - transform: translateX(-3.3rem); + transform: translateX(-11.2rem); } } @@ -186,6 +187,63 @@ body { background: url(../images/magpieBridge.png) no-repeat; background-size: 100% 100%; margin: 0 auto 0.4933333333rem; + position: relative; +} +.magpieBridge .magpieBridgeBg { + width: 8.9066666667rem; + height: 6.5466666667rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + top: 0.2rem; +} +.magpieBridge .birdNum { + height: 0.3466666667rem; + line-height: 0.3466666667rem; + position: absolute; + right: 0.5866666667rem; + top: 1.3466666667rem; + vertical-align: middle; +} +.magpieBridge .birdNum .bird { + display: inline-block; + width: 0.3466666667rem; + height: 0.3466666667rem; + margin-right: 0rem; +} +.magpieBridge .birdNum b { + color: #CA56A9; + font-size: 0.2933333333rem; +} +.magpieBridge .but1 { + width: 2.9066666667rem; + height: 1.16rem; + line-height: 1.0666666667rem; + text-align: center; + color: #FFFFFF; + font-size: 0.4rem; + font-weight: bold; + position: absolute; + bottom: 0.4533333333rem; + left: 1.4933333333rem; + background: url(../images/1.png) no-repeat; + background-size: 100% 100%; + text-shadow: 0px 0.0533333333rem 0.0266666667rem rgba(193, 64, 253, 0.67); +} +.magpieBridge .but10 { + width: 2.9066666667rem; + height: 1.16rem; + line-height: 1.0666666667rem; + text-align: center; + color: #FFFFFF; + font-size: 0.4rem; + font-weight: bold; + position: absolute; + bottom: 0.4533333333rem; + right: 1.4933333333rem; + background: url(../images/10.png) no-repeat; + background-size: 100% 100%; + text-shadow: 0px 0.0533333333rem 0.0266666667rem rgba(193, 64, 253, 0.67); } .task { diff --git a/view/peko/activity/act-2023-qx/css/index.scss b/view/peko/activity/act-2023-qx/css/index.scss index a660b06..baa4383 100644 --- a/view/peko/activity/act-2023-qx/css/index.scss +++ b/view/peko/activity/act-2023-qx/css/index.scss @@ -9,7 +9,8 @@ body { height: px2rem(1624, ); background: linear-gradient(90deg, #9980FF, #EB8FEA); margin: 0 auto; - box-sizing: border-box; + // box-sizing: border-box; + padding-bottom: px2rem(47, ); } .back { @@ -134,8 +135,8 @@ body { position: relative; .blessingBag_in { - // width: 7.9rem; width: px2rem(585, ); + // width: px2rem(560, ); height: 2rem; position: absolute; left: 50%; @@ -148,6 +149,7 @@ body { list-style: none; position: absolute; display: flex; + animation: scrollLeft 11s linear infinite; li { width: px2rem(140, ); @@ -199,10 +201,9 @@ body { } @keyframes scrollLeft { - 100% { - transform: translateX(-3.3rem); - // transform: translateX(px2rem(-400)); + // transform: translateX(-3.4rem); + transform: translateX(px2rem(-840)); } } } @@ -214,6 +215,69 @@ body { background: url(../images/magpieBridge.png) no-repeat; background-size: 100% 100%; margin: 0 auto px2rem(37, ); + position: relative; + + .magpieBridgeBg { + width: px2rem(668, ); + height: px2rem(491, ); + position: absolute; + left: 50%; + transform: translateX(-50%); + top: px2rem(15, ); + } + + .birdNum { + height: px2rem(26, ); + line-height: px2rem(26, ); + position: absolute; + right: px2rem(44, ); + top: px2rem(101, ); + vertical-align: middle; + + .bird { + display: inline-block; + width: px2rem(26, ); + height: px2rem(26, ); + margin-right: px2rem(0, ); + } + + b { + color: #CA56A9; + font-size: px2rem(22, ); + } + } + + .but1 { + width: px2rem(218, ); + height: px2rem(87, ); + line-height: px2rem(80, ); + text-align: center; + color: #FFFFFF; + font-size: px2rem(30, ); + font-weight: bold; + position: absolute; + bottom: px2rem(34, ); + left: px2rem(112, ); + background: url(../images/1.png) no-repeat; + background-size: 100% 100%; + text-shadow: 0px px2rem(4, ) px2rem(2, ) rgba(193, 64, 253, 0.67); + } + + .but10 { + width: px2rem(218, ); + height: px2rem(87, ); + line-height: px2rem(80, ); + text-align: center; + color: #FFFFFF; + font-size: px2rem(30, ); + font-weight: bold; + position: absolute; + bottom: px2rem(34, ); + right: px2rem(112, ); + background: url(../images/10.png) no-repeat; + background-size: 100% 100%; + text-shadow: 0px px2rem(4, ) px2rem(2, ) rgba(193, 64, 253, 0.67); + } } .task { diff --git a/view/peko/activity/act-2023-qx/images/1.png b/view/peko/activity/act-2023-qx/images/1.png new file mode 100644 index 0000000..9e825c9 Binary files /dev/null and b/view/peko/activity/act-2023-qx/images/1.png differ diff --git a/view/peko/activity/act-2023-qx/images/10.png b/view/peko/activity/act-2023-qx/images/10.png new file mode 100644 index 0000000..4d15728 Binary files /dev/null and b/view/peko/activity/act-2023-qx/images/10.png differ diff --git a/view/peko/activity/act-2023-qx/images/bird.png b/view/peko/activity/act-2023-qx/images/bird.png new file mode 100644 index 0000000..6861478 Binary files /dev/null and b/view/peko/activity/act-2023-qx/images/bird.png differ diff --git a/view/peko/activity/act-2023-qx/images/line.png b/view/peko/activity/act-2023-qx/images/line.png new file mode 100644 index 0000000..67e7b30 Binary files /dev/null and b/view/peko/activity/act-2023-qx/images/line.png differ diff --git a/view/peko/activity/act-2023-qx/images/lineBg.png b/view/peko/activity/act-2023-qx/images/lineBg.png new file mode 100644 index 0000000..45f024c Binary files /dev/null and b/view/peko/activity/act-2023-qx/images/lineBg.png differ diff --git a/view/peko/activity/act-2023-qx/images/lineTx.png b/view/peko/activity/act-2023-qx/images/lineTx.png new file mode 100644 index 0000000..acbb47a Binary files /dev/null and b/view/peko/activity/act-2023-qx/images/lineTx.png differ diff --git a/view/peko/activity/act-2023-qx/index.html b/view/peko/activity/act-2023-qx/index.html index 203deb1..2e4ac9c 100644 --- a/view/peko/activity/act-2023-qx/index.html +++ b/view/peko/activity/act-2023-qx/index.html @@ -75,11 +75,45 @@
緣定今生
27777 钻 + + +飛上雲霄
+ 177 钻 +情意捲軸
+ 377 钻 +桃花灼灼
+ 1777 钻 +花色漫漫
+ 2777 钻 +
+
+ 我的喜鹊: 0
+