[templates] Fix chart loading

This commit is contained in:
2025-05-18 23:19:05 -04:00
parent 5e672fc9ed
commit 9dc0a818ff
2 changed files with 207 additions and 161 deletions

View File

@ -1,6 +1,9 @@
{% load static %} {% load static %}
<h2>Top Artist</h2>
<ul class="nav nav-tabs" id="artistTab" role="tablist">
<div class="row">
<h2>Top Artist</h2>
<ul class="nav nav-tabs" id="artistTab" role="tablist">
{% for key, name in chart_keys.items %} {% for key, name in chart_keys.items %}
<li class="nav-item" role="presentation"> <li class="nav-item" role="presentation">
<button class="nav-link {% if forloop.counter == 2 %}active{% endif %}" <button class="nav-link {% if forloop.counter == 2 %}active{% endif %}"
@ -8,9 +11,9 @@
type="button" role="tab" aria-controls="home" aria-selected="true">{{name}}</button> type="button" role="tab" aria-controls="home" aria-selected="true">{{name}}</button>
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>
<div class="tab-content" id="artistTabContent" class="maloja-chart"> <div class="tab-content" id="artistTabContent" class="maloja-chart">
{% for key, artists in current_artist_charts.items %} {% for key, artists in current_artist_charts.items %}
<div class="tab-pane fade {% if forloop.counter == 2 %}show active{% endif %}" id="artist-{{key}}" role="tabpanel" aria-labelledby="artist-{{key}}-tab"> <div class="tab-pane fade {% if forloop.counter == 2 %}show active{% endif %}" id="artist-{{key}}" role="tabpanel" aria-labelledby="artist-{{key}}-tab">
<div style="display:block"> <div style="display:block">
@ -167,7 +170,7 @@
</div> </div>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>
</div> </div>
<div class="row"> <div class="row">

View File

@ -2,12 +2,54 @@
{% block title %}{{name}}{% endblock %} {% block title %}{{name}}{% endblock %}
{% block head_extra %}
<style>
.container { margin-bottom:100px; }
h2 { padding-top:20px; }
.image-wrapper {
contain: content;
}
.image-wrapper :hover {
background:rgba(0,0,0,0.3);
}
.caption {
position: fixed;
top: 5px;
left: 5px;
padding: 3px;
font-size: 90%;
color:white;
background:rgba(0,0,0,0.4);
}
.caption-medium {
position: fixed;
top: 5px;
left: 5px;
padding: 3px;
font-size: 75%;
color:white;
background:rgba(0,0,0,0.4);
}
.caption-small {
position: fixed;
top: 5px;
left: 5px;
padding: 3px;
font-size: 60%;
color:white;
background:rgba(0,0,0,0.4);
}
</style>
{% endblock %}
{% block lists %} {% block lists %}
<div "calss="row> {% if chart_type == "maloja" %}
{% include "scrobbles/_top_charts.html" %} {% include "scrobbles/_top_charts.html" %}
</div> {% else %}
<div class="row"> <div class="row">
{% if artist_charts %} {% if artist_charts %}
<div class="col-md"> <div class="col-md">
@ -151,5 +193,6 @@
</div> </div>
{% endif %} {% endif %}
</div> </div>
{% endif %}
{% endblock %} {% endblock %}