heckyel/mediagoblin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Revert "Layout overhaul time!"

Browse Source 
This reverts a whole bunch of commits, fb1dc4f5 thru 92e8ca79, where
an experimental new layout was played with.  Unfortunately, this
layout broke the look and feel of master, even though it was going in
the right direction for mobile stuff.  Jef said he'll do things in a
branch!
This commit is contained in:
Christopher Allan Webber 2012-02-13 21:31:11 -06:00
parent 53280164e2
commit 38816c6607
8 changed files with 146 additions and 173 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
mediagoblin/static/css/base.css
View File

@ -109,7 +109,7 @@ input, textarea {
.container { .container {
margin: auto; margin: auto;
width: 96%; width: 96%;
max-width: 820px; max-width: 940px;
} }
header { header {
@ -151,19 +151,16 @@ footer {
} }
.media_pane { .media_pane {
width: 560px; 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: 240px; width: 280px;
margin-left: 10px; margin-left: 10px;
margin-right: 0px;
float: left; float: left;
} }
@ -255,6 +252,15 @@ text-align: center;
float: right; float: right;
} }
textarea#comment_content {
resize: vertical;
width: 634px;
height: 90px;
border: none;
background-color: #f1f1f1;
padding: 3px;
}
.clear { .clear {
clear: both; clear: both;
display: block; display: block;
@ -264,15 +270,6 @@ text-align: center;
height: 0; height: 0;
} }
h3.sidedata {
border: none;
background-color: #212121;
border-radius: 4px 4px 0 0;
padding: 3px 8px;
margin: 20px 0 5px 0;
font-size: 1em;
}
/* forms */ /* forms */
.form_box,.form_box_xl { .form_box,.form_box_xl {
@ -355,18 +352,13 @@ textarea#description, textarea#bio {
} }
textarea#comment_content { textarea#comment_content {
resize: vertical; width: 634px;
width: 100%;
height: 90px; height: 90px;
border: none; border: none;
background-color: #f1f1f1; background-color: #f1f1f1;
padding: 3px; padding: 3px;
} }
#form_comment .form_field_input {
padding-right: 6px;
}
/* media galleries */ /* media galleries */
.media_thumbnail { .media_thumbnail {
@ -377,7 +369,6 @@ textarea#comment_content {
margin: 0px 4px 10px 4px; margin: 0px 4px 10px 4px;
text-align: center; text-align: center;
font-size: 0.875em; font-size: 0.875em;
list-style: none;
} }
.media_thumbnail a { .media_thumbnail a {
@ -389,12 +380,6 @@ textarea#comment_content {
h2.media_title { h2.media_title {
margin-bottom: 0px; margin-bottom: 0px;
display: inline-block;
}
p.context {
display: inline-block;
padding-top: 4px;
} }
p.media_specs { p.media_specs {
@ -421,21 +406,19 @@ img.media_icon {
/* navigation */ /* navigation */
.navigation {
float: right;
}
.navigation_button { .navigation_button {
width: 135px; width: 135px;
display: inline-block; display: 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: 4px 0 8px; padding: 12px 0 16px;
margin: 0 0 6px font-size: 1.4em;
margin: 0 0 20px
} }
.navigation_left { .navigation_left {
@ -520,43 +503,23 @@ table.media_panel th {
} }
/* Media queries and other responsivisivity */ /* Media queries and other responsivisivity */
@media screen and (max-width: 680px) {
@media screen and (max-width: 820px) {
.media_pane { .media_pane {
width: 100%; width: 100%;
margin: 0px; margin: 0px;
} }
.media_sidebar {
width: 100%;
margin: 0px;
}
img.media_image { img.media_image {
width: 100%; width: 100%;
} }
}
@media screen and (max-width: 960px) {
.profile_sidebar { .profile_sidebar {
width: 100%; width: 100%;
margin: 0px; margin: 0px;
} }
.profile_showcase { .profile_showcase {
width: 100%; width: 100%;
margin: 0px; margin: 0px;
} }
.navigation {
float: none;
}
.navigation_button {
width: 49%;
float: right;
}
.navigation_left {
margin-right: 0;
float: left;
}
} }

141
mediagoblin/templates/mediagoblin/user_pages/media.html
View File

@ -40,84 +40,67 @@
{% endblock mediagoblin_head %} {% endblock mediagoblin_head %}
{% block mediagoblin_content %} {% block mediagoblin_content %}
{% trans user_url=request.urlgen( <div class="media_pane">
'mediagoblin.user_pages.user_home', <div class="media_image_container">
user=media.get_uploader.username), {% block mediagoblin_media %}
username=media.get_uploader.username -%} {% set display_media = request.app.public_store.file_url(
<p class="context">❖ Browsing media by <a href="{{ user_url }}">{{ username }}</a></p> media.get_display_media(media.media_files)) %}
{%- endtrans %} {# if there's a medium file size, that means the medium size
{% include "mediagoblin/utils/prev_next.html" %} # isn't the original... so link to the original!
<div class="media_image_container"> #}
{% block mediagoblin_media %} {% if media.media_files.has_key('medium') %}
{% set display_media = request.app.public_store.file_url( <a href="{{ request.app.public_store.file_url(
media.get_display_media(media.media_files)) %} media.media_files['original']) }}">
{# if there's a medium file size, that means the medium size <img class="media_image"
# isn't the original... so link to the original! src="{{ display_media }}"
#} alt="Image for {{ media.title }}" />
{% if media.media_files.has_key('medium') %} </a>
<a href="{{ request.app.public_store.file_url( {% else %}
media.media_files['original']) }}">
<img class="media_image" <img class="media_image"
src="{{ display_media }}" src="{{ display_media }}"
alt="Image for {{ media.title }}" /> alt="Image for {{ media.title }}" />
</a> {% endif %}
{% else %} {% endblock %}
<img class="media_image" </div>
src="{{ display_media }}"
alt="Image for {{ media.title }}" />
{% endif %}
{% endblock %}
</div>
<div class="media_pane">
<h2 class="media_title"> <h2 class="media_title">
{{ media.title }} {{ media.title }}
</h2> </h2>
{% if request.user and
(media.uploader == request.user._id or
request.user.is_admin) %}
{% set edit_url = request.urlgen('mediagoblin.edit.edit_media',
user= media.get_uploader.username,
media= media._id) %}
<a class="button_action" href="{{ edit_url }}">{% trans %}Edit{% endtrans %}</a>
{% set delete_url = request.urlgen('mediagoblin.user_pages.media_confirm_delete',
user= media.get_uploader.username,
media= media._id) %}
<a class="button_action" href="{{ delete_url }}">{% trans %}Delete{% endtrans %}</a>
{% endif %}
{% autoescape False %} {% autoescape False %}
<p>{{ media.description_html }}</p> <p>{{ media.description_html }}</p>
{% endautoescape %} {% endautoescape %}
{% if media.attachment_files|count %} <p class="media_specs">
<h3>Attachments</h3> {% trans date=media.created.strftime("%Y-%m-%d") -%}
<ul> Added on {{ date }}.
{% for attachment in media.attachment_files %} {%- endtrans %}
<li> {% if request.user and
<a href="{{ request.app.public_store.file_url(attachment.filepath) }}"> (media.uploader == request.user._id or
{{ attachment.name }} request.user.is_admin) %}
</a> {% set edit_url = request.urlgen('mediagoblin.edit.edit_media',
</li> user= media.get_uploader.username,
{% endfor %} media= media._id) %}
</ul> <a class="button_action" href="{{ edit_url }}">{% trans %}Edit{% endtrans %}</a>
{% endif %} {% set delete_url = request.urlgen('mediagoblin.user_pages.media_confirm_delete',
{% if app_config['allow_attachments'] user= media.get_uploader.username,
and request.user media= media._id) %}
and (media.uploader == request.user._id <a class="button_action" href="{{ delete_url }}">{% trans %}Delete{% endtrans %}</a>
or request.user.is_admin) %} {% endif %}
<p> </p>
<a href="{{ request.urlgen('mediagoblin.edit.attachments',
user=media.get_uploader.username,
media=media._id) }}">Add attachment</a>
</p>
{% endif %}
{% if comments %} {% if comments %}
<h3> <h3>
{% if comments.count()==1 %}
{% trans comment_count=comments.count() -%}{{ comment_count }} comment{%- endtrans %}
{% elif comments.count()>1 %}
{% trans comment_count=comments.count() -%}{{ comment_count }} comments{%- endtrans %}
{% else %}
{% trans %}No comments yet.{% endtrans %}
{% endif %}
<div class="right_align"> <div class="right_align">
<a <a
{% if not request.user %} {% if not request.user %}
href="{{ request.urlgen('mediagoblin.auth.login') }}" href="{{ request.urlgen('mediagoblin.auth.login') }}"
{% endif %} {% endif %}
class="button_action" id="button_addcomment" title="Add a comment"> class="button_action" id="button_addcomment" title="Add a comment">
{% trans %}Add a comment{% endtrans %} {% trans %}Add one{% endtrans %}
</a> </a>
</div> </div>
</h3> </h3>
@ -167,11 +150,35 @@
{% endif %} {% endif %}
</div> </div>
<div class="media_sidebar"> <div class="media_sidebar">
{% trans date=media.created.strftime("%Y-%m-%d") -%} {% trans user_url=request.urlgen(
<h3 class="sidedata">Added on</h3> 'mediagoblin.user_pages.user_home',
<p>{{ date }}</p> user=media.get_uploader.username),
{%- endtrans %} 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 %}
<h3>Attachments</h3>
<ul>
{% for attachment in media.attachment_files %}
<li>
<a href="{{ request.app.public_store.file_url(attachment.filepath) }}">
{{ attachment.name }}
</a>
</li>
{% endfor %}
</ul>
{% endif %}
{% if app_config['allow_attachments']
and request.user
and (media.uploader == request.user._id
or request.user.is_admin) %}
<p>
<a href="{{ request.urlgen('mediagoblin.edit.attachments',
user=media.get_uploader.username,
media=media._id) }}">Add attachment</a>
</p>
{% endif %}
{% if media.tags %} {% if media.tags %}
{% include "mediagoblin/utils/tags.html" %} {% include "mediagoblin/utils/tags.html" %}
{% endif %} {% endif %}

