Last active 6 days ago

Makes cards a bit easier on the eye in Dark Mode

2026-04-14 18-10-31.mp4 Raw
2026-04-14_17-58.png Raw
2026-04-14_17-58.png
2026-04-14_17-59.png Raw
2026-04-14_17-59.png
2026-04-14_17-59_1.png Raw
2026-04-14_17-59_1.png
style.css Raw
1.task-tags > ul > li
2{
3 color: #000 !important;
4}
5.task-board-header a,
6.task-board-header > .dropdown > .dropdown-menu > strong,
7.task-board-header > .dropdown > .dropdown-menu-link-icon i,
8.task-board-header > .js-modal-large > i,
9.task-board-icons-row,
10.task-board-title a {
11 color: #FFF !important;
12}
13.task-board, .task-board-expanded {
14 background: #1A1A1A !important;
15}
16
17.task-board {
18 border-color: #1f1226 !important;
19 transition: border 0.2s, box-shadow 0.2s, scale 0.2s;
20}
21
22.task-board.draggable-item:hover {
23 border-color: #1d2244 !important;
24 cursor: grab;
25}
26
27.task-board.draggable-item.draggable-item-selected {
28 border-color: dodgerblue !important;
29 box-shadow: 0px 0px 15px dodgerblue;
30 cursor: grabbing !important;
31 scale: 1.05;
32}
33
34.task-board.draggable-item.draggable-item-selected > .task-board-expanded {
35 pointer-events: none;
36}
37
38.task-board.color-yellow > .task-board-expanded,
39.task-board.color-yellow:not(:has(.task-board-expanded)) > .task-board-header {
40 border-top: solid #FFFF00 3px;
41}
42
43.task-board.color-blue > .task-board-expanded,
44.task-board.color-blue:not(:has(.task-board-expanded)) > .task-board-header {
45 border-top: solid #0271f9 3px;
46}
47
48.task-board.color-green > .task-board-expanded,
49.task-board.color-green:not(:has(.task-board-expanded)) > .task-board-header {
50 border-top: solid #00aa00 3px;
51}
52
53.task-board.color-purple > .task-board-expanded,
54.task-board.color-purple:not(:has(.task-board-expanded)) > .task-board-header {
55 border-top: solid #890ac9 3px;
56}
57
58.task-board.color-red > .task-board-expanded,
59.task-board.color-red:not(:has(.task-board-expanded)) > .task-board-header {
60 border-top: solid #cc0000 3px;
61}
62
63.task-board.color-orange > .task-board-expanded,
64.task-board.color-orange:not(:has(.task-board-expanded)) > .task-board-header {
65 border-top: solid #EE7700 3px;
66}
67
68.task-board.color-grey > .task-board-expanded,
69.task-board.color-grey:not(:has(.task-board-expanded)) > .task-board-header {
70 border-top: solid #858585 3px;
71}
72
73.task-board.color-brown > .task-board-expanded,
74.task-board.color-brown:not(:has(.task-board-expanded)) > .task-board-header {
75 border-top: solid #7a2101 3px;
76}
77
78.task-board.color-deep_orange > .task-board-expanded,
79.task-board.color-deep_orange:not(:has(.task-board-expanded)) > .task-board-header {
80 border-top: solid #e64a19 3px;
81}
82
83.task-board.color-dark_grey > .task-board-expanded,
84.task-board.color-dark_grey:not(:has(.task-board-expanded)) > .task-board-header {
85 border-top: solid #323232 3px;
86}
87
88.task-board.color-pink > .task-board-expanded,
89.task-board.color-pink:not(:has(.task-board-expanded)) > .task-board-header {
90 border-top: solid #fc6150 3px;
91}
92
93.task-board.color-teal > .task-board-expanded,
94.task-board.color-teal:not(:has(.task-board-expanded)) > .task-board-header {
95 border-top: solid #80CBC4 3px;
96}
97
98.task-board.color-cyan > .task-board-expanded,
99.task-board.color-cyan:not(:has(.task-board-expanded)) > .task-board-header {
100 border-top: solid #00BCD4 3px;
101}
102
103.task-board.color-lime > .task-board-expanded,
104.task-board.color-lime:not(:has(.task-board-expanded)) > .task-board-header {
105 border-top: solid #AFB42B 3px;
106}
107
108.task-board.color-light_green > .task-board-expanded,
109.task-board.color-light_green:not(:has(.task-board-expanded)) > .task-board-header {
110 border-top: solid #689F38 3px;
111}
112
113.task-board.color-amber > .task-board-expanded,
114.task-board.color-amber:not(:has(.task-board-expanded)) > .task-board-header {
115 border-top: solid #FFA000 3px;
116}