Implement sidebar on media page

diff --git a/mediagoblin/static/css/base.css b/mediagoblin/static/css/base.css
index e39770d5a7bd01bbf1cbb4846d86a3c9234c1e6a..994903cf3a0833697c544e1f78a5cad99c840072 100644 (file)
--- a/mediagoblin/static/css/base.css
+++ b/mediagoblin/static/css/base.css
@@ -174,12 +174,16 @@ a.mediagoblin_logo:hover {
 
 /* media pages */
 
-img.media_image {
-  display:block;
-  margin-left:auto;
-  margin-right:auto;
+.media_image{
+  width:640px;
 }
 
+.media_sidebar{
+  width:280px;
+}
+
+/* media galleries */
+
 ul.media_thumbnail {
   padding:0px;
 }

diff --git a/mediagoblin/templates/mediagoblin/media_details.html b/mediagoblin/templates/mediagoblin/media_details.html
index 8cb23e81ade3c146bf6e3125c9f5930424d67cb4..b43bea32a546c13d56080cbf67c5f31ad98ff05e 100644 (file)
--- a/mediagoblin/templates/mediagoblin/media_details.html
+++ b/mediagoblin/templates/mediagoblin/media_details.html
@@ -19,14 +19,18 @@
 {% block mediagoblin_content %}
   {# temporarily, an "image gallery" that isn't one really ;) #}
   {% if media %}
-  
-    <h1>Media details for {{media.title}}</h1>
-    <div>
+
+    <div class="grid_8 alpha media_image">
       <img src="{{ request.app.public_store.file_url(
                     media.media_files.main) }}" />
-  
-      <br/>Uploaded: {{ media.created}}
-      <br/>Description: {{media.description}}
+      <h1>Media details for {{media.title}}</h1>
+      <p>
+        <br/>Uploaded: {{ media.created}}
+        <br/>Description: {{media.description}}
+      </p>
+    </div>
+    <div class="grid_4 omega sidebar">
+      <p>Uploaded: {{ media.created}}</p>
     </div>
   {% else %}
     <p>Sorry, no such media found.<p/>

diff --git a/mediagoblin/templates/mediagoblin/user_pages/media.html b/mediagoblin/templates/mediagoblin/user_pages/media.html
index 97ff8e51c0dd8fef358005ce41e657f7e1ef9970..fdaa0e2dc092d9888087797150d976f411f94e50 100644 (file)
--- a/mediagoblin/templates/mediagoblin/user_pages/media.html
+++ b/mediagoblin/templates/mediagoblin/user_pages/media.html
@@ -20,28 +20,33 @@
 
   {# temporarily, an "image gallery" that isn't one really ;) #}
   {% if media %}
-    <h1>
-      {{media.title}}
-    </h1>
-    <img class="media_image" src="{{ request.app.public_store.file_url(
-                  media.media_files.main) }}" />
-    <p>
-      Uploaded on
-      {{ "%4d-%02d-%02d"|format(media.created.year,
-                                media.created.month, media.created.day) }}
-      by
-      <a href="{{ request.urlgen('mediagoblin.user_pages.user_home',
-                                 user= media.uploader().username) }}">
-        {{- media.uploader().username }}</a>
-    </p>   
-    {% autoescape False %}
-      <p>{{ media.description_html }}</p>
-    {% endautoescape %}
-    {% if media['uploader'] == request.user['_id'] %}
-      <p><a href="{{ request.urlgen('mediagoblin.edit.edit_media',
-                                    user= media.uploader().username,
-                                    media= media._id) }}">Edit</a></p>
-    {% endif %}
+    <div class="grid_8 alpha media_image">
+      <img class="media_image" src="{{ request.app.public_store.file_url(
+                    media.media_files.main) }}" />
+      <h2>
+        {{media.title}}
+      </h2>
+      <p>
+        Uploaded on
+        {{ "%4d-%02d-%02d"|format(media.created.year,
+                                  media.created.month, media.created.day) }}
+        by
+        <a href="{{ request.urlgen('mediagoblin.user_pages.user_home',
+                                   user= media.uploader().username) }}">
+          {{- media.uploader().username }}</a>
+      </p>
+      {% autoescape False %}
+        <p>{{ media.description_html }}</p>
+      {% endautoescape %}
+      {% if media['uploader'] == request.user['_id'] %}
+        <p><a href="{{ request.urlgen('mediagoblin.edit.edit_media',
+                                      user= media.uploader().username,
+                                      media= media._id) }}">Edit</a></p>
+      {% endif %}
+    </div>
+    <div class="grid_4 omega media_sidebar">
+      <p>This is a sidebar! Yay!</p>
+    </div>
   {% else %}
   <p>Sorry, no such media found.<p/>
   {% endif %}