[templates] Fix chart loading

vrobbler/templates/scrobbles/_top_charts.html

@@ -1,6 +1,9 @@
 {% 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 %}
         <li class="nav-item" role="presentation">
             <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>
         </li>
         {% 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 %}
         <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">
@@ -167,7 +170,7 @@
             </div>
         </div>
         {% endfor %}
-</div>
+    </div>
 </div>
 
 <div class="row">

vrobbler/templates/scrobbles/chart_index.html

@@ -2,12 +2,54 @@
 
 {% 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 %}
 
-<div "calss="row>
-    {% include "scrobbles/_top_charts.html" %}
-</div>
-
+{% if chart_type == "maloja" %}
+{% include "scrobbles/_top_charts.html" %}
+{% else %}
 <div class="row">
     {% if artist_charts %}
     <div class="col-md">
@@ -151,5 +193,6 @@
     </div>
     {% endif %}
 </div>
+{% endif %}
 
 {% endblock %}