css code style and minor refactor

diff --git a/b.rb b/b.rb
index 6bd631d9c9d81489e3263da61b0a6349c61b6699..2dc8ad8ad7d9287dda1106a67b66544642663cd0 100644 (file)
--- a/b.rb
+++ b/b.rb
@@ -90,12 +90,12 @@ EOF
         #{content}
       </div>
     </div>
         #{content}
       </div>
     </div>

-    <div id="comment-stripe">
+    <div class="comment-stripe">

 #{o[:comments]}
     </div>
     <footer>
 #{o[:footer]}
 #{o[:comments]}
     </div>
     <footer>
 #{o[:footer]}

-      <p>This site has a <a href="/git/?p=iankelling.org;a=summary">git repo</a>. Unless stated otherwise, <a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/"><img id="cc-by-sa" alt="Creative Commons License" src="/assets/cc-by-sa-4.0-80x15.png" /></a></p>
+      <p>This site has a <a href="/git/?p=iankelling.org;a=summary">git repo</a>. Unless stated otherwise, <a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/"><img class="cc-by-sa" alt="Creative Commons License" src="/assets/cc-by-sa-4.0-80x15.png" /></a></p>

       <p><address><a href="mailto:ian@iankelling.org">ian@iankelling.org</a> let me know what you think</address></p>
     </footer>
   </body>
       <p><address><a href="mailto:ian@iankelling.org">ian@iankelling.org</a> let me know what you think</address></p>
     </footer>
   </body>


@@ -243,7 +243,7 @@ EOF
     blog_toc_entry = "<li><a href=\"#{rel_path}\">#{title}</a></li>"
 
     com_section = <<EOF
     blog_toc_entry = "<li><a href=\"#{rel_path}\">#{title}</a></li>"
 
     com_section = <<EOF

-<div id="comment-section">
+<div id="comment-section" class="comment-section">

   #{com_section}
 </div>
 EOF
   #{com_section}
 </div>
 EOF

diff --git a/build.rb b/build.rb
index 620fe89c345937dcec223e737a135069df2f7503..370047f651db343069a2a5ad2c02253a90f33476 100755 (executable)
--- a/build.rb
+++ b/build.rb
@@ -80,7 +80,7 @@ EOF
 fskel('index.html', DN, File.read('../index.html'))
 
 stdpage('blog', <<EOF)
 fskel('index.html', DN, File.read('../index.html'))
 
 stdpage('blog', <<EOF)

-<ul class="index">
+<ul class="site-nav-list">

   #{blog_list.join("\n")}
 </ul>
 EOF
   #{blog_list.join("\n")}
 </ul>
 EOF

