Yunzai-Plugin/ZZZ-Plugin
1
0
Fork 0
mirror of https://github.com/ZZZure/ZZZ-Plugin.git synced 2025-12-16 21:27:47 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: panel

Browse source
This commit is contained in:
bietiaop 2024-07-13 17:52:31 +08:00
parent 35c8c95b80
commit 27171c5727
77 changed files with 2126 additions and 312 deletions
Download patch file Download diff file Expand all files Collapse all files

35
resources/card/index.css
View file

@ -42,7 +42,7 @@
width: 100%;
position: relative;
}
.card .list .item * {
.card .list .item > * {
position: inherit;
z-index: 1;
}
@ -82,13 +82,44 @@
object-fit: contain;
display: block;
}
.card .list .item .level {
.card .list .item .c-info {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background: rgb(0, 0, 0);
color: white;
display: flex;
text-align: center;
}
.card .list .item .c-info .ranks {
background: rgb(117, 117, 117);
padding: 0 0.4em;
}
.card .list .item .c-info .ranks.r1 {
background: rgb(58, 116, 43);
}
.card .list .item .c-info .ranks.r2 {
background: rgb(61, 132, 214);
}
.card .list .item .c-info .ranks.r3 {
background: rgb(223, 118, 118);
}
.card .list .item .c-info .ranks.r4 {
background: rgb(51, 54, 161);
}
.card .list .item .c-info .ranks.r5 {
background: rgb(102, 127, 19);
}
.card .list .item .c-info .ranks.r6 {
background: rgb(218, 48, 32);
}
.card .list .item .c-info .level {
flex-grow: 1;
flex-shrink: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
}
.card .list .item .property {

81
resources/card/index.html
View file

@ -25,62 +25,37 @@
<div class="label">式舆防卫战</div>
</div>
</div>
<div class="special-title">
<div class="bg-content">
AGENT
</div>
<div class="parallelograms">
<span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>
</div>
<div class="content">
代理人信息
</div>
<div class="parallelograms">
<span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>
</div>
</div>
<div class="list">
{{each card.avatar_list char i}}
<div class="item rank{{char.rarity}}">
<div class="rank rank-icon {{char.rarity}}"></div>
<div class="property {{char.element_str}}"></div>
<div class="image">
<img src="{{char.square_icon}}" alt="">
<% include(sys.specialTitle, {en: 'AGENT' , cn: '代理人信息' }) %>
<div class="list">
{{each card.avatar_list char i}}
<div class="item rank{{char.rarity}}">
<div class="rank rank-icon {{char.rarity}}"></div>
<div class="property {{char.element_str}}"></div>
<div class="image">
<img src="{{char.square_icon}}" alt="">
</div>
<div class="c-info">
<div class="ranks r{{char.rank}}">{{char.rank}}命</div>
<div class="level">等级{{char.level}}</div>
</div>
</div>
<div class="level">等级{{char.level}}</div>
{{/each}}
</div>
{{/each}}
</div>
<div class="special-title">
<div class="bg-content">
BANGBOO
</div>
<div class="parallelograms">
<span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>
</div>
<div class="content">
邦布信息
</div>
<div class="parallelograms">
<span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>
</div>
</div>
<div class="list">
{{each card.buddy_list bangboo i}}
<div class="item rank{{bangboo.rarity}}">
<div class="rank rank-icon {{bangboo.rarity}}"></div>
<div class="image">
<img src="{{bangboo.square_icon}}" alt="">
<% include(sys.specialTitle, {en: 'BANGBOO' , cn: '邦布信息' }) %>
<div class="list">
{{each card.buddy_list bangboo i}}
<div class="item rank{{bangboo.rarity}}">
<div class="rank rank-icon {{bangboo.rarity}}"></div>
<div class="image">
<img src="{{bangboo.square_icon}}" alt="">
</div>
<div class="c-info">
<div class="ranks r{{bangboo.star}}">{{bangboo.star}}命</div>
<div class="level">等级{{bangboo.level}}</div>
</div>
</div>
{{/each}}
</div>
<div class="level">等级{{bangboo.level}}</div>
</div>
{{/each}}
</div>
</div>
{{/block}}

35
resources/card/index.scss
View file

@ -39,7 +39,7 @@
.item {
width: 100%;
position: relative;
* {
> * {
position: inherit;
z-index: 1;
}
@ -83,14 +83,45 @@
display: block;
}
}
.level {
.c-info {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background: rgb(0, 0, 0);
color: white;
display: flex;
text-align: center;
.ranks {
background: rgb(117, 117, 117);
padding: 0 0.4em;
&.r1 {
background: rgb(58, 116, 43);
}
&.r2 {
background: rgb(61, 132, 214);
}
&.r3 {
background: rgb(223, 118, 118);
}
&.r4 {
background: rgb(51, 54, 161);
}
&.r5 {
background: rgb(102, 127, 19);
}
&.r6 {
background: rgb(218, 48, 32);
}
}
.level {
flex-grow: 1;
flex-shrink: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
}
}
.property {
position: absolute;