make the new style also work for blog posts

diff --git a/_config.yml b/_config.yml
index 37bb42d023b8bbde1b05f363852c951ef2716bef..37a841026200dda256d9a233f24e479a16497fb0 100644 (file)
--- a/_config.yml
+++ b/_config.yml
@@ -23,7 +23,7 @@ defaults:
   - scope:
         path: "" # all files in the project
     values:
   - scope:
         path: "" # all files in the project
     values:

-        layout: "default"
+        layout: "page"

   - scope:
         path: ""
         type: "posts"
   - scope:
         path: ""
         type: "posts"

diff --git a/_layouts/default.html b/_layouts/default.html
index b373206c81f4810f52521c68c97cebb9c4d36b24..aba9c6c0724b0ec74199c5a5afc39a12e77fb997 100644 (file)
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -5,7 +5,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width">
 
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width">
 

-    <title>{{ page.title }}{% if page.subtitle %} - {{ page.subtitle }}{% endif %}</title>
+    <title>{% if page.pretitle %}{{ page.pretitle }} • {% endif %}{{ page.title }}</title>

     {% if page.excerpt %}<meta name="description" content="{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}">{% endif %}
 
     <link rel="stylesheet" href="/style.css">
     {% if page.excerpt %}<meta name="description" content="{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}">{% endif %}
 
     <link rel="stylesheet" href="/style.css">


@@ -22,10 +22,6 @@
     </nav>
   
     <article id="-content">
     </nav>
   
     <article id="-content">

-        <header id="-title">
-          <h1>{{ page.title }}</h1>
-        </header>
-

         {{ content }}
     </article>
 
         {{ content }}
     </article>
 

diff --git a/_layouts/page.html b/_layouts/page.html
new file mode 100644 (file)
index 0000000..9397774
--- /dev/null
+++ b/_layouts/page.html
@@ -0,0 +1,8 @@
+---
+layout: default
+---
+<header id="-title">
+  <h1>{{ page.title }}</h1>
+</header>
+
+{{ content }}

diff --git a/_layouts/post.html b/_layouts/post.html
index 5ed4c6891e77ee2d116bc5bcf23d8f3a856a7315..d6500b90ad8b21c19951daf18ad9c0834cfbe987 100644 (file)
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -1,12 +1,17 @@
 ---
 layout: default
 ---
 layout: default

-title: "Ralf's Ramblings"
+pretitle: "Ralf's Ramblings"

 rss: true
 ---
 rss: true
 ---

-<header class="subtitle">
+<header id="-pretitle">

   <div class="side"><a href="{{ page.url }}">Permalink</a> • {{ page.date | date: "%b %-d, %Y" }}{% if page.author %} • {{ page.author }}{% endif %}{% if page.meta %} • {{ page.meta }}{% endif %}</div>
   <div class="side"><a href="{{ page.url }}">Permalink</a> • {{ page.date | date: "%b %-d, %Y" }}{% if page.author %} • {{ page.author }}{% endif %}{% if page.meta %} • {{ page.meta }}{% endif %}</div>

-  <h1>{{ page.subtitle }}</h1>
+  <h1>{{ page.pretitle }}</h1>

 </header>
 
 </header>
 

+<header id="-title">
+  <h1>{{ page.title }}</h1>
+</header>
+
+

 {{ content }}
 
 {{ content }}
 

diff --git a/blog/index.html b/blog/index.html
index a0d8f1afbf9dd18e29e978f69f0d102a6bb6175d..7ab91943be46ac8478273dcc3bec495af4b0657a 100644 (file)
--- a/blog/index.html
+++ b/blog/index.html
@@ -1,5 +1,4 @@
 ---
 ---

-layout: default

 title: "Ralf's Ramblings"
 slug: Blog
 rss: true
 title: "Ralf's Ramblings"
 slug: Blog
 rss: true

diff --git a/style.scss b/style.scss
index 0fa1fa77e82b530a5b27e1e8e1389f0d0fd344b3..c01d0117217078fbc575c9323a50d95cfcb88d04 100644 (file)
--- a/style.scss
+++ b/style.scss
@@ -34,20 +34,15 @@ h4 {
 $navi-width:      11em;
 $navi-indent:     1.2em;
 $frame-max-width: 50em;
 $navi-width:      11em;
 $navi-indent:     1.2em;
 $frame-max-width: 50em;

-$intrusion-width: 0.8em;
+$intrusion-width: 1.0em;

 $outer-margin:    0.8em;
 $full-content-width: $frame-max-width + $navi-width + 2*$outer-margin + $intrusion-width;
 
 $outer-margin:    0.8em;
 $full-content-width: $frame-max-width + $navi-width + 2*$outer-margin + $intrusion-width;
 

-$frame-color: #121212;
-$title-color: #08f;
-$navi-color: #36ff00;
-$current-color: #ffa700;
-$background-color: white;
+$background-color:       white;

 $text-color:             #313131;
 $text-color:             #313131;

-$code-background-color: #505050;
-$light-text-color:       #888;
-$link-color: #268BD2;
-
+$light-text-color:       #808080;
+$code-background-color:  #F7F7F7;
+$link-color:             #268BD2;

 
 /* General page structure */
 body { /* This centers us in the page, and handles the "too wide" case */
 
 /* General page structure */
 body { /* This centers us in the page, and handles the "too wide" case */


@@ -132,7 +127,7 @@ body { /* This centers us in the page, and handles the "too wide" case */
 }
 
 /* Small screens */
 }
 
 /* Small screens */

-@media screen and (max-width:#{ $frame-max-width } ) {
+@media screen and (max-width:#{ $frame-max-width + 2*$outer-margin } ) {

     body, #-frame, #-title, #-content, #-navi {
         margin: 0;
         padding: 0;
     body, #-frame, #-title, #-content, #-navi {
         margin: 0;
         padding: 0;


@@ -203,22 +198,43 @@ body { /* This centers us in the page, and handles the "too wide" case */
 
 /* Content styling */
 #-content {
 
 /* Content styling */
 #-content {

-    .subtitle .side {
+    .side {

         float: right;
         color: $light-text-color;
     }
 
         float: right;
         color: $light-text-color;
     }
 

-    code {
-        padding: 0.1em 0.2em;
+    #-pretitle, .subtitle {
+        h1 {
+            display: inline-block;
+            font-size: 165%;
+        }
+        .side {
+            margin-left: 0.5em;
+            margin-top: 0.9em;
+        }
+    }
+    .subtitle {
+        margin-top: 1.5em;
+    }
+
+    #-title {
+        clear: both;
+    }
+
+    pre, code {
+        background-color: $code-background-color;

         font-family: monospace;
         font-size: 82%;
     }
         font-family: monospace;
         font-size: 82%;
     }

+    code {
+        padding: 0.1em 0.2em;
+    }

     pre {
         padding: 0.6em;
     }
     pre code {
     pre {
         padding: 0.6em;
     }
     pre code {

-        background-color: $code-background-color;

         padding: 0;
         padding: 0;

+        font-size: 100%;

     }
 
     p {
     }
 
     p {


@@ -227,7 +243,7 @@ body { /* This centers us in the page, and handles the "too wide" case */
     }
     a {
         text-decoration: none;
     }
     a {
         text-decoration: none;

-        color:$link-color;
+        color: $link-color;

     }
     a:hover, a:focus {
         text-decoration: underline;
     }
     a:hover, a:focus {
         text-decoration: underline;