diff --git a/css/code-highlight.scss b/css/code-highlight.scss
index d5d05f2f26f9baf84e6d0bba0d3e10d76a53b66a..7649d13f08376f63d2f2a2f318183fb701df437f 100644 (file)
--- a/css/code-highlight.scss
+++ b/css/code-highlight.scss
@@ -12,209 +12,209 @@
 /*  print HtmlFormatter().get_style_defs('.highlight')*/
 
 .highlight .cm {
 /*  print HtmlFormatter().get_style_defs('.highlight')*/
 
 .highlight .cm {

-    color: #999988;
-    font-style: italic;
+  color: #999988;
+  font-style: italic;

 }
 .highlight .cp {
 }
 .highlight .cp {

-    color: #999999;
-    font-weight: bold;
+  color: #999999;
+  font-weight: bold;

 }
 .highlight .c1 {
 }
 .highlight .c1 {

-    color: #999988;
-    font-style: italic;
+  color: #999988;
+  font-style: italic;

 }
 .highlight .cs {
 }
 .highlight .cs {

-    color: #999999;
-    font-weight: bold;
-    font-style: italic;
+  color: #999999;
+  font-weight: bold;
+  font-style: italic;

 }
 .highlight .c, .highlight .cd {
 }
 .highlight .c, .highlight .cd {

-    color: #999988;
-    font-style: italic;
+  color: #999988;
+  font-style: italic;

 }
 .highlight .err {
 }
 .highlight .err {

-    color: #a61717;
-    background-color: #e3d2d2;
+  color: #a61717;
+  background-color: #e3d2d2;

 }
 .highlight .gd {
 }
 .highlight .gd {

-    color: #000000;
-    background-color: #ffdddd;
+  color: #000000;
+  background-color: #ffdddd;

 }
 .highlight .ge {
 }
 .highlight .ge {

-    color: #000000;
-    font-style: italic;
+  color: #000000;
+  font-style: italic;

 }
 .highlight .gr {
 }
 .highlight .gr {

-    color: #aa0000;
+  color: #aa0000;

 }
 .highlight .gh {
 }
 .highlight .gh {

-    color: #999999;
+  color: #999999;

 }
 .highlight .gi {
 }
 .highlight .gi {

-    color: #000000;
-    background-color: #ddffdd;
+  color: #000000;
+  background-color: #ddffdd;

 }
 .highlight .go {
 }
 .highlight .go {

-    color: #888888;
+  color: #888888;

 }
 .highlight .gp {
 }
 .highlight .gp {

-    color: #555555;
+  color: #555555;

 }
 .highlight .gs {
 }
 .highlight .gs {

-    font-weight: bold;
+  font-weight: bold;

 }
 .highlight .gu {
 }
 .highlight .gu {

-    color: #aaaaaa;
+  color: #aaaaaa;

 }
 .highlight .gt {
 }
 .highlight .gt {

-    color: #aa0000;
+  color: #aa0000;

 }
 .highlight .kc {
 }
 .highlight .kc {

-    color: #000000;
-    font-weight: bold;
+  color: #000000;
+  font-weight: bold;

 }
 .highlight .kd {
 }
 .highlight .kd {

-    color: #000000;
-    font-weight: bold;
+  color: #000000;
+  font-weight: bold;

 }
 .highlight .kn {
 }
 .highlight .kn {

-    color: #000000;
-    font-weight: bold;
+  color: #000000;
+  font-weight: bold;

 }
 .highlight .kp {
 }
 .highlight .kp {

-    color: #000000;
-    font-weight: bold;
+  color: #000000;
+  font-weight: bold;

 }
 .highlight .kr {
 }
 .highlight .kr {

-    color: #000000;
-    font-weight: bold;
+  color: #000000;
+  font-weight: bold;

 }
 .highlight .kt {
 }
 .highlight .kt {

-    color: #445588;
-    font-weight: bold;
+  color: #445588;
+  font-weight: bold;

 }
 .highlight .k, .highlight .kv {
 }
 .highlight .k, .highlight .kv {

-    color: #000000;
-    font-weight: bold;
+  color: #000000;
+  font-weight: bold;

 }
 .highlight .mf {
 }
 .highlight .mf {

-    color: #009999;
+  color: #009999;

 }
 .highlight .mh {
 }
 .highlight .mh {

-    color: #009999;
+  color: #009999;

 }
 .highlight .il {
 }
 .highlight .il {

-    color: #009999;
+  color: #009999;

 }
 .highlight .mi {
 }
 .highlight .mi {

-    color: #009999;
+  color: #009999;

 }
 .highlight .mo {
 }
 .highlight .mo {

-    color: #009999;
+  color: #009999;

 }
 .highlight .m, .highlight .mb, .highlight .mx {
 }
 .highlight .m, .highlight .mb, .highlight .mx {

-    color: #009999;
+  color: #009999;

 }
 .highlight .sb {
 }
 .highlight .sb {

-    color: #d14;
+  color: #d14;

 }
 .highlight .sc {
 }
 .highlight .sc {

-    color: #d14;
+  color: #d14;

 }
 .highlight .sd {
 }
 .highlight .sd {

-    color: #d14;
+  color: #d14;

 }
 .highlight .s2 {
 }
 .highlight .s2 {

-    color: #d14;
+  color: #d14;

 }
 .highlight .se {
 }
 .highlight .se {

-    color: #d14;
+  color: #d14;

 }
 .highlight .sh {
 }
 .highlight .sh {

-    color: #d14;
+  color: #d14;

 }
 .highlight .si {
 }
 .highlight .si {

-    color: #d14;
+  color: #d14;

 }
 .highlight .sx {
 }
 .highlight .sx {

-    color: #d14;
+  color: #d14;

 }
 .highlight .sr {
 }
 .highlight .sr {

-    color: #009926;
+  color: #009926;

 }
 .highlight .s1 {
 }
 .highlight .s1 {

-    color: #d14;
+  color: #d14;

 }
 .highlight .ss {
 }
 .highlight .ss {

-    color: #990073;
+  color: #990073;

 }
 .highlight .s {
 }
 .highlight .s {

-    color: #d14;
+  color: #d14;

 }
 .highlight .na {
 }
 .highlight .na {

-    color: #008080;
+  color: #008080;

 }
 .highlight .bp {
 }
 .highlight .bp {

-    color: #999999;
+  color: #999999;

 }
 .highlight .nb {
 }
 .highlight .nb {

-    color: #0086B3;
+  color: #0086B3;

 }
 .highlight .nc {
 }
 .highlight .nc {

-    color: #445588;
-    font-weight: bold;
+  color: #445588;
+  font-weight: bold;

 }
 .highlight .no {
 }
 .highlight .no {

-    color: #008080;
+  color: #008080;

 }
 .highlight .nd {
 }
 .highlight .nd {

-    color: #3c5d5d;
-    font-weight: bold;
+  color: #3c5d5d;
+  font-weight: bold;

 }
 .highlight .ni {
 }
 .highlight .ni {

-    color: #800080;
+  color: #800080;

 }
 .highlight .ne {
 }
 .highlight .ne {

-    color: #990000;
-    font-weight: bold;
+  color: #990000;
+  font-weight: bold;

 }
 .highlight .nf {
 }
 .highlight .nf {

-    color: #990000;
-    font-weight: bold;
+  color: #990000;
+  font-weight: bold;

 }
 .highlight .nl {
 }
 .highlight .nl {

-    color: #990000;
-    font-weight: bold;
+  color: #990000;
+  font-weight: bold;

 }
 .highlight .nn {
 }
 .highlight .nn {

-    color: #555555;
+  color: #555555;

 }
 .highlight .nt {
 }
 .highlight .nt {

-    color: #000080;
+  color: #000080;

 }
 .highlight .vc {
 }
 .highlight .vc {

-    color: #008080;
+  color: #008080;

 }
 .highlight .vg {
 }
 .highlight .vg {

-    color: #008080;
+  color: #008080;

 }
 .highlight .vi {
 }
 .highlight .vi {

-    color: #008080;
+  color: #008080;

 }
 .highlight .nv {
 }
 .highlight .nv {

-    color: #008080;
+  color: #008080;

 }
 .highlight .ow {
 }
 .highlight .ow {

-    color: #000000;
-    font-weight: bold;
+  color: #000000;
+  font-weight: bold;

 }
 .highlight .o {
 }
 .highlight .o {

-    color: #000000;
-    font-weight: bold;
+  color: #000000;
+  font-weight: bold;

 }
 .highlight .w {
 }
 .highlight .w {

-    color: #bbbbbb;
+  color: #bbbbbb;

 }
 .highlight {
 }
 .highlight {

-    background-color: #f8f8f8;
+  background-color: #f8f8f8;

 }
 }

