Style and textual updates. Added a footer. Added two more in-development contrib...

[philo.git] / static / css / screen.css

diff --git a/static/css/screen.css b/static/css/screen.css
index 9b61ed9..a1fc8a5 100644 (file)
--- a/static/css/screen.css
+++ b/static/css/screen.css
@@ -1,7 +1,7 @@
 @import "http://fonts.googleapis.com/css?family=Expletus+Sans";
 html, body, div, span, applet, object, iframe,
 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 @import "http://fonts.googleapis.com/css?family=Expletus+Sans";
 html, body, div, span, applet, object, iframe,
 h1, h2, h3, h4, h5, h6, p, blockquote, pre,

-a, abbr, acronym, address, big, cite, code,
+a, abbr, acronym, address, big, cite, code, #content .codeblock,

 del, dfn, em, img, ins, kbd, q, s, samp,
 small, strike, strong, sub, sup, tt, var,
 b, u, i, center,
 del, dfn, em, img, ins, kbd, q, s, samp,
 small, strike, strong, sub, sup, tt, var,
 b, u, i, center,


@@ -67,27 +67,17 @@ body {
 html > body {
   font-size: 16px; }
 
 html > body {
   font-size: 16px; }
 

+::selection {
+  background: #ff6ae6;
+  text-shadow: none !important;
+  color: #FFF !important; }
+

 body {
   background: #e0e5ef;
   color: #333333;
   text-shadow: 0 1px 0 #FFF;
   font-family: Helvetica, Arial, serif; }
 
 body {
   background: #e0e5ef;
   color: #333333;
   text-shadow: 0 1px 0 #FFF;
   font-family: Helvetica, Arial, serif; }
 

-a {
-  color: black;
-  text-decoration: none;
-  background: #aebbd5;
-  padding: 3px;
-  -moz-border-radius: 3px;
-  -webkit-border-radius: 3px;
-  -o-border-radius: 3px;
-  -ms-border-radius: 3px;
-  -khtml-border-radius: 3px;
-  border-radius: 3px; }
-  a:hover {
-    background: #95a1bb;
-    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.65); }
-

 #container {
   width: 750px;
   margin: 20px auto;
 #container {
   width: 750px;
   margin: 20px auto;


@@ -106,6 +96,20 @@ a {
   box-shadow: 0 1px 0 white;
   font-family: "Expletus Sans", Helvetica, Arial, serif; }
 
   box-shadow: 0 1px 0 white;
   font-family: "Expletus Sans", Helvetica, Arial, serif; }
 

+#content a {
+  color: black;
+  text-decoration: none;
+  background: #aebbd5;
+  padding: 3px;
+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
+  -o-border-radius: 3px;
+  -ms-border-radius: 3px;
+  -khtml-border-radius: 3px;
+  border-radius: 3px; }
+  #content a:hover {
+    background: #95a1bb;
+    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.65); }

 #content p, #content ul, #content ol, #content header {
   margin-bottom: 1.563em; }
 #content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {
 #content p, #content ul, #content ol, #content header {
   margin-bottom: 1.563em; }
 #content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {


@@ -114,11 +118,16 @@ a {
 #content h2 {
   font-size: 1.25em;
   line-height: 1.25em; }
 #content h2 {
   font-size: 1.25em;
   line-height: 1.25em; }

-#content code {
+#content code, #content .codeblock {

   background: #bec9de;
   padding: 3px;
   margin: -4px 0;
   border: 1px solid #aebbd5;
   background: #bec9de;
   padding: 3px;
   margin: -4px 0;
   border: 1px solid #aebbd5;

+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
+  -o-border-radius: 3px;
+  -ms-border-radius: 3px;
+  -khtml-border-radius: 3px;

   border-radius: 3px;
   -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15) inset, 0 1px 0 0 white;
   -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15) inset, 0 1px 0 0 white;
   border-radius: 3px;
   -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15) inset, 0 1px 0 0 white;
   -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15) inset, 0 1px 0 0 white;


@@ -127,6 +136,27 @@ a {
   font-family: Menlo, monospace;
   font-size: 0.813em;
   line-height: 1.923em; }
   font-family: Menlo, monospace;
   font-size: 0.813em;
   line-height: 1.923em; }

+#content .codeblock {
+  padding: 10px;
+  display: block; }
+  #content .codeblock code, #content .codeblock .codeblock {
+    margin: 0;
+    padding: 0;
+    -moz-box-shadow: none;
+    -webkit-box-shadow: none;
+    -o-box-shadow: none;
+    box-shadow: none;
+    -moz-border-radius: 0;
+    -webkit-border-radius: 0;
+    -o-border-radius: 0;
+    -ms-border-radius: 0;
+    -khtml-border-radius: 0;
+    border-radius: 0;
+    border: none;
+    display: block; }
+  #content .codeblock.shell code::before, #content .codeblock.shell .codeblock::before {
+    content: "$ ";
+    color: #4d4d4d; }

 
 .three-up {
   background: #333333;
 
 .three-up {
   background: #333333;


@@ -253,3 +283,20 @@ a {
     font-size: 0.813em;
     line-height: 1.923em;
     float: right; }
     font-size: 0.813em;
     line-height: 1.923em;
     float: right; }

+
+footer {
+  margin-top: 25px;
+  padding-top: 20px;
+  border-top: 5px solid #333333;
+  -moz-box-shadow: 0 1px 0 0 white inset;
+  -webkit-box-shadow: 0 1px 0 0 white inset;
+  -o-box-shadow: 0 1px 0 0 white inset;
+  box-shadow: 0 1px 0 0 white inset;
+  font-size: 0.813em;
+  line-height: 1.923em;
+  color: #666666; }
+  footer a {
+    text-decoration: none;
+    color: #5974aa; }
+    footer a:hover {
+      color: #131924; }