Layout overhaul time!

This commit is contained in:
Jef van Schendel 2012-02-11 23:04:02 +01:00
parent eea6d276bc
commit fb1dc4f56b
3 changed files with 50 additions and 37 deletions

View File

@ -109,7 +109,7 @@ input, textarea {
.container { .container {
margin: auto; margin: auto;
width: 96%; width: 96%;
max-width: 940px; max-width: 820px;
} }
header { header {
@ -150,12 +150,18 @@ footer {
clear: both; clear: both;
} }
/* TEMP removal -> permanent removal should also be done in html!
.media_pane { .media_pane {
width: 640px; width: 640px;
margin-left: 0px; margin-left: 0px;
margin-right: 10px; margin-right: 10px;
float: left; float: left;
} }
*/
img.media_image {
width: 100%;
}
.media_sidebar { .media_sidebar {
width: 280px; width: 280px;
@ -382,6 +388,11 @@ h2.media_title {
margin-bottom: 0px; margin-bottom: 0px;
} }
p.context {
display: inline-block;
padding-top: 4px;
}
p.media_specs { p.media_specs {
font-size: 0.9em; font-size: 0.9em;
border-top: 1px solid #222; border-top: 1px solid #222;
@ -406,19 +417,21 @@ img.media_icon {
/* navigation */ /* navigation */
.navigation {
float: right;
}
.navigation_button { .navigation_button {
width: 135px; width: 135px;
display: block; display: inline-block;
float: left;
text-align: center; text-align: center;
background-color: #1d1d1d; background-color: #1d1d1d;
border: 1px solid; border: 1px solid;
border-color: #2c2c2c #232323 #1a1a1a; border-color: #2c2c2c #232323 #1a1a1a;
border-radius: 4px; border-radius: 4px;
text-decoration: none; text-decoration: none;
padding: 12px 0 16px; padding: 4px 0 8px;
font-size: 1.4em; margin: 0 0 6px
margin: 0 0 20px
} }
.navigation_left { .navigation_left {

View File

@ -41,6 +41,13 @@
{% block mediagoblin_content %} {% block mediagoblin_content %}
<div class="media_pane"> <div class="media_pane">
{% trans user_url=request.urlgen(
'mediagoblin.user_pages.user_home',
user=media.get_uploader.username),
username=media.get_uploader.username -%}
<p class="context">❖ Browsing media by <a href="{{ user_url }}">{{ username }}</a></p>
{%- endtrans %}
{% include "mediagoblin/utils/prev_next.html" %}
<div class="media_image_container"> <div class="media_image_container">
{% block mediagoblin_media %} {% block mediagoblin_media %}
{% set display_media = request.app.public_store.file_url( {% set display_media = request.app.public_store.file_url(
@ -148,15 +155,6 @@
{{ render_pagination(request, pagination, {{ render_pagination(request, pagination,
media.url_for_self(request.urlgen)) }} media.url_for_self(request.urlgen)) }}
{% endif %} {% endif %}
</div>
<div class="media_sidebar">
{% trans user_url=request.urlgen(
'mediagoblin.user_pages.user_home',
user=media.get_uploader.username),
username=media.get_uploader.username -%}
<p>❖ Browsing media by <a href="{{ user_url }}">{{ username }}</a></p>
{%- endtrans %}
{% include "mediagoblin/utils/prev_next.html" %}
{% if media.attachment_files|count %} {% if media.attachment_files|count %}
<h3>Attachments</h3> <h3>Attachments</h3>
<ul> <ul>

View File

@ -21,26 +21,28 @@
{% set next_entry_url = media.url_to_next(request.urlgen) %} {% set next_entry_url = media.url_to_next(request.urlgen) %}
{% if prev_entry_url or next_entry_url %} {% if prev_entry_url or next_entry_url %}
{# There are no previous entries for the very first media entry #} <div class="navigation">
{% if prev_entry_url %} {# There are no previous entries for the very first media entry #}
<a class="navigation_button navigation_left" href="{{ prev_entry_url }}"> {% if prev_entry_url %}
&larr; {% trans %}newer{% endtrans %} <a class="navigation_button navigation_left" href="{{ prev_entry_url }}">
</a> &larr; {% trans %}newer{% endtrans %}
{% else %} </a>
{# This is the first entry. display greyed-out 'previous' image #} {% else %}
<p class="navigation_button navigation_left"> {# This is the first entry. display greyed-out 'previous' image #}
&larr; {% trans %}newer{% endtrans %} <p class="navigation_button navigation_left">
</p> &larr; {% trans %}newer{% endtrans %}
{% endif %} </p>
{# Likewise, this could be the very last media entry #} {% endif %}
{% if next_entry_url %} {# Likewise, this could be the very last media entry #}
<a class="navigation_button" href="{{ next_entry_url }}"> {% if next_entry_url %}
{% trans %}older{% endtrans %} &rarr; <a class="navigation_button" href="{{ next_entry_url }}">
</a> {% trans %}older{% endtrans %} &rarr;
{% else %} </a>
{# This is the last entry. display greyed-out 'next' image #} {% else %}
<p class="navigation_button"> {# This is the last entry. display greyed-out 'next' image #}
{% trans %}older{% endtrans %} &rarr; <p class="navigation_button">
</p> {% trans %}older{% endtrans %} &rarr;
{% endif %} </p>
{% endif %}
</div>
{% endif %} {% endif %}