diff --git a/css/common.scss b/css/common.scss
index 13f2490b50892764f112be8a48cd25486cd77dfc..7bf33af67b5687980b68dc911dc825e30ebe975e 100644 (file)
--- a/css/common.scss
+++ b/css/common.scss
@@ -1,38 +1,21 @@
-/* a few minor things are duplicated in main.css and gitweb.css,*/
+// a few minor things are in main.css and gitweb.css
+
+@import "open-sans";

 
 $comment-background-color: #ebeae4;
 
 $comment-background-color: #ebeae4;

-$comment-br-color: #c4c3bc; /* a darkish color, black is too striking */
-$comment-date-color: #555; /* a bit lighter for less emphasis */
+$comment-br-color: #c4c3bc; // a darkish color, black is too striking
+$comment-date-color: #555; // a bit lighter for less emphasis

 $content-color: #f6f6f0; // from gitweb.
 $content-color: #f6f6f0; // from gitweb.

-$inline-code-background-color: #ffffff;
+$inline-code-background-color: #fff;

 $link-color: #0645ad;
 $link-visited-color: #0b0080;
 $main-column-max-width: 700px;
 $page-header-link-color: #333;
 $site-background-color: #d9d8d1; // from gitweb.
 $link-color: #0645ad;
 $link-visited-color: #0b0080;
 $main-column-max-width: 700px;
 $page-header-link-color: #333;
 $site-background-color: #d9d8d1; // from gitweb.

