Add clipper to strolchguru and adjustet position

strolchguru/templates/strolchguru_home.html

@@ -9,8 +9,10 @@
 <video id="clip" autoplay width="100%" height="100%"
        style="position: absolute; z-index: 8; top: 0px; left: 0px; width: 100%;" onended="play_random_clip()">
 </video>
-<h1 id="clip_title"
-    style="color:white; text-shadow: 2px 0 0 #000, -2px 0 0 #000, 0 2px 0 #000, 0 -2px 0 #000, 1px 1px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000; z-index: 10; position: absolute; bottom: 10px; left:10px; font-family: 'Comic Sans MS'"></h1>
+<div style="color:white; text-shadow: 2px 0 0 #000, -2px 0 0 #000, 0 2px 0 #000, 0 -2px 0 #000, 1px 1px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000; z-index: 10; position: absolute; bottom: 10px; left:10px; font-family: 'Comic Sans MS'">
+    <h1 id="clip_title" style="margin-bottom: 0; "></h1>
+    <p id="clipper" style="margin: 0; font-size: x-large"></p>
+</div>
 <script>
     clips = [
         {% for clip in clips %}
@@ -22,6 +24,7 @@
         const clip = clips[Math.floor(Math.random() * clips.length)];
         document.querySelector("#clip").setAttribute("src", clip["clip_url"]);
         document.querySelector("#clip_title").innerHTML = clip["title"];
+        document.querySelector("#clipper").innerHTML = "von " + clip["creator_name"];
     }
 
     play_random_clip()