PaiGramTeam/miao-plugin
3
0
Fork 0
mirror of https://github.com/yoimiya-kokomi/miao-plugin.git synced 2024-11-16 04:35:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

1. 角色卡片展示支持旅行者

Browse Source 
2. 调整角色卡片的样式与布局
This commit is contained in:
yoimiya-kokomi 2022-03-28 04:58:02 +08:00
parent ffbff09dd3
commit ad3d4ad587
5 changed files with 50 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
*.psd

6
apps/character.js
View File

@ -67,13 +67,15 @@ export async function character(e, { render, MysApi, User }) {
avatars = lodash.keyBy(avatars, "id"); avatars = lodash.keyBy(avatars, "id");
if (roleId == 20000000) { if (roleId == 20000000) {
if (avatars["10000005"]) { if (avatars["10000005"]) {
roleId = "10000005"; roleId = 10000005;
} }
if (avatars["10000007"]) { if (avatars["10000007"]) {
roleId = "10000007"; roleId = 10000007;
} }
} }
char.roleId = roleId;
if (!avatars[roleId]) { if (!avatars[roleId]) {
let name = lodash.truncate(e.sender.card, { length: 8 }); let name = lodash.truncate(e.sender.card, { length: 8 });

19
components/models/Character.js
View File

@ -26,10 +26,25 @@ const elemName = {
class Character extends Base { class Character extends Base {
constructor(name) { constructor(name) {
super(); super();
this.name = name; this._name = name;
this.sName = this.name; this.sName = this.name;
this.id = YunzaiApps.mysInfo['roleIdToName'](name); this.id = YunzaiApps.mysInfo['roleIdToName'](name);
lodash.extend(this, getMetaData(name)) lodash.extend(this, getMetaData(name));
}
get name() {
if (this.roleId) {
if (this.roleId * 1 === 10000005) {
this._name = "空";
} else if (this.roleId * 1 === 10000007) {
this._name = "荧";
}
}
return this._name;
}
set name(name) {
this._name = name;
} }
async checkImgCache(resDir) { async checkImgCache(resDir) {

68
resources/character/character.css
View File

@ -30,7 +30,7 @@
body { body {
font-size: 16px; font-size: 16px;
color: #fff; color: #fff;
transform: scale(1.40); transform: scale(1);
transform-origin: 0 0; transform-origin: 0 0;
} }
@ -53,7 +53,7 @@ body {
left: 0px; left: 0px;
right: 0px; right: 0px;
box-shadow: 0 -5px 10px 0 #000; box-shadow: 0 -5px 10px 0 #000;
padding: 35px 10px 10px 35px; padding: 10px 10px 10px 150px;
text-shadow: 0 0 1px #000, 1px 1px 3px #000; text-shadow: 0 0 1px #000, 1px 1px 3px #000;
font-family: tttgbnumber; font-family: tttgbnumber;
@ -69,18 +69,20 @@ body {
font-size: 36px; font-size: 36px;
} }
.char_name { .char_name {
font-family: "NZBZ"; font-family: "NZBZ";
font-size: 80px; font-size: 60px;
letter-spacing: 5px; letter-spacing: 5px;
line-height: 90px; line-height: 90px;
height: 100px;
text-shadow: 0 0 3px #000, 3px 3px 5px #000;
display: inline-block; display: inline-block;
position: absolute;
top: -60px;
left: 20px;
white-space: nowrap; white-space: nowrap;
position: absolute;
top: 10px;
padding-left: 20px;
left: 0;
height: 85px;
text-shadow: 0 0 3px #000, 3px 3px 5px #000;
} }
.char_name:after { .char_name:after {
@ -95,6 +97,8 @@ body {
left: -50px; left: -50px;
opacity: 1; opacity: 1;
transition: width 0.3s 0.1s, opacity 0.3s 0.1s; transition: width 0.3s 0.1s, opacity 0.3s 0.1s;
box-shadow: 0 0 2px 0 #000;
bottom: 1px;
} }
.char_name .uid { .char_name .uid {
@ -105,9 +109,10 @@ body {
top: -25px; top: -25px;
left: 15px; left: 15px;
letter-spacing: 0; letter-spacing: 0;
top: 90px;
} }
.char_name .cons { .cons {
display: inline-block; display: inline-block;
width: 55px; width: 55px;
height: 35px; height: 35px;
@ -120,6 +125,7 @@ body {
font-family: tttgbnumber; font-family: tttgbnumber;
box-shadow: 0px 0px 3px 0px #000; box-shadow: 0px 0px 3px 0px #000;
text-shadow: 0 0 3px #000; text-shadow: 0 0 3px #000;
margin-right: 15px;
} }
.cons_0 { .cons_0 {
@ -152,8 +158,7 @@ body {
.crown { .crown {
width: 35px; width: 35px;
height: 35px; height: 30px;
margin-top: -3px;
margin-left: 15px; margin-left: 15px;
display: inline-block; display: inline-block;
background-size: contain; background-size: contain;
@ -170,11 +175,11 @@ body {
} }
.crown.crown_2 { .crown.crown_2 {
width: 70px; width: 60px;
} }
.crown.crown_3 { .crown.crown_3 {
width: 105px; width: 90px;
} }
.detail { .detail {
@ -395,24 +400,11 @@ body.bottom_mode {
width: 500px; width: 500px;
} }
.bottom_mode .cons {
position: absolute;
left: 5px;
top: -30px;
}
.bottom_mode .uid {
left: 70px;
}
.bottom_mode .info {
padding-left: 150px;
}
.bottom_mode .weapon { .bottom_mode .weapon {
left: 0; left: 0;
bottom: 0; bottom: 0;
top: 40px; top: 0px;
padding-top: 120px; padding-top: 120px;
width: 140px; width: 140px;
} }
@ -468,7 +460,6 @@ body.bottom_mode {
.left_mode { .left_mode {
width: 800px; width: 800px;
transform: scale(1); transform: scale(1);
} }
.left_mode .info { .left_mode .info {
@ -478,27 +469,6 @@ body.bottom_mode {
border-radius: 0 20px 0 0; border-radius: 0 20px 0 0;
} }
.left_mode .char_name {
position: fixed;
top: 10px;
font-size: 60px;
padding-left: 20px;
left: 0;
height: 85px;
text-shadow: 0 0 3px #000, 3px 3px 5px #000;
}
.left_mode .char_name:after {
box-shadow: 0 0 2px 0 #000;
}
.left_mode .char_name:after {
bottom: 1px;
}
.left_mode .char_name .uid {
top: 90px;
}
.left_mode .weapon { .left_mode .weapon {
top: -170px; top: -170px;

15
resources/character/character.html
View File

@ -7,23 +7,26 @@
</head> </head>
<body class="{{bg.mode}}_mode"> <body class="{{bg.mode}}_mode">
<div class="container" id="container"> <div class="container" id="container">
<div class="char_name">
<div class="uid">ID:{{uid}}</div>
<span>{{ds.name}}</span>
<span
class="cons cons_{{actived_constellation_num}}">{{actived_constellation_num}}命</span>
</div>
<div class="info"> <div class="info">
<div class="char_name"> <div class="detail"> Lv.{{level}} ❤{{fetter}}
<div class="uid">ID:{{uid}}</div>
<span>{{ds.name}} <span
class="cons cons_{{actived_constellation_num}}">{{actived_constellation_num}}命</span></span>
</div>
<div class="detail"> Lv.{{level}} ❤{{fetter}}
<span class="crown crown_{{crownNum}}"></span> <span class="crown crown_{{crownNum}}"></span>
</div> </div>
<div class="weapon"> <div class="weapon">
<div class="weapon_cont"> <div class="weapon_cont">
<img title="{{weapon.name}}" src="{{_res_path}}/genshin/logo/weapon/{{weapon.name}}.png"/> <img title="{{weapon.name}}" src="{{_res_path}}/genshin/logo/weapon/{{weapon.name}}.png"/>
<p class="weapon_lv">Lv.{{weapon.level}}</p> <p class="weapon_lv">Lv.{{weapon.level}}</p>
<p class="weapon_affix">{{weapon.affix_level}}</p> <p class="weapon_affix">{{weapon.affix_level}}</p>
</div> </div>
<p class="weapon_name"> <p class="weapon_name">
<span class="for_left">Lv.{{weapon.level}} 精{{weapon.affix_level}}</span> <span class="for_left">Lv.{{weapon.level}} 精{{weapon.affix_level}}</span>
<span class="for_bottom">精{{weapon.affix_level}} </span> <span class="for_bottom">精{{weapon.affix_level}} </span>
{{weapon.name}} {{weapon.name}}