distro-depot-generator/templates/index.html

94 lines
2.2 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="style.css">
<title>distro depot</title>
</head>
<body>
{% for distro in distros %}
<div class="operating-system-card">
<div class="distro-header">
<div><h2>{{ distro.name }}</h2></div>
<div><img class="distro-icon" src="{{ distro.icon_url }}"></div>
</div>
<div class="distro-links">
<a href="{{ distro.wiki }}">wiki</a>
<a href="{{ distro.download}}">download</a>
<a href="{{ distro.website }}">website</a>
</div>
<p class="distro-summary">
{{ distro.summary }}
</p>
<div class="distro-columns">
<span>
<h3>Freedom</h3>
<ul>
{% for item in distro.freedom_positives %}
<li p>{{ item }}</li>
{% endfor %}
<br>
{% for item in distro.freedom_negatives %}
<li n>{{ item }}</li>
{% endfor %}
</ul>
</span>
<span>
<h3>Usability</h3>
<ul>
{% for item in distro.usability_positives %}
<li p>{{ item }}</li>
{% endfor %}
<br>
{% for item in distro.usability_negatives %}
<li n>{{ item }}</li>
{% endfor %}
</ul>
</span>
<span>
<h3>Privacy</h3>
<ul>
{% for item in distro.usability_positives %}
<li p>{{ item }}</li>
{% endfor %}
<br>
{% for item in distro.usability_negatives %}
<li n>{{ item }}</li>
{% endfor %}
</ul>
</span>
</div>
<div class="star-columns">
<span>
{% for i in [1,2,3,4,5,] %}
{% if i < distro.freedom_stars %}
<img class="star" src="assets/icons_star.svg">
{% else %}
<img class="star" src="assets/icons_star-empty.svg">
{% endif %}
{% endfor %}
</span>
<span>
{% for i in [1,2,3,4,5,] %}
{% if i < distro.usability_stars %}
<img class="star" src="assets/icons_star.svg">
{% else %}
<img class="star" src="assets/icons_star-empty.svg">
{% endif %}
{% endfor %}
</span>
<span>
{% for i in [1,2,3,4,5,] %}
{% if i < distro.privacy_stars %}
<img class="star" src="assets/icons_star.svg">
{% else %}
<img class="star" src="assets/icons_star-empty.svg">
{% endif %}
{% endfor %}
</span>
</div>
</div>
{% endfor %}
</body>
</html>