Additional style changes to navigation; add three navigation images

diff --git a/mediagoblin/static/css/base.css b/mediagoblin/static/css/base.css
index 0fc33ed7f4c57a0945363e7ec42f409be2f00f47..09f08445bac154e650b77839cc963b14aba89056 100644 (file)
--- a/mediagoblin/static/css/base.css
+++ b/mediagoblin/static/css/base.css
@@ -205,14 +205,14 @@ img.media_icon{
 /* navigation */
 
 .navigation_button{
-  width: 139px;
+  width:139px;
   display:block;
   float:left;
-  text-align: center;
-  background-color: #393939;
-  text-decoration: none;
-  padding: 6px 0pt;
-  font-family: 'Carter One', arial, serif;
+  text-align:center;
+  background-color:#393939;
+  text-decoration:none;
+  padding:12px 0pt;
+  font-family:'Carter One', arial, serif;
   font-size:2em;
   margin:0 0 20px
 }

diff --git a/mediagoblin/static/images/navigation_end.png b/mediagoblin/static/images/navigation_end.png
new file mode 100644 (file)
index 0000000..b2f2729
Binary files /dev/null and b/mediagoblin/static/images/navigation_end.png differ

diff --git a/mediagoblin/static/images/navigation_left.png b/mediagoblin/static/images/navigation_left.png
new file mode 100644 (file)
index 0000000..d164512
Binary files /dev/null and b/mediagoblin/static/images/navigation_left.png differ

diff --git a/mediagoblin/static/images/navigation_right.png b/mediagoblin/static/images/navigation_right.png
new file mode 100644 (file)
index 0000000..d4caa7b
Binary files /dev/null and b/mediagoblin/static/images/navigation_right.png differ

diff --git a/mediagoblin/templates/mediagoblin/utils/prev_next.html b/mediagoblin/templates/mediagoblin/utils/prev_next.html
index 8908c298a74ea2895578fcf629936a1d4ab17728..7cf8d2a46af7fa3a5594a714b4088e40a6e1367d 100644 (file)
--- a/mediagoblin/templates/mediagoblin/utils/prev_next.html
+++ b/mediagoblin/templates/mediagoblin/utils/prev_next.html
@@ -24,20 +24,23 @@
   {# There are no previous entries for the very first media entry #}
   {% if prev_entry_url %}
     <a class="navigation_button navigation_left" href="{{ prev_entry_url }}">
-      &lt;
+      <img src="/mgoblin_static/images/navigation_left.png" alt="Previous image" />
     </a>
   {% else %}
     {# This is the first entry. display greyed-out 'previous' image #}
-    <p class="navigation_button">X</p>
+    <p class="navigation_button navigation_left">
+      <img src="/mgoblin_static/images/navigation_end.png" alt="No previous images" />
+    </p>
   {% endif %}
-
   {# Likewise, this could be the very last media entry #}
   {% if next_entry_url %}
     <a class="navigation_button" href="{{ next_entry_url }}">
-       &gt;
+      <img src="/mgoblin_static/images/navigation_right.png" alt="Next image" />
     </a>
   {% else %}
     {# This is the last entry. display greyed-out 'next' image #}
-    <p class="navigation_button">X</p>
+    <p class="navigation_button">
+      <img src="/mgoblin_static/images/navigation_end.png" alt="No following images" />
+    </p>
   {% endif %}
 </div>