Skip to content

wahoofitness.com - Dark Mode by Nick2bad4u

Imported and mirrored from https://github.com/Nick2bad4u/UserStyles/raw/refs/heads/main/WahooFitnessDarkMode.user.css

Screenshot of wahoofitness.com - Dark Mode

Details

AuthorNick2bad4u

LicenseUnLicense

Categorywahoofitness

Created

Updated

Size307 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Dark mode theme for Wahoo

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.
/* ==UserStyle==
@name           wahoofitness.com - Dark Mode
@namespace      typpi.online
@version        1.0.1
@description    Dark mode theme for Wahoo
@author         Nick2bad4u
@license        UnLicense
@homepageURL    https://github.com/Nick2bad4u/UserStyles
==/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, 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, 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%;
		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 {
		font-weight: 600;
		font-size: 1.5rem;
	}

	h3,
	.h3 {
		font-weight: 700;
		font-size: 1.25rem;
	}

	h4,
	.h4 {
		font-weight: 700;
		font-size: 1.125rem;
	}

	h5,
	.h5 {
		font-weight: 700;
		font-size: 1em;
	}

	h6,
	.h6 {
		font-weight: 700;
		font-size: 0.875rem;
	}

	b,
	strong {
		font-weight: 700;
	}

	em {
		backgr...

Reviews

No reviews yet.