mirror of
https://github.com/PaiGramTeam/PaiGram.git
synced 2024-11-23 00:01:45 +00:00
90 lines
2.6 KiB
Django/Jinja
90 lines
2.6 KiB
Django/Jinja
<!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>
|
||
|
||
{% 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">
|
||
数据来源：DGP 胡桃 API
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html>
|