Last active
November 5, 2021 12:46
-
-
Save Calinou/c8430bdf0159b0df6ad9a31cea045999 to your computer and use it in GitHub Desktop.
Dark theme for Kanboard (WIP)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* ==UserStyle== | |
@name Kanboard Dark | |
@namespace github.com/openstyles/stylus | |
@version 0.0.1 | |
@license MIT | |
@description Dark theme for Kanboard | |
@author Calinou | |
==/UserStyle== */ | |
:root { | |
--light-color-1: #eaeaea; | |
--light-color-2: #fefefe; | |
--dark-color-1: #303030; | |
--dark-color-2: #454545; | |
} | |
html { | |
background-color: var(--dark-color-1); | |
} | |
body { | |
color: var(--light-color-1); | |
} | |
h1, | |
h2, | |
h3, | |
.panel, | |
a .fa, | |
.sidebar > ul li.active a, | |
.table-list-row .table-list-title a, | |
.dropdown-menu-link-text, | |
.dropdown-menu-link-icon { | |
color: var(--light-color-1); | |
} | |
header { | |
background-color: #505050; | |
border-bottom: 1px solid #505050; | |
} | |
a { | |
color: #49f; | |
} | |
input { | |
background-color: var(--dark-color-2); | |
} | |
ul.dropdown-submenu-open { | |
background-color: var(--dark-color-2); | |
} | |
.table-list-row:nth-child(odd) { | |
background-color: var(--dark-color-2); | |
} | |
.panel { | |
background-color: var(--dark-color-2); | |
border: none; | |
} | |
table, | |
table td, | |
.table-list-header, | |
.table-list-row, | |
.table-list-row.table-border-left { | |
border-color: transparent; | |
} | |
.table-list-header { | |
background-color: var(--dark-color-2); | |
} | |
span.task-icon-age-total, | |
span.task-icon-age-column { | |
background-color: var(--dark-color-2); | |
border: none; | |
} | |
.sidebar > ul a { | |
color: var(--light-color-1); | |
font-weight: 400; | |
} | |
.sidebar > ul li a:focus, | |
.sidebar > ul li a:hover, | |
.sidebar > ul li.active a:focus, | |
.sidebar > ul li.active a:hover { | |
color: var(--light-color-2); | |
} | |
.views li { | |
background-color: var(--dark-color-2); | |
border: none; | |
} | |
.views li a { | |
color: var(--light-color-1); | |
} | |
.views li.active a { | |
color: var(--light-color-2); | |
font-weight: 400; | |
} | |
.views li:last-child { | |
border: none; | |
} |
Thanks for the reply and the help.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
How do I use it?