2
mediagoblin/templates/mediagoblin/utils/exif.html
View File

@ -20,7 +20,7 @@
{% if media.media_data.has_key('exif') {% if media.media_data.has_key('exif')
and app_config['exif_visible'] and app_config['exif_visible']
and media.media_data.exif.has_key('useful') %} and media.media_data.exif.has_key('useful') %}
<h3 class="sidedata">EXIF</h3> <h4>EXIF</h4>
<table> <table>
{% for key, tag in media.media_data.exif.useful.items() %} {% for key, tag in media.media_data.exif.useful.items() %}
<tr> <tr>

2
mediagoblin/templates/mediagoblin/utils/geolocation_map.html
View File

@ -20,7 +20,7 @@
{% if media.media_data.has_key('gps') {% if media.media_data.has_key('gps')
and app_config['geolocation_map_visible'] and app_config['geolocation_map_visible']
and media.media_data.gps %} and media.media_data.gps %}
<h3 class="sidedata">Location</h3> <h4>Map</h4>
<div> <div>
{% set gps = media.media_data.gps %} {% set gps = media.media_data.gps %}
<div id="tile-map" style="width: 100%; height: 196px;"> <div id="tile-map" style="width: 100%; height: 196px;">

2
mediagoblin/templates/mediagoblin/utils/license.html
View File

