From db9c260edcee4ed10cec575ea8d7f680be5eac42 Mon Sep 17 00:00:00 2001
From: dragon <3013557874@qq.com>
Date: Thu, 1 Aug 2024 14:56:41 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96h5=E5=85=AC=E4=BC=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../modules/guildAr/css/guildInfoSet.css | 184 +--
.../modules/guildAr/css/guildInfoSet.scss | 189 +--
view/molistar/modules/guildAr/css/index.css | 218 ++--
view/molistar/modules/guildAr/css/index.scss | 296 +++--
.../modules/guildAr/css/lay-picker.min.css | 9 +
.../modules/guildAr/css/memberFlow.css | 427 ++++---
.../modules/guildAr/css/memberFlow.scss | 463 ++++---
.../modules/guildAr/css/memberFlow2.css | 631 +++++++---
.../modules/guildAr/css/memberFlow2.scss | 594 ++++++---
.../modules/guildAr/css/memberFlow22.css | 488 ++++++++
.../modules/guildAr/css/memberFlow22.scss | 508 ++++++++
.../modules/guildAr/css/memberFlow3.css | 344 ++++++
.../modules/guildAr/css/memberFlow3.scss | 355 ++++++
.../modules/guildAr/guildInfoSet.html | 36 +-
view/molistar/modules/guildAr/images/dor.png | Bin 0 -> 1269 bytes
view/molistar/modules/guildAr/images/dos.png | Bin 0 -> 6372 bytes
.../molistar/modules/guildAr/images/gold2.png | Bin 0 -> 4601 bytes
.../modules/guildAr/images/goldIcon.png | Bin 0 -> 6493 bytes
.../modules/guildAr/images/header.png | Bin 2913373 -> 2746778 bytes
.../molistar/modules/guildAr/images/icon1.png | Bin 21222 -> 3941 bytes
.../molistar/modules/guildAr/images/icon2.png | Bin 20286 -> 1618 bytes
.../molistar/modules/guildAr/images/icon3.png | Bin 0 -> 2959 bytes
.../molistar/modules/guildAr/images/icon4.png | Bin 0 -> 2765 bytes
.../modules/guildAr/images/inveMemberIcon.png | Bin 0 -> 4204 bytes
view/molistar/modules/guildAr/index.html | 51 +-
.../modules/guildAr/js/guildInfoSet.js | 109 +-
view/molistar/modules/guildAr/js/index.js | 53 +-
.../modules/guildAr/js/lay-picker.min.js | 1086 +++++++++++++++++
.../molistar/modules/guildAr/js/memberFlow.js | 174 +--
.../modules/guildAr/js/memberFlow2.js | 280 +++--
.../modules/guildAr/js/memberFlow22.js | 267 ++++
.../modules/guildAr/js/memberFlow222.js | 267 ++++
.../modules/guildAr/js/memberFlow3.js | 178 +++
view/molistar/modules/guildAr/local/ar.js | 111 +-
view/molistar/modules/guildAr/local/en.js | 135 +-
view/molistar/modules/guildAr/local/zh.js | 105 +-
view/molistar/modules/guildAr/memberFlow.html | 114 +-
.../molistar/modules/guildAr/memberFlow2.html | 156 ++-
.../modules/guildAr/memberFlow22.html | 162 +++
.../modules/guildAr/memberFlow222.html | 163 +++
.../molistar/modules/guildAr/memberFlow3.html | 184 +++
41 files changed, 6921 insertions(+), 1416 deletions(-)
create mode 100644 view/molistar/modules/guildAr/css/lay-picker.min.css
create mode 100644 view/molistar/modules/guildAr/css/memberFlow22.css
create mode 100644 view/molistar/modules/guildAr/css/memberFlow22.scss
create mode 100644 view/molistar/modules/guildAr/css/memberFlow3.css
create mode 100644 view/molistar/modules/guildAr/css/memberFlow3.scss
create mode 100644 view/molistar/modules/guildAr/images/dor.png
create mode 100644 view/molistar/modules/guildAr/images/dos.png
create mode 100644 view/molistar/modules/guildAr/images/gold2.png
create mode 100644 view/molistar/modules/guildAr/images/goldIcon.png
create mode 100644 view/molistar/modules/guildAr/images/icon3.png
create mode 100644 view/molistar/modules/guildAr/images/icon4.png
create mode 100644 view/molistar/modules/guildAr/images/inveMemberIcon.png
create mode 100644 view/molistar/modules/guildAr/js/lay-picker.min.js
create mode 100644 view/molistar/modules/guildAr/js/memberFlow22.js
create mode 100644 view/molistar/modules/guildAr/js/memberFlow222.js
create mode 100644 view/molistar/modules/guildAr/js/memberFlow3.js
create mode 100644 view/molistar/modules/guildAr/memberFlow22.html
create mode 100644 view/molistar/modules/guildAr/memberFlow222.html
create mode 100644 view/molistar/modules/guildAr/memberFlow3.html
diff --git a/view/molistar/modules/guildAr/css/guildInfoSet.css b/view/molistar/modules/guildAr/css/guildInfoSet.css
index b2ce18c..8c06e6e 100644
--- a/view/molistar/modules/guildAr/css/guildInfoSet.css
+++ b/view/molistar/modules/guildAr/css/guildInfoSet.css
@@ -4,7 +4,7 @@ body {
height: 17.78667rem;
background: #F5F7F9;
box-sizing: border-box;
- padding: 0 0.42667rem;
+ padding: 1.73333rem 0rem 0 0;
}
.back {
@@ -30,91 +30,137 @@ body {
top: 54%;
}
-.nick {
- margin-top: 2.93333rem;
+input {
+ background: none;
+ outline: none;
+ bottom: none;
+}
+
+h3 {
color: #333333;
font-size: 0.42667rem;
- font-weight: 800;
+ margin-bottom: 0.57333rem;
+ font-weight: 500;
+ margin-left: 0.42667rem;
+ text-align: left;
}
-.nick input {
- border: none;
- outline: none;
- background: #F5F7F9;
- width: 5.4rem;
- height: 0.66667rem;
- border-radius: 0.66667rem;
- box-sizing: border-box;
- color: #333;
- font-size: 0.42667rem;
- box-sizing: border-box;
- padding-left: 0.13333rem;
- margin-bottom: 0.74667rem;
-}
-
-.nick input::placeholder {
- color: #515665;
-}
-
-.bg {
- width: 100%;
- height: 2.26667rem;
+.name {
+ width: 9.01333rem;
+ height: 1.01333rem;
+ line-height: 1.01333rem;
position: relative;
+ margin: 0 auto 0.85333rem;
+ background: #fff;
+ border-radius: 0.09333rem;
}
-.bg span {
+.name input {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 80%;
+ height: 100%;
+ color: #3C3C3C;
+ font-size: 0.37333rem;
+ font-weight: 400;
+ box-sizing: border-box;
+ padding-left: 0.37333rem;
+}
+
+.name span {
+ position: absolute;
+ right: 0.50667rem;
+ top: 0;
+ height: 100%;
+ color: #E13B3F;
+ font-size: 0.37333rem;
+ font-weight: 400;
+}
+
+.name .act {
+ color: #67D2A6;
+}
+
+.background {
+ position: relative;
+ width: 6.66667rem;
+ height: 4rem;
+ margin-bottom: 0.89333rem;
+}
+
+.background img {
display: inline-block;
- color: #333;
- font-size: 0.42667rem;
- line-height: 2.26667rem;
- font-weight: 800;
+ margin-left: 0.42667rem;
+ margin-right: 0.22667rem;
+ width: 4rem;
+ height: 4rem;
+ border-radius: 0.06667rem;
}
-.bg img {
- width: 2.26667rem;
- height: 2.26667rem;
+.background span {
+ color: #E13B3F;
+ font-size: 0.37333rem;
+ font-weight: 400;
+ margin-top: 3.65333rem;
+ display: inline-block;
+}
+
+.background input {
position: absolute;
- top: 0;
- left: 2.53333rem;
- z-index: 1;
- border-radius: 0.13333rem;
+ right: 1.2rem;
+ bottom: -0.2rem;
+ width: 0.93333rem;
+ height: 0.8rem;
}
-.bg .upload {
- width: 2.26667rem;
- height: 2.26667rem;
+.background .act {
+ color: #67D2A6;
+}
+
+.account {
+ width: 9.01333rem;
+ height: 1.01333rem;
+ line-height: 1.01333rem;
+ position: relative;
+ margin: 0 auto 0.85333rem;
+ background: #fff;
+ border-radius: 0.09333rem;
+}
+
+.account i {
+ font-style: normal;
+ color: #3C3C3C;
+ font-weight: 400;
+ font-size: 0.37333rem;
+ height: 100%;
position: absolute;
+ left: 0.26667rem;
+}
+
+.account input {
+ position: absolute;
+ left: 2.13333rem;
top: 0;
- left: 2.53333rem;
- z-index: 2;
+ height: 100%;
+ color: #000;
+ font-size: 0.37333rem;
+ font-weight: 500;
+ box-sizing: border-box;
+ padding-left: 0.46667rem;
+ width: 60%;
}
-.boxBut {
- width: 7.06667rem;
- height: 0.93333rem;
- margin: 1.73333rem auto 0;
- display: flex;
- justify-content: space-between;
+.account span {
+ position: absolute;
+ right: 0.50667rem;
+ top: 0;
+ height: 100%;
+ color: #E13B3F;
+ font-size: 0.37333rem;
+ font-weight: 400;
}
-.boxBut .close {
- width: 2.88rem;
- height: 0.93333rem;
- line-height: 0.93333rem;
- border-radius: 0.93333rem;
- text-align: center;
- color: #fff;
- font-size: 0.42667rem;
- background: #CCCBCE;
-}
-
-.boxBut .ok {
- width: 2.88rem;
- height: 0.93333rem;
- line-height: 0.93333rem;
- border-radius: 0.93333rem;
- text-align: center;
- color: #fff;
- font-size: 0.42667rem;
- background: linear-gradient(90deg, #867FFF, #66E3FF);
+.account .act {
+ color: #67D2A6;
}
diff --git a/view/molistar/modules/guildAr/css/guildInfoSet.scss b/view/molistar/modules/guildAr/css/guildInfoSet.scss
index 8cf4692..f31a6b5 100644
--- a/view/molistar/modules/guildAr/css/guildInfoSet.scss
+++ b/view/molistar/modules/guildAr/css/guildInfoSet.scss
@@ -8,7 +8,7 @@ body {
height: px2rem(1334);
background: #F5F7F9;
box-sizing: border-box;
- padding: 0 px2rem(32);
+ padding: px2rem(130) px2rem(0) 0 0;
}
.back {
@@ -34,91 +34,138 @@ body {
}
}
-.nick {
- margin-top: px2rem(220);
+input {
+ background: none;
+ outline: none;
+ bottom: none;
+}
+
+h3 {
color: #333333;
font-size: px2rem(32);
- font-weight: 800;
+ margin-bottom: px2rem(43);
+ font-weight: 500;
+ margin-left: px2rem(32);
+ text-align: left;
+}
+
+.name {
+ width: px2rem(676);
+ height: px2rem(76);
+ line-height: px2rem(76);
+ position: relative;
+ margin: 0 auto px2rem(64);
+ background: #fff;
+ border-radius: px2rem(7);
input {
- border: none;
- outline: none;
- background: #F5F7F9;
- width: 5.4rem;
- height: px2rem(50);
- border-radius: px2rem(50);
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 80%;
+ height: 100%;
+ color: #3C3C3C;
+ font-size: px2rem(28);
+ font-weight: 400;
box-sizing: border-box;
- color: #333;
- font-size: px2rem(32);
- box-sizing: border-box;
- padding-left: px2rem(10);
- margin-bottom: px2rem(56);
-
- &::placeholder {
- color: #515665;
- }
+ padding-left: px2rem(28);
}
-}
-
-.bg {
- width: 100%;
- height: px2rem(170);
- position: relative;
span {
- display: inline-block;
- color: #333;
- font-size: px2rem(32);
- line-height: px2rem(170);
- font-weight: 800;
+ position: absolute;
+ right: px2rem(38);
+ top: 0;
+ height: 100%;
+ color: #E13B3F;
+ font-size: px2rem(28);
+ font-weight: 400;
}
- img {
- width: px2rem(170);
- height: px2rem(170);
- position: absolute;
- top: 0;
- left: px2rem(190);
- z-index: 1;
- border-radius: px2rem(10);
- }
-
- .upload {
- width: px2rem(170);
- height: px2rem(170);
- position: absolute;
- top: 0;
- left: px2rem(190);
- z-index: 2;
+ .act {
+ color: #67D2A6;
}
}
-.boxBut {
- width: px2rem(530);
- height: px2rem(70);
- margin: px2rem(130) auto 0;
- display: flex;
- justify-content: space-between;
+.background {
+ position: relative;
+ width: px2rem(500);
+ height: px2rem(300);
+ margin-bottom: px2rem(67);
- .close {
- width: px2rem(216);
- height: px2rem(70);
- line-height: px2rem(70);
- border-radius: px2rem(70);
- text-align: center;
- color: #fff;
- font-size: px2rem(32);
- background: #CCCBCE;
+ img {
+ display: inline-block;
+ margin-left: px2rem(32);
+ margin-right: px2rem(17);
+ width: px2rem(300);
+ height: px2rem(300);
+ border-radius: px2rem(5);
}
- .ok {
- width: px2rem(216);
- height: px2rem(70);
- line-height: px2rem(70);
- border-radius: px2rem(70);
- text-align: center;
- color: #fff;
- font-size: px2rem(32);
- background: linear-gradient(90deg, #867FFF, #66E3FF);
+ span {
+ color: #E13B3F;
+ font-size: px2rem(28);
+ font-weight: 400;
+ margin-top: px2rem(274);
+ display: inline-block;
+
+ }
+
+ input {
+ position: absolute;
+ right: 1.2rem;
+ bottom: -0.2rem;
+ width: px2rem(70);
+ height: px2rem(60);
+ }
+
+ .act {
+ color: #67D2A6;
+ }
+}
+
+.account {
+ width: px2rem(676);
+ height: px2rem(76);
+ line-height: px2rem(76);
+ position: relative;
+ margin: 0 auto px2rem(64);
+ background: #fff;
+ border-radius: px2rem(7);
+
+ i {
+ font-style: normal;
+ color: #3C3C3C;
+ font-weight: 400;
+ font-size: px2rem(28);
+ height: 100%;
+ position: absolute;
+ left: px2rem(20);
+ }
+
+ input {
+ position: absolute;
+ left: px2rem(160);
+ top: 0;
+ height: 100%;
+ color: #000;
+ font-size: px2rem(28);
+ font-weight: 500;
+ box-sizing: border-box;
+ padding-left: px2rem(35);
+ width: 60%;
+ }
+
+ span {
+ position: absolute;
+ right: px2rem(38);
+ top: 0;
+ height: 100%;
+ color: #E13B3F;
+ font-size: px2rem(28);
+ font-weight: 400;
+ }
+
+ .act {
+ color: #67D2A6;
}
}
\ No newline at end of file
diff --git a/view/molistar/modules/guildAr/css/index.css b/view/molistar/modules/guildAr/css/index.css
index f2120ea..15fa889 100644
--- a/view/molistar/modules/guildAr/css/index.css
+++ b/view/molistar/modules/guildAr/css/index.css
@@ -94,86 +94,6 @@ body {
top: 5.64rem;
}
-.header .adminSet {
- padding: 0rem 0.21333rem;
- box-sizing: border-box;
- height: 0.58667rem;
- line-height: 0.58667rem;
- color: #fff;
- font-size: 0.42667rem;
- font-weight: 400;
- background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98));
- border-radius: 0.58667rem 0px 0px 0.58667rem;
- position: absolute;
- right: 0;
- top: 2.45333rem;
- display: none;
-}
-
-.header .guildInfoSet {
- padding: 0rem 0.21333rem;
- box-sizing: border-box;
- height: 0.58667rem;
- line-height: 0.58667rem;
- color: #fff;
- font-size: 0.42667rem;
- font-weight: 400;
- background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7));
- border-radius: 0.58667rem 0px 0px 0.58667rem;
- position: absolute;
- right: 0;
- top: 3.18667rem;
- display: none;
-}
-
-.header .memberFlow {
- width: 2.77333rem;
- height: 0.74667rem;
- line-height: 0.74667rem;
- text-align: center;
- color: #fff;
- font-size: 0.42667rem;
- font-weight: 400;
- background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
- border-radius: 0.18667rem;
- position: absolute;
- left: 2.08rem;
- top: 6.21333rem;
- display: none;
-}
-
-.header .memberFlowMy {
- width: 2.77333rem;
- height: 0.74667rem;
- line-height: 0.74667rem;
- text-align: center;
- color: #fff;
- font-size: 0.42667rem;
- font-weight: 400;
- background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
- border-radius: 0.18667rem 0 0 0.18667rem;
- position: absolute;
- right: 0rem;
- top: 2.90667rem;
- display: none;
-}
-
-.header .inveMember {
- width: 2.77333rem;
- height: 0.74667rem;
- line-height: 0.74667rem;
- text-align: center;
- color: #fff;
- font-size: 0.42667rem;
- font-weight: 400;
- background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
- border-radius: 0.18667rem;
- position: absolute;
- right: 2.08rem;
- top: 6.21333rem;
- display: none;
-}
-
.header .guildNick {
width: 100%;
position: absolute;
@@ -186,11 +106,50 @@ body {
display: none;
}
+.header .headerBox {
+ width: 8.86667rem;
+ display: flex;
+ justify-content: center;
+ flex-wrap: wrap;
+ position: absolute;
+ top: 6.37333rem;
+ left: 50%;
+ transform: translateX(-50%);
+}
+
+.header .headerBox div {
+ width: 3.62667rem;
+ height: 0.74667rem;
+ line-height: 0.74667rem;
+ color: #fff;
+ font-size: 0.34667rem;
+ text-align: center;
+ background: linear-gradient(90deg, rgba(128, 146, 255, 0.8) 0%, rgba(108, 208, 255, 0.8) 100%);
+ border-radius: 0.18667rem;
+ margin-bottom: 0.33333rem;
+ overflow: hidden;
+ white-space: nowrap;
+ margin: 0 auto 0.33333rem;
+}
+
+.header .headerBox div img {
+ width: 0.42667rem;
+ height: 0.42667rem;
+ margin-right: 0.17333rem;
+ float: left;
+ margin-top: 0.16rem;
+ margin-left: 0.38667rem;
+}
+
+.header .headerBox div span {
+ float: left;
+}
+
.guildList {
width: 9.25333rem;
- height: 13.33333rem;
+ height: 11rem;
border-radius: 0.26667rem;
- margin: -1.66667rem auto 0rem;
+ margin: -0.3rem auto 0rem;
position: relative;
background: #fff;
overflow: hidden;
@@ -260,7 +219,7 @@ body {
.guildList ul {
width: 100%;
- height: 11.8rem;
+ height: 11rem;
margin: 0.52rem auto 0;
overflow-y: scroll;
}
@@ -334,7 +293,7 @@ body {
.guildList ul li .but {
width: 1.17333rem;
height: 0.56rem;
- background: #7F95FF;
+ background: #62D0A8;
border-radius: 0.56rem;
position: absolute;
right: 0.34667rem;
@@ -342,7 +301,7 @@ body {
text-align: center;
color: #fff;
line-height: 0.56rem;
- font-size: 0.34667rem;
+ font-size: 0.29333rem;
font-weight: 400;
}
@@ -434,3 +393,92 @@ body {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}
+
+.inveMember {
+ width: 4.08rem;
+ height: 1.28rem;
+ border-radius: 1.28rem;
+ line-height: 1.22667rem;
+ text-align: center;
+ background: linear-gradient(90deg, #7CDD9B, #62D0A8);
+ color: #fff;
+ font-size: 0.45333rem;
+ position: fixed;
+ left: 50%;
+ transform: translateX(-50%);
+ z-index: 5;
+ bottom: 1.06667rem;
+}
+
+.inveMember img {
+ display: inline-block;
+ width: 0.50667rem;
+ height: 0.56rem;
+ vertical-align: middle;
+ margin-top: -0.1rem;
+}
+
+.inveMember span {
+ display: inline-block;
+ vertical-align: middle;
+}
+
+.arabic .guildList .top img {
+ right: 0.4rem;
+}
+
+.arabic .guildList .top input {
+ padding-right: 0.5rem;
+}
+
+.arabic .guildList ul li .but {
+ left: 0.34667rem;
+ right: auto;
+}
+
+.arabic .guildList ul li .chairman,
+.arabic .guildList ul li .administrator {
+ right: 0.1rem;
+ left: auto;
+}
+
+.arabic .guildList ul li .tx,
+.arabic .guildList ul li .user {
+ float: right;
+}
+
+.arabic .guildList ul li .user {
+ padding-right: 0.2rem;
+}
+
+.arabic .header .headerBox div img {
+ float: right;
+}
+
+.arabic .header .headerBox div span {
+ float: right;
+}
+
+.english .header .headerBox {
+ width: 8rem;
+}
+
+.english .header .headerBox div {
+ width: 3.9rem;
+}
+
+.english .header .headerBox div span {
+ font-size: 0.21333rem;
+}
+
+.arabic .header .headerBox {
+ width: 8rem;
+}
+
+.arabic .header .headerBox div {
+ width: 3.9rem;
+}
+
+.arabic .header .headerBox div span {
+ font-size: 0.29333rem;
+}
diff --git a/view/molistar/modules/guildAr/css/index.scss b/view/molistar/modules/guildAr/css/index.scss
index c33a59f..f0f6fc8 100644
--- a/view/molistar/modules/guildAr/css/index.scss
+++ b/view/molistar/modules/guildAr/css/index.scss
@@ -98,85 +98,85 @@ body {
top: px2rem(423);
}
- .adminSet {
- padding: px2rem(0) px2rem(16);
- box-sizing: border-box;
- height: px2rem(44);
- line-height: px2rem(44);
- color: #fff;
- font-size: px2rem(32);
- font-weight: 400;
- background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98));
- border-radius: px2rem(44) 0px 0px px2rem(44);
- position: absolute;
- right: 0;
- top: px2rem(184);
- display: none;
- }
+ // .adminSet {
+ // padding: px2rem(0) px2rem(16);
+ // box-sizing: border-box;
+ // height: px2rem(44);
+ // line-height: px2rem(44);
+ // color: #fff;
+ // font-size: px2rem(32);
+ // font-weight: 400;
+ // background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98));
+ // border-radius: px2rem(44) 0px 0px px2rem(44);
+ // position: absolute;
+ // right: 0;
+ // top: px2rem(184);
+ // display: none;
+ // }
- .guildInfoSet {
- padding: px2rem(0) px2rem(16);
- box-sizing: border-box;
- height: px2rem(44);
- line-height: px2rem(44);
- color: #fff;
- font-size: px2rem(32);
- font-weight: 400;
- background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7));
- border-radius: px2rem(44) 0px 0px px2rem(44);
- position: absolute;
- right: 0;
- top: px2rem(239);
- display: none;
- }
+ // .guildInfoSet {
+ // padding: px2rem(0) px2rem(16);
+ // box-sizing: border-box;
+ // height: px2rem(44);
+ // line-height: px2rem(44);
+ // color: #fff;
+ // font-size: px2rem(32);
+ // font-weight: 400;
+ // background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7));
+ // border-radius: px2rem(44) 0px 0px px2rem(44);
+ // position: absolute;
+ // right: 0;
+ // top: px2rem(239);
+ // display: none;
+ // }
- .memberFlow {
- width: px2rem(208);
- height: px2rem(56);
- line-height: px2rem(56);
- text-align: center;
- color: #fff;
- font-size: px2rem(32);
- font-weight: 400;
- background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
- border-radius: px2rem(14);
- position: absolute;
- left: px2rem(156);
- top: px2rem(466);
- display: none;
- }
+ // .memberFlow {
+ // width: px2rem(208);
+ // height: px2rem(56);
+ // line-height: px2rem(56);
+ // text-align: center;
+ // color: #fff;
+ // font-size: px2rem(32);
+ // font-weight: 400;
+ // background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
+ // border-radius: px2rem(14);
+ // position: absolute;
+ // left: px2rem(156);
+ // top: px2rem(466);
+ // display: none;
+ // }
- .memberFlowMy {
- width: px2rem(208);
- height: px2rem(56);
- line-height: px2rem(56);
- text-align: center;
- color: #fff;
- font-size: px2rem(32);
- font-weight: 400;
- background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
- border-radius: px2rem(14) 0 0 px2rem(14);
- position: absolute;
- right: px2rem(0);
- top: px2rem(218);
- display: none;
- }
+ // .memberFlowMy {
+ // width: px2rem(208);
+ // height: px2rem(56);
+ // line-height: px2rem(56);
+ // text-align: center;
+ // color: #fff;
+ // font-size: px2rem(32);
+ // font-weight: 400;
+ // background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
+ // border-radius: px2rem(14) 0 0 px2rem(14);
+ // position: absolute;
+ // right: px2rem(0);
+ // top: px2rem(218);
+ // display: none;
+ // }
- .inveMember {
- width: px2rem(208);
- height: px2rem(56);
- line-height: px2rem(56);
- text-align: center;
- color: #fff;
- font-size: px2rem(32);
- font-weight: 400;
- background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
- border-radius: px2rem(14);
- position: absolute;
- right: px2rem(156);
- top: px2rem(466);
- display: none;
- }
+ // .inveMember {
+ // width: px2rem(208);
+ // height: px2rem(56);
+ // line-height: px2rem(56);
+ // text-align: center;
+ // color: #fff;
+ // font-size: px2rem(32);
+ // font-weight: 400;
+ // background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
+ // border-radius: px2rem(14);
+ // position: absolute;
+ // right: px2rem(156);
+ // top: px2rem(466);
+ // display: none;
+ // }
.guildNick {
width: 100%;
@@ -189,13 +189,53 @@ body {
text-align: center;
display: none;
}
+
+ .headerBox {
+ width: px2rem(665);
+ display: flex;
+ justify-content: center;
+ flex-wrap: wrap;
+ position: absolute;
+ top: px2rem(478);
+ // left: px2rem(93);
+ left: 50%;
+ transform: translateX(-50%);
+
+ div {
+ width: px2rem(272);
+ height: px2rem(56);
+ line-height: px2rem(56);
+ color: #fff;
+ font-size: px2rem(26);
+ text-align: center;
+ background: linear-gradient(90deg, rgba(128, 146, 255, .8) 0%, rgba(108, 208, 255, .8) 100%);
+ border-radius: px2rem(14);
+ margin-bottom: px2rem(25);
+ overflow: hidden;
+ white-space: nowrap;
+ margin: 0 auto px2rem(25);
+
+ img {
+ width: px2rem(32);
+ height: px2rem(32);
+ margin-right: px2rem(13);
+ float: left;
+ margin-top: px2rem(12);
+ margin-left: px2rem(29);
+ }
+
+ span {
+ float: left;
+ }
+ }
+ }
}
.guildList {
width: px2rem(694);
- height: px2rem(1000);
+ height: 11rem;
border-radius: px2rem(20);
- margin: px2rem(-125) auto px2rem(0);
+ margin: -0.3rem auto px2rem(0);
position: relative;
background: #fff;
overflow: hidden;
@@ -265,7 +305,7 @@ body {
ul {
width: 100%;
- height: 11.8rem;
+ height: 11rem;
margin: px2rem(39) auto 0;
overflow-y: scroll;
@@ -337,7 +377,7 @@ body {
.but {
width: px2rem(88);
height: px2rem(42);
- background: #7F95FF;
+ background: #62D0A8;
border-radius: px2rem(42);
position: absolute;
right: px2rem(26);
@@ -345,7 +385,7 @@ body {
text-align: center;
color: #fff;
line-height: px2rem(42);
- font-size: px2rem(26);
+ font-size: px2rem(22);
font-weight: 400;
}
@@ -439,4 +479,100 @@ body {
}
}
}
+}
+
+.inveMember {
+ width: px2rem(306);
+ height: px2rem(96);
+ border-radius: px2rem(96);
+ line-height: px2rem(92);
+ text-align: center;
+ background: linear-gradient(90deg, #7CDD9B, #62D0A8);
+ color: #fff;
+ font-size: px2rem(34);
+ position: fixed;
+ left: 50%;
+ transform: translateX(-50%);
+ z-index: 5;
+ bottom: px2rem(80);
+
+ img {
+ display: inline-block;
+ width: px2rem(38);
+ height: px2rem(42);
+ vertical-align: middle;
+ margin-top: -0.1rem;
+ }
+
+ span {
+ display: inline-block;
+ vertical-align: middle;
+ }
+}
+
+.arabic {
+ .guildList .top img {
+ right: px2rem(30);
+ }
+
+ .guildList .top input {
+ padding-right: 0.5rem;
+ }
+
+ .guildList ul li .but {
+ left: 0.34667rem;
+ right: auto;
+ }
+
+ .guildList ul li .chairman,
+ .guildList ul li .administrator {
+ right: 0.1rem;
+ left: auto;
+ }
+
+ .guildList ul li .tx,
+ .guildList ul li .user {
+ float: right;
+ }
+
+ .guildList ul li .user {
+ padding-right: 0.2rem;
+ }
+
+ .header .headerBox div img {
+ float: right;
+ }
+
+ .header .headerBox div span {
+ float: right;
+ }
+
+}
+
+.english {
+ .header .headerBox {
+ width: 8rem;
+
+ div {
+ width: 3.9rem;
+
+ span {
+ font-size: px2rem(16);
+ }
+ }
+ }
+}
+
+.arabic {
+ .header .headerBox {
+ width: 8rem;
+
+ div {
+ width: 3.9rem;
+
+ span {
+ font-size: px2rem(22);
+ }
+ }
+ }
}
\ No newline at end of file
diff --git a/view/molistar/modules/guildAr/css/lay-picker.min.css b/view/molistar/modules/guildAr/css/lay-picker.min.css
new file mode 100644
index 0000000..a814ae0
--- /dev/null
+++ b/view/molistar/modules/guildAr/css/lay-picker.min.css
@@ -0,0 +1,9 @@
+/**
+ *
+ * 移动端底部抽屉选择器
+ * @author yyq
+ * @CSDN 慕云枫
+ * @date 2023-12-07
+ * @version 1.5
+ */
+ul,li{margin:0;padding:0}.lay-picker{position:fixed;left:0;top:0;width:100%;height:100%;z-index:99999999999999;display:none;overflow:hidden}.lay-picker-shade{position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:9}.lay-picker-container{position:absolute;left:0;bottom:0;z-index:99;width:100%;background:#fff;color:#333;font-size:17px;-webkit-transition:transform .25s;-webkit-transform:translate3d(0,100%,0);transition:transform .25s;transform:translate3d(0,100%,0)}.lay-picker-header{height:50px;line-height:50px;border-bottom:1px solid #f3f3f3;margin-bottom:1px;margin:0 15px}.lay-picker-title{text-align:center;position:absolute;top:0;left:0;z-index:9;width:100%;color:#333}.lay-picker-search{margin:0 15px;text-align:center;padding:5px 0}.lay-picker-search input{text-align:center;height:40px;line-height:40px;border:0;border-bottom:1px solid #f3f3f3;transition:all .2s;-webkit-transition:all .2s;box-shadow:none !important;font-size:14px}.lay-picker-search input:hover,.lay-picker-search input:focus{border:none !important;border-bottom:1px solid #e5e5e5 !important}.lay-picker-btn{position:relative;z-index:99}.lay-picker-cancel{color:#333}.lay-picker-confirm{float:right;color:#228fff}.lay-picker-shadowup,.lay-picker-shadowdown{height:120px;width:100%;position:absolute;left:0;z-index:50}.lay-picker-shadowup{height:115px;top:-1px;background:-webkit-linear-gradient(to bottom,#FFF,rgba(255,255,255,.6));background:linear-gradient(to bottom,#FFF,rgba(255,255,255,.6));pointer-events:none;border-bottom:1px solid #efefef}.lay-picker-shadowdown{height:130px;bottom:0;background:-webkit-linear-gradient(to top,#FFF,rgba(255,255,255,.6));background:linear-gradient(to top,#FFF,rgba(255,255,255,.6));pointer-events:none;border-top:1px solid #efefef}.lay-picker-content{position:relative;height:300px;margin:15px;overflow:hidden}.lay-picker-box{overflow:hidden}.lay-picker-box:after{display:table;height:0;clear:both;content:''}.lay-picker-list-wrap{float:left;height:300px;overflow:hidden;-webkit-transition:width .2s;transition:width .2s}.lay-picker-list-wrap ul{position:relative;padding:100px 0;margin-top:17px;-webkit-transition:transform .1s ease-out;transition:transform .1s ease-out}.lay-picker-list-wrap ul:after{position:absolute;top:0;left:0;right:0;bottom:0;z-index:55;content:''}.lay-picker-list-wrap li{line-height:50px;height:50px;text-align:center;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.lay-picker-bottom{text-align:center;margin-top:10px;margin-bottom:30px;font-size:16px}.lay-picker-bottom-btn{border-radius:6px;display:inline-block;width:30%;height:40px;line-height:40px}.lay-picker-bottom-btn-cancel{color:#333;background:#efefef;margin-right:3%}.lay-picker-bottom-btn-confirm{color:#fff;background:#33c119}
diff --git a/view/molistar/modules/guildAr/css/memberFlow.css b/view/molistar/modules/guildAr/css/memberFlow.css
index 827c5ea..a7eb378 100644
--- a/view/molistar/modules/guildAr/css/memberFlow.css
+++ b/view/molistar/modules/guildAr/css/memberFlow.css
@@ -38,6 +38,8 @@ body {
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
+ width: 100%;
+ text-align: center;
}
.back .text {
@@ -50,207 +52,292 @@ body {
font-size: 0.4rem;
}
-.timeBox {
+.header {
width: 9.46667rem;
- height: 2.54667rem;
+ height: 4.18667rem;
background: #fff;
border-radius: 0.4rem;
- margin: 2.53333rem auto 0.25333rem;
- position: relative;
-}
-
-.timeBox .line {
- width: 0.02667rem;
- height: 1.90667rem;
- background: #D7DCE6;
- position: absolute;
- left: 2.92rem;
- top: 50%;
- transform: translateY(-50%);
- border-radius: 0.02667rem;
-}
-
-.timeBox .year {
- width: 2.92rem;
- position: absolute;
- left: 0;
- top: 0.33333rem;
- color: #A4ABB2;
- font-size: 0.32rem;
- font-weight: bold;
- text-align: center;
- text-indent: -0.8rem;
-}
-
-.timeBox .startTime {
- width: 2.92rem;
- position: absolute;
- left: 0;
- top: 0.96rem;
- color: #848D9C;
- font-size: 0.37333rem;
- font-weight: bold;
-}
-
-.timeBox .startTime b {
- margin-right: 0.1rem;
- text-indent: 0.45rem;
- display: inline-block;
-}
-
-.timeBox .startTime img {
- width: 0.32rem;
- height: 0.21333rem;
- display: inline-block;
- margin-top: 0.1rem;
-}
-
-.timeBox .endTime {
- width: 2.92rem;
- position: absolute;
- left: 0;
- top: 1.62667rem;
- color: #848D9C;
- font-size: 0.37333rem;
- font-weight: bold;
-}
-
-.timeBox .endTime b {
- margin-right: 0.1rem;
- text-indent: 0.45rem;
- display: inline-block;
-}
-
-.timeBox .endTime img {
- width: 0.32rem;
- height: 0.21333rem;
- display: inline-block;
- margin-top: 0.1rem;
-}
-
-.timeBox .right {
- width: 5.5rem;
- height: 2.54667rem;
- position: absolute;
- right: 0.55rem;
- top: 0;
- display: flex;
- justify-content: space-between;
-}
-
-.timeBox .right div {
- width: 50%;
- text-align: center;
+ margin: 2.8rem auto 0.34667rem;
overflow: hidden;
}
-.timeBox .right div p {
- color: #A4ABB2;
- font-size: 0.32rem;
- font-weight: bold;
- margin-top: 0.53333rem;
- margin-bottom: 0.33333rem;
- line-height: 0.34rem;
-}
-
-.timeBox .right div b {
- color: #848D9C;
- font-size: 0.37333rem;
- font-weight: bold;
-}
-
-.list {
- width: 9.46667rem;
- height: 12.8rem;
- background: #fff;
- border-radius: 0.4rem;
- margin: 0.25333rem auto 0.13333rem;
- overflow-y: scroll;
- position: relative;
- padding-top: 1.45rem;
- box-sizing: border-box;
-}
-
-.list::-webkit-scrollbar {
- display: none;
-}
-
-.list .top {
- height: 1.5rem;
- width: 9.46667rem;
- box-sizing: border-box;
- padding: 0.53333rem 0.26667rem 0;
+.header .time {
+ width: 100%;
+ height: 0.53333rem;
+ line-height: 0.53333rem;
display: flex;
justify-content: space-between;
- line-height: 0.4rem;
+ box-sizing: border-box;
+ margin: 0.38667rem auto 0.76rem;
+ text-align: center;
+ padding: 0 0.53333rem;
+ color: #848D9C;
+ font-size: 0.4rem;
+ font-weight: 500;
+}
+
+.header .time div {
+ width: 3.06667rem;
+}
+
+.header .time div b {
+ display: inline-block;
+ vertical-align: middle;
+}
+
+.header .time div img {
+ width: 0.32rem;
+ height: 0.21333rem;
+ display: inline-block;
+ vertical-align: middle;
+ margin-left: 0.13333rem;
+}
+
+.header .time span {
+ display: block;
+ width: 0.53333rem;
+ height: 0.05333rem;
+ background: #848D9C;
+ margin-top: 0.25rem;
+}
+
+.header h3 {
+ width: 100%;
+ box-sizing: border-box;
+ padding-left: 0.65333rem;
+ color: #141515;
+ font-size: 0.45333rem;
+ font-weight: 500;
+ margin-bottom: 0.72rem;
+}
+
+.header p {
+ height: 0.53333rem;
+ line-height: 0.53333rem;
+ width: 100%;
+ text-align: center;
+ color: #232424;
+ font-size: 0.69333rem;
+ font-weight: 500;
+}
+
+.header p img {
+ display: inline-block;
+ width: 0.53333rem;
+ height: 0.53333rem;
+}
+
+.box {
+ width: 9.46667rem;
+ min-height: 10.66667rem;
+ background: #fff;
+ border-radius: 0.4rem;
+ margin: 0 auto 0.4rem;
+ box-sizing: border-box;
+ padding: 0.49333rem 0rem 0 0.30667rem;
+}
+
+.box h3 {
+ color: #141515;
+ font-size: 0.45333rem;
+ font-weight: 600;
+ margin: 0;
+ margin-left: 0.26667rem;
+ margin-bottom: 0.50667rem;
+}
+
+.box h3 span {
+ display: inline-block;
+ width: 0.06667rem;
+ height: 0.37333rem;
+ margin-left: -0.17333rem;
+ background: #62D0A8;
+ margin-right: 0.13333rem;
+}
+
+.box .box_in {
+ width: 100%;
+ height: 100%;
+ display: flex;
+}
+
+.box .box_in .fistBox {
+ width: 2.4rem;
+ float: left;
+}
+
+.box .box_in .fistBox .fist {
+ width: 2.26667rem;
+ height: 2.01333rem;
+ margin-right: 0.4rem;
+}
+
+.box .box_in .fistBox .fist .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: 0.37333rem;
+ margin-bottom: 0.30667rem;
+ white-space: nowrap;
+}
+
+.box .box_in .fistBox .fist .user {
+ position: relative;
+}
+
+.box .box_in .fistBox .fist .ts {
+ width: 0.42667rem;
+ height: 0.42667rem;
+ border-radius: 50%;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 0rem;
- background: #fff;
- border-radius: 0.4rem 0.4rem 0 0;
+ z-index: 2;
+ display: none;
}
-.list .top div {
- width: 25%;
+.box .box_in .fistBox .fist .ts i {
+ width: 100%;
+ border-radius: 0.16rem;
+ height: 0.16rem;
+ line-height: 0.16rem;
+ position: absolute;
+ bottom: 0;
+ left: 50%;
+ transform: translateX(-50%);
text-align: center;
- color: #5D95FF;
- font-size: 0.29333rem;
- font-weight: 600;
+ background: linear-gradient(90deg, #FFEB67, #FFFCE7);
+ color: #333333;
+ font-size: 0.16rem;
+ font-weight: 400;
+ font-style: normal;
}
-.list .other {
- width: 8.76rem;
- height: 2.01333rem;
- margin: 0 auto 0;
- border-bottom: 0.02667rem solid #D7DCE6;
- display: flex;
- justify-content: space-between;
-}
-
-.list .other:last-child {
- border: none;
-}
-
-.list .other div {
- width: 25%;
- text-align: center;
- height: 100%;
- line-height: 2.01333rem;
- color: #848D9C;
- font-size: 0.32rem;
- font-weight: 500;
- white-space: nowrap;
-}
-
-.list .other div img {
+.box .box_in .fistBox .fist .i {
+ display: block;
+}
+
+.box .box_in .fistBox .fist img {
display: block;
- margin: 0.45333rem auto 0.06667rem;
width: 0.42667rem;
height: 0.42667rem;
border-radius: 50%;
+ margin: 0 auto 0.06667rem;
}
-.list .other div p {
- width: 98%;
- height: 0.33333rem;
- line-height: 0.32rem;
+.box .box_in .fistBox .fist p {
+ width: 100%;
+ text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
+ color: #848D9C;
+ font-size: 0.32rem;
+ font-weight: 500;
+ margin-bottom: 0.06667rem;
+}
+
+.box .box_in .fistBox .fist b {
+ color: #A4ABB2;
+ font-size: 0.24rem;
+ font-weight: 500;
+ text-align: center;
+ display: block;
+ width: 100%;
+}
+
+.box .box_in .ordinaryBox {
+ height: 100%;
+ overflow-x: scroll;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 8rem;
+ height: 100%;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ width: 2.26667rem;
+ height: 2.01333rem;
+ float: left;
+ margin-right: 0.4rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: 0.37333rem;
+ margin-bottom: 0.30667rem;
+ white-space: nowrap;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
+ width: 100%;
text-align: center;
color: #848D9C;
font-size: 0.32rem;
- margin-bottom: 0.12rem;
+ font-weight: 500;
+ line-height: 1.2rem;
+ white-space: nowrap;
}
-.list .other div .id {
- width: 100%;
- text-align: center;
- color: #A4ABB2;
- font-size: 0.24rem;
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
+ color: #4EA686;
}
-.list .other .div11 {
- line-height: 0rem;
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
+ color: #DC865D;
+}
+
+.box .box_in .fistBox .fistAct .title {
+ opacity: 0;
+}
+
+.box .box_in .ordinaryBox_inAct .ordinary .title {
+ opacity: 0;
+ margin-bottom: -0.26667rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 11.6rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ width: 3.2rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
+ font-size: 0.30667rem;
+}
+
+.arabic .box .box_in .fistBox .fist {
+ margin-right: 0;
+ margin-left: 0.4rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 10rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ width: 2.8rem;
+}
+
+.arabic .header h3 {
+ margin-right: 0.3rem;
+}
+
+.arabic .box h3 span {
+ margin-right: 0.3rem;
+ margin-left: 0;
+}
+
+.arabic .box h3 b {
+ margin-right: 0.3rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ float: right;
}
diff --git a/view/molistar/modules/guildAr/css/memberFlow.scss b/view/molistar/modules/guildAr/css/memberFlow.scss
index 4695f09..017ffd2 100644
--- a/view/molistar/modules/guildAr/css/memberFlow.scss
+++ b/view/molistar/modules/guildAr/css/memberFlow.scss
@@ -41,6 +41,8 @@ body {
color: #333333;
font-size: px2rem(34);
font-weight: bold;
+ width: 100%;
+ text-align: center;
}
.text {
@@ -54,211 +56,310 @@ body {
}
}
-.timeBox {
+.header {
width: px2rem(710);
- height: px2rem(191);
+ height: px2rem(314);
background: #fff;
border-radius: px2rem(30);
- margin: px2rem(190) auto px2rem(19);
- position: relative;
+ margin: px2rem(210) auto px2rem(26);
+ overflow: hidden;
- .line {
- width: px2rem(2);
- height: px2rem(143);
- background: #D7DCE6;
- position: absolute;
- left: px2rem(219);
- top: 50%;
- transform: translateY(-50%);
- border-radius: px2rem(2);
- }
-
- .year {
- width: px2rem(219);
- position: absolute;
- left: 0;
- top: px2rem(25);
- color: #A4ABB2;
- font-size: px2rem(24);
- font-weight: bold;
- text-align: center;
- text-indent: -0.8rem;
- }
-
- .startTime {
- width: px2rem(219);
- position: absolute;
- left: 0;
- top: px2rem(72);
- color: #848D9C;
- font-size: px2rem(28);
- font-weight: bold;
- // text-align: center;
-
- b {
- margin-right: 0.1rem;
- text-indent: 0.45rem;
- display: inline-block;
- }
-
- img {
- width: px2rem(24);
- height: px2rem(16);
- display: inline-block;
- margin-top: 0.1rem;
- }
- }
-
- .endTime {
- width: px2rem(219);
- position: absolute;
- left: 0;
- top: px2rem(122);
- color: #848D9C;
- font-size: px2rem(28);
- font-weight: bold;
- // text-align: center;
-
- b {
- margin-right: 0.1rem;
- text-indent: 0.45rem;
- display: inline-block;
- }
-
- img {
- width: px2rem(24);
- height: px2rem(16);
- display: inline-block;
- margin-top: 0.1rem;
- }
- }
-
- .right {
- width: 5.5rem;
- height: px2rem(191);
- position: absolute;
- right: 0.55rem;
- top: 0;
+ .time {
+ width: 100%;
+ height: px2rem(40);
+ line-height: px2rem(40);
display: flex;
justify-content: space-between;
+ box-sizing: border-box;
+ margin: px2rem(29) auto px2rem(57);
+ text-align: center;
+ padding: 0 px2rem(40);
+ color: #848D9C;
+ font-size: px2rem(30);
+ font-weight: 500;
div {
- width: 50%;
- text-align: center;
- overflow: hidden;
-
- p {
- color: #A4ABB2;
- font-size: px2rem(24);
- font-weight: bold;
- margin-top: px2rem(40);
- margin-bottom: px2rem(25);
- line-height: 0.34rem;
- }
+ width: px2rem(230);
b {
- color: #848D9C;
- font-size: px2rem(28);
- font-weight: bold;
+ display: inline-block;
+ vertical-align: middle;
+ }
+
+ img {
+ width: px2rem(24);
+ height: px2rem(16);
+ display: inline-block;
+ vertical-align: middle;
+ margin-left: px2rem(10);
+ }
+ }
+
+ span {
+ display: block;
+ width: px2rem(40);
+ height: px2rem(4);
+ background: #848D9C;
+ margin-top: 0.25rem;
+ }
+ }
+
+ h3 {
+ width: 100%;
+ box-sizing: border-box;
+ padding-left: px2rem(49);
+ color: #141515;
+ font-size: px2rem(34);
+ font-weight: 500;
+ margin-bottom: px2rem(54);
+ }
+
+ p {
+ height: px2rem(40);
+ line-height: px2rem(40);
+ width: 100%;
+ text-align: center;
+ color: #232424;
+ font-size: px2rem(52);
+ font-weight: 500;
+
+ img {
+ display: inline-block;
+ width: px2rem(40);
+ height: px2rem(40);
+ }
+ }
+}
+
+.box {
+ width: px2rem(710);
+ min-height: px2rem(800);
+ background: #fff;
+ border-radius: px2rem(30);
+ margin: 0 auto px2rem(30);
+ box-sizing: border-box;
+ padding: px2rem(37) px2rem(0) 0 px2rem(23);
+
+ h3 {
+ color: #141515;
+ font-size: px2rem(34);
+ font-weight: 600;
+ margin: 0;
+ margin-left: px2rem(20);
+ margin-bottom: px2rem(38);
+
+ span {
+ display: inline-block;
+ width: px2rem(5);
+ height: px2rem(28);
+ margin-left: px2rem(-13);
+ background: #62D0A8;
+ margin-right: px2rem(10);
+ }
+ }
+
+ .box_in {
+ width: 100%;
+ height: 100%;
+ display: flex;
+
+ .fistBox {
+ width: px2rem(180);
+ float: left;
+
+ .fist {
+ width: px2rem(170);
+ height: px2rem(151);
+ margin-right: px2rem(30);
+
+ .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: px2rem(28);
+ margin-bottom: px2rem(23);
+ white-space: nowrap;
+ }
+
+ .user {
+ position: relative;
+ }
+
+ .ts {
+ width: px2rem(32);
+ height: px2rem(32);
+ border-radius: 50%;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: px2rem(0);
+ z-index: 2;
+ display: none;
+
+ i {
+ width: 100%;
+ border-radius: px2rem(12);
+ height: px2rem(12);
+ line-height: px2rem(12);
+ position: absolute;
+ bottom: 0;
+ left: 50%;
+ transform: translateX(-50%);
+ text-align: center;
+ background: linear-gradient(90deg, #FFEB67, #FFFCE7);
+ color: #333333;
+ font-size: px2rem(12);
+ font-weight: 400;
+ font-style: normal;
+ }
+ }
+
+ .i {
+ display: block;
+ }
+
+ img {
+ display: block;
+ width: px2rem(32);
+ height: px2rem(32);
+ border-radius: 50%;
+ margin: 0 auto px2rem(5);
+ }
+
+ p {
+ width: 100%;
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #848D9C;
+ font-size: px2rem(24);
+ font-weight: 500;
+ margin-bottom: px2rem(5);
+ }
+
+ b {
+ color: #A4ABB2;
+ font-size: px2rem(18);
+ font-weight: 500;
+ text-align: center;
+ display: block;
+ width: 100%;
+ }
+ }
+ }
+
+ .ordinaryBox {
+ height: 100%;
+ overflow-x: scroll;
+
+ &::-webkit-scrollbar {
+ // display: none;
+ }
+
+ .ordinaryBox_in {
+ width: 8rem;
+ height: 100%;
+
+ .ordinary {
+ width: px2rem(170);
+ height: px2rem(151);
+ float: left;
+ margin-right: px2rem(30);
+
+ .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: px2rem(28);
+ margin-bottom: px2rem(23);
+ white-space: nowrap;
+ }
+
+ p {
+ width: 100%;
+ text-align: center;
+ color: #848D9C;
+ font-size: px2rem(24);
+ font-weight: 500;
+ line-height: px2rem(90);
+ white-space: nowrap;
+ }
+
+ .true {
+ color: #4EA686;
+ }
+
+ .false {
+ color: #DC865D;
+ }
+ }
+ }
+ }
+
+ .fistBox .fistAct {
+ .title {
+ opacity: 0;
+ }
+ }
+
+ .ordinaryBox_inAct .ordinary {
+ .title {
+ opacity: 0;
+ margin-bottom: px2rem(-20);
}
}
}
}
-.list {
- width: px2rem(710);
- height: px2rem(960);
- background: #fff;
- border-radius: px2rem(30);
- margin: px2rem(19) auto px2rem(10);
- overflow-y: scroll;
- position: relative;
- padding-top: 1.45rem;
- box-sizing: border-box;
+.english {
+ .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 11.6rem;
- &::-webkit-scrollbar {
- display: none;
+ .ordinary {
+ width: 3.2rem;
+
+ .title {
+ font-size: px2rem(23);
+ }
+ }
+ }
+}
+
+.arabic {
+ .box .box_in .fistBox .fist {
+ margin-right: 0;
+ margin-left: 0.4rem;
}
- .top {
- height: 1.5rem;
- width: px2rem(710);
- box-sizing: border-box;
- padding: px2rem(40) px2rem(20) 0;
- display: flex;
- justify-content: space-between;
- line-height: 0.4rem;
- position: absolute;
- left: 50%;
- transform: translateX(-50%);
- // top: 5.3rem;
- top: 0rem;
- background: #fff;
- border-radius: px2rem(30) px2rem(30) 0 0;
+ .box .box_in .ordinaryBox {
+ .ordinaryBox_in {
+ width: 10rem;
- div {
- width: 25%;
- text-align: center;
- color: #5D95FF;
- font-size: px2rem(22);
- font-weight: 600;
+ .ordinary {
+ width: 2.8rem;
+
+ .title {
+ // font-size: px2rem(28);
+ }
+ }
}
}
- .other {
- width: px2rem(657);
- height: px2rem(151);
- margin: 0 auto 0;
- border-bottom: px2rem(2) solid #D7DCE6;
- display: flex;
- justify-content: space-between;
- // background: pink;
+ .header h3 {
+ margin-right: 0.3rem;
+ }
- &:last-child {
- border: none;
- }
+ .box h3 span {
+ margin-right: 0.3rem;
+ margin-left: 0;
+ }
- div {
- width: 25%;
- text-align: center;
- height: 100%;
- line-height: px2rem(151);
- color: #848D9C;
- font-size: px2rem(24);
- font-weight: 500;
- white-space: nowrap;
+ .box h3 b {
+ margin-right: 0.3rem;
+ }
- img {
- display: block;
- margin: px2rem(34) auto px2rem(5);
- width: px2rem(32);
- height: px2rem(32);
- border-radius: 50%;
- }
-
- p {
- width: 98%;
- height: px2rem(25);
- line-height: 0.32rem;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- text-align: center;
- color: #848D9C;
- font-size: px2rem(24);
- margin-bottom: px2rem(9);
- }
-
- .id {
- width: 100%;
- text-align: center;
- color: #A4ABB2;
- font-size: px2rem(18);
- }
- }
-
- .div11 {
- line-height: 0rem;
- }
+ .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ float: right;
}
}
\ No newline at end of file
diff --git a/view/molistar/modules/guildAr/css/memberFlow2.css b/view/molistar/modules/guildAr/css/memberFlow2.css
index 1bf92ff..309e300 100644
--- a/view/molistar/modules/guildAr/css/memberFlow2.css
+++ b/view/molistar/modules/guildAr/css/memberFlow2.css
@@ -38,6 +38,7 @@ body {
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
+ width: 100%;
}
.back .text {
@@ -50,220 +51,472 @@ body {
font-size: 0.4rem;
}
-.timeBox {
+.header {
width: 9.46667rem;
- height: 2.54667rem;
+ height: 6.34667rem;
background: #fff;
border-radius: 0.4rem;
- margin: 2.53333rem auto 0.25333rem;
- position: relative;
-}
-
-.timeBox .line {
- width: 0.02667rem;
- height: 1.90667rem;
- background: #D7DCE6;
- position: absolute;
- left: 2.92rem;
- top: 50%;
- transform: translateY(-50%);
- border-radius: 0.02667rem;
-}
-
-.timeBox .year {
- width: 2.92rem;
- position: absolute;
- left: 0;
- top: 0.33333rem;
- color: #A4ABB2;
- font-size: 0.32rem;
- font-weight: bold;
- text-align: center;
- text-indent: -0.8rem;
-}
-
-.timeBox .startTime {
- width: 2.92rem;
- position: absolute;
- left: 0;
- top: 0.96rem;
- color: #848D9C;
- font-size: 0.37333rem;
- font-weight: bold;
-}
-
-.timeBox .startTime b {
- margin-right: 0.1rem;
- text-indent: 0.45rem;
- display: inline-block;
-}
-
-.timeBox .startTime img {
- width: 0.32rem;
- height: 0.21333rem;
- display: inline-block;
- margin-top: 0.1rem;
-}
-
-.timeBox .endTime {
- width: 2.92rem;
- position: absolute;
- left: 0;
- top: 1.62667rem;
- color: #848D9C;
- font-size: 0.37333rem;
- font-weight: bold;
-}
-
-.timeBox .endTime b {
- margin-right: 0.1rem;
- text-indent: 0.45rem;
- display: inline-block;
-}
-
-.timeBox .endTime img {
- width: 0.32rem;
- height: 0.21333rem;
- display: inline-block;
- margin-top: 0.1rem;
-}
-
-.timeBox .right {
- width: 5.5rem;
- height: 2.54667rem;
- position: absolute;
- right: 0.55rem;
- top: 0;
- display: flex;
- justify-content: space-between;
-}
-
-.timeBox .right div {
- width: 50%;
- text-align: center;
+ margin: 2.8rem auto 0.34667rem;
overflow: hidden;
position: relative;
}
-.timeBox .right div p {
- color: #A4ABB2;
- font-size: 0.32rem;
- font-weight: bold;
- margin-top: 0.53333rem;
- margin-bottom: 0.33333rem;
- line-height: 0.34rem;
-}
-
-.timeBox .right div b {
- color: #848D9C;
- font-size: 0.37333rem;
- font-weight: bold;
- position: absolute;
- left: 50%;
- transform: translateX(-50%);
- bottom: 0.6rem;
-}
-
-.timeBox .right .goToExchangeGold {
- position: absolute;
- top: 2.06667rem;
- right: 0rem;
- color: #D25555;
- font-size: 0.26667rem;
-}
-
-.list {
- width: 9.46667rem;
- height: 12.8rem;
- background: #fff;
- border-radius: 0.4rem;
- margin: 0.25333rem auto 0.13333rem;
- overflow-y: scroll;
- position: relative;
- padding-top: 1.45rem;
- box-sizing: border-box;
-}
-
-.list::-webkit-scrollbar {
- display: none;
-}
-
-.list .top {
- height: 1.5rem;
- width: 9.46667rem;
- box-sizing: border-box;
- padding: 0.53333rem 0.26667rem 0;
+.header .time {
+ width: 100%;
+ height: 0.53333rem;
+ line-height: 0.53333rem;
display: flex;
justify-content: space-between;
- line-height: 0.4rem;
- position: absolute;
- left: 50%;
- transform: translateX(-50%);
- top: 0;
- background: #fff;
- border-radius: 0.4rem 0.4rem 0 0;
-}
-
-.list .top div {
- width: 25%;
+ box-sizing: border-box;
+ margin: 0.38667rem auto 0.76rem;
text-align: center;
- color: #5D95FF;
- font-size: 0.29333rem;
- font-weight: 600;
-}
-
-.list .other {
- width: 8.76rem;
- height: 2.01333rem;
- margin: 0 auto 0;
- border-bottom: 0.02667rem solid #D7DCE6;
- display: flex;
- justify-content: space-between;
-}
-
-.list .other:last-child {
- border: none;
-}
-
-.list .other div {
- width: 25%;
- text-align: center;
- height: 100%;
- line-height: 2.01333rem;
+ padding: 0 0.26667rem;
color: #848D9C;
- font-size: 0.32rem;
+ font-size: 0.4rem;
font-weight: 500;
+}
+
+.header .time div {
+ color: #5D636E;
+ width: 4rem;
+}
+
+.header .time div b {
+ display: inline-block;
+ vertical-align: middle;
white-space: nowrap;
}
-.list .other div img {
- display: block;
- margin: 0.45333rem auto 0.06667rem;
- width: 0.42667rem;
- height: 0.42667rem;
- border-radius: 50%;
+.header .time div img {
+ width: 0.32rem;
+ height: 0.21333rem;
+ display: inline-block;
+ vertical-align: middle;
+ margin-left: 0.13333rem;
}
-.list .other div p {
- width: 98%;
- height: 0.33333rem;
- line-height: 0.32rem;
+.header .time span {
+ display: block;
+ width: 3rem;
+}
+
+.header h3 {
+ width: 100%;
+ box-sizing: border-box;
+ padding-left: 0.53333rem;
+ color: #141515;
+ font-size: 0.45333rem;
+ margin-bottom: 0.72rem;
+}
+
+.header p {
+ height: 0.53333rem;
+ line-height: 0.53333rem;
+ width: 100%;
+ text-align: center;
+ color: #232424;
+ font-size: 0.69333rem;
+ font-weight: 500;
+}
+
+.header p img {
+ display: inline-block;
+ width: 0.28rem;
+ height: 0.61333rem;
+ margin-top: -0.05rem;
+}
+
+.header .user {
+ width: 1.70667rem;
+ height: 1.14667rem;
+ position: absolute;
+ left: 0.88rem;
+ top: 1.4rem;
+ text-align: center;
+}
+
+.header .user img {
+ display: block;
+ width: 1.14667rem;
+ height: 1.14667rem;
+ border-radius: 50%;
+ margin: 0 auto 0.05333rem;
+}
+
+.header .user p {
+ width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
+ color: #333333;
+ font-size: 0.34667rem;
+ font-weight: 400;
+ margin-bottom: 0.02667rem;
+}
+
+.header .user b {
+ color: #A4ABB2;
+ font-size: 0.29333rem;
+}
+
+.header .line {
+ width: 8.76rem;
+ height: 0.01333rem;
+ background: #B0BACD;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: 3.88rem;
+}
+
+.header .line1 {
+ width: 0.01333rem;
+ height: 1.02667rem;
+ background: #B0BACD;
+ position: absolute;
+ left: 2.94667rem;
+ top: 4.65333rem;
+}
+
+.header .line2 {
+ width: 0.01333rem;
+ height: 1.02667rem;
+ background: #B0BACD;
+ position: absolute;
+ left: 6.37333rem;
+ top: 4.65333rem;
+}
+
+.header .datas {
+ width: 8.76rem;
+ height: 1.24rem;
+ margin: 1.24rem auto 0;
+ display: flex;
+ justify-content: space-between;
+}
+
+.header .datas div {
+ width: 2.54667rem;
+ text-align: center;
+}
+
+.header .datas div p {
+ color: #232424;
+ font-size: 0.48rem;
+ font-weight: 500;
+ margin-bottom: 0.30667rem;
+ width: 100%;
+}
+
+.header .datas div p img {
+ display: inline-block;
+ width: 0.4rem;
+ height: 0.4rem;
+ vertical-align: middle;
+}
+
+.header .datas div p .dor {
+ width: 0.25333rem;
+ height: 0.56rem;
+ margin-top: -0.05rem;
+}
+
+.header .datas div p b {
+ display: inline-block;
+ vertical-align: middle;
+}
+
+.header .datas div span {
+ color: #666666;
+ font-size: 0.37333rem;
+ font-weight: 400;
+ white-space: nowrap;
+}
+
+.datasAct .line1 {
+ left: 50%;
+ transform: translateX(-50%);
+}
+
+.datasAct .line2 {
+ display: none;
+}
+
+.datasAct .datas {
+ width: 7rem;
+}
+
+.datasAct .datas .datas3 {
+ display: none;
+}
+
+.box {
+ width: 9.46667rem;
+ min-height: 10.66667rem;
+ background: #fff;
+ border-radius: 0.4rem;
+ margin: 0 auto 0.4rem;
+ box-sizing: border-box;
+ padding: 0.49333rem 0rem 0 0.30667rem;
+}
+
+.box h3 {
+ color: #141515;
+ font-size: 0.45333rem;
+ font-weight: 600;
+ margin: 0;
+ margin-left: 0.26667rem;
+ margin-bottom: 0.50667rem;
+}
+
+.box h3 span {
+ display: inline-block;
+ width: 0.06667rem;
+ height: 0.37333rem;
+ margin-left: -0.17333rem;
+ background: #62D0A8;
+ margin-right: 0.13333rem;
+}
+
+.box .box_in {
+ width: 100%;
+ height: 100%;
+ display: flex;
+}
+
+.box .box_in .fistBox {
+ width: 2.4rem;
+ float: left;
+}
+
+.box .box_in .fistBox .fist {
+ width: 2.26667rem;
+ height: 2.01333rem;
+ margin-right: 0.4rem;
+}
+
+.box .box_in .fistBox .fist .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: 0.37333rem;
+ margin-bottom: 0.30667rem;
+ white-space: nowrap;
+}
+
+.box .box_in .fistBox .fist .user {
+ position: relative;
+}
+
+.box .box_in .fistBox .fist .ts {
+ width: 0.42667rem;
+ height: 0.42667rem;
+ border-radius: 50%;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: 0rem;
+ z-index: 2;
+ display: none;
+}
+
+.box .box_in .fistBox .fist .ts i {
+ width: 100%;
+ border-radius: 0.16rem;
+ height: 0.16rem;
+ line-height: 0.16rem;
+ position: absolute;
+ bottom: 0;
+ left: 50%;
+ transform: translateX(-50%);
+ text-align: center;
+ background: linear-gradient(90deg, #FFEB67, #FFFCE7);
+ color: #333333;
+ font-size: 0.16rem;
+ font-weight: 400;
+ font-style: normal;
+}
+
+.box .box_in .fistBox .fist .i {
+ display: block;
+}
+
+.box .box_in .fistBox .fist img {
+ display: block;
+ width: 0.42667rem;
+ height: 0.42667rem;
+ border-radius: 50%;
+ margin: 0 auto 0.06667rem;
+}
+
+.box .box_in .fistBox .fist p {
+ width: 100%;
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #848D9C;
+ font-size: 0.32rem;
+ font-weight: 500;
+ margin-bottom: 0.06667rem;
+}
+
+.box .box_in .fistBox .fist b {
+ color: #A4ABB2;
+ font-size: 0.24rem;
+ font-weight: 500;
+ text-align: center;
+ display: block;
+ width: 100%;
+}
+
+.box .box_in .ordinaryBox {
+ height: 100%;
+ overflow-x: scroll;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 13.5rem;
+ height: 100%;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ width: 2.26667rem;
+ height: 2.01333rem;
+ float: left;
+ margin-right: 0.4rem;
+ white-space: nowrap;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: 0.37333rem;
+ margin-bottom: 0.30667rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
+ width: 100%;
text-align: center;
color: #848D9C;
font-size: 0.32rem;
- margin-bottom: 0.12rem;
+ font-weight: 500;
+ line-height: 1.2rem;
}
-.list .other div .id {
- width: 100%;
- text-align: center;
- color: #A4ABB2;
- font-size: 0.24rem;
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
+ color: #4EA686;
}
-.list .other .div11 {
- line-height: 0rem;
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
+ color: #DC865D;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .details {
+ color: #269ceb;
+}
+
+.box .box_in .fistBox .fistAct .title {
+ opacity: 0;
+}
+
+.box .box_in .ordinaryBox_inAct .ordinary .title {
+ opacity: 0;
+ margin-bottom: -0.26667rem;
+}
+
+.english .header .time span {
+ font-size: 0.34667rem;
+}
+
+.english .header .datas div span {
+ font-size: 0.32rem;
+}
+
+.english .box h3 {
+ font-size: 0.4rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 15rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ width: 2.6rem;
+}
+
+.english .header .time span {
+ width: 2rem;
+ white-space: nowrap;
+ font-size: 0.32rem;
+}
+
+.english .header .time b {
+ white-space: nowrap;
+ font-size: 0.37333rem;
+}
+
+.english .header .time img {
+ margin-right: 0.1rem;
+}
+
+.english .header .time div {
+ width: 5rem;
+}
+
+.arabic .header h3 {
+ margin-right: 0.3rem;
+}
+
+.arabic .box h3 span {
+ margin-right: 0.3rem;
+ margin-left: 0;
+}
+
+.arabic .box h3 b {
+ margin-right: 0.3rem;
+}
+
+.arabic .box h3 strong {
+ margin-right: 0.3rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ float: right;
+}
+
+.arabic .box .box_in .ordinaryBox {
+ margin-right: 0.4rem;
+}
+
+.arabic .header .time span {
+ width: 2rem;
+ white-space: nowrap;
+ font-size: 0.32rem;
+}
+
+.arabic .header .time b {
+ white-space: nowrap;
+ font-size: 0.34667rem;
+}
+
+.arabic .header .time img {
+ margin-right: 0.1rem;
+}
+
+.arabic .header .time div {
+ width: 5rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ width: 3.2rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 18rem;
+}
+
+.arabic .header .datas div span {
+ font-size: 0.32rem;
}
diff --git a/view/molistar/modules/guildAr/css/memberFlow2.scss b/view/molistar/modules/guildAr/css/memberFlow2.scss
index b837f02..cb225f6 100644
--- a/view/molistar/modules/guildAr/css/memberFlow2.scss
+++ b/view/molistar/modules/guildAr/css/memberFlow2.scss
@@ -19,7 +19,7 @@ body {
color: #FFFFFF;
font-size: px2rem(38);
font-weight: bold;
- z-index: 10;
+ z-index: 10;
background: #fff;
.backs {
@@ -31,8 +31,6 @@ body {
z-index: 2;
}
-
-
.title {
position: absolute;
left: 50%;
@@ -43,6 +41,7 @@ body {
color: #333333;
font-size: px2rem(34);
font-weight: bold;
+ width: 100%;
}
.text {
@@ -56,223 +55,494 @@ body {
}
}
-.timeBox {
+.header {
width: px2rem(710);
- height: px2rem(191);
+ height: px2rem(476);
background: #fff;
border-radius: px2rem(30);
- margin: px2rem(190) auto px2rem(19);
+ margin: px2rem(210) auto px2rem(26);
+ overflow: hidden;
position: relative;
- .line {
- width: px2rem(2);
- height: px2rem(143);
- background: #D7DCE6;
- position: absolute;
- left: px2rem(219);
- top: 50%;
- transform: translateY(-50%);
- border-radius: px2rem(2);
- }
-
- .year {
- width: px2rem(219);
- position: absolute;
- left: 0;
- top: px2rem(25);
- color: #A4ABB2;
- font-size: px2rem(24);
- font-weight: bold;
+ .time {
+ width: 100%;
+ height: px2rem(40);
+ line-height: px2rem(40);
+ display: flex;
+ justify-content: space-between;
+ box-sizing: border-box;
+ margin: px2rem(29) auto px2rem(57);
text-align: center;
- text-indent: -0.8rem;
+ padding: 0 px2rem(20);
+ color: #848D9C;
+ font-size: px2rem(30);
+ font-weight: 500;
+
+ div {
+ color: #5D636E;
+ width: 4rem;
+
+ b {
+ display: inline-block;
+ vertical-align: middle;
+ white-space: nowrap;
+ }
+
+ img {
+ width: px2rem(24);
+ height: px2rem(16);
+ display: inline-block;
+ vertical-align: middle;
+ margin-left: px2rem(10);
+ }
+ }
+
+ span {
+ display: block;
+ width: 3rem;
+ }
}
- .startTime {
- width: px2rem(219);
- position: absolute;
- left: 0;
- top: px2rem(72);
- color: #848D9C;
- font-size: px2rem(28);
- font-weight: bold;
+ h3 {
+ width: 100%;
+ box-sizing: border-box;
+ padding-left: px2rem(40);
+ color: #141515;
+ font-size: px2rem(34);
+ // font-weight: 600;
+ margin-bottom: px2rem(54);
// text-align: center;
+ }
- b {
- margin-right: 0.1rem;
- text-indent: 0.45rem;
- display: inline-block;
- }
+ p {
+ height: px2rem(40);
+ line-height: px2rem(40);
+ width: 100%;
+ text-align: center;
+ color: #232424;
+ font-size: px2rem(52);
+ font-weight: 500;
img {
- width: px2rem(24);
- height: px2rem(16);
display: inline-block;
- margin-top: 0.1rem;
+ width: px2rem(21);
+ height: px2rem(46);
+ margin-top: -0.05rem;
}
}
- .endTime {
- width: px2rem(219);
+ .user {
+ width: px2rem(128);
+ height: px2rem(86);
position: absolute;
- left: 0;
- top: px2rem(122);
- color: #848D9C;
- font-size: px2rem(28);
- font-weight: bold;
- // text-align: center;
-
- b {
- margin-right: 0.1rem;
- text-indent: 0.45rem;
- display: inline-block;
- }
+ left: px2rem(66);
+ top: px2rem(105);
+ text-align: center;
img {
- width: px2rem(24);
- height: px2rem(16);
- display: inline-block;
- margin-top: 0.1rem;
+ display: block;
+ width: px2rem(86);
+ height: px2rem(86);
+ border-radius: 50%;
+ margin: 0 auto px2rem(4);
+ }
+
+ p {
+ width: 100%;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #333333;
+ font-size: px2rem(26);
+ font-weight: 400;
+ margin-bottom: px2rem(2);
+ }
+
+ b {
+ color: #A4ABB2;
+ font-size: px2rem(22);
}
}
- .right {
- width: 5.5rem;
- height: px2rem(191);
+ .line {
+ width: px2rem(657);
+ height: px2rem(1);
+ background: #B0BACD;
position: absolute;
- right: 0.55rem;
- top: 0;
+ left: 50%;
+ transform: translateX(-50%);
+ top: px2rem(291);
+ }
+
+ .line1 {
+ width: px2rem(1);
+ height: px2rem(77);
+ background: #B0BACD;
+ position: absolute;
+ left: px2rem(221);
+ top: px2rem(349);
+ }
+
+ .line2 {
+ width: px2rem(1);
+ height: px2rem(77);
+ background: #B0BACD;
+ position: absolute;
+ left: px2rem(478);
+ top: px2rem(349);
+ }
+
+ .datas {
+ width: px2rem(657);
+ height: px2rem(93);
+ margin: px2rem(93) auto 0;
display: flex;
justify-content: space-between;
div {
- width: 50%;
+ width: px2rem(191);
text-align: center;
- overflow: hidden;
- position: relative;
p {
- color: #A4ABB2;
- font-size: px2rem(24);
- font-weight: bold;
- margin-top: px2rem(40);
- margin-bottom: px2rem(25);
- line-height: 0.34rem;
+ color: #232424;
+ font-size: px2rem(36);
+ font-weight: 500;
+ margin-bottom: px2rem(23);
+ width: 100%;
+
+ img {
+ display: inline-block;
+ width: px2rem(30);
+ height: px2rem(30);
+ vertical-align: middle;
+ }
+
+ .dor {
+ width: px2rem(19);
+ height: px2rem(42);
+ margin-top: -0.05rem;
+ }
+
+ b {
+ display: inline-block;
+ vertical-align: middle;
+ }
}
- b {
- color: #848D9C;
+ span {
+ color: #666666;
font-size: px2rem(28);
- font-weight: bold;
- position: absolute;
- left: 50%;
- transform: translateX(-50%);
- bottom: px2rem(45);
+ font-weight: 400;
+ white-space: nowrap;
}
}
-
- .goToExchangeGold {
- position: absolute;
- top: px2rem(155);
- right: px2rem(0);
- color: #D25555;
- font-size: px2rem(20);
- }
}
}
-.list {
- width: px2rem(710);
- height: px2rem(960);
- background: #fff;
- border-radius: px2rem(30);
- margin: px2rem(19) auto px2rem(10);
- overflow-y: scroll;
- position: relative;
- padding-top: 1.45rem;
- box-sizing: border-box;
+.datasAct {
+ .line1 {
+ left: 50%;
+ transform: translateX(-50%);
+ }
- &::-webkit-scrollbar {
+ .line2 {
display: none;
}
- .top {
- height: 1.5rem;
- width: px2rem(710);
- box-sizing: border-box;
- padding: px2rem(40) px2rem(20) 0;
- display: flex;
- justify-content: space-between;
- line-height: 0.4rem;
- position: absolute;
- left: 50%;
- transform: translateX(-50%);
- // top: 5.3rem;
- top: 0;
- background: #fff;
- border-radius: px2rem(30) px2rem(30) 0 0;
- div {
- width: 25%;
- text-align: center;
- color: #5D95FF;
- font-size: px2rem(22);
- font-weight: 600;
+ .datas {
+ width: 7rem;
+
+ .datas3 {
+ display: none;
+ }
+ }
+}
+
+.box {
+ width: px2rem(710);
+ min-height: px2rem(800);
+ background: #fff;
+ border-radius: px2rem(30);
+ margin: 0 auto px2rem(30);
+ box-sizing: border-box;
+ padding: px2rem(37) px2rem(0) 0 px2rem(23);
+
+ h3 {
+ color: #141515;
+ font-size: px2rem(34);
+ font-weight: 600;
+ margin: 0;
+ margin-left: px2rem(20);
+ margin-bottom: px2rem(38);
+
+ span {
+ display: inline-block;
+ width: px2rem(5);
+ height: px2rem(28);
+ margin-left: px2rem(-13);
+ background: #62D0A8;
+ margin-right: px2rem(10);
}
}
- .other {
- width: px2rem(657);
- height: px2rem(151);
- margin: 0 auto 0;
- border-bottom: px2rem(2) solid #D7DCE6;
+ .box_in {
+ width: 100%;
+ height: 100%;
display: flex;
- justify-content: space-between;
- &:last-child {
- border: none;
+ .fistBox {
+ width: px2rem(180);
+ float: left;
+
+ .fist {
+ width: px2rem(170);
+ height: px2rem(151);
+ margin-right: px2rem(30);
+
+ .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: px2rem(28);
+ margin-bottom: px2rem(23);
+ white-space: nowrap;
+ }
+
+ .user {
+ position: relative;
+ }
+
+ .ts {
+ width: px2rem(32);
+ height: px2rem(32);
+ border-radius: 50%;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: px2rem(0);
+ z-index: 2;
+ display: none;
+
+ i {
+ width: 100%;
+ border-radius: px2rem(12);
+ height: px2rem(12);
+ line-height: px2rem(12);
+ position: absolute;
+ bottom: 0;
+ left: 50%;
+ transform: translateX(-50%);
+ text-align: center;
+ background: linear-gradient(90deg, #FFEB67, #FFFCE7);
+ color: #333333;
+ font-size: px2rem(12);
+ font-weight: 400;
+ font-style: normal;
+ }
+ }
+
+ .i {
+ display: block;
+ }
+
+ img {
+ display: block;
+ width: px2rem(32);
+ height: px2rem(32);
+ border-radius: 50%;
+ margin: 0 auto px2rem(5);
+ }
+
+ p {
+ width: 100%;
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #848D9C;
+ font-size: px2rem(24);
+ font-weight: 500;
+ margin-bottom: px2rem(5);
+ }
+
+ b {
+ color: #A4ABB2;
+ font-size: px2rem(18);
+ font-weight: 500;
+ text-align: center;
+ display: block;
+ width: 100%;
+ }
+ }
}
- div {
- width: 25%;
- text-align: center;
+ .ordinaryBox {
height: 100%;
- line-height: px2rem(151);
- color: #848D9C;
- font-size: px2rem(24);
- font-weight: 500;
- white-space: nowrap;
+ overflow-x: scroll;
- img {
- display: block;
- margin: px2rem(34) auto px2rem(5);
- width: px2rem(32);
- height: px2rem(32);
- border-radius: 50%;
+ &::-webkit-scrollbar {
+ // display: none;
}
- p {
- width: 98%;
- height: px2rem(25);
- line-height: 0.32rem;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- text-align: center;
- color: #848D9C;
- font-size: px2rem(24);
- margin-bottom: px2rem(9);
- }
+ .ordinaryBox_in {
+ width: 13.5rem;
+ height: 100%;
- .id {
- width: 100%;
- text-align: center;
- color: #A4ABB2;
- font-size: px2rem(18);
+ .ordinary {
+ width: px2rem(170);
+ height: px2rem(151);
+ float: left;
+ margin-right: px2rem(30);
+ white-space: nowrap;
+
+ .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: px2rem(28);
+ margin-bottom: px2rem(23);
+ }
+
+ p {
+ width: 100%;
+ text-align: center;
+ color: #848D9C;
+ font-size: px2rem(24);
+ font-weight: 500;
+ line-height: px2rem(90);
+ }
+
+ .true {
+ color: #4EA686;
+ }
+
+ .false {
+ color: #DC865D;
+ }
+
+ .details {
+ color: rgb(38, 156, 235);
+ }
+ }
}
}
- .div11 {
- line-height: 0rem;
+ .fistBox .fistAct {
+ .title {
+ opacity: 0;
+ }
}
+
+ .ordinaryBox_inAct .ordinary {
+ .title {
+ opacity: 0;
+ margin-bottom: px2rem(-20);
+ }
+ }
+ }
+}
+
+.english {
+ .header .time span {
+ font-size: px2rem(26);
+ }
+
+ .header .datas div span {
+ font-size: px2rem(24);
+ }
+
+ .box h3 {
+ font-size: px2rem(30);
+ }
+
+ .box .box_in .fistBox .fist {
+ // width: 4rem;
+ }
+
+ .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 15rem;
+
+ .ordinary {
+ width: 2.6rem;
+ }
+ }
+
+ .header .time span {
+ width: 2rem;
+ white-space: nowrap;
+ font-size: px2rem(24);
+ }
+
+ .header .time b {
+ white-space: nowrap;
+ font-size: px2rem(28);
+ }
+
+ .header .time img {
+ margin-right: 0.1rem;
+ }
+
+ .header .time div {
+ width: 5rem;
+ }
+}
+
+.arabic {
+
+ .header h3 {
+ margin-right: 0.3rem;
+ }
+
+ .box h3 span {
+ margin-right: 0.3rem;
+ margin-left: 0;
+ }
+
+ .box h3 b {
+ margin-right: 0.3rem;
+ }
+
+ .box h3 strong {
+ margin-right: 0.3rem;
+ }
+
+ .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ float: right;
+ }
+
+ .box .box_in .ordinaryBox {
+ margin-right: 0.4rem;
+ }
+
+ .header .time span {
+ width: 2rem;
+ white-space: nowrap;
+ font-size: px2rem(24);
+ }
+
+ .header .time b {
+ white-space: nowrap;
+ font-size: px2rem(26);
+ }
+
+ .header .time img {
+ margin-right: 0.1rem;
+ }
+
+ .header .time div {
+ width: 5rem;
+ }
+
+ .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ width: 3.2rem;
+ }
+
+ .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 18rem;
+ }
+
+ .header .datas div span {
+ font-size: px2rem(24);
}
}
\ No newline at end of file
diff --git a/view/molistar/modules/guildAr/css/memberFlow22.css b/view/molistar/modules/guildAr/css/memberFlow22.css
new file mode 100644
index 0000000..86d8d57
--- /dev/null
+++ b/view/molistar/modules/guildAr/css/memberFlow22.css
@@ -0,0 +1,488 @@
+html,
+body {
+ width: 100%;
+ height: 17.78667rem;
+ background: #F5F7F9;
+}
+
+.back {
+ width: 100%;
+ height: 2.4rem;
+ position: fixed;
+ left: 0;
+ top: 0rem;
+ text-align: center;
+ color: #FFFFFF;
+ font-size: 0.50667rem;
+ font-weight: bold;
+ z-index: 10;
+ background: #fff;
+}
+
+.back .backs {
+ width: 0.58667rem;
+ height: 0.58667rem;
+ position: absolute;
+ left: 0.24rem;
+ top: 58%;
+ z-index: 2;
+}
+
+.back .title {
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ height: 100%;
+ top: 0;
+ line-height: 3.46667rem;
+ color: #333333;
+ font-size: 0.45333rem;
+ font-weight: bold;
+ white-space: nowrap;
+}
+
+.back .text {
+ position: absolute;
+ right: 0.62667rem;
+ height: 100%;
+ top: 0;
+ line-height: 3.46667rem;
+ color: #333333;
+ font-size: 0.4rem;
+}
+
+.header {
+ width: 9.46667rem;
+ height: 6.34667rem;
+ background: #fff;
+ border-radius: 0.4rem;
+ margin: 2.8rem auto 0.34667rem;
+ overflow: hidden;
+ position: relative;
+}
+
+.header .time {
+ width: 100%;
+ height: 0.53333rem;
+ line-height: 0.53333rem;
+ display: flex;
+ justify-content: space-between;
+ box-sizing: border-box;
+ margin: 0.38667rem auto 0.76rem;
+ text-align: center;
+ padding: 0 0.26667rem;
+ color: #848D9C;
+ font-size: 0.4rem;
+ font-weight: 500;
+}
+
+.header .time div {
+ color: #5D636E;
+ width: 4rem;
+}
+
+.header .time div b {
+ display: inline-block;
+ vertical-align: middle;
+ white-space: nowrap;
+}
+
+.header .time div img {
+ width: 0.32rem;
+ height: 0.21333rem;
+ display: inline-block;
+ vertical-align: middle;
+ margin-left: 0.13333rem;
+}
+
+.header .time span {
+ display: block;
+ width: 3rem;
+}
+
+.header h3 {
+ width: 78%;
+ box-sizing: border-box;
+ padding-left: 0.65333rem;
+ color: #232424;
+ font-size: 0.37333rem;
+ font-weight: bold;
+ margin-bottom: 0.72rem;
+ text-align: center;
+ float: right;
+}
+
+.header p {
+ height: 0.53333rem;
+ line-height: 0.53333rem;
+ width: 70%;
+ text-align: center;
+ color: #232424;
+ font-size: 0.69333rem;
+ font-weight: 500;
+ float: right;
+}
+
+.header p img {
+ display: inline-block;
+ width: 0.28rem;
+ height: 0.61333rem;
+ margin-top: -0.05rem;
+}
+
+.header .user {
+ width: 1.70667rem;
+ height: 1.14667rem;
+ position: absolute;
+ left: 0.88rem;
+ top: 1.4rem;
+ text-align: center;
+}
+
+.header .user img {
+ display: block;
+ width: 1.14667rem;
+ height: 1.14667rem;
+ border-radius: 50%;
+ margin: 0 auto 0.05333rem;
+}
+
+.header .user p {
+ width: 100%;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #333333;
+ font-size: 0.34667rem;
+ font-weight: 400;
+ margin-bottom: 0.02667rem;
+}
+
+.header .user b {
+ color: #A4ABB2;
+ font-size: 0.29333rem;
+}
+
+.header .line {
+ width: 8.76rem;
+ height: 0.01333rem;
+ background: #B0BACD;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: 3.88rem;
+}
+
+.header .line1 {
+ width: 0.01333rem;
+ height: 1.02667rem;
+ background: #B0BACD;
+ position: absolute;
+ left: 2.94667rem;
+ top: 4.65333rem;
+}
+
+.header .line2 {
+ width: 0.01333rem;
+ height: 1.02667rem;
+ background: #B0BACD;
+ position: absolute;
+ left: 6.37333rem;
+ top: 4.65333rem;
+}
+
+.header .datas {
+ width: 8.76rem;
+ height: 1.24rem;
+ margin: 3.5rem auto 0;
+ display: flex;
+ justify-content: space-between;
+}
+
+.header .datas div {
+ width: 2.54667rem;
+ text-align: center;
+}
+
+.header .datas div p {
+ color: #232424;
+ font-size: 0.48rem;
+ font-weight: 500;
+ margin-bottom: 0.30667rem;
+ width: 100%;
+}
+
+.header .datas div p img {
+ display: inline-block;
+ width: 0.4rem;
+ height: 0.4rem;
+ vertical-align: middle;
+}
+
+.header .datas div p .dor {
+ width: 0.25333rem;
+ height: 0.56rem;
+ margin-top: -0.05rem;
+}
+
+.header .datas div p b {
+ display: inline-block;
+ vertical-align: middle;
+}
+
+.header .datas div span {
+ color: #666666;
+ font-size: 0.37333rem;
+ font-weight: 400;
+ white-space: nowrap;
+}
+
+.datasAct .line1 {
+ left: 50%;
+ transform: translateX(-50%);
+}
+
+.datasAct .line2 {
+ display: none;
+}
+
+.datasAct .datas {
+ width: 7rem;
+}
+
+.datasAct .datas .datas3 {
+ display: none;
+}
+
+.box {
+ width: 9.46667rem;
+ min-height: 10.66667rem;
+ background: #fff;
+ border-radius: 0.4rem;
+ margin: 0 auto 0.4rem;
+ box-sizing: border-box;
+ padding: 0.49333rem 0rem 0 0.30667rem;
+}
+
+.box h3 {
+ color: #141515;
+ font-size: 0.45333rem;
+ font-weight: 600;
+ margin: 0;
+ margin-left: 0.26667rem;
+ margin-bottom: 0.50667rem;
+}
+
+.box h3 span {
+ display: inline-block;
+ width: 0.06667rem;
+ height: 0.37333rem;
+ margin-left: -0.17333rem;
+ background: #62D0A8;
+ margin-right: 0.13333rem;
+}
+
+.box .box_in {
+ width: 100%;
+ height: 100%;
+ display: flex;
+}
+
+.box .box_in .fistBox {
+ width: 2.4rem;
+ float: left;
+}
+
+.box .box_in .fistBox .fist {
+ width: 2.26667rem;
+ height: 2.01333rem;
+ margin-right: 0.4rem;
+}
+
+.box .box_in .fistBox .fist .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: 0.37333rem;
+ margin-bottom: 0.30667rem;
+ white-space: nowrap;
+}
+
+.box .box_in .fistBox .fist img {
+ display: block;
+ width: 0.42667rem;
+ height: 0.42667rem;
+ border-radius: 50%;
+ margin: 0 auto 0.06667rem;
+}
+
+.box .box_in .fistBox .fist p {
+ width: 100%;
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #848D9C;
+ font-size: 0.32rem;
+ font-weight: 500;
+ margin-bottom: 0.06667rem;
+}
+
+.box .box_in .fistBox .fist b {
+ color: #A4ABB2;
+ font-size: 0.24rem;
+ font-weight: 500;
+ text-align: center;
+ display: block;
+ width: 100%;
+}
+
+.box .box_in .ordinaryBox {
+ height: 100%;
+ overflow-x: scroll;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 14.5rem;
+ height: 100%;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ min-width: 2.4rem;
+ height: 2.01333rem;
+ float: left;
+ margin-right: 0.4rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: 0.37333rem;
+ margin-bottom: 0.30667rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
+ width: 100%;
+ text-align: center;
+ color: #848D9C;
+ font-size: 0.32rem;
+ font-weight: 500;
+ line-height: 1.2rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
+ color: #4EA686;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
+ color: #DC865D;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .details {
+ color: #269ceb;
+}
+
+.box .box_in .fistBox .fistAct .title {
+ opacity: 0;
+}
+
+.box .box_in .ordinaryBox_inAct .ordinary .title {
+ opacity: 0;
+ margin-bottom: -0.26667rem;
+}
+
+.english .back .title {
+ font-size: 0.42667rem;
+}
+
+.english .header .datas div span {
+ font-size: 0.29333rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 15rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in .title {
+ font-size: 0.34667rem;
+}
+
+.english .header .time span {
+ width: 2rem;
+ white-space: nowrap;
+ font-size: 0.32rem;
+}
+
+.english .header .time b {
+ white-space: nowrap;
+ font-size: 0.37333rem;
+}
+
+.english .header .time img {
+ margin-right: 0.1rem;
+}
+
+.english .header .time div {
+ width: 5rem;
+}
+
+.arabic .back .title {
+ font-size: 0.42667rem;
+}
+
+.arabic .header .datas div span {
+ font-size: 0.29333rem;
+}
+
+.arabic .box h3 {
+ margin-right: 0.26667rem;
+}
+
+.arabic .box span {
+ margin-left: 0;
+ margin-right: 0;
+}
+
+.arabic .box h3 b {
+ margin-right: 0.3rem;
+}
+
+.arabic .box h3 strong {
+ margin-right: 0.3rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 20rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .title {
+ font-size: 0.33333rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ float: right;
+}
+
+.arabic .box .box_in .ordinaryBox {
+ margin-right: 0.4rem;
+}
+
+.arabic .header .time span {
+ width: 2rem;
+ white-space: nowrap;
+ font-size: 0.32rem;
+}
+
+.arabic .header .time b {
+ white-space: nowrap;
+ font-size: 0.34667rem;
+}
+
+.arabic .header .time img {
+ margin-right: 0.1rem;
+}
+
+.arabic .header .time div {
+ width: 5rem;
+}
diff --git a/view/molistar/modules/guildAr/css/memberFlow22.scss b/view/molistar/modules/guildAr/css/memberFlow22.scss
new file mode 100644
index 0000000..a24c6c0
--- /dev/null
+++ b/view/molistar/modules/guildAr/css/memberFlow22.scss
@@ -0,0 +1,508 @@
+@function px2rem($px) {
+ @return $px / 75+rem;
+}
+
+html,
+body {
+ width: 100%;
+ height: px2rem(1334);
+ background: #F5F7F9;
+}
+
+.back {
+ width: 100%;
+ height: px2rem(180);
+ position: fixed;
+ left: 0;
+ top: px2rem(0);
+ text-align: center;
+ color: #FFFFFF;
+ font-size: px2rem(38);
+ font-weight: bold;
+ z-index: 10;
+ background: #fff;
+
+ .backs {
+ width: px2rem(44);
+ height: px2rem(44);
+ position: absolute;
+ left: px2rem(18);
+ top: 58%;
+ z-index: 2;
+ }
+
+ .title {
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ height: 100%;
+ top: 0;
+ line-height: px2rem(260);
+ color: #333333;
+ font-size: px2rem(34);
+ font-weight: bold;
+ white-space: nowrap;
+ }
+
+ .text {
+ position: absolute;
+ right: px2rem(47);
+ height: 100%;
+ top: 0;
+ line-height: px2rem(260);
+ color: #333333;
+ font-size: px2rem(30);
+ }
+}
+
+.header {
+ width: px2rem(710);
+ height: px2rem(476);
+ background: #fff;
+ border-radius: px2rem(30);
+ margin: px2rem(210) auto px2rem(26);
+ overflow: hidden;
+ position: relative;
+
+ .time {
+ width: 100%;
+ height: px2rem(40);
+ line-height: px2rem(40);
+ display: flex;
+ justify-content: space-between;
+ box-sizing: border-box;
+ margin: px2rem(29) auto px2rem(57);
+ text-align: center;
+ padding: 0 px2rem(20);
+ color: #848D9C;
+ font-size: px2rem(30);
+ font-weight: 500;
+
+ div {
+ color: #5D636E;
+ width: 4rem;
+
+ b {
+ display: inline-block;
+ vertical-align: middle;
+ white-space: nowrap;
+ }
+
+ img {
+ width: px2rem(24);
+ height: px2rem(16);
+ display: inline-block;
+ vertical-align: middle;
+ margin-left: px2rem(10);
+ }
+ }
+
+ span {
+ display: block;
+ width: 3rem;
+ }
+ }
+
+ h3 {
+ width: 78%;
+ box-sizing: border-box;
+ padding-left: px2rem(49);
+ color: #232424;
+ font-size: px2rem(28);
+ font-weight: bold;
+ margin-bottom: px2rem(54);
+ text-align: center;
+ float: right;
+ }
+
+ p {
+ height: px2rem(40);
+ line-height: px2rem(40);
+ width: 70%;
+ text-align: center;
+ color: #232424;
+ font-size: px2rem(52);
+ font-weight: 500;
+ float: right;
+
+ img {
+ display: inline-block;
+ width: px2rem(21);
+ height: px2rem(46);
+ margin-top: -0.05rem;
+ }
+ }
+
+ .user {
+ width: px2rem(128);
+ height: px2rem(86);
+ position: absolute;
+ left: px2rem(66);
+ top: px2rem(105);
+ text-align: center;
+
+ img {
+ display: block;
+ width: px2rem(86);
+ height: px2rem(86);
+ border-radius: 50%;
+ margin: 0 auto px2rem(4);
+ }
+
+ p {
+ width: 100%;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #333333;
+ font-size: px2rem(26);
+ font-weight: 400;
+ margin-bottom: px2rem(2);
+ }
+
+ b {
+ color: #A4ABB2;
+ font-size: px2rem(22);
+ }
+ }
+
+ .line {
+ width: px2rem(657);
+ height: px2rem(1);
+ background: #B0BACD;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: px2rem(291);
+ }
+
+ .line1 {
+ width: px2rem(1);
+ height: px2rem(77);
+ background: #B0BACD;
+ position: absolute;
+ left: px2rem(221);
+ top: px2rem(349);
+ }
+
+ .line2 {
+ width: px2rem(1);
+ height: px2rem(77);
+ background: #B0BACD;
+ position: absolute;
+ left: px2rem(478);
+ top: px2rem(349);
+ }
+
+ .datas {
+ width: px2rem(657);
+ height: px2rem(93);
+ margin: 3.5rem auto 0;
+ display: flex;
+ justify-content: space-between;
+
+ div {
+ width: px2rem(191);
+ text-align: center;
+
+ p {
+ color: #232424;
+ font-size: px2rem(36);
+ font-weight: 500;
+ margin-bottom: px2rem(23);
+ width: 100%;
+
+ img {
+ display: inline-block;
+ width: px2rem(30);
+ height: px2rem(30);
+ vertical-align: middle;
+ }
+
+ .dor {
+ width: px2rem(19);
+ height: px2rem(42);
+ margin-top: -0.05rem;
+ }
+
+ b {
+ display: inline-block;
+ vertical-align: middle;
+ }
+ }
+
+ span {
+ color: #666666;
+ font-size: px2rem(28);
+ font-weight: 400;
+ white-space: nowrap;
+ }
+ }
+ }
+}
+
+.datasAct {
+ .line1 {
+ left: 50%;
+ transform: translateX(-50%);
+ }
+
+ .line2 {
+ display: none;
+ }
+
+
+ .datas {
+ width: 7rem;
+
+ .datas3 {
+ display: none;
+ }
+ }
+}
+
+.box {
+ width: px2rem(710);
+ min-height: px2rem(800);
+ background: #fff;
+ border-radius: px2rem(30);
+ margin: 0 auto px2rem(30);
+ box-sizing: border-box;
+ padding: px2rem(37) px2rem(0) 0 px2rem(23);
+
+ h3 {
+ color: #141515;
+ font-size: px2rem(34);
+ font-weight: 600;
+ margin: 0;
+ margin-left: px2rem(20);
+ margin-bottom: px2rem(38);
+
+ span {
+ display: inline-block;
+ width: px2rem(5);
+ height: px2rem(28);
+ margin-left: px2rem(-13);
+ background: #62D0A8;
+ margin-right: px2rem(10);
+ }
+ }
+
+ .box_in {
+ width: 100%;
+ height: 100%;
+ display: flex;
+
+ .fistBox {
+ width: px2rem(180);
+ float: left;
+
+ .fist {
+ width: px2rem(170);
+ height: px2rem(151);
+ margin-right: px2rem(30);
+
+ .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: px2rem(28);
+ margin-bottom: px2rem(23);
+ white-space: nowrap;
+ }
+
+ img {
+ display: block;
+ width: px2rem(32);
+ height: px2rem(32);
+ border-radius: 50%;
+ margin: 0 auto px2rem(5);
+ }
+
+ p {
+ width: 100%;
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #848D9C;
+ font-size: px2rem(24);
+ font-weight: 500;
+ margin-bottom: px2rem(5);
+ }
+
+ b {
+ color: #A4ABB2;
+ font-size: px2rem(18);
+ font-weight: 500;
+ text-align: center;
+ display: block;
+ width: 100%;
+ }
+ }
+ }
+
+ .ordinaryBox {
+ height: 100%;
+ overflow-x: scroll;
+
+ &::-webkit-scrollbar {
+ // display: none;
+ }
+
+ .ordinaryBox_in {
+ width: 14.5rem;
+ height: 100%;
+
+ .ordinary {
+ min-width: px2rem(180);
+ height: px2rem(151);
+ float: left;
+ margin-right: px2rem(30);
+
+ .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: px2rem(28);
+ margin-bottom: px2rem(23);
+ }
+
+ p {
+ width: 100%;
+ text-align: center;
+ color: #848D9C;
+ font-size: px2rem(24);
+ font-weight: 500;
+ line-height: px2rem(90);
+ }
+
+ .true {
+ color: #4EA686;
+ }
+
+ .false {
+ color: #DC865D;
+ }
+
+ .details {
+ color: rgb(38, 156, 235);
+ }
+ }
+ }
+ }
+
+ .fistBox .fistAct {
+ .title {
+ opacity: 0;
+ }
+ }
+
+ .ordinaryBox_inAct .ordinary {
+ .title {
+ opacity: 0;
+ margin-bottom: px2rem(-20);
+ }
+ }
+ }
+}
+
+.english {
+ .back .title {
+ font-size: px2rem(32);
+ }
+
+ .header .datas div span {
+ font-size: px2rem(22);
+ }
+
+ .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 15rem;
+
+ .title {
+ font-size: px2rem(26);
+ }
+ }
+
+ .header .time span {
+ width: 2rem;
+ white-space: nowrap;
+ font-size: px2rem(24);
+ }
+
+ .header .time b {
+ white-space: nowrap;
+ font-size: px2rem(28);
+ }
+
+ .header .time img {
+ margin-right: 0.1rem;
+ }
+
+ .header .time div {
+ width: 5rem;
+ }
+}
+
+.arabic {
+ .back .title {
+ font-size: px2rem(32);
+ }
+
+ .header .datas div span {
+ font-size: px2rem(22);
+ }
+
+ .box h3 {
+ margin-right: px2rem(20);
+ }
+
+ .box span {
+ // margin-right: px2rem();
+ margin-left: 0;
+ margin-right: 0;
+ }
+
+ .box h3 b {
+ margin-right: 0.3rem;
+ }
+
+ .box h3 strong {
+ margin-right: 0.3rem;
+ }
+
+ .box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 20rem;
+
+ .title {
+ font-size: px2rem(25);
+ }
+ }
+
+ .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ float: right;
+ }
+
+ .box .box_in .ordinaryBox {
+ margin-right: 0.4rem;
+ }
+
+ .header .time span {
+ width: 2rem;
+ white-space: nowrap;
+ font-size: px2rem(24);
+ }
+
+ .header .time b {
+ white-space: nowrap;
+ font-size: px2rem(26);
+ }
+
+ .header .time img {
+ margin-right: 0.1rem;
+ }
+
+ .header .time div {
+ width: 5rem;
+ }
+}
\ No newline at end of file
diff --git a/view/molistar/modules/guildAr/css/memberFlow3.css b/view/molistar/modules/guildAr/css/memberFlow3.css
new file mode 100644
index 0000000..c3b10b1
--- /dev/null
+++ b/view/molistar/modules/guildAr/css/memberFlow3.css
@@ -0,0 +1,344 @@
+html,
+body {
+ width: 100%;
+ height: 17.78667rem;
+ background: #F5F7F9;
+}
+
+.back {
+ width: 100%;
+ height: 2.4rem;
+ position: fixed;
+ left: 0;
+ top: 0rem;
+ text-align: center;
+ color: #FFFFFF;
+ font-size: 0.50667rem;
+ font-weight: bold;
+ z-index: 10;
+ background: #fff;
+}
+
+.back .backs {
+ width: 0.58667rem;
+ height: 0.58667rem;
+ position: absolute;
+ left: 0.24rem;
+ top: 58%;
+ z-index: 2;
+}
+
+.back .title {
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ height: 100%;
+ top: 0;
+ line-height: 3.46667rem;
+ color: #333333;
+ font-size: 0.45333rem;
+ font-weight: bold;
+}
+
+.back .text {
+ position: absolute;
+ right: 0.62667rem;
+ height: 100%;
+ top: 0;
+ line-height: 3.46667rem;
+ color: #333333;
+ font-size: 0.4rem;
+}
+
+.header {
+ width: 9.46667rem;
+ height: 6.34667rem;
+ background: #fff;
+ border-radius: 0.4rem;
+ margin: 2.8rem auto 0.34667rem;
+ overflow: hidden;
+ position: relative;
+}
+
+.header .time {
+ width: 100%;
+ height: 0.53333rem;
+ line-height: 0.53333rem;
+ display: flex;
+ justify-content: space-between;
+ box-sizing: border-box;
+ margin: 0.38667rem auto 0.76rem;
+ text-align: center;
+ padding: 0 0.26667rem;
+ color: #848D9C;
+ font-size: 0.4rem;
+ font-weight: 500;
+}
+
+.header .time div {
+ color: #5D636E;
+ width: 3rem;
+}
+
+.header .time span {
+ display: block;
+ width: 3rem;
+}
+
+.header h3 {
+ width: 100%;
+ box-sizing: border-box;
+ padding-left: 0.65333rem;
+ color: #141515;
+ font-size: 0.42667rem;
+ font-weight: 500;
+ margin-bottom: 0.72rem;
+}
+
+.header p {
+ height: 0.53333rem;
+ line-height: 0.53333rem;
+ width: 100%;
+ text-align: center;
+ color: #232424;
+ font-size: 0.69333rem;
+ font-weight: 500;
+}
+
+.header p img {
+ display: inline-block;
+ width: 0.53333rem;
+ height: 0.53333rem;
+}
+
+.header .user {
+ width: 1.70667rem;
+ height: 1.14667rem;
+ position: absolute;
+ left: 0.88rem;
+ top: 1.4rem;
+ text-align: center;
+}
+
+.header .user img {
+ display: block;
+ width: 1.14667rem;
+ height: 1.14667rem;
+ border-radius: 50%;
+ margin: 0 auto 0.05333rem;
+}
+
+.header .user p {
+ width: 100%;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #333333;
+ font-size: 0.34667rem;
+ font-weight: 400;
+ margin-bottom: 0.02667rem;
+}
+
+.header .user b {
+ color: #A4ABB2;
+ font-size: 0.29333rem;
+}
+
+.header .line {
+ width: 8.76rem;
+ height: 0.01333rem;
+ background: #B0BACD;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: 3.88rem;
+}
+
+.header .line1 {
+ width: 0.01333rem;
+ height: 1.02667rem;
+ background: #B0BACD;
+ position: absolute;
+ left: 2.94667rem;
+ top: 4.65333rem;
+}
+
+.header .line2 {
+ width: 0.01333rem;
+ height: 1.02667rem;
+ background: #B0BACD;
+ position: absolute;
+ left: 6.37333rem;
+ top: 4.65333rem;
+}
+
+.header .datas {
+ width: 8.76rem;
+ height: 1.24rem;
+ margin: 1.24rem auto 0;
+ display: flex;
+ justify-content: space-between;
+}
+
+.header .datas div {
+ width: 2.54667rem;
+ text-align: center;
+}
+
+.header .datas div p {
+ color: #232424;
+ font-size: 0.48rem;
+ font-weight: 500;
+ margin-bottom: 0.30667rem;
+ width: 100%;
+}
+
+.header .datas div p img {
+ display: inline-block;
+ width: 0.4rem;
+ height: 0.4rem;
+ vertical-align: middle;
+}
+
+.header .datas div p b {
+ display: inline-block;
+ vertical-align: middle;
+}
+
+.header .datas div span {
+ color: #666666;
+ font-size: 0.37333rem;
+ font-weight: 400;
+}
+
+.box {
+ width: 9.46667rem;
+ min-height: 10.66667rem;
+ background: #fff;
+ border-radius: 0.4rem;
+ margin: 0 auto 0.4rem;
+ box-sizing: border-box;
+ padding: 0.49333rem 0rem 0 0.30667rem;
+}
+
+.box h3 {
+ color: #141515;
+ font-size: 0.45333rem;
+ font-weight: 600;
+ margin: 0;
+ margin-left: 0.26667rem;
+ margin-bottom: 0.50667rem;
+}
+
+.box h3 span {
+ display: inline-block;
+ width: 0.06667rem;
+ height: 0.37333rem;
+ margin-left: -0.17333rem;
+ background: #62D0A8;
+ margin-right: 0.13333rem;
+}
+
+.box .box_in {
+ width: 100%;
+ height: 100%;
+ display: flex;
+}
+
+.box .box_in .fistBox {
+ width: 2.4rem;
+ float: left;
+}
+
+.box .box_in .fistBox .fist {
+ width: 2.26667rem;
+ height: 2.01333rem;
+ margin-right: 0.4rem;
+}
+
+.box .box_in .fistBox .fist .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: 0.37333rem;
+ margin-bottom: 0.30667rem;
+ white-space: nowrap;
+}
+
+.box .box_in .fistBox .fist img {
+ display: block;
+ width: 0.42667rem;
+ height: 0.42667rem;
+ border-radius: 50%;
+ margin: 0 auto 0.06667rem;
+}
+
+.box .box_in .fistBox .fist p {
+ width: 100%;
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #848D9C;
+ font-size: 0.32rem;
+ font-weight: 500;
+}
+
+.box .box_in .fistBox .fist b {
+ color: #A4ABB2;
+ font-size: 0.24rem;
+ font-weight: 500;
+ text-align: center;
+ display: block;
+ width: 100%;
+}
+
+.box .box_in .ordinaryBox {
+ height: 100%;
+ overflow-x: scroll;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in {
+ width: 15rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+ width: 2.26667rem;
+ height: 2.01333rem;
+ float: left;
+ margin-right: 0.4rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: 0.37333rem;
+ margin-bottom: 0.30667rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
+ width: 100%;
+ text-align: center;
+ color: #848D9C;
+ font-size: 0.32rem;
+ font-weight: 500;
+ line-height: 1.2rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
+ color: #4EA686;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
+ color: #DC865D;
+}
+
+.box .box_in .fistBox .fistAct .title {
+ opacity: 0;
+}
+
+.box .box_in .ordinaryBox_inAct .ordinary .title {
+ opacity: 0;
+ margin-bottom: -0.26667rem;
+}
diff --git a/view/molistar/modules/guildAr/css/memberFlow3.scss b/view/molistar/modules/guildAr/css/memberFlow3.scss
new file mode 100644
index 0000000..2e7e17c
--- /dev/null
+++ b/view/molistar/modules/guildAr/css/memberFlow3.scss
@@ -0,0 +1,355 @@
+@function px2rem($px) {
+ @return $px / 75+rem;
+}
+
+html,
+body {
+ width: 100%;
+ height: px2rem(1334);
+ background: #F5F7F9;
+}
+
+.back {
+ width: 100%;
+ height: px2rem(180);
+ position: fixed;
+ left: 0;
+ top: px2rem(0);
+ text-align: center;
+ color: #FFFFFF;
+ font-size: px2rem(38);
+ font-weight: bold;
+ z-index: 10;
+ background: #fff;
+
+ .backs {
+ width: px2rem(44);
+ height: px2rem(44);
+ position: absolute;
+ left: px2rem(18);
+ top: 58%;
+ z-index: 2;
+ }
+
+ .title {
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ height: 100%;
+ top: 0;
+ line-height: px2rem(260);
+ color: #333333;
+ font-size: px2rem(34);
+ font-weight: bold;
+ }
+
+ .text {
+ position: absolute;
+ right: px2rem(47);
+ height: 100%;
+ top: 0;
+ line-height: px2rem(260);
+ color: #333333;
+ font-size: px2rem(30);
+ }
+}
+
+.header {
+ width: px2rem(710);
+ height: px2rem(476);
+ background: #fff;
+ border-radius: px2rem(30);
+ margin: px2rem(210) auto px2rem(26);
+ overflow: hidden;
+ position: relative;
+
+ .time {
+ width: 100%;
+ height: px2rem(40);
+ line-height: px2rem(40);
+ display: flex;
+ justify-content: space-between;
+ box-sizing: border-box;
+ margin: px2rem(29) auto px2rem(57);
+ text-align: center;
+ padding: 0 px2rem(20);
+ color: #848D9C;
+ font-size: px2rem(30);
+ font-weight: 500;
+
+ div {
+ color: #5D636E;
+ width: 3rem;
+ }
+
+ span {
+ display: block;
+ width: 3rem;
+ }
+ }
+
+ h3 {
+ width: 100%;
+ box-sizing: border-box;
+ padding-left: px2rem(49);
+ color: #141515;
+ font-size: px2rem(32);
+ font-weight: 500;
+ margin-bottom: px2rem(54);
+ }
+
+ p {
+ height: px2rem(40);
+ line-height: px2rem(40);
+ width: 100%;
+ text-align: center;
+ color: #232424;
+ font-size: px2rem(52);
+ font-weight: 500;
+
+ img {
+ display: inline-block;
+ width: px2rem(40);
+ height: px2rem(40);
+ }
+ }
+
+ .user {
+ width: px2rem(128);
+ height: px2rem(86);
+ position: absolute;
+ left: px2rem(66);
+ top: px2rem(105);
+ text-align: center;
+
+ img {
+ display: block;
+ width: px2rem(86);
+ height: px2rem(86);
+ border-radius: 50%;
+ margin: 0 auto px2rem(4);
+ }
+
+ p {
+ width: 100%;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #333333;
+ font-size: px2rem(26);
+ font-weight: 400;
+ margin-bottom: px2rem(2);
+ }
+
+ b {
+ color: #A4ABB2;
+ font-size: px2rem(22);
+ }
+ }
+
+ .line {
+ width: px2rem(657);
+ height: px2rem(1);
+ background: #B0BACD;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: px2rem(291);
+ }
+
+ .line1 {
+ width: px2rem(1);
+ height: px2rem(77);
+ background: #B0BACD;
+ position: absolute;
+ left: px2rem(221);
+ top: px2rem(349);
+ }
+
+ .line2 {
+ width: px2rem(1);
+ height: px2rem(77);
+ background: #B0BACD;
+ position: absolute;
+ left: px2rem(478);
+ top: px2rem(349);
+ }
+
+ .datas {
+ width: px2rem(657);
+ height: px2rem(93);
+ margin: px2rem(93) auto 0;
+ display: flex;
+ justify-content: space-between;
+
+ div {
+ width: px2rem(191);
+ text-align: center;
+
+ p {
+ color: #232424;
+ font-size: px2rem(36);
+ font-weight: 500;
+ margin-bottom: px2rem(23);
+ width: 100%;
+
+ img {
+ display: inline-block;
+ width: px2rem(30);
+ height: px2rem(30);
+ vertical-align: middle;
+ }
+ b{
+ display: inline-block;
+ vertical-align: middle;
+ }
+ }
+
+ span {
+ color: #666666;
+ font-size: px2rem(28);
+ font-weight: 400;
+ }
+ }
+ }
+}
+
+.box {
+ width: px2rem(710);
+ min-height: px2rem(800);
+ background: #fff;
+ border-radius: px2rem(30);
+ margin: 0 auto px2rem(30);
+ box-sizing: border-box;
+ padding: px2rem(37) px2rem(0) 0 px2rem(23);
+
+ h3 {
+ color: #141515;
+ font-size: px2rem(34);
+ font-weight: 600;
+ margin: 0;
+ margin-left: px2rem(20);
+ margin-bottom: px2rem(38);
+
+ span {
+ display: inline-block;
+ width: px2rem(5);
+ height: px2rem(28);
+ margin-left: px2rem(-13);
+ background: #62D0A8;
+ margin-right: px2rem(10);
+ }
+ }
+
+ .box_in {
+ width: 100%;
+ height: 100%;
+ display: flex;
+
+ .fistBox {
+ width: px2rem(180);
+ float: left;
+
+ .fist {
+ width: px2rem(170);
+ height: px2rem(151);
+ margin-right: px2rem(30);
+
+ .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: px2rem(28);
+ margin-bottom: px2rem(23);
+ white-space: nowrap;
+ }
+
+ img {
+ display: block;
+ width: px2rem(32);
+ height: px2rem(32);
+ border-radius: 50%;
+ margin: 0 auto px2rem(5);
+ }
+
+ p {
+ width: 100%;
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #848D9C;
+ font-size: px2rem(24);
+ font-weight: 500;
+ }
+
+ b {
+ color: #A4ABB2;
+ font-size: px2rem(18);
+ font-weight: 500;
+ text-align: center;
+ display: block;
+ width: 100%;
+ }
+ }
+ }
+
+ .ordinaryBox {
+ height: 100%;
+ overflow-x: scroll;
+
+ &::-webkit-scrollbar {
+ // display: none;
+ }
+
+ .ordinaryBox_in {
+ width: 15rem;
+
+ .ordinary {
+ width: px2rem(170);
+ height: px2rem(151);
+ float: left;
+ margin-right: px2rem(30);
+
+ .title {
+ color: #666666;
+ width: 100%;
+ text-align: center;
+ font-size: px2rem(28);
+ margin-bottom: px2rem(23);
+ }
+
+ p {
+ width: 100%;
+ text-align: center;
+ color: #848D9C;
+ font-size: px2rem(24);
+ font-weight: 500;
+ line-height: px2rem(90);
+ }
+
+ .true {
+ color: #4EA686;
+ }
+
+ .false {
+ color: #DC865D;
+ }
+ }
+ }
+ }
+
+ .fistBox .fistAct {
+ .title {
+ opacity: 0;
+ }
+ }
+
+ .ordinaryBox_inAct .ordinary {
+ .title {
+ opacity: 0;
+ margin-bottom: px2rem(-20);
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/view/molistar/modules/guildAr/guildInfoSet.html b/view/molistar/modules/guildAr/guildInfoSet.html
index 9ffd021..7d28413 100644
--- a/view/molistar/modules/guildAr/guildInfoSet.html
+++ b/view/molistar/modules/guildAr/guildInfoSet.html
@@ -17,19 +17,35 @@
-
-
-
-
-
+
公会名称
+
+
+ 修改
+
+
+
公会背景图
+
-
-
-
-
-
+
+
收款帐户
+
+ payoneer:
+
+ 添加
+
+
+ USDT-erc20:
+
+ 添加
+
+
+ paypal:
+
+ 添加
diff --git a/view/molistar/modules/guildAr/images/dor.png b/view/molistar/modules/guildAr/images/dor.png
new file mode 100644
index 0000000000000000000000000000000000000000..e3ccbd188f467a67161e8d1679d48bd0ae3318a4
GIT binary patch
literal 1269
zcmV
+ 修改