fix: 资源重复
|
|
@ -105,24 +105,15 @@
|
||||||
top: 0.2em;
|
top: 0.2em;
|
||||||
left: 0.1em;
|
left: 0.1em;
|
||||||
width: 1.5em;
|
width: 1.5em;
|
||||||
aspect-ratio: 1;
|
|
||||||
background: url("./images/RANK_A.png") no-repeat center center;
|
|
||||||
background-size: contain;
|
|
||||||
color: white;
|
color: white;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
.card .list .item.rankS::after {
|
.card .list .item.rankS::after {
|
||||||
background: rgb(230, 119, 51);
|
background: rgb(230, 119, 51);
|
||||||
}
|
}
|
||||||
.card .list .item.rankS .rank {
|
|
||||||
background-image: url("./images/RANK_S.png");
|
|
||||||
}
|
|
||||||
.card .list .item.rankB::after {
|
.card .list .item.rankB::after {
|
||||||
background: rgb(93, 183, 249);
|
background: rgb(93, 183, 249);
|
||||||
}
|
}
|
||||||
.card .list .item.rankB .rank {
|
|
||||||
background-image: url("./images/RANK_B.png");
|
|
||||||
}
|
|
||||||
.card .list .item .image {
|
.card .list .item .image {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
aspect-ratio: 0.8;
|
aspect-ratio: 0.8;
|
||||||
|
|
|
||||||
|
|
@ -44,7 +44,7 @@
|
||||||
<div class="list">
|
<div class="list">
|
||||||
{{each card.avatar_list char i}}
|
{{each card.avatar_list char i}}
|
||||||
<div class="item rank{{char.rarity}}">
|
<div class="item rank{{char.rarity}}">
|
||||||
<div class="rank rank{{char.rarity}}"></div>
|
<div class="rank rank-icon {{char.rarity}}"></div>
|
||||||
<div class="property {{char.element_str}}"></div>
|
<div class="property {{char.element_str}}"></div>
|
||||||
<div class="image">
|
<div class="image">
|
||||||
<img src="{{char.square_icon}}" alt="">
|
<img src="{{char.square_icon}}" alt="">
|
||||||
|
|
@ -74,7 +74,7 @@
|
||||||
<div class="list">
|
<div class="list">
|
||||||
{{each card.buddy_list bangboo i}}
|
{{each card.buddy_list bangboo i}}
|
||||||
<div class="item rank{{bangboo.rarity}}">
|
<div class="item rank{{bangboo.rarity}}">
|
||||||
<div class="rank rank{{bangboo.rarity}}"></div>
|
<div class="rank rank-icon {{bangboo.rarity}}"></div>
|
||||||
<div class="image">
|
<div class="image">
|
||||||
<img src="{{bangboo.square_icon}}" alt="">
|
<img src="{{bangboo.square_icon}}" alt="">
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -83,4 +83,4 @@
|
||||||
{{/each}}
|
{{/each}}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{{/block}}
|
{{/block}}
|
||||||
|
|
@ -113,9 +113,6 @@
|
||||||
top: 0.2em;
|
top: 0.2em;
|
||||||
left: 0.1em;
|
left: 0.1em;
|
||||||
width: 1.5em;
|
width: 1.5em;
|
||||||
aspect-ratio: 1;
|
|
||||||
background: url('./images/RANK_A.png') no-repeat center center;
|
|
||||||
background-size: contain;
|
|
||||||
color: white;
|
color: white;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
|
|
@ -123,17 +120,11 @@
|
||||||
&::after {
|
&::after {
|
||||||
background: rgb(230, 119, 51);
|
background: rgb(230, 119, 51);
|
||||||
}
|
}
|
||||||
.rank {
|
|
||||||
background-image: url('./images/RANK_S.png');
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
&.rankB {
|
&.rankB {
|
||||||
&::after {
|
&::after {
|
||||||
background: rgb(93, 183, 249);
|
background: rgb(93, 183, 249);
|
||||||
}
|
}
|
||||||
.rank {
|
|
||||||
background-image: url('./images/RANK_B.png');
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.image {
|
.image {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
|
|
@ -18,4 +18,21 @@
|
||||||
font-family: "Source Han Serif", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
font-family: "Source Han Serif", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.rank-icon {
|
||||||
|
width: 1.5em;
|
||||||
|
aspect-ratio: 1;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
background-size: contain;
|
||||||
|
}
|
||||||
|
.rank-icon.s, .rank-icon.S {
|
||||||
|
background-image: url("../images/RANK_S.png");
|
||||||
|
}
|
||||||
|
.rank-icon.a, .rank-icon.A {
|
||||||
|
background-image: url("../images/RANK_A.png");
|
||||||
|
}
|
||||||
|
.rank-icon.b, .rank-icon.B {
|
||||||
|
background-image: url("../images/RANK_B.png");
|
||||||
|
}
|
||||||
|
|
||||||
/*# sourceMappingURL=index.css.map */
|
/*# sourceMappingURL=index.css.map */
|
||||||
|
|
|
||||||
|
|
@ -39,3 +39,23 @@
|
||||||
'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
|
'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
|
||||||
sans-serif;
|
sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.rank-icon {
|
||||||
|
width: 1.5em;
|
||||||
|
aspect-ratio: 1;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
background-size: contain;
|
||||||
|
&.s,
|
||||||
|
&.S {
|
||||||
|
background-image: url('../images/RANK_S.png');
|
||||||
|
}
|
||||||
|
&.a,
|
||||||
|
&.A {
|
||||||
|
background-image: url('../images/RANK_A.png');
|
||||||
|
}
|
||||||
|
&.b,
|
||||||
|
&.B {
|
||||||
|
background-image: url('../images/RANK_B.png');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 69 KiB |
|
|
@ -176,18 +176,9 @@
|
||||||
top: 0.2em;
|
top: 0.2em;
|
||||||
right: 0.2em;
|
right: 0.2em;
|
||||||
width: 1.5em;
|
width: 1.5em;
|
||||||
aspect-ratio: 1;
|
|
||||||
background: url("./images/RANK_A.png") no-repeat center center;
|
|
||||||
background-size: contain;
|
|
||||||
color: white;
|
color: white;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
.card .list .item.rankS .rank {
|
|
||||||
background-image: url("./images/RANK_S.png");
|
|
||||||
}
|
|
||||||
.card .list .item.rankB .rank {
|
|
||||||
background-image: url("./images/RANK_B.png");
|
|
||||||
}
|
|
||||||
.card .list .item .image {
|
.card .list .item .image {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
aspect-ratio: 1.5;
|
aspect-ratio: 1.5;
|
||||||
|
|
|
||||||
|
|
@ -41,7 +41,7 @@
|
||||||
<div class="list">
|
<div class="list">
|
||||||
{{each item.list inv j}}
|
{{each item.list inv j}}
|
||||||
<div class="item rankS {{inv.isUp && 'up'}}">
|
<div class="item rankS {{inv.isUp && 'up'}}">
|
||||||
<div class="rank rankS"></div>
|
<div class="rank rank-icon s"></div>
|
||||||
<div class="image">
|
<div class="image">
|
||||||
<img src="{{inv.square_icon}}" alt="">
|
<img src="{{inv.square_icon}}" alt="">
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -54,4 +54,4 @@
|
||||||
{{/each}}
|
{{/each}}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
{{/block}}
|
{{/block}}
|
||||||
|
|
@ -127,22 +127,9 @@
|
||||||
top: 0.2em;
|
top: 0.2em;
|
||||||
right: 0.2em;
|
right: 0.2em;
|
||||||
width: 1.5em;
|
width: 1.5em;
|
||||||
aspect-ratio: 1;
|
|
||||||
background: url('./images/RANK_A.png') no-repeat center center;
|
|
||||||
background-size: contain;
|
|
||||||
color: white;
|
color: white;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
&.rankS {
|
|
||||||
.rank {
|
|
||||||
background-image: url('./images/RANK_S.png');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.rankB {
|
|
||||||
.rank {
|
|
||||||
background-image: url('./images/RANK_B.png');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.image {
|
.image {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
aspect-ratio: 1.5;
|
aspect-ratio: 1.5;
|
||||||
|
|
|
||||||