fix

apps/stat.js

@@ -35,9 +35,9 @@ app.reg({
     desc: '上传深渊'
   },
   RoleCombatSummary: {
-    rule: /^#*(喵喵|上传|本期)*(幻想|剧诗|幻想真境剧诗)[ |0-9]*(数据)?$/,
+    rule: /^#*(喵喵)*(幻想|幻境|剧诗|幻想真境剧诗)[ |0-9]*(数据)?$/,
     fn: RoleCombatSummary,
-    desc: '上传幻想真境剧诗'
+    desc: '幻想真境剧诗'
   }
 })
 export default app

apps/stat/RoleCombatSummary.js

@@ -1,10 +1,9 @@
 import lodash from 'lodash'
-import HutaoApi from './HutaoApi.js'
 import { Cfg, Common, Data } from '#miao'
-import { Role, Character, MysApi, Player } from '#miao.models'
+import { RoleCombat, MysApi, Player } from '#miao.models'
 
 export async function RoleCombatSummary (e) {
-  let isMatch = /^#(喵喵|上传)(幻想|剧诗|幻想真境剧诗)(数据)?$/.test(e.original_msg || e.msg || '')
+  let isMatch = /^#(喵喵)*(幻想|幻境|剧诗|幻想真境剧诗)(数据)?$/.test(e.original_msg || e.msg || '')
   if (!Cfg.get('uploadRoleCombat', false) && !isMatch) {
     return false
   }
@@ -15,7 +14,6 @@ export async function RoleCombatSummary (e) {
     }
     return false
   }
-  let ret = {}
   let uid = mys.uid
   let player = Player.create(e)
   let resDetail, resRole
@@ -27,15 +25,6 @@ export async function RoleCombatSummary (e) {
       e.reply('暂未获得本期幻想真境剧诗挑战数据...')
       return true
     }
-    // TODO: What if CK is not used?
-    // else if (lvs && lvs.battles && lvs.battles.length === 0) {
-    //   if (!mys.isSelfCookie) {
-    //     if (isMatch) {
-    //       e.reply(`请绑定ck后再使用${e.original_msg || e.msg}`)
-    //     }
-    //     return false
-    //   }
-    // }
 
     resDetail = await mys.getCharacter()
     if (!resDetail || !resRole || !resDetail.avatars || resDetail.avatars.length <= 3) {
@@ -44,86 +33,20 @@ export async function RoleCombatSummary (e) {
     }
     delete resDetail._res
     delete resRole._res
-    
-    // TOOD: upload HuTao API
-    ret = lvs
-    // ret = await HutaoApi.uploadData({
-    //   uid,
-    //   resDetail,
-    //   resRole: resRole
-    // })
   } catch (err) {
     // console.log(err);
   }
+
   // 更新player信息
   player.setMysCharData(resDetail)
 
-  // TODO: HuTao API
-//   if (ret && ret.retcode === 0) {
-//     let stat = []
-//     if (ret.data) {
   if (resRole.data.length === 0) {
     e.reply('暂未获得本期深渊挑战数据...')
     return true
   }
-      let role = new Role(resRole.data[0])
+  let role = new RoleCombat(resRole.data[0])
   let roleData = role.getData()
   let ownAvatarIds = role.getOwnAvatars()
