Add dark scheme for headings
[wiki.git] / sys / geekigeeki.css
index d5c89754feb02841772d0a5dec6f4ec42652310e..b8410af7ecd632ec2d2481f9f212c1b66732ccfa 100644 (file)
@@ -1,7 +1,4 @@
-/*
- * Author: Gerardo Poggiali <g.poggiali@develer.com>
- * Author: Bernie Innocenti <bernie@codewiz.org>
- */
+/* Author: Bernie Innocenti <bernie@codewiz.org> */
 
 body {
        font-family: sans-serif;
@@ -12,95 +9,77 @@ body {
        margin-right: 0px;
 }
 
+html {
+       cursor: url('/wiki/sys/pointer.cur'), auto;
+}
+
 a { color: #1010FF; }
+a:link { text-decoration: none; }
+a:hover { text-decoration: underline; }
 a:visited { color: #501080; }
 a.nonexistent { color: #D04040; }
-a.navlink { color: #000088; font-size: smaller; font-weight: bold}
+a.navlink, a.login { font-size: smaller; font-weight: bold; text-decoration: none; }
+a.navlink:hover, a.login:hover { text-decoration: underline; }
+a.navlink { color: #000088; }
+a.login { color: #bb0000; }
 a.external { font-style: italic; }
 a.heading { text-decoration: none; color: #aaaaaa; font-size: smaller; }
 
 h1 {
        font-size: x-large;
        font-weight: bold;
+       clear: both;
        color: #3377FF;
        border: #5599EE;
-       background-color: #C2E2FF;
+       background-color: #D0F0FF;
        clear: both;
 
        margin-bottom: 0.2em;
        margin-top: 2em;
        padding-right: 10px;
        padding-left: 10px;
-
-       border-top-width: 1px;
-       border-bottom-width: 1px;
-       border-right-width: 0px;
-       border-left-width: 0px;
-       border-style: solid;
 }
 
 h2 {
        font-size: large;
        font-weight: bold;
-       color: #22AA33;
-       border: #22AA33;
-       background-color: #E8F8F0;
        clear: both;
+       color: #22AA33;
 
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 0.1em;
-       margin-top: 2em;
+       margin-top: 1.5em;
        padding-right: 10px;
        padding-left: 10px;
-
-       border-top-width: 1px;
-       border-bottom-width: 1px;
-       border-left-width: 0px;
-       border-right-width: 0px;
-       border-style: solid;
 }
 
 h3 {
        font-size: large;
        font-weight: bold;
-       color: #DD2255;
-       border: #BB5599;
+       color: #113366;
 
        margin-left: 10px;
        margin-right: 10px;
        padding-right: 5px;
        padding-left: 5px;
-
-       border-top-width: 0px;
-       border-bottom-width: 1px;
-       border-right-width: 0px;
-       border-left-width: 0px;
-       border-style: solid;
 }
 
 h4 {
        font-size: medium;
        font-weight: bold;
-       color: #2222AA;
+       color: #222288;
 
        margin-left: 10px;
        margin-right: 10px;
        padding-right: 5px;
        padding-left: 5px;
-
-       border: #333399;
-       border-top-width: 0px;
-       border-bottom-width: 1px;
-       border-right-width: 0px;
-       border-left-width: 0px;
-       border-style: solid;
 }
 
 h5 {
        font-size: medium;
-       font-weight: bold;
-       color: #222288;
+       font-weight: normal;
+       color: #4444AA;
 
        margin-left: 10px;
        margin-right: 10px;
@@ -144,14 +123,14 @@ strong.error {
 }
 
 div {
-       margin-left: 10px;
+       margin-left:  10px;
        margin-right: 10px;
-       text-align: justify;
+       /*text-align: justify;*/
 }
 
 div.wiki {
-       margin-left: 0;
-       margin-right: 0;
+       margin-left:  0px;
+       margin-right: 0px;
 }
 
 div.preview {
@@ -163,13 +142,11 @@ div.index {
 }
 
 div.nav {
-       /*border-color: #88aacc;
-       background-color: #aaccee;*/
        border-color: #888888;
        background-color: #cccccc;
        border-style: solid;
        border-top-width: 0px;
-       border-bottom-width: 2px;
+       border-bottom-width: 1px;
        border-left-width: 0px;
        border-right-width: 0px;
        padding-top:    5px;
@@ -182,13 +159,22 @@ div.nav {
        margin-right:   0px;
 }
 
-.nav hr {
-       display: none;
+.nav li {
+       display: inline;
 }
 
-.nav .login {
-       font-size: small;
-       color: red;
+.nav ul
+{
+       list-style-type: none;
+       margin: 0;
+       padding: 0;
+       padding-top: 6px;
+       padding-bottom: 6px;
+}
+
+
+.nav hr {
+       display: none;
 }
 
 #footer div {
@@ -236,7 +222,7 @@ div.nav {
 p.dialog {
        border-color: black;
        background-color: white;
-       padding-left: 5px;      
+       padding-left: 5px;
        margin-left: 10px;
        margin-right: 10px;
        border-style: solid;
@@ -247,12 +233,12 @@ p.dialog {
 }
 
 p {
-       margin-left: 10px;
-       margin-right: 10px;
-       margin-bottom: 10px;
-       text-align: justify;
+       margin-left: 1em;
+       margin-right: 1em;
+       margin-bottom: 1em;
+       /*text-align: justify;*/
 }
-       
+
 table {
        /*width: 100%;*/
        border: 2px solid #ccc;
@@ -264,7 +250,7 @@ table {
 }
 
 table tbody thead {
-       background: #f7f7f0
+       background: #f7f7f0;
 }
 
 /* FIXME: should be thead */
@@ -337,13 +323,14 @@ pre.notice {
        margin: 0px;
 }
 
-#editor {
+.editor input[type='text'], .editor textarea {
        font-family: monospace;
-       width: 100%;
        color: black;
        background-color: white;
        border: 1px solid #8cacbb;
 }
+.editor textarea.editor { width: 100%; }
+.editor input.changelog { width: 50%; }
 
 /* thumbnails */
 
@@ -387,14 +374,84 @@ div .innerthumb {
 
 /* Styles for search word highlighting */
 @media screen {
- .searchword0 { background: #ff9 }
- .searchword1 { background: #cfc }
- .searchword2 { background: #cff }
- .searchword3 { background: #ccf }
- .searchword4 { background: #fcf }
 .searchword0 { background: #ff9 }
 .searchword1 { background: #cfc }
 .searchword2 { background: #cff }
 .searchword3 { background: #ccf }
 .searchword4 { background: #fcf }
 }
 
 @media print {
- #footer { display: none }
- .nav { display: none }
+       body {
+               background: white;
+               font-size: 12pt;
+       }
+       h1 { font-size: 14pt; }
+       h2 { font-size: 13pt; }
+       h3 { font-size: 12pt; border: none; }
+       h4 { font-size: 12pt; border: none; }
+       h5 { font-size: 12pt; border: none; }
+       a { text-color: #225; text-decoration: underline; }
+       .heading:link, .heading:visited { display: none; }
+       #footer { display: none; }
+       .nav { display: none; }
+       .noprint { display: none; }
+       div.wiki { font-size: smaller; }
+}
+
+@media (prefers-color-scheme: dark) {
+  body {
+    background-color: #181818;
+    color: #ffffff;
+  }
+
+  a { color: #9bd1ff; }
+  a:visited { color: #9b669b; }
+  a.nonexistent { color: #f0d0d0; }
+  a.navlink { color: #d1d1ff; }
+  a.login { color: #bb6666; }
+
+  div.nav {
+    border-color: #606060;
+    background-color: #303030;
+  }
+
+  body {
+    background-color: #181818;
+    color: #FFFFFF;
+  }
+
+  a { color: #9Bd1ff; }
+  a:visited { color: #778899; }
+  a.nonexistent { color: #f0d0d0; }
+  a.navlink { color: #d1d1ff; }
+  a.login { color: #bb6666; }
+  a.heading { text-decoration: none; color: #666666; font-size: smaller; }
+
+  h1 {
+    color: #88bbff;
+    border: #77aadd;
+    background-color: #2a2a2a;
+  }
+  h2 { color: #44dd66; }
+  h3 { color: #88aacc; }
+  h4 { color: #8899bb; }
+  h5 { color: #6666cc; }
+
+  div.nav {
+    border-color: #606060;
+    background-color: #303030;
+  }
+
+  table { border: 2px solid #444; }
+  table tbody thead { background: #2f2f2f; }
+  table tbody th {
+          border: 1px solid #555;
+          border-bottom-color: #777;
+  }
+  table tbody td { border: 1px dotted #555; }
+  table tbody tr { border-top: 1px solid #555; }
+  table tbody tr.even { background-color: #303030; }
+  table tbody tr.odd { background-color: #393939; }
+  table tbody tr:hover { background: #444 !important; }
 }