2022-07-26 10:07:31 +00:00
|
|
|
|
<!DOCTYPE html>
|
2022-09-09 14:50:17 +00:00
|
|
|
|
<html lang="zh-CN">
|
|
|
|
|
|
<head>
|
|
|
|
|
|
<meta charset="utf-8" />
|
2022-07-26 10:07:31 +00:00
|
|
|
|
<title>Title</title>
|
2022-09-09 14:50:17 +00:00
|
|
|
|
<script src="../../js/tailwindcss-3.1.8.js"></script>
|
2022-10-12 13:39:47 +00:00
|
|
|
|
<link type="text/css" href="../../styles/public.css" rel="stylesheet" />
|
2022-09-09 14:50:17 +00:00
|
|
|
|
<style>
|
|
|
|
|
|
.text-shadow {
|
|
|
|
|
|
text-shadow: 0 0.08em 0.1em #000, 0 0.1em 0.3em rgba(0, 0, 0, 0.4);
|
|
|
|
|
|
}
|
2022-07-26 10:07:31 +00:00
|
|
|
|
|
2022-09-09 14:50:17 +00:00
|
|
|
|
.star {
|
|
|
|
|
|
background-image: url("./img/star.png");
|
|
|
|
|
|
height: 1rem;
|
|
|
|
|
|
width: 5rem;
|
|
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
|
|
background-size: cover;
|
|
|
|
|
|
}
|
|
|
|
|
|
.star-1 {
|
|
|
|
|
|
background-position-y: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
.star-2 {
|
|
|
|
|
|
background-position-y: -1rem;
|
|
|
|
|
|
}
|
|
|
|
|
|
.star-3 {
|
|
|
|
|
|
background-position-y: -2rem;
|
|
|
|
|
|
}
|
|
|
|
|
|
.star-4 {
|
|
|
|
|
|
background-position-y: -3rem;
|
|
|
|
|
|
}
|
|
|
|
|
|
.star-5 {
|
|
|
|
|
|
background-position-y: -4rem;
|
|
|
|
|
|
}
|
2022-12-11 08:56:54 +00:00
|
|
|
|
@font-face {
|
|
|
|
|
|
font-family: shicon;
|
|
|
|
|
|
src: url(fonts/shicon.woff) format("woff");
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-style: normal;
|
|
|
|
|
|
font-display: block
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.enka-log {
|
|
|
|
|
|
line-height: 0;
|
|
|
|
|
|
margin-right: 0.3rem
|
|
|
|
|
|
}
|
|
|
|
|
|
.enka-log:before {
|
|
|
|
|
|
content: "\e93a";
|
|
|
|
|
|
font-family: shicon;
|
|
|
|
|
|
font-size: 1.25em
|
|
|
|
|
|
}
|
2022-09-09 14:50:17 +00:00
|
|
|
|
</style>
|
|
|
|
|
|
</head>
|
|
|
|
|
|
<body class="text-xl text-neutral-200">
|
|
|
|
|
|
<div
|
|
|
|
|
|
class="data bg-no-repeat bg-cover pb-5 min-w-[845px] overflow-hidden"
|
|
|
|
|
|
style="background-image: url('img/bg-{{ character.element.name | lower }}.jpg')"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div class="relative mb-4 overflow-hidden">
|
|
|
|
|
|
<!-- Character Background -->
|
|
|
|
|
|
<div
|
2022-10-13 08:30:19 +00:00
|
|
|
|
class="absolute w-full h-full -left-1/4 opacity-80 bg-no-repeat bg-center"
|
|
|
|
|
|
style="background-image: url('{{ character.image.banner.url }}'); background-size: auto 100%;"
|
2022-09-09 14:50:17 +00:00
|
|
|
|
></div>
|
|
|
|
|
|
<div class="relative w-full flex p-5 space-x-8">
|
2022-10-12 13:39:47 +00:00
|
|
|
|
{% include 'genshin/player_card/constellations.html' %}
|
2022-07-26 10:07:31 +00:00
|
|
|
|
|
2022-09-09 14:50:17 +00:00
|
|
|
|
<div class="flex-1 space-y-4">
|
|
|
|
|
|
<div class="text-right italic">
|
|
|
|
|
|
<div class="characters-name text-5xl font-bold text-shadow mb-2">
|
|
|
|
|
|
{{ character.name }}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div
|
2023-02-05 16:24:18 +00:00
|
|
|
|
class="flex flex-row justify-end text-2xl text-shadow space-x-6"
|
2022-09-09 14:50:17 +00:00
|
|
|
|
>
|
2023-02-05 16:24:18 +00:00
|
|
|
|
<div>UID {{ uid }}</div>
|
|
|
|
|
|
<div>Lv.{{ character.level }}</div>
|
|
|
|
|
|
<div class="rounded-lg pl-1 pr-3 {% if character.friendship_level >= 10 %} bg-red-600 {% else %} bg-gray-600 {% endif %}">
|
2022-09-09 14:50:17 +00:00
|
|
|
|
❤ {{ character.friendship_level }}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2022-10-12 13:39:47 +00:00
|
|
|
|
{% include 'genshin/player_card/skills.html' %}
|
|
|
|
|
|
{% include 'genshin/player_card/stats.html' %}
|
2022-09-09 14:50:17 +00:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Info -->
|
|
|
|
|
|
<div class="px-5 relative">
|
|
|
|
|
|
<div class="grid grid-cols-3 gap-4">
|
|
|
|
|
|
<div class="flex flex-col space-y-2">
|
2022-10-12 13:39:47 +00:00
|
|
|
|
{% include 'genshin/player_card/weapon.html' %}
|
|
|
|
|
|
{% include 'genshin/player_card/score.html' %}
|
2022-09-09 14:50:17 +00:00
|
|
|
|
</div>
|
|
|
|
|
|
|
2022-10-12 13:39:47 +00:00
|
|
|
|
{% include 'genshin/player_card/artifacts.html' %}
|
2022-09-09 14:50:17 +00:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2022-12-11 08:56:54 +00:00
|
|
|
|
|
|
|
|
|
|
<!-- Logo -->
|
|
|
|
|
|
<div class="mt-4 relative">
|
|
|
|
|
|
<div class="text-gray-300 text-center opacity-70 text-lg">
|
|
|
|
|
|
Data from <span class="enka-log"></span>Enka.Network × Inspired by Miao-Plugin
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2022-09-09 14:50:17 +00:00
|
|
|
|
</div>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html>
|
