Skip to content

Dark Mode Political Sites by Siren

Screenshot of Dark Mode Political Sites

Details

AuthorSiren

LicenseGNU GPLv3

Categorywww.theguardian.com; reason.com; www.theepochtimes.com; www.foxnews.com; www.foxbusiness.com

Created

Updated

Size3.6 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

A dark mode for a few political sites, custom-tailored to invert dark colors and gracefully display images

Notes

I chose one of each leaning site according to allsides.com/media-bias --> The Guardian, Reason, The Epoch Times, and Fox News (as well as Fox Business)

Source code

/* ==UserStyle==
@name           Dark Mode Political Sites
@namespace      github.com/openstyles/stylus
@version        0.1.0
@description    A dark mode for each site, custom-tailored to invert dark colors and gracefully display content
@author         Siren
==/UserStyle== */

@-moz-document domain("www.theguardian.com"), domain("reason.com"), domain("www.theepochtimes.com"), domain("www.foxnews.com"), domain("www.foxbusiness.com") {
	:root {
		--dark-filter: invert(95%) hue-rotate(180deg);
		--revert-filter: invert(0%) hue-rotate(0deg);
	}
	
	html {
		filter: var(--dark-filter);
	}
	
	img, video {
		filter: var(--dark-filter);
	}

	iframe[id*="yt-player"], iframe[class*="yt-player"] {
		filter: var(--dark-filter);
	}
}
@-moz-document domain("theguardian.com") {
	#bannerandheader header {
		filter: var(--dark-filter);
	}

	section[class*="fightback-newsletter"] {
		filter: var(--dark-filter);

		& img, section[class*="fightback-newsletter"] {
			filter: var(--revert-filter);
		}
	}

	section[class*="documentary"] {
		filter: var(--dark-filter);

		& img {
			filter: var(--revert-filter);
		}
	}
	
	#video {
		filter: var(--dark-filter);
		
		& img, video {
			filter: var(--revert-filter);
		}
	}
	
	footer[style="background-color:#052962;"] {
		filter: var(--dark-filter);
	}
}


@-moz-document domain("reason.com") {
	.logo {
		filter: var(--revert-filter);
	}
	
	div[id*="home-page-feature-bar"], .feature-bar--wrapper {
		filter: var(--dark-filter);
		
		.video-player {
			filter: var(--dark-filter);
		}
	}
	
	#primary-nav {
		filter: var(--dark-filter);
	}
	
	section.widget {
		filter: var(--dark-filter);
	}
	
	.disco-widget {
		filter: var(--dark-filter);
		background-color: #b6b6b6;
		padding: .5em;
	}
	
	footer {
		filter: var(--dark-filter);
	}
}

@-moz-document domain("www.theepochtimes.com") {
	header img {
		filter: var(--revert-filter);
	}
	
	iframe[src*="embedtv"] {
		filter: var(--dark-filter);
	}
	
	div[data-ea="top-news-jingwen"] {
		
		& img {
			filter: var(--revert-filter);
		}
	}
	
	/* Within articles */
	footer.flex {
		filter: var(--dark-filter);
		
		& img {
			filter: var(--revert-filter);
		}
	}
}

@-moz-document domain("www.foxnews.com"), domain("www.foxbusiness.com") {
	.network-wrapper {
		filter: var(--dark-filter);
	}
	
	.site-header {
		background-color: transparent;
		border-bottom: 0px;
		
		& .nav-row-lower {
			filter: var(--dark-filter);
			
			& .inner {
				background-color: white !important;
			}
		}
	}
	
	iframe {
		filter: var(--dark-filter);
	}
	
	.info {
		filter: brightness(155%) contrast(85%);
	}
	
	.alert-banner, .site-header, .article-header {
		filter: var(--dark-filter);
	}
	
	footer {
		filter: var(--dark-filter);
	}
	
	
	
	/* On /video/ sites */
	#__nuxt {
		filter: var(--dark-filter);
		
		& iframe, .video-item img {
			filter: var(--revert-filter);
		}
		
		.video-item {
			filter: var(--dark-filter);
		}
		
		section.collection, .item-newsletter {
			filter: var(--dark-filter);
		}
		
		.article-body .speakable, .article-body p {
			filter: var(--dark-filter);
		}
		
		img { 
			filter: var(--revert-filter); 
		}
		
		iframe[id*="widget"] {
			filter: var(--dark-filter);
			
			
		}
		
		& footer.video-site-footer .branding {
			filter: var(--dark-filter);
			
			& a {
				opacity: 100%;
			}
		}
		
		& footer.video-site-footer {
			color: black;
		}
		
		& footer {
			filter: var(--revert-filter);
		}
	}
}

Reviews

No reviews yet.