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:
parent
ff4d8c8c1e
commit
b4397510e7
20 changed files with 221 additions and 60 deletions
90
css/style-dark.css
Normal file
90
css/style-dark.css
Normal 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
90
css/style-light.css
Normal 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;
|
||||
}
|
|
@ -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;
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue