Commits

Vlad Riscutia committed 22121eb

Style tweaks

Comments (0)

Files changed (5)

tinkerer/themes/boilerplate/layout.html

 {#- prev/next -#}
 {%- macro relbar() -%}
     {%- if prev or next -%}
-    <div class="related clearfix">
+    <div class="related">
         <ul>
+            <li class="left">
             {%- if prev -%}
-            <li>{{ prevchar }}<a href="{{ prev.link|e }}">{{ prev.title }}</a></li>
+                {{ prevchar }}<a href="{{ prev.link|e }}">{{ prev.title }}</a>
             {%- endif -%}
+            </li>
+            <li class="right">
             {%- if next -%}
-            <li class="right"><a href="{{ next.link|e }}">{{ next.title }}</a>{{ nextchar }}</li>
+                <a href="{{ next.link|e }}">{{ next.title }}</a>{{ nextchar }}
             {%- endif -%}
+            </li>
         </ul>
     </div>
     {%- endif -%}
         {%- endif -%}
       </ul>
       {%- endblock -%}
-      <ul class="main-nagivation">
+      <ul class="main-navigation">
         {% for page in pages -%}
         <li>
           <a href="{{ pathto(page[0]) }}">{{ page[1]|e }}</a>
     <div class="main">
 {%- block content -%}
       <div class="content clearfix">
-      {%- block document -%}
-        <div class="documentwrapper">
-          {%- block relbar1 -%}{{ relbar() }}{% endblock -%}
-            <article class="document">
-              {% block body -%} {% endblock -%}
-            </article>
-          {%- block relbar2 -%}{{ relbar() }}{% endblock -%}
-        </div>
-      {%- endblock -%}
       {%- if render_sidebar -%}
         <aside class="sidebar">
           {%- if sidebars != None -%}
           {%- endif -%}
         </aside>
       {%- endif -%}
+      {%- block document -%}
+        <div class="documentwrapper">
+          {%- block relbar1 -%}{{ relbar() }}{% endblock -%}
+            <article class="document">
+              {% block body -%} {% endblock -%}
+            </article>
+          {%- block relbar2 -%}{{ relbar() }}{% endblock -%}
+        </div>
+      {%- endblock -%}
       </div>
 {%- endblock -%}
     </div>

tinkerer/themes/boilerplate/static/style.css

 
 body { margin: auto; max-width: 999px; }
 
-article.document { float: left; width: 100%; }
-
 ul.quicklinks { display: none; }
 
 nav li { text-align: center; width: 100%; }
   /* Style adjustments for viewports 480px and over go here */
     nav li { display: inline; list-style-type: none; text-align: left; width: auto; }
 
-    div.related ul { margin: 0; padding: 0; }
-    div.related li { float: left; }
-    div.related li.right { float: right; }
+    div.related ul { margin: 0; padding: 0; width: 100%; }
+    div.related li.left { display: inline; }
+    div.related li.right { display: inline; float: right; }
 }
 
 @media only screen and (max-width: 767px) {
     /* Style adjustments for viewports 768px and over go here */
     ul.quicklinks { display: block; float: right; }
 
-    div.documentwrapper { float: left; margin-right: 333px; } 
+    div.documentwrapper { margin-right: 333px; } 
     
-    aside.sidebar { float: left; margin-left: -333px; width: 333px; }
+    aside.sidebar { float: right; margin-left: -333px; width: 333px; }
 }
 
 

tinkerer/themes/modern5/static/header.png

Added
New image

tinkerer/themes/modern5/static/modern5.css_t

 header h1 { padding: 10px 40px 5px; }
 header h2 { padding: 5px 40px 1em; }
 
-nav, footer { padding: 10px 40px; }
+nav { padding: 10px 0; }
 
 div.documentwrapper { padding: 0 40px 20px; }
-div.related { margin: 20px 0 0; }
+div.related { padding: 20px 0 0; }
 article.document { padding: 20px 0; }
 article.document h1, h2, h3 { margin-top: 0; }
 
 aside.sidebar h1 { margin-top: 0; }
 aside.sidebar div.widget { padding: 20px 40px; }
 
