Merge pull request #107 from mozilla/development

Image alignment and float fixes

media/css/app.css

@@ -12,6 +12,7 @@
 
 .page-block {
     margin-bottom: 2em;
+    overflow: hidden;
 }
 
 footer {
@@ -242,7 +243,7 @@ h4 {
     font-weight: normal;
     font-size: .9em;
     margin-top: 0px;
-    margin-bottom: 30px;
+    margin-bottom: 1em;
     line-height: 1.3em;
     color: rgba(163,163,163,1);
 }
@@ -437,8 +438,10 @@ a:hover {
 
 h1.maintopic {
     text-align: right;
-    margin-right: 185px;
+    width: 550px;
+    margin-right: 0;
     margin-top: -20px;
+    margin-bottom: 2em;
 }
 
 .twitter-bio {
@@ -503,7 +506,7 @@ img.list-thumbnail,
 img.list-thumbnail {
     float: left;
     width: 150px;
-    margin: 0 .67em .5em 0;
+    margin: 0 .67em .25em 0;
 }
 
 .map-inset-right {
@@ -611,7 +614,7 @@ article.homepage, article.search-results {
 }
 
 aside.homepage, aside.search-results {
-    padding: 5px 0 0 20px;
+    padding: 0 0 0 20px;
     width: 200px;
     float: right;
     border-left: 1px solid #cdcdcd;
@@ -782,12 +785,11 @@ span.category {
     margin-bottom: 10px;
 }
 
-img#main-logo {
-    width: 550px;
+h1 span.category {
+    line-height: inherit;
 }
 
-h1.maintopic {
-    margin-right: 0px;
+img#main-logo {
     width: 550px;
 }
 
@@ -862,6 +864,8 @@ h1.maintopic {
 
     h1.maintopic {
         width: 100%;
+        margin-right: 0px;
+        margin-bottom: 1.5em;
     }
 
     p.tagline {
@@ -928,10 +932,6 @@ h1.maintopic {
         -moz-columns:1;
     }
 
-    h1.maintopic {
-        margin-right: 0px;
-    }
-
     h2 {
         font-size: .9em;
     }
@@ -990,9 +990,9 @@ h1.maintopic {
 
     h1.maintopic {
         font-size: .9em;
+        margin-bottom: 1em;
     }
 
-
     #topbar {
         position: relative;
     }

source/articles/templates/articles/_article_list_item.html

@@ -1,7 +1,7 @@
 {# standard presentation block for an article in list and search results pages #}
 <div class="page-block">
     <h2>{% include "articles/_article_category_and_tags_overline.html" %}<a href="{{ article.get_absolute_url() }}">{{ article.title }}</a></h2>
-    {% if article.image %}<img class="list-thumbnail" src="{{ MEDIA_URL }}{{ thumbnail(article.image, "300x200", crop="center") }}" alt="{{ article.title }}">{% endif %}
+    {% if article.image %}<img class="list-thumbnail" src="{{ MEDIA_URL }}{{ thumbnail(article.image, "300x240", crop="center") }}" alt="{{ article.title }}">{% endif %}
     <ul class="link-list link-list-inline">
         {% if article.get_live_author_set().exists() %}<li>{% with author_list = article.get_live_author_set() %}{% include "articles/_article_author_list.html" %}{% endwith %}</li>{% endif %}
         {% with person_link_list = article.get_live_people_set() %}

source/articles/templates/articles/article_detail.html

@@ -11,13 +11,14 @@
 
 {% block article_class %}article-detail{% endblock %}
 {% block content %}
-    <h2>{% include "articles/_article_category_and_tags_overline.html" %}{{ article.title }}</h2>
     {% if article.image %}
         <div class="image-full-width-wrapper">
             <img src="{{ MEDIA_URL }}{{ thumbnail(article.image, "800") }}" alt="{{ article.title }}">
             {% if article.pretty_caption %}<p class="caption">{{ article.pretty_caption }}</p>{% endif %}
         </div>
     {% endif %}
+
+    <h2>{% include "articles/_article_category_and_tags_overline.html" %}{{ article.title }}</h2>
     <h4>{{ article.subhead }}</h4>
 
     <aside>

source/articles/templates/articles/article_list.html

@@ -2,9 +2,7 @@
 
 {% block content %}
 {% if section %}
-<div class="page-block">
-    <h1 class="maintopic"><a href="{{ url('article_list_by_section', section.slug) }}">{{ section.name }}</a>{% if category %} / <span class="category">{{ category }}</span>{% endif %}{% if tag %} / <span class="category">{{ tag.name }}</span>{% endif %}</h1>
-</div>
+<h1 class="maintopic"><a href="{{ url('article_list_by_section', section.slug) }}">{{ section.name }}</a>{% if category %} / <span class="category">{{ category }}</span>{% endif %}{% if tag %} / <span class="category">{{ tag.name }}</span>{% endif %}</h1>
 {% endif %}
 
 {% for article in page.object_list %}

source/base/templates/search/search.html

@@ -5,9 +5,7 @@
 {% block article_class %}search-results{% if page.object_list|length <= 2 or not (person_results or organization_results) %} search-results-single-col{% endif %}{% endblock %}
 
 {% block base_above_article %}
-<div class="page-block">
-    <h1 class="maintopic"><a href="{{ url('haystack_search') }}">Search</a></h1>
-</div>
+<h1 class="maintopic"><a href="{{ url('haystack_search') }}">Search</a></h1>
 
 <form class="search-form" method="get" action=".">
     {{ form.q }}

source/code/templates/code/code_detail.html

@@ -3,9 +3,7 @@
 {% block page_title %}{{ code.name }} - {{ super() }}{% endblock %}
 
 {% block content %}
-<div class="page-block">
-    <h1 class="maintopic"><a href="{{ url('code_list') }}">Code</a></h1>
-</div>
+<h1 class="maintopic"><a href="{{ url('code_list') }}">Code</a></h1>
 
 <div class="page-block">
     <h2 id="code-name">{% include "code/_code_category_and_tags_overline.html" %}{{ code.name }}</h2>

source/code/templates/code/code_list.html

@@ -1,12 +1,25 @@
 {% extends "code/_base_code.html" %}
 
 {% block content %}
-<div class="page-block">
-    <h1 class="maintopic"><a href="{{ url('code_list') }}">Code</a>{% if tag %} / <span class="category">{{ tag.name }}</span>{% endif %}</h1>
-</div>
+<h1 class="maintopic"><a href="{{ url('code_list') }}">Code</a>{% if tag %} / <span class="category">{{ tag.name }}</span>{% endif %}</h1>
 
 <div id="filterable-list">
-{% for alpha in object_list|groupby('sort_letter') %}
+{% if tag %}
+    <div class="grouper-block filter-block">
+        <h2 class="grouper-header"><span class="category">Code index entries tagged: {{ tag.name }}</span></h2>
+        {% for code in object_list %}
+        <div class="grid-box">
+            <h3><a href="{{ code.get_absolute_url() }}">{{ code.name }}</a></h3>
+            {% if code.summary_or_description %}<p>{{ code.summary_or_description|safe }}</p>{% endif %}
+            <ul class="link-list">
+                {% if code.get_live_organization_set().exists() %}<li><i class="icon-cogs small"></i>{% for organization in code.get_live_organization_set() %}<a class="small" href="{{ organization.get_absolute_url() }}">{{ organization.name }}</a>{% if not loop.last %}, {% endif %}{% endfor %}</li>{% endif %}
+                {% if code.tags.all().exists() %}<li><i class="icon-tags small"></i>{% for tag in code.tags.all() %}<a class="small" href="{{ url('code_list_by_tag', tag.slug) }}">{{ tag }}</a>{% if not loop.last %}, {% endif %}{% endfor %}</li>{% endif %}
+            </ul>
+        </div>
+        {% endfor %}
+    </div>
+{% else %}
+    {% for alpha in object_list|groupby('sort_letter') %}
     <div class="grouper-block filter-block">
         <h2 class="grouper-header"><span class="category">{{ alpha.grouper }}</span></h2>
         {% for code in alpha.list %}
@@ -20,7 +33,9 @@ <h3><a href="{{ code.get_absolute_url() }}">{{ code.name }}</a></h3>
         </div>
         {% endfor %}
     </div>
-{% endfor %}
+    {% endfor %}
+
+{% endif %}
 </div>
 {% endblock content %}
 

source/people/templates/people/organization_detail.html

@@ -3,9 +3,7 @@
 {% block page_title %}{{ organization.name }} - {{ super() }}{% endblock %}
 
 {% block content %}
-<div class="page-block">
-    <h1 class="maintopic"><a href="{{ url('organization_list') }}">Organizations</a></h1>
-</div>
+<h1 class="maintopic"><a href="{{ url('organization_list') }}">Organizations</a></h1>
 
 <div class="page-block item-detail">
     <h2>{{ organization.name }}</h2>

source/people/templates/people/organization_list.html

@@ -1,11 +1,9 @@
 {% extends "people/_base_organizations.html" %}
 
 {% block content %}
-<div class="page-block">
-    <h1 class="maintopic">
-         <a href="{{ url('person_list') }}">People</a> / <span class="category">Organizations</span>
-    </h1>
-</div>
+<h1 class="maintopic">
+     <a href="{{ url('person_list') }}">People</a> / <span class="category">Organizations</span>
+</h1>
 
 <div id="filterable-list">
 {% for alpha in object_list|groupby('sort_letter') %}

source/people/templates/people/person_detail.html

@@ -3,9 +3,7 @@
 {% block page_title %}{{ person.name() }} - {{ super() }}{% endblock %}
 
 {% block content %}
-<div class="page-block">
-    <h1 class="maintopic"><a href="{{ url('person_list') }}">People</a></h1>
-</div>
+<h1 class="maintopic"><a href="{{ url('person_list') }}">People</a></h1>
 
 <div class="page-block">
     <h2 id="person-name">{{ person.name() }}</h2>

source/people/templates/people/person_list.html

@@ -1,11 +1,9 @@
 {% extends "people/_base_people.html" %}
 
 {% block content %}
-<div class="page-block">
-    <h1 class="maintopic">
-        <span class="category">People</span> / <a href="{{ url('organization_list') }}">Organizations</a>
-    </h1>
-</div>
+<h1 class="maintopic">
+    <span class="category">People</span> / <a href="{{ url('organization_list') }}">Organizations</a>
+</h1>
 
 <div id="filterable-list">
 {% for alpha in object_list|groupby('sort_letter') %}