-$text-input-color: #ffffff;
-
-/* nice font seen elsewhere. google -> stackoverflow -> localfont.com */
-/* If I didn't use this font, I'd just go with sans-serif */
-@font-face {
-    font-family: 'Open Sans';
-    font-weight: 400;
-    font-style: normal;
-    src: url('/font/Open-Sans-regular/Open-Sans-regular.eot');
-    src: url('/font/Open-Sans-regular/Open-Sans-regular.eot?#iefix') format('embedded-opentype'),
-    local('Open Sans'),
-    local('Open-Sans-regular'),
-    url('/font/Open-Sans-regular/Open-Sans-regular.woff2') format('woff2'),
-    url('/font/Open-Sans-regular/Open-Sans-regular.woff') format('woff'),
-    url('/font/Open-Sans-regular/Open-Sans-regular.ttf') format('truetype'),
-    url('/font/Open-Sans-regular/Open-Sans-regular.svg#Open Sans') format('svg');
-}
-
+$text-input-color: #fff;

 
 body {
 
 body {

-    font-family: 'Open Sans',sans-serif;
-    /* default too bright. use gitweb's color */
-    background-color: $site-background-color;
-    /* get rid of the small default margin so we can stripe the page */
-    margin: 0;
+  background-color: $site-background-color; // default too bright. use gitweb's color
+  font-family: 'Open Sans',sans-serif;
+  margin: 0; // get rid of the small default margin so we can stripe the page

 }
 }

diff --git a/css/gitweb-site.scss b/css/gitweb-site.scss
index 0eea16a0948fef9c0e5adc36265e3890f01f8fac..a8a7ba7ba759e39a5698862af430bcf13903bf83 100644 (file)
--- a/css/gitweb-site.scss
+++ b/css/gitweb-site.scss
@@ -1,67 +1,66 @@
-@import 'common';
+@import "common";

 
 .main-content-stripe {
 
 .main-content-stripe {

-    // default too bright.
-    background-color: $content-color;
-    padding: 30px 0;
+  // default too bright.
+  background-color: $content-color;
+  padding: 30px 0;

 }
 
 }
 

-/* copied from main.css, applied here */

 body {
 body {

-    border-width: 0px;
+  border-width: 0; // remove ugly border

 }
 }

-.page_header,.page_footer {
-    // auto centers it
-    margin-left: auto;
-    margin-right: auto;
-    margin-top: 0;
-    margin-bottom: 0;
-    padding-left: 30px;
-    padding-right: 30px;
-    max-width: $main-column-max-width;
+
+.page_header,
+.page_footer {
+  margin-bottom: 0;
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: 0;
+  max-width: $main-column-max-width;
+  padding-left: 30px;
+  padding-right: 30px;

 }
 
 table.project_list {
 }
 
 table.project_list {

-    /* The main project list just has this one uncentered element,*/
-    /* so center it */
-    margin: 0 auto;
+  // The main project list just has this one uncentered element,
+  // so center it
+  margin: 0 auto;

 }
 }