+footer { padding: 10px 40px; }
+
 @media only screen and (min-width: 480px) {
-    nav li { padding-right: 40px; }
-    nav li + li { padding-left: 40px; }
+    nav ul { padding: 0; }
+    ul.main-navigation { margin-right: 333px; }
+    nav li { margin: 40px 0; padding: 0 40px; }
     nav div.quicklinks li { padding-left: 10px; padding-right: 0; }
 }
 
 
 a, a:visited { color: {{ link_color }}; text-decoration: none; }
 a:hover { color: {{ link_color }}; text-decoration: underline; }
+div.section a { color: {{ text_color }}; text-decoration: none; }
 
 div.content { background-color: {{ paper_color }}; color: {{ text_color }}; }
 aside.sidebar { background-color: {{ sidebar_color }}; }
 
-footer { margin-bottom: 20px; }
-
 /* 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 }}; }
 
-nav, footer {
-    background: #354550;
-    background: -moz-linear-gradient(top, #354550 0%, #021520 50%, #02121d 51%, #011019 100%);
-    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#354550), color-stop(50%,#021520), color-stop(51%,#02121d), color-stop(100%,#011019));
-    background: -webkit-linear-gradient(top, #354550 0%,#021520 50%,#02121d 51%,#011019 100%);
-    background: -o-linear-gradient(top, #354550 0%,#021520 50%,#02121d 51%,#011019 100%);
-    background: -ms-linear-gradient(top, #354550 0%,#021520 50%,#02121d 51%,#011019 100%);
-    background: linear-gradient(top, #354550 0%,#021520 50%,#02121d 51%,#011019 100%);
-    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#354550', endColorstr='#011019',GradientType=0 );
-}
+nav, footer { background: #354550; }
 
-footer {
-    -moz-border-radius-bottomleft: 10px;
-    -moz-border-radius-bottomright: 10px;
-    -webkit-border-bottom-left-radius: 10px;
-    -webkit-border-bottom-right-radius: 10px;
-    -o-border-bottom-left-radius: 10px;
-    -o-border-bottom-right-radius: 10px;
-    -ms-border-bottom-left-radius: 10px;
-    -ms-border-bottom-right-radius: 10px;
-    border-bottom-left-radius: 10px;
-    border-bottom-right-radius: 10px; 
+@media only screen and (min-width: 480px) {
+    header { background-image: url('header.png'); background-repeat: repeat; }
+
+    div.content { background-image: url('paper.png'); background-repeat: repeat; }
+
+    nav, footer {
+        background: -moz-linear-gradient(top, #354550 0%, #021520 50%, #02121d 51%, #011019 100%);
+        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#354550), color-stop(50%,#021520), color-stop(51%,#02121d), color-stop(100%,#011019));
+        background: -webkit-linear-gradient(top, #354550 0%,#021520 50%,#02121d 51%,#011019 100%);
+        background: -o-linear-gradient(top, #354550 0%,#021520 50%,#02121d 51%,#011019 100%);
+        background: -ms-linear-gradient(top, #354550 0%,#021520 50%,#02121d 51%,#011019 100%);
+        background: linear-gradient(top, #354550 0%,#021520 50%,#02121d 51%,#011019 100%);
+        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#354550', endColorstr='#011019',GradientType=0 );
+    }
 }
 
 @media only screen and (min-width: 768px) {
-    div.documentwrapper { border-right: 1px solid #cfd5da; }
+    div.documentwrapper { border-left: 1px solid #cfd5da; }
+    aside.sidebar { border-left: 1px solid #cfd5da; border-right: 1px solid #cfd5da; }
+
+    footer { margin-bottom: 20px; }
+
+    footer {
+        -moz-border-radius-bottomleft: 10px;
+        -moz-border-radius-bottomright: 10px;
+        -webkit-border-bottom-left-radius: 10px;
+        -webkit-border-bottom-right-radius: 10px;
+        -o-border-bottom-left-radius: 10px;
+        -o-border-bottom-right-radius: 10px;
+        -ms-border-bottom-left-radius: 10px;
+        -ms-border-bottom-right-radius: 10px;
+        border-bottom-left-radius: 10px;
+        border-bottom-right-radius: 10px; 
+    }
 }
 
 div.post_separator { border-bottom: 1px dashed black; }

tinkerer/themes/modern5/static/paper.png

Added
New image