-    //   let overview = ret.info || (await HutaoApi.getOverview())?.data || {}
-    //   let addMsg = function (title, ds) {
-    //     let tmp = {}
-    //     if (!ds) {
-    //       return false
-    //     }
-    //     if (!ds.avatarId && !ds.id) {
-    //       return false
-    //     }
-    //     let char = Character.get(ds.avatarId || ds.id)
-    //     tmp.title = title
-    //     tmp.id = char.id
-    //     tmp.value = `${(ds.value / 10000).toFixed(1)} W`
-    //     let msg = []
-    //     tmp.msg = msg
-    //     let pct = (percent, name) => {
-    //       if (percent < 0.2) {
-    //         msg.push({
-    //           title: '少于',
-    //           value: (Math.max(0.1, 100 - percent * 100)).toFixed(1),
-    //           name
-    //         })
-    //       } else {
-    //         msg.push({
-    //           title: '超过',
-    //           value: (Math.min(99.9, percent * 100)).toFixed(1),
-    //           name
-    //         })
-    //       }
-    //     }
-    //     if (ds.percent) {
-    //       pct(ds.percent, char.abbr)
-    //       pct(ds.percentTotal, '总记录')
-    //     } else {
-    //       msg.push({
-    //         txt: '暂无统计信息'
-    //       })
-    //     }
-    //     stat.push(tmp)
-    //   }
-    //   addMsg('最强一击', ret.data?.damage || abyssData?.stat?.dmg || {})
-    //   addMsg('最高承伤', ret.data?.takeDamage || abyssData?.stat.takeDmg || {})
-    //   let abyssStat = abyssData?.stat || {}
-    //   lodash.forEach({ defeat: '最多击破', e: '元素战技', q: '元素爆发' }, (title, key) => {
-    //     if (abyssStat[key]) {
-    //       stat.push({
-    //         title,
-    //         id: abyssStat[key]?.id || 0,
-    //         value: `${abyssStat[key]?.value}次`
-    //       })
-    //     } else {
-    //       stat.push({})
-    //     }
-    //   })
-    //   await player.refreshTalent(avatarIds)
   let ownAvatarData = player.getAvatarData(ownAvatarIds)
   let otherAvatarData = role.getOtherAvatarsData()
 
@@ -134,12 +57,4 @@ export async function RoleCombatSummary (e) {
     save_id: uid,
     uid
   }, { e, scale: 1.2 })
-//     } else {
-//       e.reply('暂未获得本期深渊挑战数据...')
-//       return true
-//     }
-//   } else {
-//     e.reply(`${ret.message || '上传失败'}，请稍后重试...`)
-//   }
-  return true
 }

config/system/cfg_system.js

@@ -20,7 +20,7 @@ export const cfgSchema = {
         def: false,
         miao: true
       },