+

 .content {
 .content {

-    /* summary pages etc. don't fit nicely in 700px, so just*/
-    /* have a 20px margin. */
-    margin: 0 20px;
+  // summary pages etc. don't fit nicely in 700px, so just
+  // have a 20px margin.
+  margin: 0 20px;

 }
 
 div.page_header {
 }
 
 div.page_header {

-    /* 21.0667 seems to be default for h3 in the non-gitweb site, copy it here */
-    margin-top: 21.0667px;
-    margin-bottom: 21.0667px;
-    /* remove padding added by gitweb's css */
-    padding-top: 0;
-    padding-bottom: 0;
+  // 21.0667 seems to be default for h3 in the non-gitweb site, copy it here
+  margin-bottom: 21.0667px;
+  margin-top: 21.0667px;
+  padding-bottom: 0;
+  padding-top: 0; // remove padding added by gitweb's css

 }
 
 }
 

-/* I tried to find all the css to override,*/
-/* but found certain things not overriding as I would expect,*/
-/* So hammer it with !important */
+// I tried to find all the css to override,
+// but found certain things not overriding as I would expect,
+// So hammer it with !important

 a {
 a {

-    color: $link-color !important;
-    text-decoration: none;
+  color: $link-color !important;
+  text-decoration: none;

 }
 }

+

 a:hover {
 a:hover {

-    text-decoration: underline !important;
+  text-decoration: underline !important;

 }
 
 a:visited {
 }
 
 a:visited {

-    color: $link-visited-color !important;
+  color: $link-visited-color !important;

 }
 
 }
 

-
-.page_header, .page_header a:visited, .page_header a {
-    /* copy from h settings in main.css */
-    line-height: 1.2;
-    /* copy of the h3 size in main site. */
-    font-size: 21.0667px;
-    /* same as for main.css */
-    color: $page-header-link-color !important;
+.page_header,
+.page_header a:visited,
+.page_header a {
+  color: $page-header-link-color !important; // same as for main.css
+  font-size: 21.0667px; // same as otehr 21.0667
+  line-height: 1.2; // copy from h settings in main.css

 }
 }

diff --git a/css/main.scss b/css/main.scss
index 8d8b4bd4d5a1ce159ed1434d43cbd4f333c68747..c8782244dce4d7ce26395af972b6695bd22fe3db 100644 (file)
--- a/css/main.scss
+++ b/css/main.scss
@@ -1,181 +1,186 @@
+// https://github.com/necolas/normalize.css

 @import "normalize";
 @import "common";
 
 @import "normalize";
 @import "common";
 

-#cc-by-sa {
-    /* It sits too high by default. */
-    vertical-align: middle;
+.cc-by-sa {
+  // It sits too high by default.
+  vertical-align: middle;

 }
 
 }
 

-#comments {
-    /* add some space at top and bottom of comment section */
-    margin: 50px 0;
+.comments {
+  // add some space at top and bottom of comment section
+  margin: 50px 0;

 }
 
 }
 

-

 div.comment {
 div.comment {

-    /* whitespace doesn't cut it to differentiate multiple comments,*/
-    /* so use a line */
-    border-top-style: solid;
-    border-top-color: $comment-br-color;
-    /* copied from stackoverflow. */
-    border-top-width: 0.716667px;
-
+  // whitespace doesn't cut it to differentiate multiple comments,
+  // so use a line
+  border-top-color: $comment-br-color;
+  border-top-style: solid;
+  border-top-width: 0.716667px; // copied from stackoverflow.

 }
 
 }
 

-#comment-stripe, #comment-stripe code {
-    /* differentiate comments, don't colorize code */
-    background-color: $comment-background-color;
+.comment-stripe,
+.comment-stripe code {
+  // differentiate comments, don't colorize code
+  background-color: $comment-background-color;

 }
 
 }
 

