Added a pleasant gradient.
[philo.git] / static / css / screen.css
index d3a0107..1877405 100644 (file)
@@ -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,22 @@ body {
 html > body {
   font-size: 16px; }
 
 html > body {
   font-size: 16px; }
 
+::selection {
+  background: #ff6ae6;
+  text-shadow: none !important;
+  color: #FFF !important; }
+
 body {
   background: #e0e5ef;
 body {
   background: #e0e5ef;
+  background: -webkit-gradient(linear, 50% 0%, 50% 250, color-stop(0%, #b4bdcf), color-stop(100%, #e0e5ef));
+  background: -webkit-linear-gradient(top, #b4bdcf 0%, #e0e5ef 250px);
+  background: -moz-linear-gradient(top, #b4bdcf 0%, #e0e5ef 250px);
+  background: -o-linear-gradient(top, #b4bdcf 0%, #e0e5ef 250px);
+  background: linear-gradient(top, #b4bdcf 0%, #e0e5ef 250px);
   color: #333333;
   text-shadow: 0 1px 0 #FFF;
   font-family: Helvetica, Arial, serif; }
 
   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 +101,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,7 +123,7 @@ 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;
   background: #bec9de;
   padding: 3px;
   margin: -4px 0;
@@ -132,6 +141,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;
@@ -258,3 +288,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; }