Dark mode for changedetection.io
changedetection.io Dark Mode by gboudreau
Details
Authorgboudreau
LicenseNo License
Categoryhttps://changedetection.io/
Created
Updated
Size3.4 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
/* ==UserStyle==
@name changedetection-io.home.patati.ca
@version 20240817.20.30
@namespace ?
==/UserStyle== */
@-moz-document domain("changedetection-io.home.patati.ca") {
:root {
--main-bg-color: radial-gradient(circle farthest-side at 0% 100%, rgb(47, 47, 47) 0%, rgba(47, 47, 47, 0) 100%), radial-gradient(circle farthest-side at 100% 100%, rgb(63, 63, 63) 0%, rgba(63, 63, 63, 0) 100%), radial-gradient(circle farthest-side at 100% 0%, rgb(76, 76, 76) 0%, rgba(76, 76, 76, 0) 100%), radial-gradient(circle farthest-side at 0% 0%, rgb(58, 58, 58) 0%, rgba(58, 58, 58, 0) 100%), black center center/cover no-repeat fixed;
--modal-bg-color: #282828;
--modal-header-color: #323232;
--modal-footer-color: #323232;
--drop-down-menu-bg: #191a1c;
--button-color: #cc7b19;
--button-color-hover: #e59029;
--button-text: #eee;
--button-text-hover: #fff;
--accent-color: 229, 160, 13;
--accent-color-hover: #ffc107;
--link-color: #e5a00d;
--link-color-hover: #fff;
--label-text-color: #333;
--text: #ddd;
--text-hover: #fff;
--text-muted: #999;
--arr-queue-color: #27c24c;
--plex-poster-unwatched: #e5a00d;
--petio-spinner: invert(0%) sepia(0%) saturate(100%) hue-rotate(0deg) brightness(100%) contrast(100%);
--gitea-color-primary-dark-4: 255, 193, 7;
--overseerr-gradient: radial-gradient(circle farthest-side at 0% 100%, rgb(47, 47, 47) 0%, rgba(47, 47, 47, 0) 100%), radial-gradient(circle farthest-side at 100% 100%, rgb(63, 63, 63) 0%, rgba(63, 63, 63, 0) 100%), radial-gradient(circle farthest-side at 100% 0%, rgb(76, 76, 76) 0%, rgba(76, 76, 76, 0) 100%), radial-gradient(circle farthest-side at 0% 0%, rgb(58, 58, 58) 0%, rgba(58, 58, 58, 0) 100%), rgba(0, 0, 0, 0.5) center center/cover no-repeat fixed;
--transparency-dark-35: rgba(0, 0, 0, .35);
}
html .watch-table .title-col a[target="_blank"]::after,
html .watch-table .current-diff-url::after {
filter: invert(0.5) hue-rotate(10deg) brightness(2);
}
body {
color: var(--text);
background: var(--modal-header-color);
}
#diff-ui {
background: var(--modal-bg-color);
}
#diff-ui .snapshot-age {
background: var(--modal-header-color);
}
body::before,
body::after {
background: none;
clip-path: none;
}
a {
color: var(--link-color);
}
a:hover {
text-decoration: underline;
}
.pure-button-primary,
a.pure-button-primary,
.pure-button-selected,
a.pure-button-selected {
color: var(--button-text);
background-color: var(--button-color);
}
.pure-button-hover,
.pure-button:focus,
.pure-button:hover {
text-decoration: none;
}
.pure-menu-horizontal {
background: var(--transparency-dark-35);
}
.pure-menu-link {
color: var(--text);
}
.sticky-tab {
background: var(--transparency-dark-35);
}
#new-watch-form input:not(.pure-button) {
background-color: var(--transparency-dark-35);
color: var(--text-muted);
}
.pure-table thead {
background-color: var(--modal-header-color);
color: var(--text);
}
.pure-table-odd,
.pure-table-even,
.pure-table-striped tr:nth-child(2n-1) td,
.watch-table tr {
background: transparent;
color: var(--text);
}
.pure-table,
.pure-table td,
.pure-table th {
border: none;
border-bottom: 1px solid var(--text-muted);
}
.watch-tag-list {
color: var(--text-muted);
white-space: nowrap;
}
#hosted-sticky {
display: none;
}
}