-#comment-section {
-    /* make the top/bottom of comments have more space */
-    padding-top: 30px;
-    padding-bottom: 30px;
-}
+.comment-section {
+  // make the top/bottom of comments have more space
+  padding-bottom: 30px;
+  padding-top: 30px;

 
 

+  textarea {
+    background-color: $content-color; // go with theme, avoid bright white.
+  }

 
 

-#comment-section textarea:focus, #comment-section textarea:active, #comment-section input:hover {
-    /* color textarea when selected, and for submit button,*/
-    /* without 3d effect, we need a different color. */
+  input:hover,
+  textarea:active,
+  textarea:focus {
+    // color textarea when selected, and for submit button,
+    // without 3d effect, we need a different color.

     background: $text-input-color;
     background: $text-input-color;

+  }

 }
 
 }
 

-#comment-section textarea {
-    /* go with theme, avoid bright white. */
-    background-color: $content-color;
-}
-
-textarea, input {
-    /* default is some 3d border. use a flat border instead. */
-    border: 0;
-    /* by default text input hugs the edges too much */
-    padding: 5px;
-    /* add some space between input and submit button */
-    margin-bottom: 10px;
+textarea,
+input {
+  border: 0; // flat is better than default 3d thing
+  margin-bottom: 10px; // add some space between input and submit button
+  padding: 5px; // by default text input hugs the edges too much

 }
 
 }
 

-/* if this is filled out, we can assume it's spam. common tactic. */
+// if this is filled out, we can assume it's spam. common tactic.

 input.misc {
 input.misc {

-    display: none;
+  display: none;

 }
 
 
 textarea {
 }
 
 
 textarea {

-    /* make the comment box be full width */
-    width: 100%;
+  // make the comment box be full width
+  width: 100%;

 }
 
 
 ul {
 }
 
 
 ul {

-    /* i dun like the default bullet points */
-    list-style-type: none;
+  // i dun like the default bullet points
+  list-style-type: none;

 }
 
 }
 

-ul.index {
-    /* for site index lists, bigger font, no indent, more space */
-    font-size: 22px;
-    padding-left: 0;
-    line-height: 2;
+.site-nav-list {
+  // for site index lists, bigger font, no indent, more space
+  font-size: 22px;
+  line-height: 2;
+  padding-left: 0;

 }
 
 }
 

-body{
-    /* default is too scrunched */
-    line-height: 1.5;
-    /* default too small */
-    font-size: 18px;
+body {
+  font-size: 18px; // default too small
+  line-height: 1.5; // default is too scrunched

 }
 
 }
 

+// alternative to a <br>. whatever.
+// https://stackoverflow.com/questions/7363766/how-to-insert-a-line-break-before-an-element-using-css
+.comment-date::before {
+  content: "\A";
+}

 
 

-/* alternative to a <br>. whatever. */
-/* https://stackoverflow.com/questions/7363766/how-to-insert-a-line-break-before-an-element-using-css */
-.comment-date:before { content: '\A'; }

 .comment-date {
 .comment-date {

-    white-space:pre;
-    color: $comment-date-color;
-    font-size: 15px;
+  color: $comment-date-color;
+  font-size: 15px;
+  white-space: pre;

 }
 
 .post-date {
 }
 
 .post-date {

-    font-size: 15px;
-    margin: 5px 0;
+  font-size: 15px;
+  margin: 5px 0;

 }
 }

+

 .post-title {
 .post-title {

-    /* default too wide, got from some random blog */
-    letter-spacing: -1px;
-    /* default is too much below where the date is. */
-    margin: 0;
+  letter-spacing: -1px; // default too wide, found randomly
+  margin: 0; // default is too much below where the date is.

 }
 
 }
 

-/* make the header links less prominent. */
-header a:visited, header a {
-    /* link color in top navigation is better as some less eye */
-    /* catching color. */
-    color: $page-header-link-color;
+// make the header links less prominent.
+// link color in top navigation is better as some less eye
+// catching color.
+header a:visited,
+header a {
+  color: $page-header-link-color;

 }
 
 .post-header {
 }
 
 .post-header {

-    margin-bottom: 30px;
+  margin-bottom: 30px;

 }
 
 
 }
 
 

