PamGram/resources/starrail/museum/museum.html
2023-06-11 16:42:25 +08:00

111 lines
4.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="../../styles/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="main-container">
<div style="height: 10px"></div>
<div class="text-center">
<span style="font-size: 30px">冬城博物珍奇簿</span>
<span class="badge rounded-pill bg-info">UID: {{ uid }}</span>
</div>
<div style="height: 10px"></div>
<div class="border common-width">
<div style="height: 10px"></div>
<div style="width: 88.88%; margin-left: 5%">
<div class="row">
<div class="col text-center">
<p>{{ basic.phase }}</p>
<div class="progress">
<div class="progress-bar" style="width:{{ basic.progress_exp * 100 }}%">
{{ basic.current_exp }}/{{ basic.max_exp }}
</div>
</div>
</div>
<div class="col text-center">
<p>展品收集</p>
<div class="progress">
<div class="progress-bar" style="width:{{ basic.progress_exhibition * 100 }}%">
{{ basic.exhibition_num }}/{{ basic.total_exhibition }}
</div>
</div>
</div>
<div class="col text-center">
<p>特邀助理</p>
<div class="progress">
<div class="progress-bar" style="width:{{ basic.progress_director * 100 }}%">
{{ basic.director_num }}/{{ basic.total_director }}
</div>
</div>
</div>
</div>
</div>
<div style="height: 10px"></div>
</div>
<div>
<div class="mt-3 common-width">
<div class="card">
<div class="card-body text-center">展品</div>
</div>
<div class="mt-3 card">
<div class="card-body">
{% for exhibitions in all_exhibitions %}
<div class="row">
{% for exhibition in exhibitions %}
<div class="col text-center">
<div class="justify-content-center">
{% if exhibition.is_unlock %}
<img class="exhibition" src="{{ exhibition.icon }}" alt="">
<p>{{ exhibition.name }}</p>
{% else %}
<div class="exhibition-lock">
<p style="font-size: 40px;">?</p>
</div>
<p>未获得</p>
{% endif %}
</div>
</div>
{% endfor %}
</div>
{% endfor %}
</div>
</div>
</div>
</div>
<div>
<div class="mt-3 common-width">
<div class="card">
<div class="card-body text-center">特邀助理</div>
</div>
<div class="mt-3 card">
<div class="card-body">
<div class="row">
{% for director in directors %}
<div class="col text-center">
<div class="justify-content-center">
{% if director.is_unlock %}
<img class="director" src="{{ director.icon }}" alt="">
<p>{{ director.name }}</p>
{% else %}
<div class="director-lock">
<p style="font-size: 40px;">?</p>
</div>
<p>未获得</p>
{% endif %}
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</div>
<div style="height: 20px"></div>
</div>
</div>
</body>
</html>