diff --git a/view/molistar/modules/guildAr/css/incomeStatistics.css b/view/molistar/modules/guildAr/css/incomeStatistics.css index 9a84823..e7fc4dc 100644 --- a/view/molistar/modules/guildAr/css/incomeStatistics.css +++ b/view/molistar/modules/guildAr/css/incomeStatistics.css @@ -1,7 +1,7 @@ body { width: 100%; height: 17.78667rem; - background: #F5F7F9; + background: #fff; padding-top: 2.56rem; } diff --git a/view/molistar/modules/guildAr/css/incomeStatistics.scss b/view/molistar/modules/guildAr/css/incomeStatistics.scss index b9cf0fc..c6e6d95 100644 --- a/view/molistar/modules/guildAr/css/incomeStatistics.scss +++ b/view/molistar/modules/guildAr/css/incomeStatistics.scss @@ -5,7 +5,7 @@ body { width: 100%; height: px2rem(1334); - background: #F5F7F9; + background: #fff; padding-top: px2rem(192); } diff --git a/view/molistar/modules/guildAr/css/index.css b/view/molistar/modules/guildAr/css/index.css index f472db5..82394cd 100644 --- a/view/molistar/modules/guildAr/css/index.css +++ b/view/molistar/modules/guildAr/css/index.css @@ -1,8 +1,7 @@ html, body { width: 100%; - height: 17.78667rem; - background: #e4e4e7; + background: #fff; } .back { @@ -11,7 +10,7 @@ body { line-height: 0.58667rem; position: fixed; left: 0; - top: 0.93333rem; + top: 1.46667rem; text-align: center; color: #FFFFFF; font-size: 0.50667rem; @@ -37,21 +36,21 @@ body { .header { width: 10rem; - height: 8.98667rem; + height: 5.86667rem; background: url(../images/header.png) no-repeat; - background-size: 100% 100%; + background-size: cover; position: relative; margin: 0 auto 0rem; } .header .tx { - width: 2.64rem; - height: 2.53333rem; + width: 2.05333rem; + height: 2.05333rem; position: absolute; - left: 50%; - transform: translateX(-50%); - top: 1.85333rem; + left: 0.45333rem; + top: 2.88rem; border-radius: 50%; + border: 0.02667rem solid #FFE8A9; } .header .ts { @@ -62,36 +61,33 @@ body { left: 50%; transform: translateX(-50%); z-index: 2; + display: none; } .header .nick { - width: 80%; + width: 55%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; - text-align: center; color: #fff; font-size: 0.53333rem; font-weight: bold; position: absolute; - left: 50%; - transform: translateX(-50%); - top: 4.85333rem; + top: 3.22667rem; + left: 2.93333rem; } .header .id { - width: 80%; + width: 55%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; - text-align: center; color: #fff; font-size: 0.34667rem; font-weight: 500; position: absolute; - left: 50%; - transform: translateX(-50%); - top: 5.64rem; + top: 4.10667rem; + left: 2.93333rem; } .header .guildNick { @@ -106,55 +102,196 @@ 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; +.header .inveMember { + min-width: 1.57333rem; + height: 0.72rem; + border-radius: 0.72rem; + line-height: 0.72rem; 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; + background: linear-gradient(90deg, #7CDD9B, #62D0A8); + color: #fff; + font-size: 0.37333rem; + position: absolute; + top: 3.54667rem; + right: 0.42667rem; + z-index: 5; + padding: 0 0.13333rem; +} + +.header .inveMember img { + display: inline-block; + width: 0.50667rem; + height: 0.56rem; + vertical-align: middle; + margin-top: -0.1rem; + display: none; +} + +.header .inveMember span { + display: block; +} + +.headerBox { + width: 10rem; + border-radius: 0.26667rem; + margin: -0.4rem auto 0rem; + position: relative; + background: #fff; overflow: hidden; - white-space: nowrap; - margin: 0 auto 0.33333rem; } -.header .headerBox div img { - width: 0.42667rem; - height: 0.42667rem; - margin-right: 0.17333rem; +.headerBox .headerBox_in { + width: 9.14667rem; + max-height: 3.06667rem; + display: flex; + justify-content: space-between; + flex-wrap: wrap; + margin: 0.32rem auto 0; +} + +.headerBox .headerBox_in div { + width: 4.45333rem; + height: 1.38667rem; + line-height: 1.38667rem; + margin-bottom: 0.24rem; + background: #F2F3F7; + border-radius: 0.32rem; + text-align: left; + box-sizing: border-box; + padding: 0 0.13333rem; +} + +.headerBox .headerBox_in div img { + display: inline-block; + width: 0.69333rem; + height: 0.69333rem; + margin-top: 0.4rem; +} + +.headerBox .headerBox_in div span { + display: inline-block; + color: #313131; + font-size: 0.4rem; +} + +.headerBox .headerBox_in .incomeStatistics { + background: #E3F2FF; +} + +.headerBox .headerBox_in .E3F2FF { + background: #E3F2FF; +} + +.headerBox .headerBox_in .FFEFE5 { + background: #FFEFE5; +} + +.agencylevel { + width: 10rem; + height: 3.62667rem; + margin: 0.34667rem auto 0; + display: none; +} + +.agencylevel .top { + width: 100%; + box-sizing: border-box; + padding: 0 0.33333rem; + height: 0.66667rem; + line-height: 0.66667rem; + margin-top: 0.41333rem; + position: relative; +} + +.agencylevel .top span { float: left; - margin-top: 0.16rem; - margin-left: 0.38667rem; + width: 0.10667rem; + height: 0.45333rem; + background: #04D5C6; + border-radius: 9.22667rem; + margin: 0.10667rem 0.13333rem 0; + display: block; } -.header .headerBox div span { +.agencylevel .top b { float: left; + font-size: 0.48rem; + color: #313131; + font-weight: bold; + display: block; + margin-right: 0.09333rem; } -.header .headerBox .incomeStatistics div img { - width: 0.82667rem; - height: 0.82667rem; +.agencylevel .top i { + display: block; + font-size: 0.48rem; + color: #313131; + float: left; + font-style: normal; +} + +.agencylevel .agencylevelInfo { + width: 9.14667rem; + height: 2.69333rem; + background: #EBFFF6; + border-radius: 0.21333rem; + margin: 0.26667rem auto 0; + box-sizing: border-box; + padding: 0.24rem; +} + +.agencylevel .agencylevelInfo h3 { + width: 100%; + display: block; + color: #313131; + font-size: 0.34667rem; + margin-bottom: 0.26667rem; + font-weight: 600; +} + +.agencylevel .agencylevelInfo h3 b { + color: #313131; + font-size: 0.34667rem; +} + +.agencylevel .agencylevelInfo h4 { + color: #7B7B7D; + font-weight: 400; + margin-bottom: 0.26667rem; +} + +.agencylevel .agencylevelInfo .line { + width: 8.66667rem; + height: 0.13333rem; + position: relative; + background: #B2E8D0; + border-radius: 0.13333rem; + overflow: hidden; + margin-bottom: 0.26667rem; +} + +.agencylevel .agencylevelInfo .line .line_in { + position: absolute; + top: 0; + left: 0; + width: 10%; + background: #04D5C6; + height: 100%; +} + +.agencylevel .agencylevelInfo .bottom { + width: 100%; + display: flex; + justify-content: space-between; + color: #7B7B7D; + font-size: 0.32rem; + font-weight: 400; } .guildList { - width: 9.25333rem; - height: 11rem; + width: 10rem; border-radius: 0.26667rem; - margin: -0.3rem auto 0rem; + margin: 0rem auto 0; position: relative; background: #fff; overflow: hidden; @@ -164,16 +301,26 @@ body { width: 100%; box-sizing: border-box; padding: 0 0.33333rem; - height: 0.4rem; - line-height: 0.4rem; + height: 0.66667rem; + line-height: 0.66667rem; margin-top: 0.41333rem; position: relative; } +.guildList .top span { + float: left; + width: 0.10667rem; + height: 0.45333rem; + background: #04D5C6; + border-radius: 9.22667rem; + margin: 0.10667rem 0.13333rem 0; + display: block; +} + .guildList .top b { float: left; - font-size: 0.32rem; - color: #333; + font-size: 0.48rem; + color: #313131; font-weight: bold; display: block; margin-right: 0.09333rem; @@ -181,8 +328,8 @@ body { .guildList .top i { display: block; - color: #666; - font-size: 0.29333rem; + font-size: 0.48rem; + color: #313131; float: left; font-style: normal; } @@ -193,7 +340,7 @@ body { width: 0.42667rem; height: 0.42667rem; position: absolute; - left: 3.68rem; + left: 6.45rem; top: 51%; transform: translateY(-50%); z-index: 2; @@ -204,17 +351,14 @@ body { border: none; outline: none; background: #F5F7F9; - width: 5.4rem; + width: 3.46667rem; height: 0.66667rem; border-radius: 0.66667rem; box-sizing: border-box; padding-left: 0.72rem; - position: absolute; - left: 3.49333rem; - top: 50%; - transform: translateY(-50%); color: #333; display: none; + float: right; } .guildList .top input::placeholder { @@ -224,8 +368,8 @@ body { .guildList ul { width: 100%; - height: 11rem; - margin: 0.52rem auto 0; + height: 6.7rem; + margin: 0.25333rem auto 0; overflow-y: scroll; } @@ -234,24 +378,27 @@ body { } .guildList ul li { - width: 100%; - height: 1.33333rem; + width: 9.14667rem; + height: 1.94667rem; box-sizing: border-box; overflow: hidden; - margin-bottom: 0.44rem; + margin: 0 auto 0.44rem; position: relative; box-sizing: border-box; padding-left: 0.13333rem; + background: #F2F3F7; + border-radius: 0.32rem; } .guildList ul li .tx { - width: 1.06667rem; - height: 1.06667rem; - border-radius: 1.06667rem; + width: 1.46667rem; + height: 1.46667rem; + border-radius: 50%; float: left; margin-right: 0.14667rem; margin-left: 0.13333rem; display: block; + margin-top: 0.24rem; } .guildList ul li .user { @@ -265,13 +412,13 @@ body { font-weight: bold; display: inline-block; margin-right: 0.10667rem; - margin-bottom: 0.18667rem; - width: 2.7rem; + margin-bottom: 0.06667rem; + max-width: 2.7rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; box-sizing: border-box; - padding-top: 0.10667rem; + padding-top: 0.6rem; } .guildList ul li .user b { @@ -284,7 +431,7 @@ body { width: 0.24rem; height: 0.24rem; display: inline-block; - margin-top: 0.16rem; + margin-top: 0.6rem; margin-right: 0.10667rem; } @@ -293,6 +440,7 @@ body { display: inline-block; width: 0.96rem; height: 0.48rem; + margin-top: 0.49333rem; } .guildList ul li .but { @@ -302,7 +450,7 @@ body { border-radius: 0.56rem; position: absolute; right: 0.34667rem; - top: 0.09333rem; + top: 0.69rem; text-align: center; color: #fff; line-height: 0.56rem; @@ -311,33 +459,33 @@ body { } .guildList ul li .chairman { - width: 1.04rem; - height: 0.34667rem; - line-height: 0.34667rem; - border-radius: 0.34667rem; + width: 1.2rem; + height: 0.45333rem; + line-height: 0.45333rem; + border-radius: 0.45333rem; text-align: center; - color: #333; + color: #fff; font-size: 0.29333rem; font-weight: 400; position: absolute; - left: 0.26667rem; - top: 0.94667rem; - background: linear-gradient(90deg, #FFEB67, #FFFCE7); + left: 0.37333rem; + top: 1.30667rem; + background: #04D5C6; display: none; } .guildList ul li .administrator { - width: 1.04rem; - height: 0.34667rem; - line-height: 0.34667rem; - border-radius: 0.34667rem; + width: 1.2rem; + height: 0.45333rem; + line-height: 0.45333rem; + border-radius: 0.45333rem; text-align: center; - color: #333; + color: #fff; font-size: 0.29333rem; font-weight: 400; position: absolute; - left: 0.26667rem; - top: 0.94667rem; + left: 0.37333rem; + top: 1.30667rem; background: linear-gradient(-90deg, #FBE1FF, #F090FF); display: none; } @@ -399,33 +547,25 @@ body { 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; +.arabic .back img { + left: auto; + right: 0.24rem; + transform: rotate(180deg); } -.inveMember img { - display: inline-block; - width: 0.50667rem; - height: 0.56rem; - vertical-align: middle; - margin-top: -0.1rem; +.arabic .header .tx { + left: auto; + right: 0.45333rem; } -.inveMember span { - display: inline-block; - vertical-align: middle; +.arabic .header .nick { + left: auto; + right: 2.93333rem; +} + +.arabic .header .id { + left: auto; + right: 2.93333rem; } .arabic .guildList .top img { @@ -443,7 +583,7 @@ body { .arabic .guildList ul li .chairman, .arabic .guildList ul li .administrator { - right: 0.1rem; + right: 0.37333rem; left: auto; } @@ -464,6 +604,10 @@ body { float: right; } +.arabic .headerBox .headerBox_in div span { + font-size: 0.33333rem; +} + .english .header .headerBox { width: 8rem; } @@ -472,6 +616,19 @@ body { width: 3.9rem; } +.english .header .headerBox div span { + font-size: 0.21333rem; +} + +.arabic .header .inveMember { + right: auto; + left: 0.42667rem; +} + +.arabic .headerBox .headerBox_in div { + text-align: right; +} + .arabic .header .headerBox { width: 8rem; } @@ -483,3 +640,32 @@ body { .arabic .header .headerBox div span { font-size: 0.29333rem; } + +.arabic .guildList .top b { + float: right; +} + +.arabic .guildList .top i { + float: right; +} + +.arabic .guildList .top input { + float: left; +} + +.arabic .guildList .top img { + right: 6.3rem; + left: auto; + transform: rotate(100deg); + top: 0.1rem; +} + +.arabic .guildList .top span { + float: right; + display: block; +} + +.arabic .agencylevel .agencylevelInfo .line .line_in { + left: auto; + right: 0; +} diff --git a/view/molistar/modules/guildAr/css/index.scss b/view/molistar/modules/guildAr/css/index.scss index 04cafee..2372d6b 100644 --- a/view/molistar/modules/guildAr/css/index.scss +++ b/view/molistar/modules/guildAr/css/index.scss @@ -5,8 +5,8 @@ html, body { width: 100%; - height: px2rem(1334); - background: #e4e4e7; + // height: px2rem(1334); + background: #fff; } .back { @@ -15,7 +15,7 @@ body { line-height: px2rem(44); position: fixed; left: 0; - top: px2rem(70); + top: px2rem(110); text-align: center; color: #FFFFFF; font-size: px2rem(38); @@ -42,20 +42,20 @@ body { .header { width: px2rem(750); - height: px2rem(674); + height: px2rem(440); background: url(../images/header.png) no-repeat; - background-size: 100% 100%; + background-size: cover; position: relative; margin: 0 auto px2rem(0); .tx { - width: px2rem(198); - height: px2rem(190); + width: px2rem(154); + height: px2rem(154); position: absolute; - left: 50%; - transform: translateX(-50%); - top: px2rem(139); + left: px2rem(34); + top: px2rem(216); border-radius: 50%; + border: px2rem(2) solid #FFE8A9; } .ts { @@ -66,117 +66,35 @@ body { left: 50%; transform: translateX(-50%); z-index: 2; + display: none; } .nick { - width: 80%; + width: 55%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; - text-align: center; color: #fff; font-size: px2rem(40); font-weight: bold; position: absolute; - left: 50%; - transform: translateX(-50%); - top: px2rem(364); + top: px2rem(242); + left: px2rem(220); } .id { - width: 80%; + width: 55%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; - text-align: center; color: #fff; font-size: px2rem(26); font-weight: 500; position: absolute; - left: 50%; - transform: translateX(-50%); - top: px2rem(423); + top: px2rem(308); + left: px2rem(220); } - // .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; - // } - - // .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; - // } - - // .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%; @@ -190,60 +108,198 @@ body { display: none; } - .headerBox { - width: px2rem(665); - display: flex; - justify-content: center; - flex-wrap: wrap; + .inveMember { + min-width: px2rem(118); + height: px2rem(54); + border-radius: px2rem(54); + line-height: px2rem(54) ; + text-align: center; + background: linear-gradient(90deg, #7CDD9B, #62D0A8); + color: #fff; + font-size: px2rem(28); position: absolute; - top: px2rem(478); - // left: px2rem(93); - left: 50%; - transform: translateX(-50%); + top: px2rem(266); + right: px2rem(32); + z-index: 5; + padding: 0 px2rem(10); + + img { + display: inline-block; + width: px2rem(38); + height: px2rem(42); + vertical-align: middle; + margin-top: -0.1rem; + display: none; + } + + span { + display: block; + } + } +} + +.headerBox { + width: px2rem(750); + border-radius: px2rem(20); + margin: px2rem(-30) auto px2rem(0); + position: relative; + background: #fff; + overflow: hidden; + + .headerBox_in { + width: px2rem(686); + max-height: px2rem(230); + display: flex; + justify-content: space-between; + flex-wrap: wrap; + margin: px2rem(24) auto 0; 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); + width: px2rem(334); + height: px2rem(104); + line-height: px2rem(104); + margin-bottom: px2rem(18); + background: #F2F3F7; + border-radius: px2rem(24); + text-align: left; + box-sizing: border-box; + padding: 0 px2rem(10); img { - width: px2rem(32); - height: px2rem(32); - margin-right: px2rem(13); - float: left; - margin-top: px2rem(12); - margin-left: px2rem(29); + display: inline-block; + width: px2rem(52); + height: px2rem(52); + margin-top: px2rem(30); } span { - float: left; + display: inline-block; + color: #313131; + font-size: px2rem(30); } } .incomeStatistics{ - div{ - img{ - width: px2rem(62); - height: px2rem(62); - } + background: #E3F2FF; + } + + .E3F2FF { + background: #E3F2FF; + } + + .FFEFE5 { + background: #FFEFE5; + } + } +} + +.agencylevel { + width: px2rem(750); + height: px2rem(272); + margin: px2rem(26) auto 0; + display: none; + + .top { + width: 100%; + box-sizing: border-box; + padding: 0 px2rem(25); + height: px2rem(50); + line-height: px2rem(50); + margin-top: px2rem(31); + position: relative; + + span { + float: left; + width: px2rem(8); + height: px2rem(34); + background: #04D5C6; + border-radius: px2rem(692); + margin: px2rem(8) px2rem(10) 0; + display: block; + } + + b { + float: left; + font-size: px2rem(36); + color: #313131; + font-weight: bold; + display: block; + margin-right: px2rem(7); + } + + i { + display: block; + font-size: px2rem(36); + color: #313131; + float: left; + font-style: normal; + } + } + + .agencylevelInfo { + width: px2rem(686); + height: px2rem(202); + background: #EBFFF6; + border-radius: px2rem(16); + margin: px2rem(20) auto 0; + box-sizing: border-box; + padding: px2rem(18); + + h3 { + width: 100%; + display: block; + color: #313131; + font-size: px2rem(26); + margin-bottom: px2rem(20); + font-weight: 600; + + b { + color: #313131; + font-size: px2rem(26); } } + + h4 { + color: #7B7B7D; + font-weight: 400; + margin-bottom: px2rem(20); + } + + .line { + width: px2rem(650); + height: px2rem(10); + position: relative; + background: #B2E8D0; + border-radius: px2rem(10); + overflow: hidden; + margin-bottom: px2rem(20); + + .line_in { + position: absolute; + top: 0; + left: 0; + width: 10%; + background: #04D5C6; + height: 100%; + } + } + + .bottom { + width: 100%; + display: flex; + justify-content: space-between; + color: #7B7B7D; + font-size: px2rem(24); + font-weight: 400; + } } } .guildList { - width: px2rem(694); - height: 11rem; + width: px2rem(750); + // height: 11rem; + // height: 6.7rem; border-radius: px2rem(20); - margin: -0.3rem auto px2rem(0); + margin: px2rem(0) auto 0; position: relative; background: #fff; overflow: hidden; @@ -252,16 +308,26 @@ body { width: 100%; box-sizing: border-box; padding: 0 px2rem(25); - height: px2rem(30); - line-height: px2rem(30); + height: px2rem(50); + line-height: px2rem(50); margin-top: px2rem(31); position: relative; + // margin-left: px2rem(-13); + span { + float: left; + width: px2rem(8); + height: px2rem(34); + background: #04D5C6; + border-radius: px2rem(692); + margin: px2rem(8) px2rem(10) 0; + display: block; + } b { float: left; - font-size: px2rem(24); - color: #333; + font-size: px2rem(36); + color: #313131; font-weight: bold; display: block; margin-right: px2rem(7); @@ -269,8 +335,8 @@ body { i { display: block; - color: #666; - font-size: px2rem(22); + font-size: px2rem(36); + color: #313131; float: left; font-style: normal; } @@ -281,7 +347,7 @@ body { width: px2rem(32); height: px2rem(32); position: absolute; - left: 3.68rem; + left: 6.45rem; top: 51%; transform: translateY(-50%); z-index: 2; @@ -292,17 +358,18 @@ body { border: none; outline: none; background: #F5F7F9; - width: 5.4rem; + width: px2rem(260); height: px2rem(50); border-radius: px2rem(50); box-sizing: border-box; padding-left: px2rem(54); - position: absolute; - left: 3.49333rem; - top: 50%; - transform: translateY(-50%); + // position: absolute; + // left: 3.7rem; + // top: 50%; + // transform: translateY(-50%); color: #333; display: none; + float: right; &::placeholder { color: #BCBDCB; @@ -313,8 +380,9 @@ body { ul { width: 100%; - height: 11rem; - margin: px2rem(39) auto 0; + // height: 11rem; + height: 6.7rem; + margin: px2rem(19) auto 0; overflow-y: scroll; &::-webkit-scrollbar { @@ -322,23 +390,26 @@ body { } li { - width: 100%; - height: px2rem(100); + width: px2rem(686); + height: px2rem(146); box-sizing: border-box; overflow: hidden; - margin-bottom: px2rem(33); + margin: 0 auto px2rem(33); position: relative; box-sizing: border-box; padding-left: px2rem(10); + background: #F2F3F7; + border-radius: px2rem(24); .tx { - width: px2rem(80); - height: px2rem(80); - border-radius: px2rem(80); + width: px2rem(110); + height: px2rem(110); + border-radius: 50%; float: left; margin-right: px2rem(11); margin-left: px2rem(10); display: block; + margin-top: px2rem(18) } .user { @@ -351,13 +422,13 @@ body { font-weight: bold; display: inline-block; margin-right: px2rem(8); - margin-bottom: px2rem(14); - width: 2.7rem; + margin-bottom: px2rem(5); + max-width: 2.7rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; box-sizing: border-box; - padding-top: px2rem(8); + padding-top: px2rem(45); } b { @@ -370,7 +441,7 @@ body { width: px2rem(18); height: px2rem(18); display: inline-block; - margin-top: px2rem(12); + margin-top: px2rem(45); margin-right: px2rem(8); } @@ -379,6 +450,7 @@ body { display: inline-block; width: px2rem(72); height: px2rem(36); + margin-top: px2rem(37); } } @@ -389,7 +461,7 @@ body { border-radius: px2rem(42); position: absolute; right: px2rem(26); - top: px2rem(7); + top: 0.69rem; text-align: center; color: #fff; line-height: px2rem(42); @@ -398,33 +470,33 @@ body { } .chairman { - width: px2rem(78); - height: px2rem(26); - line-height: px2rem(26); - border-radius: px2rem(26); + width: px2rem(90); + height: px2rem(34); + line-height: px2rem(34); + border-radius: px2rem(34); text-align: center; - color: #333; + color: #fff; font-size: px2rem(22); font-weight: 400; position: absolute; - left: px2rem(20); - top: px2rem(71); - background: linear-gradient(90deg, #FFEB67, #FFFCE7); + left: px2rem(28); + top: px2rem(98); + background: #04D5C6; display: none; } .administrator { - width: px2rem(78); - height: px2rem(26); - line-height: px2rem(26); - border-radius: px2rem(26); + width: px2rem(90); + height: px2rem(34); + line-height: px2rem(34); + border-radius: px2rem(34); text-align: center; - color: #333; + color: #fff; font-size: px2rem(22); font-weight: 400; position: absolute; - left: px2rem(20); - top: px2rem(71); + left: px2rem(28); + top: px2rem(98); background: linear-gradient(-90deg, #FBE1FF, #F090FF); display: none; } @@ -489,36 +561,29 @@ 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 { + .back img { + left: auto; + right: 0.24rem; + transform: rotate(180deg); + } + + .header .tx { + left: auto; + right: 0.45333rem; + } + + .header .nick { + left: auto; + right: 2.93333rem; + } + + .header .id { + left: auto; + right: 2.93333rem; + } + .guildList .top img { right: px2rem(30); } @@ -534,7 +599,7 @@ body { .guildList ul li .chairman, .guildList ul li .administrator { - right: 0.1rem; + right: px2rem(28); left: auto; } @@ -555,6 +620,10 @@ body { float: right; } + .headerBox .headerBox_in div span { + font-size: px2rem(25); + } + } .english { @@ -565,13 +634,26 @@ body { width: 3.9rem; span { - // font-size: px2rem(16); + font-size: px2rem(16); } } } + + .headerBox .headerBox_in .guildInfoSet span, + .headerBox .headerBox_in .adminSet span { + // font-size: px2rem(20); + } } .arabic { + .header .inveMember { + right: auto; + left: px2rem(32); + } + .headerBox .headerBox_in div{ + text-align: right; + } + .header .headerBox { width: 8rem; @@ -583,4 +665,33 @@ body { } } } + + .guildList .top b { + float: right; + } + + .guildList .top i { + float: right; + } + + .guildList .top input { + float: left; + } + + .guildList .top img { + right: 6.3rem; + left: auto; + transform: rotate(100deg); + top: 0.1rem; + } + + .guildList .top span { + float: right; + display: block; + } + + .agencylevel .agencylevelInfo .line .line_in { + left: auto; + right: 0; + } } \ No newline at end of file diff --git a/view/molistar/modules/guildAr/images/icon11.png b/view/molistar/modules/guildAr/images/icon11.png new file mode 100644 index 0000000..5e0f395 Binary files /dev/null and b/view/molistar/modules/guildAr/images/icon11.png differ diff --git a/view/molistar/modules/guildAr/images/icon22.png b/view/molistar/modules/guildAr/images/icon22.png new file mode 100644 index 0000000..eb9ce49 Binary files /dev/null and b/view/molistar/modules/guildAr/images/icon22.png differ diff --git a/view/molistar/modules/guildAr/images/icon33.png b/view/molistar/modules/guildAr/images/icon33.png new file mode 100644 index 0000000..a7c1084 Binary files /dev/null and b/view/molistar/modules/guildAr/images/icon33.png differ diff --git a/view/molistar/modules/guildAr/index.html b/view/molistar/modules/guildAr/index.html index 8c63af3..30d0e6b 100644 --- a/view/molistar/modules/guildAr/index.html +++ b/view/molistar/modules/guildAr/index.html @@ -23,6 +23,11 @@
+ +