Status string

api/templates/preview.html

@@ -5,16 +5,25 @@
         }
 
         .main {
+            margin-top: 40px;
             display: flex;
             width: 480px;
             height: 133px;
         }
 
+        .currentStatus {
+            position: static;
+            float: left;
+            font-size: 24px;
+            margin-top: -5px;
+            margin-left: 10px;
+        }
+
         .container {
             border-radius: 5px;
             padding: 10px 10px 10px 0px;
         }
-        
+
         .art {
             float: left;
             width: 27%;
@@ -78,6 +87,8 @@
         }
     </style>
 
+    <div class="currentStatus">Currently playing</div>
+
     <div class="main">
         <a class="art" href="{}" target="_BLANK">
             <center>

api/templates/spotify.html.j2

@@ -7,9 +7,18 @@
                 }
 
                 .main {
+                    margin-top: 40px;
                     display: flex;
                 }
 
+                .currentStatus {
+                    position: static;
+                    float: left;
+                    font-size: 24px;
+                    margin-top: -5px;
+                    margin-left: 10px;
+                }
+                
                 .container {
                     border-radius: 5px;
                     padding: 10px 10px 10px 0px;
@@ -82,6 +91,8 @@
             </style>
             
             <div class="main">
+                <div class="currentStatus">{{status}}</div>
+
                 <a class="art" href="{}" target="_BLANK">
                     <center>
                         <img src="data:image/png;base64, {{image}}" class="cover" />