-h1,h2,h3{
-    line-height: 1.2;
+h1,
+h2,
+h3 {
+  line-height: 1.2;

 }
 }

+

 .main-content-stripe {
 .main-content-stripe {

-    /* i don't like bright white. copy a gitweb color */
-    background-color: $content-color;
-    padding: 30px 0;
+  // i don't like bright white. copy a gitweb color
+  background-color: $content-color;
+  padding: 30px 0;

 }
 }

+

 footer {
 footer {

-    padding: 30px 0;
-}
-footer p {
+  font-size: 15px;
+  padding: 30px 0;
+
+  p {

     margin: 0;
     margin: 0;

+  }

 }
 }

-.page_header,footer,.content,#comment-section {
-    // auto centers it
-    margin-left: auto;
-    margin-right: auto;
-    margin-top: 0;
-    margin-bottom: 0;
-    padding-left: 30px;
-    padding-right: 30px;
-    /* default too wide */
-    max-width: $main-column-max-width;
-}
+
+.comment-section,
+.content,
+.page_header,

 footer {
 footer {

-    font-size: 15px;
+  // auto does the centering magic
+  margin-bottom: 0;
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: 0;
+  max-width: $main-column-max-width; // default too wide
+  padding-left: 30px;
+  padding-right: 30px;

 }
 
 code {
 }
 
 code {

-    background-color: $inline-code-background-color;
-    /* defaults are squished next to the borders of the color change */
-    padding: 1px 5px;
+  background-color: $inline-code-background-color;
+  // defaults are squished next to the borders of the color change
+  padding: 1px 5px;

 }
 
 }
 

-code, pre {
-    /* mono text is wider, so use smaller font to compensate */
-    font-size: 15px;
+code,
+pre {
+  // mono text is wider, so use smaller font to compensate
+  font-size: 15px;

 }
 
 pre {
 }
 
 pre {

-    /* defaults are squished next to the borders of the color change */
-    padding: 6px 8px;
+  // defaults are squished next to the borders of the color change
+  padding: 6px 8px;

 }
 
 
 }
 
 

-/* taken from wikipedia. purple links get a bit old. */
+// taken from wikipedia. purple links get a bit old.

 a {
 a {

-    color: $link-color;
-    text-decoration: none;
+  color: $link-color;
+  text-decoration: none;

 }
 }

+

 a:hover {
 a:hover {

-    text-decoration: underline;
+  text-decoration: underline;

 }
 }

+

 a:visited {
 a:visited {

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

 }
 
 }
 

-

 @import "subscribe-char";
 @import "code-highlight";
 @import "subscribe-char";
 @import "code-highlight";

diff --git a/css/open-sans.scss b/css/open-sans.scss
new file mode 100644 (file)
index 0000000..876df66
--- /dev/null
+++ b/css/open-sans.scss
@@ -0,0 +1,15 @@
+/* nice font seen elsewhere. google -> stackoverflow -> localfont.com */
+/* If I didn't use this font, I'd just go with sans-serif */
+@font-face {
+  font-family: 'Open Sans';
+  font-weight: 400;
+  font-style: normal;
+  src: url('/font/Open-Sans-regular/Open-Sans-regular.eot');
+  src: url('/font/Open-Sans-regular/Open-Sans-regular.eot?#iefix') format('embedded-opentype'),
+  local('Open Sans'),
+  local('Open-Sans-regular'),
+  url('/font/Open-Sans-regular/Open-Sans-regular.woff2') format('woff2'),
+  url('/font/Open-Sans-regular/Open-Sans-regular.woff') format('woff'),
+  url('/font/Open-Sans-regular/Open-Sans-regular.ttf') format('truetype'),
+  url('/font/Open-Sans-regular/Open-Sans-regular.svg#Open Sans') format('svg');
+}

