Better layout for spirit dispositions

master
Wynd 2025-01-31 15:40:23 +02:00
parent d06a629aff
commit 0c51132528
5 changed files with 46 additions and 37 deletions

View File

@ -1,18 +1,20 @@
<h2>Dispositions</h2>
{% for route in board.get_dispositions() %}
<div class="route">
<div>
<div class="disposition {{+ route.color +}}"></div>
<span>{{ route.name }}</span>
<div class="dispositions">
{% for route in board.get_dispositions() %}
<div class="route">
<div>
<div class="disposition {{+ route.color +}}"></div>
<span>{{ route.name }}</span>
</div>
<ul>
{% for tip in route.tips %}
<li>
<div class="disposition {{+ tip.to_color +}}"></div>
{{+ tip.to +}} ➔ {{+ tip.tip +}}
</li>
{% endfor %}
</ul>
</div>
<ul>
{% for tip in route.tips %}
<li>
<div class="disposition {{+ tip.to_color +}}"></div>
{{+ tip.to +}} ➔ {{+ tip.tip +}}
</li>
{% endfor %}
</ul>
</div>
{% endfor %}
{% endfor %}
</div>

View File

@ -2,6 +2,7 @@
<html lang="en">
<head>
<title>{% block title %}{% endblock %}</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style>
body {
position: relative;

View File

@ -1,6 +1,6 @@
{% extends "layouts/base.html" %}
{% block title %}Commands{% endblock %}
{% block title %}BBS - Command Melding{% endblock %}
{% block head %}
<style>

View File

@ -1,6 +1,6 @@
{% extends "layouts/base.html" %}
{% block title %}Abilities{% endblock %}
{% block title %}DDD - Spirit Boards{% endblock %}
{% block head %}
<style>
@ -36,33 +36,39 @@
}
}
div.route {
.dispositions {
display: flex;
align-items: center;
flex-wrap: wrap;
& div {
div.route {
display: flex;
align-items: center;
}
width: 40%;
& .disposition {
width: 32px;
height: 32px;
margin-right: 5px;
display: inline-block;
vertical-align: middle;
}
& div {
display: flex;
align-items: center;
}
& span {
font-size: 18px;
}
& .disposition {
width: 32px;
height: 32px;
margin-right: 5px;
display: inline-block;
vertical-align: middle;
}
& ul {
list-style: disclosure-closed;
line-height: 2.5;
& span {
font-size: 18px;
}
& li {
display: list-item;
& ul {
list-style: disclosure-closed;
line-height: 2.5;
& li {
display: list-item;
}
}
}
}

View File

@ -1,6 +1,6 @@
{% extends "layouts/base.html" %}
{% block title %}Recipes{% endblock %}
{% block title %}KH3 - Food Simulator{% endblock %}
{% block head %}
<style>