Kaynağa Gözat

Adding bootstrap table and navbar to steam api page

David Leonard 10 yıl önce
ebeveyn
işleme
0d441fe6e7

+ 26 - 7
hackathon_starter/hackathon/templates/hackathon/steam.html

@@ -1,12 +1,31 @@
 <!DOCTYPE html>
 <html>
 <body>
-<table>
-  <tr><th>Game ID</th><th>Game Name</th><th>Minutes Played</th></tr>
-  {% for game in game %}
-    {% comment %}  each game object is a dictionary with "appid", "name " and "playtime_forever" keys {% endcomment %}
-    <tr><td>{{ game.appid }}</td><td>{{game.name}} </td><td>{{ game.playtime_forever }}</td></tr>
-{% endfor %}
-</table>
+	{% include 'hackathon/base.html' %}
+
+	<h1 class="text-center"> Steam API </h1>
+		<div class="col-lg-12">
+	        <div class="table-responsive">
+	            <table class="table table-bordered table-hover table-striped tablesorter">
+	                <thead>
+	                <tr>
+	                <th class="header"> Game ID <i class="icon-sort"></i></th>
+	                <th class="header"> Game Name <i class="icon-sort"></i></th>
+	                <th class="header"> Minutes Played <i class="icon-sort"></i></th>
+	            </thead>
+	            <tbody>
+
+	            {% for game in game %}
+	                <tr>
+	                    <td>{{ game.appid }}</td>
+	                    <td>{{ game.name }}</td>
+	                    <td>{{ game.playtime_forever }}</td>
+	    			</tr>
+	            {% endfor %}
+
+	            </tbody>
+	            </table>
+	        </div>
+	    </div>
 </body>
 </html>