mirror of
https://github.com/yoimiya-kokomi/miao-plugin.git
synced 2024-09-28 03:46:09 +00:00
面板武器样式微调
This commit is contained in:
Kokomi
parent
dc2fa84c94
commit
3aed243ba4
@ -163,7 +163,7 @@ export default class AvatarData extends Base {
|
||||
map[`10${i}`] = `${prefix}10${i}`
|
||||
}
|
||||
}
|
||||
lodash.forEach(ds,(id)=>{
|
||||
lodash.forEach(ds, (id) => {
|
||||
let ret = /\d{4}(\d{3})/.exec(id)
|
||||
this.trees.push(map[ret?.[1] || id] || id)
|
||||
})
|
||||
@ -188,9 +188,6 @@ export default class AvatarData extends Base {
|
||||
}
|
||||
|
||||
getWeaponDetail () {
|
||||
if (this.isGs) {
|
||||
return this.weapon
|
||||
}
|
||||
let ret = {
|
||||
...this.weapon
|
||||
}
|
||||
@ -199,10 +196,21 @@ export default class AvatarData extends Base {
|
||||
}
|
||||
let wData = Weapon.get(ret.id, this.game)
|
||||
ret.splash = wData.imgs.gacha
|
||||
let attrs = wData.calcAttr(ret.level, ret.promote)
|
||||
lodash.forEach(attrs, (val, key) => {
|
||||
attrs[key] = Format.comma(val, 1)
|
||||
})
|
||||
let wAttr = wData.calcAttr(ret.level, ret.promote)
|
||||
let attrs = {}
|
||||
if (this.isSr) {
|
||||
lodash.forEach(wAttr, (val, key) => {
|
||||
attrs[key] = Format.comma(val, 1)
|
||||
})
|
||||
} else if (this.isGs) {
|
||||
attrs.atkBase = Format.comma(wAttr.atkBase, 1)
|
||||
if (wAttr?.attr?.key) {
|
||||
let keyType = {
|
||||
mastery: 'comma'
|
||||
}
|
||||
attrs[wAttr.attr.key] = Format[keyType[wAttr.attr.key] || 'pct'](wAttr.attr.value, 1)
|
||||
}
|
||||
}
|
||||
ret.attrs = attrs
|
||||
ret.desc = wData.getAffixDesc(ret.affix)
|
||||
return ret
|
||||
|
||||
@ -74,7 +74,7 @@ class Weapon extends Base {
|
||||
}
|
||||
|
||||
get maxAffix () {
|
||||
if(this.isSr){
|
||||
if (this.isSr) {
|
||||
return 5
|
||||
}
|
||||
let data = this.detail?.affixData?.datas || {}
|
||||
@ -177,6 +177,9 @@ class Weapon extends Base {
|
||||
|
||||
// 获取精炼描述
|
||||
getAffixDesc (affix = 1) {
|
||||
if (this.isGs) {
|
||||
return {}
|
||||
}
|
||||
let skill = this.detail.skill
|
||||
let { name, desc, tables } = skill
|
||||
let reg = /\$(\d)\[(?:i|f1)\](\%?)/g
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
}
|
||||
.artis .item .avatar {
|
||||
position: absolute;
|
||||
left: 30px;
|
||||
right: 0;
|
||||
top: 24px;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
|
||||
.artis .item .avatar {
|
||||
position: absolute;
|
||||
left: 30px;
|
||||
right: 0;
|
||||
top: 24px;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
@ -38,4 +38,4 @@
|
||||
.artis .item .avatar img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@ -513,28 +513,6 @@ body {
|
||||
.artis .head span {
|
||||
font-size: 14px;
|
||||
}
|
||||
.artis.input-mode .item {
|
||||
height: 100px;
|
||||
margin: 5px 3px;
|
||||
}
|
||||
.artis.input-mode .item.weapon {
|
||||
margin-left: 5px;
|
||||
}
|
||||
.artis.input-mode .item.arti {
|
||||
width: 72px;
|
||||
}
|
||||
.artis.input-mode .item.arti .arti-icon,
|
||||
.artis.input-mode .item.arti img {
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
.artis.input-mode .item.arti .head {
|
||||
padding: 78px 0 0 0;
|
||||
}
|
||||
.artis.input-mode .item.arti .head strong {
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
}
|
||||
.mark-ACE,
|
||||
.mark-ACE² {
|
||||
color: #e85656;
|
||||
@ -653,6 +631,7 @@ body {
|
||||
transform: scale(0.8);
|
||||
transform-origin: 100px 10px;
|
||||
display: inline-block;
|
||||
display: none;
|
||||
}
|
||||
.artis .weapon .star.star-2 {
|
||||
background-position: 0 -20px;
|
||||
@ -667,14 +646,15 @@ body {
|
||||
background-position: 0 -80px;
|
||||
}
|
||||
.artis .weapon {
|
||||
overflow: hidden;
|
||||
height: 97px;
|
||||
height: 86px;
|
||||
overflow: visible;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.artis .weapon .img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
background-position: center;
|
||||
@ -683,30 +663,33 @@ body {
|
||||
}
|
||||
.artis .weapon .head {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
text-align: right;
|
||||
padding: 13px 12px 13px 0;
|
||||
padding: 15px 0 10px 15px;
|
||||
z-index: 3;
|
||||
border-radius: 10px;
|
||||
background: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7), rgba(25, 25, 25, 0.5), rgba(25, 25, 25, 0), rgba(25, 25, 25, 0));
|
||||
}
|
||||
.artis .weapon .head strong {
|
||||
font-size: 18px;
|
||||
font-size: 15px;
|
||||
margin-bottom: 3px;
|
||||
font-weight: normal;
|
||||
}
|
||||
.artis .weapon .head > span {
|
||||
display: block;
|
||||
}
|
||||
.artis .weapon span {
|
||||
font-size: 16px;
|
||||
.artis .weapon span.info {
|
||||
font-size: 14px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.artis .weapon .affix {
|
||||
color: #000;
|
||||
padding: 0 7px;
|
||||
border-radius: 4px;
|
||||
margin-left: 5px;
|
||||
font-size: 16px;
|
||||
font-size: 14px;
|
||||
width: 40px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.artis .weapon .affix-1 {
|
||||
box-shadow: 0 0 4px 0 #a3a3a3 inset;
|
||||
@ -728,8 +711,32 @@ body {
|
||||
box-shadow: 0 0 4px 0 #deaf39 inset;
|
||||
background: #fff6dd;
|
||||
}
|
||||
.artis .artis-stat {
|
||||
height: 85px;
|
||||
.artis .weapon .weapon-attr {
|
||||
font-size: 14px;
|
||||
text-shadow: 0 0 1px #000, 1px 1px 2px rgba(0, 0, 0, 0.7);
|
||||
display: flex;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 26px;
|
||||
width: 100%;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
line-height: 26px;
|
||||
border-radius: 0 0 10px 10px;
|
||||
text-align: center;
|
||||
padding: 0 5px 0 10px;
|
||||
}
|
||||
.artis .weapon .weapon-attr div {
|
||||
width: 50%;
|
||||
}
|
||||
.artis .weapon .weapon-attr div span {
|
||||
color: #ffe699;
|
||||
font-weight: bold;
|
||||
}
|
||||
.artis .arti-stat {
|
||||
height: 94px;
|
||||
padding-top: 5px;
|
||||
}
|
||||
.arti-class-title {
|
||||
height: 25px;
|
||||
@ -852,7 +859,7 @@ body {
|
||||
position: relative;
|
||||
border-radius: 10px 10px 0 0;
|
||||
text-shadow: 0 0 1px #000, 1px 1px 2px rgba(0, 0, 0, 0.7);
|
||||
padding: 17px 10px 3px 15px;
|
||||
padding: 15px 10px 5px 15px;
|
||||
background: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7), rgba(25, 25, 25, 0.3), rgba(25, 25, 25, 0), rgba(25, 25, 25, 0));
|
||||
}
|
||||
.artis .item.arti .arti-icon {
|
||||
@ -874,6 +881,8 @@ body {
|
||||
}
|
||||
.artis ul.detail {
|
||||
backdrop-filter: blur(2px);
|
||||
border-radius: 0 0 10px 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.artis ul.detail li.arti-main {
|
||||
background: rgba(25, 25, 25, 0.5);
|
||||
|
||||
@ -75,8 +75,7 @@
|
||||
<div class="head">
|
||||
<strong>{{weapon.name}}</strong>
|
||||
<div class="star star-{{weapon.star}}"></div>
|
||||
<span>Lv.{{weapon.leve || weapon.level}} <span
|
||||
class="affix affix-{{weapon.affix}}">精{{weapon.affix}}</span></span>
|
||||
<span><span class="affix affix-{{weapon.affix}}">精{{weapon.affix}}</span> Lv.{{weapon.leve || weapon.level}} </span>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
@ -122,8 +121,7 @@
|
||||
<div class="talent-icon
|
||||
{{talent.level > talent.original ? `talent-plus`:``}}
|
||||
{{talent.original >= 10 ? `talent-crown`:``}}">
|
||||
<div class="talent-icon-img"
|
||||
style="background-image:url({{_res_path}}{{imgs[key]}})"></div>
|
||||
<div class="talent-icon-img" style="background-image:url({{_res_path}}{{imgs[key]}})"></div>
|
||||
<strong>{{talent.level}}</strong>
|
||||
<span>{{tName}}</span>
|
||||
</div>
|
||||
@ -183,9 +181,16 @@
|
||||
<div class="img" style="background-image:url({{_res_path}}{{weapon.img}})"></div>
|
||||
<div class="head">
|
||||
<strong>{{weapon.name}}</strong>
|
||||
<div class="star star-{{weapon.star}}"></div>
|
||||
<span>Lv.{{weapon.leve || weapon.level}} <span
|
||||
class="affix affix-{{weapon.affix}}">精{{weapon.affix}}</span></span>
|
||||
<span class="info"><span
|
||||
class="affix affix-{{weapon.affix}}">精{{weapon.affix}}</span> Lv.{{weapon.leve || weapon.level}} </span>
|
||||
<div class="weapon-attr">
|
||||
<div><span>攻击</span> +{{weapon.attrs.atkBase}}</div>
|
||||
{{each weapon.attrs v k}} {{if k!== 'atkBase' }}
|
||||
{{ set titleMap = {atkPct:'攻击',mastery:'精通',dmg:'伤害',hpPct:'生命',defPct:'防御',
|
||||
cpct:'暴击', cdmg:'爆伤', phy:'物伤'} }}
|
||||
<div><span>{{ titleMap[k] }}</span> +{{v}}</div>
|
||||
{{/if}} {{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item arti-stat">
|
||||
@ -197,6 +202,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
{{each ad.artis ds idx}}
|
||||
<div class="item arti">
|
||||
{{if ds && ds.name && ds.main && ds.main.key && ds.main.key!="undefined"}}
|
||||
|
||||
@ -632,41 +632,6 @@ body {
|
||||
.mark {
|
||||
}
|
||||
}
|
||||
|
||||
&.input-mode {
|
||||
.item {
|
||||
height: 100px;
|
||||
margin: 5px 3px;
|
||||
|
||||
&.weapon {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
&.arti {
|
||||
width: 72px;
|
||||
|
||||
|
||||
.arti-icon, img {
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
}
|
||||
|
||||
span {
|
||||
|
||||
}
|
||||
|
||||
.head {
|
||||
padding: 78px 0 0 0;
|
||||
|
||||
strong {
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mark-ACE,
|
||||
@ -812,6 +777,7 @@ body {
|
||||
transform: scale(0.8);
|
||||
transform-origin: 100px 10px;
|
||||
display: inline-block;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.artis .weapon .star.star-2 {
|
||||
@ -832,84 +798,114 @@ body {
|
||||
|
||||
|
||||
.artis .weapon {
|
||||
overflow: hidden;
|
||||
height: 97px;
|
||||
height: 86px;
|
||||
overflow: visible;
|
||||
margin-bottom: 10px;
|
||||
|
||||
|
||||
.img {
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.head {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
padding: 15px 0 10px 15px;
|
||||
z-index: 3;
|
||||
border-radius: 10px;
|
||||
background: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7), rgba(25, 25, 25, 0.5), rgba(25, 25, 25, 0), rgba(25, 25, 25, 0));
|
||||
|
||||
strong {
|
||||
font-size: 15px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
& > span {
|
||||
display: block;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
span.info {
|
||||
font-size: 14px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.affix {
|
||||
color: #000;
|
||||
padding: 0 7px;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
width: 40px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.affix-1 {
|
||||
box-shadow: 0 0 4px 0 #a3a3a3 inset;
|
||||
background: #ebebebaa;
|
||||
}
|
||||
|
||||
.affix-2 {
|
||||
box-shadow: 0 0 4px 0 #51b72fbd inset;
|
||||
background: #ddffdeaa;
|
||||
}
|
||||
|
||||
.affix-3 {
|
||||
box-shadow: 0 0 4px 0 #396cdecf inset;
|
||||
background: #ddebffaa;
|
||||
}
|
||||
|
||||
.affix-4 {
|
||||
box-shadow: 0 0 4px 0 #c539debf inset;
|
||||
background: #ffddf0aa;
|
||||
}
|
||||
|
||||
.affix-5 {
|
||||
box-shadow: 0 0 4px 0 #deaf39 inset;
|
||||
background: #fff6dd;
|
||||
}
|
||||
|
||||
.weapon-attr {
|
||||
font-size: 14px;
|
||||
text-shadow: 0 0 1px #000, 1px 1px 2px rgba(0, 0, 0, 0.7);
|
||||
display: flex;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 26px;
|
||||
width: 100%;
|
||||
background: rgba(0, 0, 0, .2);
|
||||
line-height: 26px;
|
||||
border-radius: 0 0 10px 10px;
|
||||
text-align: center;
|
||||
padding: 0 5px 0 10px;
|
||||
|
||||
div {
|
||||
width: 50%;
|
||||
|
||||
span {
|
||||
color: #ffe699;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.artis .weapon .img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.artis .weapon .head {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
text-align: right;
|
||||
padding: 13px 12px 13px 0;
|
||||
z-index: 3;
|
||||
//background-image: linear-gradient(to right, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.7));
|
||||
}
|
||||
|
||||
.artis .weapon .head strong {
|
||||
font-size: 18px;
|
||||
margin-bottom: 3px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.artis .weapon .head > span {
|
||||
display: block;
|
||||
|
||||
}
|
||||
|
||||
.artis .weapon span {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.artis .weapon .affix {
|
||||
color: #000;
|
||||
padding: 0 7px;
|
||||
border-radius: 4px;
|
||||
margin-left: 5px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
|
||||
.artis .weapon .affix-1 {
|
||||
box-shadow: 0 0 4px 0 #a3a3a3 inset;
|
||||
background: #ebebebaa;
|
||||
}
|
||||
|
||||
.artis .weapon .affix-2 {
|
||||
box-shadow: 0 0 4px 0 #51b72fbd inset;
|
||||
background: #ddffdeaa;
|
||||
}
|
||||
|
||||
.artis .weapon .affix-3 {
|
||||
box-shadow: 0 0 4px 0 #396cdecf inset;
|
||||
background: #ddebffaa;
|
||||
}
|
||||
|
||||
.artis .weapon .affix-4 {
|
||||
box-shadow: 0 0 4px 0 #c539debf inset;
|
||||
background: #ffddf0aa;
|
||||
}
|
||||
|
||||
.artis .weapon .affix-5 {
|
||||
box-shadow: 0 0 4px 0 #deaf39 inset;
|
||||
background: #fff6dd;
|
||||
}
|
||||
|
||||
.artis .artis-stat {
|
||||
height: 85px;
|
||||
.artis .arti-stat {
|
||||
height: 94px;
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.arti-class-title {
|
||||
@ -1077,7 +1073,7 @@ body {
|
||||
position: relative;
|
||||
border-radius: 10px 10px 0 0;
|
||||
text-shadow: 0 0 1px #000, 1px 1px 2px rgba(0, 0, 0, 0.7);
|
||||
padding: 17px 10px 3px 15px;
|
||||
padding: 15px 10px 5px 15px;
|
||||
background: linear-gradient(to right, rgba(0, 0, 0, .7), rgba(0, 0, 0, .7), rgba(25, 25, 25, .3), rgba(25, 25, 25, .0), rgba(25, 25, 25, 0));
|
||||
}
|
||||
|
||||
@ -1104,6 +1100,8 @@ body {
|
||||
|
||||
ul.detail {
|
||||
backdrop-filter: blur(2px);
|
||||
border-radius: 0 0 10px 10px;
|
||||
overflow: hidden;
|
||||
|
||||
li.arti-main {
|
||||
background: rgba(25, 25, 25, .5);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user