incorporate skeleton layout in the galleries

This commit is contained in:
jpope777 2014-01-01 00:48:23 -06:00
parent b5ab205d3c
commit 5970a855f6
6 changed files with 62 additions and 32 deletions

View File

@ -107,7 +107,7 @@ input, textarea {
.container {
margin: auto;
width: 96%;
/* width: 96%;*/
max-width: 940px;
}
@ -275,6 +275,22 @@ text-align: center;
margin-left: 8px;
}
.alpha {
margin-left:0;
}
.omega {
margin-right:0;
}
.heaven {
margin-top:0;
}
.hell {
margin-bottom:0;
}
/* forms */
.form_box,.form_box_xl {
@ -820,7 +836,7 @@ pre {
header {
text-align: center;
}
.header_right {
margin-right: 2%;
float: none;
@ -829,12 +845,32 @@ pre {
a.logo {
margin-left: 2%;
}
}
@media screen and (min-width: 960px) {
.container .three.columns {
width:180px;
margin-left:3px;
margin-right:3px;
}
}
@media only screen and (min-width: 768px) and (max-width: 959px) {
.container .three.columns {
width:147px;
margin-left:2px;
margin-right:2px;
}
}
@media screen and (max-width: 767px) {
.thumb_row {
margin-bottom: 0;
}
}
@media screen and (max-width: 570px) {
.media_thumbnail {
width: 29%;
}
}
@media screen and (max-width: 380px) {

View File

@ -1 +0,0 @@
../../../../extlib/skeleton/stylesheets/base.css

View File

@ -1 +0,0 @@
../../../../extlib/skeleton/stylesheets/layout.css

View File

@ -27,25 +27,12 @@
<title>{% block title %}{{ app_config['html_title'] }}{% endblock %}</title>
<link rel="stylesheet" type="text/css"
href="{{ request.staticdirect('/css/extlib/reset.css') }}"/>
<link rel="stylesheet" type="text/css"
href="{{ request.staticdirect('/css/extlib/skeleton.css') }}"/>
<link rel="stylesheet" type="text/css"
href="{{ request.staticdirect('/css/base.css') }}"/>
<link rel="stylesheet" type="text/css"
href="{{ request.staticdirect('/css/skeletonbase.css') }}"/>
<link rel="stylesheet" type="text/css"
href="{{ request.staticdirect('/css/skeleton.css') }}"/>
<link rel="stylesheet" type="text/css"
href="{{ request.staticdirect('/css/layout.css') }}"/>
<link rel="shortcut icon"
href="{{ request.staticdirect('/images/goblin.ico') }}" />
<script type="text/javascript"
src="{{ request.staticdirect('/js/extlib/jquery.js') }}"></script>
<script type="text/javascript"
src="{{ request.staticdirect('/js/header_dropdown.js') }}"></script>
<script type="text/javascript"
src="{{ request.staticdirect('/js/notifications.js') }}"></script>
<script>
var mark_all_comments_seen_url = "{{ request.urlgen('mediagoblin.notifications.mark_all_comment_notifications_seen') }}"
</script>
{# For clarification, the difference between the extra_head.html template
# and the head template hook is that the former should be used by
@ -183,4 +170,13 @@
{%- endblock mediagoblin_body %}
{% include 'mediagoblin/bits/body_end.html' %}
</body>
<script type="text/javascript"
src="{{ request.staticdirect('/js/extlib/jquery.js') }}"></script>
<script type="text/javascript"
src="{{ request.staticdirect('/js/header_dropdown.js') }}"></script>
<script type="text/javascript"
src="{{ request.staticdirect('/js/notifications.js') }}"></script>
<script>
var mark_all_comments_seen_url = "{{ request.urlgen('mediagoblin.notifications.mark_all_comment_notifications_seen') }}"
</script>
</html>

View File

@ -19,15 +19,15 @@
{% from "mediagoblin/utils/pagination.html" import render_pagination %}
{% macro media_grid(request, collection_items, col_number=5) %}
<table class="thumb_gallery">
<div class="thumb_gallery">
{% for row in collection_items|batch(col_number) %}
<tr class="thumb_row
<div class="row thumb_row
{%- if loop.first %} thumb_row_first
{%- elif loop.last %} thumb_row_last{% endif %}">
{% for item in row %}
{% set media_entry = item.get_media_entry %}
{% set entry_url = media_entry.url_for_self(request.urlgen) %}
<td class="media_thumbnail thumb_entry
<div class="three columns media_thumbnail thumb_entry
{%- if loop.first %} thumb_entry_first
{%- elif loop.last %} thumb_entry_last{% endif %}">
<a href="{{ entry_url }}">
@ -49,11 +49,11 @@
{%- trans %}(remove){% endtrans -%}
</a>
{% endif %}
</td>
</div>
{% endfor %}
</tr>
</div>
{% endfor %}
</table>
</div>
{%- endmacro %}
{#

View File

@ -19,14 +19,14 @@
{% from "mediagoblin/utils/pagination.html" import render_pagination %}
{% macro media_grid(request, media_entries, col_number=5) %}
<table class="thumb_gallery">
<div class="thumb_gallery">
{% for row in media_entries|batch(col_number) %}
<tr class="thumb_row
<div class="row 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
<div class="three columns media_thumbnail thumb_entry
{%- if loop.first %} thumb_entry_first
{%- elif loop.last %} thumb_entry_last{% endif %}">
<a href="{{ entry_url }}">
@ -35,11 +35,11 @@
{% if entry.title %}
<a class="thumb_entry_title" href="{{ entry_url }}">{{ entry.title }}</a>
{% endif %}
</td>
</div>
{% endfor %}
</tr>
</div>
{% endfor %}
</table>
</div>
{%- endmacro %}
{#