mirror of
https://github.com/PaiGramTeam/PaiGram.git
synced 2024-11-16 12:51:35 +00:00
xtaodada
c44b785118
Co-authored-by: Li Chuangbo <im@chuangbo.li> Co-authored-by: SiHuaN <sihuan@sakuya.love>
91 lines
2.6 KiB
HTML
91 lines
2.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-ch">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<title>abyss</title>
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
|
|
/>
|
|
<script src="../../js/tailwindcss-3.1.8.js"></script>
|
|
<link type="text/css" href="../../styles/public.css" rel="stylesheet" />
|
|
<style>
|
|
#container {
|
|
max-width: 865px;
|
|
background-image: url("./../abyss/background/abyss-bg-grad.png");
|
|
background-color: rgb(11, 23, 44);
|
|
}
|
|
|
|
.item-not-owned {
|
|
position: relative;
|
|
}
|
|
|
|
.item-not-owned::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background-color: rgb(0 0 0 / 50%);
|
|
border-radius: 5px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div
|
|
class="mx-auto flex flex-col h-full bg-contain bg-no-repeat py-6"
|
|
id="container"
|
|
>
|
|
<div class="title text-2xl my-4 text-yellow-500 text-center">
|
|
深境螺旋 - 推荐配队
|
|
</div>
|
|
|
|
<div
|
|
class="flex flex-row px-6 py-1 my-1 text-neutral-100 bg-white bg-opacity-10 justify-evenly text-sm"
|
|
>
|
|
<div>UID {{ uid }}</div>
|
|
<div>版本 {{ version }}</div>
|
|
</div>
|
|
|
|
{% for team in teams %}
|
|
<div class="mx-auto flex flex-col px-6 py-1 text-black my-1">
|
|
<div class="text-center mr-auto text-yellow-500">
|
|
推荐配队 {{ loop.index }}
|
|
</div>
|
|
{% for lane in ["up", "down"] %}
|
|
<div class="flex my-2 space-x-4">
|
|
{% for i in team[lane] %}
|
|
<div
|
|
class="bg-neutral-200 flex-shrink-0 rounded-lg overflow-hidden {% if not i.hava %}item-not-owned{% endif %}"
|
|
>
|
|
<div
|
|
class="w-32 h-32 rounded-br-2xl bg-cover overflow-hidden"
|
|
style="background-image: url('./../abyss/background/roleStarBg{{ i.star }}.png');"
|
|
>
|
|
<img src="{{ i.icon }}" alt="" />
|
|
</div>
|
|
<div class="text-center">{{ i.name }}</div>
|
|
</div>
|
|
{% endfor %}
|
|
|
|
<div>
|
|
<div class="text-neutral-300">
|
|
{{ lane == 'up' and '上' or '下' }}半
|
|
</div>
|
|
<div class="text-neutral-400 text-sm">
|
|
使用率 {{ team[lane + "_rate"] }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endfor %}
|
|
|
|
<div class="mt-6 text-center p-1 text-neutral-400 text-xs">
|
|
数据来源：游创工坊
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|