I was able to use a javascript based userscript to apply “dark mode” styles to certain sites, however I was wondering if there is a way to customize css per site without javascript.
In the luakit browser I could specify a file ending in .css ex: google-com.css and then the contents would look like this:
Does anyone know how to do this with nyxt?
Any specific configuration examples would be much appreciated (im not a dev (especially not lisp) so I am not at a point where I understand too well how to implement new settings.)
It’s possible, although WebKit doesn’t allow us lots of things. In particular regex matching. It has this weird [scheme]://[domain]/[path] structure (similar to match patterns, but with their own quirks).
Here’s a huge chunk of configuration that I’ve tried to document exhaustively. Writing your own can be a bit of trial-and-error, but it is sure possible to do what you need to
(define-configuration :web-buffer
"User script mode allows adding user scripts and user styles (although
less involved than the @-moz-document ones.) Have to enable this mode
by default."
((default-modes (append (list :user-script-mode) %slot-value&))))
(define-configuration :user-script-mode
"Define user styles to apply to all pages.
Note that the format for :include/:exclude keywords is not really
regex. The structure roughly is [scheme]://[domain]/[path], where
- scheme is either * or a valid scheme like http etc.
- domain is a domain with arbitrary number of asterisks, each of which
represent zero to infinity characters.
- path can contain arbitrary text and asterisks.
Examples:
*://example.com/* --- Any scheme, any path, but only on example.com.
*://*.example.com/ --- Any subdomain of example.com with empty path.
http://*/* --- any https website.
https://*.mozilla.com/index* --- index-prefixed paths on Mozilla subdomains.
WebKitGTK seems to have some arbitrary restrictions, see 'Quirks'
comments below."
((user-styles
(append
(list (make-instance
'nyxt/mode/user-script:user-style
;; You can also use :exclude to
;; blocklist websites.
:include '("https://*.google.com/*"
;; Quirk: have to specify the subdomain rule
;; separately from the domain rule.
"https://google.com/*"
;; Quirk: have to specify http separately from
;; https—it's not regexp.
"http://*.google.com/*"
"http://google.com/*")
;; NIL—toplevel only; T—toplevel
;; and all iframes.
:all-frames-p nil
;; Either :author or
;; :user. :user overrides
;; :author-created styles.
:level :user
:code "* {background-color: red;}")
;; Add more make-instance 'user-style here
)
%slot-value%))))
I was wondering if there is a way to customize css per site without javascript.
In my understanding, your suggestion requires JS.
Since Luakit supports it, we'd need to understand whether this feature relies on WebKit. If it does, it should be possible to support it in Nyxt too. Otherwise, it may be harder to implement.
User script mode is somewhat confusingly named, because, in addition to user scripts (JS-based) it also hosts user styles which are pure CSS and require no JS to work.
