Commits

Vlad Riscutia committed a451398

Style tweaks. Cross-browser fixes

Comments (0)

Files changed (3)

tinkerer/themes/boilerplate/layout.html

     <header>
       <hgroup>
         <h1><a href="{{ pathto(pages[0][0]) }}">{{ shorttitle|e }}</a></h1>
-        <h2>{{ tagline|e }}</h2>
+        <span>{{ tagline|e }}</span>
       </hgroup>
     </header>
 {% endblock -%}
 
 {%- block navigation -%}
-    <nav>
-      {%- block quicklinks -%}
-      <ul class="quicklinks">
-        {%- if rss_in_page_nav -%}
-        <li>{{ rss_link() }}</li>
-        {%- endif -%}
-      </ul>
-      {%- endblock -%}
+    <nav class="clearfix">
       <ul class="main-navigation">
+        {%- block quicklinks -%}
+          {%- if rss_in_page_nav -%}
+          <li class="quicklink">{{ rss_link() }}</li>
+          {%- endif -%}
+        {%- endblock -%}
         {% for page in pages -%}
-        <li>
+        <li class="main-nav">
           <a href="{{ pathto(page[0]) }}">{{ page[1]|e }}</a>
         </li>
         {% endfor -%}  

tinkerer/themes/boilerplate/static/style.css

 
 body { margin: auto; max-width: 999px; }
 
-ul.quicklinks { display: none; }
+li.quicklink { display: none; }
 
 nav li { text-align: center; width: 100%; }
 
 
 @media only screen and (min-width: 768px) {
     /* Style adjustments for viewports 768px and over go here */
-    ul.quicklinks { display: block; float: right; }
+    li.quicklink { display: inline; float: right; }
 
     div.documentwrapper { margin-right: 333px; } 
     

tinkerer/themes/modern5/static/modern5.css_t

 
 body { font-family: {{ sans_serif_font }}; font-size: 1em; }
 
-header h1 * { font-family: {{ serif_font }}; font-size: 1.8em; }
-header h2 { font-family: {{ sans_serif_font }}; font-size: 1.4em; }
+header h1 * { font-family: {{ sans_serif_font }}; font-size: 1.6em; font-weight: normal; }
+header span { font-family: {{ sans_serif_font }}; font-size: 1.4em; }
 
 nav { font-size: 1.4em; }
 
 footer { font-size: 0.8em; }
 
 /* Layout */
-header h1, h2 { margin: 0; }
-header h1 { padding: 20px 40px 5px; }
-header h2 { padding: 5px 40px 1em; }
+header { padding: 40px 0; }
+header h1, span { margin: 0; }
+header h1 { padding: 0 40px 5px; }
+header span { padding: 5px 40px 0; }
 
 nav { padding: 10px 0; }
 
 div.related { padding: 40px 0 0; }
 article.document { padding: 40px 0 20px 0; }
 article.document h1, h2, h3 { margin-top: 0; }
+article.document + div.related { padding-bottom: 20px; }
 
 div.highlight { padding: 10px 20px; }
 
 
 @media only screen and (min-width: 480px) {
     nav ul { padding: 0; }
-    nav li { margin: 40px 0; }
-    nav a { padding: 0 40px; }
-    nav ul.quicklinks a { padding: 0; }
-    nav ul.quicklinks { margin-right: 40px; }
-    nav ul.quicklinks li { padding-left: 10px; padding-right: 0; }
+    nav li.main-nav { margin: 40px 0; }
+    nav li.main-nav a { padding: 0 40px; }
+    nav li.quicklink { margin-right: 40px; padding: 0 0 0 10px; }
+    nav li.quicklink a { padding: 0; }
 }
 
 @media only screen and (min-width: 768px) {
-    ul.main-navigation { margin-right: 160px; }
-
     footer { margin-bottom: 20px; }
 }
 
 
 header { background-color: {{ theme_color }}; }
 header a, header a:visited, header a:hover, headera:active { color: {{ header_color }}; text-decoration: none; }
-header h2 { color: {{ header_color }}; }
+header span { color: {{ theme_color_light }}; }
 
 nav li a, nav li a:visited, footer { color: {{ theme_color_light }}; text-decoration: none; }
 nav li a:hover { color: {{ header_color }}; text-decoration: none; }
 
 /* Effects */
 header h1 * { text-shadow: 0 2px 3px {{ theme_color_dark }}; }
-header h2 { text-shadow: 0 2px 3px {{ theme_color_dark }}; }
 
 header, nav { border-bottom: 1px solid {{ theme_color_dark }}; }
 footer { border-top: 1px solid {{ theme_color_dark }}; }
 
     footer, nav li { text-shadow: 0 2px 3px {{ theme_color_dark }}; }
 
-    nav li + li > a { border-left: 1px solid {{ theme_color_dark }}; }
-    nav li + li { border-left: 1px solid {{ theme_color_light }}; }
+    nav li.main-nav + li.main-nav > a { border-left: 1px solid {{ theme_color_dark }}; }
+    nav li.main-nav + li.main-nav { border-left: 1px solid {{ theme_color_light }}; }
 
 }