@ -17,8 +17,8 @@
#} #}
{% block license_content -%} {% block license_content -%}
<h3 class="sidedata">{% trans %}License{% endtrans %}</h3>
<p> <p>
{% trans %}License:{% endtrans %}
{% if media.license %} {% if media.license %}
<a href="{{ media.license }}">{{ media.get_license_data().abbreviation }}</a> <a href="{{ media.license }}">{{ media.get_license_data().abbreviation }}</a>
{% else %} {% else %}

36
mediagoblin/templates/mediagoblin/utils/object_gallery.html
View File

@ -19,23 +19,29 @@
{% from "mediagoblin/utils/pagination.html" import render_pagination %} {% from "mediagoblin/utils/pagination.html" import render_pagination %}
{% macro media_grid(request, media_entries, col_number=5) %} {% macro media_grid(request, media_entries, col_number=5) %}
<ul class="thumb_gallery"> <table class="thumb_gallery">
{% for row in gridify_cursor(media_entries, col_number) %} {% for row in gridify_cursor(media_entries, col_number) %}
{% for entry in row %} <tr class="thumb_row
{% set entry_url = entry.url_for_self(request.urlgen) %} {%- if loop.first %} thumb_row_first
<li class="media_thumbnail"> {%- elif loop.last %} thumb_row_last{% endif %}">
<a href="{{ entry_url }}"> {% for entry in row %}
<img src="{{ request.app.public_store.file_url( {% set entry_url = entry.url_for_self(request.urlgen) %}
entry.media_files['thumb']) }}" /> <td class="media_thumbnail thumb_entry
</a> {%- if loop.first %} thumb_entry_first
{% if entry.title %} {%- elif loop.last %} thumb_entry_last{% endif %}">
<br /> <a href="{{ entry_url }}">
<a href="{{ entry_url }}">{{ entry.title }}</a> <img src="{{ request.app.public_store.file_url(
{% endif %} entry.media_files['thumb']) }}" />
</li> </a>
{% endfor %} {% if entry.title %}
<br />
<a href="{{ entry_url }}">{{ entry.title }}</a>
{% endif %}
</td>
{% endfor %}
</tr>
{% endfor %} {% endfor %}
</ul> </table>
{%- endmacro %} {%- endmacro %}
{# {#

46
mediagoblin/templates/mediagoblin/utils/prev_next.html
View File

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

9
mediagoblin/templates/mediagoblin/utils/tags.html
View File

@ -17,17 +17,16 @@
#} #}
{% block tags_content -%} {% block tags_content -%}
<h3 class="sidedata">Tagged with</h3> <p>{% trans %}View more media tagged with{% endtrans %}
<p>
{% for tag in media.tags %} {% for tag in media.tags %}
{% if loop.last %} {% if loop.last %}
{# the 'and' should only appear if there is more than one tag #} {# the 'and' should only appear if there is more than one tag #}
{% if media.tags|length > 1 %} {% if media.tags|length > 1 %}
&middot; {% trans %}or{% endtrans %}
{% endif %} {% endif %}
<a href="{{ request.urlgen( <a href="{{ request.urlgen(
'mediagoblin.listings.tags_listing', 'mediagoblin.listings.tags_listing',
tag=tag['slug']) }}">{{ tag['name'] }}</a> tag=tag['slug']) }}">{{ tag['name'] }}</a>.
{% elif loop.revindex == 2 %} {% elif loop.revindex == 2 %}
<a href="{{ request.urlgen( <a href="{{ request.urlgen(
'mediagoblin.listings.tags_listing', 'mediagoblin.listings.tags_listing',
@ -35,7 +34,7 @@
{% else %} {% else %}
<a href="{{ request.urlgen( <a href="{{ request.urlgen(
'mediagoblin.listings.tags_listing', 'mediagoblin.listings.tags_listing',
tag=tag['slug']) }}">{{ tag['name'] }}</a> &middot; tag=tag['slug']) }}">{{ tag['name'] }}</a>,
{% endif %} {% endif %}
{% endfor %} {% endfor %}
</p> </p>