Revert "Layout overhaul time!"
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:
parent
53280164e2
commit
38816c6607
@ -109,7 +109,7 @@ input, textarea {
|
||||
.container {
|
||||
margin: auto;
|
||||
width: 96%;
|
||||
max-width: 820px;
|
||||
max-width: 940px;
|
||||
}
|
||||
|
||||
header {
|
||||
@ -151,19 +151,16 @@ footer {
|
||||
}
|
||||
|
||||
.media_pane {
|
||||
width: 560px;
|
||||
width: 640px;
|
||||
margin-left: 0px;
|
||||
margin-right: 10px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
img.media_image {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.media_sidebar {
|
||||
width: 240px;
|
||||
width: 280px;
|
||||
margin-left: 10px;
|
||||
margin-right: 0px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
@ -255,6 +252,15 @@ text-align: center;
|
||||
float: right;
|
||||
}
|
||||
|
||||
textarea#comment_content {
|
||||
resize: vertical;
|
||||
width: 634px;
|
||||
height: 90px;
|
||||
border: none;
|
||||
background-color: #f1f1f1;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
display: block;
|
||||
@ -264,15 +270,6 @@ text-align: center;
|
||||
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 */
|
||||
|
||||
.form_box,.form_box_xl {
|
||||
@ -355,18 +352,13 @@ textarea#description, textarea#bio {
|
||||
}
|
||||
|
||||
textarea#comment_content {
|
||||
resize: vertical;
|
||||
width: 100%;
|
||||
width: 634px;
|
||||
height: 90px;
|
||||
border: none;
|
||||
background-color: #f1f1f1;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
#form_comment .form_field_input {
|
||||
padding-right: 6px;
|
||||
}
|
||||
|
||||
/* media galleries */
|
||||
|
||||
.media_thumbnail {
|
||||
@ -377,7 +369,6 @@ textarea#comment_content {
|
||||
margin: 0px 4px 10px 4px;
|
||||
text-align: center;
|
||||
font-size: 0.875em;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.media_thumbnail a {
|
||||
@ -389,12 +380,6 @@ textarea#comment_content {
|
||||
|
||||
h2.media_title {
|
||||
margin-bottom: 0px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
p.context {
|
||||
display: inline-block;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
p.media_specs {
|
||||
@ -421,21 +406,19 @@ img.media_icon {
|
||||
|
||||
/* navigation */
|
||||
|
||||
.navigation {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.navigation_button {
|
||||
width: 135px;
|
||||
display: inline-block;
|
||||
display: block;
|
||||
float: left;
|
||||
text-align: center;
|
||||
background-color: #1d1d1d;
|
||||
border: 1px solid;
|
||||
border-color: #2c2c2c #232323 #1a1a1a;
|
||||
border-radius: 4px;
|
||||
text-decoration: none;
|
||||
padding: 4px 0 8px;
|
||||
margin: 0 0 6px
|
||||
padding: 12px 0 16px;
|
||||
font-size: 1.4em;
|
||||
margin: 0 0 20px
|
||||
}
|
||||
|
||||
.navigation_left {
|
||||
@ -520,43 +503,23 @@ table.media_panel th {
|
||||
}
|
||||
|
||||
/* Media queries and other responsivisivity */
|
||||
|
||||
@media screen and (max-width: 820px) {
|
||||
@media screen and (max-width: 680px) {
|
||||
.media_pane {
|
||||
width: 100%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.media_sidebar {
|
||||
width: 100%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
img.media_image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 960px) {
|
||||
.profile_sidebar {
|
||||
width: 100%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.profile_showcase {
|
||||
width: 100%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.navigation {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.navigation_button {
|
||||
width: 49%;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.navigation_left {
|
||||
margin-right: 0;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
@ -40,84 +40,67 @@
|
||||
{% endblock mediagoblin_head %}
|
||||
|
||||
{% block mediagoblin_content %}
|
||||
{% 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">
|
||||
{% block mediagoblin_media %}
|
||||
{% set display_media = request.app.public_store.file_url(
|
||||
media.get_display_media(media.media_files)) %}
|
||||
{# if there's a medium file size, that means the medium size
|
||||
# isn't the original... so link to the original!
|
||||
#}
|
||||
{% if media.media_files.has_key('medium') %}
|
||||
<a href="{{ request.app.public_store.file_url(
|
||||
media.media_files['original']) }}">
|
||||
<div class="media_pane">
|
||||
<div class="media_image_container">
|
||||
{% block mediagoblin_media %}
|
||||
{% set display_media = request.app.public_store.file_url(
|
||||
media.get_display_media(media.media_files)) %}
|
||||
{# if there's a medium file size, that means the medium size
|
||||
# isn't the original... so link to the original!
|
||||
#}
|
||||
{% if media.media_files.has_key('medium') %}
|
||||
<a href="{{ request.app.public_store.file_url(
|
||||
media.media_files['original']) }}">
|
||||
<img class="media_image"
|
||||
src="{{ display_media }}"
|
||||
alt="Image for {{ media.title }}" />
|
||||
</a>
|
||||
{% else %}
|
||||
<img class="media_image"
|
||||
src="{{ display_media }}"
|
||||
alt="Image for {{ media.title }}" />
|
||||
</a>
|
||||
{% else %}
|
||||
<img class="media_image"
|
||||
src="{{ display_media }}"
|
||||
alt="Image for {{ media.title }}" />
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
<div class="media_pane">
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
<h2 class="media_title">
|
||||
{{ media.title }}
|
||||
</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 %}
|
||||
<p>{{ media.description_html }}</p>
|
||||
{% endautoescape %}
|
||||
{% 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 %}
|
||||
{% endautoescape %}
|
||||
<p class="media_specs">
|
||||
{% trans date=media.created.strftime("%Y-%m-%d") -%}
|
||||
Added on {{ date }}.
|
||||
{%- endtrans %}
|
||||
{% 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 %}
|
||||
</p>
|
||||
{% if comments %}
|
||||
<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">
|
||||
<a
|
||||
{% if not request.user %}
|
||||
href="{{ request.urlgen('mediagoblin.auth.login') }}"
|
||||
{% endif %}
|
||||
class="button_action" id="button_addcomment" title="Add a comment">
|
||||
{% trans %}Add a comment{% endtrans %}
|
||||
{% trans %}Add one{% endtrans %}
|
||||
</a>
|
||||
</div>
|
||||
</h3>
|
||||
@ -167,11 +150,35 @@
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="media_sidebar">
|
||||
{% trans date=media.created.strftime("%Y-%m-%d") -%}
|
||||
<h3 class="sidedata">Added on</h3>
|
||||
<p>{{ date }}</p>
|
||||
{%- endtrans %}
|
||||
|
||||
{% 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 %}
|
||||
<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 %}
|
||||
{% include "mediagoblin/utils/tags.html" %}
|
||||
{% endif %}
|
||||
|
@ -20,7 +20,7 @@
|
||||
{% if media.media_data.has_key('exif')
|
||||
and app_config['exif_visible']
|
||||
and media.media_data.exif.has_key('useful') %}
|
||||
<h3 class="sidedata">EXIF</h3>
|
||||
<h4>EXIF</h4>
|
||||
<table>
|
||||
{% for key, tag in media.media_data.exif.useful.items() %}
|
||||
<tr>
|
||||
|
@ -20,7 +20,7 @@
|
||||
{% if media.media_data.has_key('gps')
|
||||
and app_config['geolocation_map_visible']
|
||||
and media.media_data.gps %}
|
||||
<h3 class="sidedata">Location</h3>
|
||||
<h4>Map</h4>
|
||||
<div>
|
||||
{% set gps = media.media_data.gps %}
|
||||
<div id="tile-map" style="width: 100%; height: 196px;">
|
||||
|
@ -17,8 +17,8 @@
|
||||
#}
|
||||
|
||||
{% block license_content -%}
|
||||
<h3 class="sidedata">{% trans %}License{% endtrans %}</h3>
|
||||
<p>
|
||||
{% trans %}License:{% endtrans %}
|
||||
{% if media.license %}
|
||||
<a href="{{ media.license }}">{{ media.get_license_data().abbreviation }}</a>
|
||||
{% else %}
|
||||
|
@ -19,23 +19,29 @@
|
||||
{% from "mediagoblin/utils/pagination.html" import render_pagination %}
|
||||
|
||||
{% 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 entry in row %}
|
||||
{% set entry_url = entry.url_for_self(request.urlgen) %}
|
||||
<li class="media_thumbnail">
|
||||
<a href="{{ entry_url }}">
|
||||
<img src="{{ request.app.public_store.file_url(
|
||||
entry.media_files['thumb']) }}" />
|
||||
</a>
|
||||
{% if entry.title %}
|
||||
<br />
|
||||
<a href="{{ entry_url }}">{{ entry.title }}</a>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
<tr class="thumb_row
|
||||
{%- if loop.first %} thumb_row_first
|
||||
{%- elif loop.last %} thumb_row_last{% endif %}">
|
||||
{% for entry in row %}
|
||||
{% set entry_url = entry.url_for_self(request.urlgen) %}
|
||||
<td class="media_thumbnail thumb_entry
|
||||
{%- if loop.first %} thumb_entry_first
|
||||
{%- elif loop.last %} thumb_entry_last{% endif %}">
|
||||
<a href="{{ entry_url }}">
|
||||
<img src="{{ request.app.public_store.file_url(
|
||||
entry.media_files['thumb']) }}" />
|
||||
</a>
|
||||
{% if entry.title %}
|
||||
<br />
|
||||
<a href="{{ entry_url }}">{{ entry.title }}</a>
|
||||
{% endif %}
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</table>
|
||||
{%- endmacro %}
|
||||
|
||||
{#
|
||||
|
@ -21,28 +21,26 @@
|
||||
{% set next_entry_url = media.url_to_next(request.urlgen) %}
|
||||
|
||||
{% if prev_entry_url or next_entry_url %}
|
||||
<div class="navigation">
|
||||
{# 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 }}">
|
||||
← {% trans %}newer{% endtrans %}
|
||||
</a>
|
||||
{% else %}
|
||||
{# This is the first entry. display greyed-out 'previous' image #}
|
||||
<p class="navigation_button navigation_left">
|
||||
← {% trans %}newer{% endtrans %}
|
||||
</p>
|
||||
{% endif %}
|
||||
{# Likewise, this could be the very last media entry #}
|
||||
{% if next_entry_url %}
|
||||
<a class="navigation_button" href="{{ next_entry_url }}">
|
||||
{% trans %}older{% endtrans %} →
|
||||
</a>
|
||||
{% else %}
|
||||
{# This is the last entry. display greyed-out 'next' image #}
|
||||
<p class="navigation_button">
|
||||
{% trans %}older{% endtrans %} →
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{# 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 }}">
|
||||
← {% trans %}newer{% endtrans %}
|
||||
</a>
|
||||
{% else %}
|
||||
{# This is the first entry. display greyed-out 'previous' image #}
|
||||
<p class="navigation_button navigation_left">
|
||||
← {% trans %}newer{% endtrans %}
|
||||
</p>
|
||||
{% endif %}
|
||||
{# Likewise, this could be the very last media entry #}
|
||||
{% if next_entry_url %}
|
||||
<a class="navigation_button" href="{{ next_entry_url }}">
|
||||
{% trans %}older{% endtrans %} →
|
||||
</a>
|
||||
{% else %}
|
||||
{# This is the last entry. display greyed-out 'next' image #}
|
||||
<p class="navigation_button">
|
||||
{% trans %}older{% endtrans %} →
|
||||
</p>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
@ -17,17 +17,16 @@
|
||||
#}
|
||||
|
||||
{% block tags_content -%}
|
||||
<h3 class="sidedata">Tagged with</h3>
|
||||
<p>
|
||||
<p>{% trans %}View more media tagged with{% endtrans %}
|
||||
{% for tag in media.tags %}
|
||||
{% if loop.last %}
|
||||
{# the 'and' should only appear if there is more than one tag #}
|
||||
{% if media.tags|length > 1 %}
|
||||
·
|
||||
{% trans %}or{% endtrans %}
|
||||
{% endif %}
|
||||
<a href="{{ request.urlgen(
|
||||
'mediagoblin.listings.tags_listing',
|
||||
tag=tag['slug']) }}">{{ tag['name'] }}</a>
|
||||
tag=tag['slug']) }}">{{ tag['name'] }}</a>.
|
||||
{% elif loop.revindex == 2 %}
|
||||
<a href="{{ request.urlgen(
|
||||
'mediagoblin.listings.tags_listing',
|
||||
@ -35,7 +34,7 @@
|
||||
{% else %}
|
||||
<a href="{{ request.urlgen(
|
||||
'mediagoblin.listings.tags_listing',
|
||||
tag=tag['slug']) }}">{{ tag['name'] }}</a> ·
|
||||
tag=tag['slug']) }}">{{ tag['name'] }}</a>,
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</p>
|
||||
|
Loading…
x
Reference in New Issue
Block a user