diff --git a/css/subscribe-char.scss b/css/subscribe-char.scss
index 0b464410e652715e446ac6c0ad71e6097dc4b0f7..7db8e6b7299f694aad51f50b1ffa60280e2904e6 100644 (file)
--- a/css/subscribe-char.scss
+++ b/css/subscribe-char.scss
@@ -5,48 +5,48 @@
 /* color, do underline on hover, and line it up with the rest*/
 /* of the text. */
 @font-face {
 /* color, do underline on hover, and line it up with the rest*/
 /* of the text. */
 @font-face {

-    font-family: 'fontello';
-    src: url('/font/fontello.eot?97936362');
-    src: url('/font/fontello.eot?97936362#iefix') format('embedded-opentype'),
-    url('/font/fontello.woff2?97936362') format('woff2'),
-    url('/font/fontello.woff?97936362') format('woff'),
-    url('/font/fontello.ttf?97936362') format('truetype'),
-    url('/font/fontello.svg?97936362#fontello') format('svg');
-    font-weight: normal;
-    font-style: normal;
+  font-family: 'fontello';
+  src: url('/font/fontello.eot?97936362');
+  src: url('/font/fontello.eot?97936362#iefix') format('embedded-opentype'),
+  url('/font/fontello.woff2?97936362') format('woff2'),
+  url('/font/fontello.woff?97936362') format('woff'),
+  url('/font/fontello.ttf?97936362') format('truetype'),
+  url('/font/fontello.svg?97936362#fontello') format('svg');
+  font-weight: normal;
+  font-style: normal;

 }
 [class^="icon-"]:before, [class*=" icon-"]:before {
 }
 [class^="icon-"]:before, [class*=" icon-"]:before {

-    font-family: "fontello";
-    font-style: normal;
-    font-weight: normal;
-    speak: none;
+  font-family: "fontello";
+  font-style: normal;
+  font-weight: normal;
+  speak: none;

 
 

-    display: inline-block;
-    text-decoration: inherit;
-    width: 1em;
-    margin-right: .2em;
-    text-align: center;
-    /* opacity: .8; */
+  display: inline-block;
+  text-decoration: inherit;
+  width: 1em;
+  margin-right: .2em;
+  text-align: center;
+  /* opacity: .8; */

 
 

-    /* For safety - reset parent styles, that can break glyph codes*/
-    font-variant: normal;
-    text-transform: none;
+  /* For safety - reset parent styles, that can break glyph codes*/
+  font-variant: normal;
+  text-transform: none;

 
 

-    /* fix buttons height, for twitter bootstrap */
-    line-height: 1em;
+  /* fix buttons height, for twitter bootstrap */
+  line-height: 1em;

 
 

-    /* Animation center compensation - margins should be symmetric */
-    /* remove if not needed */
-    margin-left: .2em;
+  /* Animation center compensation - margins should be symmetric */
+  /* remove if not needed */
+  margin-left: .2em;

 
 

-    /* you can be more comfortable with increased icons size */
-    /* font-size: 120%; */
+  /* you can be more comfortable with increased icons size */
+  /* font-size: 120%; */

 
 

-    /* Font smoothing. That was taken from TWBS */
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
+  /* Font smoothing. That was taken from TWBS */
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;

 
 

-    /* Uncomment for 3D effect */
-    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
+  /* Uncomment for 3D effect */
+  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */

 }
 .icon-rss:before { content: '\f09e'; } /* '' */
 }
 .icon-rss:before { content: '\f09e'; } /* '' */

diff --git a/index.html b/index.html
index 5585e877d6ac03576657f9954ef686c89f708662..4ced8e451150bbe55e73bb9dd4f1b75195c48ec8 100644 (file)
--- a/index.html
+++ b/index.html
@@ -1,4 +1,4 @@
-<ul class="index">
+<ul class="site-nav-list">

   <li><a href="/blog.html">blog</a></li>
   <li><a href="git">git</a></li>
   <li><a href="https://ofswiki.org">ofswiki.org</a></li>
   <li><a href="/blog.html">blog</a></li>
   <li><a href="git">git</a></li>
   <li><a href="https://ofswiki.org">ofswiki.org</a></li>