Dark mode theme for Wahoo
wahoofitness.com - Dark Mode by Nick2bad4u
Imported and mirrored from https://github.com/Nick2bad4u/UserStyles/raw/refs/heads/main/WahooFitnessDarkMode.user.css
Details
AuthorNick2bad4u
LicenseUnLicense
Categorywahoofitness
Created
Updated
Code size306 kB
Code checksumbe39b65d
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* stylelint-disable declaration-property-value-no-unknown -- Stylus Formatting */
/* stylelint-disable selector-pseudo-class-no-unknown -- Stylus Formatting */
/* stylelint-disable selector-pseudo-element-no-unknown -- Stylus Formatting */
/* stylelint-disable no-duplicate-selectors -- Stylus Formatting */
/* ==UserStyle==
@name wahoofitness.com - Dark Mode
@namespace typpi.online
@version 1.0.3
@description Dark mode theme for Wahoo
@author Nick2bad4u
@license UnLicense
@homepageURL https://github.com/Nick2bad4u/UserStyles
@supportURL https://github.com/Nick2bad4u/UserStyles/issues
==/UserStyle== */
@-moz-document domain("wahoofitness.com") {
/* Invert colors except images and videos */
:is(
html:not([stylus-iframe]),
img,
svg,
video,
.bg-home
) {
filter: invert(1) hue-rotate(180deg) !important;
}
:root {
--zd-color-black: #000000;
--zd-color-green-100: #edf8f4;
--zd-color-green-200: #d1e8df;
--zd-color-green-300: #aecfc2;
--zd-color-green-400: #5eae91;
--zd-color-green-500: #228f67;
--zd-color-green-600: #038153;
--zd-color-green-700: #186146;
--zd-color-green-800: #0b3b29;
--zd-color-grey-100: #f8f9f9;
--zd-color-grey-200: #e9ebed;
--zd-color-grey-300: #d8dcde;
--zd-color-grey-400: #c2c8cc;
--zd-color-grey-500: #87929d;
--zd-color-grey-600: #68737d;
--zd-color-grey-700: #49545c;
--zd-color-grey-800: #2f3941;
--zd-color-blue-100: #edf7ff;
--zd-color-blue-200: #cee2f2;
--zd-color-blue-300: #adcce4;
--zd-color-blue-400: #5293c7;
--zd-color-blue-500: #337fbd;
--zd-color-blue-600: #1f73b7;
--zd-color-blue-700: #144a75;
--zd-color-blue-800: #0f3554;
--zd-color-kale-100: #f5fcfc;
--zd-color-kale-200: #daeded;
--zd-color-kale-300: #bdd9d7;
--zd-color-kale-400: #90bbbb;
--zd-color-kale-500: #467b7c;
--zd-color-kale-600: #17494d;
--zd-color-kale-700: #03363d;
--zd-color-kale-800: #012b30;
--zd-color-red-100: #fff0f1;
--zd-color-red-200: #f5d5d8;
--zd-color-red-300: #f5b5ba;
--zd-color-red-400: #e35b66;
--zd-color-red-500: #d93f4c;
--zd-color-red-600: #cc3340;
--zd-color-red-700: #8c232c;
--zd-color-red-800: #681219;
--zd-color-yellow-100: #fff7ed;
--zd-color-yellow-200: #ffeedb;
--zd-color-yellow-300: #fed6a8;
--zd-color-yellow-400: #ffb057;
--zd-color-yellow-500: #f79a3e;
--zd-color-yellow-600: #ed8f1c;
--zd-color-yellow-700: #ad5918;
--zd-color-yellow-800: #703815;
--zd-color-white: #ffffff;
--zd-color-secondary-azure-400: #3091ec;
--zd-color-secondary-azure-600: #1371d6;
--zd-color-secondary-crimson-400: #e34f32;
--zd-color-secondary-crimson-600: #c72a1c;
--zd-color-secondary-fuschia-400: #d653c2;
--zd-color-secondary-fuschia-600: #a81897;
--zd-color-secondary-lemon-400: #ffd424;
--zd-color-secondary-lemon-600: #ffbb10;
--zd-color-secondary-lime-400: #43b324;
--zd-color-secondary-lime-600: #2e8200;
--zd-color-secondary-mint-400: #00a656;
--zd-color-secondary-mint-600: #058541;
--zd-color-secondary-orange-400: #de701d;
--zd-color-secondary-orange-600: #bf5000;
--zd-color-secondary-pink-400: #ec4d63;
--zd-color-secondary-pink-600: #d42054;
--zd-color-secondary-purple-400: #b552e2;
--zd-color-secondary-purple-600: #6a27b8;
--zd-color-secondary-royal-400: #5d7df5;
--zd-color-secondary-royal-600: #3353e2;
--zd-color-secondary-teal-400: #02a191;
--zd-color-secondary-teal-600: #028079;
--zd-color-secondary-azure-M400: #5f8dcf;
--zd-color-secondary-azure-M600: #3a70b2;
--zd-color-secondary-crimson-M400: #cc6c5b;
--zd-color-secondary-crimson-M600: #b24a3c;
--zd-color-secondary-fuschia-M400: #cf62a8;
--zd-color-secondary-fuschia-M600: #a8458c;
--zd-color-secondary-lemon-M400: #e7a500;
--zd-color-secondary-lemon-M600: #c38f00;
--zd-color-secondary-lime-M400: #519e2d;
--zd-color-secondary-lime-M600: #47782c;
--zd-color-secondary-mint-M400: #299c66;
--zd-color-secondary-mint-M600: #2e8057;
--zd-color-secondary-orange-M400: #d4772c;
--zd-color-secondary-orange-M600: #b35827;
--zd-color-secondary-pink-M400: #d57287;
--zd-color-secondary-pink-M600: #b23a5d;
--zd-color-secondary-purple-M400: #b072cc;
--zd-color-secondary-purple-M600: #9358b0;
--zd-color-secondary-royal-M400: #7986d8;
--zd-color-secondary-royal-M600: #4b61c3;
--zd-color-secondary-teal-M400: #2d9e8f;
--zd-color-secondary-teal-M600: #3c7873;
--zd-color-chat-orange: #f79a3e;
--zd-color-connect-red: #ff6224;
--zd-color-explore-blue: #30aabc;
--zd-color-gather-pink: #f6c8be;
--zd-color-guide-pink: #ff6224;
--zd-color-message-green: #37b8af;
--zd-color-sell-gold: #c38f00;
--zd-color-support-green: #00a656;
--zd-color-talk-yellow: #efc93d;
--zd-font-family-monospace: sfmono-regular,
consolas, 'Liberation Mono', menlo, courier,
monospace;
--zd-font-family-system: system-ui,
-apple-system, segoe ui, roboto, ubuntu,
cantarell, noto sans, sans-serif,
blinkmacsystemfont, 'Segoe UI', roboto,
oxygen-sans, ubuntu, cantarell,
'Helvetica Neue', arial, sans-serif;
--zd-font-size-xs: 10px;
--zd-font-size-sm: 12px;
--zd-font-size-md: 14px;
--zd-font-size-lg: 18px;
--zd-font-size-xl: 22px;
--zd-font-size-xxl: 26px;
--zd-font-size-xxxl: 36px;
--zd-font-size-sm-monospace: 11px;
--zd-font-size-md-monospace: 13px;
--zd-font-size-lg-monospace: 17px;
--zd-font-weight-thin: 100;
--zd-font-weight-extralight: 200;
--zd-font-weight-light: 300;
--zd-font-weight-regular: 400;
--zd-font-weight-medium: 500;
--zd-font-weight-semibold: 600;
--zd-font-weight-bold: 700;
--zd-font-weight-extrabold: 800;
--zd-font-weight-black: 900;
--zd-font-weight-ultralight: 200;
--zd-font-weight-ultrabold: 800;
--zd-font-weight-heavy: 900;
--zd-line-height-sm: 16px;
--zd-line-height-md: 20px;
--zd-line-height-lg: 24px;
--zd-line-height-xl: 28px;
--zd-line-height-xxl: 32px;
--zd-line-height-xxxl: 44px;
--zd-spacing-xxs: 4px;
--zd-spacing-xs: 8px;
--zd-spacing-sm: 12px;
--zd-spacing: 20px;
--zd-spacing-lg: 32px;
--zd-spacing-xl: 40px;
--zd-spacing-xxl: 48px;
}
@charset "UTF-8";
html {
line-height: 1.15;
text-size-adjust: 100%;
}
body {
margin: 0;
}
main {
display: block;
}
h1 {
margin: 0.67em 0;
font-size: 2em;
}
hr {
box-sizing: content-box;
height: 0;
overflow: visible;
}
pre {
font-size: 1em;
font-family: monospace;
}
a {
background-color: transparent;
}
abbr[title] {
border-bottom: none;
text-decoration: underline;
text-decoration: underline dotted;
}
b,
strong {
font-weight: bolder;
}
code,
kbd,
samp {
font-size: 1em;
font-family: monospace;
}
small {
font-size: 80%;
}
sub,
sup {
position: relative;
vertical-align: baseline;
font-size: 75%;
line-height: 0;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
img {
border-style: none;
}
button,
input,
optgroup,
select,
.nesty-input,
.hc-multiselect-toggle,
textarea {
margin: 5;
font-size: 100%;
line-height: 1.15;
font-family: inherit;
}
button,
input {
overflow: visible;
}
button,
select,
.nesty-input,
.hc-multiselect-toggle {
text-transform: none;
}
button,
[type='button'],
[type='reset'],
[type='submit'] {
appearance: button;
}
button::-moz-focus-inner,
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
button:-moz-focusring,
[type='button']:-moz-focusring,
[type='reset']:-moz-focusring,
[type='submit']:-moz-focusring {
outline: 1px dotted ButtonText;
}
fieldset {
padding: 0.35em 0.75em 0.625em;
}
legend {
display: table;
box-sizing: border-box;
padding: 0;
max-width: 100%;
color: inherit;
white-space: normal;
}
progress {
vertical-align: baseline;
}
textarea {
overflow: auto;
}
[type='checkbox'],
[type='radio'] {
box-sizing: border-box;
padding: 0;
}
[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
height: auto;
}
[type='search'] {
appearance: textfield;
outline-offset: -2px;
}
[type='search']::-webkit-search-decoration {
appearance: none;
}
::-webkit-file-upload-button {
appearance: button;
font: inherit;
}
details {
display: block;
}
summary {
display: list-item;
}
template {
display: none;
}
[hidden] {
display: none;
}
@viewport {
width: device-width;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
font-size: 16px;
text-size-adjust: 100%;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-tap-highlight-color: rgb(0 0 0 / 0%);
-ms-overflow-style: scrollbar;
background-color: #f7f7f7;
}
body {
display: flex;
flex-direction: column;
min-height: 100vh;
color: #333333;
font-weight: 400;
font-size: 1em;
line-height: 1.5;
font-family:
Source Sans Pro,
-apple-system,
BlinkMacSystemFont,
Segoe UI,
Helvetica,
Arial,
sans-serif;
}
[role='main'] {
flex-grow: 1;
}
article,
aside,
dialog,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
display: block;
}
output {
display: inline-block;
}
summary {
display: list-item;
}
hr {
box-sizing: content-box;
height: 0;
overflow: visible;
}
[tabindex='-1']:focus {
outline: none !important;
}
a,
area,
button,
[role='button'],
input:not([type='range']),
label,
select,
.nesty-input,
.hc-multiselect-toggle,
summary,
textarea {
touch-action: manipulation;
}
p {
margin-top: 0;
margin-bottom: 16px;
}
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
margin: 1.5rem 0 1rem;
color: #222222;
line-height: 1.375;
font-family:
Source Sans Pro,
-apple-system,
BlinkMacSystemFont,
Segoe UI,
Helvetica,
Arial,
sans-serif;
}
h1,
.h1 {
font-weight: 600;
font-size: 1.875rem;
}
h2,
.h2 {
...