-      uploadRoleCombat: {
+      roleCombat: {
         title: '#幻想',
         key: '幻想真境剧诗',
         def: false,

models/RoleCombat.js

@@ -5,31 +5,31 @@
 import lodash from 'lodash'
 import moment from 'moment'
 
-import Base from '../models/Base.js'
-import Character from '../models/Character.js'
+import Base from './Base.js'
+import Character from './Character.js'
 import { Data } from '#miao'
 
 moment.locale('zh-cn')
 
-export default class Role extends Base {
+export default class RoleCombat extends Base {
   constructor (data) {
     super()
     this.rounds = {}
     lodash.forEach(data.detail.rounds_data, (round) => {
       let tmp = {
-        'is_get_medal': round.is_get_medal,
-        'choice_cards': round.choice_cards,
-        'buffs': round.buffs,
+        is_get_medal: round.is_get_medal,
+        choice_cards: round.choice_cards,
+        buffs: round.buffs
       }
       let time = moment(new Date(round.finish_time * 1000))
       tmp.finish_time = time.format('MM-DD HH:mm:ss')
       let avatars = []
       lodash.forEach(round.avatars, (avatar) => {
         avatars.push({
-          'avatar_id': avatar.avatar_id.toString(),
-          'name': avatar.name,
-          'avatar_type': avatar.avatar_type,
-          'level': avatar.level,
+          avatar_id: avatar.avatar_id.toString(),
+          name: avatar.name,
+          avatar_type: avatar.avatar_type,
+          level: avatar.level
         })
         // avatar_type:
         // - 1: self
@@ -41,15 +41,11 @@ export default class Role extends Base {
       this.rounds[round.round_id] = tmp
     })
     this.stat = data.stat
-    this.schedule = data.schedule
-    let st = moment(new Date(data.schedule.start_time * 1000))
-    this.start_time = st.format('YYYY.MM.DD')
-    st = moment(new Date(data.schedule.end_time * 1000))
-    this.end_time = st.format('YYYY.MM.DD')
+    this.month = data.schedule.start_date_time.month
   }
 
   getData () {
-    return Data.getData(this, 'rounds,stat,schedule,start_time,end_time')
+    return Data.getData(this, 'rounds,stat,month')
   }
 
   getOwnAvatars () {
@@ -70,8 +66,8 @@ export default class Role extends Base {
       lodash.forEach(round.avatars || [], (avatar) => {
         if (avatar.avatar_id && avatar.avatar_type != 1) {
           let character = new Character({
-            'id': +avatar.avatar_id,
-            'name': avatar.name
+            id: +avatar.avatar_id,
+            name: avatar.name
           })
           let detailInfo = character.getDetail()
           ret[avatar.avatar_id] = {
@@ -88,7 +84,7 @@ export default class Role extends Base {
             face: character.face,
             qFace: character.qFace,
             side: character.side,
-            gacha: character.gacha,
+            gacha: character.gacha
           }
         }
       })

models/index.js

@@ -4,7 +4,7 @@ import Character from './Character.js'
 import Artifact from './Artifact.js'
 import ArtifactSet from './ArtifactSet.js'
 import Abyss from './Abyss.js'
-import Role from './Role.js'
+import RoleCombat from './RoleCombat.js'
 import Player from './Player.js'
 import Avatar from './Avatar.js'
 import ProfileDmg from './ProfileDmg.js'
@@ -31,7 +31,7 @@ for (let game of ['gs', 'sr']) {
 export {
   Base,
   Abyss,
-  Role,
+  RoleCombat,
   Button,
   Character,
   Artifact,

resources/stat/role-summary.css

@@ -44,9 +44,6 @@ body,
   width: 175px;
   height: 90px;
 }
-.role-stat .cont.best-record {
-  width: 120px;
-}
 .role-stat .cont.star-display {
   width: 230px;
 }
@@ -93,39 +90,7 @@ body,
   width: 25px;
   height: 25px;
   background-size: cover;
-}
-.avatar-banner {
-  height: 100px;
-  width: 175px;
-  background-repeat: no-repeat;
-  background-size: 100% auto;
-  background-position: 0 10%;
-}
-.role-data {
-  display: flex;
-  padding: 0 6px;
-}
-.role-data .role-item {
-  color: #fff;
-  margin: 5px;
-}
-.role-data .role-item .info {
-  text-align: center;
-  text-shadow: 0 0 1px #000, 1px 1px 3px #000;
-}
-.role-data .role-item .info strong {
-  display: block;
-  font-weight: normal;
-  font-family: Number, "印品南征北战NZBZ体", NZBZ, "汉仪文黑-65W", YS, PingFangSC-Medium, "PingFang SC", sans-serif;
-}
-.role-data .role-item .info span {
-  font-size: 24px;
-  display: block;
-}
-.role-data .role-item .info span:after {
-  content: "次";
-  font-size: 15px;
-  margin-left: 2px;
+  margin-top: 4px;
 }
 .role-title {
   margin: -3px 0 8px;
@@ -133,6 +98,7 @@ body,
   align-items: flex-end;
 }
 .role-title strong {
+  margin-left: 3px;
   color: #d3bc8e;
   font-size: 18px;
   font-family: Number, "印品南征北战NZBZ体", NZBZ, "汉仪文黑-65W", YS, PingFangSC-Medium, "PingFang SC", sans-serif;
@@ -140,8 +106,8 @@ body,
   margin-right: 10px;
 }
 .role-title .role-star {
-  width: 25px;
-  height: 25px;
+  width: 20px;
+  height: 20px;
   background-size: cover;
 }
 .role-floor-team {
@@ -190,13 +156,8 @@ body,
 .role-buff .role-choice-cards-container .role-choice-cards-content .role-content-container {
   width: 40px;
   display: flex;
-  flex-direction: column;
-  align-items: center;
-  margin-right: 5px;
-}
-.role-buff .role-choice-cards-container .role-choice-cards-content .role-content-container-2 {
-  width: 65px;
-  display: flex;
+  margin-top: 5px;
+  margin-left: 5px;
   flex-direction: column;
   align-items: center;
   margin-right: 5px;
@@ -208,139 +169,7 @@ body,
   background-color: black;
   border-radius: 50%;
 }
-.role-buff .role-choice-cards-container .role-choice-cards-content .role-content-name {
-  width: 100%;
-  color: rgba(100, 100, 100, 0.5);
-  text-align: center;
-  font-size: 9px;
-}
 .role-buff .role-choice-cards-container + .role-choice-cards-container {
   margin-top: 4%;
   /* 两个子元素之间的间距4% */
 }
-.role-detail {
-  display: flex;
-  width: calc(100% + 40px);
-  margin: 10px -15px -10px;
-}
-.role-level {
-  padding: 5px 10px 7px;
-  width: 33%;
-  box-shadow: 0 0 1px 0 #fff;
-}
-.role-level:nth-child(even) {
-  background: rgba(255, 255, 255, 0.1);
-}
-.role-level .info {
-  margin-bottom: 5px;
-  display: flex;
-  padding-left: 8px;
-}
-.role-level .title {
-  font-size: 16px;
-  white-space: nowrap;
-  font-weight: bold;
-}
-.role-level .star {
-  height: 18px;
-  display: inline-block;
-  background: url(./imgs/star.png);
-  background-size: 18px 18px;
-  margin-left: 5px;
-}
-.role-level .star.star1 {
-  width: 18px;
-  margin-right: 36px;
-}
-.role-level .star.star2 {
-  width: 36px;
-  margin-right: 18px;
-}
-.role-level .star.star3 {
-  width: 54px;
-  margin-right: 0;
-}
-.role-level .time {
-  text-align: right;
-  width: 60%;
-  color: #aaa;
-  font-size: 14px;
-}
-.role-level .avatars {
-  display: flex;
-  width: 100%;
-}
-.role-level .avatars .avatar-list {
-  display: flex;
-  position: relative;
-}
-.role-level .avatars .avatar-list.up {
-  padding-right: 15px;
-}
-.role-level .avatars .avatar-list.up:after {
-  content: "";
-  display: block;
-  position: absolute;
-  width: 1px;
-  height: 16px;
-  background: rgba(255, 255, 255, 0.3);
-  right: 8px;
-  top: 50%;
-  margin-top: -8px;
-}
-.role-level .avatars .avatar-icon {
-  width: 33px;
-  height: 33px;
-  border-radius: 50%;
-  margin-right: 2px;
-}
-.role-level .avatars .avatar-icon .img {
-  background-size: auto 100%;
-  background-position: center;
-  width: 29px;
-  height: 29px;
-  margin: 2px;
-}
-.role-notice .cont-body {
-  font-size: 16px;
-}
-.avatar-banner.avatar-枫原万叶,
-.img.wide.avatar-枫原万叶 {
-  background-position: 0 -13%;
-}
-.avatar-banner.avatar-九条裟罗,
-.img.wide.avatar-九条裟罗 {
-  background-position: 0 0;
-}
-.avatar-banner.avatar-香菱,
-.img.wide.avatar-香菱 {
-  background-position: 0 -16%;
-}
-.avatar-banner.avatar-行秋,
-.img.wide.avatar-行秋 {
-  background-position: 0 -16%;
-}
-.avatar-banner.avatar-甘雨,
-.img.wide.avatar-甘雨 {
-  background-position: 0 -8%;
-}
-.avatar-banner.avatar-刻晴,
-.img.wide.avatar-刻晴 {
-  background-position: 0 -5%;
-}
-.avatar-banner.avatar-神里绫华,
-.img.wide.avatar-神里绫华 {
-  background-position: 0 13%;
-}
-.avatar-banner.avatar-班尼特,
-.img.wide.avatar-班尼特 {
-  background-position: 0 15%;
-}
-.avatar-banner.avatar-五郎,
-.img.wide.avatar-五郎 {
-  background-position: 0 15%;
-}
-.avatar-banner.avatar-托马,
-.img.wide.avatar-托马 {
-  background-position: 0 -5%;
-}

resources/stat/role-summary.html

@@ -9,22 +9,12 @@
 {{block 'main'}}
 {{ set difficultyName = {1:'简单', 2:'普通', 3:'困难'} }}
 <div class="head-box type">
-  <div class="title">#上传幻想<span>{{role.start_time}}-{{role.end_time}}</span></div>
+  <div class="title">#幻想真境剧诗<span>{{role.month}}月 · {{difficultyName[role.stat.difficulty_id]}}模式</span></div>
   <div class="uid">UID:{{uid}}</div>
 </div>
 <div class="info_box">
-
   <div class="role-stat-cont">
-
     <div class="role-stat">
-      <div class="cont best-record">
-        <div class="stat-title">
-          <span>最佳纪录</span>
-        </div>
-        <div class="stat-msg">
-          <strong>{{ difficultyName[role.stat.difficulty_id] }} {{role.stat.max_round_id}}</strong>
-        </div>
-      </div>
       <div class="cont star-display">
         <div class="stat-title">
           <span>明星挑战星章</span>
@@ -33,9 +23,9 @@
           {{each role.stat.get_medal_round_list star}}
           <div class="stat-star-container">
             {{if star == 1}}
-            <div class="stat-star" style="background-image:url({{_res_path}}/stat/imgs/role/star/star.png)"></div>
+            <div class="stat-star" style="background-image:url({{_res_path}}/stat/imgs/medal.png)"></div>
             {{else}}
-            <div class="stat-star" style="background-image:url({{_res_path}}/stat/imgs/role/star/nostar.png)"></div>
+            <div class="stat-star" style="background-image:url({{_res_path}}/stat/imgs/nomedal.png)"></div>
             {{/if}}
           </div>
           {{/each}}
@@ -74,9 +64,9 @@
     <div class="cont-body">
       <div class="role-title">
         {{if round.is_get_medal}}
-        <div class="role-star" style="background-image:url({{_res_path}}/stat/imgs/role/star/star.png)"></div>
+        <div class="role-star" style="background-image:url({{_res_path}}/stat/imgs/medal.png)"></div>
         {{else}}
-        <div class="role-star" style="background-image:url({{_res_path}}/stat/imgs/role/star/nostar.png)"></div>
+        <div class="role-star" style="background-image:url({{_res_path}}/stat/imgs/nomedal.png)"></div>
         {{/if}}
         <strong>第 {{round_index}} 幕</strong>
         <span>{{round?.finish_time}}</span>
@@ -96,8 +86,7 @@
             <div class="role-choice-cards-content">
               {{each buffs buff}}
                 <div class="role-content-container">
-                  <div class="role-content-icon" style="background-image:url({{_res_path}}/stat/imgs/role/buffs/{{buff.id}}.png)"></div>
-                  <div class="role-content-name">{{buff.name}}</div>
+                  <div class="role-content-icon" style="background-image:url({{buff.icon}})"></div>
                 </div>
               {{/each}}
             </div>
@@ -107,41 +96,14 @@
             <div class="role-choice-cards-header">神秘收获</div>
             <div class="role-choice-cards-content">
               {{each choice_cards choice_card}}
-                <div class="role-content-container-2">
-                  <div class="role-content-icon" style="background-image:url({{_res_path}}/stat/imgs/role/choice_cards/{{choice_card.id}}.png)"></div>
-                  <div class="role-content-name">{{choice_card.name}}</div>
+                <div class="role-content-container">
+                  <div class="role-content-icon" style="background-image:url({{choice_card.icon}})"></div>
                 </div>
               {{/each}}
             </div>
           </div>
         </div>
       </div>
-      <!-- <div class="role-detail">
-        {{each floor?.levels level idx}}
-        <div class="role-level">
-          <div class="info">
-            <div class="title">
-              第{{idx}}间
-            </div>
-            <span class="star star{{level.star}}"></span>
-            <div class="time">{{level?.up?.time}}</div>
-          </div>
-          <div class="avatars">
-            {{each upDown v k}}
-            <div class="avatar-list {{k}}">
-              {{each level[k]?.avatars||[] id}}
-              {{set avatar = avatars[id] || {} }}
-              <div class="avatar-icon item-icon star{{avatar.star==4?4:5}}">
-      <span class="img"
-            style="background-image:url({{_res_path}}{{avatar.face}})"></span>
-              </div>
-              {{/each}}
-            </div>
-            {{/each}}
-          </div>
-        </div>
-        {{/each}}
-      </div> -->
     </div>
   </div>
   {{/each}}
@@ -149,9 +111,8 @@
   <div class="cont role-notice">
     <div class="cont-body">
       <ul class="cont-msg">
-        <li><strong>#上传幻想</strong>不会上传你的角色列表及当期幻想真境剧诗挑战数据，喵~</li>
         <li><strong>明星挑战星章</strong>仅作为展示用，<strong>不会</strong>影响挑战的奖励领取~</li>
-        <li>角色装备与圣遗物为当前最新状态；排名会随时间而更新，数据排名仅供娱乐~</li>
+        <li>角色装备与圣遗物为当前最新状态</li>
       </ul>
     </div>
   </div>

resources/stat/role-summary.less

@@ -1,7 +1,9 @@
 @import "../common/base.less";
 
 @scale: 1.4;
-body, .container {
+
+body,
+.container {
   width: 970px;
 }
 
@@ -49,10 +51,6 @@ body, .container {
     height: 90px;
   }
 
-  .cont.best-record {
-    width: 120px;
-  }
-
   .cont.star-display {
     width: 230px;
   }
@@ -96,54 +94,15 @@ body, .container {
     justify-content: flex-start;
 
     .stat-star-container {
-      flex: 0 0 11%; /* 23% 是为了在有间隙的情况下，四个元素一行 */
+      flex: 0 0 11%;
+      /* 23% 是为了在有间隙的情况下，四个元素一行 */
       margin-bottom: 10px;
 
       .stat-star {
         width: 25px;
         height: 25px;
         background-size: cover;
-      }
-    }
-  }
-}
-
-
-.avatar-banner {
-  height: 100px;
-  width: 175px;
-  background-repeat: no-repeat;
-  background-size: 100% auto;
-  background-position: 0 10%;
-}
-
-.role-data {
-  display: flex;
-  padding: 0 6px;
-
-  .role-item {
-    color: #fff;
-    margin: 5px;
-
-    .info {
-      text-align: center;
-      text-shadow: 0 0 1px #000, 1px 1px 3px #000;
-
-      strong {
-        display: block;
-        font-weight: normal;
-        .font-NZBZ;
-      }
-
-      span {
-        font-size: 24px;
-        display: block;
-
-        &:after {
-          content: "次";
-          font-size: 15px;
-          margin-left: 2px;
-        }
+        margin-top: 4px;
       }
     }
   }
@@ -155,6 +114,7 @@ body, .container {
   align-items: flex-end;
 
   strong {
+    margin-left: 3px;
     color: #d3bc8e;
     font-size: 18px;
     .font-NZBZ;
@@ -163,8 +123,8 @@ body, .container {
   }
 
   .role-star {
-    width: 25px;
-    height: 25px;
+    width: 20px;
+    height: 20px;
     background-size: cover;
   }
 }
@@ -219,19 +179,13 @@ body, .container {
       .role-content-container {
         width: 40px;
         display: flex;
+        margin-top: 5px;
+        margin-left: 5px;
         flex-direction: column;
         align-items: center;
         margin-right: 5px
       }
 
-      .role-content-container-2 {
-        width: 65px;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        margin-right: 5px;
-      }
-
       .role-content-icon {
         width: 40px;
         height: 40px;
@@ -239,168 +193,11 @@ body, .container {
         background-color: black;
         border-radius: 50%;
       }
-
-      .role-content-name {
-        width: 100%;
-        color: rgba(100, 100, 100, 0.5);
-        text-align: center;
-        font-size: 9px;
-      }
     }
   }
 
   .role-choice-cards-container + .role-choice-cards-container {
-    margin-top: 4%; /* 两个子元素之间的间距4% */
-  }
-}
-
-.role-detail {
-  display: flex;
-  width: calc(100% + 40px);
-  margin: 10px -15px -10px;
-}
-
-
-.role-level {
-  padding: 5px 10px 7px;
-  width: 33%;
-  box-shadow: 0 0 1px 0 #fff;
-
-  &:nth-child(even) {
-    background: rgba(255, 255, 255, .1)
-  }
-
-
-  .info {
-    margin-bottom: 5px;
-    display: flex;
-    padding-left: 8px;
-  }
-
-  .title {
-    font-size: 16px;
-    white-space: nowrap;
-    font-weight: bold;
-  }
-
-  .star {
-    @size: 18px;
-
-    height: @size;
-    display: inline-block;
-    background: url(./imgs/star.png);
-    background-size: @size @size;
-    margin-left: 5px;
-
-    &.star1 {
-      width: @size;
-      margin-right: @size * 2;
-    }
-
-    &.star2 {
-      width: @size * 2;
-      margin-right: @size;
-    }
-
-    &.star3 {
-      width: @size * 3;
-      margin-right: 0;
-    }
-  }
-
-  .time {
-    text-align: right;
-    width: 60%;
-    color: #aaa;
-    font-size: 14px;
-  }
-
-  .avatars {
-    display: flex;
-    width: 100%;
-
-    .avatar-list {
-      display: flex;
-      position: relative;
-
-      &.up {
-        padding-right: 15px;
-      }
-
-      &.up:after {
-        content: "";
-        display: block;
-        position: absolute;
-        width: 1px;
-        height: 16px;
-        background: rgba(255, 255, 255, .3);
-        right: 8px;
-        top: 50%;
-        margin-top: -8px;
-      }
-    }
-
-    .avatar-icon {
-      width: 33px;
-      height: 33px;
-      border-radius: 50%;
-      margin-right: 2px;
-
-      .img {
-        background-size: auto 100%;
-        background-position: center;
-        width: 29px;
-        height: 29px;
-        margin: 2px;
-      }
-    }
-  }
-}
-
-.role-notice {
-  .cont-body {
-    font-size: 16px;
-  }
-}
-
-.avatar-banner, .img.wide {
-  &.avatar-枫原万叶 {
-    background-position: 0 -13%;
-  }
-
-  &.avatar-九条裟罗 {
-    background-position: 0 0;
-  }
-
-  &.avatar-香菱 {
-    background-position: 0 -16%;
-  }
-
-  &.avatar-行秋 {
-    background-position: 0 -16%;
-  }
-
-  &.avatar-甘雨 {
-    background-position: 0 -8%;
-  }
-
-  &.avatar-刻晴 {
-    background-position: 0 -5%;
-  }
-
-  &.avatar-神里绫华 {
-    background-position: 0 13%;
-  }
-
-  &.avatar-班尼特 {
-    background-position: 0 15%;
-  }
-
-  &.avatar-五郎 {
-    background-position: 0 15%;
-  }
-
-  &.avatar-托马 {
-    background-position: 0 -5%;
+    margin-top: 4%;
+    /* 两个子元素之间的间距4% */
   }
 }