1
0
Fork 0
mirror of https://github.com/wallabag/wallabag.git synced 2025-08-01 17:38:38 +00:00

Add a dark theme and is very simple switch

This commit is contained in:
silvus 2013-04-19 22:26:39 +02:00
parent ff4d8c8c1e
commit b4397510e7
20 changed files with 221 additions and 60 deletions

90
css/style-dark.css Normal file
View file

@ -0,0 +1,90 @@
/*** GENERAL ***/
body {
color: #fff;
background-color: #0d0d0d;
}
a, a:hover, a:visited {
color: #fff;
}
#main ul#links li a.current {
background-color: #000;
color: #fff;
}
#links a:hover, .backhome a:hover{
background-color: #fff;
color: #000;
}
input[type=submit].delete {
background : url('../img/dark/remove.png') no-repeat center center;
color : transparent;
}
#main .entrie {
color: #fff;
background-color: #000;
border: 1px solid #fff;
}
#main .entrie h2 a:hover {
color: #29B1E3;
}
a.fav span {
background: url('../img/dark/star-on.png') no-repeat;
}
a.fav span:hover {
background: url('../img/dark/star-off.png') no-repeat;
}
a.fav-off span {
background: url('../img/dark/star-off.png') no-repeat;
}
a.fav-off span:hover {
background: url('../img/dark/star-on.png') no-repeat;
}
a.archive span {
background: url('../img/dark/checkmark-on.png') no-repeat;
}
a.archive span:hover {
background: url('../img/dark/checkmark-off.png') no-repeat;
}
a.archive-off span {
background: url('../img/dark/checkmark-off.png') no-repeat;
}
a.archive-off span:hover {
background: url('../img/dark/checkmark-on.png') no-repeat;
}
/*** ***/
/*** ARTICLE PAGE ***/
body.article {
color: #fff;
background-color: #0d0d0d;
}
#article header {
border-bottom: 1px solid #222222;
}
#article article {
border-bottom: 1px solid #222222;
}
.vieworiginal a {
color: #888888;
}
.entrie {
background-color: #fff;
}

90
css/style-light.css Normal file
View file

@ -0,0 +1,90 @@
/*** GENERAL ***/
body {
color: #222222;
background-color: #F1F1F1;
}
a, a:hover, a:visited {
color: #000;
}
#main ul#links li a.current {
background-color: #000;
color: #fff;
}
#links a:hover, .backhome a:hover{
background-color: #040707;
color: #F1F1F1;
}
input[type=submit].delete {
background : url('../img/light/remove.png') no-repeat center center;
color : transparent;
}
#main .entrie {
color: #2e2e2e;
background-color: #ffffff;
border: 1px solid #000;
}
#main .entrie h2 a:hover {
color: #F5BE00;
}
a.fav span {
background: url('../img/light/star-on.png') no-repeat;
}
a.fav span:hover {
background: url('../img/light/star-off.png') no-repeat;
}
a.fav-off span {
background: url('../img/light/star-off.png') no-repeat;
}
a.fav-off span:hover {
background: url('../img/light/star-on.png') no-repeat;
}
a.archive span {
background: url('../img/light/checkmark-on.png') no-repeat;
}
a.archive span:hover {
background: url('../img/light/checkmark-off.png') no-repeat;
}
a.archive-off span {
background: url('../img/light/checkmark-off.png') no-repeat;
}
a.archive-off span:hover {
background: url('../img/light/checkmark-on.png') no-repeat;
}
/*** ***/
/*** ARTICLE PAGE ***/
body.article {
color: #222222;
background-color: #F1F1F1;
}
#article header {
border-bottom: 1px solid #222222;
}
#article article {
border-bottom: 1px solid #222222;
}
.vieworiginal a {
color: #888888;
}
.entrie {
background-color: #fff;
}

View file

@ -1,16 +1,10 @@
/*** GENERAL ***/
body {
color: #222222;
font: 20px/1.3em Palatino,Georgia,serif;
background-color: #F1F1F1;
margin: 10px;
}
a, a:hover, a:visited {
color: #000;
}
header {
text-align: center;
}
@ -28,8 +22,6 @@ header {
#main ul#links li a.current {
-webkit-border-radius: 2px;
border-radius: 2px;
background-color: #040707;
color: #F1F1F1;
}
#main ul#sort {
@ -58,8 +50,6 @@ header {
#links a:hover, .backhome a:hover{
-webkit-border-radius: 2px;
border-radius: 2px;
background-color: #040707;
color: #F1F1F1;
}
footer {
@ -80,11 +70,9 @@ ul#login li {
}
input[type=submit].delete {
background : url('../img/remove.png') no-repeat center center;
width : 16px;
height :16px;
border : none;
color : transparent;
cursor: pointer;
font-size : 0;
}
@ -94,8 +82,6 @@ input[type=submit].delete {
}
#main .entrie {
color: rgb(46, 46, 46);
background-color: #ffffff;
padding: 15px;
min-height: 8em;
border: 1px solid;
@ -105,10 +91,6 @@ input[type=submit].delete {
text-decoration: none;
}
#main .entrie h2 a:hover {
color: #F5BE00;
}
.tools {
text-align: right;
}
@ -145,62 +127,23 @@ input[type=submit].delete {
height: 16px;
}
a.fav span {
background: url('../img/star-on.png') no-repeat;
}
a.fav span:hover {
background: url('../img/star-off.png') no-repeat;
}
a.fav-off span {
background: url('../img/star-off.png') no-repeat;
}
a.fav-off span:hover {
background: url('../img/star-on.png') no-repeat;
}
a.archive span {
background: url('../img/checkmark-on.png') no-repeat;
}
a.archive span:hover {
background: url('../img/checkmark-off.png') no-repeat;
}
a.archive-off span {
background: url('../img/checkmark-off.png') no-repeat;
}
a.archive-off span:hover {
background: url('../img/checkmark-on.png') no-repeat;
}
/*** ***/
/*** ARTICLE PAGE ***/
body.article {
color: #222222;
font: 20px/1.3em Palatino,Georgia,serif;
background-color: #F1F1F1;
}
#article header {
text-align: left;
border-bottom: 1px solid #222222;
}
#article header a {
text-decoration: none;
}
#article article {
border-bottom: 1px solid #222222;
}
.vieworiginal a {
color: #888888;
text-decoration: none;
}