Skip to content

Auto Colour Scheme for Non-styled Pages by myfonj

Write a review Install Get Stylus

Details

Authormyfonj

LicenseCC Zero

Category*

Created

Updated

Code size2.1 kB

Code checksum5c769505

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Makes "unstyled" webpages respect system dark theme preference.

Notes

Also centres what looks like Apache directory listings.

Source code

/* ==UserStyle==
@name           Bare pages colour scheme responsive
@namespace      github.com/openstyles/stylus
@version        1.2.1
@description    Makes "unstyled" webpages respect system dark theme preference.
@author         myf
@license        CC0
==/UserStyle== */
@-moz-document regexp(".*") {
/*
 Global.
 Changelog
 1.2.1 (2025-04-10) old-school hard-core hard-code "bgcolor" hatches added.
 1.2.0 (2025-04-04) Mute list markers and borders.
 1.0.3 (2025-04-01) Just notes and clarifications in comments.
 1.0.2 (2025-03-28) Removed the Apache experiment (moving to different style).
 1.0.1 (2025-03-26) Added `[style]` attribute as a signal for not to take effect.
 1.0.0 (2025-03-25) Init. Not sure about the selector, but seems to work.
*/
/*
 Stuff for "unstyled" pages
 e.g., directory listings and stuff like that
 Some examples for testing:
 http://info.cern.ch/hypertext/DataSources/bySubject/Overview.html
 https://motherfuckingwebsite.com/
 https://www-cs-faculty.stanford.edu/~knuth/taocp.html
*/
html:not(:has(
  /*
  § NOGO for <style> in "normal" locations
    Some userstyles managers inject styles "after" (outside) body,
     so keep `html > style` allowed.
  */
  > head style,
  > body style,
  /*
  § NOGO when <link rel="stylesheet"> in "normal" locations.
    Also probably unneccessarily complicated (?)
    Links in body are weird, but work.
  */
  > head link[rel="stylesheet" i],
  > body link[rel="stylesheet" i],
  /*
  § NOGO for <body style="…">
    Keeping <html style="…"> allowed,
    since I use it in GM, for unrelated stuff.
    (Is puting a style attribute on HTML even legal?)
  */
  > body[style],
  /*
  § NOGO for <body>…<el style="…">
  */
  > body [style],
  /*
  § NOGO for old-school hard-core hard-code
  <body bgcolor="pink" text="blur">
  <table bgcolor>
  <font color="red">
  */
  [bgcolor],
  body[text],
  font[color]
)){
 /*
  Auto dark theme!
 */
 & {
  color-scheme: dark light;
  --mute: color-mix(in srgb, currentcolor, transparent);
 }
 /*
  Mute some usualy too "heavy" elements.
 */
 & li::marker { color: var(--mute); }
 & * { border-color: var(--mute); }
}

}

Reviews

No reviews yet.