moved styles to a css file; more fixes to templates

mediagoblin/static/css/base.css

@@ -754,6 +754,42 @@ table.media_panel th {
   padding-bottom: 4px;
   text-align: left;
 }
+.thumb-overlay-status {
+  position: absolute;
+  margin: auto;
+  top: 0; bottom: 0; left: 0; right: 0;
+  width: 180px;
+  height: 20px;
+  display: inline;
+  text-align: center;
+  background-color: rgba(255, 255, 255, 0.8);
+}
+
+.thumb-processing {
+  color: black;
+  font-weight: bold;
+}
+
+.thumb-failed {
+  color: red;
+  font-weight: bold;
+}
+
+.thumb-wrapper {
+  position: relative;
+/* for proportional thumb resizing */
+  width: auto;
+  height: auto;
+  display: inline-block;
+}
+
+.thumb-wrapper img {
+  max-height: 180px;
+  max-width: 180px;
+}
+.media_panel td {
+  vertical-align: middle;
+}
 
 /* moderator panels */
 

mediagoblin/templates/mediagoblin/moderation/media_panel.html

@@ -43,8 +43,18 @@
     </tr>
     {% for media_entry in processing_entries %}
       <tr>
+        <td>
+          <div class="thumb-wrapper">
+            <img src="{{ media_entry.thumb_url }}" alt="{{ media_entry.title }}" />
+            <div class="thumb-overlay-status thumb-processing">Processing...</div>
+          </div>
+        </td>
         <td>{{ media_entry.id }}</td>
-        <td>{{ media_entry.get_actor.username }}</td>
+        <td>
+            <a href="{{ request.urlgen('mediagoblin.moderation.users_detail', user=media_entry.get_actor.username) }}">
+                {{ media_entry.get_actor.username }}
+            </a>
+        </td>
         <td>{{ media_entry.title }}</td>
         <td>{{ media_entry.created.strftime("%F %R") }}</td>
         {% if media_entry.transcoding_progress %}

mediagoblin/templates/mediagoblin/user_pages/processing_panel.html

@@ -29,50 +29,10 @@
   {% trans %}You can track the state of media being processed for your gallery here.{% endtrans %}
 </p>
     
-<style>
-    .thumb-overlay-status {
-        position: absolute;
-        margin: auto;
-        top: 0; bottom: 0; left: 0; right: 0;
-        width: 180px;
-        height: 20px;
-        display: inline;
-        text-align: center;
-    }
-
-    .thumb-processing {
-        color: black;
-        font-weight: bold;
-        background-color: rgba(255, 255, 255, 0.8);
-    }
-
-    .thumb-failed {
-        color: red;
-        font-weight: bold;
-        background-color: rgba(127, 0, 0, 0.5);
-    }
-
-    .thumb-wrapper {
-        position: relative;
-        /* for proportional thumb resizing */
-        width: auto;
-        height: auto;
-        display: inline-block;
-    }
-
-    .thumb-wrapper img {
-        max-height: 180px;
-        max-width: 180px;
-    }
-    .media_panel td {
-        vertical-align: middle;
-    }
-</style>
-
 {% if entries.count() %}
   <table class="media_panel processing">
     <tr>
-      <th>ID</th>
+      <th>Thumbnail</th>
       <th>Title</th>
       <th>When submitted</th>
       <th>Transcoding progress</th>