Move css to static/css.

3 files changed, 428 insertions, 0 deletions

diff --git a/static/css/DroidSerif-webfont.woff b/static/css/DroidSerif-webfont.woff
new file mode 100644
index 0000000..3d2bc95
--- /dev/null
+++ b/static/css/DroidSerif-webfont.woff
diff --git a/static/css/reset.css b/static/css/reset.css
new file mode 100644
index 0000000..bf12609
--- /dev/null
+++ b/static/css/reset.css
@@ -0,0 +1,62 @@
+/* http://meyerweb.com/eric/tools/css/reset/
+   v2.0b1 | 201101
+   NOTE: WORK IN PROGRESS
+   USE WITH CAUTION AND TEST WITH ABANDON */
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section, summary,
+time, mark, audio, video {
+        margin: 0;
+        padding: 0;
+        border: 0;
+        outline: 0;
+        font-size: 100%;
+        font: inherit;
+        vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+        display: block;
+}
+body {
+        line-height: 1;
+}
+ol, ul {
+        list-style: none;
+}
+blockquote, q {
+        quotes: none;
+}
+blockquote:before, blockquote:after,
+q:before, q:after {
+        content: '';
+        content: none;
+}
+
+/* remember to define visible focus styles!
+:focus {
+        outline: ?????;
+} */
+
+/* remember to highlight inserts somehow! */
+ins {
+        text-decoration: none;
+}
+del {
+        text-decoration: line-through;
+}
+
+table {
+        border-collapse: collapse;
+        border-spacing: 0;
+}
diff --git a/static/css/screen.css b/static/css/screen.css
new file mode 100644
index 0000000..de267bc
--- /dev/null
+++ b/static/css/screen.css
@@ -0,0 +1,366 @@
+@font-face {
+    font-family: 'droid_serifregular';
+    src: url('DroidSerif-webfont.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+}
+
+html, body {
+    font-family: "droid_serifregular", serif;
+    text-rendering: optimizelegibility;
+    -moz-font-feature-settings: "liga";
+    line-height: 140%;
+    color: #333;
+    background: #fcfbf3; }
+
+@media all {html {font-size: 24px;}}
+@media all and (max-width:1000px){html {font-size: 24px;}}
+@media all and (max-width:960px){html {font-size: 23px;}}
+@media all and (max-width:920px){html {font-size: 22px;}}
+@media all and (max-width:880px){html {font-size: 21px;}}
+@media all and (max-width:840px){html {font-size: 20px;}}
+@media all and (max-width:800px){html {font-size: 19px;}}
+@media all and (max-width:760px){html {font-size: 18px;}}
+
+body {
+  margin: 0 auto; }
+  body .elephly {
+    background: #bdc0ac; }
+
+#index {
+    padding: 1rem;
+    margin-left: 2rem; }
+#index img {
+    border: 3px solid white;
+    border-radius: 50%;
+    box-shadow: 1px 2px 2px 0 #888;
+    float: left;
+    height: 4rem; }
+
+@media screen and (max-width: 600px) {
+  #index {
+      text-align: center; }
+  #index img {
+      float: none; }}
+
+#page ul {
+  list-style: square outside;
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem; }
+
+div.time {
+  color: #9ba0a7;
+  margin-top: -2.8rem;
+  margin-bottom: 2.5rem;
+  font-size: 0.9rem;
+  font-weight: normal; }
+
+div.figure {
+  text-align: center;
+  background: #fff;
+  box-sizing: border-box;
+  box-shadow: 0 0 0.4em 0 #888;
+  margin: 1rem;
+  padding: 1rem; }
+  @media screen and (min-width: 600px) {
+    div.figure {
+      float: right; }}
+  @media screen and (max-width: 600px) {
+    div.figure {
+      float: none;
+      clear: both; }}
+  div#page div.figure p.caption {
+    width: auto;
+    text-align: center;
+    font-size: 0.8rem; }
+
+iframe {
+    margin-top: 1rem;
+    margin-bottom: 1rem; }
+
+h1 {
+  color: #000;
+  clear: both;
+  line-height: 125%;
+  margin-top: 1.3rem;
+  margin-bottom: .3rem;
+  display: block;
+  font-family: "droid sans", sans-serif;
+  font-size: 1.2rem;
+  font-weight: 800; }
+
+h1:first-child {
+    font-size: 1.8rem;
+    margin-bottom: 3rem;
+    margin-top: 3rem; }
+
+@media screen and (max-width: 600px) {
+    h1:first-child {
+        margin-top: 1rem; }}
+
+* + h2, * + h3 {
+  margin-top: 1.5rem; }
+
+h2, h3 {
+  color: #333;
+  margin-bottom: 0.5em;
+  clear: both;
+  letter-spacing: -0.04em;
+  font-size: 1.2rem;
+  font-weight: 700;
+  font-family: "Droid Sans", Arial, sans-serif; }
+
+h3 {
+  font-size: 1.2rem; }
+
+a {
+  color: #389;
+  text-decoration: none; }
+  a:visited {
+    color: #167; }
+  a:hover {
+      color: #000;
+    background: #eeede5; }
+
+strong {
+  font-weight: bold; }
+
+div#page {
+    overflow: visible;
+    max-width: 32rem;
+    padding-left: 2rem;
+    margin-right: 1rem;
+    margin-bottom: 100px; }
+  @media only screen and (min-width: 600px) {
+    div#page {
+        margin-left: 10rem;
+        margin-right: 4rem; }}
+  div#page ul {
+    max-width: 32rem; }
+  div#page p {
+    margin-bottom: 0;
+    text-align: justify;
+    max-width: 32rem; }
+    div#page p img, div#page p video {
+      display: inline;
+      float: right;
+      margin-left: 0.8rem;
+      -moz-border-radius: 15px;
+      border-radius: 15px; }
+  div#page p.back {
+    margin-top: 1.5rem;
+    width: 50%; }
+  div#page blockquote {
+      margin-left: 3rem;
+      margin-right: 3rem;
+    margin-top: 1rem;
+    margin-bottom: 1rem;
+    font-size: 0.9rem;
+    font-style: italic; }
+  div#page img.full {
+      width: 100%;
+    margin-top: 0.5rem;
+    margin-bottom: 1rem;
+    margin-left: 0;
+    margin-right: 0;
+    position: static;
+    float: none;
+    clear: both;
+    padding: 0;
+    display: block;
+    -moz-border-radius: 15px;
+    border-radius: 15px; }
+  div#page img.stretch {
+    width: 100%; }
+  div#page div.fineprint {
+    font-size: .7rem;
+    text-indent: 0;
+    line-height: 1rem;
+    margin-top: 1rem;
+    padding-top: 1rem;
+    border-top: 1px dotted #aaaaaa;
+    width: 100%;
+    color: #666;
+    clear: both;
+    display: block; }
+    div#page div.fineprint div.license {
+      display: block;
+      clear: both; }
+    div#page div.fineprint img {
+      display: block;
+      float: left;
+      margin-right: .5rem; }
+
+p + p, div.figure + p {
+  text-indent: .5rem;
+  margin-top: 0.4rem; }
+
+warning {
+  clear: both;
+  margin: 1rem;
+  padding: 1rem;
+  background: #ffffaa;
+  border: 2px dashed #dddd88;
+  border-radius: 3px;
+  display: block; }
+
+pre {
+  margin: 1rem;
+  padding: 1rem;
+  display: inline-block;
+  border-radius: 3px;
+  background: #444; }
+
+pre code {
+  color: #aaff00;
+  background: transparent; }
+
+img.flickr {
+  position: relative;
+  display: block;
+  margin: 0 auto;
+  width: 100%; }
+
+img.undecorated {
+  margin: 0;
+  padding: 0; }
+
+img.headline {
+  margin: 0;
+  margin-right: 1rem;
+  padding: 0;
+  vertical-align: text-bottom; }
+
+div#columns {
+  overflow: hidden;
+  margin-bottom: 1rem; }
+  div#columns ul {
+    list-style: none outside none;
+    margin: 0;
+    float: left;
+    width: 50%; }
+
+span.code, code {
+  font-family: "Envy Code R", "Inconsolata", "Consolas", "Courier New", monospace;
+  color: #111;
+  background: #dedede; }
+
+span.code {
+  font-size: 0.85rem;
+  border-bottom: #888;
+  padding: .15rem; }
+
+br {
+  clear: left; }
+
+em {
+  font-style: italic; }
+
+.item + .item {
+  margin-top: 1rem; }
+
+ul.list {
+  list-style-type: square; }
+  ul.list li {
+    margin-bottom: .4rem; }
+    ul.list li .description {
+      font-size: .8rem; }
+
+div.download {
+  float: left;
+  width: 35%;
+  margin-right: 10%;
+  margin-bottom: 1.5rem; }
+  div.download a {
+    display: block;
+    width: 100%;
+    text-align: center;
+    padding: 0.5em 0;
+    font-family: sans-serif;
+    background: #fff;
+    color: #888;
+    border-radius: 2rem;
+    -moz-border-radius: 2rem; }
+  div.download a:hover {
+    background: #888;
+    color: #fff; }
+  div.download table {
+    font-size: .8rem;
+    line-height: 1rem;
+    border-collapse: collapse;
+    margin-bottom: 1rem;
+    clear: both; }
+    div.download table th {
+      color: #999;
+      font-weight: 400;
+      padding-right: 1rem;
+      border-right: 1px solid #ffaa00;
+      text-align: right; }
+    div.download table td {
+      color: #777;
+      margin: 0;
+      padding: 0;
+      padding-left: 1rem;
+      text-align: left; }
+
+table {
+    font-size: 0.9rem;
+    margin-top: 0.5rem;
+    margin-bottom: 0.5rem; }
+  table thead {
+    border-bottom: 2px solid #ffaa00; }
+    table thead tr.header {
+      font-weight: bold; }
+  table tr.odd {
+    background-color: #fafafa; }
+  table th + th, table td + td {
+    padding-left: 1rem; }
+
+h1.year {
+  border-bottom: 4px solid #eeede5;
+  width: 50%; }
+
+h2.month {
+  font-weight: normal; }
+
+ul.archive {
+  margin-left: 1rem; }
+
+#page ul.tree {
+  margin: 1rem;
+  font-family: monospace;
+  display: block;
+  list-style: none; }
+
+  #page ul.tree li { line-height: 1.3rem; }
+  #page ul.tree .NORM  { color: black;  background-color: transparent;}
+  #page ul.tree .FIFO  { color: purple; background-color: transparent;}
+  #page ul.tree .CHAR  { color: yellow; background-color: transparent;}
+  #page ul.tree .DIR   { color: blue;   background-color: transparent;}
+  #page ul.tree .BLOCK { color: yellow; background-color: transparent;}
+  #page ul.tree .LINK  { color: aqua;   background-color: transparent;}
+  #page ul.tree .SOCK  { color: fuchsia;background-color: transparent;}
+  #page ul.tree .EXEC  { color: green;  background-color: transparent;}
+
+
+/* DISQUS */
+h1.disqus {
+  margin-top: 1rem;
+  float: left; }
+
+div#disqus_thread {
+  border-top: 5px solid #999999;
+  padding: 0 1em 1rem;
+  background: #eeede5;
+  margin-top: 1rem;
+  -moz-border-radius: 0 0 15px 15px;
+  border-radius: 0 0 15px 15px;
+  font-size: 14px; }
+  div#disqus_thread ul {
+    width: auto; }
+  div#disqus_thread #dsq-global-toolbar {
+    margin: 0.5em 0; }
+  div#disqus_thread #dsq-reply {
+    margin-top: 0.5rem; }
+  div#disqus_thread h3 {
+    clear: none; }