diff --git a/.gitattributes b/.gitattributes index f271a57c1b..f41afd6189 100644 --- a/.gitattributes +++ b/.gitattributes @@ -1,4 +1 @@ -*.webp filter=lfs diff=lfs merge=lfs -text -*.png filter=lfs diff=lfs merge=lfs -text -*.css linguist-language=less src/** -linguist-detectable diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS index a0f899fb85..022c0b8da3 100644 --- a/.github/CODEOWNERS +++ b/.github/CODEOWNERS @@ -1,96 +1,128 @@ # THIS FILE IS AUTOGENERATED. DO NOT EDIT IT BY HAND. /styles/advent-of-code @rubyowo +/styles/alacritty.org @AlwaysNur +/styles/alternativeto @thismoon /styles/amplenote @stellophiliac /styles/anilist @AnubisNekhet +/styles/anonymous-overflow @ImenaOphelia /styles/boringproxy @Gandalf-the-Blue /styles/brave-search @ndsboy /styles/bsky @RoootTheFox /styles/bstats @rockquiet +/styles/canvas-lms @pynappo /styles/chatgpt @uncenter /styles/chatreplay @AnubisNekhet +/styles/chess.com @uncenter /styles/cinny @jn-sena +/styles/claude @ruiiiijiiiiang /styles/codeberg @isabelroses /styles/cobalt @kerichdev /styles/crates.io @uncenter /styles/crowdin @ryanccn /styles/deepl @watatomo +/styles/deepseek @WalkQuackBack +/styles/desmos @gradylink +/styles/dev.to @shnjd +/styles/devdocs @ashish0kumar +/styles/docs.deno.com @uncenter /styles/docs.rs @uncenter /styles/duckduckgo @GenShibe -/styles/ecosia @isabelroses /styles/elk @ryanccn /styles/freedesktop @NK308 -/styles/formative @r58Playz +/styles/ghostty.org @uncenter /styles/github @uncenter +/styles/gleam.run @uncenter /styles/gmail @uncenter /styles/go.dev @Flapperoo -/styles/google @GitMuslim -/styles/google-drive @r58Playz -/styles/google-photos @GenShibe -/styles/graphite @isabelroses -/styles/google-gemini @Dandraghas +/styles/google-drive @r58Playz @WalkQuackBack +/styles/google-photos @GenShibe @WalkQuackBack +/styles/grabify @trinkey +/styles/google-gemini @Dandraghas @WalkQuackBack /styles/hackage @jn-sena /styles/hacker-news @lucasmelin /styles/have-i-been-pwned @trinkey /styles/holodex @Guaxinim5573 /styles/home-manager-options-search @uncenter /styles/homepage @Gandalf-the-Blue +/styles/hoogle @jn-sena /styles/hoppscotch @justTOBBI -/styles/hyperpipe @jn-sena +/styles/learn-x-in-y-minutes @nik-rev /styles/ichi.moe @watatomo /styles/inoreader @thomas-philippot +/styles/indie-wiki-buddy @thismoon /styles/instagram @GenShibe /styles/invokeai @ryanccn +/styles/jisho @Lichthagel +/styles/keybr.com @janTatesa /styles/keyoxide @uncenter /styles/lastfm @AnubisNekhet /styles/lemmy @Gandalf-the-Blue -/styles/lichess @coopw1 +/styles/lichess @coopw1 @zenoix /styles/lingva @rubyowo -/styles/linkedin @isabelroses /styles/listenbrainz @00dani +/styles/lobste.rs @steinuil +/styles/mastodon @comfysage /styles/mdbook @uncenter /styles/mdn @soya-daizu /styles/modrinth @thismoon -/styles/microsoft-word @GitMuslim /styles/migadu-webmail @uncenter -/styles/minesweeper @GitMuslim -/styles/namemc @Nyatalieeee +/styles/namemc @Meowcelinee +/styles/neovim.io @comfysage +/styles/npmx @42willow /styles/nitter @AnubisNekhet -/styles/nixos-search @cecelot +/styles/nixos-manual @husjon +/styles/nixos-search @sydrinea +/styles/wiki.nixos.org @orangci /styles/npm @uncenter /styles/ollama @NeonGamerBot-QK /styles/openmediavault @Gandalf-the-Blue /styles/paste.rs @Guaxinim5573 /styles/perplexity @Tnixc /styles/phanpy @Guaxinim5573 -/styles/picrew @Nyatalieeee +/styles/picrew @Meowcelinee +/styles/pinterest @nuexq /styles/planet-minecraft @Nyameliaaaa +/styles/poe @TheAnonymousCrusher /styles/porkbun @uncenter +/styles/pronouns.cc @comfysage /styles/pronouns.page @uncenter /styles/proton @soya-daizu /styles/pypi @trinkey +/styles/pythonanywhere @trinkey /styles/quizlet @spaghettiosareyummy /styles/raindrop @thismoon +/styles/react.dev @RaiderHCPlay +/styles/regex101 @uncenter +/styles/rentry.co @thismoon +/styles/scalar @incognitotgt +/styles/searchix @koibtw /styles/searxng @Sekki21956 @ryanccn -/styles/shinigami-eyes @jh-devv +/styles/seventv @mxgic1337 +/styles/shinigami-eyes @sofiedotcafe /styles/snapchat-web @itzTheMeow /styles/spotify-web @Tnixc /styles/stack-overflow @uncenter -/styles/stylus @GitMuslim +/styles/startpage @WalkQuackBack +/styles/status.cafe @bunfluff +/styles/stylus @uncenter +/styles/substack @uncenter /styles/syncthing @BlankParticle /styles/tabnews @Guaxinim5573 -/styles/tldraw @GenShibe @uncenter +/styles/tldraw @NekoDrone /styles/trinket @trinkey /styles/tuta @ryanccn -/styles/twitch @GitMuslim @uncenter +/styles/twitch @uncenter @mxgic1337 /styles/twitter @watatomo /styles/vercel @ryanccn @Dandraghas /styles/vikunja @Guaxinim5573 /styles/web.dev @uncenter -/styles/whatsapp-web @FrancoRav -/styles/wikipedia @GitMuslim +/styles/whatsapp-web @FrancoRav @WalkQuackBack +/styles/wikipedia @uncenter /styles/wikiwand @Tnixc /styles/youtube @isabelroses @uncenter +/styles/zen-browser-docs @ashish0kumar -/.github/ @catppuccin/userstyles-staff -/scripts/ @catppuccin/userstyles-staff -/template/ @catppuccin/userstyles-staff \ No newline at end of file +/.github/ @uncenter @walkquackback +/scripts/ @uncenter @walkquackback +/template/ @uncenter @walkquackback +/lib/ @uncenter @walkquackback \ No newline at end of file diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml index 1408126da3..9c0a16c17a 100644 --- a/.github/ISSUE_TEMPLATE/config.yml +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -1,11 +1,11 @@ blank_issues_enabled: false contact_links: - - name: Userstyle Request + - name: Request a Userstyle url: https://github.com/catppuccin/catppuccin/discussions/new?category=port-requests - about: Request a website to be themed here! - - name: Userstyle Review + about: Request for a website to be themed. + - name: Submit a New Userstyle url: https://github.com/catppuccin/userstyles/compare - about: Already made a theme? Submit a Pull Request here! + about: Already made a theme? Submit a pull request to add it to the collection. - name: Community Discord url: https://discord.com/servers/catppuccin-907385605422448742 about: Ask questions and chat to other community members! diff --git a/.github/ISSUE_TEMPLATE/meta.yml b/.github/ISSUE_TEMPLATE/meta.yml index 01bb072136..11031087c2 100644 --- a/.github/ISSUE_TEMPLATE/meta.yml +++ b/.github/ISSUE_TEMPLATE/meta.yml @@ -1,5 +1,5 @@ name: Meta Issue -description: Report your issues with the repository here! +description: Report general userstyles issues. labels: [meta] body: - type: checkboxes diff --git a/.github/ISSUE_TEMPLATE/userstyle.yml b/.github/ISSUE_TEMPLATE/userstyle.yml index d0a6a074ca..1655cf5726 100644 --- a/.github/ISSUE_TEMPLATE/userstyle.yml +++ b/.github/ISSUE_TEMPLATE/userstyle.yml @@ -1,43 +1,63 @@ # THIS FILE IS AUTOGENERATED. DO NOT EDIT IT BY HAND. name: Userstyle Issue -description: Report your problems with any of the userstyles here! +description: Report a problem with a userstyle. body: - - type: checkboxes + - id: prerequisites + type: checkboxes attributes: label: Is there an existing issue outlining your problem? description: Please search to see if an issue already exists for your problem. options: - - label: I am using the latest version of the provided userstyle. - required: true - label: I have searched the existing issues and they do not solve my problem. required: true - - type: dropdown + - id: userstyle + type: dropdown attributes: - label: What userstyles are you seeing the problem on? + label: What userstyle are you seeing the problem on? description: "Don't worry about the `lbl:` prefix, it allows issues to be automatically labeled!" - multiple: true - options: ["lbl:advent-of-code", "lbl:amplenote", "lbl:anilist", "lbl:arch-wiki", "lbl:boringproxy", "lbl:brave-search", "lbl:bsky", "lbl:bstats", "lbl:canvas-lms", "lbl:chatgpt", "lbl:chatreplay", "lbl:chess.com", "lbl:cinny", "lbl:codeberg", "lbl:cobalt", "lbl:crates.io", "lbl:crowdin", "lbl:deepl", "lbl:docs.rs", "lbl:duckduckgo", "lbl:ecosia", "lbl:elk", "lbl:freedesktop", "lbl:formative", "lbl:github", "lbl:gmail", "lbl:go.dev", "lbl:google", "lbl:google-drive", "lbl:google-photos", "lbl:graphite", "lbl:google-gemini", "lbl:hackage", "lbl:hacker-news", "lbl:have-i-been-pwned", "lbl:holodex", "lbl:home-manager-options-search", "lbl:homepage", "lbl:hoppscotch", "lbl:hyperpipe", "lbl:ichi.moe", "lbl:inoreader", "lbl:instagram", "lbl:invidious", "lbl:invokeai", "lbl:keyoxide", "lbl:lastfm", "lbl:lemmy", "lbl:libreddit", "lbl:lichess", "lbl:lingva", "lbl:linkedin", "lbl:listenbrainz", "lbl:mastodon", "lbl:mdbook", "lbl:mdn", "lbl:modrinth", "lbl:microsoft-word", "lbl:migadu-webmail", "lbl:minesweeper", "lbl:namemc", "lbl:nitter", "lbl:nixos-search", "lbl:nixos.wiki", "lbl:npm", "lbl:ollama", "lbl:openmediavault", "lbl:paste.rs", "lbl:perplexity", "lbl:phanpy", "lbl:picrew", "lbl:pinterest", "lbl:planet-minecraft", "lbl:porkbun", "lbl:pronouns.page", "lbl:proton", "lbl:pypi", "lbl:quizlet", "lbl:raindrop", "lbl:reddit", "lbl:searxng", "lbl:shinigami-eyes", "lbl:snapchat-web", "lbl:spotify-web", "lbl:stack-overflow", "lbl:startpage", "lbl:stylus", "lbl:substack", "lbl:syncthing", "lbl:tabnews", "lbl:tldraw", "lbl:trinket", "lbl:tuta", "lbl:twitch", "lbl:twitter", "lbl:vercel", "lbl:vikunja", "lbl:web.dev", "lbl:whatsapp-web", "lbl:wikipedia", "lbl:wikiwand", "lbl:youtube"] + multiple: false + options: ["lbl:advent-of-code", "lbl:alacritty.org", "lbl:alternativeto", "lbl:amplenote", "lbl:anichart", "lbl:anilist", "lbl:anonymous-overflow", "lbl:arch-wiki", "lbl:boringproxy", "lbl:brave-search", "lbl:bsky", "lbl:bstats", "lbl:canvas-lms", "lbl:chatgpt", "lbl:chatreplay", "lbl:chess.com", "lbl:cinny", "lbl:claude", "lbl:cobalt", "lbl:codeberg", "lbl:crates.io", "lbl:crowdin", "lbl:deepl", "lbl:deepseek", "lbl:desmos", "lbl:dev.to", "lbl:devdocs", "lbl:docs.deno.com", "lbl:docs.rs", "lbl:duckduckgo", "lbl:ecosia", "lbl:elk", "lbl:formative", "lbl:freedesktop", "lbl:ghostty.org", "lbl:github", "lbl:gleam.run", "lbl:gmail", "lbl:go.dev", "lbl:google", "lbl:google-drive", "lbl:google-gemini", "lbl:google-photos", "lbl:grabify", "lbl:graphite", "lbl:hackage", "lbl:hacker-news", "lbl:have-i-been-pwned", "lbl:holodex", "lbl:home-manager-options-search", "lbl:homepage", "lbl:hoogle", "lbl:hoppscotch", "lbl:hyperpipe", "lbl:ichi.moe", "lbl:indie-wiki-buddy", "lbl:inoreader", "lbl:instagram", "lbl:invidious", "lbl:invokeai", "lbl:jisho", "lbl:keybr.com", "lbl:keyoxide", "lbl:lastfm", "lbl:learn-x-in-y-minutes", "lbl:lemmy", "lbl:libreddit", "lbl:lichess", "lbl:lingva", "lbl:linkedin", "lbl:listenbrainz", "lbl:lobste.rs", "lbl:mastodon", "lbl:mdbook", "lbl:mdn", "lbl:microsoft-word", "lbl:migadu-webmail", "lbl:minesweeper", "lbl:modrinth", "lbl:namemc", "lbl:neovim.io", "lbl:next.js", "lbl:nitter", "lbl:nixos-manual", "lbl:nixos-search", "lbl:nixpkgs-manual", "lbl:npm", "lbl:npmx", "lbl:ollama", "lbl:openmediavault", "lbl:paste.rs", "lbl:perplexity", "lbl:phanpy", "lbl:picrew", "lbl:pinterest", "lbl:planet-minecraft", "lbl:poe", "lbl:porkbun", "lbl:pronouns.cc", "lbl:pronouns.page", "lbl:proton", "lbl:pypi", "lbl:pythonanywhere", "lbl:quizlet", "lbl:raindrop", "lbl:react.dev", "lbl:reddit", "lbl:redlib", "lbl:regex101", "lbl:rentry.co", "lbl:scalar", "lbl:searchix", "lbl:searxng", "lbl:seventv", "lbl:shinigami-eyes", "lbl:snapchat-web", "lbl:spotify-web", "lbl:stack-overflow", "lbl:startpage", "lbl:status.cafe", "lbl:stylus", "lbl:substack", "lbl:syncthing", "lbl:tabnews", "lbl:tldraw", "lbl:trinket", "lbl:tuta", "lbl:twitch", "lbl:twitter", "lbl:vercel", "lbl:vikunja", "lbl:web.dev", "lbl:whatsapp-web", "lbl:wiki.nixos.org", "lbl:wikipedia", "lbl:wikiwand", "lbl:youtube", "lbl:zen-browser-docs"] validations: required: true - - type: textarea + - id: description + type: textarea attributes: - label: Describe your problem. - description: Also tell us, what do you expect to see? + label: Description + description: Describe the problem and what you expect to see instead. placeholder: The navigation bar on the website is highlighted incorrectly... validations: required: true - - type: textarea + - id: screenshots + type: textarea attributes: - label: Attach screenshots. + label: Relevant screenshots description: If applicable, attach screenshots which clearly highlight the issue. - - type: input + - id: browser_version + type: input attributes: - label: What browser(s) are you seeing the problem on? - description: "The browser version is also important, you can find out how to get that info [here](https://github.com/catppuccin/userstyles/blob/main/docs/browsers.md)." + label: Browser version(s) this issue occurs on + description: "To get the browser version, see https://userstyles.catppuccin.com/getting-started/faq/#what-version-of-my-browser-am-i-using." placeholder: Firefox v112.0.2 validations: required: true - - type: textarea + - id: stylus_version + type: input + attributes: + label: Stylus extension version + description: If Stylus is pinned, right-click the extension icon and select "Manage Extension". Otherwise, in the extensions popup, click the settings icon or three dots icon if present and select "Manage Extension". The version is displayed on the resulting page. + placeholder: Stylus 2.3.17 + validations: + required: true + - id: userstyle_version + type: input + attributes: + label: Installed version of the userstyle + description: Versions are listed on Stylus' Manage page. To get the version, click the Stylus extension icon, then in the popup, click Manage. The version is found beside the name of the userstyle. + placeholder: v2025.12.05 + validations: + required: true + - id: additional_comments + type: textarea attributes: label: Any additional comments? description: Add any information that hasn't been covered in the previous sections! diff --git a/.github/PULL_REQUEST_TEMPLATE/userstyle-creation.md b/.github/PULL_REQUEST_TEMPLATE/userstyle-creation.md index e7a85f4fff..05d75f5d99 100644 --- a/.github/PULL_REQUEST_TEMPLATE/userstyle-creation.md +++ b/.github/PULL_REQUEST_TEMPLATE/userstyle-creation.md @@ -1,31 +1,38 @@ - + -## ๐ŸŽ‰ Theme for Website ๐ŸŽ‰ +**Website**: ___ + +**URL**: ___ + +**Description**: -## ๐Ÿ’ฌ Additional Comments ๐Ÿ’ฌ +## ๐Ÿ—’ Checklist ๐Ÿ—’ + +- [ ] I have read and followed Catppuccin's [userstyle contributing guidelines](https://userstyles.catppuccin.com/contributing/). + + + +- [ ] I used AI (or AI-assistance) for this change. + +--- + +- [ ] I have read and followed Catppuccin's [userstyle submission guidelines](https://userstyles.catppuccin.com/contributing/creating-userstyles/). +- [ ] I have made a new directory underneath `/styles/`. + - [ ] I have ensured that the new directory is in **lower-kebab-case**. + - [ ] I have named the userstyle `catppuccin.user.less` within the new directory. + - [ ] I have followed the [template](https://github.com/catppuccin/userstyles/blob/main/template/catppuccin.user.less) and kept the preprocessor as [LESS](https://lesscss.org/#overview). +- [ ] I have updated the [`userstyles.yml`](https://github.com/catppuccin/userstyles/blob/main/scripts/userstyles.yml) file with information about the new userstyle. + +## ๐Ÿ’ฌ Comments ๐Ÿ’ฌ - -## ๐Ÿ—’ Checklist ๐Ÿ—’ - -- [ ] I have read and followed Catppuccin's [submission guidelines](https://github.com/catppuccin/userstyles/blob/main/docs/userstyle-creation.md). -- [ ] I have made a new directory underneath `/styles/` containing the contents of the [`/template`](https://github.com/catppuccin/userstyles/blob/main/template/) directory. - - [ ] I have ensured that the new directory is in **lower-kebab-case**. - - [ ] I have followed the template and kept the preprocessor as [LESS](https://lesscss.org/#overview). -- [ ] I have made sure to update the - [`userstyles.yml`](https://github.com/catppuccin/userstyles/blob/main/scripts/userstyles.yml) - file with information about the new userstyle. -- [ ] I have included the following files: - - [ ] `catppuccin.user.css` - all the CSS for the userstyle, based on the - template. - - [ ] `preview.webp` - composite image of all four individual flavor screenshots (taken with the default accent color of mauve) stitched together, generated via [Catwalk](https://github.com/catppuccin/catwalk). diff --git a/.github/PULL_REQUEST_TEMPLATE/userstyle-update.md b/.github/PULL_REQUEST_TEMPLATE/userstyle-update.md index cf8cd8cf39..6700b92432 100644 --- a/.github/PULL_REQUEST_TEMPLATE/userstyle-update.md +++ b/.github/PULL_REQUEST_TEMPLATE/userstyle-update.md @@ -1,11 +1,29 @@ +## ๐Ÿ—’ Checklist ๐Ÿ—’ + +- [ ] I have read and followed Catppuccin's [userstyle contributing guidelines](https://userstyles.catppuccin.com/contributing/). + + + +- [ ] I used AI (or AI-assistance) for this change. + ## ๐Ÿ”ง What does this fix? ๐Ÿ”ง -## ๐Ÿ—’ Checklist ๐Ÿ—’ +## ๐Ÿ” Reproduction Steps ๐Ÿ” -- [ ] I have read and followed Catppuccin's [contributing guidelines](https://github.com/catppuccin/userstyles/blob/main/docs/CONTRIBUTING.md). -- [ ] I have updated the version appropriately in the `==UserStyle==` header of the `catppuccin.user.css` file. + + + + diff --git a/.github/issue-labeler.yml b/.github/issue-labeler.yml index 30bc222202..4c40d0a6e4 100644 --- a/.github/issue-labeler.yml +++ b/.github/issue-labeler.yml @@ -1,10 +1,18 @@ # THIS FILE IS AUTOGENERATED. DO NOT EDIT IT BY HAND. advent-of-code: - '/lbl:advent-of-code(,.*)?$/gm' +alacritty.org: + - '/lbl:alacritty.org(,.*)?$/gm' +alternativeto: + - '/lbl:alternativeto(,.*)?$/gm' amplenote: - '/lbl:amplenote(,.*)?$/gm' anilist: - '/lbl:anilist(,.*)?$/gm' +anichart: + - '/lbl:anichart(,.*)?$/gm' +anonymous-overflow: + - '/lbl:anonymous-overflow(,.*)?$/gm' arch-wiki: - '/lbl:arch-wiki(,.*)?$/gm' boringproxy: @@ -25,6 +33,8 @@ chess.com: - '/lbl:chess.com(,.*)?$/gm' cinny: - '/lbl:cinny(,.*)?$/gm' +claude: + - '/lbl:claude(,.*)?$/gm' codeberg: - '/lbl:codeberg(,.*)?$/gm' cobalt: @@ -35,6 +45,16 @@ crowdin: - '/lbl:crowdin(,.*)?$/gm' deepl: - '/lbl:deepl(,.*)?$/gm' +deepseek: + - '/lbl:deepseek(,.*)?$/gm' +desmos: + - '/lbl:desmos(,.*)?$/gm' +dev.to: + - '/lbl:dev.to(,.*)?$/gm' +devdocs: + - '/lbl:devdocs(,.*)?$/gm' +docs.deno.com: + - '/lbl:docs.deno.com(,.*)?$/gm' docs.rs: - '/lbl:docs.rs(,.*)?$/gm' duckduckgo: @@ -47,8 +67,12 @@ freedesktop: - '/lbl:freedesktop(,.*)?$/gm' formative: - '/lbl:formative(,.*)?$/gm' +ghostty.org: + - '/lbl:ghostty.org(,.*)?$/gm' github: - '/lbl:github(,.*)?$/gm' +gleam.run: + - '/lbl:gleam.run(,.*)?$/gm' gmail: - '/lbl:gmail(,.*)?$/gm' go.dev: @@ -59,6 +83,8 @@ google-drive: - '/lbl:google-drive(,.*)?$/gm' google-photos: - '/lbl:google-photos(,.*)?$/gm' +grabify: + - '/lbl:grabify(,.*)?$/gm' graphite: - '/lbl:graphite(,.*)?$/gm' google-gemini: @@ -75,20 +101,30 @@ home-manager-options-search: - '/lbl:home-manager-options-search(,.*)?$/gm' homepage: - '/lbl:homepage(,.*)?$/gm' +hoogle: + - '/lbl:hoogle(,.*)?$/gm' hoppscotch: - '/lbl:hoppscotch(,.*)?$/gm' +learn-x-in-y-minutes: + - '/lbl:learn-x-in-y-minutes(,.*)?$/gm' hyperpipe: - '/lbl:hyperpipe(,.*)?$/gm' ichi.moe: - '/lbl:ichi.moe(,.*)?$/gm' inoreader: - '/lbl:inoreader(,.*)?$/gm' +indie-wiki-buddy: + - '/lbl:indie-wiki-buddy(,.*)?$/gm' instagram: - '/lbl:instagram(,.*)?$/gm' invidious: - '/lbl:invidious(,.*)?$/gm' invokeai: - '/lbl:invokeai(,.*)?$/gm' +jisho: + - '/lbl:jisho(,.*)?$/gm' +keybr.com: + - '/lbl:keybr.com(,.*)?$/gm' keyoxide: - '/lbl:keyoxide(,.*)?$/gm' lastfm: @@ -97,6 +133,8 @@ lemmy: - '/lbl:lemmy(,.*)?$/gm' libreddit: - '/lbl:libreddit(,.*)?$/gm' +redlib: + - '/lbl:redlib(,.*)?$/gm' lichess: - '/lbl:lichess(,.*)?$/gm' lingva: @@ -105,6 +143,8 @@ linkedin: - '/lbl:linkedin(,.*)?$/gm' listenbrainz: - '/lbl:listenbrainz(,.*)?$/gm' +lobste.rs: + - '/lbl:lobste.rs(,.*)?$/gm' mastodon: - '/lbl:mastodon(,.*)?$/gm' mdbook: @@ -121,12 +161,20 @@ minesweeper: - '/lbl:minesweeper(,.*)?$/gm' namemc: - '/lbl:namemc(,.*)?$/gm' +neovim.io: + - '/lbl:neovim.io(,.*)?$/gm' +npmx: + - '/lbl:npmx(,.*)?$/gm' nitter: - '/lbl:nitter(,.*)?$/gm' +nixos-manual: + - '/lbl:nixos-manual(,.*)?$/gm' +nixpkgs-manual: + - '/lbl:nixpkgs-manual(,.*)?$/gm' nixos-search: - '/lbl:nixos-search(,.*)?$/gm' -nixos.wiki: - - '/lbl:nixos.wiki(,.*)?$/gm' +wiki.nixos.org: + - '/lbl:wiki.nixos.org(,.*)?$/gm' npm: - '/lbl:npm(,.*)?$/gm' ollama: @@ -145,22 +193,40 @@ pinterest: - '/lbl:pinterest(,.*)?$/gm' planet-minecraft: - '/lbl:planet-minecraft(,.*)?$/gm' +poe: + - '/lbl:poe(,.*)?$/gm' porkbun: - '/lbl:porkbun(,.*)?$/gm' +pronouns.cc: + - '/lbl:pronouns.cc(,.*)?$/gm' pronouns.page: - '/lbl:pronouns.page(,.*)?$/gm' proton: - '/lbl:proton(,.*)?$/gm' pypi: - '/lbl:pypi(,.*)?$/gm' +pythonanywhere: + - '/lbl:pythonanywhere(,.*)?$/gm' quizlet: - '/lbl:quizlet(,.*)?$/gm' raindrop: - '/lbl:raindrop(,.*)?$/gm' +react.dev: + - '/lbl:react.dev(,.*)?$/gm' reddit: - '/lbl:reddit(,.*)?$/gm' +regex101: + - '/lbl:regex101(,.*)?$/gm' +rentry.co: + - '/lbl:rentry.co(,.*)?$/gm' +scalar: + - '/lbl:scalar(,.*)?$/gm' +searchix: + - '/lbl:searchix(,.*)?$/gm' searxng: - '/lbl:searxng(,.*)?$/gm' +seventv: + - '/lbl:seventv(,.*)?$/gm' shinigami-eyes: - '/lbl:shinigami-eyes(,.*)?$/gm' snapchat-web: @@ -171,6 +237,8 @@ stack-overflow: - '/lbl:stack-overflow(,.*)?$/gm' startpage: - '/lbl:startpage(,.*)?$/gm' +status.cafe: + - '/lbl:status.cafe(,.*)?$/gm' stylus: - '/lbl:stylus(,.*)?$/gm' substack: @@ -191,6 +259,8 @@ twitter: - '/lbl:twitter(,.*)?$/gm' vercel: - '/lbl:vercel(,.*)?$/gm' +next.js: + - '/lbl:next.js(,.*)?$/gm' vikunja: - '/lbl:vikunja(,.*)?$/gm' web.dev: @@ -203,3 +273,5 @@ wikiwand: - '/lbl:wikiwand(,.*)?$/gm' youtube: - '/lbl:youtube(,.*)?$/gm' +zen-browser-docs: + - '/lbl:zen-browser-docs(,.*)?$/gm' diff --git a/.github/labels.yml b/.github/labels.yml index f35d56b03c..836b41bace 100644 --- a/.github/labels.yml +++ b/.github/labels.yml @@ -2,12 +2,24 @@ - name: advent-of-code description: Advent Of Code color: '#eed49f' +- name: alacritty.org + description: alacritty.org + color: '#f5a97f' +- name: alternativeto + description: AlternativeTo + color: '#7dc4e4' - name: amplenote description: Amplenote color: '#8aadf4' - name: anilist - description: 'AniList, AniChart' + description: AniList + color: '#91d7e3' +- name: anichart + description: AniChart color: '#91d7e3' +- name: anonymous-overflow + description: Anonymous Overflow + color: '#a6da95' - name: arch-wiki description: Arch Wiki color: '#8aadf4' @@ -38,6 +50,9 @@ - name: cinny description: Cinny color: '#cad3f5' +- name: claude + description: Claude + color: '#f5a97f' - name: codeberg description: Codeberg color: '#8aadf4' @@ -53,6 +68,21 @@ - name: deepl description: DeepL color: '#8aadf4' +- name: deepseek + description: DeepSeek + color: '#8aadf4' +- name: desmos + description: Desmos + color: '#a6da95' +- name: dev.to + description: DEV Community + color: '#cad3f5' +- name: devdocs + description: DevDocs + color: '#cad3f5' +- name: docs.deno.com + description: docs.deno.com + color: '#a6da95' - name: docs.rs description: docs.rs color: '#eed49f' @@ -71,9 +101,15 @@ - name: formative description: Formative color: '#8aadf4' +- name: ghostty.org + description: Ghostty.org + color: '#8aadf4' - name: github description: GitHub color: '#cad3f5' +- name: gleam.run + description: gleam.run + color: '#f5bde6' - name: gmail description: Gmail color: '#f5a97f' @@ -89,6 +125,9 @@ - name: google-photos description: Google Photos color: '#7dc4e4' +- name: grabify + description: Grabify + color: '#8bd5ca' - name: graphite description: Graphite color: '#cad3f5' @@ -113,9 +152,15 @@ - name: homepage description: homepage color: '#91d7e3' +- name: hoogle + description: Hoogle + color: '#c6a0f6' - name: hoppscotch description: Hoppscotch color: '#a6da95' +- name: learn-x-in-y-minutes + description: Learn X in Y Minutes + color: '#8aadf4' - name: hyperpipe description: Hyperpipe color: '#8bd5ca' @@ -125,6 +170,9 @@ - name: inoreader description: inoreader color: '#8aadf4' +- name: indie-wiki-buddy + description: Indie Wiki Buddy + color: '#8aadf4' - name: instagram description: Instagram color: '#f5bde6' @@ -134,6 +182,12 @@ - name: invokeai description: InvokeAI color: '#eed49f' +- name: jisho + description: Jisho + color: '#a6da95' +- name: keybr.com + description: keybr.com + color: '#cad3f5' - name: keyoxide description: Keyoxide color: '#c6a0f6' @@ -144,7 +198,10 @@ description: Lemmy color: '#a6da95' - name: libreddit - description: 'Libreddit, Redlib' + description: Libreddit + color: '#f5a97f' +- name: redlib + description: Redlib color: '#f5a97f' - name: lichess description: Lichess @@ -158,6 +215,9 @@ - name: listenbrainz description: ListenBrainz color: '#f5a97f' +- name: lobste.rs + description: Lobsters + color: '#ed8796' - name: mastodon description: Mastodon color: '#b7bdf8' @@ -182,13 +242,25 @@ - name: namemc description: NameMC color: '#8aadf4' +- name: neovim.io + description: neovim.io + color: '#a6da95' +- name: npmx + description: npmx + color: '#cad3f5' - name: nitter description: Nitter color: '#8aadf4' +- name: nixos-manual + description: NixOS Manual + color: '#8aadf4' +- name: nixpkgs-manual + description: Nixpkgs Manual + color: '#8aadf4' - name: nixos-search description: NixOS Search color: '#8aadf4' -- name: nixos.wiki +- name: wiki.nixos.org description: NixOS Wiki color: '#8aadf4' - name: npm @@ -218,9 +290,15 @@ - name: planet-minecraft description: Planet Minecraft color: '#a6da95' +- name: poe + description: Poe + color: '#8aadf4' - name: porkbun description: Porkbun color: '#f5bde6' +- name: pronouns.cc + description: pronouns.cc + color: '#c6a0f6' - name: pronouns.page description: Pronouns.page color: '#f5bde6' @@ -230,18 +308,39 @@ - name: pypi description: PyPI color: '#7dc4e4' +- name: pythonanywhere + description: PythonAnywhere + color: '#7dc4e4' - name: quizlet description: Quizlet color: '#c6a0f6' - name: raindrop description: Raindrop color: '#8aadf4' +- name: react.dev + description: React.dev + color: '#7dc4e4' - name: reddit description: Reddit color: '#ed8796' +- name: regex101 + description: regex101 + color: '#8aadf4' +- name: rentry.co + description: Rentry.co + color: '#cad3f5' +- name: scalar + description: Scalar + color: '#cad3f5' +- name: searchix + description: Searchix + color: '#8aadf4' - name: searxng description: SearXNG color: '#8aadf4' +- name: seventv + description: 7TV + color: '#7dc4e4' - name: shinigami-eyes description: Shinigami Eyes color: '#c6a0f6' @@ -257,6 +356,9 @@ - name: startpage description: Startpage color: '#b7bdf8' +- name: status.cafe + description: status.cafe + color: '#7dc4e4' - name: stylus description: Stylus color: '#8bd5ca' @@ -285,7 +387,10 @@ description: Twitter color: '#8aadf4' - name: vercel - description: 'Vercel, Next.js' + description: Vercel + color: '#cad3f5' +- name: next.js + description: Next.js color: '#cad3f5' - name: vikunja description: Vikunja @@ -305,3 +410,6 @@ - name: youtube description: YouTube color: '#ed8796' +- name: zen-browser-docs + description: Zen Browser Docs + color: '#f5a97f' diff --git a/.github/pr-labeler.yml b/.github/pr-labeler.yml index d0242142c8..65ed7d57fb 100644 --- a/.github/pr-labeler.yml +++ b/.github/pr-labeler.yml @@ -1,7 +1,11 @@ # THIS FILE IS AUTOGENERATED. DO NOT EDIT IT BY HAND. advent-of-code: styles/advent-of-code/**/* +alacritty.org: styles/alacritty.org/**/* +alternativeto: styles/alternativeto/**/* amplenote: styles/amplenote/**/* anilist: styles/anilist/**/* +anichart: styles/anilist/**/* +anonymous-overflow: styles/anonymous-overflow/**/* arch-wiki: styles/arch-wiki/**/* boringproxy: styles/boringproxy/**/* brave-search: styles/brave-search/**/* @@ -12,23 +16,32 @@ chatgpt: styles/chatgpt/**/* chatreplay: styles/chatreplay/**/* chess.com: styles/chess.com/**/* cinny: styles/cinny/**/* +claude: styles/claude/**/* codeberg: styles/codeberg/**/* cobalt: styles/cobalt/**/* crates.io: styles/crates.io/**/* crowdin: styles/crowdin/**/* deepl: styles/deepl/**/* +deepseek: styles/deepseek/**/* +desmos: styles/desmos/**/* +dev.to: styles/dev.to/**/* +devdocs: styles/devdocs/**/* +docs.deno.com: styles/docs.deno.com/**/* docs.rs: styles/docs.rs/**/* duckduckgo: styles/duckduckgo/**/* ecosia: styles/ecosia/**/* elk: styles/elk/**/* freedesktop: styles/freedesktop/**/* formative: styles/formative/**/* +ghostty.org: styles/ghostty.org/**/* github: styles/github/**/* +gleam.run: styles/gleam.run/**/* gmail: styles/gmail/**/* go.dev: styles/go.dev/**/* google: styles/google/**/* google-drive: styles/google-drive/**/* google-photos: styles/google-photos/**/* +grabify: styles/grabify/**/* graphite: styles/graphite/**/* google-gemini: styles/google-gemini/**/* hackage: styles/hackage/**/* @@ -37,21 +50,28 @@ have-i-been-pwned: styles/have-i-been-pwned/**/* holodex: styles/holodex/**/* home-manager-options-search: styles/home-manager-options-search/**/* homepage: styles/homepage/**/* +hoogle: styles/hoogle/**/* hoppscotch: styles/hoppscotch/**/* +learn-x-in-y-minutes: styles/learn-x-in-y-minutes/**/* hyperpipe: styles/hyperpipe/**/* ichi.moe: styles/ichi.moe/**/* inoreader: styles/inoreader/**/* +indie-wiki-buddy: styles/indie-wiki-buddy/**/* instagram: styles/instagram/**/* invidious: styles/invidious/**/* invokeai: styles/invokeai/**/* +jisho: styles/jisho/**/* +keybr.com: styles/keybr.com/**/* keyoxide: styles/keyoxide/**/* lastfm: styles/lastfm/**/* lemmy: styles/lemmy/**/* libreddit: styles/libreddit/**/* +redlib: styles/libreddit/**/* lichess: styles/lichess/**/* lingva: styles/lingva/**/* linkedin: styles/linkedin/**/* listenbrainz: styles/listenbrainz/**/* +lobste.rs: styles/lobste.rs/**/* mastodon: styles/mastodon/**/* mdbook: styles/mdbook/**/* mdn: styles/mdn/**/* @@ -60,9 +80,13 @@ microsoft-word: styles/microsoft-word/**/* migadu-webmail: styles/migadu-webmail/**/* minesweeper: styles/minesweeper/**/* namemc: styles/namemc/**/* +neovim.io: styles/neovim.io/**/* +npmx: styles/npmx/**/* nitter: styles/nitter/**/* +nixos-manual: styles/nixos-manual/**/* +nixpkgs-manual: styles/nixos-manual/**/* nixos-search: styles/nixos-search/**/* -nixos.wiki: styles/nixos.wiki/**/* +wiki.nixos.org: styles/wiki.nixos.org/**/* npm: styles/npm/**/* ollama: styles/ollama/**/* openmediavault: styles/openmediavault/**/* @@ -72,19 +96,29 @@ phanpy: styles/phanpy/**/* picrew: styles/picrew/**/* pinterest: styles/pinterest/**/* planet-minecraft: styles/planet-minecraft/**/* +poe: styles/poe/**/* porkbun: styles/porkbun/**/* +pronouns.cc: styles/pronouns.cc/**/* pronouns.page: styles/pronouns.page/**/* proton: styles/proton/**/* pypi: styles/pypi/**/* +pythonanywhere: styles/pythonanywhere/**/* quizlet: styles/quizlet/**/* raindrop: styles/raindrop/**/* +react.dev: styles/react.dev/**/* reddit: styles/reddit/**/* +regex101: styles/regex101/**/* +rentry.co: styles/rentry.co/**/* +scalar: styles/scalar/**/* +searchix: styles/searchix/**/* searxng: styles/searxng/**/* +seventv: styles/seventv/**/* shinigami-eyes: styles/shinigami-eyes/**/* snapchat-web: styles/snapchat-web/**/* spotify-web: styles/spotify-web/**/* stack-overflow: styles/stack-overflow/**/* startpage: styles/startpage/**/* +status.cafe: styles/status.cafe/**/* stylus: styles/stylus/**/* substack: styles/substack/**/* syncthing: styles/syncthing/**/* @@ -95,9 +129,11 @@ tuta: styles/tuta/**/* twitch: styles/twitch/**/* twitter: styles/twitter/**/* vercel: styles/vercel/**/* +next.js: styles/vercel/**/* vikunja: styles/vikunja/**/* web.dev: styles/web.dev/**/* whatsapp-web: styles/whatsapp-web/**/* wikipedia: styles/wikipedia/**/* wikiwand: styles/wikiwand/**/* youtube: styles/youtube/**/* +zen-browser-docs: styles/zen-browser-docs/**/* diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml new file mode 100644 index 0000000000..a4ac1ef033 --- /dev/null +++ b/.github/workflows/build.yml @@ -0,0 +1,35 @@ +name: Build Stylus Export + +on: + workflow_dispatch: + push: + branches: [main] + paths-ignore: ["docs/**"] + +jobs: + build: + if: github.repository == 'catppuccin/userstyles' + runs-on: ubuntu-latest + permissions: + # Give the default GITHUB_TOKEN write permission to commit and push the + # added or changed files to the repository. + contents: write + + steps: + - uses: actions/checkout@df4cb1c069e1874edd31b4311f1884172cec0e10 # v6 + with: + token: ${{ secrets.USERSTYLES_TOKEN }} + + - name: Setup Deno + uses: denoland/setup-deno@v2 + with: + deno-version: v2.3.5 + cache: true + + - name: Generate Stylus import + run: deno task ci:stylus-import + + - name: Upload release artifact + run: gh release upload --clobber all-userstyles-export ./dist/import.json + env: + GH_TOKEN: ${{ github.token }} diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml new file mode 100644 index 0000000000..b26d21a5f0 --- /dev/null +++ b/.github/workflows/ci.yml @@ -0,0 +1,63 @@ +name: CI + +on: + push: + branches: [main] + +jobs: + ci: + runs-on: ubuntu-latest + permissions: + # Give the default GITHUB_TOKEN write permission to commit and push the + # added or changed files to the repository. + contents: write + + # Prevent infinite loops by checking if the last commit was autogenerated. + if: ${{ github.repository == 'catppuccin/userstyles' && github.event.commits[0].author.name != 'github-actions' }} + steps: + - uses: actions/checkout@df4cb1c069e1874edd31b4311f1884172cec0e10 # v6 + with: + token: ${{ secrets.USERSTYLES_TOKEN }} + fetch-depth: 2 + + - name: Setup Deno + uses: denoland/setup-deno@v2 + with: + deno-version: v2.3.5 + cache: true + + - name: Bump changed userstyles + run: | + git diff --name-only HEAD^1 HEAD | grep '^styles/.*catppuccin\.user\.less$' | xargs deno task ci:bump + + - name: Commit changes + uses: EndBug/add-and-commit@a94899bca583c204427a224a7af87c02f9b325d5 # v9 + with: + message: "chore: bump changed userstyles" + default_author: github_actions + push: false + + - name: Update generated files + run: deno task ci:generate + env: + GITHUB_TOKEN: ${{ secrets.USERSTYLES_TOKEN }} + + - name: Commit changes + uses: EndBug/add-and-commit@a94899bca583c204427a224a7af87c02f9b325d5 # v9 + with: + message: "chore: update generated files" + default_author: github_actions + push: false + + - name: Format files + run: deno fmt + + - name: Commit changes + uses: EndBug/add-and-commit@a94899bca583c204427a224a7af87c02f9b325d5 # v9 + with: + message: "style: deno fmt" + default_author: github_actions + push: false + + - name: Push changes + run: git push origin "HEAD:${{ github.ref }}" --atomic diff --git a/.github/workflows/deno-check.yml b/.github/workflows/deno-check.yml index a6e93b82b9..3a37242698 100644 --- a/.github/workflows/deno-check.yml +++ b/.github/workflows/deno-check.yml @@ -9,20 +9,20 @@ on: paths: ["**/*.ts"] jobs: - deno-check: - name: Check Deno code + check: + if: github.repository == 'catppuccin/userstyles' runs-on: ubuntu-latest steps: - - uses: actions/checkout@v4 + - uses: actions/checkout@df4cb1c069e1874edd31b4311f1884172cec0e10 # v6 - name: Setup Deno - uses: nekowinston/setup-deno@main + uses: denoland/setup-deno@v2 with: - deno-version: v1.x + deno-version: v2.3.5 + cache: true - name: Check run: | deno lint deno check **/*.ts - deno fmt --check **/*.ts diff --git a/.github/workflows/deno-lock.yml b/.github/workflows/deno-lock.yml index 4609442e6f..9fcefdfa63 100644 --- a/.github/workflows/deno-lock.yml +++ b/.github/workflows/deno-lock.yml @@ -11,20 +11,21 @@ jobs: runs-on: ubuntu-latest steps: - - uses: actions/checkout@v4 + - uses: actions/checkout@df4cb1c069e1874edd31b4311f1884172cec0e10 # v6 with: ref: ${{ github.event.pull_request.head.ref }} - name: Setup Deno - uses: nekowinston/setup-deno@main + uses: denoland/setup-deno@v2 with: - deno-version: v1.x + deno-version: v2.3.5 + cache: true - name: Regenerate Deno lock run: deno cache **/*.ts --lock=deno.lock - - name: Commit & Push - uses: EndBug/add-and-commit@v9 + - name: Commit & push changes + uses: EndBug/add-and-commit@a94899bca583c204427a224a7af87c02f9b325d5 # v9 with: message: "chore: regenerate `deno.lock`" default_author: github_actions diff --git a/.github/workflows/docs.yml b/.github/workflows/docs.yml new file mode 100644 index 0000000000..b9d9b0b90b --- /dev/null +++ b/.github/workflows/docs.yml @@ -0,0 +1,35 @@ +name: Deploy Docs to GH Pages + +on: + push: + branches: [main] + paths: + - "docs/**" + workflow_dispatch: + +permissions: + contents: read + pages: write + id-token: write + +jobs: + build: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@df4cb1c069e1874edd31b4311f1884172cec0e10 # v6 + - name: Build & Upload Site + uses: withastro/action@a4407e937037e68022f04ae1c068d3634f08bc8d # v4 + with: + path: ./docs + package-manager: pnpm@10.14.0 + + deploy: + needs: build + runs-on: ubuntu-latest + environment: + name: github-pages + url: ${{ steps.deployment.outputs.page_url }} + steps: + - name: Deploy to GitHub Pages + id: deployment + uses: actions/deploy-pages@d6db90164ac5ed86f2b6aed7e0febac5b3c0c03e # v4 diff --git a/.github/workflows/generate-format.yml b/.github/workflows/generate-format.yml deleted file mode 100644 index c1ef785fa7..0000000000 --- a/.github/workflows/generate-format.yml +++ /dev/null @@ -1,58 +0,0 @@ -name: Generate Health Files & Format - -on: - workflow_dispatch: - push: - branches: [main] - -env: - HAS_USERSTYLES_TOKEN: ${{ secrets.USERSTYLES_TOKEN != '' }} - -jobs: - generate-health-files-and-format: - name: Generate health files & format - runs-on: ubuntu-latest - permissions: - # Give the default GITHUB_TOKEN write permission to commit and push the - # added or changed files to the repository. - contents: write - - steps: - - uses: actions/checkout@v4 - if: env.HAS_USERSTYLES_TOKEN - with: - token: ${{ secrets.USERSTYLES_TOKEN }} - ref: ${{ github.ref }} - - uses: actions/checkout@v4 - if: env.HAS_USERSTYLES_TOKEN == 'false' - with: - ref: ${{ github.ref }} - - - name: Setup Deno - uses: nekowinston/setup-deno@main - with: - deno-version: v1.x - - - name: Generate health files - run: deno task ci:generate - - - name: Commit changes - uses: EndBug/add-and-commit@v9 - with: - message: "chore: generate health files" - default_author: github_actions - push: false - - - name: Format files - run: deno task format - - - name: Commit changes - uses: EndBug/add-and-commit@v9 - with: - message: "style: format code with prettier" - default_author: github_actions - push: false - - - name: Push changes - if: ${{ github.repository == 'catppuccin/userstyles' && github.ref == 'refs/heads/main' && env.HAS_USERSTYLES_TOKEN }} - run: git push origin "HEAD:${{ github.ref }}" --atomic diff --git a/.github/workflows/issues.yml b/.github/workflows/issues.yml index 48dca65c2d..1746b21619 100644 --- a/.github/workflows/issues.yml +++ b/.github/workflows/issues.yml @@ -7,12 +7,11 @@ on: jobs: triage: - name: Add labels runs-on: ubuntu-latest steps: - name: Add issue labels - uses: github/issue-labeler@v3.4 + uses: github/issue-labeler@c1b0f9f52a63158c4adc09425e858e87b32e9685 # v3.4 with: repo-token: "${{ secrets.GITHUB_TOKEN }}" configuration-path: .github/issue-labeler.yml diff --git a/.github/workflows/lint-build.yml b/.github/workflows/lint-build.yml deleted file mode 100644 index f8fe62599c..0000000000 --- a/.github/workflows/lint-build.yml +++ /dev/null @@ -1,54 +0,0 @@ -name: Lint & Build - -on: - workflow_dispatch: - pull_request: - paths-ignore: ["docs/**"] - push: - branches: [main] - paths-ignore: ["docs/**"] - -jobs: - lint: - name: Lint Userstyles - runs-on: ubuntu-latest - - steps: - - uses: actions/checkout@v4 - - - name: Setup Deno - uses: nekowinston/setup-deno@main - with: - deno-version: v1.x - - - name: Run Lint - run: deno task lint - - build: - name: Generate Stylus Export - runs-on: ubuntu-latest - needs: lint - if: ${{ github.repository == 'catppuccin/userstyles' && github.ref == 'refs/heads/main' }} - permissions: - # Give the default GITHUB_TOKEN write permission to commit and push the - # added or changed files to the repository. - contents: write - - steps: - - uses: actions/checkout@v4 - with: - token: ${{ secrets.USERSTYLES_TOKEN }} - ref: ${{ github.ref }} - - - name: Setup Deno - uses: nekowinston/setup-deno@main - with: - deno-version: v1.x - - - name: Generate import file - run: deno task ci:generate-import - - - name: Upload Release Artifacts - run: gh release upload --clobber all-userstyles-export ./dist/import.json - env: - GH_TOKEN: ${{ github.token }} diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml new file mode 100644 index 0000000000..ed8dccc5c2 --- /dev/null +++ b/.github/workflows/lint.yml @@ -0,0 +1,26 @@ +name: Lint Userstyles + +on: + workflow_dispatch: + pull_request: + paths-ignore: ["docs/**"] + push: + branches: [main] + paths-ignore: ["docs/**"] + +jobs: + lint: + if: github.repository == 'catppuccin/userstyles' + runs-on: ubuntu-latest + + steps: + - uses: actions/checkout@df4cb1c069e1874edd31b4311f1884172cec0e10 # v6 + + - name: Setup Deno + uses: denoland/setup-deno@v2 + with: + deno-version: v2.3.5 + cache: true + + - name: Lint + run: deno task lint diff --git a/.github/workflows/maintainers.yml b/.github/workflows/maintainers.yml index f046063086..a8baf49cea 100644 --- a/.github/workflows/maintainers.yml +++ b/.github/workflows/maintainers.yml @@ -3,26 +3,24 @@ name: Sync Maintainers on: workflow_dispatch: push: - paths: - - "scripts/userstyles.yml" + branches: [main] + paths: ["scripts/userstyles.yml"] jobs: sync-maintainers: - name: Sync maintainers + if: github.repository == 'catppuccin/userstyles' runs-on: ubuntu-latest steps: - - uses: actions/checkout@v4 - with: - ref: ${{ github.ref }} + - uses: actions/checkout@df4cb1c069e1874edd31b4311f1884172cec0e10 # v6 - name: Setup Deno - uses: nekowinston/setup-deno@main + uses: denoland/setup-deno@v2 with: - deno-version: v1.x + deno-version: v2.3.5 + cache: true - name: Sync maintainers - if: ${{ github.repository == 'catppuccin/userstyles' && github.ref == 'refs/heads/main' }} run: deno task ci:sync-maintainers env: GITHUB_TOKEN: ${{ secrets.USERSTYLES_TOKEN }} diff --git a/.github/workflows/pr-titles.yml b/.github/workflows/pr-titles.yml deleted file mode 100644 index fcc1da46df..0000000000 --- a/.github/workflows/pr-titles.yml +++ /dev/null @@ -1,45 +0,0 @@ -name: Pull Request Title Linter - -on: - pull_request_target: - types: [opened, edited, synchronize] - -jobs: - lint: - name: Lint pull request title - runs-on: ubuntu-latest - permissions: - pull-requests: write - - steps: - - name: Lint pull request title - uses: amannn/action-semantic-pull-request@v5 - id: lint_pr_title - env: - GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} - - - name: Add error comment - uses: marocchino/sticky-pull-request-comment@v2 - # When the previous steps fails, the workflow would stop. By adding this - # condition you can continue the execution with the populated error message. - if: always() && (steps.lint_pr_title.outputs.error_message != null) - with: - header: pr-title-lint-error - message: | - Hey there and thank you for opening this pull request! ๐Ÿ‘‹๐Ÿผ - - We require pull request titles to follow the [Conventional Commits specification](https://www.conventionalcommits.org/en/v1.0.0/) and it looks like your proposed title needs to be adjusted. - - Details: - - ``` - ${{ steps.lint_pr_title.outputs.error_message }} - ``` - - # Delete a previous comment when the issue has been resolved - - if: ${{ steps.lint_pr_title.outputs.error_message == null }} - name: Delete error comment - uses: marocchino/sticky-pull-request-comment@v2 - with: - header: pr-title-lint-error - delete: true diff --git a/.github/workflows/pull-requests.yml b/.github/workflows/pull-requests.yml index 511a89e932..94f70b653f 100644 --- a/.github/workflows/pull-requests.yml +++ b/.github/workflows/pull-requests.yml @@ -5,18 +5,16 @@ on: jobs: triage: - name: Add labels runs-on: ubuntu-latest - if: ${{ !contains(github.event.pull_request.title, '(tree-wide)') }} + if: ${{ !contains(github.event.pull_request.title, '(tree-wide)') && !contains(github.event.pull_request.title, '(treewide)') }} steps: - - uses: actions/checkout@v4 + - uses: actions/checkout@df4cb1c069e1874edd31b4311f1884172cec0e10 # v6 - name: Add pull request labels - uses: actions/labeler@v4.3.0 + uses: actions/labeler@ac9175f8a1f3625fd0d4fb234536d26811351594 # v4.3.0 with: configuration-path: .github/pr-labeler.yml sync-labels: true env: GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} -# yaml-language-server: $schema=https://json.schemastore.org/github-workflow.json diff --git a/.github/workflows/sync-labels.yml b/.github/workflows/sync-labels.yml index d730096633..8862ff28af 100644 --- a/.github/workflows/sync-labels.yml +++ b/.github/workflows/sync-labels.yml @@ -4,17 +4,15 @@ on: workflow_dispatch: push: branches: [main] - paths: - - ".github/labels.yml" + paths: [".github/labels.yml"] jobs: - update: - name: Sync labels + sync: + if: github.repository == 'catppuccin/userstyles' runs-on: ubuntu-latest steps: - name: Sync labels uses: r7kamura/github-label-sync-action@v0 - if: ${{ github.repository == 'catppuccin/userstyles' }} with: allow_added_labels: "true" diff --git a/.github/workflows/website.yml b/.github/workflows/website.yml deleted file mode 100644 index 4f5cfcbfd6..0000000000 --- a/.github/workflows/website.yml +++ /dev/null @@ -1,21 +0,0 @@ -name: Deploy Website - -on: - workflow_dispatch: - push: - branches: ["main"] - paths: ["scripts/userstyles.yml"] - -jobs: - deploy: - runs-on: ubuntu-latest - if: github.repository == 'catppuccin/userstyles' - environment: website - name: Vercel Deploy - steps: - - name: Deploy via cURL - shell: bash - env: - DEPLOY_HOOK: ${{ secrets.VERCEL_DEPLOY_HOOK }} - run: curl -X POST "$DEPLOY_HOOK" -# yaml-language-server: $schema=https://json.schemastore.org/github-workflow.json diff --git a/.prettierignore b/.prettierignore deleted file mode 100644 index da4e7973bb..0000000000 --- a/.prettierignore +++ /dev/null @@ -1,7 +0,0 @@ -# Deno code is formatted with `deno fmt` -/scripts/ - -# auto-generated files -/.github/ISSUE_TEMPLATE/userstyle.yml -/.github/*.yml -/styles/**/*.md diff --git a/.prettierrc b/.prettierrc deleted file mode 100644 index 304d4ef736..0000000000 --- a/.prettierrc +++ /dev/null @@ -1,8 +0,0 @@ -{ - "overrides": [ - { - "files": ["styles/**/*.css", "template/**/*.css"], - "options": { "parser": "less" } - } - ] -} diff --git a/.stylelintrc.js b/.stylelintrc.js index 922edf1795..f0f92128e4 100644 --- a/.stylelintrc.js +++ b/.stylelintrc.js @@ -5,10 +5,14 @@ */ export default { extends: "stylelint-config-standard", - plugins: ["./scripts/lint/stylelint-custom/optimized-svgs.js"], + plugins: [ + "./scripts/lint/stylelint-custom/index.js", + ], customSyntax: "postcss-less", rules: { "catppuccin/optimized-svgs": true, + "catppuccin/color-operations": true, + "catppuccin/no-redundant-parent-selector": true, "selector-class-pattern": null, "custom-property-pattern": null, @@ -178,5 +182,8 @@ export default { "at-rule-no-vendor-prefix": null, "no-descending-specificity": null, + "selector-not-notation": null, + + "import-notation": null, }, }; diff --git a/.vscode/extensions.json b/.vscode/extensions.json index 65a9ac33be..74baffcc47 100644 --- a/.vscode/extensions.json +++ b/.vscode/extensions.json @@ -1,3 +1,3 @@ { - "recommendations": ["denoland.vscode-deno", "esbenp.prettier-vscode"] + "recommendations": ["denoland.vscode-deno"] } diff --git a/.vscode/settings.json b/.vscode/settings.json index 271288afd1..82f594ebeb 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,14 +1,5 @@ { - "files.associations": { - "*.user.css": "less" - }, - "deno.enable": true, - - "[less]": { - "editor.defaultFormatter": "esbenp.prettier-vscode" - }, - "[typescript]": { - "editor.defaultFormatter": "denoland.vscode-deno" - } + "editor.defaultFormatter": "denoland.vscode-deno", + "markdown.extension.toc.updateOnSave": false } diff --git a/README.md b/README.md index 5b22e53d93..e97a129c78 100644 --- a/README.md +++ b/README.md @@ -5,18 +5,6 @@ -
- Install - ยท - Contributing - ยท - Userstyles -
- -

- -

-

@@ -25,258 +13,17 @@

-This repository is a curated collection of customized themes designed for various websites and web applications. -These themes showcase delightful pastel colors, creating a soothing and visually pleasing experience when browsing the web. +A curated collection of soothing pastel themes for your favorite websites and web applications.

-Userstyles are essentially modified CSS files which can be applied to a specific website, -giving it a unique and appealing aesthetic in line with Catppuccin's color palette. +

-  - -## ๐Ÿ–ฅ๏ธ Install - -Install [Stylus](https://github.com/openstyles/stylus) for your browser by clicking one of the badges below. -

- - +Visit userstyles.catppuccin.com to get started.

-> [!TIP] -> If you use Chrome, make sure to enable "Allow access to file URLs" in the Stylus extension settings. - -### All Userstyles (recommended) - -See instructions on the [GitHub release page](https://github.com/catppuccin/userstyles/releases/tag/all-userstyles-export). - -### Individual Userstyles - -1. Enable CSP Patching from Stylus's **Settings** > **Advanced**. -2. Install userstyles by clicking the **Stylus Install** badge in each README. -3. Enjoy! - -## Usage - -All usertyles come with three default configuration options; the light flavor, the dark flavor, and the accent color. Some userstyles may offer additional site-specific options as well. - -### Decentralized/self-hosted applications - -For decentralized or self-hosted applications, you can apply a theme to one or multiple instances across updates by following the instructions below. - -1. Open the Stylus "Manage" page. -2. Click on the userstyle's name in the list. -3. Click on **Style settings** in the left panel. -4. Enter the URL patterns for your instance(s) in the text box labeled **Custom included sites**. For example, to apply a userstyle to `example.org`, you would add a line with `https://example.org/*` to the textbox. The trailing asterisk applies it to all pages on the domain - without it, only the root page is themed. - -  - -## ๐Ÿ‘ Contributing - -> [!NOTE] -> If you would like to submit a userstyle or learn how to port Catppuccin to a website, please refer to [userstyle-creation.md](docs/userstyle-creation.md). - -See [CONTRIBUTING.md](docs/CONTRIBUTING.md). - -  - -## ๐Ÿ–Œ Userstyles - -> [!IMPORTANT] -> Userstyles labeled with the "๐Ÿšง" emoji are looking for maintainers, and may -> not work as intended. Contributions are still welcome and encouraged. If you -> would like to become a maintainer, follow the instructions outlined in -> "[Adding yourself as a maintainer](https://github.com/catppuccin/userstyles/blob/main/docs/userstylesyml.md#adding-yourself-as-a-maintainer)." - - - -
-๐Ÿ’ญ Development Tools - -- [boringproxy](styles/boringproxy) -- [Codeberg](styles/codeberg) -- [crates.io](styles/crates.io) -- [docs.rs](styles/docs.rs) -- [freedesktop.org](styles/freedesktop) -- [GitHub](styles/github) -- [go.dev](styles/go.dev) -- [Graphite](styles/graphite) -- [Hackage](styles/hackage) -- [Home Manager Options Search](styles/home-manager-options-search) -- [Hoppscotch](styles/hoppscotch) -- [Keyoxide](styles/keyoxide) -- [MDN](styles/mdn) -- [npm](styles/npm) -- [Ollama](styles/ollama) -- [paste.rs](styles/paste.rs) -- [PyPI](styles/pypi) -- [Stack Overflow](styles/stack-overflow) -- [Trinket](styles/trinket) -- [Vercel, Next.js](styles/vercel) -- [web.dev](styles/web.dev) - -
-
-๐Ÿงฉ Browser Extensions - -- [Shinigami Eyes](styles/shinigami-eyes) -- [Stylus](styles/stylus) - -
-
-๐Ÿ”Ž Search Engines - -- [Brave Search](styles/brave-search) -- [DuckDuckGo](styles/duckduckgo) -- [Ecosia](styles/ecosia) -- [Google](styles/google) -- [NixOS Search](styles/nixos-search) -- [SearXNG](styles/searxng) -- ๐Ÿšง [Startpage](styles/startpage) - -
-
-๐Ÿ—บ๏ธ Translation Tools - -- [Crowdin](styles/crowdin) -- [DeepL](styles/deepl) -- [ichi.moe](styles/ichi.moe) -- [Lingva](styles/lingva) - -
-
-๐Ÿง  Wikis - -- ๐Ÿšง [Arch Wiki](styles/arch-wiki) -- [mdBook](styles/mdbook) -- ๐Ÿšง [NixOS Wiki](styles/nixos.wiki) -- [Wikipedia](styles/wikipedia) -- [Wikiwand](styles/wikiwand) - -
-
-๐Ÿ“ธ Photo & Video - -- [Google Photos](styles/google-photos) -- ๐Ÿšง [Pinterest](styles/pinterest) - -
-
-๐ŸŽต Music - -- [Hyperpipe](styles/hyperpipe) -- [Last.fm](styles/lastfm) -- [ListenBrainz](styles/listenbrainz) -- [Spotify Web](styles/spotify-web) - -
-
-๐Ÿ“– Productivity - -- [Amplenote](styles/amplenote) -- [cobalt](styles/cobalt) -- [Google Drive](styles/google-drive) -- [Have I Been Pwned](styles/have-i-been-pwned) -- [homepage](styles/homepage) -- [inoreader](styles/inoreader) -- [Microsoft Word](styles/microsoft-word) -- [openmediavault](styles/openmediavault) -- [Porkbun](styles/porkbun) -- [Proton](styles/proton) -- [Raindrop](styles/raindrop) -- [Syncthing](styles/syncthing) -- [tldraw](styles/tldraw) -- [Vikunja](styles/vikunja) - -
-
-๐Ÿ’Œ Email Clients - -- [Gmail](styles/gmail) -- [Migadu Webmail](styles/migadu-webmail) -- [Tuta](styles/tuta) - -
-
-๐Ÿ•น๏ธ Game Development - -- [NameMC](styles/namemc) - -
-
-๐ŸŽ“ Education - -- ๐Ÿšง [Canvas LMS](styles/canvas-lms) -- [Formative](styles/formative) -- [Quizlet](styles/quizlet) - -
-
-โœจ Social Networking - -- [Bluesky Social](styles/bsky) -- [Cinny](styles/cinny) -- [Elk](styles/elk) -- [Instagram](styles/instagram) -- [LinkedIn](styles/linkedin) -- ๐Ÿšง [Mastodon](styles/mastodon) -- [Nitter](styles/nitter) -- [Phanpy](styles/phanpy) -- [Pronouns.page](styles/pronouns.page) -- [Snapchat Web](styles/snapchat-web) -- [Twitter](styles/twitter) -- [WhatsApp Web](styles/whatsapp-web) - -
-
-๐Ÿ—ฃ๏ธ Discussion Forums - -- [Hacker News](styles/hacker-news) -- [Lemmy](styles/lemmy) -- ๐Ÿšง [Libreddit, Redlib](styles/libreddit) -- ๐Ÿšง [Reddit](styles/reddit) -- [TabNews](styles/tabnews) - -
-
-๐ŸŒˆ Entertainment - -- [AniList, AniChart](styles/anilist) -- [ChatReplay](styles/chatreplay) -- [Holodex](styles/holodex) -- ๐Ÿšง [Invidious](styles/invidious) -- [Picrew](styles/picrew) -- ๐Ÿšง [Substack](styles/substack) -- [Twitch](styles/twitch) -- [YouTube](styles/youtube) - -
-
-๐ŸŽฎ Games - -- [Advent Of Code](styles/advent-of-code) -- [bStats](styles/bstats) -- ๐Ÿšง [Chess.com](styles/chess.com) -- [Lichess](styles/lichess) -- [Minesweeper Online](styles/minesweeper) -- [Modrinth](styles/modrinth) -- [Planet Minecraft](styles/planet-minecraft) - -
-
-๐Ÿค– Artificial Intelligence - -- [ChatGPT](styles/chatgpt) -- [Google Gemini](styles/google-gemini) -- [InvokeAI](styles/invokeai) -- [Perplexity](styles/perplexity) - -
- - -  

diff --git a/deno.json b/deno.json index db484a6656..5b117fa20d 100644 --- a/deno.json +++ b/deno.json @@ -1,37 +1,64 @@ { "imports": { "@/": "./scripts/", - "@actions/core": "npm:@actions/core@1.10.1", - "@catppuccin/palette": "npm:@catppuccin/palette@1.2.0", - "@octokit/rest": "npm:@octokit/rest@21.0.1", - "@std/assert": "jsr:@std/assert@^1.0.4", - "@std/cli": "jsr:@std/cli@^1.0.5", + "@actions/core": "npm:@actions/core@1.11.1", + "@catppuccin/catppuccin/": "https://raw.githubusercontent.com/catppuccin/catppuccin/d4f82739e687cfd19d168be355367fdbbcc8e029/", + "@catppuccin/palette": "npm:@catppuccin/palette@^1.7.1", + "@octokit/rest": "npm:@octokit/rest@^21.0.2", + "@std/assert": "jsr:@std/assert@^1.0.9", + "@std/async": "jsr:@std/async@^1.2.0", + "@std/cli": "jsr:@std/cli@^1.0.8", "@std/fmt": "jsr:@std/fmt@^1.0.2", - "@std/fs": "jsr:@std/fs@^1.0.3", - "@std/path": "jsr:@std/path@^1.0.4", + "@std/fs": "jsr:@std/fs@^1.0.6", + "@std/http": "jsr:@std/http@^1.0.25", + "@std/path": "jsr:@std/path@^1.0.8", + "@std/testing": "jsr:@std/testing@^1.0.17", "@std/yaml": "jsr:@std/yaml@^1.0.5", - "ajv": "npm:ajv@8.17.1", - "catppuccin-repo/": "https://raw.githubusercontent.com/catppuccin/catppuccin/d4f2666c2b04337f0a8632713de0889d9a7d332d/", + "ajv": "npm:ajv@8.18.0", "handlebars": "npm:handlebars@4.7.8", - "json-schema-to-typescript": "npm:json-schema-to-typescript@15.0.2", - "less": "npm:less@4.2.0", + "json-schema-to-typescript": "npm:json-schema-to-typescript@^15.0.3", + "less": "npm:less@4.2.2", "postcss-less": "npm:postcss-less@6.0.0", "postcss-value-parser": "npm:postcss-value-parser@4.2.0", - "stylelint": "npm:stylelint@16.9.0", + "stylelint": "npm:stylelint@^16.12.0", "stylelint-config-recommended": "npm:stylelint-config-recommended@14.0.1", "stylelint-config-standard": "npm:stylelint-config-standard@36.0.1", - "svgo": "npm:svgo@3.3.2", - "type-fest": "npm:type-fest@4.23.0", + "svgo": "npm:svgo@4.0.0", + "type-fest": "npm:type-fest@^4.30.2", "usercss-meta": "npm:usercss-meta@0.12.0" }, "tasks": { "ci:generate": "deno run -A ./scripts/generate/main.ts", - "ci:generate-import": "deno run -A ./scripts/import-styles/main.ts", + "ci:stylus-import": "deno run -A ./scripts/stylus-import/main.ts", "ci:sync-maintainers": "deno run -A ./scripts/sync-maintainers/main.ts", + "ci:update-types": "deno run -A ./scripts/types/update-types.ts", + "ci:bump": "deno run -A ./scripts/bump-version/main.ts", "lint": "deno run -A ./scripts/lint/main.ts", "lint:fix": "deno task lint --fix", - "update-types": "deno run -A ./scripts/update-types.ts", - "format": "deno run -A npm:prettier@3.2.4 --write ." + "serve": "deno run -A ./scripts/serve/main.ts", + "test": "deno test -A", + "test:update": "deno test -A -- --update" }, - "nodeModulesDir": true + "nodeModulesDir": "auto", + "fmt": { + "indentWidth": 2, + "proseWrap": "never", + "exclude": [ + ".github/ISSUE_TEMPLATE/userstyle.yml", + ".github/*.yml", + "styles/**/*.md", + "scripts/generate/templates/userstyle.md", + "docs/pnpm-lock.yaml" + ] + }, + "lint": { + "rules": { + "tags": [ + "recommended" + ], + "include": [ + "verbatim-module-syntax" + ] + } + } } diff --git a/deno.lock b/deno.lock index bf0b648faf..4ba3c226e2 100644 --- a/deno.lock +++ b/deno.lock @@ -1,1335 +1,1165 @@ { - "version": "3", - "packages": { - "specifiers": { - "jsr:@std/assert@^0.224.0": "jsr:@std/assert@0.224.0", - "jsr:@std/assert@^1.0.4": "jsr:@std/assert@1.0.4", - "jsr:@std/cli@^1.0.5": "jsr:@std/cli@1.0.5", - "jsr:@std/fmt@^1.0.2": "jsr:@std/fmt@1.0.2", - "jsr:@std/fs@^1.0.3": "jsr:@std/fs@1.0.3", - "jsr:@std/internal@^1.0.3": "jsr:@std/internal@1.0.3", - "jsr:@std/path@^1.0.2": "jsr:@std/path@1.0.3", - "jsr:@std/path@^1.0.3": "jsr:@std/path@1.0.4", - "jsr:@std/path@^1.0.4": "jsr:@std/path@1.0.4", - "jsr:@std/yaml@^1.0.5": "jsr:@std/yaml@1.0.5", - "npm:@actions/core@1.10.1": "npm:@actions/core@1.10.1", - "npm:@catppuccin/palette@1.2.0": "npm:@catppuccin/palette@1.2.0", - "npm:@octokit/rest@21.0.1": "npm:@octokit/rest@21.0.1_@octokit+core@6.1.2", - "npm:@types/less": "npm:@types/less@3.0.6", - "npm:@types/node": "npm:@types/node@18.16.19", - "npm:ajv@8.17.1": "npm:ajv@8.17.1", - "npm:handlebars@4.7.8": "npm:handlebars@4.7.8", - "npm:json-schema-to-typescript@15.0.2": "npm:json-schema-to-typescript@15.0.2", - "npm:less@4.2.0": "npm:less@4.2.0", - "npm:postcss-less@6.0.0": "npm:postcss-less@6.0.0_postcss@8.4.39", - "npm:postcss-value-parser@4.2.0": "npm:postcss-value-parser@4.2.0", - "npm:prettier@3.2.4": "npm:prettier@3.2.4", - "npm:stylelint": "npm:stylelint@16.9.0_@csstools+css-tokenizer@3.0.1_@csstools+css-parser-algorithms@3.0.1__@csstools+css-tokenizer@3.0.1_postcss-selector-parser@6.1.2_postcss@8.4.44", - "npm:stylelint-config-recommended@14.0.1": "npm:stylelint-config-recommended@14.0.1_stylelint@16.9.0__@csstools+css-tokenizer@3.0.1__@csstools+css-parser-algorithms@3.0.1___@csstools+css-tokenizer@3.0.1__postcss-selector-parser@6.1.2__postcss@8.4.44", - "npm:stylelint-config-standard@36.0.1": "npm:stylelint-config-standard@36.0.1_stylelint@16.9.0__@csstools+css-tokenizer@3.0.1__@csstools+css-parser-algorithms@3.0.1___@csstools+css-tokenizer@3.0.1__postcss-selector-parser@6.1.2__postcss@8.4.44", - "npm:stylelint@16.9.0": "npm:stylelint@16.9.0_@csstools+css-tokenizer@3.0.1_@csstools+css-parser-algorithms@3.0.1__@csstools+css-tokenizer@3.0.1_postcss-selector-parser@6.1.2_postcss@8.4.44", - "npm:svgo@3.3.2": "npm:svgo@3.3.2", - "npm:type-fest@4.23.0": "npm:type-fest@4.23.0", - "npm:usercss-meta@0.12.0": "npm:usercss-meta@0.12.0" - }, - "jsr": { - "@std/assert@0.224.0": { - "integrity": "8643233ec7aec38a940a8264a6e3eed9bfa44e7a71cc6b3c8874213ff401967f" - }, - "@std/assert@1.0.4": { - "integrity": "d4c767ea578e5bc09c15b6e503376003e5b2d1f4c0cdf08524a92101ff4d7b96", - "dependencies": [ - "jsr:@std/internal@^1.0.3" - ] - }, - "@std/cli@1.0.5": { - "integrity": "c93cce26ffd26f617c15a12874e1bfeabc90b1eee86017c9639093734c2bf587" - }, - "@std/fmt@1.0.2": { - "integrity": "87e9dfcdd3ca7c066e0c3c657c1f987c82888eb8103a3a3baa62684ffeb0f7a7" - }, - "@std/fs@1.0.1": { - "integrity": "d6914ca2c21abe591f733b31dbe6331e446815e513e2451b3b9e472daddfefcb", - "dependencies": [ - "jsr:@std/path@^1.0.2" - ] - }, - "@std/fs@1.0.3": { - "integrity": "3cb839b1360b0a42d8b367c3093bfe4071798e6694fa44cf1963e04a8edba4fe", - "dependencies": [ - "jsr:@std/path@^1.0.4" - ] - }, - "@std/internal@1.0.3": { - "integrity": "208e9b94a3d5649bd880e9ca38b885ab7651ab5b5303a56ed25de4755fb7b11e" - }, - "@std/path@1.0.2": { - "integrity": "a452174603f8c620bd278a380c596437a9eef50c891c64b85812f735245d9ec7" - }, - "@std/path@1.0.3": { - "integrity": "cd89d014ce7eb3742f2147b990f6753ee51d95276bfc211bc50c860c1bc7df6f" - }, - "@std/path@1.0.4": { - "integrity": "48dd5d8389bcfcd619338a01bdf862cb7799933390146a54ae59356a0acc7105" - }, - "@std/yaml@1.0.4": { - "integrity": "f1e38fa5e110ff8550e938715e52c33347676dd00a1db858e092dd21a9df9941" - }, - "@std/yaml@1.0.5": { - "integrity": "71ba3d334305ee2149391931508b2c293a8490f94a337eef3a09cade1a2a2742" - } - }, - "npm": { - "@actions/core@1.10.1": { - "integrity": "sha512-3lBR9EDAY+iYIpTnTIXmWcNbX3T2kCkAEQGIQx4NVQ0575nk2k3GRZDTPQG+vVtS2izSLmINlxXf0uLtnrTP+g==", - "dependencies": { - "@actions/http-client": "@actions/http-client@2.2.1", - "uuid": "uuid@8.3.2" - } - }, - "@actions/http-client@2.2.1": { - "integrity": "sha512-KhC/cZsq7f8I4LfZSJKgCvEwfkE8o1538VoBeoGzokVLLnbFDEAdFD3UhoMklxo2un9NJVBdANOresx7vTHlHw==", - "dependencies": { - "tunnel": "tunnel@0.0.6", - "undici": "undici@5.28.4" - } - }, - "@apidevtools/json-schema-ref-parser@11.7.0": { - "integrity": "sha512-pRrmXMCwnmrkS3MLgAIW5dXRzeTv6GLjkjb4HmxNnvAKXN1Nfzp4KmGADBQvlVUcqi+a5D+hfGDLLnd5NnYxog==", - "dependencies": { - "@jsdevtools/ono": "@jsdevtools/ono@7.1.3", - "@types/json-schema": "@types/json-schema@7.0.15", - "js-yaml": "js-yaml@4.1.0" - } - }, - "@babel/code-frame@7.24.7": { - "integrity": "sha512-BcYH1CVJBO9tvyIZ2jVeXgSIMvGZ2FDRvDdOIVQyuklNKSsx+eppDEBq/g47Ayw+RqNFE+URvOShmf+f/qwAlA==", - "dependencies": { - "@babel/highlight": "@babel/highlight@7.24.7", - "picocolors": "picocolors@1.0.1" - } - }, - "@babel/helper-validator-identifier@7.24.7": { - "integrity": "sha512-rR+PBcQ1SMQDDyF6X0wxtG8QyLCgUB0eRAGguqRLfkCA87l7yAP7ehq8SNj96OOGTO8OBV70KhuFYcIkHXOg0w==", - "dependencies": {} - }, - "@babel/highlight@7.24.7": { - "integrity": "sha512-EStJpq4OuY8xYfhGVXngigBJRWxftKX9ksiGDnmlY3o7B/V7KIAc9X4oiK87uPJSc/vs5L869bem5fhZa8caZw==", - "dependencies": { - "@babel/helper-validator-identifier": "@babel/helper-validator-identifier@7.24.7", - "chalk": "chalk@2.4.2", - "js-tokens": "js-tokens@4.0.0", - "picocolors": "picocolors@1.0.1" - } - }, - "@catppuccin/palette@1.2.0": { - "integrity": "sha512-R5fxLcU47mRcsdQkXZBNfxt7SdEqLGWb1qhEKBrnYfEB4ZWOQRBEow4e78PKxaFUECBNOs6uEkwvwxFL9FmQqQ==", - "dependencies": {} - }, - "@csstools/css-parser-algorithms@3.0.1_@csstools+css-tokenizer@3.0.1": { - "integrity": "sha512-lSquqZCHxDfuTg/Sk2hiS0mcSFCEBuj49JfzPHJogDBT0mGCyY5A1AQzBWngitrp7i1/HAZpIgzF/VjhOEIJIg==", - "dependencies": { - "@csstools/css-tokenizer": "@csstools/css-tokenizer@3.0.1" - } - }, - "@csstools/css-tokenizer@3.0.1": { - "integrity": "sha512-UBqaiu7kU0lfvaP982/o3khfXccVlHPWp0/vwwiIgDF0GmqqqxoiXC/6FCjlS9u92f7CoEz6nXKQnrn1kIAkOw==", - "dependencies": {} - }, - "@csstools/media-query-list-parser@3.0.1_@csstools+css-parser-algorithms@3.0.1__@csstools+css-tokenizer@3.0.1_@csstools+css-tokenizer@3.0.1": { - "integrity": "sha512-HNo8gGD02kHmcbX6PvCoUuOQvn4szyB9ca63vZHKX5A81QytgDG4oxG4IaEfHTlEZSZ6MjPEMWIVU+zF2PZcgw==", - "dependencies": { - "@csstools/css-parser-algorithms": "@csstools/css-parser-algorithms@3.0.1_@csstools+css-tokenizer@3.0.1", - "@csstools/css-tokenizer": "@csstools/css-tokenizer@3.0.1" - } - }, - "@csstools/selector-specificity@4.0.0_postcss-selector-parser@6.1.2": { - "integrity": "sha512-189nelqtPd8++phaHNwYovKZI0FOzH1vQEE3QhHHkNIGrg5fSs9CbYP3RvfEH5geztnIA9Jwq91wyOIwAW5JIQ==", - "dependencies": { - "postcss-selector-parser": "postcss-selector-parser@6.1.2" - } - }, - "@dual-bundle/import-meta-resolve@4.1.0": { - "integrity": "sha512-+nxncfwHM5SgAtrVzgpzJOI1ol0PkumhVo469KCf9lUi21IGcY90G98VuHm9VRrUypmAzawAHO9bs6hqeADaVg==", - "dependencies": {} - }, - "@fastify/busboy@2.1.1": { - "integrity": "sha512-vBZP4NlzfOlerQTnba4aqZoMhE/a9HY7HRqoOPaETQcSQuWEIyZMHGfVu6w9wGtGK5fED5qRs2DteVCjOH60sA==", - "dependencies": {} - }, - "@isaacs/cliui@8.0.2": { - "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==", - "dependencies": { - "string-width": "string-width@5.1.2", - "string-width-cjs": "string-width@4.2.3", - "strip-ansi": "strip-ansi@7.1.0", - "strip-ansi-cjs": "strip-ansi@6.0.1", - "wrap-ansi": "wrap-ansi@8.1.0", - "wrap-ansi-cjs": "wrap-ansi@7.0.0" - } - }, - "@jsdevtools/ono@7.1.3": { - "integrity": "sha512-4JQNk+3mVzK3xh2rqd6RB4J46qUR19azEHBneZyTZM+c456qOrbbM/5xcR8huNCCcbVt7+UmizG6GuUvPvKUYg==", - "dependencies": {} - }, - "@nodelib/fs.scandir@2.1.5": { - "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", - "dependencies": { - "@nodelib/fs.stat": "@nodelib/fs.stat@2.0.5", - "run-parallel": "run-parallel@1.2.0" - } - }, - "@nodelib/fs.stat@2.0.5": { - "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", - "dependencies": {} - }, - "@nodelib/fs.walk@1.2.8": { - "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", - "dependencies": { - "@nodelib/fs.scandir": "@nodelib/fs.scandir@2.1.5", - "fastq": "fastq@1.17.1" - } - }, - "@octokit/auth-token@5.1.1": { - "integrity": "sha512-rh3G3wDO8J9wSjfI436JUKzHIxq8NaiL0tVeB2aXmG6p/9859aUOAjA9pmSPNGGZxfwmaJ9ozOJImuNVJdpvbA==", - "dependencies": {} - }, - "@octokit/core@6.1.2": { - "integrity": "sha512-hEb7Ma4cGJGEUNOAVmyfdB/3WirWMg5hDuNFVejGEDFqupeOysLc2sG6HJxY2etBp5YQu5Wtxwi020jS9xlUwg==", - "dependencies": { - "@octokit/auth-token": "@octokit/auth-token@5.1.1", - "@octokit/graphql": "@octokit/graphql@8.1.1", - "@octokit/request": "@octokit/request@9.1.3", - "@octokit/request-error": "@octokit/request-error@6.1.4", - "@octokit/types": "@octokit/types@13.5.0", - "before-after-hook": "before-after-hook@3.0.2", - "universal-user-agent": "universal-user-agent@7.0.2" - } - }, - "@octokit/endpoint@10.1.1": { - "integrity": "sha512-JYjh5rMOwXMJyUpj028cu0Gbp7qe/ihxfJMLc8VZBMMqSwLgOxDI1911gV4Enl1QSavAQNJcwmwBF9M0VvLh6Q==", - "dependencies": { - "@octokit/types": "@octokit/types@13.5.0", - "universal-user-agent": "universal-user-agent@7.0.2" - } - }, - "@octokit/graphql@8.1.1": { - "integrity": "sha512-ukiRmuHTi6ebQx/HFRCXKbDlOh/7xEV6QUXaE7MJEKGNAncGI/STSbOkl12qVXZrfZdpXctx5O9X1AIaebiDBg==", - "dependencies": { - "@octokit/request": "@octokit/request@9.1.3", - "@octokit/types": "@octokit/types@13.5.0", - "universal-user-agent": "universal-user-agent@7.0.2" - } - }, - "@octokit/openapi-types@22.2.0": { - "integrity": "sha512-QBhVjcUa9W7Wwhm6DBFu6ZZ+1/t/oYxqc2tp81Pi41YNuJinbFRx8B133qVOrAaBbF7D/m0Et6f9/pZt9Rc+tg==", - "dependencies": {} - }, - "@octokit/plugin-paginate-rest@11.3.3_@octokit+core@6.1.2": { - "integrity": "sha512-o4WRoOJZlKqEEgj+i9CpcmnByvtzoUYC6I8PD2SA95M+BJ2x8h7oLcVOg9qcowWXBOdcTRsMZiwvM3EyLm9AfA==", - "dependencies": { - "@octokit/core": "@octokit/core@6.1.2", - "@octokit/types": "@octokit/types@13.5.0" - } - }, - "@octokit/plugin-request-log@5.3.1_@octokit+core@6.1.2": { - "integrity": "sha512-n/lNeCtq+9ofhC15xzmJCNKP2BWTv8Ih2TTy+jatNCCq/gQP/V7rK3fjIfuz0pDWDALO/o/4QY4hyOF6TQQFUw==", - "dependencies": { - "@octokit/core": "@octokit/core@6.1.2" - } - }, - "@octokit/plugin-rest-endpoint-methods@13.2.4_@octokit+core@6.1.2": { - "integrity": "sha512-gusyAVgTrPiuXOdfqOySMDztQHv6928PQ3E4dqVGEtOvRXAKRbJR4b1zQyniIT9waqaWk/UDaoJ2dyPr7Bk7Iw==", - "dependencies": { - "@octokit/core": "@octokit/core@6.1.2", - "@octokit/types": "@octokit/types@13.5.0" - } - }, - "@octokit/request-error@6.1.4": { - "integrity": "sha512-VpAhIUxwhWZQImo/dWAN/NpPqqojR6PSLgLYAituLM6U+ddx9hCioFGwBr5Mi+oi5CLeJkcAs3gJ0PYYzU6wUg==", - "dependencies": { - "@octokit/types": "@octokit/types@13.5.0" - } - }, - "@octokit/request@9.1.3": { - "integrity": "sha512-V+TFhu5fdF3K58rs1pGUJIDH5RZLbZm5BI+MNF+6o/ssFNT4vWlCh/tVpF3NxGtP15HUxTTMUbsG5llAuU2CZA==", - "dependencies": { - "@octokit/endpoint": "@octokit/endpoint@10.1.1", - "@octokit/request-error": "@octokit/request-error@6.1.4", - "@octokit/types": "@octokit/types@13.5.0", - "universal-user-agent": "universal-user-agent@7.0.2" - } - }, - "@octokit/rest@21.0.1_@octokit+core@6.1.2": { - "integrity": "sha512-RWA6YU4CqK0h0J6tfYlUFnH3+YgBADlxaHXaKSG+BVr2y4PTfbU2tlKuaQoQZ83qaTbi4CUxLNAmbAqR93A6mQ==", - "dependencies": { - "@octokit/core": "@octokit/core@6.1.2", - "@octokit/plugin-paginate-rest": "@octokit/plugin-paginate-rest@11.3.3_@octokit+core@6.1.2", - "@octokit/plugin-request-log": "@octokit/plugin-request-log@5.3.1_@octokit+core@6.1.2", - "@octokit/plugin-rest-endpoint-methods": "@octokit/plugin-rest-endpoint-methods@13.2.4_@octokit+core@6.1.2" - } - }, - "@octokit/types@13.5.0": { - "integrity": "sha512-HdqWTf5Z3qwDVlzCrP8UJquMwunpDiMPt5er+QjGzL4hqr/vBVY/MauQgS1xWxCDT1oMx1EULyqxncdCY/NVSQ==", - "dependencies": { - "@octokit/openapi-types": "@octokit/openapi-types@22.2.0" - } - }, - "@pkgjs/parseargs@0.11.0": { - "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==", - "dependencies": {} - }, - "@trysound/sax@0.2.0": { - "integrity": "sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==", - "dependencies": {} - }, - "@types/json-schema@7.0.15": { - "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==", - "dependencies": {} - }, - "@types/less@3.0.6": { - "integrity": "sha512-PecSzorDGdabF57OBeQO/xFbAkYWo88g4Xvnsx7LRwqLC17I7OoKtA3bQB9uXkY6UkMWCOsA8HSVpaoitscdXw==", - "dependencies": {} - }, - "@types/lodash@4.17.7": { - "integrity": "sha512-8wTvZawATi/lsmNu10/j2hk1KEP0IvjubqPE3cu1Xz7xfXXt5oCq3SNUz4fMIP4XGF9Ky+Ue2tBA3hcS7LSBlA==", - "dependencies": {} - }, - "@types/node@18.16.19": { - "integrity": "sha512-IXl7o+R9iti9eBW4Wg2hx1xQDig183jj7YLn8F7udNceyfkbn1ZxmzZXuak20gR40D7pIkIY1kYGx5VIGbaHKA==", - "dependencies": {} - }, - "ajv@8.17.1": { - "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==", - "dependencies": { - "fast-deep-equal": "fast-deep-equal@3.1.3", - "fast-uri": "fast-uri@3.0.1", - "json-schema-traverse": "json-schema-traverse@1.0.0", - "require-from-string": "require-from-string@2.0.2" - } - }, - "ansi-regex@5.0.1": { - "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", - "dependencies": {} - }, - "ansi-regex@6.0.1": { - "integrity": "sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==", - "dependencies": {} - }, - "ansi-styles@3.2.1": { - "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==", - "dependencies": { - "color-convert": "color-convert@1.9.3" - } - }, - "ansi-styles@4.3.0": { - "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", - "dependencies": { - "color-convert": "color-convert@2.0.1" - } - }, - "ansi-styles@6.2.1": { - "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==", - "dependencies": {} - }, - "argparse@2.0.1": { - "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==", - "dependencies": {} - }, - "array-union@2.1.0": { - "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==", - "dependencies": {} - }, - "astral-regex@2.0.0": { - "integrity": "sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==", - "dependencies": {} - }, - "balanced-match@1.0.2": { - "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", - "dependencies": {} - }, - "balanced-match@2.0.0": { - "integrity": "sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==", - "dependencies": {} - }, - "before-after-hook@3.0.2": { - "integrity": "sha512-Nik3Sc0ncrMK4UUdXQmAnRtzmNQTAAXmXIopizwZ1W1t8QmfJj+zL4OA2I7XPTPW5z5TDqv4hRo/JzouDJnX3A==", - "dependencies": {} - }, - "boolbase@1.0.0": { - "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==", - "dependencies": {} - }, - "brace-expansion@2.0.1": { - "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", - "dependencies": { - "balanced-match": "balanced-match@1.0.2" - } - }, - "braces@3.0.3": { - "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", - "dependencies": { - "fill-range": "fill-range@7.1.1" - } - }, - "callsites@3.1.0": { - "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==", - "dependencies": {} - }, - "chalk@2.4.2": { - "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==", - "dependencies": { - "ansi-styles": "ansi-styles@3.2.1", - "escape-string-regexp": "escape-string-regexp@1.0.5", - "supports-color": "supports-color@5.5.0" - } - }, - "color-convert@1.9.3": { - "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==", - "dependencies": { - "color-name": "color-name@1.1.3" - } - }, - "color-convert@2.0.1": { - "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", - "dependencies": { - "color-name": "color-name@1.1.4" - } - }, - "color-name@1.1.3": { - "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==", - "dependencies": {} - }, - "color-name@1.1.4": { - "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", - "dependencies": {} - }, - "colord@2.9.3": { - "integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==", - "dependencies": {} - }, - "commander@7.2.0": { - "integrity": "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==", - "dependencies": {} - }, - "copy-anything@2.0.6": { - "integrity": "sha512-1j20GZTsvKNkc4BY3NpMOM8tt///wY3FpIzozTOFO2ffuZcV61nojHXVKIy3WM+7ADCy5FVhdZYHYDdgTU0yJw==", - "dependencies": { - "is-what": "is-what@3.14.1" - } - }, - "cosmiconfig@9.0.0": { - "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==", - "dependencies": { - "env-paths": "env-paths@2.2.1", - "import-fresh": "import-fresh@3.3.0", - "js-yaml": "js-yaml@4.1.0", - "parse-json": "parse-json@5.2.0" - } - }, - "cross-spawn@7.0.3": { - "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==", - "dependencies": { - "path-key": "path-key@3.1.1", - "shebang-command": "shebang-command@2.0.0", - "which": "which@2.0.2" - } - }, - "css-functions-list@3.2.2": { - "integrity": "sha512-c+N0v6wbKVxTu5gOBBFkr9BEdBWaqqjQeiJ8QvSRIJOf+UxlJh930m8e6/WNeODIK0mYLFkoONrnj16i2EcvfQ==", - "dependencies": {} - }, - "css-select@5.1.0": { - "integrity": "sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg==", - "dependencies": { - "boolbase": "boolbase@1.0.0", - "css-what": "css-what@6.1.0", - "domhandler": "domhandler@5.0.3", - "domutils": "domutils@3.1.0", - "nth-check": "nth-check@2.1.1" - } - }, - "css-tree@2.2.1": { - "integrity": "sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA==", - "dependencies": { - "mdn-data": "mdn-data@2.0.28", - "source-map-js": "source-map-js@1.2.0" - } - }, - "css-tree@2.3.1": { - "integrity": "sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==", - "dependencies": { - "mdn-data": "mdn-data@2.0.30", - "source-map-js": "source-map-js@1.2.0" - } - }, - "css-what@6.1.0": { - "integrity": "sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==", - "dependencies": {} - }, - "cssesc@3.0.0": { - "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==", - "dependencies": {} - }, - "csso@5.0.5": { - "integrity": "sha512-0LrrStPOdJj+SPCCrGhzryycLjwcgUSHBtxNA8aIDxf0GLsRh1cKYhB00Gd1lDOS4yGH69+SNn13+TWbVHETFQ==", - "dependencies": { - "css-tree": "css-tree@2.2.1" - } - }, - "debug@4.3.6": { - "integrity": "sha512-O/09Bd4Z1fBrU4VzkhFqVgpPzaGbw6Sm9FEkBT1A/YBXQFGuuSxa1dN2nxgxS34JmKXqYx8CZAwEVoJFImUXIg==", - "dependencies": { - "ms": "ms@2.1.2" - } - }, - "dir-glob@3.0.1": { - "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==", - "dependencies": { - "path-type": "path-type@4.0.0" - } - }, - "dom-serializer@2.0.0": { - "integrity": "sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==", - "dependencies": { - "domelementtype": "domelementtype@2.3.0", - "domhandler": "domhandler@5.0.3", - "entities": "entities@4.5.0" - } - }, - "domelementtype@2.3.0": { - "integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==", - "dependencies": {} - }, - "domhandler@5.0.3": { - "integrity": "sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==", - "dependencies": { - "domelementtype": "domelementtype@2.3.0" - } - }, - "domutils@3.1.0": { - "integrity": "sha512-H78uMmQtI2AhgDJjWeQmHwJJ2bLPD3GMmO7Zja/ZZh84wkm+4ut+IUnUdRa8uCGX88DiVx1j6FRe1XfxEgjEZA==", - "dependencies": { - "dom-serializer": "dom-serializer@2.0.0", - "domelementtype": "domelementtype@2.3.0", - "domhandler": "domhandler@5.0.3" - } - }, - "eastasianwidth@0.2.0": { - "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==", - "dependencies": {} - }, - "emoji-regex@8.0.0": { - "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==", - "dependencies": {} - }, - "emoji-regex@9.2.2": { - "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==", - "dependencies": {} - }, - "entities@4.5.0": { - "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==", - "dependencies": {} - }, - "env-paths@2.2.1": { - "integrity": "sha512-+h1lkLKhZMTYjog1VEpJNG7NZJWcuc2DDk/qsqSTRRCOXiLjeQ1d1/udrUGhqMxUgAlwKNZ0cf2uqan5GLuS2A==", - "dependencies": {} - }, - "errno@0.1.8": { - "integrity": "sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==", - "dependencies": { - "prr": "prr@1.0.1" - } - }, - "error-ex@1.3.2": { - "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==", - "dependencies": { - "is-arrayish": "is-arrayish@0.2.1" - } - }, - "escape-string-regexp@1.0.5": { - "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==", - "dependencies": {} - }, - "fast-deep-equal@3.1.3": { - "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==", - "dependencies": {} - }, - "fast-glob@3.3.2": { - "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==", - "dependencies": { - "@nodelib/fs.stat": "@nodelib/fs.stat@2.0.5", - "@nodelib/fs.walk": "@nodelib/fs.walk@1.2.8", - "glob-parent": "glob-parent@5.1.2", - "merge2": "merge2@1.4.1", - "micromatch": "micromatch@4.0.8" - } - }, - "fast-uri@3.0.1": { - "integrity": "sha512-MWipKbbYiYI0UC7cl8m/i/IWTqfC8YXsqjzybjddLsFjStroQzsHXkc73JutMvBiXmOvapk+axIl79ig5t55Bw==", - "dependencies": {} - }, - "fastest-levenshtein@1.0.16": { - "integrity": "sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==", - "dependencies": {} - }, - "fastq@1.17.1": { - "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==", - "dependencies": { - "reusify": "reusify@1.0.4" - } - }, - "file-entry-cache@9.1.0": { - "integrity": "sha512-/pqPFG+FdxWQj+/WSuzXSDaNzxgTLr/OrR1QuqfEZzDakpdYE70PwUxL7BPUa8hpjbvY1+qvCl8k+8Tq34xJgg==", - "dependencies": { - "flat-cache": "flat-cache@5.0.0" - } - }, - "fill-range@7.1.1": { - "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", - "dependencies": { - "to-regex-range": "to-regex-range@5.0.1" - } - }, - "flat-cache@5.0.0": { - "integrity": "sha512-JrqFmyUl2PnPi1OvLyTVHnQvwQ0S+e6lGSwu8OkAZlSaNIZciTY2H/cOOROxsBA1m/LZNHDsqAgDZt6akWcjsQ==", - "dependencies": { - "flatted": "flatted@3.3.1", - "keyv": "keyv@4.5.4" - } - }, - "flatted@3.3.1": { - "integrity": "sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==", - "dependencies": {} - }, - "foreground-child@3.3.0": { - "integrity": "sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==", - "dependencies": { - "cross-spawn": "cross-spawn@7.0.3", - "signal-exit": "signal-exit@4.1.0" - } - }, - "glob-parent@5.1.2": { - "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", - "dependencies": { - "is-glob": "is-glob@4.0.3" - } - }, - "glob@10.4.5": { - "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==", - "dependencies": { - "foreground-child": "foreground-child@3.3.0", - "jackspeak": "jackspeak@3.4.3", - "minimatch": "minimatch@9.0.5", - "minipass": "minipass@7.1.2", - "package-json-from-dist": "package-json-from-dist@1.0.0", - "path-scurry": "path-scurry@1.11.1" - } - }, - "global-modules@2.0.0": { - "integrity": "sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==", - "dependencies": { - "global-prefix": "global-prefix@3.0.0" - } - }, - "global-prefix@3.0.0": { - "integrity": "sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==", - "dependencies": { - "ini": "ini@1.3.8", - "kind-of": "kind-of@6.0.3", - "which": "which@1.3.1" - } - }, - "globby@11.1.0": { - "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==", - "dependencies": { - "array-union": "array-union@2.1.0", - "dir-glob": "dir-glob@3.0.1", - "fast-glob": "fast-glob@3.3.2", - "ignore": "ignore@5.3.2", - "merge2": "merge2@1.4.1", - "slash": "slash@3.0.0" - } - }, - "globjoin@0.1.4": { - "integrity": "sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==", - "dependencies": {} - }, - "graceful-fs@4.2.11": { - "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==", - "dependencies": {} - }, - "handlebars@4.7.8": { - "integrity": "sha512-vafaFqs8MZkRrSX7sFVUdo3ap/eNiLnb4IakshzvP56X5Nr1iGKAIqdX6tMlm6HcNRIkr6AxO5jFEoJzzpT8aQ==", - "dependencies": { - "minimist": "minimist@1.2.8", - "neo-async": "neo-async@2.6.2", - "source-map": "source-map@0.6.1", - "uglify-js": "uglify-js@3.19.0", - "wordwrap": "wordwrap@1.0.0" - } - }, - "has-flag@3.0.0": { - "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==", - "dependencies": {} - }, - "has-flag@4.0.0": { - "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", - "dependencies": {} - }, - "html-tags@3.3.1": { - "integrity": "sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==", - "dependencies": {} - }, - "iconv-lite@0.6.3": { - "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", - "dependencies": { - "safer-buffer": "safer-buffer@2.1.2" - } - }, - "ignore@5.3.2": { - "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==", - "dependencies": {} - }, - "image-size@0.5.5": { - "integrity": "sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==", - "dependencies": {} - }, - "import-fresh@3.3.0": { - "integrity": "sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==", - "dependencies": { - "parent-module": "parent-module@1.0.1", - "resolve-from": "resolve-from@4.0.0" - } - }, - "imurmurhash@0.1.4": { - "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==", - "dependencies": {} - }, - "ini@1.3.8": { - "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==", - "dependencies": {} - }, - "is-arrayish@0.2.1": { - "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==", - "dependencies": {} - }, - "is-extglob@2.1.1": { - "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", - "dependencies": {} - }, - "is-fullwidth-code-point@3.0.0": { - "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==", - "dependencies": {} - }, - "is-glob@4.0.3": { - "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", - "dependencies": { - "is-extglob": "is-extglob@2.1.1" - } - }, - "is-number@7.0.0": { - "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", - "dependencies": {} - }, - "is-plain-object@5.0.0": { - "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==", - "dependencies": {} - }, - "is-what@3.14.1": { - "integrity": "sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==", - "dependencies": {} - }, - "isexe@2.0.0": { - "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==", - "dependencies": {} - }, - "jackspeak@3.4.3": { - "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==", - "dependencies": { - "@isaacs/cliui": "@isaacs/cliui@8.0.2", - "@pkgjs/parseargs": "@pkgjs/parseargs@0.11.0" - } - }, - "js-tokens@4.0.0": { - "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", - "dependencies": {} - }, - "js-yaml@4.1.0": { - "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==", - "dependencies": { - "argparse": "argparse@2.0.1" - } - }, - "json-buffer@3.0.1": { - "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==", - "dependencies": {} - }, - "json-parse-even-better-errors@2.3.1": { - "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==", - "dependencies": {} - }, - "json-schema-to-typescript@15.0.2": { - "integrity": "sha512-+cRBw+bBJ3k783mZroDIgz1pLNPB4hvj6nnbHTWwEVl0dkW8qdZ+M9jWhBb+Y0FAdHvNsXACga3lewGO8lktrw==", - "dependencies": { - "@apidevtools/json-schema-ref-parser": "@apidevtools/json-schema-ref-parser@11.7.0", - "@types/json-schema": "@types/json-schema@7.0.15", - "@types/lodash": "@types/lodash@4.17.7", - "glob": "glob@10.4.5", - "is-glob": "is-glob@4.0.3", - "js-yaml": "js-yaml@4.1.0", - "lodash": "lodash@4.17.21", - "minimist": "minimist@1.2.8", - "prettier": "prettier@3.3.3" - } - }, - "json-schema-traverse@1.0.0": { - "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==", - "dependencies": {} - }, - "keyv@4.5.4": { - "integrity": "sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==", - "dependencies": { - "json-buffer": "json-buffer@3.0.1" - } - }, - "kind-of@6.0.3": { - "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==", - "dependencies": {} - }, - "known-css-properties@0.34.0": { - "integrity": "sha512-tBECoUqNFbyAY4RrbqsBQqDFpGXAEbdD5QKr8kACx3+rnArmuuR22nKQWKazvp07N9yjTyDZaw/20UIH8tL9DQ==", - "dependencies": {} - }, - "less@4.2.0": { - "integrity": "sha512-P3b3HJDBtSzsXUl0im2L7gTO5Ubg8mEN6G8qoTS77iXxXX4Hvu4Qj540PZDvQ8V6DmX6iXo98k7Md0Cm1PrLaA==", - "dependencies": { - "copy-anything": "copy-anything@2.0.6", - "errno": "errno@0.1.8", - "graceful-fs": "graceful-fs@4.2.11", - "image-size": "image-size@0.5.5", - "make-dir": "make-dir@2.1.0", - "mime": "mime@1.6.0", - "needle": "needle@3.3.1", - "parse-node-version": "parse-node-version@1.0.1", - "source-map": "source-map@0.6.1", - "tslib": "tslib@2.6.3" - } - }, - "lines-and-columns@1.2.4": { - "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==", - "dependencies": {} - }, - "lodash.truncate@4.4.2": { - "integrity": "sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==", - "dependencies": {} - }, - "lodash@4.17.21": { - "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", - "dependencies": {} - }, - "lru-cache@10.4.3": { - "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==", - "dependencies": {} - }, - "make-dir@2.1.0": { - "integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==", - "dependencies": { - "pify": "pify@4.0.1", - "semver": "semver@5.7.2" - } - }, - "mathml-tag-names@2.1.3": { - "integrity": "sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==", - "dependencies": {} - }, - "mdn-data@2.0.28": { - "integrity": "sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==", - "dependencies": {} - }, - "mdn-data@2.0.30": { - "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==", - "dependencies": {} - }, - "meow@13.2.0": { - "integrity": "sha512-pxQJQzB6djGPXh08dacEloMFopsOqGVRKFPYvPOt9XDZ1HasbgDZA74CJGreSU4G3Ak7EFJGoiH2auq+yXISgA==", - "dependencies": {} - }, - "merge2@1.4.1": { - "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", - "dependencies": {} - }, - "micromatch@4.0.8": { - "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==", - "dependencies": { - "braces": "braces@3.0.3", - "picomatch": "picomatch@2.3.1" - } - }, - "mime@1.6.0": { - "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==", - "dependencies": {} - }, - "minimatch@9.0.5": { - "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==", - "dependencies": { - "brace-expansion": "brace-expansion@2.0.1" - } - }, - "minimist@1.2.8": { - "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==", - "dependencies": {} - }, - "minipass@7.1.2": { - "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==", - "dependencies": {} - }, - "ms@2.1.2": { - "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", - "dependencies": {} - }, - "nanoid@3.3.7": { - "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==", - "dependencies": {} - }, - "needle@3.3.1": { - "integrity": "sha512-6k0YULvhpw+RoLNiQCRKOl09Rv1dPLr8hHnVjHqdolKwDrdNyk+Hmrthi4lIGPPz3r39dLx0hsF5s40sZ3Us4Q==", - "dependencies": { - "iconv-lite": "iconv-lite@0.6.3", - "sax": "sax@1.4.1" - } - }, - "neo-async@2.6.2": { - "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", - "dependencies": {} - }, - "normalize-path@3.0.0": { - "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==", - "dependencies": {} - }, - "nth-check@2.1.1": { - "integrity": "sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==", - "dependencies": { - "boolbase": "boolbase@1.0.0" - } - }, - "package-json-from-dist@1.0.0": { - "integrity": "sha512-dATvCeZN/8wQsGywez1mzHtTlP22H8OEfPrVMLNr4/eGa+ijtLn/6M5f0dY8UKNrC2O9UCU6SSoG3qRKnt7STw==", - "dependencies": {} - }, - "parent-module@1.0.1": { - "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==", - "dependencies": { - "callsites": "callsites@3.1.0" - } - }, - "parse-json@5.2.0": { - "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==", - "dependencies": { - "@babel/code-frame": "@babel/code-frame@7.24.7", - "error-ex": "error-ex@1.3.2", - "json-parse-even-better-errors": "json-parse-even-better-errors@2.3.1", - "lines-and-columns": "lines-and-columns@1.2.4" - } - }, - "parse-node-version@1.0.1": { - "integrity": "sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==", - "dependencies": {} - }, - "path-key@3.1.1": { - "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==", - "dependencies": {} - }, - "path-scurry@1.11.1": { - "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==", - "dependencies": { - "lru-cache": "lru-cache@10.4.3", - "minipass": "minipass@7.1.2" - } - }, - "path-type@4.0.0": { - "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", - "dependencies": {} - }, - "picocolors@1.0.1": { - "integrity": "sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==", - "dependencies": {} - }, - "picomatch@2.3.1": { - "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", - "dependencies": {} - }, - "pify@4.0.1": { - "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==", - "dependencies": {} - }, - "postcss-less@6.0.0_postcss@8.4.39": { - "integrity": "sha512-FPX16mQLyEjLzEuuJtxA8X3ejDLNGGEG503d2YGZR5Ask1SpDN8KmZUMpzCvyalWRywAn1n1VOA5dcqfCLo5rg==", - "dependencies": { - "postcss": "postcss@8.4.39" - } - }, - "postcss-resolve-nested-selector@0.1.6": { - "integrity": "sha512-0sglIs9Wmkzbr8lQwEyIzlDOOC9bGmfVKcJTaxv3vMmd3uo4o4DerC3En0bnmgceeql9BfC8hRkp7cg0fjdVqw==", - "dependencies": {} - }, - "postcss-safe-parser@7.0.0_postcss@8.4.44": { - "integrity": "sha512-ovehqRNVCpuFzbXoTb4qLtyzK3xn3t/CUBxOs8LsnQjQrShaB4lKiHoVqY8ANaC0hBMHq5QVWk77rwGklFUDrg==", - "dependencies": { - "postcss": "postcss@8.4.44" - } - }, - "postcss-selector-parser@6.1.2": { - "integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==", - "dependencies": { - "cssesc": "cssesc@3.0.0", - "util-deprecate": "util-deprecate@1.0.2" - } - }, - "postcss-value-parser@4.2.0": { - "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", - "dependencies": {} - }, - "postcss@8.4.39": { - "integrity": "sha512-0vzE+lAiG7hZl1/9I8yzKLx3aR9Xbof3fBHKunvMfOCYAtMhrsnccJY2iTURb9EZd5+pLuiNV9/c/GZJOHsgIw==", - "dependencies": { - "nanoid": "nanoid@3.3.7", - "picocolors": "picocolors@1.0.1", - "source-map-js": "source-map-js@1.2.0" - } - }, - "postcss@8.4.44": { - "integrity": "sha512-Aweb9unOEpQ3ezu4Q00DPvvM2ZTUitJdNKeP/+uQgr1IBIqu574IaZoURId7BKtWMREwzKa9OgzPzezWGPWFQw==", - "dependencies": { - "nanoid": "nanoid@3.3.7", - "picocolors": "picocolors@1.0.1", - "source-map-js": "source-map-js@1.2.0" - } - }, - "prettier@3.2.4": { - "integrity": "sha512-FWu1oLHKCrtpO1ypU6J0SbK2d9Ckwysq6bHj/uaCP26DxrPpppCLQRGVuqAxSTvhF00AcvDRyYrLNW7ocBhFFQ==", - "dependencies": {} - }, - "prettier@3.3.3": { - "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==", - "dependencies": {} - }, - "prr@1.0.1": { - "integrity": "sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==", - "dependencies": {} - }, - "queue-microtask@1.2.3": { - "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", - "dependencies": {} - }, - "require-from-string@2.0.2": { - "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==", - "dependencies": {} - }, - "resolve-from@4.0.0": { - "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==", - "dependencies": {} - }, - "resolve-from@5.0.0": { - "integrity": "sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==", - "dependencies": {} - }, - "reusify@1.0.4": { - "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==", - "dependencies": {} - }, - "run-parallel@1.2.0": { - "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", - "dependencies": { - "queue-microtask": "queue-microtask@1.2.3" - } - }, - "safer-buffer@2.1.2": { - "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", - "dependencies": {} - }, - "sax@1.4.1": { - "integrity": "sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==", - "dependencies": {} - }, - "semver@5.7.2": { - "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==", - "dependencies": {} - }, - "shebang-command@2.0.0": { - "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==", - "dependencies": { - "shebang-regex": "shebang-regex@3.0.0" - } - }, - "shebang-regex@3.0.0": { - "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==", - "dependencies": {} - }, - "signal-exit@4.1.0": { - "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==", - "dependencies": {} - }, - "slash@3.0.0": { - "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==", - "dependencies": {} - }, - "slice-ansi@4.0.0": { - "integrity": "sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==", - "dependencies": { - "ansi-styles": "ansi-styles@4.3.0", - "astral-regex": "astral-regex@2.0.0", - "is-fullwidth-code-point": "is-fullwidth-code-point@3.0.0" - } - }, - "source-map-js@1.2.0": { - "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==", - "dependencies": {} - }, - "source-map@0.6.1": { - "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", - "dependencies": {} - }, - "string-width@4.2.3": { - "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==", - "dependencies": { - "emoji-regex": "emoji-regex@8.0.0", - "is-fullwidth-code-point": "is-fullwidth-code-point@3.0.0", - "strip-ansi": "strip-ansi@6.0.1" - } - }, - "string-width@5.1.2": { - "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==", - "dependencies": { - "eastasianwidth": "eastasianwidth@0.2.0", - "emoji-regex": "emoji-regex@9.2.2", - "strip-ansi": "strip-ansi@7.1.0" - } - }, - "strip-ansi@6.0.1": { - "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", - "dependencies": { - "ansi-regex": "ansi-regex@5.0.1" - } - }, - "strip-ansi@7.1.0": { - "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==", - "dependencies": { - "ansi-regex": "ansi-regex@6.0.1" - } - }, - "stylelint-config-recommended@14.0.1_stylelint@16.9.0__@csstools+css-tokenizer@3.0.1__@csstools+css-parser-algorithms@3.0.1___@csstools+css-tokenizer@3.0.1__postcss-selector-parser@6.1.2__postcss@8.4.44": { - "integrity": "sha512-bLvc1WOz/14aPImu/cufKAZYfXs/A/owZfSMZ4N+16WGXLoX5lOir53M6odBxvhgmgdxCVnNySJmZKx73T93cg==", - "dependencies": { - "stylelint": "stylelint@16.9.0_@csstools+css-tokenizer@3.0.1_@csstools+css-parser-algorithms@3.0.1__@csstools+css-tokenizer@3.0.1_postcss-selector-parser@6.1.2_postcss@8.4.44" - } - }, - "stylelint-config-standard@36.0.1_stylelint@16.9.0__@csstools+css-tokenizer@3.0.1__@csstools+css-parser-algorithms@3.0.1___@csstools+css-tokenizer@3.0.1__postcss-selector-parser@6.1.2__postcss@8.4.44": { - "integrity": "sha512-8aX8mTzJ6cuO8mmD5yon61CWuIM4UD8Q5aBcWKGSf6kg+EC3uhB+iOywpTK4ca6ZL7B49en8yanOFtUW0qNzyw==", - "dependencies": { - "stylelint": "stylelint@16.9.0_@csstools+css-tokenizer@3.0.1_@csstools+css-parser-algorithms@3.0.1__@csstools+css-tokenizer@3.0.1_postcss-selector-parser@6.1.2_postcss@8.4.44", - "stylelint-config-recommended": "stylelint-config-recommended@14.0.1_stylelint@16.9.0__@csstools+css-tokenizer@3.0.1__@csstools+css-parser-algorithms@3.0.1___@csstools+css-tokenizer@3.0.1__postcss-selector-parser@6.1.2__postcss@8.4.44" - } - }, - "stylelint@16.9.0_@csstools+css-tokenizer@3.0.1_@csstools+css-parser-algorithms@3.0.1__@csstools+css-tokenizer@3.0.1_postcss-selector-parser@6.1.2_postcss@8.4.44": { - "integrity": "sha512-31Nm3WjxGOBGpQqF43o3wO9L5AC36TPIe6030Lnm13H3vDMTcS21DrLh69bMX+DBilKqMMVLian4iG6ybBoNRQ==", - "dependencies": { - "@csstools/css-parser-algorithms": "@csstools/css-parser-algorithms@3.0.1_@csstools+css-tokenizer@3.0.1", - "@csstools/css-tokenizer": "@csstools/css-tokenizer@3.0.1", - "@csstools/media-query-list-parser": "@csstools/media-query-list-parser@3.0.1_@csstools+css-parser-algorithms@3.0.1__@csstools+css-tokenizer@3.0.1_@csstools+css-tokenizer@3.0.1", - "@csstools/selector-specificity": "@csstools/selector-specificity@4.0.0_postcss-selector-parser@6.1.2", - "@dual-bundle/import-meta-resolve": "@dual-bundle/import-meta-resolve@4.1.0", - "balanced-match": "balanced-match@2.0.0", - "colord": "colord@2.9.3", - "cosmiconfig": "cosmiconfig@9.0.0", - "css-functions-list": "css-functions-list@3.2.2", - "css-tree": "css-tree@2.3.1", - "debug": "debug@4.3.6", - "fast-glob": "fast-glob@3.3.2", - "fastest-levenshtein": "fastest-levenshtein@1.0.16", - "file-entry-cache": "file-entry-cache@9.1.0", - "global-modules": "global-modules@2.0.0", - "globby": "globby@11.1.0", - "globjoin": "globjoin@0.1.4", - "html-tags": "html-tags@3.3.1", - "ignore": "ignore@5.3.2", - "imurmurhash": "imurmurhash@0.1.4", - "is-plain-object": "is-plain-object@5.0.0", - "known-css-properties": "known-css-properties@0.34.0", - "mathml-tag-names": "mathml-tag-names@2.1.3", - "meow": "meow@13.2.0", - "micromatch": "micromatch@4.0.8", - "normalize-path": "normalize-path@3.0.0", - "picocolors": "picocolors@1.0.1", - "postcss": "postcss@8.4.44", - "postcss-resolve-nested-selector": "postcss-resolve-nested-selector@0.1.6", - "postcss-safe-parser": "postcss-safe-parser@7.0.0_postcss@8.4.44", - "postcss-selector-parser": "postcss-selector-parser@6.1.2", - "postcss-value-parser": "postcss-value-parser@4.2.0", - "resolve-from": "resolve-from@5.0.0", - "string-width": "string-width@4.2.3", - "strip-ansi": "strip-ansi@7.1.0", - "supports-hyperlinks": "supports-hyperlinks@3.1.0", - "svg-tags": "svg-tags@1.0.0", - "table": "table@6.8.2", - "write-file-atomic": "write-file-atomic@5.0.1" - } - }, - "supports-color@5.5.0": { - "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==", - "dependencies": { - "has-flag": "has-flag@3.0.0" - } - }, - "supports-color@7.2.0": { - "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", - "dependencies": { - "has-flag": "has-flag@4.0.0" - } - }, - "supports-hyperlinks@3.1.0": { - "integrity": "sha512-2rn0BZ+/f7puLOHZm1HOJfwBggfaHXUpPUSSG/SWM4TWp5KCfmNYwnC3hruy2rZlMnmWZ+QAGpZfchu3f3695A==", - "dependencies": { - "has-flag": "has-flag@4.0.0", - "supports-color": "supports-color@7.2.0" - } - }, - "svg-tags@1.0.0": { - "integrity": "sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==", - "dependencies": {} - }, - "svgo@3.3.2": { - "integrity": "sha512-OoohrmuUlBs8B8o6MB2Aevn+pRIH9zDALSR+6hhqVfa6fRwG/Qw9VUMSMW9VNg2CFc/MTIfabtdOVl9ODIJjpw==", - "dependencies": { - "@trysound/sax": "@trysound/sax@0.2.0", - "commander": "commander@7.2.0", - "css-select": "css-select@5.1.0", - "css-tree": "css-tree@2.3.1", - "css-what": "css-what@6.1.0", - "csso": "csso@5.0.5", - "picocolors": "picocolors@1.0.1" - } - }, - "table@6.8.2": { - "integrity": "sha512-w2sfv80nrAh2VCbqR5AK27wswXhqcck2AhfnNW76beQXskGZ1V12GwS//yYVa3d3fcvAip2OUnbDAjW2k3v9fA==", - "dependencies": { - "ajv": "ajv@8.17.1", - "lodash.truncate": "lodash.truncate@4.4.2", - "slice-ansi": "slice-ansi@4.0.0", - "string-width": "string-width@4.2.3", - "strip-ansi": "strip-ansi@6.0.1" - } - }, - "to-regex-range@5.0.1": { - "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", - "dependencies": { - "is-number": "is-number@7.0.0" - } - }, - "tslib@2.6.3": { - "integrity": "sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ==", - "dependencies": {} - }, - "tunnel@0.0.6": { - "integrity": "sha512-1h/Lnq9yajKY2PEbBadPXj3VxsDDu844OnaAo52UVmIzIvwwtBPIuNvkjuzBlTWpfJyUbG3ez0KSBibQkj4ojg==", - "dependencies": {} - }, - "type-fest@4.23.0": { - "integrity": "sha512-ZiBujro2ohr5+Z/hZWHESLz3g08BBdrdLMieYFULJO+tWc437sn8kQsWLJoZErY8alNhxre9K4p3GURAG11n+w==", - "dependencies": {} - }, - "uglify-js@3.19.0": { - "integrity": "sha512-wNKHUY2hYYkf6oSFfhwwiHo4WCHzHmzcXsqXYTN9ja3iApYIFbb2U6ics9hBcYLHcYGQoAlwnZlTrf3oF+BL/Q==", - "dependencies": {} - }, - "undici@5.28.4": { - "integrity": "sha512-72RFADWFqKmUb2hmmvNODKL3p9hcB6Gt2DOQMis1SEBaV6a4MH8soBvzg+95CYhCKPFedut2JY9bMfrDl9D23g==", - "dependencies": { - "@fastify/busboy": "@fastify/busboy@2.1.1" - } - }, - "universal-user-agent@7.0.2": { - "integrity": "sha512-0JCqzSKnStlRRQfCdowvqy3cy0Dvtlb8xecj/H8JFZuCze4rwjPZQOgvFvn0Ws/usCHQFGpyr+pB9adaGwXn4Q==", - "dependencies": {} - }, - "usercss-meta@0.12.0": { - "integrity": "sha512-zKrXCKdpeIwtVe87omxGo9URf+7mbozduMZEg79dmT4KB3XJwfIkEi/Uk0PcTwR/nZLtAK1+k7isgbGB/g6E7Q==", - "dependencies": {} - }, - "util-deprecate@1.0.2": { - "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==", - "dependencies": {} - }, - "uuid@8.3.2": { - "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==", - "dependencies": {} - }, - "which@1.3.1": { - "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==", - "dependencies": { - "isexe": "isexe@2.0.0" - } - }, - "which@2.0.2": { - "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==", - "dependencies": { - "isexe": "isexe@2.0.0" - } - }, - "wordwrap@1.0.0": { - "integrity": "sha512-gvVzJFlPycKc5dZN4yPkP8w7Dc37BtP1yczEneOb4uq34pXZcvrtRTmWV8W+Ume+XCxKgbjM+nevkyFPMybd4Q==", - "dependencies": {} - }, - "wrap-ansi@7.0.0": { - "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==", - "dependencies": { - "ansi-styles": "ansi-styles@4.3.0", - "string-width": "string-width@4.2.3", - "strip-ansi": "strip-ansi@6.0.1" - } - }, - "wrap-ansi@8.1.0": { - "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==", - "dependencies": { - "ansi-styles": "ansi-styles@6.2.1", - "string-width": "string-width@5.1.2", - "strip-ansi": "strip-ansi@7.1.0" - } - }, - "write-file-atomic@5.0.1": { - "integrity": "sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==", - "dependencies": { - "imurmurhash": "imurmurhash@0.1.4", - "signal-exit": "signal-exit@4.1.0" - } - } + "version": "5", + "specifiers": { + "jsr:@std/assert@^1.0.17": "1.0.19", + "jsr:@std/assert@^1.0.9": "1.0.19", + "jsr:@std/async@^1.1.0": "1.2.0", + "jsr:@std/async@^1.2.0": "1.2.0", + "jsr:@std/cli@^1.0.28": "1.0.28", + "jsr:@std/cli@^1.0.8": "1.0.28", + "jsr:@std/data-structures@^1.0.10": "1.0.10", + "jsr:@std/encoding@^1.0.10": "1.0.10", + "jsr:@std/fmt@^1.0.2": "1.0.9", + "jsr:@std/fmt@^1.0.9": "1.0.9", + "jsr:@std/fs@^1.0.22": "1.0.23", + "jsr:@std/fs@^1.0.23": "1.0.23", + "jsr:@std/fs@^1.0.6": "1.0.23", + "jsr:@std/html@^1.0.5": "1.0.5", + "jsr:@std/http@^1.0.25": "1.0.25", + "jsr:@std/internal@^1.0.12": "1.0.12", + "jsr:@std/internal@^1.0.5": "1.0.5", + "jsr:@std/media-types@^1.1.0": "1.1.0", + "jsr:@std/net@^1.0.6": "1.0.6", + "jsr:@std/path@^1.0.8": "1.1.4", + "jsr:@std/path@^1.1.4": "1.1.4", + "jsr:@std/streams@^1.0.17": "1.0.17", + "jsr:@std/testing@*": "1.0.17", + "jsr:@std/testing@^1.0.17": "1.0.17", + "jsr:@std/yaml@^1.0.5": "1.0.5", + "npm:@actions/core@1.11.1": "1.11.1", + "npm:@catppuccin/palette@^1.7.1": "1.7.1", + "npm:@octokit/rest@^21.0.2": "21.0.2_@octokit+core@6.1.2", + "npm:@types/less@*": "3.0.7", + "npm:@types/node@*": "22.5.4", + "npm:ajv@8.17.1": "8.17.1", + "npm:ajv@8.18.0": "8.18.0", + "npm:handlebars@4.7.8": "4.7.8", + "npm:json-schema-to-typescript@^15.0.3": "15.0.3", + "npm:less@4.2.2": "4.2.2", + "npm:postcss-less@6.0.0": "6.0.0_postcss@8.4.49", + "npm:postcss-value-parser@4.2.0": "4.2.0", + "npm:stylelint-config-recommended@14.0.1": "14.0.1_stylelint@16.12.0__@csstools+css-tokenizer@3.0.3__@csstools+css-parser-algorithms@3.0.4___@csstools+css-tokenizer@3.0.3__postcss-selector-parser@7.0.0__postcss@8.4.49", + "npm:stylelint-config-standard@36.0.1": "36.0.1_stylelint@16.12.0__@csstools+css-tokenizer@3.0.3__@csstools+css-parser-algorithms@3.0.4___@csstools+css-tokenizer@3.0.3__postcss-selector-parser@7.0.0__postcss@8.4.49", + "npm:stylelint@*": "16.12.0_@csstools+css-tokenizer@3.0.3_@csstools+css-parser-algorithms@3.0.4__@csstools+css-tokenizer@3.0.3_postcss-selector-parser@7.0.0_postcss@8.4.49", + "npm:stylelint@^16.12.0": "16.12.0_@csstools+css-tokenizer@3.0.3_@csstools+css-parser-algorithms@3.0.4__@csstools+css-tokenizer@3.0.3_postcss-selector-parser@7.0.0_postcss@8.4.49", + "npm:svgo@4.0.0": "4.0.0", + "npm:type-fest@^4.30.2": "4.30.2", + "npm:usercss-meta@0.12.0": "0.12.0" + }, + "jsr": { + "@std/assert@1.0.9": { + "integrity": "a9f0c611a869cc791b26f523eec54c7e187aab7932c2c8e8bea0622d13680dcd", + "dependencies": [ + "jsr:@std/internal@^1.0.5" + ] + }, + "@std/assert@1.0.19": { + "integrity": "eaada96ee120cb980bc47e040f82814d786fe8162ecc53c91d8df60b8755991e", + "dependencies": [ + "jsr:@std/internal@^1.0.12" + ] + }, + "@std/async@1.2.0": { + "integrity": "c059c6f6d95ca7cc012ae8e8d7164d1697113d54b0b679e4372b354b11c2dee5" + }, + "@std/cli@1.0.8": { + "integrity": "3762d8dc9a373715c08d871c38d45e637b25266f013a1d0bbe560bca409de94e" + }, + "@std/cli@1.0.28": { + "integrity": "74ef9b976db59ca6b23a5283469c9072be6276853807a83ec6c7ce412135c70a", + "dependencies": [ + "jsr:@std/fmt@^1.0.9", + "jsr:@std/internal@^1.0.12" + ] + }, + "@std/data-structures@1.0.10": { + "integrity": "f574f86b0e07c69b9edc555fcc814b57d29258bad39fd5a34ba8a80ecf033cfe" + }, + "@std/encoding@1.0.10": { + "integrity": "8783c6384a2d13abd5e9e87a7ae0520a30e9f56aeeaa3bdf910a3eaaf5c811a1" + }, + "@std/fmt@1.0.3": { + "integrity": "97765c16aa32245ff4e2204ecf7d8562496a3cb8592340a80e7e554e0bb9149f" + }, + "@std/fmt@1.0.9": { + "integrity": "2487343e8899fb2be5d0e3d35013e54477ada198854e52dd05ed0422eddcabe0" + }, + "@std/fs@1.0.6": { + "integrity": "42b56e1e41b75583a21d5a37f6a6a27de9f510bcd36c0c85791d685ca0b85fa2", + "dependencies": [ + "jsr:@std/path@^1.0.8" + ] + }, + "@std/fs@1.0.23": { + "integrity": "3ecbae4ce4fee03b180fa710caff36bb5adb66631c46a6460aaad49515565a37", + "dependencies": [ + "jsr:@std/internal@^1.0.12", + "jsr:@std/path@^1.1.4" + ] + }, + "@std/html@1.0.5": { + "integrity": "4e2d693f474cae8c16a920fa5e15a3b72267b94b84667f11a50c6dd1cb18d35e" + }, + "@std/http@1.0.25": { + "integrity": "577b4252290af1097132812b339fffdd55fb0f4aeb98ff11bdbf67998aa17193", + "dependencies": [ + "jsr:@std/cli@^1.0.28", + "jsr:@std/encoding", + "jsr:@std/fmt@^1.0.9", + "jsr:@std/fs@^1.0.23", + "jsr:@std/html", + "jsr:@std/media-types", + "jsr:@std/net", + "jsr:@std/path@^1.1.4", + "jsr:@std/streams" + ] + }, + "@std/internal@1.0.5": { + "integrity": "54a546004f769c1ac9e025abd15a76b6671ddc9687e2313b67376125650dc7ba" + }, + "@std/internal@1.0.12": { + "integrity": "972a634fd5bc34b242024402972cd5143eac68d8dffaca5eaa4dba30ce17b027" + }, + "@std/media-types@1.1.0": { + "integrity": "c9d093f0c05c3512932b330e3cc1fe1d627b301db33a4c2c2185c02471d6eaa4" + }, + "@std/net@1.0.6": { + "integrity": "110735f93e95bb9feb95790a8b1d1bf69ec0dc74f3f97a00a76ea5efea25500c" + }, + "@std/path@1.0.8": { + "integrity": "548fa456bb6a04d3c1a1e7477986b6cffbce95102d0bb447c67c4ee70e0364be" + }, + "@std/path@1.1.4": { + "integrity": "1d2d43f39efb1b42f0b1882a25486647cb851481862dc7313390b2bb044314b5", + "dependencies": [ + "jsr:@std/internal@^1.0.12" + ] + }, + "@std/streams@1.0.17": { + "integrity": "7859f3d9deed83cf4b41f19223d4a67661b3d3819e9fc117698f493bf5992140" + }, + "@std/testing@1.0.17": { + "integrity": "87bdc2700fa98249d48a17cd72413352d3d3680dcfbdb64947fd0982d6bbf681", + "dependencies": [ + "jsr:@std/assert@^1.0.17", + "jsr:@std/async@^1.1.0", + "jsr:@std/data-structures", + "jsr:@std/fs@^1.0.22", + "jsr:@std/internal@^1.0.12", + "jsr:@std/path@^1.1.4" + ] + }, + "@std/yaml@1.0.5": { + "integrity": "71ba3d334305ee2149391931508b2c293a8490f94a337eef3a09cade1a2a2742" + } + }, + "npm": { + "@actions/core@1.11.1": { + "integrity": "sha512-hXJCSrkwfA46Vd9Z3q4cpEpHB1rL5NG04+/rbqW9d3+CSvtB1tYe8UTpAlixa1vj0m/ULglfEK2UKxMGxCxv5A==", + "dependencies": [ + "@actions/exec", + "@actions/http-client" + ] + }, + "@actions/exec@1.1.1": { + "integrity": "sha512-+sCcHHbVdk93a0XT19ECtO/gIXoxvdsgQLzb2fE2/5sIZmWQuluYyjPQtrtTHdU1YzTZ7bAPN4sITq2xi1679w==", + "dependencies": [ + "@actions/io" + ] + }, + "@actions/http-client@2.2.3": { + "integrity": "sha512-mx8hyJi/hjFvbPokCg4uRd4ZX78t+YyRPtnKWwIl+RzNaVuFpQHfmlGVfsKEJN8LwTCvL+DfVgAM04XaHkm6bA==", + "dependencies": [ + "tunnel", + "undici" + ] + }, + "@actions/io@1.1.3": { + "integrity": "sha512-wi9JjgKLYS7U/z8PPbco+PvTb/nRWjeoFlJ1Qer83k/3C5PHQi28hiVdeE2kHXmIL99mQFawx8qt/JPjZilJ8Q==" + }, + "@apidevtools/json-schema-ref-parser@11.7.3": { + "integrity": "sha512-WApSdLdXEBb/1FUPca2lteASewEfpjEYJ8oXZP+0gExK5qSfsEKBKcA+WjY6Q4wvXwyv0+W6Kvc372pSceib9w==", + "dependencies": [ + "@jsdevtools/ono", + "@types/json-schema", + "js-yaml" + ] + }, + "@babel/code-frame@7.26.2": { + "integrity": "sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==", + "dependencies": [ + "@babel/helper-validator-identifier", + "js-tokens", + "picocolors" + ] + }, + "@babel/helper-validator-identifier@7.25.9": { + "integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==" + }, + "@catppuccin/palette@1.7.1": { + "integrity": "sha512-aRc1tbzrevOTV7nFTT9SRdF26w/MIwT4Jwt4fDMc9itRZUDXCuEDBLyz4TQMlqO9ZP8mf5Hu4Jr6D03NLFc6Gw==" + }, + "@csstools/css-parser-algorithms@3.0.4_@csstools+css-tokenizer@3.0.3": { + "integrity": "sha512-Up7rBoV77rv29d3uKHUIVubz1BTcgyUK72IvCQAbfbMv584xHcGKCKbWh7i8hPrRJ7qU4Y8IO3IY9m+iTB7P3A==", + "dependencies": [ + "@csstools/css-tokenizer" + ] + }, + "@csstools/css-tokenizer@3.0.3": { + "integrity": "sha512-UJnjoFsmxfKUdNYdWgOB0mWUypuLvAfQPH1+pyvRJs6euowbFkFC6P13w1l8mJyi3vxYMxc9kld5jZEGRQs6bw==" + }, + "@csstools/media-query-list-parser@4.0.2_@csstools+css-parser-algorithms@3.0.4__@csstools+css-tokenizer@3.0.3_@csstools+css-tokenizer@3.0.3": { + "integrity": "sha512-EUos465uvVvMJehckATTlNqGj4UJWkTmdWuDMjqvSUkjGpmOyFZBVwb4knxCm/k2GMTXY+c/5RkdndzFYWeX5A==", + "dependencies": [ + "@csstools/css-parser-algorithms", + "@csstools/css-tokenizer" + ] + }, + "@csstools/selector-specificity@5.0.0_postcss-selector-parser@7.0.0": { + "integrity": "sha512-PCqQV3c4CoVm3kdPhyeZ07VmBRdH2EpMFA/pd9OASpOEC3aXNGoqPDAZ80D0cLpMBxnmk0+yNhGsEx31hq7Gtw==", + "dependencies": [ + "postcss-selector-parser" + ] + }, + "@dual-bundle/import-meta-resolve@4.1.0": { + "integrity": "sha512-+nxncfwHM5SgAtrVzgpzJOI1ol0PkumhVo469KCf9lUi21IGcY90G98VuHm9VRrUypmAzawAHO9bs6hqeADaVg==" + }, + "@fastify/busboy@2.1.1": { + "integrity": "sha512-vBZP4NlzfOlerQTnba4aqZoMhE/a9HY7HRqoOPaETQcSQuWEIyZMHGfVu6w9wGtGK5fED5qRs2DteVCjOH60sA==" + }, + "@jsdevtools/ono@7.1.3": { + "integrity": "sha512-4JQNk+3mVzK3xh2rqd6RB4J46qUR19azEHBneZyTZM+c456qOrbbM/5xcR8huNCCcbVt7+UmizG6GuUvPvKUYg==" + }, + "@nodelib/fs.scandir@2.1.5": { + "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", + "dependencies": [ + "@nodelib/fs.stat", + "run-parallel" + ] + }, + "@nodelib/fs.stat@2.0.5": { + "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==" + }, + "@nodelib/fs.walk@1.2.8": { + "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", + "dependencies": [ + "@nodelib/fs.scandir", + "fastq" + ] + }, + "@octokit/auth-token@5.1.1": { + "integrity": "sha512-rh3G3wDO8J9wSjfI436JUKzHIxq8NaiL0tVeB2aXmG6p/9859aUOAjA9pmSPNGGZxfwmaJ9ozOJImuNVJdpvbA==" + }, + "@octokit/core@6.1.2": { + "integrity": "sha512-hEb7Ma4cGJGEUNOAVmyfdB/3WirWMg5hDuNFVejGEDFqupeOysLc2sG6HJxY2etBp5YQu5Wtxwi020jS9xlUwg==", + "dependencies": [ + "@octokit/auth-token", + "@octokit/graphql", + "@octokit/request", + "@octokit/request-error", + "@octokit/types", + "before-after-hook", + "universal-user-agent" + ] + }, + "@octokit/endpoint@10.1.1": { + "integrity": "sha512-JYjh5rMOwXMJyUpj028cu0Gbp7qe/ihxfJMLc8VZBMMqSwLgOxDI1911gV4Enl1QSavAQNJcwmwBF9M0VvLh6Q==", + "dependencies": [ + "@octokit/types", + "universal-user-agent" + ] + }, + "@octokit/graphql@8.1.1": { + "integrity": "sha512-ukiRmuHTi6ebQx/HFRCXKbDlOh/7xEV6QUXaE7MJEKGNAncGI/STSbOkl12qVXZrfZdpXctx5O9X1AIaebiDBg==", + "dependencies": [ + "@octokit/request", + "@octokit/types", + "universal-user-agent" + ] + }, + "@octokit/openapi-types@22.2.0": { + "integrity": "sha512-QBhVjcUa9W7Wwhm6DBFu6ZZ+1/t/oYxqc2tp81Pi41YNuJinbFRx8B133qVOrAaBbF7D/m0Et6f9/pZt9Rc+tg==" + }, + "@octokit/plugin-paginate-rest@11.3.6_@octokit+core@6.1.2": { + "integrity": "sha512-zcvqqf/+TicbTCa/Z+3w4eBJcAxCFymtc0UAIsR3dEVoNilWld4oXdscQ3laXamTszUZdusw97K8+DrbFiOwjw==", + "dependencies": [ + "@octokit/core", + "@octokit/types" + ] + }, + "@octokit/plugin-request-log@5.3.1_@octokit+core@6.1.2": { + "integrity": "sha512-n/lNeCtq+9ofhC15xzmJCNKP2BWTv8Ih2TTy+jatNCCq/gQP/V7rK3fjIfuz0pDWDALO/o/4QY4hyOF6TQQFUw==", + "dependencies": [ + "@octokit/core" + ] + }, + "@octokit/plugin-rest-endpoint-methods@13.2.6_@octokit+core@6.1.2": { + "integrity": "sha512-wMsdyHMjSfKjGINkdGKki06VEkgdEldIGstIEyGX0wbYHGByOwN/KiM+hAAlUwAtPkP3gvXtVQA9L3ITdV2tVw==", + "dependencies": [ + "@octokit/core", + "@octokit/types" + ] + }, + "@octokit/request-error@6.1.5": { + "integrity": "sha512-IlBTfGX8Yn/oFPMwSfvugfncK2EwRLjzbrpifNaMY8o/HTEAFqCA1FZxjD9cWvSKBHgrIhc4CSBIzMxiLsbzFQ==", + "dependencies": [ + "@octokit/types" + ] + }, + "@octokit/request@9.1.3": { + "integrity": "sha512-V+TFhu5fdF3K58rs1pGUJIDH5RZLbZm5BI+MNF+6o/ssFNT4vWlCh/tVpF3NxGtP15HUxTTMUbsG5llAuU2CZA==", + "dependencies": [ + "@octokit/endpoint", + "@octokit/request-error", + "@octokit/types", + "universal-user-agent" + ] + }, + "@octokit/rest@21.0.2_@octokit+core@6.1.2": { + "integrity": "sha512-+CiLisCoyWmYicH25y1cDfCrv41kRSvTq6pPWtRroRJzhsCZWZyCqGyI8foJT5LmScADSwRAnr/xo+eewL04wQ==", + "dependencies": [ + "@octokit/core", + "@octokit/plugin-paginate-rest", + "@octokit/plugin-request-log", + "@octokit/plugin-rest-endpoint-methods" + ] + }, + "@octokit/types@13.6.2": { + "integrity": "sha512-WpbZfZUcZU77DrSW4wbsSgTPfKcp286q3ItaIgvSbBpZJlu6mnYXAkjZz6LVZPXkEvLIM8McanyZejKTYUHipA==", + "dependencies": [ + "@octokit/openapi-types" + ] + }, + "@types/json-schema@7.0.15": { + "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==" + }, + "@types/less@3.0.7": { + "integrity": "sha512-+SD1DrM8EwJsilPFSR1IMMGWOTg5sO1waewoJ1k3BHCvU07zQThy8t2wTfxvHz//R0uK3koAUl9WbWwal0H+YA==" + }, + "@types/lodash@4.17.13": { + "integrity": "sha512-lfx+dftrEZcdBPczf9d0Qv0x+j/rfNCMuC6OcfXmO8gkfeNAY88PgKUbvG56whcN23gc27yenwF6oJZXGFpYxg==" + }, + "@types/node@22.5.4": { + "integrity": "sha512-FDuKUJQm/ju9fT/SeX/6+gBzoPzlVCzfzmGkwKvRHQVxi4BntVbyIwf6a4Xn62mrvndLiml6z/UBXIdEVjQLXg==", + "dependencies": [ + "undici-types" + ] + }, + "ajv@8.17.1": { + "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==", + "dependencies": [ + "fast-deep-equal", + "fast-uri", + "json-schema-traverse", + "require-from-string" + ] + }, + "ajv@8.18.0": { + "integrity": "sha512-PlXPeEWMXMZ7sPYOHqmDyCJzcfNrUr3fGNKtezX14ykXOEIvyK81d+qydx89KY5O71FKMPaQ2vBfBFI5NHR63A==", + "dependencies": [ + "fast-deep-equal", + "fast-uri", + "json-schema-traverse", + "require-from-string" + ] + }, + "ansi-regex@5.0.1": { + "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==" + }, + "ansi-styles@4.3.0": { + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dependencies": [ + "color-convert" + ] + }, + "argparse@2.0.1": { + "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==" + }, + "array-union@2.1.0": { + "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==" + }, + "astral-regex@2.0.0": { + "integrity": "sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==" + }, + "balanced-match@2.0.0": { + "integrity": "sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==" + }, + "before-after-hook@3.0.2": { + "integrity": "sha512-Nik3Sc0ncrMK4UUdXQmAnRtzmNQTAAXmXIopizwZ1W1t8QmfJj+zL4OA2I7XPTPW5z5TDqv4hRo/JzouDJnX3A==" + }, + "boolbase@1.0.0": { + "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==" + }, + "braces@3.0.3": { + "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", + "dependencies": [ + "fill-range" + ] + }, + "callsites@3.1.0": { + "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==" + }, + "color-convert@2.0.1": { + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dependencies": [ + "color-name" + ] + }, + "color-name@1.1.4": { + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" + }, + "colord@2.9.3": { + "integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==" + }, + "commander@11.1.0": { + "integrity": "sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==" + }, + "copy-anything@2.0.6": { + "integrity": "sha512-1j20GZTsvKNkc4BY3NpMOM8tt///wY3FpIzozTOFO2ffuZcV61nojHXVKIy3WM+7ADCy5FVhdZYHYDdgTU0yJw==", + "dependencies": [ + "is-what" + ] + }, + "cosmiconfig@9.0.0": { + "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==", + "dependencies": [ + "env-paths", + "import-fresh", + "js-yaml", + "parse-json" + ] + }, + "css-functions-list@3.2.3": { + "integrity": "sha512-IQOkD3hbR5KrN93MtcYuad6YPuTSUhntLHDuLEbFWE+ff2/XSZNdZG+LcbbIW5AXKg/WFIfYItIzVoHngHXZzA==" + }, + "css-select@5.1.0": { + "integrity": "sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg==", + "dependencies": [ + "boolbase", + "css-what", + "domhandler", + "domutils", + "nth-check" + ] + }, + "css-tree@2.2.1": { + "integrity": "sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA==", + "dependencies": [ + "mdn-data@2.0.28", + "source-map-js" + ] + }, + "css-tree@3.1.0": { + "integrity": "sha512-0eW44TGN5SQXU1mWSkKwFstI/22X2bG1nYzZTYMAWjylYURhse752YgbE4Cx46AC+bAvI+/dYTPRk1LqSUnu6w==", + "dependencies": [ + "mdn-data@2.12.2", + "source-map-js" + ] + }, + "css-what@6.1.0": { + "integrity": "sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==" + }, + "cssesc@3.0.0": { + "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==", + "bin": true + }, + "csso@5.0.5": { + "integrity": "sha512-0LrrStPOdJj+SPCCrGhzryycLjwcgUSHBtxNA8aIDxf0GLsRh1cKYhB00Gd1lDOS4yGH69+SNn13+TWbVHETFQ==", + "dependencies": [ + "css-tree@2.2.1" + ] + }, + "debug@4.4.0": { + "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==", + "dependencies": [ + "ms" + ] + }, + "dir-glob@3.0.1": { + "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==", + "dependencies": [ + "path-type" + ] + }, + "dom-serializer@2.0.0": { + "integrity": "sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==", + "dependencies": [ + "domelementtype", + "domhandler", + "entities" + ] + }, + "domelementtype@2.3.0": { + "integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==" + }, + "domhandler@5.0.3": { + "integrity": "sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==", + "dependencies": [ + "domelementtype" + ] + }, + "domutils@3.2.2": { + "integrity": "sha512-6kZKyUajlDuqlHKVX1w7gyslj9MPIXzIFiz/rGu35uC1wMi+kMhQwGhl4lt9unC9Vb9INnY9Z3/ZA3+FhASLaw==", + "dependencies": [ + "dom-serializer", + "domelementtype", + "domhandler" + ] + }, + "emoji-regex@8.0.0": { + "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==" + }, + "entities@4.5.0": { + "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==" + }, + "env-paths@2.2.1": { + "integrity": "sha512-+h1lkLKhZMTYjog1VEpJNG7NZJWcuc2DDk/qsqSTRRCOXiLjeQ1d1/udrUGhqMxUgAlwKNZ0cf2uqan5GLuS2A==" + }, + "errno@0.1.8": { + "integrity": "sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==", + "dependencies": [ + "prr" + ], + "bin": true + }, + "error-ex@1.3.2": { + "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==", + "dependencies": [ + "is-arrayish" + ] + }, + "fast-deep-equal@3.1.3": { + "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==" + }, + "fast-glob@3.3.2": { + "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==", + "dependencies": [ + "@nodelib/fs.stat", + "@nodelib/fs.walk", + "glob-parent", + "merge2", + "micromatch" + ] + }, + "fast-uri@3.0.3": { + "integrity": "sha512-aLrHthzCjH5He4Z2H9YZ+v6Ujb9ocRuW6ZzkJQOrTxleEijANq4v1TsaPaVG1PZcuurEzrLcWRyYBYXD5cEiaw==" + }, + "fastest-levenshtein@1.0.16": { + "integrity": "sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==" + }, + "fastq@1.17.1": { + "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==", + "dependencies": [ + "reusify" + ] + }, + "fdir@6.4.2_picomatch@4.0.2": { + "integrity": "sha512-KnhMXsKSPZlAhp7+IjUkRZKPb4fUyccpDrdFXbi4QL1qkmFh9kVY09Yox+n4MaOb3lHZ1Tv829C3oaaXoMYPDQ==", + "dependencies": [ + "picomatch@4.0.2" + ], + "optionalPeers": [ + "picomatch@4.0.2" + ] + }, + "file-entry-cache@9.1.0": { + "integrity": "sha512-/pqPFG+FdxWQj+/WSuzXSDaNzxgTLr/OrR1QuqfEZzDakpdYE70PwUxL7BPUa8hpjbvY1+qvCl8k+8Tq34xJgg==", + "dependencies": [ + "flat-cache" + ] + }, + "fill-range@7.1.1": { + "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", + "dependencies": [ + "to-regex-range" + ] + }, + "flat-cache@5.0.0": { + "integrity": "sha512-JrqFmyUl2PnPi1OvLyTVHnQvwQ0S+e6lGSwu8OkAZlSaNIZciTY2H/cOOROxsBA1m/LZNHDsqAgDZt6akWcjsQ==", + "dependencies": [ + "flatted", + "keyv" + ] + }, + "flatted@3.3.2": { + "integrity": "sha512-AiwGJM8YcNOaobumgtng+6NHuOqC3A7MixFeDafM3X9cIUM+xUXoS5Vfgf+OihAYe20fxqNM9yPBXJzRtZ/4eA==" + }, + "glob-parent@5.1.2": { + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dependencies": [ + "is-glob" + ] + }, + "global-modules@2.0.0": { + "integrity": "sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==", + "dependencies": [ + "global-prefix" + ] + }, + "global-prefix@3.0.0": { + "integrity": "sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==", + "dependencies": [ + "ini", + "kind-of", + "which" + ] + }, + "globby@11.1.0": { + "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==", + "dependencies": [ + "array-union", + "dir-glob", + "fast-glob", + "ignore@5.3.2", + "merge2", + "slash" + ] + }, + "globjoin@0.1.4": { + "integrity": "sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==" + }, + "graceful-fs@4.2.11": { + "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==" + }, + "handlebars@4.7.8": { + "integrity": "sha512-vafaFqs8MZkRrSX7sFVUdo3ap/eNiLnb4IakshzvP56X5Nr1iGKAIqdX6tMlm6HcNRIkr6AxO5jFEoJzzpT8aQ==", + "dependencies": [ + "minimist", + "neo-async", + "source-map", + "wordwrap" + ], + "optionalDependencies": [ + "uglify-js" + ], + "bin": true + }, + "has-flag@4.0.0": { + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==" + }, + "html-tags@3.3.1": { + "integrity": "sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==" + }, + "iconv-lite@0.6.3": { + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "dependencies": [ + "safer-buffer" + ] + }, + "ignore@5.3.2": { + "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==" + }, + "ignore@6.0.2": { + "integrity": "sha512-InwqeHHN2XpumIkMvpl/DCJVrAHgCsG5+cn1XlnLWGwtZBm8QJfSusItfrwx81CTp5agNZqpKU2J/ccC5nGT4A==" + }, + "image-size@0.5.5": { + "integrity": "sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==", + "bin": true + }, + "import-fresh@3.3.0": { + "integrity": "sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==", + "dependencies": [ + "parent-module", + "resolve-from@4.0.0" + ] + }, + "imurmurhash@0.1.4": { + "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==" + }, + "ini@1.3.8": { + "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==" + }, + "is-arrayish@0.2.1": { + "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==" + }, + "is-extglob@2.1.1": { + "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==" + }, + "is-fullwidth-code-point@3.0.0": { + "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==" + }, + "is-glob@4.0.3": { + "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", + "dependencies": [ + "is-extglob" + ] + }, + "is-number@7.0.0": { + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==" + }, + "is-plain-object@5.0.0": { + "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==" + }, + "is-what@3.14.1": { + "integrity": "sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==" + }, + "isexe@2.0.0": { + "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==" + }, + "js-tokens@4.0.0": { + "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==" + }, + "js-yaml@4.1.0": { + "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==", + "dependencies": [ + "argparse" + ], + "bin": true + }, + "json-buffer@3.0.1": { + "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==" + }, + "json-parse-even-better-errors@2.3.1": { + "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==" + }, + "json-schema-to-typescript@15.0.3": { + "integrity": "sha512-iOKdzTUWEVM4nlxpFudFsWyUiu/Jakkga4OZPEt7CGoSEsAsUgdOZqR6pcgx2STBek9Gm4hcarJpXSzIvZ/hKA==", + "dependencies": [ + "@apidevtools/json-schema-ref-parser", + "@types/json-schema", + "@types/lodash", + "is-glob", + "js-yaml", + "lodash", + "minimist", + "prettier", + "tinyglobby" + ], + "bin": true + }, + "json-schema-traverse@1.0.0": { + "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==" + }, + "keyv@4.5.4": { + "integrity": "sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==", + "dependencies": [ + "json-buffer" + ] + }, + "kind-of@6.0.3": { + "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==" + }, + "known-css-properties@0.35.0": { + "integrity": "sha512-a/RAk2BfKk+WFGhhOCAYqSiFLc34k8Mt/6NWRI4joER0EYUzXIcFivjjnoD3+XU1DggLn/tZc3DOAgke7l8a4A==" + }, + "less@4.2.2": { + "integrity": "sha512-tkuLHQlvWUTeQ3doAqnHbNn8T6WX1KA8yvbKG9x4VtKtIjHsVKQZCH11zRgAfbDAXC2UNIg/K9BYAAcEzUIrNg==", + "dependencies": [ + "copy-anything", + "parse-node-version", + "tslib" + ], + "optionalDependencies": [ + "errno", + "graceful-fs", + "image-size", + "make-dir", + "mime", + "needle", + "source-map" + ], + "bin": true + }, + "lines-and-columns@1.2.4": { + "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==" + }, + "lodash.truncate@4.4.2": { + "integrity": "sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==" + }, + "lodash@4.17.21": { + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" + }, + "make-dir@2.1.0": { + "integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==", + "dependencies": [ + "pify", + "semver" + ] + }, + "mathml-tag-names@2.1.3": { + "integrity": "sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==" + }, + "mdn-data@2.0.28": { + "integrity": "sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==" + }, + "mdn-data@2.12.2": { + "integrity": "sha512-IEn+pegP1aManZuckezWCO+XZQDplx1366JoVhTpMpBB1sPey/SbveZQUosKiKiGYjg1wH4pMlNgXbCiYgihQA==" + }, + "meow@13.2.0": { + "integrity": "sha512-pxQJQzB6djGPXh08dacEloMFopsOqGVRKFPYvPOt9XDZ1HasbgDZA74CJGreSU4G3Ak7EFJGoiH2auq+yXISgA==" + }, + "merge2@1.4.1": { + "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==" + }, + "micromatch@4.0.8": { + "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==", + "dependencies": [ + "braces", + "picomatch@2.3.1" + ] + }, + "mime@1.6.0": { + "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==", + "bin": true + }, + "minimist@1.2.8": { + "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==" + }, + "ms@2.1.3": { + "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==" + }, + "nanoid@3.3.8": { + "integrity": "sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==", + "bin": true + }, + "needle@3.3.1": { + "integrity": "sha512-6k0YULvhpw+RoLNiQCRKOl09Rv1dPLr8hHnVjHqdolKwDrdNyk+Hmrthi4lIGPPz3r39dLx0hsF5s40sZ3Us4Q==", + "dependencies": [ + "iconv-lite", + "sax" + ], + "bin": true + }, + "neo-async@2.6.2": { + "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==" + }, + "normalize-path@3.0.0": { + "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==" + }, + "nth-check@2.1.1": { + "integrity": "sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==", + "dependencies": [ + "boolbase" + ] + }, + "parent-module@1.0.1": { + "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==", + "dependencies": [ + "callsites" + ] + }, + "parse-json@5.2.0": { + "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==", + "dependencies": [ + "@babel/code-frame", + "error-ex", + "json-parse-even-better-errors", + "lines-and-columns" + ] + }, + "parse-node-version@1.0.1": { + "integrity": "sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==" + }, + "path-type@4.0.0": { + "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==" + }, + "picocolors@1.1.1": { + "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==" + }, + "picomatch@2.3.1": { + "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==" + }, + "picomatch@4.0.2": { + "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==" + }, + "pify@4.0.1": { + "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==" + }, + "postcss-less@6.0.0_postcss@8.4.49": { + "integrity": "sha512-FPX16mQLyEjLzEuuJtxA8X3ejDLNGGEG503d2YGZR5Ask1SpDN8KmZUMpzCvyalWRywAn1n1VOA5dcqfCLo5rg==", + "dependencies": [ + "postcss" + ] + }, + "postcss-resolve-nested-selector@0.1.6": { + "integrity": "sha512-0sglIs9Wmkzbr8lQwEyIzlDOOC9bGmfVKcJTaxv3vMmd3uo4o4DerC3En0bnmgceeql9BfC8hRkp7cg0fjdVqw==" + }, + "postcss-safe-parser@7.0.1_postcss@8.4.49": { + "integrity": "sha512-0AioNCJZ2DPYz5ABT6bddIqlhgwhpHZ/l65YAYo0BCIn0xiDpsnTHz0gnoTGk0OXZW0JRs+cDwL8u/teRdz+8A==", + "dependencies": [ + "postcss" + ] + }, + "postcss-selector-parser@7.0.0": { + "integrity": "sha512-9RbEr1Y7FFfptd/1eEdntyjMwLeghW1bHX9GWjXo19vx4ytPQhANltvVxDggzJl7mnWM+dX28kb6cyS/4iQjlQ==", + "dependencies": [ + "cssesc", + "util-deprecate" + ] + }, + "postcss-value-parser@4.2.0": { + "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==" + }, + "postcss@8.4.49": { + "integrity": "sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==", + "dependencies": [ + "nanoid", + "picocolors", + "source-map-js" + ] + }, + "prettier@3.4.2": { + "integrity": "sha512-e9MewbtFo+Fevyuxn/4rrcDAaq0IYxPGLvObpQjiZBMAzB9IGmzlnG9RZy3FFas+eBMu2vA0CszMeduow5dIuQ==", + "bin": true + }, + "prr@1.0.1": { + "integrity": "sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==" + }, + "queue-microtask@1.2.3": { + "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==" + }, + "require-from-string@2.0.2": { + "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==" + }, + "resolve-from@4.0.0": { + "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==" + }, + "resolve-from@5.0.0": { + "integrity": "sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==" + }, + "reusify@1.0.4": { + "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==" + }, + "run-parallel@1.2.0": { + "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", + "dependencies": [ + "queue-microtask" + ] + }, + "safer-buffer@2.1.2": { + "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==" + }, + "sax@1.4.1": { + "integrity": "sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==" + }, + "semver@5.7.2": { + "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==", + "bin": true + }, + "signal-exit@4.1.0": { + "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==" + }, + "slash@3.0.0": { + "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==" + }, + "slice-ansi@4.0.0": { + "integrity": "sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==", + "dependencies": [ + "ansi-styles", + "astral-regex", + "is-fullwidth-code-point" + ] + }, + "source-map-js@1.2.1": { + "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==" + }, + "source-map@0.6.1": { + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==" + }, + "string-width@4.2.3": { + "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==", + "dependencies": [ + "emoji-regex", + "is-fullwidth-code-point", + "strip-ansi" + ] + }, + "strip-ansi@6.0.1": { + "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", + "dependencies": [ + "ansi-regex" + ] + }, + "stylelint-config-recommended@14.0.1_stylelint@16.12.0__@csstools+css-tokenizer@3.0.3__@csstools+css-parser-algorithms@3.0.4___@csstools+css-tokenizer@3.0.3__postcss-selector-parser@7.0.0__postcss@8.4.49": { + "integrity": "sha512-bLvc1WOz/14aPImu/cufKAZYfXs/A/owZfSMZ4N+16WGXLoX5lOir53M6odBxvhgmgdxCVnNySJmZKx73T93cg==", + "dependencies": [ + "stylelint" + ] + }, + "stylelint-config-standard@36.0.1_stylelint@16.12.0__@csstools+css-tokenizer@3.0.3__@csstools+css-parser-algorithms@3.0.4___@csstools+css-tokenizer@3.0.3__postcss-selector-parser@7.0.0__postcss@8.4.49": { + "integrity": "sha512-8aX8mTzJ6cuO8mmD5yon61CWuIM4UD8Q5aBcWKGSf6kg+EC3uhB+iOywpTK4ca6ZL7B49en8yanOFtUW0qNzyw==", + "dependencies": [ + "stylelint", + "stylelint-config-recommended" + ] + }, + "stylelint@16.12.0_@csstools+css-tokenizer@3.0.3_@csstools+css-parser-algorithms@3.0.4__@csstools+css-tokenizer@3.0.3_postcss-selector-parser@7.0.0_postcss@8.4.49": { + "integrity": "sha512-F8zZ3L/rBpuoBZRvI4JVT20ZanPLXfQLzMOZg1tzPflRVh9mKpOZ8qcSIhh1my3FjAjZWG4T2POwGnmn6a6hbg==", + "dependencies": [ + "@csstools/css-parser-algorithms", + "@csstools/css-tokenizer", + "@csstools/media-query-list-parser", + "@csstools/selector-specificity", + "@dual-bundle/import-meta-resolve", + "balanced-match", + "colord", + "cosmiconfig", + "css-functions-list", + "css-tree@3.1.0", + "debug", + "fast-glob", + "fastest-levenshtein", + "file-entry-cache", + "global-modules", + "globby", + "globjoin", + "html-tags", + "ignore@6.0.2", + "imurmurhash", + "is-plain-object", + "known-css-properties", + "mathml-tag-names", + "meow", + "micromatch", + "normalize-path", + "picocolors", + "postcss", + "postcss-resolve-nested-selector", + "postcss-safe-parser", + "postcss-selector-parser", + "postcss-value-parser", + "resolve-from@5.0.0", + "string-width", + "supports-hyperlinks", + "svg-tags", + "table", + "write-file-atomic" + ], + "bin": true + }, + "supports-color@7.2.0": { + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dependencies": [ + "has-flag" + ] + }, + "supports-hyperlinks@3.1.0": { + "integrity": "sha512-2rn0BZ+/f7puLOHZm1HOJfwBggfaHXUpPUSSG/SWM4TWp5KCfmNYwnC3hruy2rZlMnmWZ+QAGpZfchu3f3695A==", + "dependencies": [ + "has-flag", + "supports-color" + ] + }, + "svg-tags@1.0.0": { + "integrity": "sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==" + }, + "svgo@4.0.0": { + "integrity": "sha512-VvrHQ+9uniE+Mvx3+C9IEe/lWasXCU0nXMY2kZeLrHNICuRiC8uMPyM14UEaMOFA5mhyQqEkB02VoQ16n3DLaw==", + "dependencies": [ + "commander", + "css-select", + "css-tree@3.1.0", + "css-what", + "csso", + "picocolors", + "sax" + ], + "bin": true + }, + "table@6.9.0": { + "integrity": "sha512-9kY+CygyYM6j02t5YFHbNz2FN5QmYGv9zAjVp4lCDjlCw7amdckXlEt/bjMhUIfj4ThGRE4gCUH5+yGnNuPo5A==", + "dependencies": [ + "ajv@8.17.1", + "lodash.truncate", + "slice-ansi", + "string-width", + "strip-ansi" + ] + }, + "tinyglobby@0.2.10_picomatch@4.0.2": { + "integrity": "sha512-Zc+8eJlFMvgatPZTl6A9L/yht8QqdmUNtURHaKZLmKBE12hNPSrqNkUp2cs3M/UKmNVVAMFQYSjYIVHDjW5zew==", + "dependencies": [ + "fdir", + "picomatch@4.0.2" + ] + }, + "to-regex-range@5.0.1": { + "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", + "dependencies": [ + "is-number" + ] + }, + "tslib@2.8.1": { + "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==" + }, + "tunnel@0.0.6": { + "integrity": "sha512-1h/Lnq9yajKY2PEbBadPXj3VxsDDu844OnaAo52UVmIzIvwwtBPIuNvkjuzBlTWpfJyUbG3ez0KSBibQkj4ojg==" + }, + "type-fest@4.30.2": { + "integrity": "sha512-UJShLPYi1aWqCdq9HycOL/gwsuqda1OISdBO3t8RlXQC4QvtuIz4b5FCfe2dQIWEpmlRExKmcTBfP1r9bhY7ig==" + }, + "uglify-js@3.19.3": { + "integrity": "sha512-v3Xu+yuwBXisp6QYTcH4UbH+xYJXqnq2m/LtQVWKWzYc1iehYnLixoQDN9FH6/j9/oybfd6W9Ghwkl8+UMKTKQ==", + "bin": true + }, + "undici-types@6.19.8": { + "integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==" + }, + "undici@5.28.4": { + "integrity": "sha512-72RFADWFqKmUb2hmmvNODKL3p9hcB6Gt2DOQMis1SEBaV6a4MH8soBvzg+95CYhCKPFedut2JY9bMfrDl9D23g==", + "dependencies": [ + "@fastify/busboy" + ] + }, + "universal-user-agent@7.0.2": { + "integrity": "sha512-0JCqzSKnStlRRQfCdowvqy3cy0Dvtlb8xecj/H8JFZuCze4rwjPZQOgvFvn0Ws/usCHQFGpyr+pB9adaGwXn4Q==" + }, + "usercss-meta@0.12.0": { + "integrity": "sha512-zKrXCKdpeIwtVe87omxGo9URf+7mbozduMZEg79dmT4KB3XJwfIkEi/Uk0PcTwR/nZLtAK1+k7isgbGB/g6E7Q==" + }, + "util-deprecate@1.0.2": { + "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==" + }, + "which@1.3.1": { + "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==", + "dependencies": [ + "isexe" + ], + "bin": true + }, + "wordwrap@1.0.0": { + "integrity": "sha512-gvVzJFlPycKc5dZN4yPkP8w7Dc37BtP1yczEneOb4uq34pXZcvrtRTmWV8W+Ume+XCxKgbjM+nevkyFPMybd4Q==" + }, + "write-file-atomic@5.0.1": { + "integrity": "sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==", + "dependencies": [ + "imurmurhash", + "signal-exit" + ] } }, + "redirects": { + "https://github.com/openstyles/stylus/raw/8fe35a4b90d85fb911bd7aa1deab4e4733c31150/src/js/sections-util.js": "https://raw.githubusercontent.com/openstyles/stylus/8fe35a4b90d85fb911bd7aa1deab4e4733c31150/src/js/sections-util.js" + }, "remote": { - "https://raw.githubusercontent.com/catppuccin/catppuccin/d4f2666c2b04337f0a8632713de0889d9a7d332d/resources/ports.schema.json": "39ce3bcd2dabd033010684df7caa82cc69c25584174eba0922e6435dce53f06a" + "https://raw.githubusercontent.com/catppuccin/catppuccin/d4f82739e687cfd19d168be355367fdbbcc8e029/resources/categories.schema.json": "9b2190cadcc0e8efa8219bfe67dd16fd003a6ad5fd7c8ae9e6ecfa72d51e4a2f", + "https://raw.githubusercontent.com/openstyles/stylus/8fe35a4b90d85fb911bd7aa1deab4e4733c31150/src/js/sections-util.js": "387e164ad40bc76048dccaafce6a032ac745616e7fc29f1873d7da33f5739502" }, "workspace": { "dependencies": [ - "jsr:@std/assert@^1.0.4", - "jsr:@std/cli@^1.0.5", + "jsr:@std/assert@^1.0.9", + "jsr:@std/async@^1.2.0", + "jsr:@std/cli@^1.0.8", "jsr:@std/fmt@^1.0.2", - "jsr:@std/fs@^1.0.3", - "jsr:@std/path@^1.0.4", + "jsr:@std/fs@^1.0.6", + "jsr:@std/http@^1.0.25", + "jsr:@std/path@^1.0.8", + "jsr:@std/testing@^1.0.17", "jsr:@std/yaml@^1.0.5", - "npm:@actions/core@1.10.1", - "npm:@catppuccin/palette@1.2.0", - "npm:@octokit/rest@21.0.1", - "npm:ajv@8.17.1", + "npm:@actions/core@1.11.1", + "npm:@catppuccin/palette@^1.7.1", + "npm:@octokit/rest@^21.0.2", + "npm:ajv@8.18.0", "npm:handlebars@4.7.8", - "npm:json-schema-to-typescript@15.0.2", - "npm:less@4.2.0", + "npm:json-schema-to-typescript@^15.0.3", + "npm:less@4.2.2", "npm:postcss-less@6.0.0", "npm:postcss-value-parser@4.2.0", "npm:stylelint-config-recommended@14.0.1", "npm:stylelint-config-standard@36.0.1", - "npm:stylelint@16.9.0", - "npm:svgo@3.3.2", - "npm:type-fest@4.23.0", + "npm:stylelint@^16.12.0", + "npm:svgo@4.0.0", + "npm:type-fest@^4.30.2", "npm:usercss-meta@0.12.0" ] } diff --git a/docs/.gitignore b/docs/.gitignore new file mode 100644 index 0000000000..bffa11f019 --- /dev/null +++ b/docs/.gitignore @@ -0,0 +1,21 @@ +# build output +dist/ +# generated types +.astro/ + +# dependencies +node_modules/ + +# logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* + + +# environment variables +.env +.env.production + +# macOS-specific files +.DS_Store \ No newline at end of file diff --git a/docs/CONTRIBUTING.md b/docs/CONTRIBUTING.md deleted file mode 100644 index e86a7361d8..0000000000 --- a/docs/CONTRIBUTING.md +++ /dev/null @@ -1,69 +0,0 @@ -# Contributing! - -๐ŸŽ‰ First off, thanks for taking the time to contribute! ๐ŸŽ‰ - -## Guidelines - -The following is a set of guidelines for contributing to this repository. Use -your best judgment, and feel free to propose changes to this document in a pull -request. - -> [!IMPORTANT] -> For new userstyles, make sure to see [userstyle-creation.md](./userstyle-creation.md) after reading this. - -## Development environment - -This repositories uses [Deno](https://deno.com/) extensively for linting and automation. We recommend setting up Deno locally to improve your workflow โ€” see ["Installation" - Deno Docs](https://docs.deno.com/runtime/manual/getting_started/installation). With Deno installed locally, you can run the lint script using `deno task lint` (and `deno task lint:fix` to automatically apply fixes) and the formatting script using `deno task format`. - -When editing a userstyle, we suggest setting up live reloading so your local changes can be automatically reloaded through Stylus. See ["How can I see my changes in real time?"](./tips-and-tricks.md#how-can-i-see-my-changes-in-real-time). - -## Recommendations - -### Assessing websites - -Some websites are, unfortunately, simply not meant for userstyles. For example, websites that have auto-generated classes (`aeN WR beA nH oy8Mbf`, `cfb2a888`, etc.) lead to unreadable and unmaintainable userstyles โ€” they break quickly and are difficult for contributors besides the maintainer to update/maintain. For those reasons we recommend not attempting to theme such sites. - -### Root variables - -While writing a userstyle, you may have come across [custom properties / CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/--*), typically wrapped in a `:root` selector. We refer to these variables as "root variables", and they can be thought of as global variables used all across a website. For Catppuccin userstyles, we prefer that these variables are themed (if they exist) rather than individual elements. As the website hopefully uses these variables themselves, it saves yourself a lot of work in theming and maintaining the userstyle. - -### Opinionated changes - -When writing or updating a userstyle, it is important to keep in mind that different users have different preferences. To avoid lengthy discussion over user interface aesthetics, we have a set of rules for what a userstyle may include; importantly, **changes to font, layout, padding, margin, display, and in general anything besides color tweaks are prohibited.** - -### General recommendations - -- Create a [topic branch](https://git-scm.com/book/en/v2/Git-Branching-Branching-Workflows#_topic_branch) on your fork for your specific PR. -- Catppuccin uses the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) - standard for creating explicit and meaningful commit messages. This repository - requires pull request _titles_ to be in the conventional commit format, - however we do not require it for individual commits within a pull request. -- Update the version in the `==UserStyle==` header of the `catppuccin.user.css` - file. This is to enable version control of the style. -- If it's your first time contributing to a project then you should look to the - popular [first-contributions](https://github.com/firstcontributions/first-contributions) - repository on GitHub. This will give you hands-on experience with the features - of GitHub required to make a contribution. As always, feel free to join our [Discord](https://discord.com/servers/catppuccin-907385605422448742) to ask - any questions and clarify your understanding, we are more than happy to help! -- Changes to docs may need to use [marksman](https://github.com/artempyanykh/marksman) to generate the table of contents. - -## Pull request review process - -It's better to have a draft pull request than no pull request at all. Having a draft lets others know that a userstyle is being worked on, and gives the opportunity for people to try it out ahead of time (if they really want it themed!). - -```mermaid -graph TD; - A[New userstyle]; - B[Other improvements]; - A --> C[Review by userstyles staff]; - B --> D[Review by maintainer]; - C --> E{Feedback}; - D --> F{Feedback}; - E -->|Changes made| E; - F -->|Changes made| F; - E -->|Approved by userstyles staff| K; - F -->|Approved by maintainer or userstyles staff| L[Merged by maintainer]; - K[Waiting period*] --> M[Merged by userstyles staff]; -``` - -\*A waiting period is usually started if a website is particularly complex or for any other reason could not be thoroughly/completely tested. Waiting periods typically last between 1 and 2 days. diff --git a/docs/astro.config.mjs b/docs/astro.config.mjs new file mode 100644 index 0000000000..67a981986d --- /dev/null +++ b/docs/astro.config.mjs @@ -0,0 +1,79 @@ +import { defineConfig } from "astro/config"; +import starlight from "@astrojs/starlight"; +import catppuccin from "@catppuccin/starlight"; +import starlightLinksValidator from "starlight-links-validator"; +import starlightImageZoom from "starlight-image-zoom"; +import starlightGitHubAlerts from "starlight-github-alerts"; +import starlightAutoSidebar from "starlight-auto-sidebar"; +import mermaid from "astro-mermaid"; +import { remarkHeadingId } from "remark-custom-heading-id"; + +export default defineConfig({ + site: "https://userstyles.catppuccin.com", + markdown: { + remarkPlugins: [remarkHeadingId], + }, + integrations: [ + mermaid(), + starlight({ + title: "Catppuccin Userstyles", + favicon: "/favicon.png", + logo: { + dark: "/public/pepperjack-dark.png", + light: "/public/pepperjack-light.png", + }, + social: [ + { + icon: "github", + label: "GitHub", + href: "https://github.com/catppuccin/userstyles", + }, + ], + editLink: { + baseUrl: "https://github.com/catppuccin/userstyles/edit/main/docs", + }, + expressiveCode: { + themes: ["catppuccin-mocha", "catppuccin-latte"], + styleOverrides: { + frames: { + tooltipSuccessBackground: "var(--green)", + tooltipSuccessForeground: "var(--base)", + }, + textMarkers: { + insBackground: + "color-mix(in oklab, var(--sl-color-green-high) 25%, var(--sl-color-gray-6));", + insBorderColor: "var(--sl-color-gray-5)", + delBackground: + "color-mix(in oklab, var(--sl-color-red-high) 25%, var(--sl-color-gray-6));", + delBorderColor: "var(--sl-color-gray-5)", + }, + codeBackground: "var(--sl-color-gray-6)", + }, + }, + sidebar: [ + { + label: "Getting started", + autogenerate: { directory: "getting-started" }, + }, + { + label: "Contributing", + collapsed: true, + autogenerate: { directory: "contributing" }, + }, + ], + plugins: [ + catppuccin(), + starlightLinksValidator(), + starlightGitHubAlerts(), + starlightImageZoom(), + starlightAutoSidebar(), + ], + }), + ], + redirects: { + "/contributing/standard-library/": + "/contributing/reference/libraries/standard/", + "/reference/browsers/": + "/getting-started/faq/#what-version-of-my-browser-am-i-using", + }, +}); diff --git a/docs/deno.json b/docs/deno.json new file mode 100644 index 0000000000..6f04c6ab83 --- /dev/null +++ b/docs/deno.json @@ -0,0 +1,7 @@ +{ + "fmt": { + "indentWidth": 2, + "proseWrap": "never", + "exclude": ["pnpm-lock.yaml"] + } +} diff --git a/docs/how-to-write-a-userstyle.md b/docs/how-to-write-a-userstyle.md deleted file mode 100644 index bf36c8a072..0000000000 --- a/docs/how-to-write-a-userstyle.md +++ /dev/null @@ -1,245 +0,0 @@ -

-

๐Ÿ“– How to write a userstyle

-

- -

- Beginner-friendly guide for creating a userstyle! -

- -  - -### Table of Contents - - - -- [Prerequisites](#prerequisites) -- [Usercss Metadata](#usercss-metadata) -- [`@-moz-document`](#-moz-document) -- [Applying the theme](#applying-the-theme) -- [The `#catppuccin` mixin](#the-catppuccin-mixin) -- [Putting it all together](#putting-it-all-together) - - - -### Prerequisites - -- [Stylus](https://github.com/openstyles/stylus) ([Firefox](https://addons.mozilla.org/en-GB/firefox/addon/styl-us/) / [Chrome](https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne) - extension). -- A website to theme! - -Assuming you have completed steps 1-4 of [Creating Userstyles](./userstyle-creation.md#creating-userstyles), you should have a new `catppuccin.user.css` file under the `styles//` directory. Follow along in that `catppuccin.user.css` file as we write an example userstyle for [example.org](http://example.org/). - -### Usercss Metadata - -Start by filling out the "metadata block" at the very top of the template. Replace `` with the name of the website you are porting, and please ensure it is capitalized when needed. For `example.org`, it looks like this: - -```less -/* ==UserStyle== -@name example.org Catppuccin -@namespace github.com/catppuccin/userstyles/styles/example.org -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/example.org -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/example.org/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aexample.org -@description Soothing pastel theme for example.org -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire*", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ -``` - -The rest of the metadata block details the preprocessor and the options of the userstyle. This won't need to be changed. For more information, see ["Usercss Metadata" - Stylus Wiki](https://github.com/openstyles/stylus/wiki/Writing-UserCSS#usercss-metadata). - -### `@-moz-document` - -To tell Stylus which website(s) to apply this userstyle on, replace `` with the domain of your port. For `example.org`, it looks like this: - -```less -@-moz-document domain('example.org') { -``` - -> [!NOTE] -> While `domain()` works for most cases, you may need to use [`regexp()`](https://github.com/openstyles/stylus/wiki/Writing-styles#regexp) for websites with more complex URLs. For example: -> -> ```less -> @-moz-document regexp('http://example.(com|net|org|edu)/') { -> ``` - -### Applying the theme - -This section of the template is about applying the user's light/dark flavors. Read the comments for this section in the template thoroughly and decide which of the two options works best for your port. `example.org` doesn't have a light/dark mode toggle, so we'll apply it based on the user's preferences. - - -```less -@media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } -} -@media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } -} -``` - -> [!TIP] -> If `example.org` _did_ use a toggle for changing the theme, we suggest using inspect element to try to observe what changes occur when the toggle is adjusted. Typically websites will have a class or attribute on the root `` element. Some examples from our userstyles include `[theme="dark"]`, `.dark`, `.theme-dark`, etc. - -### The `#catppuccin` mixin - -> [!TIP] -> For more on how Less mixins work, see ["Mixins" - lesscss.org](https://lesscss.org/features/#mixins-feature) and ["A Comprehensive Introduction to Less: Mixins" - SitePoint](https://www.sitepoint.com/a-comprehensive-introduction-to-less-mixins/). - -We'll refer to this next section of the template as the "`#catppuccin` mixin". You can ignore the first half of this section with all of the `@: @catppuccin[@@lookup][@];` lines and skip to the comment where it says `// Start styling your website here:`. As the comment suggests, you will write the CSS rules for your port here. Here is what it looks like for our `example.org` port: - - -```less -#catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - /* ... */ - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - body { - background-color: @base; - - & > div { - color: @text; - background-color: @surface0; - } - } - - a:link, - a:visited { - color: @accent-color; - } - - /* ... */ -} -``` - -### Putting it all together - -Combining all of the previous steps, we have a working userstyle! - -```less -/* ==UserStyle== -@name example.org Catppuccin -@namespace github.com/catppuccin/userstyles/styles/example.org -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/example.org -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/example.org/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aexample.org -@description Soothing pastel theme for example.org -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire*", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('example.org') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - body { - background-color: @base; - - & > div { - color: @text; - background-color: @surface0; - } - } - - a:link, - a:visited { - color: @accent-color; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less -``` - -| Original | Themed | -| --------------------------------------- | ------------------------------------- | -| ![](./images/example.org-original.webp) | ![](./images/example.org-themed.webp) | - -Complete the rest of the steps in [Creating Userstyles](./userstyle-creation.md#creating-userstyles), and then submit your PR! diff --git a/docs/images/example.org-original.webp b/docs/images/example.org-original.webp deleted file mode 100644 index 4e5da1dae2..0000000000 --- a/docs/images/example.org-original.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:f626928a690117a820725b74368dd486d499ca089d32791bcfa0cca77f7bd08a -size 45802 diff --git a/docs/images/example.org-themed.webp b/docs/images/example.org-themed.webp deleted file mode 100644 index d678f6ff89..0000000000 --- a/docs/images/example.org-themed.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:a3f5f77546969b6201f6ae9fd225356aa2fd62953e22c264ddf90b1bd944a830 -size 82836 diff --git a/docs/images/write-new-style-with-usercss.webp b/docs/images/write-new-style-with-usercss.webp deleted file mode 100644 index ed3fefb02b..0000000000 --- a/docs/images/write-new-style-with-usercss.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:a0d7294023bf1b55eb3471c32295538a0582c671bea1d2ec6bf4063e0a29bc33 -size 4742 diff --git a/docs/package.json b/docs/package.json new file mode 100644 index 0000000000..e982e77052 --- /dev/null +++ b/docs/package.json @@ -0,0 +1,28 @@ +{ + "name": "docs", + "private": true, + "type": "module", + "version": "0.0.1", + "scripts": { + "dev": "astro dev", + "start": "astro dev", + "build": "astro build", + "preview": "astro preview", + "astro": "astro" + }, + "dependencies": { + "@astrojs/starlight": "^0.35.2", + "@catppuccin/starlight": "^1.0.2", + "astro": "^5.6.1", + "astro-mermaid": "^1.0.4", + "astro-remote": "^0.3.4", + "mermaid": "^11.10.1", + "remark-custom-heading-id": "^2.0.0", + "sharp": "^0.34.2", + "starlight-auto-sidebar": "^0.2.0", + "starlight-github-alerts": "^0.1.0", + "starlight-image-zoom": "^0.13.0", + "starlight-links-validator": "^0.18.0", + "yaml": "^2.8.1" + } +} diff --git a/docs/pnpm-lock.yaml b/docs/pnpm-lock.yaml new file mode 100644 index 0000000000..5491195d2b --- /dev/null +++ b/docs/pnpm-lock.yaml @@ -0,0 +1,5575 @@ +lockfileVersion: '9.0' + +settings: + autoInstallPeers: true + excludeLinksFromLockfile: false + +importers: + + .: + dependencies: + '@astrojs/starlight': + specifier: ^0.35.2 + version: 0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)) + '@catppuccin/starlight': + specifier: ^1.0.2 + version: 1.1.1(@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)))(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)) + astro: + specifier: ^5.6.1 + version: 5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1) + astro-mermaid: + specifier: ^1.0.4 + version: 1.0.4(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))(mermaid@11.10.1) + astro-remote: + specifier: ^0.3.4 + version: 0.3.4 + mermaid: + specifier: ^11.10.1 + version: 11.10.1 + remark-custom-heading-id: + specifier: ^2.0.0 + version: 2.0.0 + sharp: + specifier: ^0.34.2 + version: 0.34.3 + starlight-auto-sidebar: + specifier: ^0.2.0 + version: 0.2.0(@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))) + starlight-github-alerts: + specifier: ^0.1.0 + version: 0.1.0(@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))) + starlight-image-zoom: + specifier: ^0.13.0 + version: 0.13.0(@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))) + starlight-links-validator: + specifier: ^0.18.0 + version: 0.18.0(@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))) + yaml: + specifier: ^2.8.1 + version: 2.8.1 + +packages: + + '@antfu/install-pkg@1.1.0': + resolution: {integrity: sha512-MGQsmw10ZyI+EJo45CdSER4zEb+p31LpDAFp2Z3gkSd1yqVZGi0Ebx++YTEMonJy4oChEMLsxZ64j8FH6sSqtQ==} + + '@antfu/utils@8.1.1': + resolution: {integrity: sha512-Mex9nXf9vR6AhcXmMrlz/HVgYYZpVGJ6YlPgwl7UnaFpnshXs6EK/oa5Gpf3CzENMjkvEx2tQtntGnb7UtSTOQ==} + + '@astrojs/compiler@2.12.2': + resolution: {integrity: sha512-w2zfvhjNCkNMmMMOn5b0J8+OmUaBL1o40ipMvqcG6NRpdC+lKxmTi48DT8Xw0SzJ3AfmeFLB45zXZXtmbsjcgw==} + + '@astrojs/internal-helpers@0.7.2': + resolution: {integrity: sha512-KCkCqR3Goym79soqEtbtLzJfqhTWMyVaizUi35FLzgGSzBotSw8DB1qwsu7U96ihOJgYhDk2nVPz+3LnXPeX6g==} + + '@astrojs/markdown-remark@6.3.6': + resolution: {integrity: sha512-bwylYktCTsLMVoCOEHbn2GSUA3c5KT/qilekBKA3CBng0bo1TYjNZPr761vxumRk9kJGqTOtU+fgCAp5Vwokug==} + + '@astrojs/mdx@4.3.4': + resolution: {integrity: sha512-Ew3iP+6zuzzJWNEH5Qr1iknrue1heEfgmfuMpuwLaSwqlUiJQ0NDb2oxKosgWU1ROYmVf1H4KCmS6QdMWKyFjw==} + engines: {node: 18.20.8 || ^20.3.0 || >=22.0.0} + peerDependencies: + astro: ^5.0.0 + + '@astrojs/prism@3.3.0': + resolution: {integrity: sha512-q8VwfU/fDZNoDOf+r7jUnMC2//H2l0TuQ6FkGJL8vD8nw/q5KiL3DS1KKBI3QhI9UQhpJ5dc7AtqfbXWuOgLCQ==} + engines: {node: 18.20.8 || ^20.3.0 || >=22.0.0} + + '@astrojs/sitemap@3.5.1': + resolution: {integrity: sha512-uX5z52GLtQTgOe8r3jeGmFRYrFe52mdpLYJzqjvL1cdy5Kg3MLOZEvaZ/OCH0fSq0t7e50uJQ6oBMZG0ffszBg==} + + '@astrojs/starlight@0.35.2': + resolution: {integrity: sha512-curGghoW4s5pCbW2tINsJPoxEYPan87ptCOv7GZ+S24N3J6AyaOu/OsjZDEMaIpo3ZlObM5DQn+w7iXl3drDhQ==} + peerDependencies: + astro: ^5.5.0 + + '@astrojs/telemetry@3.3.0': + resolution: {integrity: sha512-UFBgfeldP06qu6khs/yY+q1cDAaArM2/7AEIqQ9Cuvf7B1hNLq0xDrZkct+QoIGyjq56y8IaE2I3CTvG99mlhQ==} + engines: {node: 18.20.8 || ^20.3.0 || >=22.0.0} + + '@babel/helper-string-parser@7.27.1': + resolution: {integrity: sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==} + engines: {node: '>=6.9.0'} + + '@babel/helper-validator-identifier@7.27.1': + resolution: {integrity: sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==} + engines: {node: '>=6.9.0'} + + '@babel/parser@7.28.4': + resolution: {integrity: sha512-yZbBqeM6TkpP9du/I2pUZnJsRMGGvOuIrhjzC1AwHwW+6he4mni6Bp/m8ijn0iOuZuPI2BfkCoSRunpyjnrQKg==} + engines: {node: '>=6.0.0'} + hasBin: true + + '@babel/runtime@7.28.3': + resolution: {integrity: sha512-9uIQ10o0WGdpP6GDhXcdOJPJuDgFtIDtN/9+ArJQ2NAfAmiuhTQdzkaTGR33v43GYS2UrSA0eX2pPPHoFVvpxA==} + engines: {node: '>=6.9.0'} + + '@babel/types@7.28.4': + resolution: {integrity: sha512-bkFqkLhh3pMBUQQkpVgWDWq/lqzc2678eUyDlTBhRqhCHFguYYGM0Efga7tYk4TogG/3x0EEl66/OQ+WGbWB/Q==} + engines: {node: '>=6.9.0'} + + '@braintree/sanitize-url@7.1.1': + resolution: {integrity: sha512-i1L7noDNxtFyL5DmZafWy1wRVhGehQmzZaz1HiN5e7iylJMSZR7ekOV7NsIqa5qBldlLrsKv4HbgFUVlQrz8Mw==} + + '@capsizecss/unpack@2.4.0': + resolution: {integrity: sha512-GrSU71meACqcmIUxPYOJvGKF0yryjN/L1aCuE9DViCTJI7bfkjgYDPD1zbNDcINJwSSP6UaBZY9GAbYDO7re0Q==} + + '@catppuccin/starlight@1.1.1': + resolution: {integrity: sha512-iyI/gdGfqREetGti3O11l7iMLCmt0LRSbIis8ySlZo8hqb749KyMmisO/9kqBvk2oFKw9hGNDbutcNxKSI2spg==} + peerDependencies: + '@astrojs/starlight': '>=0.34' + astro: ^5.0.0 + + '@chevrotain/cst-dts-gen@11.0.3': + resolution: {integrity: sha512-BvIKpRLeS/8UbfxXxgC33xOumsacaeCKAjAeLyOn7Pcp95HiRbrpl14S+9vaZLolnbssPIUuiUd8IvgkRyt6NQ==} + + '@chevrotain/gast@11.0.3': + resolution: {integrity: sha512-+qNfcoNk70PyS/uxmj3li5NiECO+2YKZZQMbmjTqRI3Qchu8Hig/Q9vgkHpI3alNjr7M+a2St5pw5w5F6NL5/Q==} + + '@chevrotain/regexp-to-ast@11.0.3': + resolution: {integrity: sha512-1fMHaBZxLFvWI067AVbGJav1eRY7N8DDvYCTwGBiE/ytKBgP8azTdgyrKyWZ9Mfh09eHWb5PgTSO8wi7U824RA==} + + '@chevrotain/types@11.0.3': + resolution: {integrity: sha512-gsiM3G8b58kZC2HaWR50gu6Y1440cHiJ+i3JUvcp/35JchYejb2+5MVeJK0iKThYpAa/P2PYFV4hoi44HD+aHQ==} + + '@chevrotain/utils@11.0.3': + resolution: {integrity: sha512-YslZMgtJUyuMbZ+aKvfF3x1f5liK4mWNxghFRv7jqRR9C3R3fAOGTTKvxXDa2Y1s9zSbcpuO0cAxDYsc9SrXoQ==} + + '@ctrl/tinycolor@4.1.0': + resolution: {integrity: sha512-WyOx8cJQ+FQus4Mm4uPIZA64gbk3Wxh0so5Lcii0aJifqwoVOlfFtorjLE0Hen4OYyHZMXDWqMmaQemBhgxFRQ==} + engines: {node: '>=14'} + + '@emnapi/runtime@1.5.0': + resolution: {integrity: sha512-97/BJ3iXHww3djw6hYIfErCZFee7qCtrneuLa20UXFCOTCfBM2cvQHjWJ2EG0s0MtdNwInarqCTz35i4wWXHsQ==} + + '@esbuild/aix-ppc64@0.25.9': + resolution: {integrity: sha512-OaGtL73Jck6pBKjNIe24BnFE6agGl+6KxDtTfHhy1HmhthfKouEcOhqpSL64K4/0WCtbKFLOdzD/44cJ4k9opA==} + engines: {node: '>=18'} + cpu: [ppc64] + os: [aix] + + '@esbuild/android-arm64@0.25.9': + resolution: {integrity: sha512-IDrddSmpSv51ftWslJMvl3Q2ZT98fUSL2/rlUXuVqRXHCs5EUF1/f+jbjF5+NG9UffUDMCiTyh8iec7u8RlTLg==} + engines: {node: '>=18'} + cpu: [arm64] + os: [android] + + '@esbuild/android-arm@0.25.9': + resolution: {integrity: sha512-5WNI1DaMtxQ7t7B6xa572XMXpHAaI/9Hnhk8lcxF4zVN4xstUgTlvuGDorBguKEnZO70qwEcLpfifMLoxiPqHQ==} + engines: {node: '>=18'} + cpu: [arm] + os: [android] + + '@esbuild/android-x64@0.25.9': + resolution: {integrity: sha512-I853iMZ1hWZdNllhVZKm34f4wErd4lMyeV7BLzEExGEIZYsOzqDWDf+y082izYUE8gtJnYHdeDpN/6tUdwvfiw==} + engines: {node: '>=18'} + cpu: [x64] + os: [android] + + '@esbuild/darwin-arm64@0.25.9': + resolution: {integrity: sha512-XIpIDMAjOELi/9PB30vEbVMs3GV1v2zkkPnuyRRURbhqjyzIINwj+nbQATh4H9GxUgH1kFsEyQMxwiLFKUS6Rg==} + engines: {node: '>=18'} + cpu: [arm64] + os: [darwin] + + '@esbuild/darwin-x64@0.25.9': + resolution: {integrity: sha512-jhHfBzjYTA1IQu8VyrjCX4ApJDnH+ez+IYVEoJHeqJm9VhG9Dh2BYaJritkYK3vMaXrf7Ogr/0MQ8/MeIefsPQ==} + engines: {node: '>=18'} + cpu: [x64] + os: [darwin] + + '@esbuild/freebsd-arm64@0.25.9': + resolution: {integrity: sha512-z93DmbnY6fX9+KdD4Ue/H6sYs+bhFQJNCPZsi4XWJoYblUqT06MQUdBCpcSfuiN72AbqeBFu5LVQTjfXDE2A6Q==} + engines: {node: '>=18'} + cpu: [arm64] + os: [freebsd] + + '@esbuild/freebsd-x64@0.25.9': + resolution: {integrity: sha512-mrKX6H/vOyo5v71YfXWJxLVxgy1kyt1MQaD8wZJgJfG4gq4DpQGpgTB74e5yBeQdyMTbgxp0YtNj7NuHN0PoZg==} + engines: {node: '>=18'} + cpu: [x64] + os: [freebsd] + + '@esbuild/linux-arm64@0.25.9': + resolution: {integrity: sha512-BlB7bIcLT3G26urh5Dmse7fiLmLXnRlopw4s8DalgZ8ef79Jj4aUcYbk90g8iCa2467HX8SAIidbL7gsqXHdRw==} + engines: {node: '>=18'} + cpu: [arm64] + os: [linux] + + '@esbuild/linux-arm@0.25.9': + resolution: {integrity: sha512-HBU2Xv78SMgaydBmdor38lg8YDnFKSARg1Q6AT0/y2ezUAKiZvc211RDFHlEZRFNRVhcMamiToo7bDx3VEOYQw==} + engines: {node: '>=18'} + cpu: [arm] + os: [linux] + + '@esbuild/linux-ia32@0.25.9': + resolution: {integrity: sha512-e7S3MOJPZGp2QW6AK6+Ly81rC7oOSerQ+P8L0ta4FhVi+/j/v2yZzx5CqqDaWjtPFfYz21Vi1S0auHrap3Ma3A==} + engines: {node: '>=18'} + cpu: [ia32] + os: [linux] + + '@esbuild/linux-loong64@0.25.9': + resolution: {integrity: sha512-Sbe10Bnn0oUAB2AalYztvGcK+o6YFFA/9829PhOCUS9vkJElXGdphz0A3DbMdP8gmKkqPmPcMJmJOrI3VYB1JQ==} + engines: {node: '>=18'} + cpu: [loong64] + os: [linux] + + '@esbuild/linux-mips64el@0.25.9': + resolution: {integrity: sha512-YcM5br0mVyZw2jcQeLIkhWtKPeVfAerES5PvOzaDxVtIyZ2NUBZKNLjC5z3/fUlDgT6w89VsxP2qzNipOaaDyA==} + engines: {node: '>=18'} + cpu: [mips64el] + os: [linux] + + '@esbuild/linux-ppc64@0.25.9': + resolution: {integrity: sha512-++0HQvasdo20JytyDpFvQtNrEsAgNG2CY1CLMwGXfFTKGBGQT3bOeLSYE2l1fYdvML5KUuwn9Z8L1EWe2tzs1w==} + engines: {node: '>=18'} + cpu: [ppc64] + os: [linux] + + '@esbuild/linux-riscv64@0.25.9': + resolution: {integrity: sha512-uNIBa279Y3fkjV+2cUjx36xkx7eSjb8IvnL01eXUKXez/CBHNRw5ekCGMPM0BcmqBxBcdgUWuUXmVWwm4CH9kg==} + engines: {node: '>=18'} + cpu: [riscv64] + os: [linux] + + '@esbuild/linux-s390x@0.25.9': + resolution: {integrity: sha512-Mfiphvp3MjC/lctb+7D287Xw1DGzqJPb/J2aHHcHxflUo+8tmN/6d4k6I2yFR7BVo5/g7x2Monq4+Yew0EHRIA==} + engines: {node: '>=18'} + cpu: [s390x] + os: [linux] + + '@esbuild/linux-x64@0.25.9': + resolution: {integrity: sha512-iSwByxzRe48YVkmpbgoxVzn76BXjlYFXC7NvLYq+b+kDjyyk30J0JY47DIn8z1MO3K0oSl9fZoRmZPQI4Hklzg==} + engines: {node: '>=18'} + cpu: [x64] + os: [linux] + + '@esbuild/netbsd-arm64@0.25.9': + resolution: {integrity: sha512-9jNJl6FqaUG+COdQMjSCGW4QiMHH88xWbvZ+kRVblZsWrkXlABuGdFJ1E9L7HK+T0Yqd4akKNa/lO0+jDxQD4Q==} + engines: {node: '>=18'} + cpu: [arm64] + os: [netbsd] + + '@esbuild/netbsd-x64@0.25.9': + resolution: {integrity: sha512-RLLdkflmqRG8KanPGOU7Rpg829ZHu8nFy5Pqdi9U01VYtG9Y0zOG6Vr2z4/S+/3zIyOxiK6cCeYNWOFR9QP87g==} + engines: {node: '>=18'} + cpu: [x64] + os: [netbsd] + + '@esbuild/openbsd-arm64@0.25.9': + resolution: {integrity: sha512-YaFBlPGeDasft5IIM+CQAhJAqS3St3nJzDEgsgFixcfZeyGPCd6eJBWzke5piZuZ7CtL656eOSYKk4Ls2C0FRQ==} + engines: {node: '>=18'} + cpu: [arm64] + os: [openbsd] + + '@esbuild/openbsd-x64@0.25.9': + resolution: {integrity: sha512-1MkgTCuvMGWuqVtAvkpkXFmtL8XhWy+j4jaSO2wxfJtilVCi0ZE37b8uOdMItIHz4I6z1bWWtEX4CJwcKYLcuA==} + engines: {node: '>=18'} + cpu: [x64] + os: [openbsd] + + '@esbuild/openharmony-arm64@0.25.9': + resolution: {integrity: sha512-4Xd0xNiMVXKh6Fa7HEJQbrpP3m3DDn43jKxMjxLLRjWnRsfxjORYJlXPO4JNcXtOyfajXorRKY9NkOpTHptErg==} + engines: {node: '>=18'} + cpu: [arm64] + os: [openharmony] + + '@esbuild/sunos-x64@0.25.9': + resolution: {integrity: sha512-WjH4s6hzo00nNezhp3wFIAfmGZ8U7KtrJNlFMRKxiI9mxEK1scOMAaa9i4crUtu+tBr+0IN6JCuAcSBJZfnphw==} + engines: {node: '>=18'} + cpu: [x64] + os: [sunos] + + '@esbuild/win32-arm64@0.25.9': + resolution: {integrity: sha512-mGFrVJHmZiRqmP8xFOc6b84/7xa5y5YvR1x8djzXpJBSv/UsNK6aqec+6JDjConTgvvQefdGhFDAs2DLAds6gQ==} + engines: {node: '>=18'} + cpu: [arm64] + os: [win32] + + '@esbuild/win32-ia32@0.25.9': + resolution: {integrity: sha512-b33gLVU2k11nVx1OhX3C8QQP6UHQK4ZtN56oFWvVXvz2VkDoe6fbG8TOgHFxEvqeqohmRnIHe5A1+HADk4OQww==} + engines: {node: '>=18'} + cpu: [ia32] + os: [win32] + + '@esbuild/win32-x64@0.25.9': + resolution: {integrity: sha512-PPOl1mi6lpLNQxnGoyAfschAodRFYXJ+9fs6WHXz7CSWKbOqiMZsubC+BQsVKuul+3vKLuwTHsS2c2y9EoKwxQ==} + engines: {node: '>=18'} + cpu: [x64] + os: [win32] + + '@expressive-code/core@0.41.3': + resolution: {integrity: sha512-9qzohqU7O0+JwMEEgQhnBPOw5DtsQRBXhW++5fvEywsuX44vCGGof1SL5OvPElvNgaWZ4pFZAFSlkNOkGyLwSQ==} + + '@expressive-code/plugin-frames@0.41.3': + resolution: {integrity: sha512-rFQtmf/3N2CK3Cq/uERweMTYZnBu+CwxBdHuOftEmfA9iBE7gTVvwpbh82P9ZxkPLvc40UMhYt7uNuAZexycRQ==} + + '@expressive-code/plugin-shiki@0.41.3': + resolution: {integrity: sha512-RlTARoopzhFJIOVHLGvuXJ8DCEme/hjV+ZnRJBIxzxsKVpGPW4Oshqg9xGhWTYdHstTsxO663s0cdBLzZj9TQA==} + + '@expressive-code/plugin-text-markers@0.41.3': + resolution: {integrity: sha512-SN8tkIzDpA0HLAscEYD2IVrfLiid6qEdE9QLlGVSxO1KEw7qYvjpbNBQjUjMr5/jvTJ7ys6zysU2vLPHE0sb2g==} + + '@iconify/types@2.0.0': + resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==} + + '@iconify/utils@2.3.0': + resolution: {integrity: sha512-GmQ78prtwYW6EtzXRU1rY+KwOKfz32PD7iJh6Iyqw68GiKuoZ2A6pRtzWONz5VQJbp50mEjXh/7NkumtrAgRKA==} + + '@img/sharp-darwin-arm64@0.33.5': + resolution: {integrity: sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [arm64] + os: [darwin] + + '@img/sharp-darwin-arm64@0.34.3': + resolution: {integrity: sha512-ryFMfvxxpQRsgZJqBd4wsttYQbCxsJksrv9Lw/v798JcQ8+w84mBWuXwl+TT0WJ/WrYOLaYpwQXi3sA9nTIaIg==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [arm64] + os: [darwin] + + '@img/sharp-darwin-x64@0.33.5': + resolution: {integrity: sha512-fyHac4jIc1ANYGRDxtiqelIbdWkIuQaI84Mv45KvGRRxSAa7o7d1ZKAOBaYbnepLC1WqxfpimdeWfvqqSGwR2Q==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [x64] + os: [darwin] + + '@img/sharp-darwin-x64@0.34.3': + resolution: {integrity: sha512-yHpJYynROAj12TA6qil58hmPmAwxKKC7reUqtGLzsOHfP7/rniNGTL8tjWX6L3CTV4+5P4ypcS7Pp+7OB+8ihA==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [x64] + os: [darwin] + + '@img/sharp-libvips-darwin-arm64@1.0.4': + resolution: {integrity: sha512-XblONe153h0O2zuFfTAbQYAX2JhYmDHeWikp1LM9Hul9gVPjFY427k6dFEcOL72O01QxQsWi761svJ/ev9xEDg==} + cpu: [arm64] + os: [darwin] + + '@img/sharp-libvips-darwin-arm64@1.2.0': + resolution: {integrity: sha512-sBZmpwmxqwlqG9ueWFXtockhsxefaV6O84BMOrhtg/YqbTaRdqDE7hxraVE3y6gVM4eExmfzW4a8el9ArLeEiQ==} + cpu: [arm64] + os: [darwin] + + '@img/sharp-libvips-darwin-x64@1.0.4': + resolution: {integrity: sha512-xnGR8YuZYfJGmWPvmlunFaWJsb9T/AO2ykoP3Fz/0X5XV2aoYBPkX6xqCQvUTKKiLddarLaxpzNe+b1hjeWHAQ==} + cpu: [x64] + os: [darwin] + + '@img/sharp-libvips-darwin-x64@1.2.0': + resolution: {integrity: sha512-M64XVuL94OgiNHa5/m2YvEQI5q2cl9d/wk0qFTDVXcYzi43lxuiFTftMR1tOnFQovVXNZJ5TURSDK2pNe9Yzqg==} + cpu: [x64] + os: [darwin] + + '@img/sharp-libvips-linux-arm64@1.0.4': + resolution: {integrity: sha512-9B+taZ8DlyyqzZQnoeIvDVR/2F4EbMepXMc/NdVbkzsJbzkUjhXv/70GQJ7tdLA4YJgNP25zukcxpX2/SueNrA==} + cpu: [arm64] + os: [linux] + libc: [glibc] + + '@img/sharp-libvips-linux-arm64@1.2.0': + resolution: {integrity: sha512-RXwd0CgG+uPRX5YYrkzKyalt2OJYRiJQ8ED/fi1tq9WQW2jsQIn0tqrlR5l5dr/rjqq6AHAxURhj2DVjyQWSOA==} + cpu: [arm64] + os: [linux] + libc: [glibc] + + '@img/sharp-libvips-linux-arm@1.0.5': + resolution: {integrity: sha512-gvcC4ACAOPRNATg/ov8/MnbxFDJqf/pDePbBnuBDcjsI8PssmjoKMAz4LtLaVi+OnSb5FK/yIOamqDwGmXW32g==} + cpu: [arm] + os: [linux] + libc: [glibc] + + '@img/sharp-libvips-linux-arm@1.2.0': + resolution: {integrity: sha512-mWd2uWvDtL/nvIzThLq3fr2nnGfyr/XMXlq8ZJ9WMR6PXijHlC3ksp0IpuhK6bougvQrchUAfzRLnbsen0Cqvw==} + cpu: [arm] + os: [linux] + libc: [glibc] + + '@img/sharp-libvips-linux-ppc64@1.2.0': + resolution: {integrity: sha512-Xod/7KaDDHkYu2phxxfeEPXfVXFKx70EAFZ0qyUdOjCcxbjqyJOEUpDe6RIyaunGxT34Anf9ue/wuWOqBW2WcQ==} + cpu: [ppc64] + os: [linux] + libc: [glibc] + + '@img/sharp-libvips-linux-s390x@1.0.4': + resolution: {integrity: sha512-u7Wz6ntiSSgGSGcjZ55im6uvTrOxSIS8/dgoVMoiGE9I6JAfU50yH5BoDlYA1tcuGS7g/QNtetJnxA6QEsCVTA==} + cpu: [s390x] + os: [linux] + libc: [glibc] + + '@img/sharp-libvips-linux-s390x@1.2.0': + resolution: {integrity: sha512-eMKfzDxLGT8mnmPJTNMcjfO33fLiTDsrMlUVcp6b96ETbnJmd4uvZxVJSKPQfS+odwfVaGifhsB07J1LynFehw==} + cpu: [s390x] + os: [linux] + libc: [glibc] + + '@img/sharp-libvips-linux-x64@1.0.4': + resolution: {integrity: sha512-MmWmQ3iPFZr0Iev+BAgVMb3ZyC4KeFc3jFxnNbEPas60e1cIfevbtuyf9nDGIzOaW9PdnDciJm+wFFaTlj5xYw==} + cpu: [x64] + os: [linux] + libc: [glibc] + + '@img/sharp-libvips-linux-x64@1.2.0': + resolution: {integrity: sha512-ZW3FPWIc7K1sH9E3nxIGB3y3dZkpJlMnkk7z5tu1nSkBoCgw2nSRTFHI5pB/3CQaJM0pdzMF3paf9ckKMSE9Tg==} + cpu: [x64] + os: [linux] + libc: [glibc] + + '@img/sharp-libvips-linuxmusl-arm64@1.0.4': + resolution: {integrity: sha512-9Ti+BbTYDcsbp4wfYib8Ctm1ilkugkA/uscUn6UXK1ldpC1JjiXbLfFZtRlBhjPZ5o1NCLiDbg8fhUPKStHoTA==} + cpu: [arm64] + os: [linux] + libc: [musl] + + '@img/sharp-libvips-linuxmusl-arm64@1.2.0': + resolution: {integrity: sha512-UG+LqQJbf5VJ8NWJ5Z3tdIe/HXjuIdo4JeVNADXBFuG7z9zjoegpzzGIyV5zQKi4zaJjnAd2+g2nna8TZvuW9Q==} + cpu: [arm64] + os: [linux] + libc: [musl] + + '@img/sharp-libvips-linuxmusl-x64@1.0.4': + resolution: {integrity: sha512-viYN1KX9m+/hGkJtvYYp+CCLgnJXwiQB39damAO7WMdKWlIhmYTfHjwSbQeUK/20vY154mwezd9HflVFM1wVSw==} + cpu: [x64] + os: [linux] + libc: [musl] + + '@img/sharp-libvips-linuxmusl-x64@1.2.0': + resolution: {integrity: sha512-SRYOLR7CXPgNze8akZwjoGBoN1ThNZoqpOgfnOxmWsklTGVfJiGJoC/Lod7aNMGA1jSsKWM1+HRX43OP6p9+6Q==} + cpu: [x64] + os: [linux] + libc: [musl] + + '@img/sharp-linux-arm64@0.33.5': + resolution: {integrity: sha512-JMVv+AMRyGOHtO1RFBiJy/MBsgz0x4AWrT6QoEVVTyh1E39TrCUpTRI7mx9VksGX4awWASxqCYLCV4wBZHAYxA==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [arm64] + os: [linux] + libc: [glibc] + + '@img/sharp-linux-arm64@0.34.3': + resolution: {integrity: sha512-QdrKe3EvQrqwkDrtuTIjI0bu6YEJHTgEeqdzI3uWJOH6G1O8Nl1iEeVYRGdj1h5I21CqxSvQp1Yv7xeU3ZewbA==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [arm64] + os: [linux] + libc: [glibc] + + '@img/sharp-linux-arm@0.33.5': + resolution: {integrity: sha512-JTS1eldqZbJxjvKaAkxhZmBqPRGmxgu+qFKSInv8moZ2AmT5Yib3EQ1c6gp493HvrvV8QgdOXdyaIBrhvFhBMQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [arm] + os: [linux] + libc: [glibc] + + '@img/sharp-linux-arm@0.34.3': + resolution: {integrity: sha512-oBK9l+h6KBN0i3dC8rYntLiVfW8D8wH+NPNT3O/WBHeW0OQWCjfWksLUaPidsrDKpJgXp3G3/hkmhptAW0I3+A==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [arm] + os: [linux] + libc: [glibc] + + '@img/sharp-linux-ppc64@0.34.3': + resolution: {integrity: sha512-GLtbLQMCNC5nxuImPR2+RgrviwKwVql28FWZIW1zWruy6zLgA5/x2ZXk3mxj58X/tszVF69KK0Is83V8YgWhLA==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [ppc64] + os: [linux] + libc: [glibc] + + '@img/sharp-linux-s390x@0.33.5': + resolution: {integrity: sha512-y/5PCd+mP4CA/sPDKl2961b+C9d+vPAveS33s6Z3zfASk2j5upL6fXVPZi7ztePZ5CuH+1kW8JtvxgbuXHRa4Q==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [s390x] + os: [linux] + libc: [glibc] + + '@img/sharp-linux-s390x@0.34.3': + resolution: {integrity: sha512-3gahT+A6c4cdc2edhsLHmIOXMb17ltffJlxR0aC2VPZfwKoTGZec6u5GrFgdR7ciJSsHT27BD3TIuGcuRT0KmQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [s390x] + os: [linux] + libc: [glibc] + + '@img/sharp-linux-x64@0.33.5': + resolution: {integrity: sha512-opC+Ok5pRNAzuvq1AG0ar+1owsu842/Ab+4qvU879ippJBHvyY5n2mxF1izXqkPYlGuP/M556uh53jRLJmzTWA==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [x64] + os: [linux] + libc: [glibc] + + '@img/sharp-linux-x64@0.34.3': + resolution: {integrity: sha512-8kYso8d806ypnSq3/Ly0QEw90V5ZoHh10yH0HnrzOCr6DKAPI6QVHvwleqMkVQ0m+fc7EH8ah0BB0QPuWY6zJQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [x64] + os: [linux] + libc: [glibc] + + '@img/sharp-linuxmusl-arm64@0.33.5': + resolution: {integrity: sha512-XrHMZwGQGvJg2V/oRSUfSAfjfPxO+4DkiRh6p2AFjLQztWUuY/o8Mq0eMQVIY7HJ1CDQUJlxGGZRw1a5bqmd1g==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [arm64] + os: [linux] + libc: [musl] + + '@img/sharp-linuxmusl-arm64@0.34.3': + resolution: {integrity: sha512-vAjbHDlr4izEiXM1OTggpCcPg9tn4YriK5vAjowJsHwdBIdx0fYRsURkxLG2RLm9gyBq66gwtWI8Gx0/ov+JKQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [arm64] + os: [linux] + libc: [musl] + + '@img/sharp-linuxmusl-x64@0.33.5': + resolution: {integrity: sha512-WT+d/cgqKkkKySYmqoZ8y3pxx7lx9vVejxW/W4DOFMYVSkErR+w7mf2u8m/y4+xHe7yY9DAXQMWQhpnMuFfScw==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [x64] + os: [linux] + libc: [musl] + + '@img/sharp-linuxmusl-x64@0.34.3': + resolution: {integrity: sha512-gCWUn9547K5bwvOn9l5XGAEjVTTRji4aPTqLzGXHvIr6bIDZKNTA34seMPgM0WmSf+RYBH411VavCejp3PkOeQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [x64] + os: [linux] + libc: [musl] + + '@img/sharp-wasm32@0.33.5': + resolution: {integrity: sha512-ykUW4LVGaMcU9lu9thv85CbRMAwfeadCJHRsg2GmeRa/cJxsVY9Rbd57JcMxBkKHag5U/x7TSBpScF4U8ElVzg==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [wasm32] + + '@img/sharp-wasm32@0.34.3': + resolution: {integrity: sha512-+CyRcpagHMGteySaWos8IbnXcHgfDn7pO2fiC2slJxvNq9gDipYBN42/RagzctVRKgxATmfqOSulgZv5e1RdMg==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [wasm32] + + '@img/sharp-win32-arm64@0.34.3': + resolution: {integrity: sha512-MjnHPnbqMXNC2UgeLJtX4XqoVHHlZNd+nPt1kRPmj63wURegwBhZlApELdtxM2OIZDRv/DFtLcNhVbd1z8GYXQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [arm64] + os: [win32] + + '@img/sharp-win32-ia32@0.33.5': + resolution: {integrity: sha512-T36PblLaTwuVJ/zw/LaH0PdZkRz5rd3SmMHX8GSmR7vtNSP5Z6bQkExdSK7xGWyxLw4sUknBuugTelgw2faBbQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [ia32] + os: [win32] + + '@img/sharp-win32-ia32@0.34.3': + resolution: {integrity: sha512-xuCdhH44WxuXgOM714hn4amodJMZl3OEvf0GVTm0BEyMeA2to+8HEdRPShH0SLYptJY1uBw+SCFP9WVQi1Q/cw==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [ia32] + os: [win32] + + '@img/sharp-win32-x64@0.33.5': + resolution: {integrity: sha512-MpY/o8/8kj+EcnxwvrP4aTJSWw/aZ7JIGR4aBeZkZw5B7/Jn+tY9/VNwtcoGmdT7GfggGIU4kygOMSbYnOrAbg==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [x64] + os: [win32] + + '@img/sharp-win32-x64@0.34.3': + resolution: {integrity: sha512-OWwz05d++TxzLEv4VnsTz5CmZ6mI6S05sfQGEMrNrQcOEERbX46332IvE7pO/EUiw7jUrrS40z/M7kPyjfl04g==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + cpu: [x64] + os: [win32] + + '@jridgewell/sourcemap-codec@1.5.5': + resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==} + + '@mdx-js/mdx@3.1.0': + resolution: {integrity: sha512-/QxEhPAvGwbQmy1Px8F899L5Uc2KZ6JtXwlCgJmjSTBedwOZkByYcBG4GceIGPXRDsmfxhHazuS+hlOShRLeDw==} + + '@mermaid-js/parser@0.6.2': + resolution: {integrity: sha512-+PO02uGF6L6Cs0Bw8RpGhikVvMWEysfAyl27qTlroUB8jSWr1lL0Sf6zi78ZxlSnmgSY2AMMKVgghnN9jTtwkQ==} + + '@oslojs/encoding@1.1.0': + resolution: {integrity: sha512-70wQhgYmndg4GCPxPPxPGevRKqTIJ2Nh4OkiMWmDAVYsTQ+Ta7Sq+rPevXyXGdzr30/qZBnyOalCszoMxlyldQ==} + + '@pagefind/darwin-arm64@1.3.0': + resolution: {integrity: sha512-365BEGl6ChOsauRjyVpBjXybflXAOvoMROw3TucAROHIcdBvXk9/2AmEvGFU0r75+vdQI4LJdJdpH4Y6Yqaj4A==} + cpu: [arm64] + os: [darwin] + + '@pagefind/darwin-x64@1.3.0': + resolution: {integrity: sha512-zlGHA23uuXmS8z3XxEGmbHpWDxXfPZ47QS06tGUq0HDcZjXjXHeLG+cboOy828QIV5FXsm9MjfkP5e4ZNbOkow==} + cpu: [x64] + os: [darwin] + + '@pagefind/default-ui@1.3.0': + resolution: {integrity: sha512-CGKT9ccd3+oRK6STXGgfH+m0DbOKayX6QGlq38TfE1ZfUcPc5+ulTuzDbZUnMo+bubsEOIypm4Pl2iEyzZ1cNg==} + + '@pagefind/linux-arm64@1.3.0': + resolution: {integrity: sha512-8lsxNAiBRUk72JvetSBXs4WRpYrQrVJXjlRRnOL6UCdBN9Nlsz0t7hWstRk36+JqHpGWOKYiuHLzGYqYAqoOnQ==} + cpu: [arm64] + os: [linux] + + '@pagefind/linux-x64@1.3.0': + resolution: {integrity: sha512-hAvqdPJv7A20Ucb6FQGE6jhjqy+vZ6pf+s2tFMNtMBG+fzcdc91uTw7aP/1Vo5plD0dAOHwdxfkyw0ugal4kcQ==} + cpu: [x64] + os: [linux] + + '@pagefind/windows-x64@1.3.0': + resolution: {integrity: sha512-BR1bIRWOMqkf8IoU576YDhij1Wd/Zf2kX/kCI0b2qzCKC8wcc2GQJaaRMCpzvCCrmliO4vtJ6RITp/AnoYUUmQ==} + cpu: [x64] + os: [win32] + + '@rollup/pluginutils@5.3.0': + resolution: {integrity: sha512-5EdhGZtnu3V88ces7s53hhfK5KSASnJZv8Lulpc04cWO3REESroJXg73DFsOmgbU2BhwV0E20bu2IDZb3VKW4Q==} + engines: {node: '>=14.0.0'} + peerDependencies: + rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0 + peerDependenciesMeta: + rollup: + optional: true + + '@rollup/rollup-android-arm-eabi@4.50.1': + resolution: {integrity: sha512-HJXwzoZN4eYTdD8bVV22DN8gsPCAj3V20NHKOs8ezfXanGpmVPR7kalUHd+Y31IJp9stdB87VKPFbsGY3H/2ag==} + cpu: [arm] + os: [android] + + '@rollup/rollup-android-arm64@4.50.1': + resolution: {integrity: sha512-PZlsJVcjHfcH53mOImyt3bc97Ep3FJDXRpk9sMdGX0qgLmY0EIWxCag6EigerGhLVuL8lDVYNnSo8qnTElO4xw==} + cpu: [arm64] + os: [android] + + '@rollup/rollup-darwin-arm64@4.50.1': + resolution: {integrity: sha512-xc6i2AuWh++oGi4ylOFPmzJOEeAa2lJeGUGb4MudOtgfyyjr4UPNK+eEWTPLvmPJIY/pgw6ssFIox23SyrkkJw==} + cpu: [arm64] + os: [darwin] + + '@rollup/rollup-darwin-x64@4.50.1': + resolution: {integrity: sha512-2ofU89lEpDYhdLAbRdeyz/kX3Y2lpYc6ShRnDjY35bZhd2ipuDMDi6ZTQ9NIag94K28nFMofdnKeHR7BT0CATw==} + cpu: [x64] + os: [darwin] + + '@rollup/rollup-freebsd-arm64@4.50.1': + resolution: {integrity: sha512-wOsE6H2u6PxsHY/BeFHA4VGQN3KUJFZp7QJBmDYI983fgxq5Th8FDkVuERb2l9vDMs1D5XhOrhBrnqcEY6l8ZA==} + cpu: [arm64] + os: [freebsd] + + '@rollup/rollup-freebsd-x64@4.50.1': + resolution: {integrity: sha512-A/xeqaHTlKbQggxCqispFAcNjycpUEHP52mwMQZUNqDUJFFYtPHCXS1VAG29uMlDzIVr+i00tSFWFLivMcoIBQ==} + cpu: [x64] + os: [freebsd] + + '@rollup/rollup-linux-arm-gnueabihf@4.50.1': + resolution: {integrity: sha512-54v4okehwl5TaSIkpp97rAHGp7t3ghinRd/vyC1iXqXMfjYUTm7TfYmCzXDoHUPTTf36L8pr0E7YsD3CfB3ZDg==} + cpu: [arm] + os: [linux] + libc: [glibc] + + '@rollup/rollup-linux-arm-musleabihf@4.50.1': + resolution: {integrity: sha512-p/LaFyajPN/0PUHjv8TNyxLiA7RwmDoVY3flXHPSzqrGcIp/c2FjwPPP5++u87DGHtw+5kSH5bCJz0mvXngYxw==} + cpu: [arm] + os: [linux] + libc: [musl] + + '@rollup/rollup-linux-arm64-gnu@4.50.1': + resolution: {integrity: sha512-2AbMhFFkTo6Ptna1zO7kAXXDLi7H9fGTbVaIq2AAYO7yzcAsuTNWPHhb2aTA6GPiP+JXh85Y8CiS54iZoj4opw==} + cpu: [arm64] + os: [linux] + libc: [glibc] + + '@rollup/rollup-linux-arm64-musl@4.50.1': + resolution: {integrity: sha512-Cgef+5aZwuvesQNw9eX7g19FfKX5/pQRIyhoXLCiBOrWopjo7ycfB292TX9MDcDijiuIJlx1IzJz3IoCPfqs9w==} + cpu: [arm64] + os: [linux] + libc: [musl] + + '@rollup/rollup-linux-loongarch64-gnu@4.50.1': + resolution: {integrity: sha512-RPhTwWMzpYYrHrJAS7CmpdtHNKtt2Ueo+BlLBjfZEhYBhK00OsEqM08/7f+eohiF6poe0YRDDd8nAvwtE/Y62Q==} + cpu: [loong64] + os: [linux] + libc: [glibc] + + '@rollup/rollup-linux-ppc64-gnu@4.50.1': + resolution: {integrity: sha512-eSGMVQw9iekut62O7eBdbiccRguuDgiPMsw++BVUg+1K7WjZXHOg/YOT9SWMzPZA+w98G+Fa1VqJgHZOHHnY0Q==} + cpu: [ppc64] + os: [linux] + libc: [glibc] + + '@rollup/rollup-linux-riscv64-gnu@4.50.1': + resolution: {integrity: sha512-S208ojx8a4ciIPrLgazF6AgdcNJzQE4+S9rsmOmDJkusvctii+ZvEuIC4v/xFqzbuP8yDjn73oBlNDgF6YGSXQ==} + cpu: [riscv64] + os: [linux] + libc: [glibc] + + '@rollup/rollup-linux-riscv64-musl@4.50.1': + resolution: {integrity: sha512-3Ag8Ls1ggqkGUvSZWYcdgFwriy2lWo+0QlYgEFra/5JGtAd6C5Hw59oojx1DeqcA2Wds2ayRgvJ4qxVTzCHgzg==} + cpu: [riscv64] + os: [linux] + libc: [musl] + + '@rollup/rollup-linux-s390x-gnu@4.50.1': + resolution: {integrity: sha512-t9YrKfaxCYe7l7ldFERE1BRg/4TATxIg+YieHQ966jwvo7ddHJxPj9cNFWLAzhkVsbBvNA4qTbPVNsZKBO4NSg==} + cpu: [s390x] + os: [linux] + libc: [glibc] + + '@rollup/rollup-linux-x64-gnu@4.50.1': + resolution: {integrity: sha512-MCgtFB2+SVNuQmmjHf+wfI4CMxy3Tk8XjA5Z//A0AKD7QXUYFMQcns91K6dEHBvZPCnhJSyDWLApk40Iq/H3tA==} + cpu: [x64] + os: [linux] + libc: [glibc] + + '@rollup/rollup-linux-x64-musl@4.50.1': + resolution: {integrity: sha512-nEvqG+0jeRmqaUMuwzlfMKwcIVffy/9KGbAGyoa26iu6eSngAYQ512bMXuqqPrlTyfqdlB9FVINs93j534UJrg==} + cpu: [x64] + os: [linux] + libc: [musl] + + '@rollup/rollup-openharmony-arm64@4.50.1': + resolution: {integrity: sha512-RDsLm+phmT3MJd9SNxA9MNuEAO/J2fhW8GXk62G/B4G7sLVumNFbRwDL6v5NrESb48k+QMqdGbHgEtfU0LCpbA==} + cpu: [arm64] + os: [openharmony] + + '@rollup/rollup-win32-arm64-msvc@4.50.1': + resolution: {integrity: sha512-hpZB/TImk2FlAFAIsoElM3tLzq57uxnGYwplg6WDyAxbYczSi8O2eQ+H2Lx74504rwKtZ3N2g4bCUkiamzS6TQ==} + cpu: [arm64] + os: [win32] + + '@rollup/rollup-win32-ia32-msvc@4.50.1': + resolution: {integrity: sha512-SXjv8JlbzKM0fTJidX4eVsH+Wmnp0/WcD8gJxIZyR6Gay5Qcsmdbi9zVtnbkGPG8v2vMR1AD06lGWy5FLMcG7A==} + cpu: [ia32] + os: [win32] + + '@rollup/rollup-win32-x64-msvc@4.50.1': + resolution: {integrity: sha512-StxAO/8ts62KZVRAm4JZYq9+NqNsV7RvimNK+YM7ry//zebEH6meuugqW/P5OFUCjyQgui+9fUxT6d5NShvMvA==} + cpu: [x64] + os: [win32] + + '@shikijs/core@3.12.2': + resolution: {integrity: sha512-L1Safnhra3tX/oJK5kYHaWmLEBJi1irASwewzY3taX5ibyXyMkkSDZlq01qigjryOBwrXSdFgTiZ3ryzSNeu7Q==} + + '@shikijs/engine-javascript@3.12.2': + resolution: {integrity: sha512-Nm3/azSsaVS7hk6EwtHEnTythjQfwvrO5tKqMlaH9TwG1P+PNaR8M0EAKZ+GaH2DFwvcr4iSfTveyxMIvXEHMw==} + + '@shikijs/engine-oniguruma@3.12.2': + resolution: {integrity: sha512-hozwnFHsLvujK4/CPVHNo3Bcg2EsnG8krI/ZQ2FlBlCRpPZW4XAEQmEwqegJsypsTAN9ehu2tEYe30lYKSZW/w==} + + '@shikijs/langs@3.12.2': + resolution: {integrity: sha512-bVx5PfuZHDSHoBal+KzJZGheFuyH4qwwcwG/n+MsWno5cTlKmaNtTsGzJpHYQ8YPbB5BdEdKU1rga5/6JGY8ww==} + + '@shikijs/themes@3.12.2': + resolution: {integrity: sha512-fTR3QAgnwYpfGczpIbzPjlRnxyONJOerguQv1iwpyQZ9QXX4qy/XFQqXlf17XTsorxnHoJGbH/LXBvwtqDsF5A==} + + '@shikijs/types@3.12.2': + resolution: {integrity: sha512-K5UIBzxCyv0YoxN3LMrKB9zuhp1bV+LgewxuVwHdl4Gz5oePoUFrr9EfgJlGlDeXCU1b/yhdnXeuRvAnz8HN8Q==} + + '@shikijs/vscode-textmate@10.0.2': + resolution: {integrity: sha512-83yeghZ2xxin3Nj8z1NMd/NCuca+gsYXswywDy5bHvwlWL8tpTQmzGeUuHd9FC3E/SBEMvzJRwWEOz5gGes9Qg==} + + '@swc/helpers@0.5.17': + resolution: {integrity: sha512-5IKx/Y13RsYd+sauPb2x+U/xZikHjolzfuDgTAl/Tdf3Q8rslRvC19NKDLgAJQ6wsqADk10ntlv08nPFw/gO/A==} + + '@types/d3-array@3.2.1': + resolution: {integrity: sha512-Y2Jn2idRrLzUfAKV2LyRImR+y4oa2AntrgID95SHJxuMUrkNXmanDSed71sRNZysveJVt1hLLemQZIady0FpEg==} + + '@types/d3-axis@3.0.6': + resolution: {integrity: sha512-pYeijfZuBd87T0hGn0FO1vQ/cgLk6E1ALJjfkC0oJ8cbwkZl3TpgS8bVBLZN+2jjGgg38epgxb2zmoGtSfvgMw==} + + '@types/d3-brush@3.0.6': + resolution: {integrity: sha512-nH60IZNNxEcrh6L1ZSMNA28rj27ut/2ZmI3r96Zd+1jrZD++zD3LsMIjWlvg4AYrHn/Pqz4CF3veCxGjtbqt7A==} + + '@types/d3-chord@3.0.6': + resolution: {integrity: sha512-LFYWWd8nwfwEmTZG9PfQxd17HbNPksHBiJHaKuY1XeqscXacsS2tyoo6OdRsjf+NQYeB6XrNL3a25E3gH69lcg==} + + '@types/d3-color@3.1.3': + resolution: {integrity: sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A==} + + '@types/d3-contour@3.0.6': + resolution: {integrity: sha512-BjzLgXGnCWjUSYGfH1cpdo41/hgdWETu4YxpezoztawmqsvCeep+8QGfiY6YbDvfgHz/DkjeIkkZVJavB4a3rg==} + + '@types/d3-delaunay@6.0.4': + resolution: {integrity: sha512-ZMaSKu4THYCU6sV64Lhg6qjf1orxBthaC161plr5KuPHo3CNm8DTHiLw/5Eq2b6TsNP0W0iJrUOFscY6Q450Hw==} + + '@types/d3-dispatch@3.0.7': + resolution: {integrity: sha512-5o9OIAdKkhN1QItV2oqaE5KMIiXAvDWBDPrD85e58Qlz1c1kI/J0NcqbEG88CoTwJrYe7ntUCVfeUl2UJKbWgA==} + + '@types/d3-drag@3.0.7': + resolution: {integrity: sha512-HE3jVKlzU9AaMazNufooRJ5ZpWmLIoc90A37WU2JMmeq28w1FQqCZswHZ3xR+SuxYftzHq6WU6KJHvqxKzTxxQ==} + + '@types/d3-dsv@3.0.7': + resolution: {integrity: sha512-n6QBF9/+XASqcKK6waudgL0pf/S5XHPPI8APyMLLUHd8NqouBGLsU8MgtO7NINGtPBtk9Kko/W4ea0oAspwh9g==} + + '@types/d3-ease@3.0.2': + resolution: {integrity: sha512-NcV1JjO5oDzoK26oMzbILE6HW7uVXOHLQvHshBUW4UMdZGfiY6v5BeQwh9a9tCzv+CeefZQHJt5SRgK154RtiA==} + + '@types/d3-fetch@3.0.7': + resolution: {integrity: sha512-fTAfNmxSb9SOWNB9IoG5c8Hg6R+AzUHDRlsXsDZsNp6sxAEOP0tkP3gKkNSO/qmHPoBFTxNrjDprVHDQDvo5aA==} + + '@types/d3-force@3.0.10': + resolution: {integrity: sha512-ZYeSaCF3p73RdOKcjj+swRlZfnYpK1EbaDiYICEEp5Q6sUiqFaFQ9qgoshp5CzIyyb/yD09kD9o2zEltCexlgw==} + + '@types/d3-format@3.0.4': + resolution: {integrity: sha512-fALi2aI6shfg7vM5KiR1wNJnZ7r6UuggVqtDA+xiEdPZQwy/trcQaHnwShLuLdta2rTymCNpxYTiMZX/e09F4g==} + + '@types/d3-geo@3.1.0': + resolution: {integrity: sha512-856sckF0oP/diXtS4jNsiQw/UuK5fQG8l/a9VVLeSouf1/PPbBE1i1W852zVwKwYCBkFJJB7nCFTbk6UMEXBOQ==} + + '@types/d3-hierarchy@3.1.7': + resolution: {integrity: sha512-tJFtNoYBtRtkNysX1Xq4sxtjK8YgoWUNpIiUee0/jHGRwqvzYxkq0hGVbbOGSz+JgFxxRu4K8nb3YpG3CMARtg==} + + '@types/d3-interpolate@3.0.4': + resolution: {integrity: sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA==} + + '@types/d3-path@3.1.1': + resolution: {integrity: sha512-VMZBYyQvbGmWyWVea0EHs/BwLgxc+MKi1zLDCONksozI4YJMcTt8ZEuIR4Sb1MMTE8MMW49v0IwI5+b7RmfWlg==} + + '@types/d3-polygon@3.0.2': + resolution: {integrity: sha512-ZuWOtMaHCkN9xoeEMr1ubW2nGWsp4nIql+OPQRstu4ypeZ+zk3YKqQT0CXVe/PYqrKpZAi+J9mTs05TKwjXSRA==} + + '@types/d3-quadtree@3.0.6': + resolution: {integrity: sha512-oUzyO1/Zm6rsxKRHA1vH0NEDG58HrT5icx/azi9MF1TWdtttWl0UIUsjEQBBh+SIkrpd21ZjEv7ptxWys1ncsg==} + + '@types/d3-random@3.0.3': + resolution: {integrity: sha512-Imagg1vJ3y76Y2ea0871wpabqp613+8/r0mCLEBfdtqC7xMSfj9idOnmBYyMoULfHePJyxMAw3nWhJxzc+LFwQ==} + + '@types/d3-scale-chromatic@3.1.0': + resolution: {integrity: sha512-iWMJgwkK7yTRmWqRB5plb1kadXyQ5Sj8V/zYlFGMUBbIPKQScw+Dku9cAAMgJG+z5GYDoMjWGLVOvjghDEFnKQ==} + + '@types/d3-scale@4.0.9': + resolution: {integrity: sha512-dLmtwB8zkAeO/juAMfnV+sItKjlsw2lKdZVVy6LRr0cBmegxSABiLEpGVmSJJ8O08i4+sGR6qQtb6WtuwJdvVw==} + + '@types/d3-selection@3.0.11': + resolution: {integrity: sha512-bhAXu23DJWsrI45xafYpkQ4NtcKMwWnAC/vKrd2l+nxMFuvOT3XMYTIj2opv8vq8AO5Yh7Qac/nSeP/3zjTK0w==} + + '@types/d3-shape@3.1.7': + resolution: {integrity: sha512-VLvUQ33C+3J+8p+Daf+nYSOsjB4GXp19/S/aGo60m9h1v6XaxjiT82lKVWJCfzhtuZ3yD7i/TPeC/fuKLLOSmg==} + + '@types/d3-time-format@4.0.3': + resolution: {integrity: sha512-5xg9rC+wWL8kdDj153qZcsJ0FWiFt0J5RB6LYUNZjwSnesfblqrI/bJ1wBdJ8OQfncgbJG5+2F+qfqnqyzYxyg==} + + '@types/d3-time@3.0.4': + resolution: {integrity: sha512-yuzZug1nkAAaBlBBikKZTgzCeA+k1uy4ZFwWANOfKw5z5LRhV0gNA7gNkKm7HoK+HRN0wX3EkxGk0fpbWhmB7g==} + + '@types/d3-timer@3.0.2': + resolution: {integrity: sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw==} + + '@types/d3-transition@3.0.9': + resolution: {integrity: sha512-uZS5shfxzO3rGlu0cC3bjmMFKsXv+SmZZcgp0KD22ts4uGXp5EVYGzu/0YdwZeKmddhcAccYtREJKkPfXkZuCg==} + + '@types/d3-zoom@3.0.8': + resolution: {integrity: sha512-iqMC4/YlFCSlO8+2Ii1GGGliCAY4XdeG748w5vQUbevlbDu0zSjH/+jojorQVBK/se0j6DUFNPBGSqD3YWYnDw==} + + '@types/d3@7.4.3': + resolution: {integrity: sha512-lZXZ9ckh5R8uiFVt8ogUNf+pIrK4EsWrx2Np75WvF/eTpJ0FMHNhjXk8CKEx/+gpHbNQyJWehbFaTvqmHWB3ww==} + + '@types/debug@4.1.12': + resolution: {integrity: sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==} + + '@types/estree-jsx@1.0.5': + resolution: {integrity: sha512-52CcUVNFyfb1A2ALocQw/Dd1BQFNmSdkuC3BkZ6iqhdMfQz7JWOFRuJFloOzjk+6WijU56m9oKXFAXc7o3Towg==} + + '@types/estree@1.0.8': + resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==} + + '@types/fontkit@2.0.8': + resolution: {integrity: sha512-wN+8bYxIpJf+5oZdrdtaX04qUuWHcKxcDEgRS9Qm9ZClSHjzEn13SxUC+5eRM+4yXIeTYk8mTzLAWGF64847ew==} + + '@types/geojson@7946.0.16': + resolution: {integrity: sha512-6C8nqWur3j98U6+lXDfTUWIfgvZU+EumvpHKcYjujKH7woYyLj2sUmff0tRhrqM7BohUw7Pz3ZB1jj2gW9Fvmg==} + + '@types/hast@3.0.4': + resolution: {integrity: sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==} + + '@types/js-yaml@4.0.9': + resolution: {integrity: sha512-k4MGaQl5TGo/iipqb2UDG2UwjXziSWkh0uysQelTlJpX1qGlpUZYm8PnO4DxG1qBomtJUdYJ6qR6xdIah10JLg==} + + '@types/mdast@4.0.4': + resolution: {integrity: sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==} + + '@types/mdx@2.0.13': + resolution: {integrity: sha512-+OWZQfAYyio6YkJb3HLxDrvnx6SWWDbC0zVPfBRzUk0/nqoDyf6dNxQi3eArPe8rJ473nobTMQ/8Zk+LxJ+Yuw==} + + '@types/ms@2.1.0': + resolution: {integrity: sha512-GsCCIZDE/p3i96vtEqx+7dBUGXrc7zeSK3wwPHIaRThS+9OhWIXRqzs4d6k1SVU8g91DrNRWxWUGhp5KXQb2VA==} + + '@types/nlcst@2.0.3': + resolution: {integrity: sha512-vSYNSDe6Ix3q+6Z7ri9lyWqgGhJTmzRjZRqyq15N0Z/1/UnVsno9G/N40NBijoYx2seFDIl0+B2mgAb9mezUCA==} + + '@types/node@17.0.45': + resolution: {integrity: sha512-w+tIMs3rq2afQdsPJlODhoUEKzFP1ayaoyl1CcnwtIlsVe7K7bA1NGm4s3PraqTLlXnbIN84zuBlxBWo1u9BLw==} + + '@types/node@24.3.1': + resolution: {integrity: sha512-3vXmQDXy+woz+gnrTvuvNrPzekOi+Ds0ReMxw0LzBiK3a+1k0kQn9f2NWk+lgD4rJehFUmYy2gMhJ2ZI+7YP9g==} + + '@types/picomatch@3.0.2': + resolution: {integrity: sha512-n0i8TD3UDB7paoMMxA3Y65vUncFJXjcUf7lQY7YyKGl6031FNjfsLs6pdLFCy2GNFxItPJG8GvvpbZc2skH7WA==} + + '@types/sax@1.2.7': + resolution: {integrity: sha512-rO73L89PJxeYM3s3pPPjiPgVVcymqU490g0YO5n5By0k2Erzj6tay/4lr1CHAAU4JyOWd1rpQ8bCf6cZfHU96A==} + + '@types/trusted-types@2.0.7': + resolution: {integrity: sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==} + + '@types/unist@2.0.11': + resolution: {integrity: sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA==} + + '@types/unist@3.0.3': + resolution: {integrity: sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==} + + '@ungap/structured-clone@1.3.0': + resolution: {integrity: sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==} + + acorn-jsx@5.3.2: + resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==} + peerDependencies: + acorn: ^6.0.0 || ^7.0.0 || ^8.0.0 + + acorn@8.15.0: + resolution: {integrity: sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==} + engines: {node: '>=0.4.0'} + hasBin: true + + ansi-align@3.0.1: + resolution: {integrity: sha512-IOfwwBF5iczOjp/WeY4YxyjqAFMQoZufdQWDd19SEExbVLNXqvpzSJ/M7Za4/sCPmQ0+GRquoA7bGcINcxew6w==} + + ansi-escapes@7.1.0: + resolution: {integrity: sha512-YdhtCd19sKRKfAAUsrcC1wzm4JuzJoiX4pOJqIoW2qmKj5WzG/dL8uUJ0361zaXtHqK7gEhOwtAtz7t3Yq3X5g==} + engines: {node: '>=18'} + + ansi-regex@5.0.1: + resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==} + engines: {node: '>=8'} + + ansi-regex@6.2.2: + resolution: {integrity: sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg==} + engines: {node: '>=12'} + + ansi-styles@6.2.3: + resolution: {integrity: sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==} + engines: {node: '>=12'} + + anymatch@3.1.3: + resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==} + engines: {node: '>= 8'} + + arg@5.0.2: + resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==} + + argparse@2.0.1: + resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==} + + aria-query@5.3.2: + resolution: {integrity: sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==} + engines: {node: '>= 0.4'} + + array-iterate@2.0.1: + resolution: {integrity: sha512-I1jXZMjAgCMmxT4qxXfPXa6SthSoE8h6gkSI9BGGNv8mP8G/v0blc+qFnZu6K42vTOiuME596QaLO0TP3Lk0xg==} + + astring@1.9.0: + resolution: {integrity: sha512-LElXdjswlqjWrPpJFg1Fx4wpkOCxj1TDHlSV4PlaRxHGWko024xICaa97ZkMfs6DRKlCguiAI+rbXv5GWwXIkg==} + hasBin: true + + astro-expressive-code@0.41.3: + resolution: {integrity: sha512-u+zHMqo/QNLE2eqYRCrK3+XMlKakv33Bzuz+56V1gs8H0y6TZ0hIi3VNbIxeTn51NLn+mJfUV/A0kMNfE4rANw==} + peerDependencies: + astro: ^4.0.0-beta || ^5.0.0-beta || ^3.3.0 + + astro-mermaid@1.0.4: + resolution: {integrity: sha512-2M4bVjqLpDB2EZ4EfD6Utzs7VEEORmlt5hNZcMK54IcKWzflohKvowCzg79RHoAdu30W8a4aECAExH8mF7wG4w==} + peerDependencies: + astro: ^4.0.0 || ^5.0.0 + mermaid: ^10.0.0 || ^11.0.0 + + astro-remote@0.3.4: + resolution: {integrity: sha512-jL5skNQLA0YBc1R3bVGXyHew3FqGqsT7AgLzWAVeTLzFkwVMUYvs4/lKJSmS7ygcF1GnHnoKG6++8GL9VtWwGQ==} + engines: {node: '>=18.14.1'} + + astro@5.13.6: + resolution: {integrity: sha512-chy1J+AO3d4lui4MjUyqusiW1jilfkviCBDz+c2MoXxhIImF96GqoliX+79fGy6KMsnMh5lUn+qwy3yUBJqZqg==} + engines: {node: 18.20.8 || ^20.3.0 || >=22.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0'} + hasBin: true + + axobject-query@4.1.0: + resolution: {integrity: sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==} + engines: {node: '>= 0.4'} + + bail@2.0.2: + resolution: {integrity: sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw==} + + base-64@1.0.0: + resolution: {integrity: sha512-kwDPIFCGx0NZHog36dj+tHiwP4QMzsZ3AgMViUBKI0+V5n4U0ufTCUMhnQ04diaRI8EX/QcPfql7zlhZ7j4zgg==} + + base64-js@1.5.1: + resolution: {integrity: sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==} + + bcp-47-match@2.0.3: + resolution: {integrity: sha512-JtTezzbAibu8G0R9op9zb3vcWZd9JF6M0xOYGPn0fNCd7wOpRB1mU2mH9T8gaBGbAAyIIVgB2G7xG0GP98zMAQ==} + + bcp-47@2.1.0: + resolution: {integrity: sha512-9IIS3UPrvIa1Ej+lVDdDwO7zLehjqsaByECw0bu2RRGP73jALm6FYbzI5gWbgHLvNdkvfXB5YrSbocZdOS0c0w==} + + blob-to-buffer@1.2.9: + resolution: {integrity: sha512-BF033y5fN6OCofD3vgHmNtwZWRcq9NLyyxyILx9hfMy1sXYy4ojFl765hJ2lP0YaN2fuxPaLO2Vzzoxy0FLFFA==} + + boolbase@1.0.0: + resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==} + + boxen@8.0.1: + resolution: {integrity: sha512-F3PH5k5juxom4xktynS7MoFY+NUWH5LC4CnH11YB8NPew+HLpmBLCybSAEyb2F+4pRXhuhWqFesoQd6DAyc2hw==} + engines: {node: '>=18'} + + brotli@1.3.3: + resolution: {integrity: sha512-oTKjJdShmDuGW94SyyaoQvAjf30dZaHnjJ8uAF+u2/vGJkJbJPJAT1gDiOJP5v1Zb6f9KEyW/1HpuaWIXtGHPg==} + + camelcase@8.0.0: + resolution: {integrity: sha512-8WB3Jcas3swSvjIeA2yvCJ+Miyz5l1ZmB6HFb9R1317dt9LCQoswg/BGrmAmkWVEszSrrg4RwmO46qIm2OEnSA==} + engines: {node: '>=16'} + + ccount@2.0.1: + resolution: {integrity: sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==} + + chalk@5.6.2: + resolution: {integrity: sha512-7NzBL0rN6fMUW+f7A6Io4h40qQlG+xGmtMxfbnH/K7TAtt8JQWVQK+6g0UXKMeVJoyV5EkkNsErQ8pVD3bLHbA==} + engines: {node: ^12.17.0 || ^14.13 || >=16.0.0} + + character-entities-html4@2.1.0: + resolution: {integrity: sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA==} + + character-entities-legacy@3.0.0: + resolution: {integrity: sha512-RpPp0asT/6ufRm//AJVwpViZbGM/MkjQFxJccQRHmISF/22NBtsHqAWmL+/pmkPWoIUJdWyeVleTl1wydHATVQ==} + + character-entities@2.0.2: + resolution: {integrity: sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ==} + + character-reference-invalid@2.0.1: + resolution: {integrity: sha512-iBZ4F4wRbyORVsu0jPV7gXkOsGYjGHPmAyv+HiHG8gi5PtC9KI2j1+v8/tlibRvjoWX027ypmG/n0HtO5t7unw==} + + chevrotain-allstar@0.3.1: + resolution: {integrity: sha512-b7g+y9A0v4mxCW1qUhf3BSVPg+/NvGErk/dOkrDaHA0nQIQGAtrOjlX//9OQtRlSCy+x9rfB5N8yC71lH1nvMw==} + peerDependencies: + chevrotain: ^11.0.0 + + chevrotain@11.0.3: + resolution: {integrity: sha512-ci2iJH6LeIkvP9eJW6gpueU8cnZhv85ELY8w8WiFtNjMHA5ad6pQLaJo9mEly/9qUyCpvqX8/POVUTf18/HFdw==} + + chokidar@4.0.3: + resolution: {integrity: sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==} + engines: {node: '>= 14.16.0'} + + ci-info@4.3.0: + resolution: {integrity: sha512-l+2bNRMiQgcfILUi33labAZYIWlH1kWDp+ecNo5iisRKrbm0xcRyCww71/YU0Fkw0mAFpz9bJayXPjey6vkmaQ==} + engines: {node: '>=8'} + + cli-boxes@3.0.0: + resolution: {integrity: sha512-/lzGpEWL/8PfI0BmBOPRwp0c/wFNX1RdUML3jK/RcSBA9T8mZDdQpqYBKtCFTOfQbwPqWEOpjqW+Fnayc0969g==} + engines: {node: '>=10'} + + clone@2.1.2: + resolution: {integrity: sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==} + engines: {node: '>=0.8'} + + clsx@2.1.1: + resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==} + engines: {node: '>=6'} + + collapse-white-space@2.1.0: + resolution: {integrity: sha512-loKTxY1zCOuG4j9f6EPnuyyYkf58RnhhWTvRoZEokgB+WbdXehfjFviyOVYkqzEWz1Q5kRiZdBYS5SwxbQYwzw==} + + color-convert@2.0.1: + resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==} + engines: {node: '>=7.0.0'} + + color-name@1.1.4: + resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==} + + color-string@1.9.1: + resolution: {integrity: sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==} + + color@4.2.3: + resolution: {integrity: sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==} + engines: {node: '>=12.5.0'} + + comma-separated-tokens@2.0.3: + resolution: {integrity: sha512-Fu4hJdvzeylCfQPp9SGWidpzrMs7tTrlu6Vb8XGaRGck8QSNZJJp538Wrb60Lax4fPwR64ViY468OIUTbRlGZg==} + + commander@7.2.0: + resolution: {integrity: sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==} + engines: {node: '>= 10'} + + commander@8.3.0: + resolution: {integrity: sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==} + engines: {node: '>= 12'} + + common-ancestor-path@1.0.1: + resolution: {integrity: sha512-L3sHRo1pXXEqX8VU28kfgUY+YGsk09hPqZiZmLacNib6XNTCM8ubYeT7ryXQw8asB1sKgcU5lkB7ONug08aB8w==} + + confbox@0.1.8: + resolution: {integrity: sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==} + + confbox@0.2.2: + resolution: {integrity: sha512-1NB+BKqhtNipMsov4xI/NnhCKp9XG9NamYp5PVm9klAT0fsrNPjaFICsCFhNhwZJKNh7zB/3q8qXz0E9oaMNtQ==} + + cookie-es@1.2.2: + resolution: {integrity: sha512-+W7VmiVINB+ywl1HGXJXmrqkOhpKrIiVZV6tQuV54ZyQC7MMuBt81Vc336GMLoHBq5hV/F9eXgt5Mnx0Rha5Fg==} + + cookie@1.0.2: + resolution: {integrity: sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==} + engines: {node: '>=18'} + + cose-base@1.0.3: + resolution: {integrity: sha512-s9whTXInMSgAp/NVXVNuVxVKzGH2qck3aQlVHxDCdAEPgtMKwc4Wq6/QKhgdEdgbLSi9rBTAcPoRa6JpiG4ksg==} + + cose-base@2.2.0: + resolution: {integrity: sha512-AzlgcsCbUMymkADOJtQm3wO9S3ltPfYOFD5033keQn9NJzIbtnZj+UdBJe7DYml/8TdbtHJW3j58SOnKhWY/5g==} + + cross-fetch@3.2.0: + resolution: {integrity: sha512-Q+xVJLoGOeIMXZmbUK4HYk+69cQH6LudR0Vu/pRm2YlU/hDV9CiS0gKUMaWY5f2NeUH9C1nV3bsTlCo0FsTV1Q==} + + crossws@0.3.5: + resolution: {integrity: sha512-ojKiDvcmByhwa8YYqbQI/hg7MEU0NC03+pSdEq4ZUnZR9xXpwk7E43SMNGkn+JxJGPFtNvQ48+vV2p+P1ml5PA==} + + css-selector-parser@3.1.3: + resolution: {integrity: sha512-gJMigczVZqYAk0hPVzx/M4Hm1D9QOtqkdQk9005TNzDIUGzo5cnHEDiKUT7jGPximL/oYb+LIitcHFQ4aKupxg==} + + css-tree@3.1.0: + resolution: {integrity: sha512-0eW44TGN5SQXU1mWSkKwFstI/22X2bG1nYzZTYMAWjylYURhse752YgbE4Cx46AC+bAvI+/dYTPRk1LqSUnu6w==} + engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0} + + cssesc@3.0.0: + resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==} + engines: {node: '>=4'} + hasBin: true + + cytoscape-cose-bilkent@4.1.0: + resolution: {integrity: sha512-wgQlVIUJF13Quxiv5e1gstZ08rnZj2XaLHGoFMYXz7SkNfCDOOteKBE6SYRfA9WxxI/iBc3ajfDoc6hb/MRAHQ==} + peerDependencies: + cytoscape: ^3.2.0 + + cytoscape-fcose@2.2.0: + resolution: {integrity: sha512-ki1/VuRIHFCzxWNrsshHYPs6L7TvLu3DL+TyIGEsRcvVERmxokbf5Gdk7mFxZnTdiGtnA4cfSmjZJMviqSuZrQ==} + peerDependencies: + cytoscape: ^3.2.0 + + cytoscape@3.33.1: + resolution: {integrity: sha512-iJc4TwyANnOGR1OmWhsS9ayRS3s+XQ185FmuHObThD+5AeJCakAAbWv8KimMTt08xCCLNgneQwFp+JRJOr9qGQ==} + engines: {node: '>=0.10'} + + d3-array@2.12.1: + resolution: {integrity: sha512-B0ErZK/66mHtEsR1TkPEEkwdy+WDesimkM5gpZr5Dsg54BiTA5RXtYW5qTLIAcekaS9xfZrzBLF/OAkB3Qn1YQ==} + + d3-array@3.2.4: + resolution: {integrity: sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg==} + engines: {node: '>=12'} + + d3-axis@3.0.0: + resolution: {integrity: sha512-IH5tgjV4jE/GhHkRV0HiVYPDtvfjHQlQfJHs0usq7M30XcSBvOotpmH1IgkcXsO/5gEQZD43B//fc7SRT5S+xw==} + engines: {node: '>=12'} + + d3-brush@3.0.0: + resolution: {integrity: sha512-ALnjWlVYkXsVIGlOsuWH1+3udkYFI48Ljihfnh8FZPF2QS9o+PzGLBslO0PjzVoHLZ2KCVgAM8NVkXPJB2aNnQ==} + engines: {node: '>=12'} + + d3-chord@3.0.1: + resolution: {integrity: sha512-VE5S6TNa+j8msksl7HwjxMHDM2yNK3XCkusIlpX5kwauBfXuyLAtNg9jCp/iHH61tgI4sb6R/EIMWCqEIdjT/g==} + engines: {node: '>=12'} + + d3-color@3.1.0: + resolution: {integrity: sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==} + engines: {node: '>=12'} + + d3-contour@4.0.2: + resolution: {integrity: sha512-4EzFTRIikzs47RGmdxbeUvLWtGedDUNkTcmzoeyg4sP/dvCexO47AaQL7VKy/gul85TOxw+IBgA8US2xwbToNA==} + engines: {node: '>=12'} + + d3-delaunay@6.0.4: + resolution: {integrity: sha512-mdjtIZ1XLAM8bm/hx3WwjfHt6Sggek7qH043O8KEjDXN40xi3vx/6pYSVTwLjEgiXQTbvaouWKynLBiUZ6SK6A==} + engines: {node: '>=12'} + + d3-dispatch@3.0.1: + resolution: {integrity: sha512-rzUyPU/S7rwUflMyLc1ETDeBj0NRuHKKAcvukozwhshr6g6c5d8zh4c2gQjY2bZ0dXeGLWc1PF174P2tVvKhfg==} + engines: {node: '>=12'} + + d3-drag@3.0.0: + resolution: {integrity: sha512-pWbUJLdETVA8lQNJecMxoXfH6x+mO2UQo8rSmZ+QqxcbyA3hfeprFgIT//HW2nlHChWeIIMwS2Fq+gEARkhTkg==} + engines: {node: '>=12'} + + d3-dsv@3.0.1: + resolution: {integrity: sha512-UG6OvdI5afDIFP9w4G0mNq50dSOsXHJaRE8arAS5o9ApWnIElp8GZw1Dun8vP8OyHOZ/QJUKUJwxiiCCnUwm+Q==} + engines: {node: '>=12'} + hasBin: true + + d3-ease@3.0.1: + resolution: {integrity: sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==} + engines: {node: '>=12'} + + d3-fetch@3.0.1: + resolution: {integrity: sha512-kpkQIM20n3oLVBKGg6oHrUchHM3xODkTzjMoj7aWQFq5QEM+R6E4WkzT5+tojDY7yjez8KgCBRoj4aEr99Fdqw==} + engines: {node: '>=12'} + + d3-force@3.0.0: + resolution: {integrity: sha512-zxV/SsA+U4yte8051P4ECydjD/S+qeYtnaIyAs9tgHCqfguma/aAQDjo85A9Z6EKhBirHRJHXIgJUlffT4wdLg==} + engines: {node: '>=12'} + + d3-format@3.1.0: + resolution: {integrity: sha512-YyUI6AEuY/Wpt8KWLgZHsIU86atmikuoOmCfommt0LYHiQSPjvX2AcFc38PX0CBpr2RCyZhjex+NS/LPOv6YqA==} + engines: {node: '>=12'} + + d3-geo@3.1.1: + resolution: {integrity: sha512-637ln3gXKXOwhalDzinUgY83KzNWZRKbYubaG+fGVuc/dxO64RRljtCTnf5ecMyE1RIdtqpkVcq0IbtU2S8j2Q==} + engines: {node: '>=12'} + + d3-hierarchy@3.1.2: + resolution: {integrity: sha512-FX/9frcub54beBdugHjDCdikxThEqjnR93Qt7PvQTOHxyiNCAlvMrHhclk3cD5VeAaq9fxmfRp+CnWw9rEMBuA==} + engines: {node: '>=12'} + + d3-interpolate@3.0.1: + resolution: {integrity: sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==} + engines: {node: '>=12'} + + d3-path@1.0.9: + resolution: {integrity: sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg==} + + d3-path@3.1.0: + resolution: {integrity: sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ==} + engines: {node: '>=12'} + + d3-polygon@3.0.1: + resolution: {integrity: sha512-3vbA7vXYwfe1SYhED++fPUQlWSYTTGmFmQiany/gdbiWgU/iEyQzyymwL9SkJjFFuCS4902BSzewVGsHHmHtXg==} + engines: {node: '>=12'} + + d3-quadtree@3.0.1: + resolution: {integrity: sha512-04xDrxQTDTCFwP5H6hRhsRcb9xxv2RzkcsygFzmkSIOJy3PeRJP7sNk3VRIbKXcog561P9oU0/rVH6vDROAgUw==} + engines: {node: '>=12'} + + d3-random@3.0.1: + resolution: {integrity: sha512-FXMe9GfxTxqd5D6jFsQ+DJ8BJS4E/fT5mqqdjovykEB2oFbTMDVdg1MGFxfQW+FBOGoB++k8swBrgwSHT1cUXQ==} + engines: {node: '>=12'} + + d3-sankey@0.12.3: + resolution: {integrity: sha512-nQhsBRmM19Ax5xEIPLMY9ZmJ/cDvd1BG3UVvt5h3WRxKg5zGRbvnteTyWAbzeSvlh3tW7ZEmq4VwR5mB3tutmQ==} + + d3-scale-chromatic@3.1.0: + resolution: {integrity: sha512-A3s5PWiZ9YCXFye1o246KoscMWqf8BsD9eRiJ3He7C9OBaxKhAd5TFCdEx/7VbKtxxTsu//1mMJFrEt572cEyQ==} + engines: {node: '>=12'} + + d3-scale@4.0.2: + resolution: {integrity: sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ==} + engines: {node: '>=12'} + + d3-selection@3.0.0: + resolution: {integrity: sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==} + engines: {node: '>=12'} + + d3-shape@1.3.7: + resolution: {integrity: sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==} + + d3-shape@3.2.0: + resolution: {integrity: sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA==} + engines: {node: '>=12'} + + d3-time-format@4.1.0: + resolution: {integrity: sha512-dJxPBlzC7NugB2PDLwo9Q8JiTR3M3e4/XANkreKSUxF8vvXKqm1Yfq4Q5dl8budlunRVlUUaDUgFt7eA8D6NLg==} + engines: {node: '>=12'} + + d3-time@3.1.0: + resolution: {integrity: sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q==} + engines: {node: '>=12'} + + d3-timer@3.0.1: + resolution: {integrity: sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==} + engines: {node: '>=12'} + + d3-transition@3.0.1: + resolution: {integrity: sha512-ApKvfjsSR6tg06xrL434C0WydLr7JewBB3V+/39RMHsaXTOG0zmt/OAXeng5M5LBm0ojmxJrpomQVZ1aPvBL4w==} + engines: {node: '>=12'} + peerDependencies: + d3-selection: 2 - 3 + + d3-zoom@3.0.0: + resolution: {integrity: sha512-b8AmV3kfQaqWAuacbPuNbL6vahnOJflOhexLzMMNLga62+/nh0JzvJ0aO/5a5MVgUFGS7Hu1P9P03o3fJkDCyw==} + engines: {node: '>=12'} + + d3@7.9.0: + resolution: {integrity: sha512-e1U46jVP+w7Iut8Jt8ri1YsPOvFpg46k+K8TpCb0P+zjCkjkPnV7WzfDJzMHy1LnA+wj5pLT1wjO901gLXeEhA==} + engines: {node: '>=12'} + + dagre-d3-es@7.0.11: + resolution: {integrity: sha512-tvlJLyQf834SylNKax8Wkzco/1ias1OPw8DcUMDE7oUIoSEW25riQVuiu/0OWEFqT0cxHT3Pa9/D82Jr47IONw==} + + dayjs@1.11.18: + resolution: {integrity: sha512-zFBQ7WFRvVRhKcWoUh+ZA1g2HVgUbsZm9sbddh8EC5iv93sui8DVVz1Npvz+r6meo9VKfa8NyLWBsQK1VvIKPA==} + + debug@4.4.1: + resolution: {integrity: sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==} + engines: {node: '>=6.0'} + peerDependencies: + supports-color: '*' + peerDependenciesMeta: + supports-color: + optional: true + + decode-named-character-reference@1.2.0: + resolution: {integrity: sha512-c6fcElNV6ShtZXmsgNgFFV5tVX2PaV4g+MOAkb8eXHvn6sryJBrZa9r0zV6+dtTyoCKxtDy5tyQ5ZwQuidtd+Q==} + + defu@6.1.4: + resolution: {integrity: sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg==} + + delaunator@5.0.1: + resolution: {integrity: sha512-8nvh+XBe96aCESrGOqMp/84b13H9cdKbG5P2ejQCh4d4sK9RL4371qou9drQjMhvnPmhWl5hnmqbEE0fXr9Xnw==} + + dequal@2.0.3: + resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==} + engines: {node: '>=6'} + + destr@2.0.5: + resolution: {integrity: sha512-ugFTXCtDZunbzasqBxrK93Ik/DRYsO6S/fedkWEMKqt04xZ4csmnmwGDBAb07QWNaGMAmnTIemsYZCksjATwsA==} + + detect-libc@2.0.4: + resolution: {integrity: sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==} + engines: {node: '>=8'} + + deterministic-object-hash@2.0.2: + resolution: {integrity: sha512-KxektNH63SrbfUyDiwXqRb1rLwKt33AmMv+5Nhsw1kqZ13SJBRTgZHtGbE+hH3a1mVW1cz+4pqSWVPAtLVXTzQ==} + engines: {node: '>=18'} + + devalue@5.3.2: + resolution: {integrity: sha512-UDsjUbpQn9kvm68slnrs+mfxwFkIflOhkanmyabZ8zOYk8SMEIbJ3TK+88g70hSIeytu4y18f0z/hYHMTrXIWw==} + + devlop@1.1.0: + resolution: {integrity: sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==} + + dfa@1.2.0: + resolution: {integrity: sha512-ED3jP8saaweFTjeGX8HQPjeC1YYyZs98jGNZx6IiBvxW7JG5v492kamAQB3m2wop07CvU/RQmzcKr6bgcC5D/Q==} + + diff@5.2.0: + resolution: {integrity: sha512-uIFDxqpRZGZ6ThOk84hEfqWoHx2devRFvpTZcTHur85vImfaxUbTW9Ryh4CpCuDnToOP1CEtXKIgytHBPVff5A==} + engines: {node: '>=0.3.1'} + + direction@2.0.1: + resolution: {integrity: sha512-9S6m9Sukh1cZNknO1CWAr2QAWsbKLafQiyM5gZ7VgXHeuaoUwffKN4q6NC4A/Mf9iiPlOXQEKW/Mv/mh9/3YFA==} + hasBin: true + + dlv@1.1.3: + resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==} + + dompurify@3.2.6: + resolution: {integrity: sha512-/2GogDQlohXPZe6D6NOgQvXLPSYBqIWMnZ8zzOhn09REE4eyAzb+Hed3jhoM9OkuaJ8P6ZGTTVWQKAi8ieIzfQ==} + + dset@3.1.4: + resolution: {integrity: sha512-2QF/g9/zTaPDc3BjNcVTGoBbXBgYfMTTceLaYcFJ/W9kggFUkhxD/hMEeuLKbugyef9SqAx8cpgwlIP/jinUTA==} + engines: {node: '>=4'} + + emoji-regex@10.5.0: + resolution: {integrity: sha512-lb49vf1Xzfx080OKA0o6l8DQQpV+6Vg95zyCJX9VB/BqKYlhG7N4wgROUUHRA+ZPUefLnteQOad7z1kT2bV7bg==} + + emoji-regex@8.0.0: + resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==} + + entities@4.5.0: + resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==} + engines: {node: '>=0.12'} + + entities@6.0.1: + resolution: {integrity: sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==} + engines: {node: '>=0.12'} + + environment@1.1.0: + resolution: {integrity: sha512-xUtoPkMggbz0MPyPiIWr1Kp4aeWJjDZ6SMvURhimjdZgsRuDplF5/s9hcgGhyXMhs+6vpnuoiZ2kFiu3FMnS8Q==} + engines: {node: '>=18'} + + es-module-lexer@1.7.0: + resolution: {integrity: sha512-jEQoCwk8hyb2AZziIOLhDqpm5+2ww5uIE6lkO/6jcOCusfk6LhMHpXXfBLXTZ7Ydyt0j4VoUQv6uGNYbdW+kBA==} + + esast-util-from-estree@2.0.0: + resolution: {integrity: sha512-4CyanoAudUSBAn5K13H4JhsMH6L9ZP7XbLVe/dKybkxMO7eDyLsT8UHl9TRNrU2Gr9nz+FovfSIjuXWJ81uVwQ==} + + esast-util-from-js@2.0.1: + resolution: {integrity: sha512-8Ja+rNJ0Lt56Pcf3TAmpBZjmx8ZcK5Ts4cAzIOjsjevg9oSXJnl6SUQ2EevU8tv3h6ZLWmoKL5H4fgWvdvfETw==} + + esbuild@0.25.9: + resolution: {integrity: sha512-CRbODhYyQx3qp7ZEwzxOk4JBqmD/seJrzPa/cGjY1VtIn5E09Oi9/dB4JwctnfZ8Q8iT7rioVv5k/FNT/uf54g==} + engines: {node: '>=18'} + hasBin: true + + escape-string-regexp@5.0.0: + resolution: {integrity: sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==} + engines: {node: '>=12'} + + estree-util-attach-comments@3.0.0: + resolution: {integrity: sha512-cKUwm/HUcTDsYh/9FgnuFqpfquUbwIqwKM26BVCGDPVgvaCl/nDCCjUfiLlx6lsEZ3Z4RFxNbOQ60pkaEwFxGw==} + + estree-util-build-jsx@3.0.1: + resolution: {integrity: sha512-8U5eiL6BTrPxp/CHbs2yMgP8ftMhR5ww1eIKoWRMlqvltHF8fZn5LRDvTKuxD3DUn+shRbLGqXemcP51oFCsGQ==} + + estree-util-is-identifier-name@3.0.0: + resolution: {integrity: sha512-hFtqIDZTIUZ9BXLb8y4pYGyk6+wekIivNVTcmvk8NoOh+VeRn5y6cEHzbURrWbfp1fIqdVipilzj+lfaadNZmg==} + + estree-util-scope@1.0.0: + resolution: {integrity: sha512-2CAASclonf+JFWBNJPndcOpA8EMJwa0Q8LUFJEKqXLW6+qBvbFZuF5gItbQOs/umBUkjviCSDCbBwU2cXbmrhQ==} + + estree-util-to-js@2.0.0: + resolution: {integrity: sha512-WDF+xj5rRWmD5tj6bIqRi6CkLIXbbNQUcxQHzGysQzvHmdYG2G7p/Tf0J0gpxGgkeMZNTIjT/AoSvC9Xehcgdg==} + + estree-util-visit@2.0.0: + resolution: {integrity: sha512-m5KgiH85xAhhW8Wta0vShLcUvOsh3LLPI2YVwcbio1l7E09NTLL1EyMZFM1OyWowoH0skScNbhOPl4kcBgzTww==} + + estree-walker@2.0.2: + resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==} + + estree-walker@3.0.3: + resolution: {integrity: sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==} + + eventemitter3@5.0.1: + resolution: {integrity: sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==} + + expressive-code@0.41.3: + resolution: {integrity: sha512-YLnD62jfgBZYrXIPQcJ0a51Afv9h8VlWqEGK9uU2T5nL/5rb8SnA86+7+mgCZe5D34Tff5RNEA5hjNVJYHzrFg==} + + exsolve@1.0.7: + resolution: {integrity: sha512-VO5fQUzZtI6C+vx4w/4BWJpg3s/5l+6pRQEHzFRM8WFi4XffSP1Z+4qi7GbjWbvRQEbdIco5mIMq+zX4rPuLrw==} + + extend@3.0.2: + resolution: {integrity: sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==} + + fast-deep-equal@3.1.3: + resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==} + + fdir@6.5.0: + resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==} + engines: {node: '>=12.0.0'} + peerDependencies: + picomatch: ^3 || ^4 + peerDependenciesMeta: + picomatch: + optional: true + + flattie@1.1.1: + resolution: {integrity: sha512-9UbaD6XdAL97+k/n+N7JwX46K/M6Zc6KcFYskrYL8wbBV/Uyk0CTAMY0VT+qiK5PM7AIc9aTWYtq65U7T+aCNQ==} + engines: {node: '>=8'} + + fontace@0.3.0: + resolution: {integrity: sha512-czoqATrcnxgWb/nAkfyIrRp6Q8biYj7nGnL6zfhTcX+JKKpWHFBnb8uNMw/kZr7u++3Y3wYSYoZgHkCcsuBpBg==} + + fontkit@2.0.4: + resolution: {integrity: sha512-syetQadaUEDNdxdugga9CpEYVaQIxOwk7GlwZWWZ19//qW4zE5bknOKeMBDYAASwnpaSHKJITRLMF9m1fp3s6g==} + + fsevents@2.3.3: + resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==} + engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0} + os: [darwin] + + get-east-asian-width@1.3.1: + resolution: {integrity: sha512-R1QfovbPsKmosqTnPoRFiJ7CF9MLRgb53ChvMZm+r4p76/+8yKDy17qLL2PKInORy2RkZZekuK0efYgmzTkXyQ==} + engines: {node: '>=18'} + + github-slugger@2.0.0: + resolution: {integrity: sha512-IaOQ9puYtjrkq7Y0Ygl9KDZnrf/aiUJYUpVf89y8kyaxbRG7Y1SrX/jaumrv81vc61+kiMempujsM3Yw7w5qcw==} + + globals@15.15.0: + resolution: {integrity: sha512-7ACyT3wmyp3I61S4fG682L0VA2RGD9otkqGJIwNUMF1SWUombIIk+af1unuDYgMm082aHYwD+mzJvv9Iu8dsgg==} + engines: {node: '>=18'} + + h3@1.15.4: + resolution: {integrity: sha512-z5cFQWDffyOe4vQ9xIqNfCZdV4p//vy6fBnr8Q1AWnVZ0teurKMG66rLj++TKwKPUP3u7iMUvrvKaEUiQw2QWQ==} + + hachure-fill@0.5.2: + resolution: {integrity: sha512-3GKBOn+m2LX9iq+JC1064cSFprJY4jL1jCXTcpnfER5HYE2l/4EfWSGzkPa/ZDBmYI0ZOEj5VHV/eKnPGkHuOg==} + + has-flag@5.0.1: + resolution: {integrity: sha512-CsNUt5x9LUdx6hnk/E2SZLsDyvfqANZSUq4+D3D8RzDJ2M+HDTIkF60ibS1vHaK55vzgiZw1bEPFG9yH7l33wA==} + engines: {node: '>=12'} + + hast-util-embedded@3.0.0: + resolution: {integrity: sha512-naH8sld4Pe2ep03qqULEtvYr7EjrLK2QHY8KJR6RJkTUjPGObe1vnx585uzem2hGra+s1q08DZZpfgDVYRbaXA==} + + hast-util-format@1.1.0: + resolution: {integrity: sha512-yY1UDz6bC9rDvCWHpx12aIBGRG7krurX0p0Fm6pT547LwDIZZiNr8a+IHDogorAdreULSEzP82Nlv5SZkHZcjA==} + + hast-util-from-html@2.0.3: + resolution: {integrity: sha512-CUSRHXyKjzHov8yKsQjGOElXy/3EKpyX56ELnkHH34vDVw1N1XSQ1ZcAvTyAPtGqLTuKP/uxM+aLkSPqF/EtMw==} + + hast-util-from-parse5@8.0.3: + resolution: {integrity: sha512-3kxEVkEKt0zvcZ3hCRYI8rqrgwtlIOFMWkbclACvjlDw8Li9S2hk/d51OI0nr/gIpdMHNepwgOKqZ/sy0Clpyg==} + + hast-util-has-property@3.0.0: + resolution: {integrity: sha512-MNilsvEKLFpV604hwfhVStK0usFY/QmM5zX16bo7EjnAEGofr5YyI37kzopBlZJkHD4t887i+q/C8/tr5Q94cA==} + + hast-util-is-body-ok-link@3.0.1: + resolution: {integrity: sha512-0qpnzOBLztXHbHQenVB8uNuxTnm/QBFUOmdOSsEn7GnBtyY07+ENTWVFBAnXd/zEgd9/SUG3lRY7hSIBWRgGpQ==} + + hast-util-is-element@3.0.0: + resolution: {integrity: sha512-Val9mnv2IWpLbNPqc/pUem+a7Ipj2aHacCwgNfTiK0vJKl0LF+4Ba4+v1oPHFpf3bLYmreq0/l3Gud9S5OH42g==} + + hast-util-minify-whitespace@1.0.1: + resolution: {integrity: sha512-L96fPOVpnclQE0xzdWb/D12VT5FabA7SnZOUMtL1DbXmYiHJMXZvFkIZfiMmTCNJHUeO2K9UYNXoVyfz+QHuOw==} + + hast-util-parse-selector@4.0.0: + resolution: {integrity: sha512-wkQCkSYoOGCRKERFWcxMVMOcYE2K1AaNLU8DXS9arxnLOUEWbOXKXiJUNzEpqZ3JOKpnha3jkFrumEjVliDe7A==} + + hast-util-phrasing@3.0.1: + resolution: {integrity: sha512-6h60VfI3uBQUxHqTyMymMZnEbNl1XmEGtOxxKYL7stY2o601COo62AWAYBQR9lZbYXYSBoxag8UpPRXK+9fqSQ==} + + hast-util-raw@9.1.0: + resolution: {integrity: sha512-Y8/SBAHkZGoNkpzqqfCldijcuUKh7/su31kEBp67cFY09Wy0mTRgtsLYsiIxMJxlu0f6AA5SUTbDR8K0rxnbUw==} + + hast-util-select@6.0.4: + resolution: {integrity: sha512-RqGS1ZgI0MwxLaKLDxjprynNzINEkRHY2i8ln4DDjgv9ZhcYVIHN9rlpiYsqtFwrgpYU361SyWDQcGNIBVu3lw==} + + hast-util-to-estree@3.1.3: + resolution: {integrity: sha512-48+B/rJWAp0jamNbAAf9M7Uf//UVqAoMmgXhBdxTDJLGKY+LRnZ99qcG+Qjl5HfMpYNzS5v4EAwVEF34LeAj7w==} + + hast-util-to-html@9.0.5: + resolution: {integrity: sha512-OguPdidb+fbHQSU4Q4ZiLKnzWo8Wwsf5bZfbvu7//a9oTYoqD/fWpe96NuHkoS9h0ccGOTe0C4NGXdtS0iObOw==} + + hast-util-to-jsx-runtime@2.3.6: + resolution: {integrity: sha512-zl6s8LwNyo1P9uw+XJGvZtdFF1GdAkOg8ujOw+4Pyb76874fLps4ueHXDhXWdk6YHQ6OgUtinliG7RsYvCbbBg==} + + hast-util-to-parse5@8.0.0: + resolution: {integrity: sha512-3KKrV5ZVI8if87DVSi1vDeByYrkGzg4mEfeu4alwgmmIeARiBLKCZS2uw5Gb6nU9x9Yufyj3iudm6i7nl52PFw==} + + hast-util-to-string@3.0.1: + resolution: {integrity: sha512-XelQVTDWvqcl3axRfI0xSeoVKzyIFPwsAGSLIsKdJKQMXDYJS4WYrBNF/8J7RdhIcFI2BOHgAifggsvsxp/3+A==} + + hast-util-to-text@4.0.2: + resolution: {integrity: sha512-KK6y/BN8lbaq654j7JgBydev7wuNMcID54lkRav1P0CaE1e47P72AWWPiGKXTJU271ooYzcvTAn/Zt0REnvc7A==} + + hast-util-whitespace@3.0.0: + resolution: {integrity: sha512-88JUN06ipLwsnv+dVn+OIYOvAuvBMy/Qoi6O7mQHxdPXpjy+Cd6xRkWwux7DKO+4sYILtLBRIKgsdpS2gQc7qw==} + + hastscript@9.0.1: + resolution: {integrity: sha512-g7df9rMFX/SPi34tyGCyUBREQoKkapwdY/T04Qn9TDWfHhAYt4/I0gMVirzK5wEzeUqIjEB+LXC/ypb7Aqno5w==} + + html-escaper@3.0.3: + resolution: {integrity: sha512-RuMffC89BOWQoY0WKGpIhn5gX3iI54O6nRA0yC124NYVtzjmFWBIiFd8M0x+ZdX0P9R4lADg1mgP8C7PxGOWuQ==} + + html-void-elements@3.0.0: + resolution: {integrity: sha512-bEqo66MRXsUGxWHV5IP0PUiAWwoEjba4VCzg0LjFJBpchPaTfyfCKTG6bc5F8ucKec3q5y6qOdGyYTSBEvhCrg==} + + html-whitespace-sensitive-tag-names@3.0.1: + resolution: {integrity: sha512-q+310vW8zmymYHALr1da4HyXUQ0zgiIwIicEfotYPWGN0OJVEN/58IJ3A4GBYcEq3LGAZqKb+ugvP0GNB9CEAA==} + + http-cache-semantics@4.2.0: + resolution: {integrity: sha512-dTxcvPXqPvXBQpq5dUr6mEMJX4oIEFv6bwom3FDwKRDsuIjjJGANqhBuoAn9c1RQJIdAKav33ED65E2ys+87QQ==} + + i18next@23.16.8: + resolution: {integrity: sha512-06r/TitrM88Mg5FdUXAKL96dJMzgqLE5dv3ryBAra4KCwD9mJ4ndOTS95ZuymIGoE+2hzfdaMak2X11/es7ZWg==} + + iconv-lite@0.6.3: + resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==} + engines: {node: '>=0.10.0'} + + import-meta-resolve@4.2.0: + resolution: {integrity: sha512-Iqv2fzaTQN28s/FwZAoFq0ZSs/7hMAHJVX+w8PZl3cY19Pxk6jFFalxQoIfW2826i/fDLXv8IiEZRIT0lDuWcg==} + + inline-style-parser@0.2.4: + resolution: {integrity: sha512-0aO8FkhNZlj/ZIbNi7Lxxr12obT7cL1moPfE4tg1LkX7LlLfC6DeX4l2ZEud1ukP9jNQyNnfzQVqwbwmAATY4Q==} + + internmap@1.0.1: + resolution: {integrity: sha512-lDB5YccMydFBtasVtxnZ3MRBHuaoE8GKsppq+EchKL2U4nK/DmEpPHNH8MZe5HkMtpSiTSOZwfN0tzYjO/lJEw==} + + internmap@2.0.3: + resolution: {integrity: sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==} + engines: {node: '>=12'} + + iron-webcrypto@1.2.1: + resolution: {integrity: sha512-feOM6FaSr6rEABp/eDfVseKyTMDt+KGpeB35SkVn9Tyn0CqvVsY3EwI0v5i8nMHyJnzCIQf7nsy3p41TPkJZhg==} + + is-absolute-url@4.0.1: + resolution: {integrity: sha512-/51/TKE88Lmm7Gc4/8btclNXWS+g50wXhYJq8HWIBAGUBnoAdRu1aXeh364t/O7wXDAcTJDP8PNuNKWUDWie+A==} + engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0} + + is-alphabetical@2.0.1: + resolution: {integrity: sha512-FWyyY60MeTNyeSRpkM2Iry0G9hpr7/9kD40mD/cGQEuilcZYS4okz8SN2Q6rLCJ8gbCt6fN+rC+6tMGS99LaxQ==} + + is-alphanumerical@2.0.1: + resolution: {integrity: sha512-hmbYhX/9MUMF5uh7tOXyK/n0ZvWpad5caBA17GsC6vyuCqaWliRG5K1qS9inmUhEMaOBIW7/whAnSwveW/LtZw==} + + is-arrayish@0.3.2: + resolution: {integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==} + + is-decimal@2.0.1: + resolution: {integrity: sha512-AAB9hiomQs5DXWcRB1rqsxGUstbRroFOPPVAomNk/3XHR5JyEZChOyTWe2oayKnsSsr/kcGqF+z6yuH6HHpN0A==} + + is-docker@3.0.0: + resolution: {integrity: sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==} + engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0} + hasBin: true + + is-fullwidth-code-point@3.0.0: + resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==} + engines: {node: '>=8'} + + is-hexadecimal@2.0.1: + resolution: {integrity: sha512-DgZQp241c8oO6cA1SbTEWiXeoxV42vlcJxgH+B3hi1AiqqKruZR3ZGF8In3fj4+/y/7rHvlOZLZtgJ/4ttYGZg==} + + is-inside-container@1.0.0: + resolution: {integrity: sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==} + engines: {node: '>=14.16'} + hasBin: true + + is-plain-obj@4.1.0: + resolution: {integrity: sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==} + engines: {node: '>=12'} + + is-wsl@3.1.0: + resolution: {integrity: sha512-UcVfVfaK4Sc4m7X3dUSoHoozQGBEFeDC+zVo06t98xe8CzHSZZBekNXH+tu0NalHolcJ/QAGqS46Hef7QXBIMw==} + engines: {node: '>=16'} + + js-yaml@4.1.0: + resolution: {integrity: sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==} + hasBin: true + + katex@0.16.22: + resolution: {integrity: sha512-XCHRdUw4lf3SKBaJe4EvgqIuWwkPSo9XoeO8GjQW94Bp7TWv9hNhzZjZ+OH9yf1UmLygb7DIT5GSFQiyt16zYg==} + hasBin: true + + khroma@2.1.0: + resolution: {integrity: sha512-Ls993zuzfayK269Svk9hzpeGUKob/sIgZzyHYdjQoAdQetRKpOLj+k/QQQ/6Qi0Yz65mlROrfd+Ev+1+7dz9Kw==} + + kleur@3.0.3: + resolution: {integrity: sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==} + engines: {node: '>=6'} + + kleur@4.1.5: + resolution: {integrity: sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==} + engines: {node: '>=6'} + + klona@2.0.6: + resolution: {integrity: sha512-dhG34DXATL5hSxJbIexCft8FChFXtmskoZYnoPWjXQuebWYCNkVeV3KkGegCK9CP1oswI/vQibS2GY7Em/sJJA==} + engines: {node: '>= 8'} + + kolorist@1.8.0: + resolution: {integrity: sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==} + + langium@3.3.1: + resolution: {integrity: sha512-QJv/h939gDpvT+9SiLVlY7tZC3xB2qK57v0J04Sh9wpMb6MP1q8gB21L3WIo8T5P1MSMg3Ep14L7KkDCFG3y4w==} + engines: {node: '>=16.0.0'} + + layout-base@1.0.2: + resolution: {integrity: sha512-8h2oVEZNktL4BH2JCOI90iD1yXwL6iNW7KcCKT2QZgQJR2vbqDsldCTPRU9NifTCqHZci57XvQQ15YTu+sTYPg==} + + layout-base@2.0.1: + resolution: {integrity: sha512-dp3s92+uNI1hWIpPGH3jK2kxE2lMjdXdr+DH8ynZHpd6PUlH6x6cbuXnoMmiNumznqaNO31xu9e79F0uuZ0JFg==} + + local-pkg@1.1.2: + resolution: {integrity: sha512-arhlxbFRmoQHl33a0Zkle/YWlmNwoyt6QNZEIJcqNbdrsix5Lvc4HyyI3EnwxTYlZYc32EbYrQ8SzEZ7dqgg9A==} + engines: {node: '>=14'} + + lodash-es@4.17.21: + resolution: {integrity: sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==} + + longest-streak@3.1.0: + resolution: {integrity: sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==} + + lru-cache@10.4.3: + resolution: {integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==} + + magic-string@0.30.19: + resolution: {integrity: sha512-2N21sPY9Ws53PZvsEpVtNuSW+ScYbQdp4b9qUaL+9QkHUrGFKo56Lg9Emg5s9V/qrtNBmiR01sYhUOwu3H+VOw==} + + magicast@0.3.5: + resolution: {integrity: sha512-L0WhttDl+2BOsybvEOLK7fW3UA0OQ0IQ2d6Zl2x/a6vVRs3bAY0ECOSHHeL5jD+SbOpOCUEi0y1DgHEn9Qn1AQ==} + + markdown-extensions@2.0.0: + resolution: {integrity: sha512-o5vL7aDWatOTX8LzaS1WMoaoxIiLRQJuIKKe2wAw6IeULDHaqbiqiggmx+pKvZDb1Sj+pE46Sn1T7lCqfFtg1Q==} + engines: {node: '>=16'} + + markdown-table@3.0.4: + resolution: {integrity: sha512-wiYz4+JrLyb/DqW2hkFJxP7Vd7JuTDm77fvbM8VfEQdmSMqcImWeeRbHwZjBjIFki/VaMK2BhFi7oUUZeM5bqw==} + + marked-footnote@1.4.0: + resolution: {integrity: sha512-fZTxAhI1TcLEs5UOjCfYfTHpyKGaWQevbxaGTEA68B51l7i87SctPFtHETYqPkEN0ka5opvy4Dy1l/yXVC+hmg==} + peerDependencies: + marked: '>=7.0.0' + + marked-smartypants@1.1.10: + resolution: {integrity: sha512-XGK59M2nhy3Jpa0kdWSXQuKn908VkKbqK1IqF8Rk5QV619OWBs2/rkcg/PVhpKkADlRKJSYe6XqDMZMkZywT4g==} + peerDependencies: + marked: '>=4 <17' + + marked@12.0.2: + resolution: {integrity: sha512-qXUm7e/YKFoqFPYPa3Ukg9xlI5cyAtGmyEIzMfW//m6kXwCy2Ps9DYf5ioijFKQ8qyuscrHoY04iJGctu2Kg0Q==} + engines: {node: '>= 18'} + hasBin: true + + marked@16.2.1: + resolution: {integrity: sha512-r3UrXED9lMlHF97jJByry90cwrZBBvZmjG1L68oYfuPMW+uDTnuMbyJDymCWwbTE+f+3LhpNDKfpR3a3saFyjA==} + engines: {node: '>= 20'} + hasBin: true + + mdast-heading-id@2.0.0: + resolution: {integrity: sha512-JVh0xKqsI3INPzJEqqCiuq3BGde5x6AlBTQAetLQQr9qTiDjX4dCvFhIiGmyPt1rftiHELQPI5obGphIOTXeWQ==} + + mdast-util-definitions@6.0.0: + resolution: {integrity: sha512-scTllyX6pnYNZH/AIp/0ePz6s4cZtARxImwoPJ7kS42n+MnVsI4XbnG6d4ibehRIldYMWM2LD7ImQblVhUejVQ==} + + mdast-util-directive@3.1.0: + resolution: {integrity: sha512-I3fNFt+DHmpWCYAT7quoM6lHf9wuqtI+oCOfvILnoicNIqjh5E3dEJWiXuYME2gNe8vl1iMQwyUHa7bgFmak6Q==} + + mdast-util-find-and-replace@3.0.2: + resolution: {integrity: sha512-Tmd1Vg/m3Xz43afeNxDIhWRtFZgM2VLyaf4vSTYwudTyeuTneoL3qtWMA5jeLyz/O1vDJmmV4QuScFCA2tBPwg==} + + mdast-util-from-markdown@2.0.2: + resolution: {integrity: sha512-uZhTV/8NBuw0WHkPTrCqDOl0zVe1BIng5ZtHoDk49ME1qqcjYmmLmOf0gELgcRMxN4w2iuIeVso5/6QymSrgmA==} + + mdast-util-gfm-autolink-literal@2.0.1: + resolution: {integrity: sha512-5HVP2MKaP6L+G6YaxPNjuL0BPrq9orG3TsrZ9YXbA3vDw/ACI4MEsnoDpn6ZNm7GnZgtAcONJyPhOP8tNJQavQ==} + + mdast-util-gfm-footnote@2.1.0: + resolution: {integrity: sha512-sqpDWlsHn7Ac9GNZQMeUzPQSMzR6Wv0WKRNvQRg0KqHh02fpTz69Qc1QSseNX29bhz1ROIyNyxExfawVKTm1GQ==} + + mdast-util-gfm-strikethrough@2.0.0: + resolution: {integrity: sha512-mKKb915TF+OC5ptj5bJ7WFRPdYtuHv0yTRxK2tJvi+BDqbkiG7h7u/9SI89nRAYcmap2xHQL9D+QG/6wSrTtXg==} + + mdast-util-gfm-table@2.0.0: + resolution: {integrity: sha512-78UEvebzz/rJIxLvE7ZtDd/vIQ0RHv+3Mh5DR96p7cS7HsBhYIICDBCu8csTNWNO6tBWfqXPWekRuj2FNOGOZg==} + + mdast-util-gfm-task-list-item@2.0.0: + resolution: {integrity: sha512-IrtvNvjxC1o06taBAVJznEnkiHxLFTzgonUdy8hzFVeDun0uTjxxrRGVaNFqkU1wJR3RBPEfsxmU6jDWPofrTQ==} + + mdast-util-gfm@3.1.0: + resolution: {integrity: sha512-0ulfdQOM3ysHhCJ1p06l0b0VKlhU0wuQs3thxZQagjcjPrlFRqY215uZGHHJan9GEAXd9MbfPjFJz+qMkVR6zQ==} + + mdast-util-mdx-expression@2.0.1: + resolution: {integrity: sha512-J6f+9hUp+ldTZqKRSg7Vw5V6MqjATc+3E4gf3CFNcuZNWD8XdyI6zQ8GqH7f8169MM6P7hMBRDVGnn7oHB9kXQ==} + + mdast-util-mdx-jsx@3.2.0: + resolution: {integrity: sha512-lj/z8v0r6ZtsN/cGNNtemmmfoLAFZnjMbNyLzBafjzikOM+glrjNHPlf6lQDOTccj9n5b0PPihEBbhneMyGs1Q==} + + mdast-util-mdx@3.0.0: + resolution: {integrity: sha512-JfbYLAW7XnYTTbUsmpu0kdBUVe+yKVJZBItEjwyYJiDJuZ9w4eeaqks4HQO+R7objWgS2ymV60GYpI14Ug554w==} + + mdast-util-mdxjs-esm@2.0.1: + resolution: {integrity: sha512-EcmOpxsZ96CvlP03NghtH1EsLtr0n9Tm4lPUJUBccV9RwUOneqSycg19n5HGzCf+10LozMRSObtVr3ee1WoHtg==} + + mdast-util-phrasing@4.1.0: + resolution: {integrity: sha512-TqICwyvJJpBwvGAMZjj4J2n0X8QWp21b9l0o7eXyVJ25YNWYbJDVIyD1bZXE6WtV6RmKJVYmQAKWa0zWOABz2w==} + + mdast-util-to-hast@13.2.0: + resolution: {integrity: sha512-QGYKEuUsYT9ykKBCMOEDLsU5JRObWQusAolFMeko/tYPufNkRffBAQjIE+99jbA87xv6FgmjLtwjh9wBWajwAA==} + + mdast-util-to-markdown@2.1.2: + resolution: {integrity: sha512-xj68wMTvGXVOKonmog6LwyJKrYXZPvlwabaryTjLh9LuvovB/KAH+kvi8Gjj+7rJjsFi23nkUxRQv1KqSroMqA==} + + mdast-util-to-string@4.0.0: + resolution: {integrity: sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==} + + mdn-data@2.12.2: + resolution: {integrity: sha512-IEn+pegP1aManZuckezWCO+XZQDplx1366JoVhTpMpBB1sPey/SbveZQUosKiKiGYjg1wH4pMlNgXbCiYgihQA==} + + mermaid@11.10.1: + resolution: {integrity: sha512-0PdeADVWURz7VMAX0+MiMcgfxFKY4aweSGsjgFihe3XlMKNqmai/cugMrqTd3WNHM93V+K+AZL6Wu6tB5HmxRw==} + + micromark-core-commonmark@2.0.3: + resolution: {integrity: sha512-RDBrHEMSxVFLg6xvnXmb1Ayr2WzLAWjeSATAoxwKYJV94TeNavgoIdA0a9ytzDSVzBy2YKFK+emCPOEibLeCrg==} + + micromark-extension-directive@3.0.2: + resolution: {integrity: sha512-wjcXHgk+PPdmvR58Le9d7zQYWy+vKEU9Se44p2CrCDPiLr2FMyiT4Fyb5UFKFC66wGB3kPlgD7q3TnoqPS7SZA==} + + micromark-extension-gfm-autolink-literal@2.1.0: + resolution: {integrity: sha512-oOg7knzhicgQ3t4QCjCWgTmfNhvQbDDnJeVu9v81r7NltNCVmhPy1fJRX27pISafdjL+SVc4d3l48Gb6pbRypw==} + + micromark-extension-gfm-footnote@2.1.0: + resolution: {integrity: sha512-/yPhxI1ntnDNsiHtzLKYnE3vf9JZ6cAisqVDauhp4CEHxlb4uoOTxOCJ+9s51bIB8U1N1FJ1RXOKTIlD5B/gqw==} + + micromark-extension-gfm-strikethrough@2.1.0: + resolution: {integrity: sha512-ADVjpOOkjz1hhkZLlBiYA9cR2Anf8F4HqZUO6e5eDcPQd0Txw5fxLzzxnEkSkfnD0wziSGiv7sYhk/ktvbf1uw==} + + micromark-extension-gfm-table@2.1.1: + resolution: {integrity: sha512-t2OU/dXXioARrC6yWfJ4hqB7rct14e8f7m0cbI5hUmDyyIlwv5vEtooptH8INkbLzOatzKuVbQmAYcbWoyz6Dg==} + + micromark-extension-gfm-tagfilter@2.0.0: + resolution: {integrity: sha512-xHlTOmuCSotIA8TW1mDIM6X2O1SiX5P9IuDtqGonFhEK0qgRI4yeC6vMxEV2dgyr2TiD+2PQ10o+cOhdVAcwfg==} + + micromark-extension-gfm-task-list-item@2.1.0: + resolution: {integrity: sha512-qIBZhqxqI6fjLDYFTBIa4eivDMnP+OZqsNwmQ3xNLE4Cxwc+zfQEfbs6tzAo2Hjq+bh6q5F+Z8/cksrLFYWQQw==} + + micromark-extension-gfm@3.0.0: + resolution: {integrity: sha512-vsKArQsicm7t0z2GugkCKtZehqUm31oeGBV/KVSorWSy8ZlNAv7ytjFhvaryUiCUJYqs+NoE6AFhpQvBTM6Q4w==} + + micromark-extension-mdx-expression@3.0.1: + resolution: {integrity: sha512-dD/ADLJ1AeMvSAKBwO22zG22N4ybhe7kFIZ3LsDI0GlsNr2A3KYxb0LdC1u5rj4Nw+CHKY0RVdnHX8vj8ejm4Q==} + + micromark-extension-mdx-jsx@3.0.2: + resolution: {integrity: sha512-e5+q1DjMh62LZAJOnDraSSbDMvGJ8x3cbjygy2qFEi7HCeUT4BDKCvMozPozcD6WmOt6sVvYDNBKhFSz3kjOVQ==} + + micromark-extension-mdx-md@2.0.0: + resolution: {integrity: sha512-EpAiszsB3blw4Rpba7xTOUptcFeBFi+6PY8VnJ2hhimH+vCQDirWgsMpz7w1XcZE7LVrSAUGb9VJpG9ghlYvYQ==} + + micromark-extension-mdxjs-esm@3.0.0: + resolution: {integrity: sha512-DJFl4ZqkErRpq/dAPyeWp15tGrcrrJho1hKK5uBS70BCtfrIFg81sqcTVu3Ta+KD1Tk5vAtBNElWxtAa+m8K9A==} + + micromark-extension-mdxjs@3.0.0: + resolution: {integrity: sha512-A873fJfhnJ2siZyUrJ31l34Uqwy4xIFmvPY1oj+Ean5PHcPBYzEsvqvWGaWcfEIr11O5Dlw3p2y0tZWpKHDejQ==} + + micromark-factory-destination@2.0.1: + resolution: {integrity: sha512-Xe6rDdJlkmbFRExpTOmRj9N3MaWmbAgdpSrBQvCFqhezUn4AHqJHbaEnfbVYYiexVSs//tqOdY/DxhjdCiJnIA==} + + micromark-factory-label@2.0.1: + resolution: {integrity: sha512-VFMekyQExqIW7xIChcXn4ok29YE3rnuyveW3wZQWWqF4Nv9Wk5rgJ99KzPvHjkmPXF93FXIbBp6YdW3t71/7Vg==} + + micromark-factory-mdx-expression@2.0.3: + resolution: {integrity: sha512-kQnEtA3vzucU2BkrIa8/VaSAsP+EJ3CKOvhMuJgOEGg9KDC6OAY6nSnNDVRiVNRqj7Y4SlSzcStaH/5jge8JdQ==} + + micromark-factory-space@2.0.1: + resolution: {integrity: sha512-zRkxjtBxxLd2Sc0d+fbnEunsTj46SWXgXciZmHq0kDYGnck/ZSGj9/wULTV95uoeYiK5hRXP2mJ98Uo4cq/LQg==} + + micromark-factory-title@2.0.1: + resolution: {integrity: sha512-5bZ+3CjhAd9eChYTHsjy6TGxpOFSKgKKJPJxr293jTbfry2KDoWkhBb6TcPVB4NmzaPhMs1Frm9AZH7OD4Cjzw==} + + micromark-factory-whitespace@2.0.1: + resolution: {integrity: sha512-Ob0nuZ3PKt/n0hORHyvoD9uZhr+Za8sFoP+OnMcnWK5lngSzALgQYKMr9RJVOWLqQYuyn6ulqGWSXdwf6F80lQ==} + + micromark-heading-id@2.0.0: + resolution: {integrity: sha512-TdR5WCmwuCroK8QrfX0/4w9bjj3ayN0GzatxGV/lWQKmM75kNKVZEmdvKZS4MOskARxWXu1WHdIJjMSVMBegow==} + + micromark-util-character@2.1.1: + resolution: {integrity: sha512-wv8tdUTJ3thSFFFJKtpYKOYiGP2+v96Hvk4Tu8KpCAsTMs6yi+nVmGh1syvSCsaxz45J6Jbw+9DD6g97+NV67Q==} + + micromark-util-chunked@2.0.1: + resolution: {integrity: sha512-QUNFEOPELfmvv+4xiNg2sRYeS/P84pTW0TCgP5zc9FpXetHY0ab7SxKyAQCNCc1eK0459uoLI1y5oO5Vc1dbhA==} + + micromark-util-classify-character@2.0.1: + resolution: {integrity: sha512-K0kHzM6afW/MbeWYWLjoHQv1sgg2Q9EccHEDzSkxiP/EaagNzCm7T/WMKZ3rjMbvIpvBiZgwR3dKMygtA4mG1Q==} + + micromark-util-combine-extensions@2.0.1: + resolution: {integrity: sha512-OnAnH8Ujmy59JcyZw8JSbK9cGpdVY44NKgSM7E9Eh7DiLS2E9RNQf0dONaGDzEG9yjEl5hcqeIsj4hfRkLH/Bg==} + + micromark-util-decode-numeric-character-reference@2.0.2: + resolution: {integrity: sha512-ccUbYk6CwVdkmCQMyr64dXz42EfHGkPQlBj5p7YVGzq8I7CtjXZJrubAYezf7Rp+bjPseiROqe7G6foFd+lEuw==} + + micromark-util-decode-string@2.0.1: + resolution: {integrity: sha512-nDV/77Fj6eH1ynwscYTOsbK7rR//Uj0bZXBwJZRfaLEJ1iGBR6kIfNmlNqaqJf649EP0F3NWNdeJi03elllNUQ==} + + micromark-util-encode@2.0.1: + resolution: {integrity: sha512-c3cVx2y4KqUnwopcO9b/SCdo2O67LwJJ/UyqGfbigahfegL9myoEFoDYZgkT7f36T0bLrM9hZTAaAyH+PCAXjw==} + + micromark-util-events-to-acorn@2.0.3: + resolution: {integrity: sha512-jmsiEIiZ1n7X1Rr5k8wVExBQCg5jy4UXVADItHmNk1zkwEVhBuIUKRu3fqv+hs4nxLISi2DQGlqIOGiFxgbfHg==} + + micromark-util-html-tag-name@2.0.1: + resolution: {integrity: sha512-2cNEiYDhCWKI+Gs9T0Tiysk136SnR13hhO8yW6BGNyhOC4qYFnwF1nKfD3HFAIXA5c45RrIG1ub11GiXeYd1xA==} + + micromark-util-normalize-identifier@2.0.1: + resolution: {integrity: sha512-sxPqmo70LyARJs0w2UclACPUUEqltCkJ6PhKdMIDuJ3gSf/Q+/GIe3WKl0Ijb/GyH9lOpUkRAO2wp0GVkLvS9Q==} + + micromark-util-resolve-all@2.0.1: + resolution: {integrity: sha512-VdQyxFWFT2/FGJgwQnJYbe1jjQoNTS4RjglmSjTUlpUMa95Htx9NHeYW4rGDJzbjvCsl9eLjMQwGeElsqmzcHg==} + + micromark-util-sanitize-uri@2.0.1: + resolution: {integrity: sha512-9N9IomZ/YuGGZZmQec1MbgxtlgougxTodVwDzzEouPKo3qFWvymFHWcnDi2vzV1ff6kas9ucW+o3yzJK9YB1AQ==} + + micromark-util-subtokenize@2.1.0: + resolution: {integrity: sha512-XQLu552iSctvnEcgXw6+Sx75GflAPNED1qx7eBJ+wydBb2KCbRZe+NwvIEEMM83uml1+2WSXpBAcp9IUCgCYWA==} + + micromark-util-symbol@2.0.1: + resolution: {integrity: sha512-vs5t8Apaud9N28kgCrRUdEed4UJ+wWNvicHLPxCa9ENlYuAY31M0ETy5y1vA33YoNPDFTghEbnh6efaE8h4x0Q==} + + micromark-util-types@2.0.2: + resolution: {integrity: sha512-Yw0ECSpJoViF1qTU4DC6NwtC4aWGt1EkzaQB8KPPyCRR8z9TWeV0HbEFGTO+ZY1wB22zmxnJqhPyTpOVCpeHTA==} + + micromark@4.0.2: + resolution: {integrity: sha512-zpe98Q6kvavpCr1NPVSCMebCKfD7CA2NqZ+rykeNhONIJBpc1tFKt9hucLGwha3jNTNI8lHpctWJWoimVF4PfA==} + + mlly@1.8.0: + resolution: {integrity: sha512-l8D9ODSRWLe2KHJSifWGwBqpTZXIXTeo8mlKjY+E2HAakaTeNpqAyBZ8GSqLzHgw4XmHmC8whvpjJNMbFZN7/g==} + + mrmime@2.0.1: + resolution: {integrity: sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ==} + engines: {node: '>=10'} + + ms@2.1.3: + resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==} + + nanoid@3.3.11: + resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==} + engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} + hasBin: true + + neotraverse@0.6.18: + resolution: {integrity: sha512-Z4SmBUweYa09+o6pG+eASabEpP6QkQ70yHj351pQoEXIs8uHbaU2DWVmzBANKgflPa47A50PtB2+NgRpQvr7vA==} + engines: {node: '>= 10'} + + nlcst-to-string@4.0.0: + resolution: {integrity: sha512-YKLBCcUYKAg0FNlOBT6aI91qFmSiFKiluk655WzPF+DDMA02qIyy8uiRqI8QXtcFpEvll12LpL5MXqEmAZ+dcA==} + + node-fetch-native@1.6.7: + resolution: {integrity: sha512-g9yhqoedzIUm0nTnTqAQvueMPVOuIY16bqgAJJC8XOOubYFNwz6IER9qs0Gq2Xd0+CecCKFjtdDTMA4u4xG06Q==} + + node-fetch@2.7.0: + resolution: {integrity: sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==} + engines: {node: 4.x || >=6.0.0} + peerDependencies: + encoding: ^0.1.0 + peerDependenciesMeta: + encoding: + optional: true + + node-mock-http@1.0.3: + resolution: {integrity: sha512-jN8dK25fsfnMrVsEhluUTPkBFY+6ybu7jSB1n+ri/vOGjJxU8J9CZhpSGkHXSkFjtUhbmoncG/YG9ta5Ludqog==} + + normalize-path@3.0.0: + resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==} + engines: {node: '>=0.10.0'} + + nth-check@2.1.1: + resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==} + + ofetch@1.4.1: + resolution: {integrity: sha512-QZj2DfGplQAr2oj9KzceK9Hwz6Whxazmn85yYeVuS3u9XTMOGMRx0kO95MQ+vLsj/S/NwBDMMLU5hpxvI6Tklw==} + + ohash@2.0.11: + resolution: {integrity: sha512-RdR9FQrFwNBNXAr4GixM8YaRZRJ5PUWbKYbE5eOsrwAjJW0q2REGcf79oYPsLyskQCZG1PLN+S/K1V00joZAoQ==} + + oniguruma-parser@0.12.1: + resolution: {integrity: sha512-8Unqkvk1RYc6yq2WBYRj4hdnsAxVze8i7iPfQr8e4uSP3tRv0rpZcbGUDvxfQQcdwHt/e9PrMvGCsa8OqG9X3w==} + + oniguruma-to-es@4.3.3: + resolution: {integrity: sha512-rPiZhzC3wXwE59YQMRDodUwwT9FZ9nNBwQQfsd1wfdtlKEyCdRV0avrTcSZ5xlIvGRVPd/cx6ZN45ECmS39xvg==} + + p-limit@6.2.0: + resolution: {integrity: sha512-kuUqqHNUqoIWp/c467RI4X6mmyuojY5jGutNU0wVTmEOOfcuwLqyMVoAi9MKi2Ak+5i9+nhmrK4ufZE8069kHA==} + engines: {node: '>=18'} + + p-queue@8.1.1: + resolution: {integrity: sha512-aNZ+VfjobsWryoiPnEApGGmf5WmNsCo9xu8dfaYamG5qaLP7ClhLN6NgsFe6SwJ2UbLEBK5dv9x8Mn5+RVhMWQ==} + engines: {node: '>=18'} + + p-timeout@6.1.4: + resolution: {integrity: sha512-MyIV3ZA/PmyBN/ud8vV9XzwTrNtR4jFrObymZYnZqMmW0zA8Z17vnT0rBgFE/TlohB+YCHqXMgZzb3Csp49vqg==} + engines: {node: '>=14.16'} + + package-manager-detector@1.3.0: + resolution: {integrity: sha512-ZsEbbZORsyHuO00lY1kV3/t72yp6Ysay6Pd17ZAlNGuGwmWDLCJxFpRs0IzfXfj1o4icJOkUEioexFHzyPurSQ==} + + pagefind@1.3.0: + resolution: {integrity: sha512-8KPLGT5g9s+olKMRTU9LFekLizkVIu9tes90O1/aigJ0T5LmyPqTzGJrETnSw3meSYg58YH7JTzhTTW/3z6VAw==} + hasBin: true + + pako@0.2.9: + resolution: {integrity: sha512-NUcwaKxUxWrZLpDG+z/xZaCgQITkA/Dv4V/T6bw7VON6l1Xz/VnrBqrYjZQ12TamKHzITTfOEIYUj48y2KXImA==} + + parse-entities@4.0.2: + resolution: {integrity: sha512-GG2AQYWoLgL877gQIKeRPGO1xF9+eG1ujIb5soS5gPvLQ1y2o8FL90w2QWNdf9I361Mpp7726c+lj3U0qK1uGw==} + + parse-latin@7.0.0: + resolution: {integrity: sha512-mhHgobPPua5kZ98EF4HWiH167JWBfl4pvAIXXdbaVohtK7a6YBOy56kvhCqduqyo/f3yrHFWmqmiMg/BkBkYYQ==} + + parse5@7.3.0: + resolution: {integrity: sha512-IInvU7fabl34qmi9gY8XOVxhYyMyuH2xUNpb2q8/Y+7552KlejkRvqvD19nMoUW/uQGGbqNpA6Tufu5FL5BZgw==} + + path-data-parser@0.1.0: + resolution: {integrity: sha512-NOnmBpt5Y2RWbuv0LMzsayp3lVylAHLPUTut412ZA3l+C4uw4ZVkQbjShYCQ8TCpUMdPapr4YjUqLYD6v68j+w==} + + pathe@2.0.3: + resolution: {integrity: sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==} + + picocolors@1.1.1: + resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==} + + picomatch@2.3.1: + resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==} + engines: {node: '>=8.6'} + + picomatch@4.0.3: + resolution: {integrity: sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==} + engines: {node: '>=12'} + + pkg-types@1.3.1: + resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==} + + pkg-types@2.3.0: + resolution: {integrity: sha512-SIqCzDRg0s9npO5XQ3tNZioRY1uK06lA41ynBC1YmFTmnY6FjUjVt6s4LoADmwoig1qqD0oK8h1p/8mlMx8Oig==} + + points-on-curve@0.2.0: + resolution: {integrity: sha512-0mYKnYYe9ZcqMCWhUjItv/oHjvgEsfKvnUTg8sAtnHr3GVy7rGkXCb6d5cSyqrWqL4k81b9CPg3urd+T7aop3A==} + + points-on-path@0.2.1: + resolution: {integrity: sha512-25ClnWWuw7JbWZcgqY/gJ4FQWadKxGWk+3kR/7kD0tCaDtPPMj7oHu2ToLaVhfpnHrZzYby2w6tUA0eOIuUg8g==} + + postcss-nested@6.2.0: + resolution: {integrity: sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==} + engines: {node: '>=12.0'} + peerDependencies: + postcss: ^8.2.14 + + postcss-selector-parser@6.1.2: + resolution: {integrity: sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==} + engines: {node: '>=4'} + + postcss@8.5.6: + resolution: {integrity: sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==} + engines: {node: ^10 || ^12 || >=14} + + prismjs@1.30.0: + resolution: {integrity: sha512-DEvV2ZF2r2/63V+tK8hQvrR2ZGn10srHbXviTlcv7Kpzw8jWiNTqbVgjO3IY8RxrrOUF8VPMQQFysYYYv0YZxw==} + engines: {node: '>=6'} + + prompts@2.4.2: + resolution: {integrity: sha512-NxNv/kLguCA7p3jE8oL2aEBsrJWgAakBpgmgK6lpPWV+WuOmY6r2/zbAVnP+T8bQlA0nzHXSJSJW0Hq7ylaD2Q==} + engines: {node: '>= 6'} + + property-information@6.5.0: + resolution: {integrity: sha512-PgTgs/BlvHxOu8QuEN7wi5A0OmXaBcHpmCSTehcs6Uuu9IkDIEo13Hy7n898RHfrQ49vKCoGeWZSaAK01nwVig==} + + property-information@7.1.0: + resolution: {integrity: sha512-TwEZ+X+yCJmYfL7TPUOcvBZ4QfoT5YenQiJuX//0th53DE6w0xxLEtfK3iyryQFddXuvkIk51EEgrJQ0WJkOmQ==} + + quansync@0.2.11: + resolution: {integrity: sha512-AifT7QEbW9Nri4tAwR5M/uzpBuqfZf+zwaEM/QkzEjj7NBuFD2rBuy0K3dE+8wltbezDV7JMA0WfnCPYRSYbXA==} + + radix3@1.1.2: + resolution: {integrity: sha512-b484I/7b8rDEdSDKckSSBA8knMpcdsXudlE/LNL639wFoHKwLbEkQFZHWEYwDC0wa0FKUcCY+GAF73Z7wxNVFA==} + + readdirp@4.1.2: + resolution: {integrity: sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==} + engines: {node: '>= 14.18.0'} + + recma-build-jsx@1.0.0: + resolution: {integrity: sha512-8GtdyqaBcDfva+GUKDr3nev3VpKAhup1+RvkMvUxURHpW7QyIvk9F5wz7Vzo06CEMSilw6uArgRqhpiUcWp8ew==} + + recma-jsx@1.0.1: + resolution: {integrity: sha512-huSIy7VU2Z5OLv6oFLosQGGDqPqdO1iq6bWNAdhzMxSJP7RAso4fCZ1cKu8j9YHCZf3TPrq4dw3okhrylgcd7w==} + peerDependencies: + acorn: ^6.0.0 || ^7.0.0 || ^8.0.0 + + recma-parse@1.0.0: + resolution: {integrity: sha512-OYLsIGBB5Y5wjnSnQW6t3Xg7q3fQ7FWbw/vcXtORTnyaSFscOtABg+7Pnz6YZ6c27fG1/aN8CjfwoUEUIdwqWQ==} + + recma-stringify@1.0.0: + resolution: {integrity: sha512-cjwII1MdIIVloKvC9ErQ+OgAtwHBmcZ0Bg4ciz78FtbT8In39aAYbaA7zvxQ61xVMSPE8WxhLwLbhif4Js2C+g==} + + regex-recursion@6.0.2: + resolution: {integrity: sha512-0YCaSCq2VRIebiaUviZNs0cBz1kg5kVS2UKUfNIx8YVs1cN3AV7NTctO5FOKBA+UT2BPJIWZauYHPqJODG50cg==} + + regex-utilities@2.3.0: + resolution: {integrity: sha512-8VhliFJAWRaUiVvREIiW2NXXTmHs4vMNnSzuJVhscgmGav3g9VDxLrQndI3dZZVVdp0ZO/5v0xmX516/7M9cng==} + + regex@6.0.1: + resolution: {integrity: sha512-uorlqlzAKjKQZ5P+kTJr3eeJGSVroLKoHmquUj4zHWuR+hEyNqlXsSKlYYF5F4NI6nl7tWCs0apKJ0lmfsXAPA==} + + rehype-expressive-code@0.41.3: + resolution: {integrity: sha512-8d9Py4c/V6I/Od2VIXFAdpiO2kc0SV2qTJsRAaqSIcM9aruW4ASLNe2kOEo1inXAAkIhpFzAHTc358HKbvpNUg==} + + rehype-format@5.0.1: + resolution: {integrity: sha512-zvmVru9uB0josBVpr946OR8ui7nJEdzZobwLOOqHb/OOD88W0Vk2SqLwoVOj0fM6IPCCO6TaV9CvQvJMWwukFQ==} + + rehype-parse@9.0.1: + resolution: {integrity: sha512-ksCzCD0Fgfh7trPDxr2rSylbwq9iYDkSn8TCDmEJ49ljEUBxDVCzCHv7QNzZOfODanX4+bWQ4WZqLCRWYLfhag==} + + rehype-raw@7.0.0: + resolution: {integrity: sha512-/aE8hCfKlQeA8LmyeyQvQF3eBiLRGNlfBJEvWH7ivp9sBqs7TNqBL5X3v157rM4IFETqDnIOO+z5M/biZbo9Ww==} + + rehype-recma@1.0.0: + resolution: {integrity: sha512-lqA4rGUf1JmacCNWWZx0Wv1dHqMwxzsDWYMTowuplHF3xH0N/MmrZ/G3BDZnzAkRmxDadujCjaKM2hqYdCBOGw==} + + rehype-stringify@10.0.1: + resolution: {integrity: sha512-k9ecfXHmIPuFVI61B9DeLPN0qFHfawM6RsuX48hoqlaKSF61RskNjSm1lI8PhBEM0MRdLxVVm4WmTqJQccH9mA==} + + rehype@13.0.2: + resolution: {integrity: sha512-j31mdaRFrwFRUIlxGeuPXXKWQxet52RBQRvCmzl5eCefn/KGbomK5GMHNMsOJf55fgo3qw5tST5neDuarDYR2A==} + + remark-custom-heading-id@2.0.0: + resolution: {integrity: sha512-LpR+c4pmuBGG/zhNbebecDnpKyXU4B7bdNu6tXW83T3QWlkwUpHYyUR8uXQ/BERK9HlI5pXGLu7DjkIS07/iVQ==} + + remark-directive@3.0.1: + resolution: {integrity: sha512-gwglrEQEZcZYgVyG1tQuA+h58EZfq5CSULw7J90AFuCTyib1thgHPoqQ+h9iFvU6R+vnZ5oNFQR5QKgGpk741A==} + + remark-gfm@4.0.1: + resolution: {integrity: sha512-1quofZ2RQ9EWdeN34S79+KExV1764+wCUGop5CPL1WGdD0ocPpu91lzPGbwWMECpEpd42kJGQwzRfyov9j4yNg==} + + remark-mdx@3.1.0: + resolution: {integrity: sha512-Ngl/H3YXyBV9RcRNdlYsZujAmhsxwzxpDzpDEhFBVAGthS4GDgnctpDjgFl/ULx5UEDzqtW1cyBSNKqYYrqLBA==} + + remark-parse@11.0.0: + resolution: {integrity: sha512-FCxlKLNGknS5ba/1lmpYijMUzX2esxW5xQqjWxw2eHFfS2MSdaHVINFmhjo+qN1WhZhNimq0dZATN9pH0IDrpA==} + + remark-rehype@11.1.2: + resolution: {integrity: sha512-Dh7l57ianaEoIpzbp0PC9UKAdCSVklD8E5Rpw7ETfbTl3FqcOOgq5q2LVDhgGCkaBv7p24JXikPdvhhmHvKMsw==} + + remark-smartypants@3.0.2: + resolution: {integrity: sha512-ILTWeOriIluwEvPjv67v7Blgrcx+LZOkAUVtKI3putuhlZm84FnqDORNXPPm+HY3NdZOMhyDwZ1E+eZB/Df5dA==} + engines: {node: '>=16.0.0'} + + remark-stringify@11.0.0: + resolution: {integrity: sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw==} + + restructure@3.0.2: + resolution: {integrity: sha512-gSfoiOEA0VPE6Tukkrr7I0RBdE0s7H1eFCDBk05l1KIQT1UIKNc5JZy6jdyW6eYH3aR3g5b3PuL77rq0hvwtAw==} + + retext-latin@4.0.0: + resolution: {integrity: sha512-hv9woG7Fy0M9IlRQloq/N6atV82NxLGveq+3H2WOi79dtIYWN8OaxogDm77f8YnVXJL2VD3bbqowu5E3EMhBYA==} + + retext-smartypants@6.2.0: + resolution: {integrity: sha512-kk0jOU7+zGv//kfjXEBjdIryL1Acl4i9XNkHxtM7Tm5lFiCog576fjNC9hjoR7LTKQ0DsPWy09JummSsH1uqfQ==} + + retext-stringify@4.0.0: + resolution: {integrity: sha512-rtfN/0o8kL1e+78+uxPTqu1Klt0yPzKuQ2BfWwwfgIUSayyzxpM1PJzkKt4V8803uB9qSy32MvI7Xep9khTpiA==} + + retext@9.0.0: + resolution: {integrity: sha512-sbMDcpHCNjvlheSgMfEcVrZko3cDzdbe1x/e7G66dFp0Ff7Mldvi2uv6JkJQzdRcvLYE8CA8Oe8siQx8ZOgTcA==} + + robust-predicates@3.0.2: + resolution: {integrity: sha512-IXgzBWvWQwE6PrDI05OvmXUIruQTcoMDzRsOd5CDvHCVLcLHMTSYvOK5Cm46kWqlV3yAbuSpBZdJ5oP5OUoStg==} + + rollup@4.50.1: + resolution: {integrity: sha512-78E9voJHwnXQMiQdiqswVLZwJIzdBKJ1GdI5Zx6XwoFKUIk09/sSrr+05QFzvYb8q6Y9pPV45zzDuYa3907TZA==} + engines: {node: '>=18.0.0', npm: '>=8.0.0'} + hasBin: true + + roughjs@4.6.6: + resolution: {integrity: sha512-ZUz/69+SYpFN/g/lUlo2FXcIjRkSu3nDarreVdGGndHEBJ6cXPdKguS8JGxwj5HA5xIbVKSmLgr5b3AWxtRfvQ==} + + rw@1.3.3: + resolution: {integrity: sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==} + + safer-buffer@2.1.2: + resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==} + + sax@1.4.1: + resolution: {integrity: sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==} + + semver@7.7.2: + resolution: {integrity: sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==} + engines: {node: '>=10'} + hasBin: true + + sharp@0.33.5: + resolution: {integrity: sha512-haPVm1EkS9pgvHrQ/F3Xy+hgcuMV0Wm9vfIBSiwZ05k+xgb0PkBQpGsAA/oWdDobNaZTH5ppvHtzCFbnSEwHVw==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + + sharp@0.34.3: + resolution: {integrity: sha512-eX2IQ6nFohW4DbvHIOLRB3MHFpYqaqvXd3Tp5e/T/dSH83fxaNJQRvDMhASmkNTsNTVF2/OOopzRCt7xokgPfg==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} + + shiki@3.12.2: + resolution: {integrity: sha512-uIrKI+f9IPz1zDT+GMz+0RjzKJiijVr6WDWm9Pe3NNY6QigKCfifCEv9v9R2mDASKKjzjQ2QpFLcxaR3iHSnMA==} + + simple-swizzle@0.2.2: + resolution: {integrity: sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==} + + sisteransi@1.0.5: + resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==} + + sitemap@8.0.0: + resolution: {integrity: sha512-+AbdxhM9kJsHtruUF39bwS/B0Fytw6Fr1o4ZAIAEqA6cke2xcoO2GleBw9Zw7nRzILVEgz7zBM5GiTJjie1G9A==} + engines: {node: '>=14.0.0', npm: '>=6.0.0'} + deprecated: 'SECURITY: Multiple vulnerabilities fixed in 8.0.1 (XML injection, path traversal, command injection, protocol injection). Upgrade immediately: npm install sitemap@8.0.1' + hasBin: true + + smartypants@0.2.2: + resolution: {integrity: sha512-TzobUYoEft/xBtb2voRPryAUIvYguG0V7Tt3de79I1WfXgCwelqVsGuZSnu3GFGRZhXR90AeEYIM+icuB/S06Q==} + hasBin: true + + smol-toml@1.4.2: + resolution: {integrity: sha512-rInDH6lCNiEyn3+hH8KVGFdbjc099j47+OSgbMrfDYX1CmXLfdKd7qi6IfcWj2wFxvSVkuI46M+wPGYfEOEj6g==} + engines: {node: '>= 18'} + + source-map-js@1.2.1: + resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==} + engines: {node: '>=0.10.0'} + + source-map@0.7.6: + resolution: {integrity: sha512-i5uvt8C3ikiWeNZSVZNWcfZPItFQOsYTUAOkcUPGd8DqDy1uOUikjt5dG+uRlwyvR108Fb9DOd4GvXfT0N2/uQ==} + engines: {node: '>= 12'} + + space-separated-tokens@2.0.2: + resolution: {integrity: sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q==} + + starlight-auto-sidebar@0.2.0: + resolution: {integrity: sha512-iHPAhwnkdkFM84QajJvjKo0twNLg9fU+HrVCxs0QgWAQdYLK9bhM1SxyVPV3O+YBo111mBHryzDA1ChHWUxD1w==} + engines: {node: '>=22.12.0'} + peerDependencies: + '@astrojs/starlight': '>=0.38.0' + + starlight-github-alerts@0.1.0: + resolution: {integrity: sha512-mz+btaGen5ByF1BRCMHnqkzSGXsHfvXfiPGGB9BgeczKUvbDR1PAciLYam0gN0JbZYwZSzmhJzgvcHG6gt4f/Q==} + engines: {node: '>=18.17.1'} + peerDependencies: + '@astrojs/starlight': '>=0.35.0' + + starlight-image-zoom@0.13.0: + resolution: {integrity: sha512-7K/7gshnKooYd4ePy5vtyv1jFoFVNUb8IoXWDcnY69+nxvmLATNrmOzD2M4TJ/aKynPSBSM6j9ia4s/PPy/JGA==} + engines: {node: '>=18'} + peerDependencies: + '@astrojs/starlight': '>=0.32.0' + + starlight-links-validator@0.18.0: + resolution: {integrity: sha512-R0gLdrKWdpAEqux3DL2B3QvNJM8Zpys8CQu1BGLD9hc+66nt/Q6aJDkvvkvoCVky9JKmBEnmL4PhFkyz13lK5g==} + engines: {node: '>=18.17.1'} + peerDependencies: + '@astrojs/starlight': '>=0.32.0' + + stream-replace-string@2.0.0: + resolution: {integrity: sha512-TlnjJ1C0QrmxRNrON00JvaFFlNh5TTG00APw23j74ET7gkQpTASi6/L2fuiav8pzK715HXtUeClpBTw2NPSn6w==} + + string-width@4.2.3: + resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==} + engines: {node: '>=8'} + + string-width@7.2.0: + resolution: {integrity: sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==} + engines: {node: '>=18'} + + stringify-entities@4.0.4: + resolution: {integrity: sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg==} + + strip-ansi@6.0.1: + resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==} + engines: {node: '>=8'} + + strip-ansi@7.1.2: + resolution: {integrity: sha512-gmBGslpoQJtgnMAvOVqGZpEz9dyoKTCzy2nfz/n8aIFhN/jCE/rCmcxabB6jOOHV+0WNnylOxaxBQPSvcWklhA==} + engines: {node: '>=12'} + + style-to-js@1.1.17: + resolution: {integrity: sha512-xQcBGDxJb6jjFCTzvQtfiPn6YvvP2O8U1MDIPNfJQlWMYfktPy+iGsHE7cssjs7y84d9fQaK4UF3RIJaAHSoYA==} + + style-to-object@1.0.9: + resolution: {integrity: sha512-G4qppLgKu/k6FwRpHiGiKPaPTFcG3g4wNVX/Qsfu+RqQM30E7Tyu/TEgxcL9PNLF5pdRLwQdE3YKKf+KF2Dzlw==} + + stylis@4.3.6: + resolution: {integrity: sha512-yQ3rwFWRfwNUY7H5vpU0wfdkNSnvnJinhF9830Swlaxl03zsOjCfmX0ugac+3LtK0lYSgwL/KXc8oYL3mG4YFQ==} + + supports-color@10.2.2: + resolution: {integrity: sha512-SS+jx45GF1QjgEXQx4NJZV9ImqmO2NPz5FNsIHrsDjh2YsHnawpan7SNQ1o8NuhrbHZy9AZhIoCUiCeaW/C80g==} + engines: {node: '>=18'} + + supports-hyperlinks@4.2.0: + resolution: {integrity: sha512-FWXryrXrsYX2vlTD9WdfgOeN7a2EbuS3MiMaDkFibR0B6IxelCNbFgUJEGLn3eSn+9HX7RuM0ig6Lzr8lccxUA==} + engines: {node: '>=20'} + + terminal-link@5.0.0: + resolution: {integrity: sha512-qFAy10MTMwjzjU8U16YS4YoZD+NQLHzLssFMNqgravjbvIPNiqkGFR4yjhJfmY9R5OFU7+yHxc6y+uGHkKwLRA==} + engines: {node: '>=20'} + + tiny-inflate@1.0.3: + resolution: {integrity: sha512-pkY1fj1cKHb2seWDy0B16HeWyczlJA9/WW3u3c4z/NiWDsO3DOU5D7nhTLE9CF0yXv/QZFY7sEJmj24dK+Rrqw==} + + tinyexec@0.3.2: + resolution: {integrity: sha512-KQQR9yN7R5+OSwaK0XQoj22pwHoTlgYqmUscPYoknOoWCWfj/5/ABTMRi69FrKU5ffPVh5QcFikpWJI/P1ocHA==} + + tinyexec@1.0.1: + resolution: {integrity: sha512-5uC6DDlmeqiOwCPmK9jMSdOuZTh8bU39Ys6yidB+UTt5hfZUPGAypSgFRiEp+jbi9qH40BLDvy85jIU88wKSqw==} + + tinyglobby@0.2.15: + resolution: {integrity: sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==} + engines: {node: '>=12.0.0'} + + tr46@0.0.3: + resolution: {integrity: sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==} + + trim-lines@3.0.1: + resolution: {integrity: sha512-kRj8B+YHZCc9kQYdWfJB2/oUl9rA99qbowYYBtr4ui4mZyAQ2JpvVBd/6U2YloATfqBhBTSMhTpgBHtU0Mf3Rg==} + + trough@2.2.0: + resolution: {integrity: sha512-tmMpK00BjZiUyVyvrBK7knerNgmgvcV/KLVyuma/SC+TQN167GrMRciANTz09+k3zW8L8t60jWO1GpfkZdjTaw==} + + ts-dedent@2.2.0: + resolution: {integrity: sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==} + engines: {node: '>=6.10'} + + tsconfck@3.1.6: + resolution: {integrity: sha512-ks6Vjr/jEw0P1gmOVwutM3B7fWxoWBL2KRDb1JfqGVawBmO5UsvmWOQFGHBPl5yxYz4eERr19E6L7NMv+Fej4w==} + engines: {node: ^18 || >=20} + hasBin: true + peerDependencies: + typescript: ^5.0.0 + peerDependenciesMeta: + typescript: + optional: true + + tslib@2.8.1: + resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==} + + type-fest@4.41.0: + resolution: {integrity: sha512-TeTSQ6H5YHvpqVwBRcnLDCBnDOHWYu7IvGbHT6N8AOymcr9PJGjc1GTtiWZTYg0NCgYwvnYWEkVChQAr9bjfwA==} + engines: {node: '>=16'} + + typescript@5.9.2: + resolution: {integrity: sha512-CWBzXQrc/qOkhidw1OzBTQuYRbfyxDXJMVJ1XNwUHGROVmuaeiEm3OslpZ1RV96d7SKKjZKrSJu3+t/xlw3R9A==} + engines: {node: '>=14.17'} + hasBin: true + + ufo@1.6.1: + resolution: {integrity: sha512-9a4/uxlTWJ4+a5i0ooc1rU7C7YOw3wT+UGqdeNNHWnOF9qcMBgLRS+4IYUqbczewFx4mLEig6gawh7X6mFlEkA==} + + ultrahtml@1.6.0: + resolution: {integrity: sha512-R9fBn90VTJrqqLDwyMph+HGne8eqY1iPfYhPzZrvKpIfwkWZbcYlfpsb8B9dTvBfpy1/hqAD7Wi8EKfP9e8zdw==} + + uncrypto@0.1.3: + resolution: {integrity: sha512-Ql87qFHB3s/De2ClA9e0gsnS6zXG27SkTiSJwjCc9MebbfapQfuPzumMIUMi38ezPZVNFcHI9sUIepeQfw8J8Q==} + + undici-types@7.10.0: + resolution: {integrity: sha512-t5Fy/nfn+14LuOc2KNYg75vZqClpAiqscVvMygNnlsHBFpSXdJaYtXMcdNLpl/Qvc3P2cB3s6lOV51nqsFq4ag==} + + unicode-properties@1.4.1: + resolution: {integrity: sha512-CLjCCLQ6UuMxWnbIylkisbRj31qxHPAurvena/0iwSVbQ2G1VY5/HjV0IRabOEbDHlzZlRdCrD4NhB0JtU40Pg==} + + unicode-trie@2.0.0: + resolution: {integrity: sha512-x7bc76x0bm4prf1VLg79uhAzKw8DVboClSN5VxJuQ+LKDOVEW9CdH+VY7SP+vX7xCYQqzzgQpFqz15zeLvAtZQ==} + + unified@11.0.5: + resolution: {integrity: sha512-xKvGhPWw3k84Qjh8bI3ZeJjqnyadK+GEFtazSfZv/rKeTkTjOJho6mFqh2SM96iIcZokxiOpg78GazTSg8+KHA==} + + unifont@0.5.2: + resolution: {integrity: sha512-LzR4WUqzH9ILFvjLAUU7dK3Lnou/qd5kD+IakBtBK4S15/+x2y9VX+DcWQv6s551R6W+vzwgVS6tFg3XggGBgg==} + + unist-util-find-after@5.0.0: + resolution: {integrity: sha512-amQa0Ep2m6hE2g72AugUItjbuM8X8cGQnFoHk0pGfrFeT9GZhzN5SW8nRsiGKK7Aif4CrACPENkA6P/Lw6fHGQ==} + + unist-util-is@6.0.0: + resolution: {integrity: sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==} + + unist-util-modify-children@4.0.0: + resolution: {integrity: sha512-+tdN5fGNddvsQdIzUF3Xx82CU9sMM+fA0dLgR9vOmT0oPT2jH+P1nd5lSqfCfXAw+93NhcXNY2qqvTUtE4cQkw==} + + unist-util-position-from-estree@2.0.0: + resolution: {integrity: sha512-KaFVRjoqLyF6YXCbVLNad/eS4+OfPQQn2yOd7zF/h5T/CSL2v8NpN6a5TPvtbXthAGw5nG+PuTtq+DdIZr+cRQ==} + + unist-util-position@5.0.0: + resolution: {integrity: sha512-fucsC7HjXvkB5R3kTCO7kUjRdrS0BJt3M/FPxmHMBOm8JQi2BsHAHFsy27E0EolP8rp0NzXsJ+jNPyDWvOJZPA==} + + unist-util-remove-position@5.0.0: + resolution: {integrity: sha512-Hp5Kh3wLxv0PHj9m2yZhhLt58KzPtEYKQQ4yxfYFEO7EvHwzyDYnduhHnY1mDxoqr7VUwVuHXk9RXKIiYS1N8Q==} + + unist-util-stringify-position@4.0.0: + resolution: {integrity: sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ==} + + unist-util-visit-children@3.0.0: + resolution: {integrity: sha512-RgmdTfSBOg04sdPcpTSD1jzoNBjt9a80/ZCzp5cI9n1qPzLZWF9YdvWGN2zmTumP1HWhXKdUWexjy/Wy/lJ7tA==} + + unist-util-visit-parents@6.0.1: + resolution: {integrity: sha512-L/PqWzfTP9lzzEa6CKs0k2nARxTdZduw3zyh8d2NVBnsyvHjSX4TWse388YrrQKbvI8w20fGjGlhgT96WwKykw==} + + unist-util-visit@5.0.0: + resolution: {integrity: sha512-MR04uvD+07cwl/yhVuVWAtw+3GOR/knlL55Nd/wAdblk27GCVt3lqpTivy/tkJcZoNPzTwS1Y+KMojlLDhoTzg==} + + unstorage@1.17.1: + resolution: {integrity: sha512-KKGwRTT0iVBCErKemkJCLs7JdxNVfqTPc/85ae1XES0+bsHbc/sFBfVi5kJp156cc51BHinIH2l3k0EZ24vOBQ==} + peerDependencies: + '@azure/app-configuration': ^1.8.0 + '@azure/cosmos': ^4.2.0 + '@azure/data-tables': ^13.3.0 + '@azure/identity': ^4.6.0 + '@azure/keyvault-secrets': ^4.9.0 + '@azure/storage-blob': ^12.26.0 + '@capacitor/preferences': ^6.0.3 || ^7.0.0 + '@deno/kv': '>=0.9.0' + '@netlify/blobs': ^6.5.0 || ^7.0.0 || ^8.1.0 || ^9.0.0 || ^10.0.0 + '@planetscale/database': ^1.19.0 + '@upstash/redis': ^1.34.3 + '@vercel/blob': '>=0.27.1' + '@vercel/functions': ^2.2.12 || ^3.0.0 + '@vercel/kv': ^1.0.1 + aws4fetch: ^1.0.20 + db0: '>=0.2.1' + idb-keyval: ^6.2.1 + ioredis: ^5.4.2 + uploadthing: ^7.4.4 + peerDependenciesMeta: + '@azure/app-configuration': + optional: true + '@azure/cosmos': + optional: true + '@azure/data-tables': + optional: true + '@azure/identity': + optional: true + '@azure/keyvault-secrets': + optional: true + '@azure/storage-blob': + optional: true + '@capacitor/preferences': + optional: true + '@deno/kv': + optional: true + '@netlify/blobs': + optional: true + '@planetscale/database': + optional: true + '@upstash/redis': + optional: true + '@vercel/blob': + optional: true + '@vercel/functions': + optional: true + '@vercel/kv': + optional: true + aws4fetch: + optional: true + db0: + optional: true + idb-keyval: + optional: true + ioredis: + optional: true + uploadthing: + optional: true + + util-deprecate@1.0.2: + resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==} + + uuid@11.1.0: + resolution: {integrity: sha512-0/A9rDy9P7cJ+8w1c9WD9V//9Wj15Ce2MPz8Ri6032usz+NfePxx5AcN3bN+r6ZL6jEo066/yNYB3tn4pQEx+A==} + hasBin: true + + vfile-location@5.0.3: + resolution: {integrity: sha512-5yXvWDEgqeiYiBe1lbxYF7UMAIm/IcopxMHrMQDq3nvKcjPKIhZklUKL+AE7J7uApI4kwe2snsK+eI6UTj9EHg==} + + vfile-message@4.0.3: + resolution: {integrity: sha512-QTHzsGd1EhbZs4AsQ20JX1rC3cOlt/IWJruk893DfLRr57lcnOeMaWG4K0JrRta4mIJZKth2Au3mM3u03/JWKw==} + + vfile@6.0.3: + resolution: {integrity: sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q==} + + vite@6.3.6: + resolution: {integrity: sha512-0msEVHJEScQbhkbVTb/4iHZdJ6SXp/AvxL2sjwYQFfBqleHtnCqv1J3sa9zbWz/6kW1m9Tfzn92vW+kZ1WV6QA==} + engines: {node: ^18.0.0 || ^20.0.0 || >=22.0.0} + hasBin: true + peerDependencies: + '@types/node': ^18.0.0 || ^20.0.0 || >=22.0.0 + jiti: '>=1.21.0' + less: '*' + lightningcss: ^1.21.0 + sass: '*' + sass-embedded: '*' + stylus: '*' + sugarss: '*' + terser: ^5.16.0 + tsx: ^4.8.1 + yaml: ^2.4.2 + peerDependenciesMeta: + '@types/node': + optional: true + jiti: + optional: true + less: + optional: true + lightningcss: + optional: true + sass: + optional: true + sass-embedded: + optional: true + stylus: + optional: true + sugarss: + optional: true + terser: + optional: true + tsx: + optional: true + yaml: + optional: true + + vitefu@1.1.1: + resolution: {integrity: sha512-B/Fegf3i8zh0yFbpzZ21amWzHmuNlLlmJT6n7bu5e+pCHUKQIfXSYokrqOBGEMMe9UG2sostKQF9mml/vYaWJQ==} + peerDependencies: + vite: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0-beta.0 + peerDependenciesMeta: + vite: + optional: true + + vscode-jsonrpc@8.2.0: + resolution: {integrity: sha512-C+r0eKJUIfiDIfwJhria30+TYWPtuHJXHtI7J0YlOmKAo7ogxP20T0zxB7HZQIFhIyvoBPwWskjxrvAtfjyZfA==} + engines: {node: '>=14.0.0'} + + vscode-languageserver-protocol@3.17.5: + resolution: {integrity: sha512-mb1bvRJN8SVznADSGWM9u/b07H7Ecg0I3OgXDuLdn307rl/J3A9YD6/eYOssqhecL27hK1IPZAsaqh00i/Jljg==} + + vscode-languageserver-textdocument@1.0.12: + resolution: {integrity: sha512-cxWNPesCnQCcMPeenjKKsOCKQZ/L6Tv19DTRIGuLWe32lyzWhihGVJ/rcckZXJxfdKCFvRLS3fpBIsV/ZGX4zA==} + + vscode-languageserver-types@3.17.5: + resolution: {integrity: sha512-Ld1VelNuX9pdF39h2Hgaeb5hEZM2Z3jUrrMgWQAu82jMtZp7p3vJT3BzToKtZI7NgQssZje5o0zryOrhQvzQAg==} + + vscode-languageserver@9.0.1: + resolution: {integrity: sha512-woByF3PDpkHFUreUa7Hos7+pUWdeWMXRd26+ZX2A8cFx6v/JPTtd4/uN0/jB6XQHYaOlHbio03NTHCqrgG5n7g==} + hasBin: true + + vscode-uri@3.0.8: + resolution: {integrity: sha512-AyFQ0EVmsOZOlAnxoFOGOq1SQDWAB7C6aqMGS23svWAllfOaxbuFvcT8D1i8z3Gyn8fraVeZNNmN6e9bxxXkKw==} + + web-namespaces@2.0.1: + resolution: {integrity: sha512-bKr1DkiNa2krS7qxNtdrtHAmzuYGFQLiQ13TsorsdT6ULTkPLKuu5+GsFpDlg6JFjUTwX2DyhMPG2be8uPrqsQ==} + + webidl-conversions@3.0.1: + resolution: {integrity: sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==} + + whatwg-url@5.0.0: + resolution: {integrity: sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==} + + which-pm-runs@1.1.0: + resolution: {integrity: sha512-n1brCuqClxfFfq/Rb0ICg9giSZqCS+pLtccdag6C2HyufBrh3fBOiy9nb6ggRMvWOVH5GrdJskj5iGTZNxd7SA==} + engines: {node: '>=4'} + + widest-line@5.0.0: + resolution: {integrity: sha512-c9bZp7b5YtRj2wOe6dlj32MK+Bx/M/d+9VB2SHM1OtsUHR0aV0tdP6DWh/iMt0kWi1t5g1Iudu6hQRNd1A4PVA==} + engines: {node: '>=18'} + + wrap-ansi@9.0.2: + resolution: {integrity: sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww==} + engines: {node: '>=18'} + + xxhash-wasm@1.1.0: + resolution: {integrity: sha512-147y/6YNh+tlp6nd/2pWq38i9h6mz/EuQ6njIrmW8D1BS5nCqs0P6DG+m6zTGnNz5I+uhZ0SHxBs9BsPrwcKDA==} + + yaml@2.8.1: + resolution: {integrity: sha512-lcYcMxX2PO9XMGvAJkJ3OsNMw+/7FKes7/hgerGUYWIoWu5j/+YQqcZr5JnPZWzOsEBgMbSbiSTn/dv/69Mkpw==} + engines: {node: '>= 14.6'} + hasBin: true + + yargs-parser@21.1.1: + resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==} + engines: {node: '>=12'} + + yocto-queue@1.2.1: + resolution: {integrity: sha512-AyeEbWOu/TAXdxlV9wmGcR0+yh2j3vYPGOECcIj2S7MkrLyC7ne+oye2BKTItt0ii2PHk4cDy+95+LshzbXnGg==} + engines: {node: '>=12.20'} + + yocto-spinner@0.2.3: + resolution: {integrity: sha512-sqBChb33loEnkoXte1bLg45bEBsOP9N1kzQh5JZNKj/0rik4zAPTNSAVPj3uQAdc6slYJ0Ksc403G2XgxsJQFQ==} + engines: {node: '>=18.19'} + + yoctocolors@2.1.2: + resolution: {integrity: sha512-CzhO+pFNo8ajLM2d2IW/R93ipy99LWjtwblvC1RsoSUMZgyLbYFr221TnSNT7GjGdYui6P459mw9JH/g/zW2ug==} + engines: {node: '>=18'} + + zod-to-json-schema@3.24.6: + resolution: {integrity: sha512-h/z3PKvcTcTetyjl1fkj79MHNEjm+HpD6NXheWjzOekY7kV+lwDYnHw+ivHkijnCSMz1yJaWBD9vu/Fcmk+vEg==} + peerDependencies: + zod: ^3.24.1 + + zod-to-ts@1.2.0: + resolution: {integrity: sha512-x30XE43V+InwGpvTySRNz9kB7qFU8DlyEy7BsSTCHPH1R0QasMmHWZDCzYm6bVXtj/9NNJAZF3jW8rzFvH5OFA==} + peerDependencies: + typescript: ^4.9.4 || ^5.0.2 + zod: ^3 + + zod@3.25.76: + resolution: {integrity: sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==} + + zwitch@2.0.4: + resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==} + +snapshots: + + '@antfu/install-pkg@1.1.0': + dependencies: + package-manager-detector: 1.3.0 + tinyexec: 1.0.1 + + '@antfu/utils@8.1.1': {} + + '@astrojs/compiler@2.12.2': {} + + '@astrojs/internal-helpers@0.7.2': {} + + '@astrojs/markdown-remark@6.3.6': + dependencies: + '@astrojs/internal-helpers': 0.7.2 + '@astrojs/prism': 3.3.0 + github-slugger: 2.0.0 + hast-util-from-html: 2.0.3 + hast-util-to-text: 4.0.2 + import-meta-resolve: 4.2.0 + js-yaml: 4.1.0 + mdast-util-definitions: 6.0.0 + rehype-raw: 7.0.0 + rehype-stringify: 10.0.1 + remark-gfm: 4.0.1 + remark-parse: 11.0.0 + remark-rehype: 11.1.2 + remark-smartypants: 3.0.2 + shiki: 3.12.2 + smol-toml: 1.4.2 + unified: 11.0.5 + unist-util-remove-position: 5.0.0 + unist-util-visit: 5.0.0 + unist-util-visit-parents: 6.0.1 + vfile: 6.0.3 + transitivePeerDependencies: + - supports-color + + '@astrojs/mdx@4.3.4(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))': + dependencies: + '@astrojs/markdown-remark': 6.3.6 + '@mdx-js/mdx': 3.1.0(acorn@8.15.0) + acorn: 8.15.0 + astro: 5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1) + es-module-lexer: 1.7.0 + estree-util-visit: 2.0.0 + hast-util-to-html: 9.0.5 + kleur: 4.1.5 + rehype-raw: 7.0.0 + remark-gfm: 4.0.1 + remark-smartypants: 3.0.2 + source-map: 0.7.6 + unist-util-visit: 5.0.0 + vfile: 6.0.3 + transitivePeerDependencies: + - supports-color + + '@astrojs/prism@3.3.0': + dependencies: + prismjs: 1.30.0 + + '@astrojs/sitemap@3.5.1': + dependencies: + sitemap: 8.0.0 + stream-replace-string: 2.0.0 + zod: 3.25.76 + + '@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))': + dependencies: + '@astrojs/markdown-remark': 6.3.6 + '@astrojs/mdx': 4.3.4(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)) + '@astrojs/sitemap': 3.5.1 + '@pagefind/default-ui': 1.3.0 + '@types/hast': 3.0.4 + '@types/js-yaml': 4.0.9 + '@types/mdast': 4.0.4 + astro: 5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1) + astro-expressive-code: 0.41.3(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)) + bcp-47: 2.1.0 + hast-util-from-html: 2.0.3 + hast-util-select: 6.0.4 + hast-util-to-string: 3.0.1 + hastscript: 9.0.1 + i18next: 23.16.8 + js-yaml: 4.1.0 + klona: 2.0.6 + mdast-util-directive: 3.1.0 + mdast-util-to-markdown: 2.1.2 + mdast-util-to-string: 4.0.0 + pagefind: 1.3.0 + rehype: 13.0.2 + rehype-format: 5.0.1 + remark-directive: 3.0.1 + ultrahtml: 1.6.0 + unified: 11.0.5 + unist-util-visit: 5.0.0 + vfile: 6.0.3 + transitivePeerDependencies: + - supports-color + + '@astrojs/telemetry@3.3.0': + dependencies: + ci-info: 4.3.0 + debug: 4.4.1 + dlv: 1.1.3 + dset: 3.1.4 + is-docker: 3.0.0 + is-wsl: 3.1.0 + which-pm-runs: 1.1.0 + transitivePeerDependencies: + - supports-color + + '@babel/helper-string-parser@7.27.1': {} + + '@babel/helper-validator-identifier@7.27.1': {} + + '@babel/parser@7.28.4': + dependencies: + '@babel/types': 7.28.4 + + '@babel/runtime@7.28.3': {} + + '@babel/types@7.28.4': + dependencies: + '@babel/helper-string-parser': 7.27.1 + '@babel/helper-validator-identifier': 7.27.1 + + '@braintree/sanitize-url@7.1.1': {} + + '@capsizecss/unpack@2.4.0': + dependencies: + blob-to-buffer: 1.2.9 + cross-fetch: 3.2.0 + fontkit: 2.0.4 + transitivePeerDependencies: + - encoding + + '@catppuccin/starlight@1.1.1(@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)))(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))': + dependencies: + '@astrojs/starlight': 0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)) + astro: 5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1) + + '@chevrotain/cst-dts-gen@11.0.3': + dependencies: + '@chevrotain/gast': 11.0.3 + '@chevrotain/types': 11.0.3 + lodash-es: 4.17.21 + + '@chevrotain/gast@11.0.3': + dependencies: + '@chevrotain/types': 11.0.3 + lodash-es: 4.17.21 + + '@chevrotain/regexp-to-ast@11.0.3': {} + + '@chevrotain/types@11.0.3': {} + + '@chevrotain/utils@11.0.3': {} + + '@ctrl/tinycolor@4.1.0': {} + + '@emnapi/runtime@1.5.0': + dependencies: + tslib: 2.8.1 + optional: true + + '@esbuild/aix-ppc64@0.25.9': + optional: true + + '@esbuild/android-arm64@0.25.9': + optional: true + + '@esbuild/android-arm@0.25.9': + optional: true + + '@esbuild/android-x64@0.25.9': + optional: true + + '@esbuild/darwin-arm64@0.25.9': + optional: true + + '@esbuild/darwin-x64@0.25.9': + optional: true + + '@esbuild/freebsd-arm64@0.25.9': + optional: true + + '@esbuild/freebsd-x64@0.25.9': + optional: true + + '@esbuild/linux-arm64@0.25.9': + optional: true + + '@esbuild/linux-arm@0.25.9': + optional: true + + '@esbuild/linux-ia32@0.25.9': + optional: true + + '@esbuild/linux-loong64@0.25.9': + optional: true + + '@esbuild/linux-mips64el@0.25.9': + optional: true + + '@esbuild/linux-ppc64@0.25.9': + optional: true + + '@esbuild/linux-riscv64@0.25.9': + optional: true + + '@esbuild/linux-s390x@0.25.9': + optional: true + + '@esbuild/linux-x64@0.25.9': + optional: true + + '@esbuild/netbsd-arm64@0.25.9': + optional: true + + '@esbuild/netbsd-x64@0.25.9': + optional: true + + '@esbuild/openbsd-arm64@0.25.9': + optional: true + + '@esbuild/openbsd-x64@0.25.9': + optional: true + + '@esbuild/openharmony-arm64@0.25.9': + optional: true + + '@esbuild/sunos-x64@0.25.9': + optional: true + + '@esbuild/win32-arm64@0.25.9': + optional: true + + '@esbuild/win32-ia32@0.25.9': + optional: true + + '@esbuild/win32-x64@0.25.9': + optional: true + + '@expressive-code/core@0.41.3': + dependencies: + '@ctrl/tinycolor': 4.1.0 + hast-util-select: 6.0.4 + hast-util-to-html: 9.0.5 + hast-util-to-text: 4.0.2 + hastscript: 9.0.1 + postcss: 8.5.6 + postcss-nested: 6.2.0(postcss@8.5.6) + unist-util-visit: 5.0.0 + unist-util-visit-parents: 6.0.1 + + '@expressive-code/plugin-frames@0.41.3': + dependencies: + '@expressive-code/core': 0.41.3 + + '@expressive-code/plugin-shiki@0.41.3': + dependencies: + '@expressive-code/core': 0.41.3 + shiki: 3.12.2 + + '@expressive-code/plugin-text-markers@0.41.3': + dependencies: + '@expressive-code/core': 0.41.3 + + '@iconify/types@2.0.0': {} + + '@iconify/utils@2.3.0': + dependencies: + '@antfu/install-pkg': 1.1.0 + '@antfu/utils': 8.1.1 + '@iconify/types': 2.0.0 + debug: 4.4.1 + globals: 15.15.0 + kolorist: 1.8.0 + local-pkg: 1.1.2 + mlly: 1.8.0 + transitivePeerDependencies: + - supports-color + + '@img/sharp-darwin-arm64@0.33.5': + optionalDependencies: + '@img/sharp-libvips-darwin-arm64': 1.0.4 + optional: true + + '@img/sharp-darwin-arm64@0.34.3': + optionalDependencies: + '@img/sharp-libvips-darwin-arm64': 1.2.0 + optional: true + + '@img/sharp-darwin-x64@0.33.5': + optionalDependencies: + '@img/sharp-libvips-darwin-x64': 1.0.4 + optional: true + + '@img/sharp-darwin-x64@0.34.3': + optionalDependencies: + '@img/sharp-libvips-darwin-x64': 1.2.0 + optional: true + + '@img/sharp-libvips-darwin-arm64@1.0.4': + optional: true + + '@img/sharp-libvips-darwin-arm64@1.2.0': + optional: true + + '@img/sharp-libvips-darwin-x64@1.0.4': + optional: true + + '@img/sharp-libvips-darwin-x64@1.2.0': + optional: true + + '@img/sharp-libvips-linux-arm64@1.0.4': + optional: true + + '@img/sharp-libvips-linux-arm64@1.2.0': + optional: true + + '@img/sharp-libvips-linux-arm@1.0.5': + optional: true + + '@img/sharp-libvips-linux-arm@1.2.0': + optional: true + + '@img/sharp-libvips-linux-ppc64@1.2.0': + optional: true + + '@img/sharp-libvips-linux-s390x@1.0.4': + optional: true + + '@img/sharp-libvips-linux-s390x@1.2.0': + optional: true + + '@img/sharp-libvips-linux-x64@1.0.4': + optional: true + + '@img/sharp-libvips-linux-x64@1.2.0': + optional: true + + '@img/sharp-libvips-linuxmusl-arm64@1.0.4': + optional: true + + '@img/sharp-libvips-linuxmusl-arm64@1.2.0': + optional: true + + '@img/sharp-libvips-linuxmusl-x64@1.0.4': + optional: true + + '@img/sharp-libvips-linuxmusl-x64@1.2.0': + optional: true + + '@img/sharp-linux-arm64@0.33.5': + optionalDependencies: + '@img/sharp-libvips-linux-arm64': 1.0.4 + optional: true + + '@img/sharp-linux-arm64@0.34.3': + optionalDependencies: + '@img/sharp-libvips-linux-arm64': 1.2.0 + optional: true + + '@img/sharp-linux-arm@0.33.5': + optionalDependencies: + '@img/sharp-libvips-linux-arm': 1.0.5 + optional: true + + '@img/sharp-linux-arm@0.34.3': + optionalDependencies: + '@img/sharp-libvips-linux-arm': 1.2.0 + optional: true + + '@img/sharp-linux-ppc64@0.34.3': + optionalDependencies: + '@img/sharp-libvips-linux-ppc64': 1.2.0 + optional: true + + '@img/sharp-linux-s390x@0.33.5': + optionalDependencies: + '@img/sharp-libvips-linux-s390x': 1.0.4 + optional: true + + '@img/sharp-linux-s390x@0.34.3': + optionalDependencies: + '@img/sharp-libvips-linux-s390x': 1.2.0 + optional: true + + '@img/sharp-linux-x64@0.33.5': + optionalDependencies: + '@img/sharp-libvips-linux-x64': 1.0.4 + optional: true + + '@img/sharp-linux-x64@0.34.3': + optionalDependencies: + '@img/sharp-libvips-linux-x64': 1.2.0 + optional: true + + '@img/sharp-linuxmusl-arm64@0.33.5': + optionalDependencies: + '@img/sharp-libvips-linuxmusl-arm64': 1.0.4 + optional: true + + '@img/sharp-linuxmusl-arm64@0.34.3': + optionalDependencies: + '@img/sharp-libvips-linuxmusl-arm64': 1.2.0 + optional: true + + '@img/sharp-linuxmusl-x64@0.33.5': + optionalDependencies: + '@img/sharp-libvips-linuxmusl-x64': 1.0.4 + optional: true + + '@img/sharp-linuxmusl-x64@0.34.3': + optionalDependencies: + '@img/sharp-libvips-linuxmusl-x64': 1.2.0 + optional: true + + '@img/sharp-wasm32@0.33.5': + dependencies: + '@emnapi/runtime': 1.5.0 + optional: true + + '@img/sharp-wasm32@0.34.3': + dependencies: + '@emnapi/runtime': 1.5.0 + optional: true + + '@img/sharp-win32-arm64@0.34.3': + optional: true + + '@img/sharp-win32-ia32@0.33.5': + optional: true + + '@img/sharp-win32-ia32@0.34.3': + optional: true + + '@img/sharp-win32-x64@0.33.5': + optional: true + + '@img/sharp-win32-x64@0.34.3': + optional: true + + '@jridgewell/sourcemap-codec@1.5.5': {} + + '@mdx-js/mdx@3.1.0(acorn@8.15.0)': + dependencies: + '@types/estree': 1.0.8 + '@types/estree-jsx': 1.0.5 + '@types/hast': 3.0.4 + '@types/mdx': 2.0.13 + collapse-white-space: 2.1.0 + devlop: 1.1.0 + estree-util-is-identifier-name: 3.0.0 + estree-util-scope: 1.0.0 + estree-walker: 3.0.3 + hast-util-to-jsx-runtime: 2.3.6 + markdown-extensions: 2.0.0 + recma-build-jsx: 1.0.0 + recma-jsx: 1.0.1(acorn@8.15.0) + recma-stringify: 1.0.0 + rehype-recma: 1.0.0 + remark-mdx: 3.1.0 + remark-parse: 11.0.0 + remark-rehype: 11.1.2 + source-map: 0.7.6 + unified: 11.0.5 + unist-util-position-from-estree: 2.0.0 + unist-util-stringify-position: 4.0.0 + unist-util-visit: 5.0.0 + vfile: 6.0.3 + transitivePeerDependencies: + - acorn + - supports-color + + '@mermaid-js/parser@0.6.2': + dependencies: + langium: 3.3.1 + + '@oslojs/encoding@1.1.0': {} + + '@pagefind/darwin-arm64@1.3.0': + optional: true + + '@pagefind/darwin-x64@1.3.0': + optional: true + + '@pagefind/default-ui@1.3.0': {} + + '@pagefind/linux-arm64@1.3.0': + optional: true + + '@pagefind/linux-x64@1.3.0': + optional: true + + '@pagefind/windows-x64@1.3.0': + optional: true + + '@rollup/pluginutils@5.3.0(rollup@4.50.1)': + dependencies: + '@types/estree': 1.0.8 + estree-walker: 2.0.2 + picomatch: 4.0.3 + optionalDependencies: + rollup: 4.50.1 + + '@rollup/rollup-android-arm-eabi@4.50.1': + optional: true + + '@rollup/rollup-android-arm64@4.50.1': + optional: true + + '@rollup/rollup-darwin-arm64@4.50.1': + optional: true + + '@rollup/rollup-darwin-x64@4.50.1': + optional: true + + '@rollup/rollup-freebsd-arm64@4.50.1': + optional: true + + '@rollup/rollup-freebsd-x64@4.50.1': + optional: true + + '@rollup/rollup-linux-arm-gnueabihf@4.50.1': + optional: true + + '@rollup/rollup-linux-arm-musleabihf@4.50.1': + optional: true + + '@rollup/rollup-linux-arm64-gnu@4.50.1': + optional: true + + '@rollup/rollup-linux-arm64-musl@4.50.1': + optional: true + + '@rollup/rollup-linux-loongarch64-gnu@4.50.1': + optional: true + + '@rollup/rollup-linux-ppc64-gnu@4.50.1': + optional: true + + '@rollup/rollup-linux-riscv64-gnu@4.50.1': + optional: true + + '@rollup/rollup-linux-riscv64-musl@4.50.1': + optional: true + + '@rollup/rollup-linux-s390x-gnu@4.50.1': + optional: true + + '@rollup/rollup-linux-x64-gnu@4.50.1': + optional: true + + '@rollup/rollup-linux-x64-musl@4.50.1': + optional: true + + '@rollup/rollup-openharmony-arm64@4.50.1': + optional: true + + '@rollup/rollup-win32-arm64-msvc@4.50.1': + optional: true + + '@rollup/rollup-win32-ia32-msvc@4.50.1': + optional: true + + '@rollup/rollup-win32-x64-msvc@4.50.1': + optional: true + + '@shikijs/core@3.12.2': + dependencies: + '@shikijs/types': 3.12.2 + '@shikijs/vscode-textmate': 10.0.2 + '@types/hast': 3.0.4 + hast-util-to-html: 9.0.5 + + '@shikijs/engine-javascript@3.12.2': + dependencies: + '@shikijs/types': 3.12.2 + '@shikijs/vscode-textmate': 10.0.2 + oniguruma-to-es: 4.3.3 + + '@shikijs/engine-oniguruma@3.12.2': + dependencies: + '@shikijs/types': 3.12.2 + '@shikijs/vscode-textmate': 10.0.2 + + '@shikijs/langs@3.12.2': + dependencies: + '@shikijs/types': 3.12.2 + + '@shikijs/themes@3.12.2': + dependencies: + '@shikijs/types': 3.12.2 + + '@shikijs/types@3.12.2': + dependencies: + '@shikijs/vscode-textmate': 10.0.2 + '@types/hast': 3.0.4 + + '@shikijs/vscode-textmate@10.0.2': {} + + '@swc/helpers@0.5.17': + dependencies: + tslib: 2.8.1 + + '@types/d3-array@3.2.1': {} + + '@types/d3-axis@3.0.6': + dependencies: + '@types/d3-selection': 3.0.11 + + '@types/d3-brush@3.0.6': + dependencies: + '@types/d3-selection': 3.0.11 + + '@types/d3-chord@3.0.6': {} + + '@types/d3-color@3.1.3': {} + + '@types/d3-contour@3.0.6': + dependencies: + '@types/d3-array': 3.2.1 + '@types/geojson': 7946.0.16 + + '@types/d3-delaunay@6.0.4': {} + + '@types/d3-dispatch@3.0.7': {} + + '@types/d3-drag@3.0.7': + dependencies: + '@types/d3-selection': 3.0.11 + + '@types/d3-dsv@3.0.7': {} + + '@types/d3-ease@3.0.2': {} + + '@types/d3-fetch@3.0.7': + dependencies: + '@types/d3-dsv': 3.0.7 + + '@types/d3-force@3.0.10': {} + + '@types/d3-format@3.0.4': {} + + '@types/d3-geo@3.1.0': + dependencies: + '@types/geojson': 7946.0.16 + + '@types/d3-hierarchy@3.1.7': {} + + '@types/d3-interpolate@3.0.4': + dependencies: + '@types/d3-color': 3.1.3 + + '@types/d3-path@3.1.1': {} + + '@types/d3-polygon@3.0.2': {} + + '@types/d3-quadtree@3.0.6': {} + + '@types/d3-random@3.0.3': {} + + '@types/d3-scale-chromatic@3.1.0': {} + + '@types/d3-scale@4.0.9': + dependencies: + '@types/d3-time': 3.0.4 + + '@types/d3-selection@3.0.11': {} + + '@types/d3-shape@3.1.7': + dependencies: + '@types/d3-path': 3.1.1 + + '@types/d3-time-format@4.0.3': {} + + '@types/d3-time@3.0.4': {} + + '@types/d3-timer@3.0.2': {} + + '@types/d3-transition@3.0.9': + dependencies: + '@types/d3-selection': 3.0.11 + + '@types/d3-zoom@3.0.8': + dependencies: + '@types/d3-interpolate': 3.0.4 + '@types/d3-selection': 3.0.11 + + '@types/d3@7.4.3': + dependencies: + '@types/d3-array': 3.2.1 + '@types/d3-axis': 3.0.6 + '@types/d3-brush': 3.0.6 + '@types/d3-chord': 3.0.6 + '@types/d3-color': 3.1.3 + '@types/d3-contour': 3.0.6 + '@types/d3-delaunay': 6.0.4 + '@types/d3-dispatch': 3.0.7 + '@types/d3-drag': 3.0.7 + '@types/d3-dsv': 3.0.7 + '@types/d3-ease': 3.0.2 + '@types/d3-fetch': 3.0.7 + '@types/d3-force': 3.0.10 + '@types/d3-format': 3.0.4 + '@types/d3-geo': 3.1.0 + '@types/d3-hierarchy': 3.1.7 + '@types/d3-interpolate': 3.0.4 + '@types/d3-path': 3.1.1 + '@types/d3-polygon': 3.0.2 + '@types/d3-quadtree': 3.0.6 + '@types/d3-random': 3.0.3 + '@types/d3-scale': 4.0.9 + '@types/d3-scale-chromatic': 3.1.0 + '@types/d3-selection': 3.0.11 + '@types/d3-shape': 3.1.7 + '@types/d3-time': 3.0.4 + '@types/d3-time-format': 4.0.3 + '@types/d3-timer': 3.0.2 + '@types/d3-transition': 3.0.9 + '@types/d3-zoom': 3.0.8 + + '@types/debug@4.1.12': + dependencies: + '@types/ms': 2.1.0 + + '@types/estree-jsx@1.0.5': + dependencies: + '@types/estree': 1.0.8 + + '@types/estree@1.0.8': {} + + '@types/fontkit@2.0.8': + dependencies: + '@types/node': 24.3.1 + + '@types/geojson@7946.0.16': {} + + '@types/hast@3.0.4': + dependencies: + '@types/unist': 3.0.3 + + '@types/js-yaml@4.0.9': {} + + '@types/mdast@4.0.4': + dependencies: + '@types/unist': 3.0.3 + + '@types/mdx@2.0.13': {} + + '@types/ms@2.1.0': {} + + '@types/nlcst@2.0.3': + dependencies: + '@types/unist': 3.0.3 + + '@types/node@17.0.45': {} + + '@types/node@24.3.1': + dependencies: + undici-types: 7.10.0 + + '@types/picomatch@3.0.2': {} + + '@types/sax@1.2.7': + dependencies: + '@types/node': 17.0.45 + + '@types/trusted-types@2.0.7': + optional: true + + '@types/unist@2.0.11': {} + + '@types/unist@3.0.3': {} + + '@ungap/structured-clone@1.3.0': {} + + acorn-jsx@5.3.2(acorn@8.15.0): + dependencies: + acorn: 8.15.0 + + acorn@8.15.0: {} + + ansi-align@3.0.1: + dependencies: + string-width: 4.2.3 + + ansi-escapes@7.1.0: + dependencies: + environment: 1.1.0 + + ansi-regex@5.0.1: {} + + ansi-regex@6.2.2: {} + + ansi-styles@6.2.3: {} + + anymatch@3.1.3: + dependencies: + normalize-path: 3.0.0 + picomatch: 2.3.1 + + arg@5.0.2: {} + + argparse@2.0.1: {} + + aria-query@5.3.2: {} + + array-iterate@2.0.1: {} + + astring@1.9.0: {} + + astro-expressive-code@0.41.3(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)): + dependencies: + astro: 5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1) + rehype-expressive-code: 0.41.3 + + astro-mermaid@1.0.4(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))(mermaid@11.10.1): + dependencies: + astro: 5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1) + mdast-util-to-string: 4.0.0 + mermaid: 11.10.1 + unist-util-visit: 5.0.0 + + astro-remote@0.3.4: + dependencies: + entities: 4.5.0 + marked: 12.0.2 + marked-footnote: 1.4.0(marked@12.0.2) + marked-smartypants: 1.1.10(marked@12.0.2) + ultrahtml: 1.6.0 + + astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1): + dependencies: + '@astrojs/compiler': 2.12.2 + '@astrojs/internal-helpers': 0.7.2 + '@astrojs/markdown-remark': 6.3.6 + '@astrojs/telemetry': 3.3.0 + '@capsizecss/unpack': 2.4.0 + '@oslojs/encoding': 1.1.0 + '@rollup/pluginutils': 5.3.0(rollup@4.50.1) + acorn: 8.15.0 + aria-query: 5.3.2 + axobject-query: 4.1.0 + boxen: 8.0.1 + ci-info: 4.3.0 + clsx: 2.1.1 + common-ancestor-path: 1.0.1 + cookie: 1.0.2 + cssesc: 3.0.0 + debug: 4.4.1 + deterministic-object-hash: 2.0.2 + devalue: 5.3.2 + diff: 5.2.0 + dlv: 1.1.3 + dset: 3.1.4 + es-module-lexer: 1.7.0 + esbuild: 0.25.9 + estree-walker: 3.0.3 + flattie: 1.1.1 + fontace: 0.3.0 + github-slugger: 2.0.0 + html-escaper: 3.0.3 + http-cache-semantics: 4.2.0 + import-meta-resolve: 4.2.0 + js-yaml: 4.1.0 + kleur: 4.1.5 + magic-string: 0.30.19 + magicast: 0.3.5 + mrmime: 2.0.1 + neotraverse: 0.6.18 + p-limit: 6.2.0 + p-queue: 8.1.1 + package-manager-detector: 1.3.0 + picomatch: 4.0.3 + prompts: 2.4.2 + rehype: 13.0.2 + semver: 7.7.2 + shiki: 3.12.2 + simple-swizzle: 0.2.2 + smol-toml: 1.4.2 + tinyexec: 0.3.2 + tinyglobby: 0.2.15 + tsconfck: 3.1.6(typescript@5.9.2) + ultrahtml: 1.6.0 + unifont: 0.5.2 + unist-util-visit: 5.0.0 + unstorage: 1.17.1 + vfile: 6.0.3 + vite: 6.3.6(@types/node@24.3.1)(yaml@2.8.1) + vitefu: 1.1.1(vite@6.3.6(@types/node@24.3.1)(yaml@2.8.1)) + xxhash-wasm: 1.1.0 + yargs-parser: 21.1.1 + yocto-spinner: 0.2.3 + zod: 3.25.76 + zod-to-json-schema: 3.24.6(zod@3.25.76) + zod-to-ts: 1.2.0(typescript@5.9.2)(zod@3.25.76) + optionalDependencies: + sharp: 0.33.5 + transitivePeerDependencies: + - '@azure/app-configuration' + - '@azure/cosmos' + - '@azure/data-tables' + - '@azure/identity' + - '@azure/keyvault-secrets' + - '@azure/storage-blob' + - '@capacitor/preferences' + - '@deno/kv' + - '@netlify/blobs' + - '@planetscale/database' + - '@types/node' + - '@upstash/redis' + - '@vercel/blob' + - '@vercel/functions' + - '@vercel/kv' + - aws4fetch + - db0 + - encoding + - idb-keyval + - ioredis + - jiti + - less + - lightningcss + - rollup + - sass + - sass-embedded + - stylus + - sugarss + - supports-color + - terser + - tsx + - typescript + - uploadthing + - yaml + + axobject-query@4.1.0: {} + + bail@2.0.2: {} + + base-64@1.0.0: {} + + base64-js@1.5.1: {} + + bcp-47-match@2.0.3: {} + + bcp-47@2.1.0: + dependencies: + is-alphabetical: 2.0.1 + is-alphanumerical: 2.0.1 + is-decimal: 2.0.1 + + blob-to-buffer@1.2.9: {} + + boolbase@1.0.0: {} + + boxen@8.0.1: + dependencies: + ansi-align: 3.0.1 + camelcase: 8.0.0 + chalk: 5.6.2 + cli-boxes: 3.0.0 + string-width: 7.2.0 + type-fest: 4.41.0 + widest-line: 5.0.0 + wrap-ansi: 9.0.2 + + brotli@1.3.3: + dependencies: + base64-js: 1.5.1 + + camelcase@8.0.0: {} + + ccount@2.0.1: {} + + chalk@5.6.2: {} + + character-entities-html4@2.1.0: {} + + character-entities-legacy@3.0.0: {} + + character-entities@2.0.2: {} + + character-reference-invalid@2.0.1: {} + + chevrotain-allstar@0.3.1(chevrotain@11.0.3): + dependencies: + chevrotain: 11.0.3 + lodash-es: 4.17.21 + + chevrotain@11.0.3: + dependencies: + '@chevrotain/cst-dts-gen': 11.0.3 + '@chevrotain/gast': 11.0.3 + '@chevrotain/regexp-to-ast': 11.0.3 + '@chevrotain/types': 11.0.3 + '@chevrotain/utils': 11.0.3 + lodash-es: 4.17.21 + + chokidar@4.0.3: + dependencies: + readdirp: 4.1.2 + + ci-info@4.3.0: {} + + cli-boxes@3.0.0: {} + + clone@2.1.2: {} + + clsx@2.1.1: {} + + collapse-white-space@2.1.0: {} + + color-convert@2.0.1: + dependencies: + color-name: 1.1.4 + + color-name@1.1.4: {} + + color-string@1.9.1: + dependencies: + color-name: 1.1.4 + simple-swizzle: 0.2.2 + + color@4.2.3: + dependencies: + color-convert: 2.0.1 + color-string: 1.9.1 + + comma-separated-tokens@2.0.3: {} + + commander@7.2.0: {} + + commander@8.3.0: {} + + common-ancestor-path@1.0.1: {} + + confbox@0.1.8: {} + + confbox@0.2.2: {} + + cookie-es@1.2.2: {} + + cookie@1.0.2: {} + + cose-base@1.0.3: + dependencies: + layout-base: 1.0.2 + + cose-base@2.2.0: + dependencies: + layout-base: 2.0.1 + + cross-fetch@3.2.0: + dependencies: + node-fetch: 2.7.0 + transitivePeerDependencies: + - encoding + + crossws@0.3.5: + dependencies: + uncrypto: 0.1.3 + + css-selector-parser@3.1.3: {} + + css-tree@3.1.0: + dependencies: + mdn-data: 2.12.2 + source-map-js: 1.2.1 + + cssesc@3.0.0: {} + + cytoscape-cose-bilkent@4.1.0(cytoscape@3.33.1): + dependencies: + cose-base: 1.0.3 + cytoscape: 3.33.1 + + cytoscape-fcose@2.2.0(cytoscape@3.33.1): + dependencies: + cose-base: 2.2.0 + cytoscape: 3.33.1 + + cytoscape@3.33.1: {} + + d3-array@2.12.1: + dependencies: + internmap: 1.0.1 + + d3-array@3.2.4: + dependencies: + internmap: 2.0.3 + + d3-axis@3.0.0: {} + + d3-brush@3.0.0: + dependencies: + d3-dispatch: 3.0.1 + d3-drag: 3.0.0 + d3-interpolate: 3.0.1 + d3-selection: 3.0.0 + d3-transition: 3.0.1(d3-selection@3.0.0) + + d3-chord@3.0.1: + dependencies: + d3-path: 3.1.0 + + d3-color@3.1.0: {} + + d3-contour@4.0.2: + dependencies: + d3-array: 3.2.4 + + d3-delaunay@6.0.4: + dependencies: + delaunator: 5.0.1 + + d3-dispatch@3.0.1: {} + + d3-drag@3.0.0: + dependencies: + d3-dispatch: 3.0.1 + d3-selection: 3.0.0 + + d3-dsv@3.0.1: + dependencies: + commander: 7.2.0 + iconv-lite: 0.6.3 + rw: 1.3.3 + + d3-ease@3.0.1: {} + + d3-fetch@3.0.1: + dependencies: + d3-dsv: 3.0.1 + + d3-force@3.0.0: + dependencies: + d3-dispatch: 3.0.1 + d3-quadtree: 3.0.1 + d3-timer: 3.0.1 + + d3-format@3.1.0: {} + + d3-geo@3.1.1: + dependencies: + d3-array: 3.2.4 + + d3-hierarchy@3.1.2: {} + + d3-interpolate@3.0.1: + dependencies: + d3-color: 3.1.0 + + d3-path@1.0.9: {} + + d3-path@3.1.0: {} + + d3-polygon@3.0.1: {} + + d3-quadtree@3.0.1: {} + + d3-random@3.0.1: {} + + d3-sankey@0.12.3: + dependencies: + d3-array: 2.12.1 + d3-shape: 1.3.7 + + d3-scale-chromatic@3.1.0: + dependencies: + d3-color: 3.1.0 + d3-interpolate: 3.0.1 + + d3-scale@4.0.2: + dependencies: + d3-array: 3.2.4 + d3-format: 3.1.0 + d3-interpolate: 3.0.1 + d3-time: 3.1.0 + d3-time-format: 4.1.0 + + d3-selection@3.0.0: {} + + d3-shape@1.3.7: + dependencies: + d3-path: 1.0.9 + + d3-shape@3.2.0: + dependencies: + d3-path: 3.1.0 + + d3-time-format@4.1.0: + dependencies: + d3-time: 3.1.0 + + d3-time@3.1.0: + dependencies: + d3-array: 3.2.4 + + d3-timer@3.0.1: {} + + d3-transition@3.0.1(d3-selection@3.0.0): + dependencies: + d3-color: 3.1.0 + d3-dispatch: 3.0.1 + d3-ease: 3.0.1 + d3-interpolate: 3.0.1 + d3-selection: 3.0.0 + d3-timer: 3.0.1 + + d3-zoom@3.0.0: + dependencies: + d3-dispatch: 3.0.1 + d3-drag: 3.0.0 + d3-interpolate: 3.0.1 + d3-selection: 3.0.0 + d3-transition: 3.0.1(d3-selection@3.0.0) + + d3@7.9.0: + dependencies: + d3-array: 3.2.4 + d3-axis: 3.0.0 + d3-brush: 3.0.0 + d3-chord: 3.0.1 + d3-color: 3.1.0 + d3-contour: 4.0.2 + d3-delaunay: 6.0.4 + d3-dispatch: 3.0.1 + d3-drag: 3.0.0 + d3-dsv: 3.0.1 + d3-ease: 3.0.1 + d3-fetch: 3.0.1 + d3-force: 3.0.0 + d3-format: 3.1.0 + d3-geo: 3.1.1 + d3-hierarchy: 3.1.2 + d3-interpolate: 3.0.1 + d3-path: 3.1.0 + d3-polygon: 3.0.1 + d3-quadtree: 3.0.1 + d3-random: 3.0.1 + d3-scale: 4.0.2 + d3-scale-chromatic: 3.1.0 + d3-selection: 3.0.0 + d3-shape: 3.2.0 + d3-time: 3.1.0 + d3-time-format: 4.1.0 + d3-timer: 3.0.1 + d3-transition: 3.0.1(d3-selection@3.0.0) + d3-zoom: 3.0.0 + + dagre-d3-es@7.0.11: + dependencies: + d3: 7.9.0 + lodash-es: 4.17.21 + + dayjs@1.11.18: {} + + debug@4.4.1: + dependencies: + ms: 2.1.3 + + decode-named-character-reference@1.2.0: + dependencies: + character-entities: 2.0.2 + + defu@6.1.4: {} + + delaunator@5.0.1: + dependencies: + robust-predicates: 3.0.2 + + dequal@2.0.3: {} + + destr@2.0.5: {} + + detect-libc@2.0.4: {} + + deterministic-object-hash@2.0.2: + dependencies: + base-64: 1.0.0 + + devalue@5.3.2: {} + + devlop@1.1.0: + dependencies: + dequal: 2.0.3 + + dfa@1.2.0: {} + + diff@5.2.0: {} + + direction@2.0.1: {} + + dlv@1.1.3: {} + + dompurify@3.2.6: + optionalDependencies: + '@types/trusted-types': 2.0.7 + + dset@3.1.4: {} + + emoji-regex@10.5.0: {} + + emoji-regex@8.0.0: {} + + entities@4.5.0: {} + + entities@6.0.1: {} + + environment@1.1.0: {} + + es-module-lexer@1.7.0: {} + + esast-util-from-estree@2.0.0: + dependencies: + '@types/estree-jsx': 1.0.5 + devlop: 1.1.0 + estree-util-visit: 2.0.0 + unist-util-position-from-estree: 2.0.0 + + esast-util-from-js@2.0.1: + dependencies: + '@types/estree-jsx': 1.0.5 + acorn: 8.15.0 + esast-util-from-estree: 2.0.0 + vfile-message: 4.0.3 + + esbuild@0.25.9: + optionalDependencies: + '@esbuild/aix-ppc64': 0.25.9 + '@esbuild/android-arm': 0.25.9 + '@esbuild/android-arm64': 0.25.9 + '@esbuild/android-x64': 0.25.9 + '@esbuild/darwin-arm64': 0.25.9 + '@esbuild/darwin-x64': 0.25.9 + '@esbuild/freebsd-arm64': 0.25.9 + '@esbuild/freebsd-x64': 0.25.9 + '@esbuild/linux-arm': 0.25.9 + '@esbuild/linux-arm64': 0.25.9 + '@esbuild/linux-ia32': 0.25.9 + '@esbuild/linux-loong64': 0.25.9 + '@esbuild/linux-mips64el': 0.25.9 + '@esbuild/linux-ppc64': 0.25.9 + '@esbuild/linux-riscv64': 0.25.9 + '@esbuild/linux-s390x': 0.25.9 + '@esbuild/linux-x64': 0.25.9 + '@esbuild/netbsd-arm64': 0.25.9 + '@esbuild/netbsd-x64': 0.25.9 + '@esbuild/openbsd-arm64': 0.25.9 + '@esbuild/openbsd-x64': 0.25.9 + '@esbuild/openharmony-arm64': 0.25.9 + '@esbuild/sunos-x64': 0.25.9 + '@esbuild/win32-arm64': 0.25.9 + '@esbuild/win32-ia32': 0.25.9 + '@esbuild/win32-x64': 0.25.9 + + escape-string-regexp@5.0.0: {} + + estree-util-attach-comments@3.0.0: + dependencies: + '@types/estree': 1.0.8 + + estree-util-build-jsx@3.0.1: + dependencies: + '@types/estree-jsx': 1.0.5 + devlop: 1.1.0 + estree-util-is-identifier-name: 3.0.0 + estree-walker: 3.0.3 + + estree-util-is-identifier-name@3.0.0: {} + + estree-util-scope@1.0.0: + dependencies: + '@types/estree': 1.0.8 + devlop: 1.1.0 + + estree-util-to-js@2.0.0: + dependencies: + '@types/estree-jsx': 1.0.5 + astring: 1.9.0 + source-map: 0.7.6 + + estree-util-visit@2.0.0: + dependencies: + '@types/estree-jsx': 1.0.5 + '@types/unist': 3.0.3 + + estree-walker@2.0.2: {} + + estree-walker@3.0.3: + dependencies: + '@types/estree': 1.0.8 + + eventemitter3@5.0.1: {} + + expressive-code@0.41.3: + dependencies: + '@expressive-code/core': 0.41.3 + '@expressive-code/plugin-frames': 0.41.3 + '@expressive-code/plugin-shiki': 0.41.3 + '@expressive-code/plugin-text-markers': 0.41.3 + + exsolve@1.0.7: {} + + extend@3.0.2: {} + + fast-deep-equal@3.1.3: {} + + fdir@6.5.0(picomatch@4.0.3): + optionalDependencies: + picomatch: 4.0.3 + + flattie@1.1.1: {} + + fontace@0.3.0: + dependencies: + '@types/fontkit': 2.0.8 + fontkit: 2.0.4 + + fontkit@2.0.4: + dependencies: + '@swc/helpers': 0.5.17 + brotli: 1.3.3 + clone: 2.1.2 + dfa: 1.2.0 + fast-deep-equal: 3.1.3 + restructure: 3.0.2 + tiny-inflate: 1.0.3 + unicode-properties: 1.4.1 + unicode-trie: 2.0.0 + + fsevents@2.3.3: + optional: true + + get-east-asian-width@1.3.1: {} + + github-slugger@2.0.0: {} + + globals@15.15.0: {} + + h3@1.15.4: + dependencies: + cookie-es: 1.2.2 + crossws: 0.3.5 + defu: 6.1.4 + destr: 2.0.5 + iron-webcrypto: 1.2.1 + node-mock-http: 1.0.3 + radix3: 1.1.2 + ufo: 1.6.1 + uncrypto: 0.1.3 + + hachure-fill@0.5.2: {} + + has-flag@5.0.1: {} + + hast-util-embedded@3.0.0: + dependencies: + '@types/hast': 3.0.4 + hast-util-is-element: 3.0.0 + + hast-util-format@1.1.0: + dependencies: + '@types/hast': 3.0.4 + hast-util-embedded: 3.0.0 + hast-util-minify-whitespace: 1.0.1 + hast-util-phrasing: 3.0.1 + hast-util-whitespace: 3.0.0 + html-whitespace-sensitive-tag-names: 3.0.1 + unist-util-visit-parents: 6.0.1 + + hast-util-from-html@2.0.3: + dependencies: + '@types/hast': 3.0.4 + devlop: 1.1.0 + hast-util-from-parse5: 8.0.3 + parse5: 7.3.0 + vfile: 6.0.3 + vfile-message: 4.0.3 + + hast-util-from-parse5@8.0.3: + dependencies: + '@types/hast': 3.0.4 + '@types/unist': 3.0.3 + devlop: 1.1.0 + hastscript: 9.0.1 + property-information: 7.1.0 + vfile: 6.0.3 + vfile-location: 5.0.3 + web-namespaces: 2.0.1 + + hast-util-has-property@3.0.0: + dependencies: + '@types/hast': 3.0.4 + + hast-util-is-body-ok-link@3.0.1: + dependencies: + '@types/hast': 3.0.4 + + hast-util-is-element@3.0.0: + dependencies: + '@types/hast': 3.0.4 + + hast-util-minify-whitespace@1.0.1: + dependencies: + '@types/hast': 3.0.4 + hast-util-embedded: 3.0.0 + hast-util-is-element: 3.0.0 + hast-util-whitespace: 3.0.0 + unist-util-is: 6.0.0 + + hast-util-parse-selector@4.0.0: + dependencies: + '@types/hast': 3.0.4 + + hast-util-phrasing@3.0.1: + dependencies: + '@types/hast': 3.0.4 + hast-util-embedded: 3.0.0 + hast-util-has-property: 3.0.0 + hast-util-is-body-ok-link: 3.0.1 + hast-util-is-element: 3.0.0 + + hast-util-raw@9.1.0: + dependencies: + '@types/hast': 3.0.4 + '@types/unist': 3.0.3 + '@ungap/structured-clone': 1.3.0 + hast-util-from-parse5: 8.0.3 + hast-util-to-parse5: 8.0.0 + html-void-elements: 3.0.0 + mdast-util-to-hast: 13.2.0 + parse5: 7.3.0 + unist-util-position: 5.0.0 + unist-util-visit: 5.0.0 + vfile: 6.0.3 + web-namespaces: 2.0.1 + zwitch: 2.0.4 + + hast-util-select@6.0.4: + dependencies: + '@types/hast': 3.0.4 + '@types/unist': 3.0.3 + bcp-47-match: 2.0.3 + comma-separated-tokens: 2.0.3 + css-selector-parser: 3.1.3 + devlop: 1.1.0 + direction: 2.0.1 + hast-util-has-property: 3.0.0 + hast-util-to-string: 3.0.1 + hast-util-whitespace: 3.0.0 + nth-check: 2.1.1 + property-information: 7.1.0 + space-separated-tokens: 2.0.2 + unist-util-visit: 5.0.0 + zwitch: 2.0.4 + + hast-util-to-estree@3.1.3: + dependencies: + '@types/estree': 1.0.8 + '@types/estree-jsx': 1.0.5 + '@types/hast': 3.0.4 + comma-separated-tokens: 2.0.3 + devlop: 1.1.0 + estree-util-attach-comments: 3.0.0 + estree-util-is-identifier-name: 3.0.0 + hast-util-whitespace: 3.0.0 + mdast-util-mdx-expression: 2.0.1 + mdast-util-mdx-jsx: 3.2.0 + mdast-util-mdxjs-esm: 2.0.1 + property-information: 7.1.0 + space-separated-tokens: 2.0.2 + style-to-js: 1.1.17 + unist-util-position: 5.0.0 + zwitch: 2.0.4 + transitivePeerDependencies: + - supports-color + + hast-util-to-html@9.0.5: + dependencies: + '@types/hast': 3.0.4 + '@types/unist': 3.0.3 + ccount: 2.0.1 + comma-separated-tokens: 2.0.3 + hast-util-whitespace: 3.0.0 + html-void-elements: 3.0.0 + mdast-util-to-hast: 13.2.0 + property-information: 7.1.0 + space-separated-tokens: 2.0.2 + stringify-entities: 4.0.4 + zwitch: 2.0.4 + + hast-util-to-jsx-runtime@2.3.6: + dependencies: + '@types/estree': 1.0.8 + '@types/hast': 3.0.4 + '@types/unist': 3.0.3 + comma-separated-tokens: 2.0.3 + devlop: 1.1.0 + estree-util-is-identifier-name: 3.0.0 + hast-util-whitespace: 3.0.0 + mdast-util-mdx-expression: 2.0.1 + mdast-util-mdx-jsx: 3.2.0 + mdast-util-mdxjs-esm: 2.0.1 + property-information: 7.1.0 + space-separated-tokens: 2.0.2 + style-to-js: 1.1.17 + unist-util-position: 5.0.0 + vfile-message: 4.0.3 + transitivePeerDependencies: + - supports-color + + hast-util-to-parse5@8.0.0: + dependencies: + '@types/hast': 3.0.4 + comma-separated-tokens: 2.0.3 + devlop: 1.1.0 + property-information: 6.5.0 + space-separated-tokens: 2.0.2 + web-namespaces: 2.0.1 + zwitch: 2.0.4 + + hast-util-to-string@3.0.1: + dependencies: + '@types/hast': 3.0.4 + + hast-util-to-text@4.0.2: + dependencies: + '@types/hast': 3.0.4 + '@types/unist': 3.0.3 + hast-util-is-element: 3.0.0 + unist-util-find-after: 5.0.0 + + hast-util-whitespace@3.0.0: + dependencies: + '@types/hast': 3.0.4 + + hastscript@9.0.1: + dependencies: + '@types/hast': 3.0.4 + comma-separated-tokens: 2.0.3 + hast-util-parse-selector: 4.0.0 + property-information: 7.1.0 + space-separated-tokens: 2.0.2 + + html-escaper@3.0.3: {} + + html-void-elements@3.0.0: {} + + html-whitespace-sensitive-tag-names@3.0.1: {} + + http-cache-semantics@4.2.0: {} + + i18next@23.16.8: + dependencies: + '@babel/runtime': 7.28.3 + + iconv-lite@0.6.3: + dependencies: + safer-buffer: 2.1.2 + + import-meta-resolve@4.2.0: {} + + inline-style-parser@0.2.4: {} + + internmap@1.0.1: {} + + internmap@2.0.3: {} + + iron-webcrypto@1.2.1: {} + + is-absolute-url@4.0.1: {} + + is-alphabetical@2.0.1: {} + + is-alphanumerical@2.0.1: + dependencies: + is-alphabetical: 2.0.1 + is-decimal: 2.0.1 + + is-arrayish@0.3.2: {} + + is-decimal@2.0.1: {} + + is-docker@3.0.0: {} + + is-fullwidth-code-point@3.0.0: {} + + is-hexadecimal@2.0.1: {} + + is-inside-container@1.0.0: + dependencies: + is-docker: 3.0.0 + + is-plain-obj@4.1.0: {} + + is-wsl@3.1.0: + dependencies: + is-inside-container: 1.0.0 + + js-yaml@4.1.0: + dependencies: + argparse: 2.0.1 + + katex@0.16.22: + dependencies: + commander: 8.3.0 + + khroma@2.1.0: {} + + kleur@3.0.3: {} + + kleur@4.1.5: {} + + klona@2.0.6: {} + + kolorist@1.8.0: {} + + langium@3.3.1: + dependencies: + chevrotain: 11.0.3 + chevrotain-allstar: 0.3.1(chevrotain@11.0.3) + vscode-languageserver: 9.0.1 + vscode-languageserver-textdocument: 1.0.12 + vscode-uri: 3.0.8 + + layout-base@1.0.2: {} + + layout-base@2.0.1: {} + + local-pkg@1.1.2: + dependencies: + mlly: 1.8.0 + pkg-types: 2.3.0 + quansync: 0.2.11 + + lodash-es@4.17.21: {} + + longest-streak@3.1.0: {} + + lru-cache@10.4.3: {} + + magic-string@0.30.19: + dependencies: + '@jridgewell/sourcemap-codec': 1.5.5 + + magicast@0.3.5: + dependencies: + '@babel/parser': 7.28.4 + '@babel/types': 7.28.4 + source-map-js: 1.2.1 + + markdown-extensions@2.0.0: {} + + markdown-table@3.0.4: {} + + marked-footnote@1.4.0(marked@12.0.2): + dependencies: + marked: 12.0.2 + + marked-smartypants@1.1.10(marked@12.0.2): + dependencies: + marked: 12.0.2 + smartypants: 0.2.2 + + marked@12.0.2: {} + + marked@16.2.1: {} + + mdast-heading-id@2.0.0: {} + + mdast-util-definitions@6.0.0: + dependencies: + '@types/mdast': 4.0.4 + '@types/unist': 3.0.3 + unist-util-visit: 5.0.0 + + mdast-util-directive@3.1.0: + dependencies: + '@types/mdast': 4.0.4 + '@types/unist': 3.0.3 + ccount: 2.0.1 + devlop: 1.1.0 + mdast-util-from-markdown: 2.0.2 + mdast-util-to-markdown: 2.1.2 + parse-entities: 4.0.2 + stringify-entities: 4.0.4 + unist-util-visit-parents: 6.0.1 + transitivePeerDependencies: + - supports-color + + mdast-util-find-and-replace@3.0.2: + dependencies: + '@types/mdast': 4.0.4 + escape-string-regexp: 5.0.0 + unist-util-is: 6.0.0 + unist-util-visit-parents: 6.0.1 + + mdast-util-from-markdown@2.0.2: + dependencies: + '@types/mdast': 4.0.4 + '@types/unist': 3.0.3 + decode-named-character-reference: 1.2.0 + devlop: 1.1.0 + mdast-util-to-string: 4.0.0 + micromark: 4.0.2 + micromark-util-decode-numeric-character-reference: 2.0.2 + micromark-util-decode-string: 2.0.1 + micromark-util-normalize-identifier: 2.0.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + unist-util-stringify-position: 4.0.0 + transitivePeerDependencies: + - supports-color + + mdast-util-gfm-autolink-literal@2.0.1: + dependencies: + '@types/mdast': 4.0.4 + ccount: 2.0.1 + devlop: 1.1.0 + mdast-util-find-and-replace: 3.0.2 + micromark-util-character: 2.1.1 + + mdast-util-gfm-footnote@2.1.0: + dependencies: + '@types/mdast': 4.0.4 + devlop: 1.1.0 + mdast-util-from-markdown: 2.0.2 + mdast-util-to-markdown: 2.1.2 + micromark-util-normalize-identifier: 2.0.1 + transitivePeerDependencies: + - supports-color + + mdast-util-gfm-strikethrough@2.0.0: + dependencies: + '@types/mdast': 4.0.4 + mdast-util-from-markdown: 2.0.2 + mdast-util-to-markdown: 2.1.2 + transitivePeerDependencies: + - supports-color + + mdast-util-gfm-table@2.0.0: + dependencies: + '@types/mdast': 4.0.4 + devlop: 1.1.0 + markdown-table: 3.0.4 + mdast-util-from-markdown: 2.0.2 + mdast-util-to-markdown: 2.1.2 + transitivePeerDependencies: + - supports-color + + mdast-util-gfm-task-list-item@2.0.0: + dependencies: + '@types/mdast': 4.0.4 + devlop: 1.1.0 + mdast-util-from-markdown: 2.0.2 + mdast-util-to-markdown: 2.1.2 + transitivePeerDependencies: + - supports-color + + mdast-util-gfm@3.1.0: + dependencies: + mdast-util-from-markdown: 2.0.2 + mdast-util-gfm-autolink-literal: 2.0.1 + mdast-util-gfm-footnote: 2.1.0 + mdast-util-gfm-strikethrough: 2.0.0 + mdast-util-gfm-table: 2.0.0 + mdast-util-gfm-task-list-item: 2.0.0 + mdast-util-to-markdown: 2.1.2 + transitivePeerDependencies: + - supports-color + + mdast-util-mdx-expression@2.0.1: + dependencies: + '@types/estree-jsx': 1.0.5 + '@types/hast': 3.0.4 + '@types/mdast': 4.0.4 + devlop: 1.1.0 + mdast-util-from-markdown: 2.0.2 + mdast-util-to-markdown: 2.1.2 + transitivePeerDependencies: + - supports-color + + mdast-util-mdx-jsx@3.2.0: + dependencies: + '@types/estree-jsx': 1.0.5 + '@types/hast': 3.0.4 + '@types/mdast': 4.0.4 + '@types/unist': 3.0.3 + ccount: 2.0.1 + devlop: 1.1.0 + mdast-util-from-markdown: 2.0.2 + mdast-util-to-markdown: 2.1.2 + parse-entities: 4.0.2 + stringify-entities: 4.0.4 + unist-util-stringify-position: 4.0.0 + vfile-message: 4.0.3 + transitivePeerDependencies: + - supports-color + + mdast-util-mdx@3.0.0: + dependencies: + mdast-util-from-markdown: 2.0.2 + mdast-util-mdx-expression: 2.0.1 + mdast-util-mdx-jsx: 3.2.0 + mdast-util-mdxjs-esm: 2.0.1 + mdast-util-to-markdown: 2.1.2 + transitivePeerDependencies: + - supports-color + + mdast-util-mdxjs-esm@2.0.1: + dependencies: + '@types/estree-jsx': 1.0.5 + '@types/hast': 3.0.4 + '@types/mdast': 4.0.4 + devlop: 1.1.0 + mdast-util-from-markdown: 2.0.2 + mdast-util-to-markdown: 2.1.2 + transitivePeerDependencies: + - supports-color + + mdast-util-phrasing@4.1.0: + dependencies: + '@types/mdast': 4.0.4 + unist-util-is: 6.0.0 + + mdast-util-to-hast@13.2.0: + dependencies: + '@types/hast': 3.0.4 + '@types/mdast': 4.0.4 + '@ungap/structured-clone': 1.3.0 + devlop: 1.1.0 + micromark-util-sanitize-uri: 2.0.1 + trim-lines: 3.0.1 + unist-util-position: 5.0.0 + unist-util-visit: 5.0.0 + vfile: 6.0.3 + + mdast-util-to-markdown@2.1.2: + dependencies: + '@types/mdast': 4.0.4 + '@types/unist': 3.0.3 + longest-streak: 3.1.0 + mdast-util-phrasing: 4.1.0 + mdast-util-to-string: 4.0.0 + micromark-util-classify-character: 2.0.1 + micromark-util-decode-string: 2.0.1 + unist-util-visit: 5.0.0 + zwitch: 2.0.4 + + mdast-util-to-string@4.0.0: + dependencies: + '@types/mdast': 4.0.4 + + mdn-data@2.12.2: {} + + mermaid@11.10.1: + dependencies: + '@braintree/sanitize-url': 7.1.1 + '@iconify/utils': 2.3.0 + '@mermaid-js/parser': 0.6.2 + '@types/d3': 7.4.3 + cytoscape: 3.33.1 + cytoscape-cose-bilkent: 4.1.0(cytoscape@3.33.1) + cytoscape-fcose: 2.2.0(cytoscape@3.33.1) + d3: 7.9.0 + d3-sankey: 0.12.3 + dagre-d3-es: 7.0.11 + dayjs: 1.11.18 + dompurify: 3.2.6 + katex: 0.16.22 + khroma: 2.1.0 + lodash-es: 4.17.21 + marked: 16.2.1 + roughjs: 4.6.6 + stylis: 4.3.6 + ts-dedent: 2.2.0 + uuid: 11.1.0 + transitivePeerDependencies: + - supports-color + + micromark-core-commonmark@2.0.3: + dependencies: + decode-named-character-reference: 1.2.0 + devlop: 1.1.0 + micromark-factory-destination: 2.0.1 + micromark-factory-label: 2.0.1 + micromark-factory-space: 2.0.1 + micromark-factory-title: 2.0.1 + micromark-factory-whitespace: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-chunked: 2.0.1 + micromark-util-classify-character: 2.0.1 + micromark-util-html-tag-name: 2.0.1 + micromark-util-normalize-identifier: 2.0.1 + micromark-util-resolve-all: 2.0.1 + micromark-util-subtokenize: 2.1.0 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-extension-directive@3.0.2: + dependencies: + devlop: 1.1.0 + micromark-factory-space: 2.0.1 + micromark-factory-whitespace: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + parse-entities: 4.0.2 + + micromark-extension-gfm-autolink-literal@2.1.0: + dependencies: + micromark-util-character: 2.1.1 + micromark-util-sanitize-uri: 2.0.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-extension-gfm-footnote@2.1.0: + dependencies: + devlop: 1.1.0 + micromark-core-commonmark: 2.0.3 + micromark-factory-space: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-normalize-identifier: 2.0.1 + micromark-util-sanitize-uri: 2.0.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-extension-gfm-strikethrough@2.1.0: + dependencies: + devlop: 1.1.0 + micromark-util-chunked: 2.0.1 + micromark-util-classify-character: 2.0.1 + micromark-util-resolve-all: 2.0.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-extension-gfm-table@2.1.1: + dependencies: + devlop: 1.1.0 + micromark-factory-space: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-extension-gfm-tagfilter@2.0.0: + dependencies: + micromark-util-types: 2.0.2 + + micromark-extension-gfm-task-list-item@2.1.0: + dependencies: + devlop: 1.1.0 + micromark-factory-space: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-extension-gfm@3.0.0: + dependencies: + micromark-extension-gfm-autolink-literal: 2.1.0 + micromark-extension-gfm-footnote: 2.1.0 + micromark-extension-gfm-strikethrough: 2.1.0 + micromark-extension-gfm-table: 2.1.1 + micromark-extension-gfm-tagfilter: 2.0.0 + micromark-extension-gfm-task-list-item: 2.1.0 + micromark-util-combine-extensions: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-extension-mdx-expression@3.0.1: + dependencies: + '@types/estree': 1.0.8 + devlop: 1.1.0 + micromark-factory-mdx-expression: 2.0.3 + micromark-factory-space: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-events-to-acorn: 2.0.3 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-extension-mdx-jsx@3.0.2: + dependencies: + '@types/estree': 1.0.8 + devlop: 1.1.0 + estree-util-is-identifier-name: 3.0.0 + micromark-factory-mdx-expression: 2.0.3 + micromark-factory-space: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-events-to-acorn: 2.0.3 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + vfile-message: 4.0.3 + + micromark-extension-mdx-md@2.0.0: + dependencies: + micromark-util-types: 2.0.2 + + micromark-extension-mdxjs-esm@3.0.0: + dependencies: + '@types/estree': 1.0.8 + devlop: 1.1.0 + micromark-core-commonmark: 2.0.3 + micromark-util-character: 2.1.1 + micromark-util-events-to-acorn: 2.0.3 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + unist-util-position-from-estree: 2.0.0 + vfile-message: 4.0.3 + + micromark-extension-mdxjs@3.0.0: + dependencies: + acorn: 8.15.0 + acorn-jsx: 5.3.2(acorn@8.15.0) + micromark-extension-mdx-expression: 3.0.1 + micromark-extension-mdx-jsx: 3.0.2 + micromark-extension-mdx-md: 2.0.0 + micromark-extension-mdxjs-esm: 3.0.0 + micromark-util-combine-extensions: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-factory-destination@2.0.1: + dependencies: + micromark-util-character: 2.1.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-factory-label@2.0.1: + dependencies: + devlop: 1.1.0 + micromark-util-character: 2.1.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-factory-mdx-expression@2.0.3: + dependencies: + '@types/estree': 1.0.8 + devlop: 1.1.0 + micromark-factory-space: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-events-to-acorn: 2.0.3 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + unist-util-position-from-estree: 2.0.0 + vfile-message: 4.0.3 + + micromark-factory-space@2.0.1: + dependencies: + micromark-util-character: 2.1.1 + micromark-util-types: 2.0.2 + + micromark-factory-title@2.0.1: + dependencies: + micromark-factory-space: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-factory-whitespace@2.0.1: + dependencies: + micromark-factory-space: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-heading-id@2.0.0: + dependencies: + micromark-util-symbol: 2.0.1 + + micromark-util-character@2.1.1: + dependencies: + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-util-chunked@2.0.1: + dependencies: + micromark-util-symbol: 2.0.1 + + micromark-util-classify-character@2.0.1: + dependencies: + micromark-util-character: 2.1.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-util-combine-extensions@2.0.1: + dependencies: + micromark-util-chunked: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-util-decode-numeric-character-reference@2.0.2: + dependencies: + micromark-util-symbol: 2.0.1 + + micromark-util-decode-string@2.0.1: + dependencies: + decode-named-character-reference: 1.2.0 + micromark-util-character: 2.1.1 + micromark-util-decode-numeric-character-reference: 2.0.2 + micromark-util-symbol: 2.0.1 + + micromark-util-encode@2.0.1: {} + + micromark-util-events-to-acorn@2.0.3: + dependencies: + '@types/estree': 1.0.8 + '@types/unist': 3.0.3 + devlop: 1.1.0 + estree-util-visit: 2.0.0 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + vfile-message: 4.0.3 + + micromark-util-html-tag-name@2.0.1: {} + + micromark-util-normalize-identifier@2.0.1: + dependencies: + micromark-util-symbol: 2.0.1 + + micromark-util-resolve-all@2.0.1: + dependencies: + micromark-util-types: 2.0.2 + + micromark-util-sanitize-uri@2.0.1: + dependencies: + micromark-util-character: 2.1.1 + micromark-util-encode: 2.0.1 + micromark-util-symbol: 2.0.1 + + micromark-util-subtokenize@2.1.0: + dependencies: + devlop: 1.1.0 + micromark-util-chunked: 2.0.1 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + + micromark-util-symbol@2.0.1: {} + + micromark-util-types@2.0.2: {} + + micromark@4.0.2: + dependencies: + '@types/debug': 4.1.12 + debug: 4.4.1 + decode-named-character-reference: 1.2.0 + devlop: 1.1.0 + micromark-core-commonmark: 2.0.3 + micromark-factory-space: 2.0.1 + micromark-util-character: 2.1.1 + micromark-util-chunked: 2.0.1 + micromark-util-combine-extensions: 2.0.1 + micromark-util-decode-numeric-character-reference: 2.0.2 + micromark-util-encode: 2.0.1 + micromark-util-normalize-identifier: 2.0.1 + micromark-util-resolve-all: 2.0.1 + micromark-util-sanitize-uri: 2.0.1 + micromark-util-subtokenize: 2.1.0 + micromark-util-symbol: 2.0.1 + micromark-util-types: 2.0.2 + transitivePeerDependencies: + - supports-color + + mlly@1.8.0: + dependencies: + acorn: 8.15.0 + pathe: 2.0.3 + pkg-types: 1.3.1 + ufo: 1.6.1 + + mrmime@2.0.1: {} + + ms@2.1.3: {} + + nanoid@3.3.11: {} + + neotraverse@0.6.18: {} + + nlcst-to-string@4.0.0: + dependencies: + '@types/nlcst': 2.0.3 + + node-fetch-native@1.6.7: {} + + node-fetch@2.7.0: + dependencies: + whatwg-url: 5.0.0 + + node-mock-http@1.0.3: {} + + normalize-path@3.0.0: {} + + nth-check@2.1.1: + dependencies: + boolbase: 1.0.0 + + ofetch@1.4.1: + dependencies: + destr: 2.0.5 + node-fetch-native: 1.6.7 + ufo: 1.6.1 + + ohash@2.0.11: {} + + oniguruma-parser@0.12.1: {} + + oniguruma-to-es@4.3.3: + dependencies: + oniguruma-parser: 0.12.1 + regex: 6.0.1 + regex-recursion: 6.0.2 + + p-limit@6.2.0: + dependencies: + yocto-queue: 1.2.1 + + p-queue@8.1.1: + dependencies: + eventemitter3: 5.0.1 + p-timeout: 6.1.4 + + p-timeout@6.1.4: {} + + package-manager-detector@1.3.0: {} + + pagefind@1.3.0: + optionalDependencies: + '@pagefind/darwin-arm64': 1.3.0 + '@pagefind/darwin-x64': 1.3.0 + '@pagefind/linux-arm64': 1.3.0 + '@pagefind/linux-x64': 1.3.0 + '@pagefind/windows-x64': 1.3.0 + + pako@0.2.9: {} + + parse-entities@4.0.2: + dependencies: + '@types/unist': 2.0.11 + character-entities-legacy: 3.0.0 + character-reference-invalid: 2.0.1 + decode-named-character-reference: 1.2.0 + is-alphanumerical: 2.0.1 + is-decimal: 2.0.1 + is-hexadecimal: 2.0.1 + + parse-latin@7.0.0: + dependencies: + '@types/nlcst': 2.0.3 + '@types/unist': 3.0.3 + nlcst-to-string: 4.0.0 + unist-util-modify-children: 4.0.0 + unist-util-visit-children: 3.0.0 + vfile: 6.0.3 + + parse5@7.3.0: + dependencies: + entities: 6.0.1 + + path-data-parser@0.1.0: {} + + pathe@2.0.3: {} + + picocolors@1.1.1: {} + + picomatch@2.3.1: {} + + picomatch@4.0.3: {} + + pkg-types@1.3.1: + dependencies: + confbox: 0.1.8 + mlly: 1.8.0 + pathe: 2.0.3 + + pkg-types@2.3.0: + dependencies: + confbox: 0.2.2 + exsolve: 1.0.7 + pathe: 2.0.3 + + points-on-curve@0.2.0: {} + + points-on-path@0.2.1: + dependencies: + path-data-parser: 0.1.0 + points-on-curve: 0.2.0 + + postcss-nested@6.2.0(postcss@8.5.6): + dependencies: + postcss: 8.5.6 + postcss-selector-parser: 6.1.2 + + postcss-selector-parser@6.1.2: + dependencies: + cssesc: 3.0.0 + util-deprecate: 1.0.2 + + postcss@8.5.6: + dependencies: + nanoid: 3.3.11 + picocolors: 1.1.1 + source-map-js: 1.2.1 + + prismjs@1.30.0: {} + + prompts@2.4.2: + dependencies: + kleur: 3.0.3 + sisteransi: 1.0.5 + + property-information@6.5.0: {} + + property-information@7.1.0: {} + + quansync@0.2.11: {} + + radix3@1.1.2: {} + + readdirp@4.1.2: {} + + recma-build-jsx@1.0.0: + dependencies: + '@types/estree': 1.0.8 + estree-util-build-jsx: 3.0.1 + vfile: 6.0.3 + + recma-jsx@1.0.1(acorn@8.15.0): + dependencies: + acorn: 8.15.0 + acorn-jsx: 5.3.2(acorn@8.15.0) + estree-util-to-js: 2.0.0 + recma-parse: 1.0.0 + recma-stringify: 1.0.0 + unified: 11.0.5 + + recma-parse@1.0.0: + dependencies: + '@types/estree': 1.0.8 + esast-util-from-js: 2.0.1 + unified: 11.0.5 + vfile: 6.0.3 + + recma-stringify@1.0.0: + dependencies: + '@types/estree': 1.0.8 + estree-util-to-js: 2.0.0 + unified: 11.0.5 + vfile: 6.0.3 + + regex-recursion@6.0.2: + dependencies: + regex-utilities: 2.3.0 + + regex-utilities@2.3.0: {} + + regex@6.0.1: + dependencies: + regex-utilities: 2.3.0 + + rehype-expressive-code@0.41.3: + dependencies: + expressive-code: 0.41.3 + + rehype-format@5.0.1: + dependencies: + '@types/hast': 3.0.4 + hast-util-format: 1.1.0 + + rehype-parse@9.0.1: + dependencies: + '@types/hast': 3.0.4 + hast-util-from-html: 2.0.3 + unified: 11.0.5 + + rehype-raw@7.0.0: + dependencies: + '@types/hast': 3.0.4 + hast-util-raw: 9.1.0 + vfile: 6.0.3 + + rehype-recma@1.0.0: + dependencies: + '@types/estree': 1.0.8 + '@types/hast': 3.0.4 + hast-util-to-estree: 3.1.3 + transitivePeerDependencies: + - supports-color + + rehype-stringify@10.0.1: + dependencies: + '@types/hast': 3.0.4 + hast-util-to-html: 9.0.5 + unified: 11.0.5 + + rehype@13.0.2: + dependencies: + '@types/hast': 3.0.4 + rehype-parse: 9.0.1 + rehype-stringify: 10.0.1 + unified: 11.0.5 + + remark-custom-heading-id@2.0.0: + dependencies: + mdast-heading-id: 2.0.0 + micromark-heading-id: 2.0.0 + unist-util-visit: 5.0.0 + + remark-directive@3.0.1: + dependencies: + '@types/mdast': 4.0.4 + mdast-util-directive: 3.1.0 + micromark-extension-directive: 3.0.2 + unified: 11.0.5 + transitivePeerDependencies: + - supports-color + + remark-gfm@4.0.1: + dependencies: + '@types/mdast': 4.0.4 + mdast-util-gfm: 3.1.0 + micromark-extension-gfm: 3.0.0 + remark-parse: 11.0.0 + remark-stringify: 11.0.0 + unified: 11.0.5 + transitivePeerDependencies: + - supports-color + + remark-mdx@3.1.0: + dependencies: + mdast-util-mdx: 3.0.0 + micromark-extension-mdxjs: 3.0.0 + transitivePeerDependencies: + - supports-color + + remark-parse@11.0.0: + dependencies: + '@types/mdast': 4.0.4 + mdast-util-from-markdown: 2.0.2 + micromark-util-types: 2.0.2 + unified: 11.0.5 + transitivePeerDependencies: + - supports-color + + remark-rehype@11.1.2: + dependencies: + '@types/hast': 3.0.4 + '@types/mdast': 4.0.4 + mdast-util-to-hast: 13.2.0 + unified: 11.0.5 + vfile: 6.0.3 + + remark-smartypants@3.0.2: + dependencies: + retext: 9.0.0 + retext-smartypants: 6.2.0 + unified: 11.0.5 + unist-util-visit: 5.0.0 + + remark-stringify@11.0.0: + dependencies: + '@types/mdast': 4.0.4 + mdast-util-to-markdown: 2.1.2 + unified: 11.0.5 + + restructure@3.0.2: {} + + retext-latin@4.0.0: + dependencies: + '@types/nlcst': 2.0.3 + parse-latin: 7.0.0 + unified: 11.0.5 + + retext-smartypants@6.2.0: + dependencies: + '@types/nlcst': 2.0.3 + nlcst-to-string: 4.0.0 + unist-util-visit: 5.0.0 + + retext-stringify@4.0.0: + dependencies: + '@types/nlcst': 2.0.3 + nlcst-to-string: 4.0.0 + unified: 11.0.5 + + retext@9.0.0: + dependencies: + '@types/nlcst': 2.0.3 + retext-latin: 4.0.0 + retext-stringify: 4.0.0 + unified: 11.0.5 + + robust-predicates@3.0.2: {} + + rollup@4.50.1: + dependencies: + '@types/estree': 1.0.8 + optionalDependencies: + '@rollup/rollup-android-arm-eabi': 4.50.1 + '@rollup/rollup-android-arm64': 4.50.1 + '@rollup/rollup-darwin-arm64': 4.50.1 + '@rollup/rollup-darwin-x64': 4.50.1 + '@rollup/rollup-freebsd-arm64': 4.50.1 + '@rollup/rollup-freebsd-x64': 4.50.1 + '@rollup/rollup-linux-arm-gnueabihf': 4.50.1 + '@rollup/rollup-linux-arm-musleabihf': 4.50.1 + '@rollup/rollup-linux-arm64-gnu': 4.50.1 + '@rollup/rollup-linux-arm64-musl': 4.50.1 + '@rollup/rollup-linux-loongarch64-gnu': 4.50.1 + '@rollup/rollup-linux-ppc64-gnu': 4.50.1 + '@rollup/rollup-linux-riscv64-gnu': 4.50.1 + '@rollup/rollup-linux-riscv64-musl': 4.50.1 + '@rollup/rollup-linux-s390x-gnu': 4.50.1 + '@rollup/rollup-linux-x64-gnu': 4.50.1 + '@rollup/rollup-linux-x64-musl': 4.50.1 + '@rollup/rollup-openharmony-arm64': 4.50.1 + '@rollup/rollup-win32-arm64-msvc': 4.50.1 + '@rollup/rollup-win32-ia32-msvc': 4.50.1 + '@rollup/rollup-win32-x64-msvc': 4.50.1 + fsevents: 2.3.3 + + roughjs@4.6.6: + dependencies: + hachure-fill: 0.5.2 + path-data-parser: 0.1.0 + points-on-curve: 0.2.0 + points-on-path: 0.2.1 + + rw@1.3.3: {} + + safer-buffer@2.1.2: {} + + sax@1.4.1: {} + + semver@7.7.2: {} + + sharp@0.33.5: + dependencies: + color: 4.2.3 + detect-libc: 2.0.4 + semver: 7.7.2 + optionalDependencies: + '@img/sharp-darwin-arm64': 0.33.5 + '@img/sharp-darwin-x64': 0.33.5 + '@img/sharp-libvips-darwin-arm64': 1.0.4 + '@img/sharp-libvips-darwin-x64': 1.0.4 + '@img/sharp-libvips-linux-arm': 1.0.5 + '@img/sharp-libvips-linux-arm64': 1.0.4 + '@img/sharp-libvips-linux-s390x': 1.0.4 + '@img/sharp-libvips-linux-x64': 1.0.4 + '@img/sharp-libvips-linuxmusl-arm64': 1.0.4 + '@img/sharp-libvips-linuxmusl-x64': 1.0.4 + '@img/sharp-linux-arm': 0.33.5 + '@img/sharp-linux-arm64': 0.33.5 + '@img/sharp-linux-s390x': 0.33.5 + '@img/sharp-linux-x64': 0.33.5 + '@img/sharp-linuxmusl-arm64': 0.33.5 + '@img/sharp-linuxmusl-x64': 0.33.5 + '@img/sharp-wasm32': 0.33.5 + '@img/sharp-win32-ia32': 0.33.5 + '@img/sharp-win32-x64': 0.33.5 + optional: true + + sharp@0.34.3: + dependencies: + color: 4.2.3 + detect-libc: 2.0.4 + semver: 7.7.2 + optionalDependencies: + '@img/sharp-darwin-arm64': 0.34.3 + '@img/sharp-darwin-x64': 0.34.3 + '@img/sharp-libvips-darwin-arm64': 1.2.0 + '@img/sharp-libvips-darwin-x64': 1.2.0 + '@img/sharp-libvips-linux-arm': 1.2.0 + '@img/sharp-libvips-linux-arm64': 1.2.0 + '@img/sharp-libvips-linux-ppc64': 1.2.0 + '@img/sharp-libvips-linux-s390x': 1.2.0 + '@img/sharp-libvips-linux-x64': 1.2.0 + '@img/sharp-libvips-linuxmusl-arm64': 1.2.0 + '@img/sharp-libvips-linuxmusl-x64': 1.2.0 + '@img/sharp-linux-arm': 0.34.3 + '@img/sharp-linux-arm64': 0.34.3 + '@img/sharp-linux-ppc64': 0.34.3 + '@img/sharp-linux-s390x': 0.34.3 + '@img/sharp-linux-x64': 0.34.3 + '@img/sharp-linuxmusl-arm64': 0.34.3 + '@img/sharp-linuxmusl-x64': 0.34.3 + '@img/sharp-wasm32': 0.34.3 + '@img/sharp-win32-arm64': 0.34.3 + '@img/sharp-win32-ia32': 0.34.3 + '@img/sharp-win32-x64': 0.34.3 + + shiki@3.12.2: + dependencies: + '@shikijs/core': 3.12.2 + '@shikijs/engine-javascript': 3.12.2 + '@shikijs/engine-oniguruma': 3.12.2 + '@shikijs/langs': 3.12.2 + '@shikijs/themes': 3.12.2 + '@shikijs/types': 3.12.2 + '@shikijs/vscode-textmate': 10.0.2 + '@types/hast': 3.0.4 + + simple-swizzle@0.2.2: + dependencies: + is-arrayish: 0.3.2 + + sisteransi@1.0.5: {} + + sitemap@8.0.0: + dependencies: + '@types/node': 17.0.45 + '@types/sax': 1.2.7 + arg: 5.0.2 + sax: 1.4.1 + + smartypants@0.2.2: {} + + smol-toml@1.4.2: {} + + source-map-js@1.2.1: {} + + source-map@0.7.6: {} + + space-separated-tokens@2.0.2: {} + + starlight-auto-sidebar@0.2.0(@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))): + dependencies: + '@astrojs/starlight': 0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)) + github-slugger: 2.0.0 + + starlight-github-alerts@0.1.0(@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))): + dependencies: + '@astrojs/starlight': 0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)) + unist-util-visit: 5.0.0 + + starlight-image-zoom@0.13.0(@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))): + dependencies: + '@astrojs/starlight': 0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)) + mdast-util-mdx-jsx: 3.2.0 + rehype-raw: 7.0.0 + unist-util-visit: 5.0.0 + unist-util-visit-parents: 6.0.1 + transitivePeerDependencies: + - supports-color + + starlight-links-validator@0.18.0(@astrojs/starlight@0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1))): + dependencies: + '@astrojs/starlight': 0.35.2(astro@5.13.6(@types/node@24.3.1)(rollup@4.50.1)(typescript@5.9.2)(yaml@2.8.1)) + '@types/picomatch': 3.0.2 + github-slugger: 2.0.0 + hast-util-from-html: 2.0.3 + hast-util-has-property: 3.0.0 + is-absolute-url: 4.0.1 + kleur: 4.1.5 + mdast-util-mdx-jsx: 3.2.0 + mdast-util-to-string: 4.0.0 + picomatch: 4.0.3 + terminal-link: 5.0.0 + unist-util-visit: 5.0.0 + transitivePeerDependencies: + - supports-color + + stream-replace-string@2.0.0: {} + + string-width@4.2.3: + dependencies: + emoji-regex: 8.0.0 + is-fullwidth-code-point: 3.0.0 + strip-ansi: 6.0.1 + + string-width@7.2.0: + dependencies: + emoji-regex: 10.5.0 + get-east-asian-width: 1.3.1 + strip-ansi: 7.1.2 + + stringify-entities@4.0.4: + dependencies: + character-entities-html4: 2.1.0 + character-entities-legacy: 3.0.0 + + strip-ansi@6.0.1: + dependencies: + ansi-regex: 5.0.1 + + strip-ansi@7.1.2: + dependencies: + ansi-regex: 6.2.2 + + style-to-js@1.1.17: + dependencies: + style-to-object: 1.0.9 + + style-to-object@1.0.9: + dependencies: + inline-style-parser: 0.2.4 + + stylis@4.3.6: {} + + supports-color@10.2.2: {} + + supports-hyperlinks@4.2.0: + dependencies: + has-flag: 5.0.1 + supports-color: 10.2.2 + + terminal-link@5.0.0: + dependencies: + ansi-escapes: 7.1.0 + supports-hyperlinks: 4.2.0 + + tiny-inflate@1.0.3: {} + + tinyexec@0.3.2: {} + + tinyexec@1.0.1: {} + + tinyglobby@0.2.15: + dependencies: + fdir: 6.5.0(picomatch@4.0.3) + picomatch: 4.0.3 + + tr46@0.0.3: {} + + trim-lines@3.0.1: {} + + trough@2.2.0: {} + + ts-dedent@2.2.0: {} + + tsconfck@3.1.6(typescript@5.9.2): + optionalDependencies: + typescript: 5.9.2 + + tslib@2.8.1: {} + + type-fest@4.41.0: {} + + typescript@5.9.2: {} + + ufo@1.6.1: {} + + ultrahtml@1.6.0: {} + + uncrypto@0.1.3: {} + + undici-types@7.10.0: {} + + unicode-properties@1.4.1: + dependencies: + base64-js: 1.5.1 + unicode-trie: 2.0.0 + + unicode-trie@2.0.0: + dependencies: + pako: 0.2.9 + tiny-inflate: 1.0.3 + + unified@11.0.5: + dependencies: + '@types/unist': 3.0.3 + bail: 2.0.2 + devlop: 1.1.0 + extend: 3.0.2 + is-plain-obj: 4.1.0 + trough: 2.2.0 + vfile: 6.0.3 + + unifont@0.5.2: + dependencies: + css-tree: 3.1.0 + ofetch: 1.4.1 + ohash: 2.0.11 + + unist-util-find-after@5.0.0: + dependencies: + '@types/unist': 3.0.3 + unist-util-is: 6.0.0 + + unist-util-is@6.0.0: + dependencies: + '@types/unist': 3.0.3 + + unist-util-modify-children@4.0.0: + dependencies: + '@types/unist': 3.0.3 + array-iterate: 2.0.1 + + unist-util-position-from-estree@2.0.0: + dependencies: + '@types/unist': 3.0.3 + + unist-util-position@5.0.0: + dependencies: + '@types/unist': 3.0.3 + + unist-util-remove-position@5.0.0: + dependencies: + '@types/unist': 3.0.3 + unist-util-visit: 5.0.0 + + unist-util-stringify-position@4.0.0: + dependencies: + '@types/unist': 3.0.3 + + unist-util-visit-children@3.0.0: + dependencies: + '@types/unist': 3.0.3 + + unist-util-visit-parents@6.0.1: + dependencies: + '@types/unist': 3.0.3 + unist-util-is: 6.0.0 + + unist-util-visit@5.0.0: + dependencies: + '@types/unist': 3.0.3 + unist-util-is: 6.0.0 + unist-util-visit-parents: 6.0.1 + + unstorage@1.17.1: + dependencies: + anymatch: 3.1.3 + chokidar: 4.0.3 + destr: 2.0.5 + h3: 1.15.4 + lru-cache: 10.4.3 + node-fetch-native: 1.6.7 + ofetch: 1.4.1 + ufo: 1.6.1 + + util-deprecate@1.0.2: {} + + uuid@11.1.0: {} + + vfile-location@5.0.3: + dependencies: + '@types/unist': 3.0.3 + vfile: 6.0.3 + + vfile-message@4.0.3: + dependencies: + '@types/unist': 3.0.3 + unist-util-stringify-position: 4.0.0 + + vfile@6.0.3: + dependencies: + '@types/unist': 3.0.3 + vfile-message: 4.0.3 + + vite@6.3.6(@types/node@24.3.1)(yaml@2.8.1): + dependencies: + esbuild: 0.25.9 + fdir: 6.5.0(picomatch@4.0.3) + picomatch: 4.0.3 + postcss: 8.5.6 + rollup: 4.50.1 + tinyglobby: 0.2.15 + optionalDependencies: + '@types/node': 24.3.1 + fsevents: 2.3.3 + yaml: 2.8.1 + + vitefu@1.1.1(vite@6.3.6(@types/node@24.3.1)(yaml@2.8.1)): + optionalDependencies: + vite: 6.3.6(@types/node@24.3.1)(yaml@2.8.1) + + vscode-jsonrpc@8.2.0: {} + + vscode-languageserver-protocol@3.17.5: + dependencies: + vscode-jsonrpc: 8.2.0 + vscode-languageserver-types: 3.17.5 + + vscode-languageserver-textdocument@1.0.12: {} + + vscode-languageserver-types@3.17.5: {} + + vscode-languageserver@9.0.1: + dependencies: + vscode-languageserver-protocol: 3.17.5 + + vscode-uri@3.0.8: {} + + web-namespaces@2.0.1: {} + + webidl-conversions@3.0.1: {} + + whatwg-url@5.0.0: + dependencies: + tr46: 0.0.3 + webidl-conversions: 3.0.1 + + which-pm-runs@1.1.0: {} + + widest-line@5.0.0: + dependencies: + string-width: 7.2.0 + + wrap-ansi@9.0.2: + dependencies: + ansi-styles: 6.2.3 + string-width: 7.2.0 + strip-ansi: 7.1.2 + + xxhash-wasm@1.1.0: {} + + yaml@2.8.1: {} + + yargs-parser@21.1.1: {} + + yocto-queue@1.2.1: {} + + yocto-spinner@0.2.3: + dependencies: + yoctocolors: 2.1.2 + + yoctocolors@2.1.2: {} + + zod-to-json-schema@3.24.6(zod@3.25.76): + dependencies: + zod: 3.25.76 + + zod-to-ts@1.2.0(typescript@5.9.2)(zod@3.25.76): + dependencies: + typescript: 5.9.2 + zod: 3.25.76 + + zod@3.25.76: {} + + zwitch@2.0.4: {} diff --git a/docs/pnpm-workspace.yaml b/docs/pnpm-workspace.yaml new file mode 100644 index 0000000000..d0b7dbe229 --- /dev/null +++ b/docs/pnpm-workspace.yaml @@ -0,0 +1,3 @@ +onlyBuiltDependencies: + - esbuild + - sharp diff --git a/docs/public/CNAME b/docs/public/CNAME new file mode 100644 index 0000000000..3fc4112a95 --- /dev/null +++ b/docs/public/CNAME @@ -0,0 +1 @@ +userstyles.catppuccin.com \ No newline at end of file diff --git a/docs/public/favicon.png b/docs/public/favicon.png new file mode 100644 index 0000000000..4491430bb8 Binary files /dev/null and b/docs/public/favicon.png differ diff --git a/docs/public/lib b/docs/public/lib new file mode 120000 index 0000000000..58677ddb4e --- /dev/null +++ b/docs/public/lib @@ -0,0 +1 @@ +../../lib \ No newline at end of file diff --git a/docs/public/pepperjack-dark.png b/docs/public/pepperjack-dark.png new file mode 100644 index 0000000000..7d29e39669 Binary files /dev/null and b/docs/public/pepperjack-dark.png differ diff --git a/docs/public/pepperjack-light.png b/docs/public/pepperjack-light.png new file mode 100644 index 0000000000..13086e386a Binary files /dev/null and b/docs/public/pepperjack-light.png differ diff --git a/docs/src/assets/example.org-original.webp b/docs/src/assets/example.org-original.webp new file mode 100644 index 0000000000..0488779750 Binary files /dev/null and b/docs/src/assets/example.org-original.webp differ diff --git a/docs/src/assets/example.org-themed.webp b/docs/src/assets/example.org-themed.webp new file mode 100644 index 0000000000..1a704fc66e Binary files /dev/null and b/docs/src/assets/example.org-themed.webp differ diff --git a/docs/src/assets/preview.webp b/docs/src/assets/preview.webp new file mode 100644 index 0000000000..8414a34c65 Binary files /dev/null and b/docs/src/assets/preview.webp differ diff --git a/docs/src/content.config.ts b/docs/src/content.config.ts new file mode 100644 index 0000000000..6cb5eac864 --- /dev/null +++ b/docs/src/content.config.ts @@ -0,0 +1,13 @@ +import { defineCollection } from "astro:content"; +import { docsLoader } from "@astrojs/starlight/loaders"; +import { docsSchema } from "@astrojs/starlight/schema"; +import { autoSidebarLoader } from "starlight-auto-sidebar/loader"; +import { autoSidebarSchema } from "starlight-auto-sidebar/schema"; + +export const collections = { + docs: defineCollection({ loader: docsLoader(), schema: docsSchema() }), + autoSidebar: defineCollection({ + loader: autoSidebarLoader(), + schema: autoSidebarSchema(), + }), +}; diff --git a/docs/src/content/docs/contributing/creating-userstyles.mdx b/docs/src/content/docs/contributing/creating-userstyles.mdx new file mode 100644 index 0000000000..91d7617c5d --- /dev/null +++ b/docs/src/content/docs/contributing/creating-userstyles.mdx @@ -0,0 +1,26 @@ +--- +title: Creating Userstyles +description: Overview of the userstyle creation process. +sidebar: + order: 2 +--- + +import { Steps } from '@astrojs/starlight/components'; + +> [!IMPORTANT] +> Websites should be popular or otherwise commonly known by members of the Catppuccin community; personal or niche sites may not meet the criteria. If you are unsure if a website qualifies, consider creating a [discussion](https://github.com/catppuccin/catppuccin/discussions/new?category=port-requests) before submitting an initial PR. + +To create a userstyle, follow the instructions below. If you are unsure how to theme something, see our [Guides](/contributing/guides/). If you run into any difficulties or have any questions, feel free to join the [Catppuccin Discord server](https://discord.com/servers/catppuccin-907385605422448742) and find us in the #userstyles channel! + + + +1. Fork the `catppuccin/userstyles` repository. +2. Create a new branch under the name `feat/`, (e.g. `feat/nixos-search` instead of NixOS Search). +3. Create a new folder `styles/`. The name must be `lower-kebab-case`. +4. Copy the contents of the [`template`](https://github.com/catppuccin/userstyles/tree/main/template) folder into `styles/`. + - **The template uses [LESS](https://lesscss.org/#overview), a preprocessor for Stylus. Please do not change this as we will only accept userstyles based on the template.** +5. [Write the userstyle](/contributing/tutorials/writing-a-userstyle/). +6. [Edit the `userstyles.yml` file](/contributing/userstylesyml/) and enter the details of your port. +7. Raise a [pull request](https://github.com/catppuccin/userstyles/compare), making sure to read and fill out the template properly. The title of your pull request should follow the format of `feat(): init`. + + diff --git a/docs/src/content/docs/contributing/guides/_meta.yml b/docs/src/content/docs/contributing/guides/_meta.yml new file mode 100644 index 0000000000..01a0a67f19 --- /dev/null +++ b/docs/src/content/docs/contributing/guides/_meta.yml @@ -0,0 +1,2 @@ +label: How can I theme ...? +order: 5 diff --git a/docs/src/content/docs/contributing/guides/images-and-svgs.md b/docs/src/content/docs/contributing/guides/images-and-svgs.md new file mode 100644 index 0000000000..87225f1f1e --- /dev/null +++ b/docs/src/content/docs/contributing/guides/images-and-svgs.md @@ -0,0 +1,116 @@ +--- +title: Images and SVGs +description: Guide for theming images and SVGs in userstyles. +sidebar: + order: 2 +--- + +## Monochrome `` elements + +If you encounter an `` element with single colored contents, the easiest way to theme it is to apply a CSS color filter. The `@-filter` filters can be used to theme Catppuccin colours. + +For example: + +```css +img.twitter-icon { + filter: @blue-filter; +} +``` + +## SVGs as `background-image`s + +Websites will sometimes use the `background-image` CSS property to apply an SVG, often for icons. The value of the `background-image` is usually either a URL to an external SVG resource, such as `url("https://example.org/assets/xyz.svg")`, or an inlined SVG [data URL](https://developer.mozilla.org/en-US/docs/Web/URI/Reference/Schemes/data), like `url("data:image/svg+xml,%3Csvg%3E...%3C/svg%3E");`. + +### External SVG URL + +Below is an example of what a rule for an external SVG URL could look like. + +```css +.xyz { + background-image: url("https://example.org/assets/xyz.svg"); +} +``` + +To obtain the contents of this remote SVG resource, you can either: + +- Visit the URL of the SVG, right click and select **View Page Source**, and copy its contents from the resulting page. +- Run `curl "https://example.org/assets/xyz.svg"` and copy the contents from the terminal output. + +> [!TIP] +> On macOS, copy the SVG contents after `curl`-ing automatically with `| pbcopy`: `curl "https://example.org/assets/xyz.svg" | pbcopy`. + +### Inlined SVG data URL + +Below is an example of what a rule for an inlined SVG data URL could look like. + +```css +.xyz { + background-image: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20fill%3D%22red%22%20d%3D%22%22/%3E%3C/svg%3E"); +} +``` + +The text after `data:image/svg+xml,` is URL encoded. To get the contents of the SVG, the string needs to be URL decoded. + +There are two ways to do this: + +- Using the JavaScript built-in function `decodeURIComponent`. You can run `node -e 'console.log(decodeURIComponent("..."))'`, with the URL encoded SVG contents placed between the double quotes in place of `...`. +- Use an online tool such as [urldecoder.io](https://www.urldecoder.io/). + +--- + +Once you have obtained the SVG contents, paste them in between the single quotes of `escape('')` in the following template: + + +```less +.xyz { + @svg: escape(''); + background-image: url("data:image/svg+xml,@{svg}"); +} +``` + +> [!NOTE] +> Ensure `escape()` uses single quotes, not double quotes, before pasting the SVG contents โ€” `escape('')`, not `escape("")`. + +> [!WARNING] +> The error `Invalid % without number` appears until an interpolated color is added in the SVG contents. This is covered in the following section. + +Now, replace any colors in the SVG with their respective Catppuccin variants. For example, take the following SVG icon for Twitter: + +```xml + +``` + +There is only one color used, `fill="#1D9BF0"`. That hex code is a shade of blue, so we can replace it with the `@blue` color using the `fill="@{}"` syntax ([variable interpolation](https://lesscss.org/features/#variables-feature-variable-interpolation)). + +```less +.twitter-icon { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); +} +``` + +## External SVGs through `` elements + +Theming an external SVG referenced from an `` element is similar. However, the `content` property is used instead of `background-image` to replace the image. + +As with the previous tip for `background-image`, only the SVG inside of the `escape('')` needs to be updated. + +```less +img.xyz { + @svg: escape("..."); + content: url("data:image/svg+xml,@{svg}"); +} +``` + +Again, following the example of theming a Twitter logo: + +```less +img.twitter-icon { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); +} +``` diff --git a/docs/src/content/docs/contributing/guides/index.md b/docs/src/content/docs/contributing/guides/index.md new file mode 100644 index 0000000000..2d6cc8797c --- /dev/null +++ b/docs/src/content/docs/contributing/guides/index.md @@ -0,0 +1,9 @@ +--- +title: How can I theme ...? +description: Guides for common userstyle theming techniques. +sidebar: + order: 1 + label: Overview +--- + +In this guide section, you can find out how to [theme images and SVGs](/contributing/guides/images-and-svgs/), [theme syntax highlighting](/contributing/guides/syntax-highlighting/), and [obtain raw color values](/contributing/guides/raw-color-values/). diff --git a/docs/src/content/docs/contributing/guides/raw-color-values.md b/docs/src/content/docs/contributing/guides/raw-color-values.md new file mode 100644 index 0000000000..2b4e9a616a --- /dev/null +++ b/docs/src/content/docs/contributing/guides/raw-color-values.md @@ -0,0 +1,14 @@ +--- +title: Raw color values +description: Guide for obtaining raw color values of palette colors in RGB or HSL formats. +sidebar: + order: 4 +--- + +## Obtaining RGB values + +See [`#lib.rgbify()`](/contributing/reference/libraries/standard/v/v1#librgbify). + +## Obtaining HSL values + +See [`#lib.hslify()`](/contributing/reference/libraries/standard/v/v1#libhslify). diff --git a/docs/src/content/docs/contributing/guides/syntax-highlighting.md b/docs/src/content/docs/contributing/guides/syntax-highlighting.md new file mode 100644 index 0000000000..c33c5ceafe --- /dev/null +++ b/docs/src/content/docs/contributing/guides/syntax-highlighting.md @@ -0,0 +1,52 @@ +--- +title: Syntax Highlighting +description: Guide for theming syntax highlighting in userstyles. +sidebar: + order: 3 +--- + +If a website uses [highlight.js](https://highlightjs.org/), [Pygments](https://pygments.org/), [Prism.js](https://prismjs.com/), or [Chroma](https://github.com/alecthomas/chroma) for syntax highlighting, follow the steps for the syntax higlighter in use below. First though, you'll need to add the following line near the top of the `#catppuccin` mixin, under `#lib.palette();`/`#lib.defaults();`, to include the necessary CSS variables: + +```css +#lib.css-variables(); +``` + +## highlight.js + +After including the CSS variables with the mixin specified above, add the following line at the top of the userstyle, beneath the `@-moz-document` line. + +```css +@import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); +``` + +## Pygments + +After including the CSS variables with the mixin specified above, add the following line at the top of the userstyle, beneath the `@-moz-document` line. + +```css +@import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); +``` + +## Prism.js + +After including the CSS variables with the mixin specified above, add the following line at the top of the userstyle, beneath the `@-moz-document` line. + +```css +@import url("https://prismjs.catppuccin.com/variables.important.css"); +``` + +## Chroma + +After including the CSS variables with the mixin specified above, add the following lines at the top of the userstyle, beneath the `@-moz-document` line. + +```css +@import (css) + url("https://chroma.catppuccin.com/@{lightFlavor}-chroma-style.css") + (prefers-color-scheme: light); +@import (css) + url("https://chroma.catppuccin.com/@{darkFlavor}-chroma-style.css") + (prefers-color-scheme: dark); +``` + +> [!IMPORTANT] +> The above snippet for Chroma only works properly for userstyles that use browser/system media queries to apply the `#catppuccin` mixin. If a userstyle targets a specific attribute/element on the website to apply the mixin, this will not work all of the time. diff --git a/docs/src/content/docs/contributing/index.md b/docs/src/content/docs/contributing/index.md new file mode 100644 index 0000000000..bc6ec9715c --- /dev/null +++ b/docs/src/content/docs/contributing/index.md @@ -0,0 +1,65 @@ +--- +title: Contributing +description: Contribution guidelines for the Catppuccin Userstyles project. +sidebar: + label: Overview + order: 1 +--- + +If it is your first time contributing to a project on GitHub, please see the popular [first-contributions](https://github.com/firstcontributions/first-contributions) repository. This will give you hands-on experience with the features of GitHub required to make a contribution. As always, feel free to join our [Discord](https://discord.com/servers/catppuccin-907385605422448742) to ask any questions and clarify your understanding, we are more than happy to help! + +## Development environment + +This repository uses [Deno](https://deno.com/) extensively for linting, formatting, and automation. It is highly recommended to set up Deno locally to improve your workflow โ€” see ["Installation" - Deno Docs](https://docs.deno.com/runtime/manual/getting_started/installation). + +With Deno installed locally, you can lint all userstyles with `deno task lint`, and if any issues are found, `deno task lint:fix` to automatically apply fixes in some cases. For quicker linting, specify the userstyle to lint with `deno task lint my-userstyle` (or equivalently using the relative path/autocomplete, `deno task lint styles/my-userstyle`). + +It's helpful to maintainers to run formatting with `deno fmt` before opening a pull request, though not strictly necessary. + +> [!IMPORTANT] +> `deno task lint` is not to be confused with Deno's built-in linter, `deno lint`. `deno lint` only checks our TypeScript files in `scripts/`, whereas `deno task lint` is the custom Deno task for linting userstyles that you should be using. + +To edit and/or create userstyles, [set up live reloading](/contributing/tips-and-tricks/hot-reloading/) so that local changes (edits made from your editor of choice) can be automatically reloaded through Stylus. + +## Versioning + +You may notice that userstyles contain a line in the format of `@version 2000.01.01` in the UserCSS metadata section at the top. **This line should not be edited by hand**. We use an automated versioning system that updates the version value (based on [Calendar Versioning](https://calver.org/)) when a change is made to a userstyle, after merging the pull request. + +## Authoring userstyles + +### Assessing websites + +Some websites are, unfortunately, not ideal for userstyles. Websites with auto-generated classes โ€” think `aeN WR beA nH oy8Mbf`, `cfb2a888`, and so on โ€” lead to unreadable and unmaintainable userstyles that break quickly and are difficult to update/maintain. Such userstyles, if created, will also take longer to review and merge. + +On the other hand, if a website uses CSS variables โ€” see below โ€” it is a great candidate for userstyling. + +### CSS variables + +While writing a userstyle, you may come across [CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/--*) (or "custom properties"). We prefer that these variables are used if present, rather than theming individual elements. As the website typically uses these variables itself, it saves a lot of work in theming and maintaining the userstyle. + +### Opinionated changes + +When writing or updating a userstyle, it is important to keep in mind that different users have different preferences. To avoid lengthy discussion over user interface aesthetics, we have a set of rules for what a userstyle may include; importantly, **changes to font, layout, padding, margin, display, and in general anything besides color tweaks are prohibited.** + +### Pull requests + +- Create a [topic branch](https://git-scm.com/book/en/v2/Git-Branching-Branching-Workflows#_topic_branch) on your fork for your specific PR. +- Catppuccin uses the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) standard for creating explicit and meaningful commit messages. This repository requires pull request _titles_ to be in the conventional commit format, however we do not require it for individual commits within a pull request. +- It's better to have a draft pull request than no pull request at all. Having a draft lets others know that a userstyle is being worked on, and gives the opportunity for people to try it out ahead of time (if they really want it themed!). + +### Contribution review process + +```mermaid +graph TD; + A[New userstyle]; + B[Other improvements]; + A --> C[Review by userstyles staff]; + B --> D[Review by maintainer]; + C --> E{Feedback}; + D --> F{Feedback}; + E -->|Changes made| E; + F -->|Changes made| F; + E -->|Approved by userstyles staff| K; + F -->|Approved by maintainer or userstyles staff| L[Merged by maintainer]; + K[Review period] --> M[Merged by userstyles staff]; +``` diff --git a/docs/src/content/docs/contributing/reference/_meta.yml b/docs/src/content/docs/contributing/reference/_meta.yml new file mode 100644 index 0000000000..7d9f637733 --- /dev/null +++ b/docs/src/content/docs/contributing/reference/_meta.yml @@ -0,0 +1,2 @@ +label: Reference +order: 7 diff --git a/docs/src/content/docs/contributing/reference/libraries/_meta.yml b/docs/src/content/docs/contributing/reference/libraries/_meta.yml new file mode 100644 index 0000000000..fc171f4dcc --- /dev/null +++ b/docs/src/content/docs/contributing/reference/libraries/_meta.yml @@ -0,0 +1 @@ +label: Libraries diff --git a/docs/src/content/docs/contributing/reference/libraries/modules/_meta.yml b/docs/src/content/docs/contributing/reference/libraries/modules/_meta.yml new file mode 100644 index 0000000000..13f8cf4d33 --- /dev/null +++ b/docs/src/content/docs/contributing/reference/libraries/modules/_meta.yml @@ -0,0 +1,4 @@ +label: Modules +badge: + text: Beta + variant: caution diff --git a/docs/src/content/docs/contributing/reference/libraries/modules/index.md b/docs/src/content/docs/contributing/reference/libraries/modules/index.md new file mode 100644 index 0000000000..dfb2425132 --- /dev/null +++ b/docs/src/content/docs/contributing/reference/libraries/modules/index.md @@ -0,0 +1,28 @@ +--- +title: Library Modules +description: Reference for library modules. +sidebar: + label: Overview +--- + +Library modules consist of collections of mixins which target design systems or commonly used libraries. + +They follow a standard structure and should be built to be modular and reusable across several userstyles. + +## Structure + +The [standard library](/contributing/reference/libraries/standard/) is a good reference as to how libraries can be structured. + +All libraries are in lib/ with subdirectories per library name, and versioned files (e.g., `v1.less`, `v2.less`, etc). + +They must have a top level mixin in the format `#__libraryname`. All constants and variables should be under a nested `.base` mixin. The nested mixin is used like `#__libraryname.base()` after all other standard library statements. + +Other mixins and constants may be included, but they must be under the top level mixin for scoping purposes. + +## Creation + +Identify what your library module will achieve. Are you targeting a design system, framework, or a library? + +If a design system or framework, is it specific to one userstyle or reusable across multiple? What are the popularity metrics of it? Is the increased maintenance workload worth the benefit it provides in DRY (Don't Repeat Yourself)? + +If the target is a web library, check if there is an [existing port](http://catppuccin.com/ports) for it. The methods outlined in [Syntax Highlighting](/contributing/guides/syntax-highlighting/) may be used to import the theme for the library in question. Some ports may need changes upstreamed to work for userstyles purposes; in these cases, please coordinate with userstyles staff to determine the most suitable approach. diff --git a/docs/src/content/docs/contributing/reference/libraries/standard/_meta.yml b/docs/src/content/docs/contributing/reference/libraries/standard/_meta.yml new file mode 100644 index 0000000000..01f8bc3a01 --- /dev/null +++ b/docs/src/content/docs/contributing/reference/libraries/standard/_meta.yml @@ -0,0 +1,2 @@ +label: Standard Library +order: 1 diff --git a/docs/src/content/docs/contributing/reference/libraries/standard/index.mdx b/docs/src/content/docs/contributing/reference/libraries/standard/index.mdx new file mode 100644 index 0000000000..429a996804 --- /dev/null +++ b/docs/src/content/docs/contributing/reference/libraries/standard/index.mdx @@ -0,0 +1,36 @@ +--- +title: Overview +description: Reference to using the standard library. +sidebar: + order: 1 +--- + +import { Badge } from '@astrojs/starlight/components'; + + +| Version | Documentation | Source Code | +| -------------------------------------------------------------------------------- | -------------------------------------------------- | -------------- | +| v1 | [/v/v1](/contributing/reference/libraries/standard/v/v1/) | [`lib/std/v1.less`](https://github.com/catppuccin/userstyles/blob/main/lib/std/v1.less) | + +--- + +The standard library is a collection of mixins to deduplicate and simplify code in userstyles. It is imported in every userstyle, alongside with other [library modules](/contributing/reference/libraries/modules/) if applicable. + +## Importing + +```less +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; +``` + +## Changelog + +### v1 + +v1 is the first versioned release of the standard library. To migrate from "v0", update your standard library import URLs at the top of the userstyle: + +```diff +-@import "https://userstyles.catppuccin.com/lib/lib.less"; ++@import "https://userstyles.catppuccin.com/lib/std/v1.less"; +``` + +This release contains no API changes and is safe to upgrade to for all userstyles. diff --git a/docs/src/content/docs/contributing/reference/libraries/standard/v/_meta.yml b/docs/src/content/docs/contributing/reference/libraries/standard/v/_meta.yml new file mode 100644 index 0000000000..cf36cd23e6 --- /dev/null +++ b/docs/src/content/docs/contributing/reference/libraries/standard/v/_meta.yml @@ -0,0 +1 @@ +label: Versions diff --git a/docs/src/content/docs/contributing/reference/libraries/standard/v/v1.mdx b/docs/src/content/docs/contributing/reference/libraries/standard/v/v1.mdx new file mode 100644 index 0000000000..7ab1f3b430 --- /dev/null +++ b/docs/src/content/docs/contributing/reference/libraries/standard/v/v1.mdx @@ -0,0 +1,50 @@ +--- +title: v1 +description: Reference to using the v1 version of the standard library. +sidebar: + badge: + text: Latest + variant: success +--- + +## Usage + +```less +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; +``` + +## API + +The standard library exposes a `#lib` namespace. + +### `#lib.palette()` + +The standard library palette mixin provides Less variable definitions for hex colors and CSS filters from the palette. Call the mixin at the top of the `#catppuccin` mixin to inject the variables into the userstyle context. This is used in all userstyles. + +### `#lib.defaults()` + +The standard library defaults mixin provides a set of default styles for text selection and native/input elements. This is generally applied in all userstyles, with some exceptions. + +### `#lib.rgbify()` + +The standard library `rgbify` mixin is a utility mixin for extracting the color in `r, g, b` format from a palette variable. + +#### Examples + +```less +--my-variable-rgb: #lib.rgbify(@base) []; // -> 30, 30, 46 +``` + +### `#lib.hslify()` + +The standard library `hslify` mixin is a utility mixin for extracting the color in `h, s, l` format from a palette variable. + +#### Examples + +```less +--my-variable-hsl: #lib.hslify(@base) []; // -> 240, 21.052631578947366%, 14.901960784313726% +``` + +### `#lib.css-variables()` + +The standard library CSS variables mixin provides the palette variables in [CSS variable/custom property](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_cascading_variables/Using_CSS_custom_properties) form. This is commonly used alongside [syntax highlighting imports](/contributing/guides/syntax-highlighting/). diff --git a/docs/src/content/docs/contributing/tips-and-tricks/_meta.yml b/docs/src/content/docs/contributing/tips-and-tricks/_meta.yml new file mode 100644 index 0000000000..c564d795c6 --- /dev/null +++ b/docs/src/content/docs/contributing/tips-and-tricks/_meta.yml @@ -0,0 +1,2 @@ +label: Tips and Tricks +order: 6 diff --git a/docs/src/content/docs/contributing/tips-and-tricks/hot-reloading.md b/docs/src/content/docs/contributing/tips-and-tricks/hot-reloading.md new file mode 100644 index 0000000000..98453d503c --- /dev/null +++ b/docs/src/content/docs/contributing/tips-and-tricks/hot-reloading.md @@ -0,0 +1,8 @@ +--- +title: Using hot reloading in Stylus +description: See changes from your IDE in real time with Stylus's "Live reloading" feature. +sidebar: + order: 2 +--- + +See ["Initial installation and live reload" - Stylus Wiki](https://github.com/openstyles/stylus/wiki/Writing-UserCSS#live-reload-on-the-fly-previewingwhen-developing-styles-locally-in-another-editoride). diff --git a/docs/src/content/docs/contributing/tips-and-tricks/inspect-hard-to-grab-elements.md b/docs/src/content/docs/contributing/tips-and-tricks/inspect-hard-to-grab-elements.md new file mode 100644 index 0000000000..0c04936695 --- /dev/null +++ b/docs/src/content/docs/contributing/tips-and-tricks/inspect-hard-to-grab-elements.md @@ -0,0 +1,18 @@ +--- +title: Inspect hard to grab elements +description: Useful tip for inspecting elements that are hard to debug. +sidebar: + order: 1 +--- + +Paste the following snippet into your browser console, then trigger the event. Adjust the delay (in milliseconds) as needed. + +```js +setTimeout(function () { + debugger; +}, 3000); +``` + +![](https://i0.wp.com/css-tricks.com/wp-content/uploads/2017/02/debugger.gif?ssl=1) + +GIF via ["Set a Timed Debugger To Web Inspect Hard-To-Grab Elements" - CSS Tricks](https://css-tricks.com/set-timed-debugger-web-inspect-hard-grab-elements/). diff --git a/docs/src/content/docs/contributing/tutorials/_meta.yml b/docs/src/content/docs/contributing/tutorials/_meta.yml new file mode 100644 index 0000000000..64aa9ab7d2 --- /dev/null +++ b/docs/src/content/docs/contributing/tutorials/_meta.yml @@ -0,0 +1,2 @@ +label: Tutorials +order: 4 diff --git a/docs/src/content/docs/contributing/tutorials/writing-a-userstyle.md b/docs/src/content/docs/contributing/tutorials/writing-a-userstyle.md new file mode 100644 index 0000000000..458308b98a --- /dev/null +++ b/docs/src/content/docs/contributing/tutorials/writing-a-userstyle.md @@ -0,0 +1,167 @@ +--- +title: Writing a userstyle +description: Beginner-friendly walkthrough of creating a userstyle! +sidebar: + order: 1 +--- + +## Prerequisites + +- [Stylus](https://github.com/openstyles/stylus) ([Firefox](https://addons.mozilla.org/en-GB/firefox/addon/styl-us/) / [Chrome](https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne) extension). +- A website to theme! + +Assuming you have completed steps 1-4 of [Creating Userstyles](/contributing/creating-userstyles/), you should have a new `catppuccin.user.less` file under the `styles//` directory. Follow along in that `catppuccin.user.less` file as we write an example userstyle for [example.org](http://example.org/). + +## Usercss Metadata + +Start by filling out the "metadata block" at the very top of the template. Replace `` with the name of the website you are porting, and please ensure it is capitalized when needed. For `example.org`, it looks like this: + +```less +/* ==UserStyle== +@name example.org Catppuccin +@namespace github.com/catppuccin/userstyles/styles/example.org +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/example.org +@version 2000.01.01 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/example.org/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aexample.org +@description Soothing pastel theme for example.org +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire*", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ +``` + +The rest of the metadata block details the preprocessor and the options of the userstyle. This won't need to be changed. For more information, see ["Usercss Metadata" - Stylus Wiki](https://github.com/openstyles/stylus/wiki/Writing-UserCSS#usercss-metadata). + +## `@-moz-document` + +To tell Stylus which website(s) to apply this userstyle on, replace `` with the domain of your port. For `example.org`, it looks like this: + +```less +@-moz-document domain("example.org") { +``` + +> [!NOTE] +> While `domain()` works for most cases, you may need to use [`regexp()`](https://github.com/openstyles/stylus/wiki/Writing-styles#regexp) for websites with more complex URLs. For example: +> +> ```less +> @-moz-document regexp("http://example.(com|net|org|edu)/") { +> ``` + +## Applying the theme + +This section of the template is about applying the user's light/dark flavors. Read the comments for this section in the template thoroughly and decide which of the two options works best for your port. `example.org` doesn't have a light/dark mode toggle, so we'll apply it based on the user's preferences. + +```less +:root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } +} +``` + +> [!TIP] +> If `example.org` _did_ use a toggle for changing the theme, we suggest using inspect element to try to observe what changes occur when the toggle is adjusted. Typically websites will have a class or attribute on the root `` element. Some examples from our userstyles include `[theme="dark"]`, `.dark`, `.theme-dark`, etc. + +## The `#catppuccin` mixin + +> [!TIP] +> For more on how Less mixins work, see ["Mixins" - lesscss.org](https://lesscss.org/features/#mixins-feature) and ["A Comprehensive Introduction to Less: Mixins" - SitePoint](https://www.sitepoint.com/a-comprehensive-introduction-to-less-mixins/). + +We'll refer to this next section of the template as the "`#catppuccin` mixin". The first part contains a series of mixin calls to include the Catppuccin palette and style defaults from the standard library: + +```less +#lib.palette(); +#lib.defaults(); +``` + +Following that, you will write the CSS rules for your port. Here is what it looks like for our `example.org` port: + +```less +#catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + background-color: @base; + + & > div { + color: @text; + background-color: @surface0; + } + } + + a:link, + a:visited { + color: @accent; + } + + /* ... */ +} +``` + +## Putting it all together + +Combining all of the previous steps, we have a working userstyle! + +```less +/* ==UserStyle== +@name example.org Catppuccin +@namespace github.com/catppuccin/userstyles/styles/example.org +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/example.org +@version 2000.01.01 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/example.org/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aexample.org +@description Soothing pastel theme for example.org +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire*", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@-moz-document domain("example.org") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + background-color: @base; + + & > div { + color: @text; + background-color: @surface0; + } + } + + a:link, + a:visited { + color: @accent; + } + } +} +``` + +| Original | Themed | +| -------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| ![Screenshot of the default example.com page.](../../../../assets/example.org-original.webp) | ![Combined screenshots of the example.com page, with the page seen using the Catppuccin palette. Images for flavors Latte, Frappรฉ, Macchiato and Mocha are displayed left to right.](../../../../assets/example.org-themed.webp) | + +Complete the rest of the steps in [Creating Userstyles](/contributing/creating-userstyles/), and then submit your PR! diff --git a/docs/src/content/docs/contributing/userstylesyml.mdx b/docs/src/content/docs/contributing/userstylesyml.mdx new file mode 100644 index 0000000000..d51a482a16 --- /dev/null +++ b/docs/src/content/docs/contributing/userstylesyml.mdx @@ -0,0 +1,100 @@ +--- +title: userstyles.yml +description: Guide for adding and removing userstyles and maintainers. +sidebar: + order: 3 +--- + +import { Steps } from "@astrojs/starlight/components"; + +The [`userstyles.yml`](https://github.com/catppuccin/userstyles/tree/main/scripts/userstyles.yml) file is responsible for tracking all userstyle and maintainer metadata. + +> [!TIP] +> The [`userstyles.schema.json`](https://github.com/catppuccin/userstyles/tree/main/scripts/userstyles.schema.json) file is the schema specification for `userstyles.yml`. Please refer to it for clarification. + +## Adding a new userstyle + + + +1. [Add yourself as a maintainer](#adding-yourself-as-a-maintainer). +2. Locate the `userstyles` section of `userstyles.yml` and add an entry for the new userstyle to the list in alphabetical order. + + You should make changes to everything wrapped in `<>` and remove the `<>` characters. If you need help with any of the fields, refer to other ports in the `userstyles.yml` file. If you would like extra guidance, you can ask for help in the pull request comments or join the [Catppuccin Discord server](https://discord.com/servers/catppuccin-907385605422448742). + + **Required Fields:** + + ```yaml + : + name: + link: + # Up to 3 categories are allowed, and having at least one is required. + # The first category is considered the "primary" category and impacts where the userstyle is listed on the website. + categories: [] + color: + current-maintainers: [*] + ``` + + **Optional Fields:** + + The `note` field allows for additional information about the userstyle to be included on the README. + + The `icon` field allows for specifying an icon from [Simple Icons](https://simpleicons.org/) for the userstyle. The icon's "slug" - which can be found by hovering over the icon's title and clicking the copy button - should be used. + + The `past-maintainers` field contains a list of maintainers who have maintained the port in the past. We encourage all maintainers to add/remove themselves from this list as they see fit. + + + +## Adding yourself as a maintainer + + + +1. Add a new entry to the end of the `collaborators` array in the `userstyles.yml` file. The entry should be made under your GitHub username. The following example shows a new entry for a user with the GitHub username "Pepperjack". + + ```yaml + collaborators: + - &Pepperjack Pepperjack + ``` + +2. Add your username to the `current-maintainers` array of the userstyle you wish to maintain. The following example shows the user "Pepperjack" added to the `example.org` userstyle. + + ```yaml del={7} ins={8} + userstyles: + example.org: + name: example.org + link: https://example.org + categories: [productivity] + color: text + current-maintainers: [] + current-maintainers: [*Pepperjack] + ``` + + If the change is accepted, you will receive an invitation to the `catppuccin` organization, and become a member of the [`userstyles-maintainers` team](https://github.com/orgs/catppuccin/teams/userstyles-maintainers). + + As a maintainer you will be expected to: + + - Review and merge PRs for the userstyle you maintain. + - Keep the userstyle up to date with the latest changes. If you no longer wish to maintain a userstyle, see [Removing yourself as a maintainer](#removing-yourself-as-a-maintainer). + - Follow our code of conduct and guidelines. + + + +## Removing yourself as a maintainer + +Remove your username from the `current-maintainers` array and add it to the `past-maintainers` array of the userstyle(s) you no longer want to maintain. + +The following example shows the user "Pepperjack" removed from the `example.org` userstyle: + +```yaml del={7} ins={8-9} +userstyles: + example.org: + name: example.org + link: https://example.org + categories: [productivity] + color: text + current-maintainers: [*Pepperjack] + current-maintainers: [] + past-maintainers: [*Pepperjack] +``` + +> [!NOTE] +> If you would prefer to not be listed as a past maintainer at all, you can remove yourself from `collaborators` array entirely. Upon removal, you will also be removed from the `userstyles-maintainers` GitHub team. diff --git a/docs/browsers.md b/docs/src/content/docs/getting-started/faq.md similarity index 55% rename from docs/browsers.md rename to docs/src/content/docs/getting-started/faq.md index f70a85ee7b..33f7e1f609 100644 --- a/docs/browsers.md +++ b/docs/src/content/docs/getting-started/faq.md @@ -1,7 +1,19 @@ -# Browsers +--- +title: FAQ +description: Answers to frequently asked questions about Catppuccin Userstyles. +sidebar: + order: 3 +--- -> [!NOTE] -> If you see a popular browser that hasn't been added, please create a pull request to do so! +## This userstyle is broken! + +Sorry to hear that! Please [open an issue](https://github.com/catppuccin/userstyles/issues/new?template=userstyle.yml). + +## Can I request a userstyle? + +To request a website to be themed, please create a [Port Request](https://github.com/catppuccin/catppuccin/discussions/new?category=port-requests) discussion on [catppuccin/catppuccin](https://github.com/catppuccin/catppuccin). + +## What version of my browser am I using? **To find your browser's version:** @@ -16,7 +28,3 @@ | Opera (GX) | `opera://about/` | | Microsoft Edge | `edge://version/` | | Arc | `arc://version/` | - -## Common issues - -If you are running into any compatibility issues with your browser, please feel free to open an issue! diff --git a/docs/src/content/docs/getting-started/introduction.mdx b/docs/src/content/docs/getting-started/introduction.mdx new file mode 100644 index 0000000000..413777d4cb --- /dev/null +++ b/docs/src/content/docs/getting-started/introduction.mdx @@ -0,0 +1,47 @@ +--- +title: Introduction +description: Introduction to Catppuccin Userstyles. +sidebar: + order: 1 +--- + +A curated collection of soothing pastel themes for your favorite websites and web applications. + +![Combined preview screenshot of four different websites with userstyles applied. In order of appearance, npm is shown in Latte, Wikipedia is shown in Frappรฉ, Chess.com is shown in Macchiato, and GitHub is shown in Mocha.](../../../assets/preview.webp) + +## Getting started + +To get started using the catppuccin/userstyles collection, see [Usage](/getting-started/usage/). + +To get started contributing to catppuccin/userstyles, see [Contributing](/contributing/) and [Creating Userstyles](/contributing/creating-userstyles/). + +## Userstyles + +> [!NOTE] +> Userstyles labeled with the "โค๏ธโ€๐Ÿฉน" emoji lack maintainers, and may not work as intended. Contributions are still welcome and encouraged! + +import AnchorHeading from '@astrojs/starlight/components/AnchorHeading.astro'; +import { ports } from "../../../lib/ports"; +import { categories, sortedCategories, categoryMap } from "../../../lib/categories"; + +{sortedCategories.map((cat) => { + const category = categories[cat]; + return ( + <> + {category.emoji}{' '}{category.name} +

{category.description}

+ + + ); +})} diff --git a/docs/src/content/docs/getting-started/usage.mdx b/docs/src/content/docs/getting-started/usage.mdx new file mode 100644 index 0000000000..d9aa58d26e --- /dev/null +++ b/docs/src/content/docs/getting-started/usage.mdx @@ -0,0 +1,50 @@ +--- +title: Usage +description: Guide for how to use Catppuccin Userstyles. +sidebar: + order: 2 +--- + +import { Steps } from '@astrojs/starlight/components'; + +For both of the below installation methods, you will need the Stylus browser extension installed. Install [Stylus](https://github.com/openstyles/stylus) for [Chrome](https://chromewebstore.google.com/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne) or [Firefox](https://addons.mozilla.org/en-GB/firefox/addon/styl-us/). If you use Chrome, make sure to enable "Allow access to file URLs" in the Chrome extension settings for Stylus (visit `chrome://extensions/?id=clngdbkpkpeebahjckkjfobafhncgmne`). + +> [!TIP] +> If you use [Dark Reader](https://darkreader.org/), make sure to disable the extension on websites with Catppuccin userstyles installed to avoid conflicts. + +## All Userstyles + + + +1. Download the compiled Stylus export file, containing our recommended Stylus settings and all userstyles preloaded: [`import.json` (download)](https://github.com/catppuccin/userstyles/releases/download/all-userstyles-export/import.json). + - Alternatively, if you want to further customize the `import.json` file - such as setting it so that all userstyles have the accent color `peach`, or the dark flavor is always `frappe` - you can download a customized Stylus export file from [@uncenter](https://github.com/uncenter)'s "[Catppuccin Userstyles Customizer](https://catppuccin-userstyles-customizer.uncenter.dev/)" instead. +2. Open the Stylus "manage" page. +3. On the sidebar panel, click the **Import** button in the **Backup** section, and select the downloaded file from step 1. + + + +## Individual Userstyles + + + +1. Enable CSP Patching from Stylus's **Settings** > **Advanced**. +2. Install your choice of [available userstyles](/getting-started/introduction/#userstyles) by clicking the **Stylus Install** badge in each README. + + + +# Configuration + +All userstyles come with three default configuration options; the light flavor, the dark flavor, and the accent color. Some userstyles may offer additional site-specific options as well. + +## Decentralized/self-hosted applications + +For decentralized or self-hosted applications, you can apply a theme to one or multiple instances across updates by following the instructions below. + + + +1. Open the Stylus "Manage" page. +2. Click on the userstyle's name in the list. +3. Click on **Style settings** in the left panel. +4. Enter the URL patterns for your instance(s) in the text box labeled **Custom included sites**. For example, to apply a userstyle to `example.org`, you would add a line with `https://example.org/*` to the textbox. The trailing asterisk applies it to all pages on the domain - without it, only the root page is themed. + + diff --git a/docs/src/content/docs/index.mdx b/docs/src/content/docs/index.mdx new file mode 100644 index 0000000000..732a5c99ef --- /dev/null +++ b/docs/src/content/docs/index.mdx @@ -0,0 +1,18 @@ +--- +title: Catppuccin Userstyles +description: A curated collection of soothing pastel themes for your favorite websites and web applications. +template: splash +hero: + tagline: A curated collection of soothing pastel themes for your favorite websites and web applications. + image: + dark: /public/pepperjack-dark.png + light: /public/pepperjack-light.png + actions: + - text: Get Started + link: /getting-started/introduction + icon: right-arrow + - text: Contribute + link: /contributing/ + icon: right-arrow + variant: secondary +--- diff --git a/docs/src/lib/categories.ts b/docs/src/lib/categories.ts new file mode 100644 index 0000000000..183dcaece0 --- /dev/null +++ b/docs/src/lib/categories.ts @@ -0,0 +1,39 @@ +import YAML from "yaml"; +import { type PortEntry, ports } from "./ports.ts"; + +export type Category = { + key: string; + name: string; + description: string; + emoji: string; +}; + +const CATEGORIES_URL = + "https://raw.githubusercontent.com/catppuccin/catppuccin/d4f82739e687cfd19d168be355367fdbbcc8e029/resources/categories.yml"; + +const content = await fetch( + CATEGORIES_URL, +).then((res) => res.text()); +const parsed = YAML.parse(content) as Category[]; + +// Turn into a lookup table by key +export const categories = Object.fromEntries(parsed.map((c) => [c.key, c])); + +// Group ports by category +export const categoryMap: Record = ports.reduce( + (acc, port) => { + for (const cat of port.categories) { + if (!acc[cat]) acc[cat] = []; + acc[cat].push(port); + } + return acc; + }, + {} as Record, +); + +// Sort categories by name +export const sortedCategories = Object.keys(categoryMap).sort((a, b) => { + const aName = categories[a]?.name ?? a; + const bName = categories[b]?.name ?? b; + return aName.localeCompare(bName); +}); diff --git a/docs/src/lib/ports.ts b/docs/src/lib/ports.ts new file mode 100644 index 0000000000..07345262a8 --- /dev/null +++ b/docs/src/lib/ports.ts @@ -0,0 +1,51 @@ +// deno-lint-ignore-file no-explicit-any + +import fs from "fs"; +import path from "path"; +import YAML from "yaml"; + +export type Collaborator = string; + +export type PortEntry = { + slug: string; + name: string; + link: string; + categories: string[]; + icon?: string; + color: string; + note?: string; + currentMaintainers?: Collaborator[]; + pastMaintainers?: Collaborator[]; + supports?: Record; +}; + +const file = fs.readFileSync( + path.resolve("../scripts/userstyles.yml"), + "utf-8", +); +const parsed = YAML.parse(file) as { + collaborators: Collaborator[]; + userstyles: Record; +}; + +// TODO: Use proper types from scripts lib once possible. + +// Normalize keys (camelCase) +function normalizePort(slug: string, data: any): PortEntry { + return { + slug, + name: data.name, + link: data.link, + categories: data.categories ?? [], + icon: data.icon, + color: data.color, + note: data.note, + currentMaintainers: data["current-maintainers"] ?? [], + pastMaintainers: data["past-maintainers"] ?? [], + supports: data.supports, + }; +} + +export const ports: PortEntry[] = Object.entries(parsed.userstyles).map( + ([slug, data]) => normalizePort(slug, data), +); diff --git a/docs/tips-and-tricks.md b/docs/tips-and-tricks.md deleted file mode 100644 index d58475fed0..0000000000 --- a/docs/tips-and-tricks.md +++ /dev/null @@ -1,250 +0,0 @@ -

-

๐Ÿ“– Tips and tricks for writing a userstyle

-

- -  - -### Table of Contents - - - -- [How can I see my changes in real time?](#how-can-i-see-my-changes-in-real-time) -- [How can I hide sensitive information in preview screenshots?](#how-can-i-hide-sensitive-information-in-preview-screenshots) -- [How do I convert preview images to WebP?](#how-do-i-convert-preview-images-to-webp) - - [Installation](#installation) - - [Usage](#usage) -- [How do I theme images and SVGs?](#how-do-i-theme-images-and-svgs) - - [SVG background images](#svg-background-images) - - [`` elements](#img-elements) -- [How do I set a variable to RGB values?](#how-do-i-set-a-variable-to-rgb-values) -- [How can I inspect hard-to-grab elements?](#how-can-i-inspect-hard-to-grab-elements) -- [How do I theme code blocks / syntax highlighting?](#how-do-i-theme-code-blocks--syntax-highlighting) - - -### How can I see my changes in real time? - -See ["Initial installation and live reload" - Stylus Wiki](https://github.com/openstyles/stylus/wiki/Writing-UserCSS#initial-installation-and-live-reload). - -  - -### How can I hide sensitive information in preview screenshots? - -When taking screenshots of userstyles, you may want to hide sensitive information (such as your username, email, etc.). - -You may use the [Flow Circular](https://fonts.google.com/specimen/Flow+Circular) font to redact details by obscuring any text on the page. - -Use this snippet at the top of your userstyle to import and use the font: - -```less -@import url("https://fonts.googleapis.com/css2?family=Flow+Circular&display=swap"); - -* { - font-family: "Flow Circular", cursive; -} -``` - -  - -### How do I convert preview images to WebP? - -The Catppuccin project prefers to use the [WebP image format](https://en.wikipedia.org/wiki/WebP) for the asset preview images. We recommend using Google's [`cwebp`](https://developers.google.com/speed/webp/docs/cwebp) conversion utility to convert images to WebP. - -#### Installation - -| Method | Instructions | -| ------------------------------------- | -------------------------------------------------------------------------------------- | -| [Homebrew](https://brew.sh/) | `brew install webp` [[view cask]](https://formulae.brew.sh/formula/webp) | -| [MacPorts](https://www.macports.org/) | `sudo port install webp` [[view port]](https://ports.macports.org/port/webp/) | -| Binaries | See https://storage.googleapis.com/downloads.webmproject.org/releases/webp/index.html. | - -#### Usage - -> [!TIP] -> See [the full documentation on `cwebp`](https://developers.google.com/speed/webp/docs/cwebp) for further reference. - -``` -cwebp -lossless old-image.png -o new-image.webp -``` - -The command above is converting the input image `old-image.png` to the output file `new-image-webp`, with a lossless quality conversion. - -  - -### How do I theme images and SVGs? - -#### SVGs as `background-image`s - -Websites will sometimes use the `background-image` CSS property to apply an SVG, often for icons. We will refer to these as "external SVGs" throughout the rest of this guide, as the SVGs are usually at a different URL and linked to with [`url()`](https://developer.mozilla.org/en-US/docs/Web/CSS/url). Below is an example of what a rule for an external SVG could look like. - -```css -.xyz { - background-image: url("https://example.org/assets/xyz.svg"); -} -``` - -The easiest way to theme external SVGs is to visit the URL of the SVG and paste its contents in between the single quotes of the `escape('')` section of the following template: - -```less -.xyz { - @svg: escape("..."); - background-image: url("data:image/svg+xml,@{svg}"); -} -``` - -> [!NOTE] -> The `Invalid % without number` error may appear if you have not done the following step. Make sure to add/replace an interpolated color in the SVG contents (as is detailed below) for this error to go away. - -Now, replace any colors in the SVG with their respective Catppuccin variants. For example, take the following SVG icon for Twitter: - -```xml - -``` - -There is only one color used, `fill="#1D9BF0"`. That hex code is a shade of blue, so we can replace it with the `@blue` color using the `fill="@{}"` syntax ([variable interpolation](https://lesscss.org/features/#variables-feature-variable-interpolation)). - -```less -.twitter-icon { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); -} -``` - -#### `` elements - -Theming an inline image is similar, but `content` is used instead of `background-image` to cover up the original image with our new one. As with the previous tip for `background-image`, you only need to update the SVG inside of the `escape('')` (see above for details). - -```less -img.xyz { - @svg: escape("..."); - content: url("data:image/svg+xml,@{svg}"); -} -``` - -Again, following the example of theming a Twitter logo: - -```less -img.twitter-icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); -} -``` - -  - -### How do I set a variable to RGB values? - -You can use the following snippet to get the raw RGB values from a color. - -```less -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - ---ctp-base: #rgbify(@base) []; // -> 30, 30, 46 -``` - -  - -### How can I inspect hard-to-grab elements? - -Paste the following snippet into your browser console, then trigger the event. Adjust the delay (in milliseconds) as needed. - -```js -setTimeout(function () { - debugger; -}, 3000); -``` - -![](https://i0.wp.com/css-tricks.com/wp-content/uploads/2017/02/debugger.gif?ssl=1) - -GIF via ["Set a Timed Debugger To Web Inspect Hard-To-Grab Elements" - CSS Tricks](https://css-tricks.com/set-timed-debugger-web-inspect-hard-grab-elements/). - -  - -### How do I theme code blocks / syntax highlighting? - -If a website uses [highlight.js](https://highlightjs.org/) or [Pygments](https://pygments.org/) for syntax highlighting, follow the steps for the syntax higlighter in use below. - -#### highlight.js - -Add the following line at the top of the userstyle, beneath the `@-moz-document` line. - -```css -@import url("https://unpkg.com/@catppuccin/highlightjs@0.2.2/css/catppuccin.variables.important.css"); -``` - -Then add the following lines beneath the color definition section (`@: @catppuccin[@@lookup][@];`) in the `#catppuccin` mixin: - -```css ---ctp-rosewater: #rgbify(@rosewater) []; ---ctp-flamingo: #rgbify(@flamingo) []; ---ctp-pink: #rgbify(@pink) []; ---ctp-mauve: #rgbify(@mauve) []; ---ctp-red: #rgbify(@red) []; ---ctp-maroon: #rgbify(@maroon) []; ---ctp-peach: #rgbify(@peach) []; ---ctp-yellow: #rgbify(@yellow) []; ---ctp-green: #rgbify(@green) []; ---ctp-teal: #rgbify(@teal) []; ---ctp-sky: #rgbify(@sky) []; ---ctp-sapphire: #rgbify(@sapphire) []; ---ctp-blue: #rgbify(@blue) []; ---ctp-lavender: #rgbify(@lavender) []; ---ctp-text: #rgbify(@text) []; ---ctp-subtext1: #rgbify(@subtext1) []; ---ctp-subtext0: #rgbify(@subtext0) []; ---ctp-overlay2: #rgbify(@overlay2) []; ---ctp-overlay1: #rgbify(@overlay1) []; ---ctp-overlay0: #rgbify(@overlay0) []; ---ctp-surface2: #rgbify(@surface2) []; ---ctp-surface1: #rgbify(@surface1) []; ---ctp-surface0: #rgbify(@surface0) []; ---ctp-base: #rgbify(@base) []; ---ctp-mantle: #rgbify(@mantle) []; ---ctp-crust: #rgbify(@crust) []; -``` - -Finally, add the [`#rbgify` mixin](#how-do-i-set-a-variable-to-rgb-values) above the `@catppuccin` color palette at the bottom of the userstyle. - -#### Pygments - -Add the following line at the top of the userstyle, beneath the `@-moz-document` line. - -```css -@import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); -``` - -You'll also need to add the following lines beneath the color definition section (`@: @catppuccin[@@lookup][@];`) in the `#catppuccin` mixin: - -```css ---ctp-rosewater: @rosewater; ---ctp-flamingo: @flamingo; ---ctp-pink: @pink; ---ctp-mauve: @mauve; ---ctp-red: @red; ---ctp-maroon: @maroon; ---ctp-peach: @peach; ---ctp-yellow: @yellow; ---ctp-green: @green; ---ctp-teal: @teal; ---ctp-sky: @sky; ---ctp-sapphire: @sapphire; ---ctp-blue: @blue; ---ctp-lavender: @lavender; ---ctp-text: @text; ---ctp-subtext1: @subtext1; ---ctp-subtext0: @subtext0; ---ctp-overlay2: @overlay2; ---ctp-overlay1: @overlay1; ---ctp-overlay0: @overlay0; ---ctp-surface2: @surface2; ---ctp-surface1: @surface1; ---ctp-surface0: @surface0; ---ctp-base: @base; ---ctp-mantle: @mantle; ---ctp-crust: @crust; -``` diff --git a/docs/tsconfig.json b/docs/tsconfig.json new file mode 100644 index 0000000000..8bf91d3bb9 --- /dev/null +++ b/docs/tsconfig.json @@ -0,0 +1,5 @@ +{ + "extends": "astro/tsconfigs/strict", + "include": [".astro/types.d.ts", "**/*"], + "exclude": ["dist"] +} diff --git a/docs/userstyle-creation.md b/docs/userstyle-creation.md deleted file mode 100644 index b234144a17..0000000000 --- a/docs/userstyle-creation.md +++ /dev/null @@ -1,53 +0,0 @@ -

-

๐ŸŽจ Userstyle Creation

-

- -

- Guidelines for requesting and creating userstyles. -

- -  - -### Table of Contents - - - -- [Requesting userstyles](#requesting-userstyles) -- [Creating userstyles](#creating-userstyles) - - - -### Requesting userstyles - -To request a website to be themed, please create a [Port Request](https://github.com/catppuccin/catppuccin/discussions/new?category=port-requests) discussion on [catppuccin/catppuccin](https://github.com/catppuccin/catppuccin). While this may seem odd, this ensures to keep all of our requests in one place and makes it easier for all people to request what they want without needing to learn what "Stylus" exactly is. - -**If you have already created a userstyle, please raise a -[Pull Request](https://github.com/catppuccin/userstyles/compare)!** - -  - -### Creating userstyles - -To create a userstyle, follow the instructions below. If you run into any difficulties or have any questions, please check our [Tips and tricks](./tips-and-tricks.md) page first. - -1. Fork this repository. -2. Create a new branch under the name `feat/`, (e.g. - `feat/nixos-search` instead of NixOS Search). -3. Create a new folder `styles/`. The name must be - `lower-kebab-case`. -4. Copy the contents of the [`template`](../template/) folder into - `styles/`. - - **The template uses [LESS](https://lesscss.org/#overview), a - preprocessor for Stylus. Please do not change this as we will only accept - userstyles based on the template.** -5. [Write the userstyle](./how-to-write-a-userstyle.md). -6. Edit the [`userstyles.yml`](../scripts/userstyles.yml) file and put in the details - of your port. **More details given in [`userstylesyml.md`](./userstylesyml.md).** -7. Create your image preview. - - Take a screenshot of the themed website in each flavor, **with the accent set to `mauve` (the default)**, and then convert all four images [to WebP](./tips-and-tricks.md#how-do-i-convert-preview-images-to-webp) (e.g. `mocha.webp`, - `macchiato.webp`, `frappe.webp` & `latte.webp`). - - Use [Catwalk](https://github.com/catppuccin/catwalk) to generate a - composite or grid image of all the images. **This must be saved as - `styles//preview.webp`.** -8. Raise a [pull request](https://github.com/catppuccin/userstyles/compare), - making sure to read and fill out the template properly. The title of your pull request should follow the format of `feat(): init`. diff --git a/docs/userstylesyml.md b/docs/userstylesyml.md deleted file mode 100644 index 364be45d38..0000000000 --- a/docs/userstylesyml.md +++ /dev/null @@ -1,143 +0,0 @@ -

-

๐Ÿ“– userstyles.yml

-

- -

- The userstyles.yml file is responsible for tracking all information about each userstyle. -

- -  - -### Table of Contents - - - -- [Adding a new userstyle](#adding-a-new-userstyle) -- [Adding yourself as a maintainer](#adding-yourself-as-a-maintainer) -- [Removing yourself as a maintainer](#removing-yourself-as-a-maintainer) - - -### Adding a new userstyle - -[`userstyles.schema.json`](../scripts/userstyles.schema.json) is the schema -specification for `userstyles.yml`. The properties in the following instructions are based -on the schema. Please refer to it for clarification. - -1. See [Adding yourself as a maintainer](#adding-yourself-as-a-maintainer). - -2. Locate the `userstyles` section and add your port to the list, following the - existing alphabetical order. - - You should make changes to everything wrapped in `<>` and remove the `<>` - characters. If you need help with any of the fields, refer to - other ports in the `userstyles.yml` file. If you would like extra guidance, - you can ask for help in the pull request or join our - [Discord](https://discord.com/servers/catppuccin-907385605422448742). - - `Required Fields:` - - ```yaml - : - name: - # Up to 3 categories are allowed, and having at least one is required. - # The first category is considered the "primary" category and impacts where the userstyle appears on the README. - categories: [] - color: - readme: - app-link: - current-maintainers: [*] - ``` - - `All Fields:` - - These extra `usage` & `faq` keys will ensure that you can add important - information about the port to the README. - - The `icon` key is best explained the schema specification itself. - - The `past-maintainers` key is a list of people who have maintained the port - in the past. We encourage all maintainers to add/remove themselves from this - list as they see fit. - - Remember that these 5 fields are **optional**. - - ```yaml - : - name: - categories: [, , ] - color: - icon: # OPTIONAL - readme: - app-link: "" - usage: |+ # OPTIONAL - > [!NOTE] - > - faq: # OPTIONAL - - question: - answer: - current-maintainers: [*] - past-maintainers: [*] # OPTIONAL - ``` - -### Adding yourself as a maintainer - -To add yourself as a maintainer, you need to add your GitHub username to the -`collaborators` array in the `userstyles.yml` file. This file is located in the -`scripts` directory. The `collaborators` array, is an array of objects, each -object should contain a `name` and a `url` key. And optionally a `name` key, -which is your preferred name. - -```yaml -collaborators: - - & - name: # OPTIONAL - url: https://github.com/ -``` - -Then you need to add your username to the `current-maintainers` array in for the -userstyle you want to maintain, in this case `youtube`. - -```yaml -userstyles: - youtube: - name: YouTube - categories: [entertainment, social_networking, photo_and_video] - icon: youtube - color: red - readme: - app-link: "https://youtube.com" - current-maintainers: [*isabelroses, *your-username] - past-maintainers: [*elkrien] -``` - -If the change is accepted, you will receive an invitation to the `catppuccin` organization, -and become a member of the [`userstyles-maintainers` team](https://github.com/orgs/catppuccin/teams/userstyles-maintainers). -As a maintainer you will be expected to: - -- Review and merge PRs for the userstyle you maintain. -- Keep the userstyle up to date with the latest changes. If you no longer wish to maintain a userstyle, see [Removing yourself as a maintainer](#removing-yourself-as-a-maintainer). -- Follow our code of conduct and guidelines. - -### Removing yourself as a maintainer - -To remove yourself as a maintainer, you will need to move your username from the -`current-maintainers` array to the `past-maintainers` array for each of the userstyles you no longer wish to maintain. In the example for YouTube below, the user `elkrien` has been moved from the `current-maintainers` array to the `past-maintainers` array. - -```diff -userstyles: - youtube: - name: YouTube - categories: [entertainment, social_networking, photo_and_video] - icon: youtube - color: red - readme: - app-link: "https://youtube.com" -- current-maintainers: [*isabelroses, *elkrien] -- past-maintainers: [] -+ current-maintainers: [*isabelroses] -+ past-maintainers: [*elkrien] - -If you would not like to be listed as a past maintainer, you can remove yourself from -`collaborators` array entirely. Upon removal, you will also be removed from the -`userstyles-maintainers` team. -``` diff --git a/flake.lock b/flake.lock index 867fba3576..1680966605 100644 --- a/flake.lock +++ b/flake.lock @@ -2,18 +2,15 @@ "nodes": { "nixpkgs": { "locked": { - "lastModified": 1719082008, - "narHash": "sha256-jHJSUH619zBQ6WdC21fFAlDxHErKVDJ5fpN0Hgx4sjs=", - "owner": "nixos", - "repo": "nixpkgs", - "rev": "9693852a2070b398ee123a329e68f0dab5526681", - "type": "github" + "lastModified": 315532800, + "narHash": "sha256-gVTEpnfY0A1e9++s9s6t26RMTQvRoWexvUGxYhbnzHg=", + "rev": "e4b09e47ace7d87de083786b404bf232eb6c89d8", + "type": "tarball", + "url": "https://releases.nixos.org/nixpkgs/nixpkgs-25.11pre809757.e4b09e47ace7/nixexprs.tar.xz?rev=e4b09e47ace7d87de083786b404bf232eb6c89d8" }, "original": { - "owner": "nixos", - "ref": "nixpkgs-unstable", - "repo": "nixpkgs", - "type": "github" + "type": "tarball", + "url": "https://channels.nixos.org/nixpkgs-unstable/nixexprs.tar.xz" } }, "root": { diff --git a/flake.nix b/flake.nix index e0ac402d28..9c249bf74c 100644 --- a/flake.nix +++ b/flake.nix @@ -1,7 +1,7 @@ { description = "Catppuccin userstyles"; - inputs.nixpkgs.url = "github:nixos/nixpkgs/nixpkgs-unstable"; + inputs.nixpkgs.url = "https://channels.nixos.org/nixpkgs-unstable/nixexprs.tar.xz"; outputs = { nixpkgs, ... }: diff --git a/lib/lib.less b/lib/lib.less new file mode 100644 index 0000000000..dab95f6028 --- /dev/null +++ b/lib/lib.less @@ -0,0 +1,2 @@ +// Standard library has migrated to a versioned syntax, see https://userstyles.catppuccin.com/contributing/reference/libraries/standard/#v1 for migration details and the latest documentation. +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; diff --git a/lib/std/v1.less b/lib/std/v1.less new file mode 100644 index 0000000000..63a5021d4e --- /dev/null +++ b/lib/std/v1.less @@ -0,0 +1,129 @@ +/* deno-fmt-ignore */ +@catppuccin: { + @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; + @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; + @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; + @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; +}; + +/* deno-fmt-ignore */ +@catppuccin-filters: { + @latte: { @rosewater: brightness(0) saturate(100%) invert(62%) sepia(42%) saturate(525%) hue-rotate(322deg) brightness(94%) contrast(82%); @flamingo: brightness(0) saturate(100%) invert(54%) sepia(48%) saturate(532%) hue-rotate(311deg) brightness(95%) contrast(82%); @pink: brightness(0) saturate(100%) invert(55%) sepia(54%) saturate(548%) hue-rotate(266deg) brightness(100%) contrast(83%); @mauve: brightness(0) saturate(100%) invert(26%) sepia(31%) saturate(3766%) hue-rotate(247deg) brightness(114%) contrast(114%); @red: brightness(0) saturate(100%) invert(28%) sepia(41%) saturate(3765%) hue-rotate(329deg) brightness(79%) contrast(110%); @maroon: brightness(0) saturate(100%) invert(51%) sepia(51%) saturate(3760%) hue-rotate(322deg) brightness(86%) contrast(111%); @peach: brightness(0) saturate(100%) invert(33%) sepia(99%) saturate(2022%) hue-rotate(4deg) brightness(118%) contrast(103%); @yellow: brightness(0) saturate(100%) invert(49%) sepia(94%) saturate(2020%) hue-rotate(0deg) brightness(120%) contrast(75%); @green: brightness(0) saturate(100%) invert(60%) sepia(63%) saturate(538%) hue-rotate(63deg) brightness(76%) contrast(90%); @teal: brightness(0) saturate(100%) invert(39%) sepia(67%) saturate(1026%) hue-rotate(144deg) brightness(95%) contrast(93%); @sky: brightness(0) saturate(100%) invert(53%) sepia(44%) saturate(3749%) hue-rotate(164deg) brightness(95%) contrast(97%); @sapphire: brightness(0) saturate(100%) invert(41%) sepia(70%) saturate(1021%) hue-rotate(151deg) brightness(103%) contrast(78%); @blue: brightness(0) saturate(100%) invert(30%) sepia(36%) saturate(3759%) hue-rotate(209deg) brightness(103%) contrast(110%); @lavender: brightness(0) saturate(100%) invert(48%) sepia(34%) saturate(3762%) hue-rotate(213deg) brightness(108%) contrast(110%); @text: brightness(0) saturate(100%) invert(43%) sepia(43%) saturate(515%) hue-rotate(196deg) brightness(49%) contrast(68%); @subtext1: brightness(0) saturate(100%) invert(63%) sepia(28%) saturate(515%) hue-rotate(196deg) brightness(48%) contrast(67%); @subtext0: brightness(0) saturate(100%) invert(65%) sepia(15%) saturate(535%) hue-rotate(195deg) brightness(63%) contrast(82%); @overlay2: brightness(0) saturate(100%) invert(63%) sepia(20%) saturate(521%) hue-rotate(195deg) brightness(76%) contrast(47%); @overlay1: brightness(0) saturate(100%) invert(72%) sepia(10%) saturate(534%) hue-rotate(195deg) brightness(81%) contrast(70%); @overlay0: brightness(0) saturate(100%) invert(82%) sepia(25%) saturate(510%) hue-rotate(196deg) brightness(92%) contrast(45%); @surface2: brightness(0) saturate(100%) invert(84%) sepia(6%) saturate(528%) hue-rotate(189deg) brightness(88%) contrast(76%); @surface1: brightness(0) saturate(100%) invert(93%) sepia(24%) saturate(506%) hue-rotate(182deg) brightness(86%) contrast(83%); @surface0: brightness(0) saturate(100%) invert(94%) sepia(22%) saturate(523%) hue-rotate(179deg) brightness(96%) contrast(76%); @base: brightness(0) saturate(100%) invert(91%) sepia(37%) saturate(521%) hue-rotate(181deg) brightness(106%) contrast(94%); @mantle: brightness(0) saturate(100%) invert(89%) sepia(26%) saturate(508%) hue-rotate(188deg) brightness(107%) contrast(90%); @crust: brightness(0) saturate(100%) invert(84%) sepia(32%) saturate(502%) hue-rotate(192deg) brightness(111%) contrast(84%); }; + @frappe: { @rosewater: brightness(0) saturate(100%) invert(80%) sepia(22%) saturate(510%) hue-rotate(315deg) brightness(113%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(78%) sepia(26%) saturate(512%) hue-rotate(311deg) brightness(106%) contrast(86%); @pink: brightness(0) saturate(100%) invert(80%) sepia(22%) saturate(532%) hue-rotate(277deg) brightness(100%) contrast(91%); @mauve: brightness(0) saturate(100%) invert(69%) sepia(37%) saturate(513%) hue-rotate(224deg) brightness(95%) contrast(90%); @red: brightness(0) saturate(100%) invert(58%) sepia(41%) saturate(524%) hue-rotate(310deg) brightness(97%) contrast(85%); @maroon: brightness(0) saturate(100%) invert(67%) sepia(34%) saturate(522%) hue-rotate(309deg) brightness(100%) contrast(83%); @peach: brightness(0) saturate(100%) invert(64%) sepia(32%) saturate(511%) hue-rotate(336deg) brightness(100%) contrast(97%); @yellow: brightness(0) saturate(100%) invert(78%) sepia(25%) saturate(512%) hue-rotate(359deg) brightness(107%) contrast(79%); @green: brightness(0) saturate(100%) invert(84%) sepia(25%) saturate(547%) hue-rotate(49deg) brightness(93%) contrast(82%); @teal: brightness(0) saturate(100%) invert(82%) sepia(21%) saturate(545%) hue-rotate(122deg) brightness(90%) contrast(81%); @sky: brightness(0) saturate(100%) invert(87%) sepia(24%) saturate(513%) hue-rotate(149deg) brightness(92%) contrast(85%); @sapphire: brightness(0) saturate(100%) invert(76%) sepia(32%) saturate(529%) hue-rotate(166deg) brightness(93%) contrast(85%); @blue: brightness(0) saturate(100%) invert(65%) sepia(33%) saturate(518%) hue-rotate(185deg) brightness(96%) contrast(94%); @lavender: brightness(0) saturate(100%) invert(75%) sepia(33%) saturate(509%) hue-rotate(201deg) brightness(96%) contrast(97%); @text: brightness(0) saturate(100%) invert(83%) sepia(29%) saturate(508%) hue-rotate(192deg) brightness(97%) contrast(98%); @subtext1: brightness(0) saturate(100%) invert(81%) sepia(13%) saturate(517%) hue-rotate(190deg) brightness(95%) contrast(85%); @subtext0: brightness(0) saturate(100%) invert(78%) sepia(16%) saturate(515%) hue-rotate(191deg) brightness(95%) contrast(68%); @overlay2: brightness(0) saturate(100%) invert(70%) sepia(17%) saturate(520%) hue-rotate(191deg) brightness(91%) contrast(70%); @overlay1: brightness(0) saturate(100%) invert(73%) sepia(19%) saturate(514%) hue-rotate(189deg) brightness(75%) contrast(69%); @overlay0: brightness(0) saturate(100%) invert(57%) sepia(28%) saturate(505%) hue-rotate(192deg) brightness(75%) contrast(57%); @surface2: brightness(0) saturate(100%) invert(55%) sepia(26%) saturate(532%) hue-rotate(191deg) brightness(62%) contrast(64%); @surface1: brightness(0) saturate(100%) invert(39%) sepia(39%) saturate(506%) hue-rotate(190deg) brightness(59%) contrast(63%); @surface0: brightness(0) saturate(100%) invert(11%) sepia(65%) saturate(1032%) hue-rotate(204deg) brightness(86%) contrast(58%); @base: brightness(0) saturate(100%) invert(11%) sepia(75%) saturate(1023%) hue-rotate(204deg) brightness(60%) contrast(70%); @mantle: brightness(0) saturate(100%) invert(47%) sepia(27%) saturate(530%) hue-rotate(194deg) brightness(31%) contrast(94%); @crust: brightness(0) saturate(100%) invert(30%) sepia(27%) saturate(523%) hue-rotate(194deg) brightness(43%) contrast(96%); }; + @macchiato: { @rosewater: brightness(0) saturate(100%) invert(83%) sepia(22%) saturate(509%) hue-rotate(314deg) brightness(113%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(78%) sepia(22%) saturate(512%) hue-rotate(311deg) brightness(109%) contrast(88%); @pink: brightness(0) saturate(100%) invert(75%) sepia(23%) saturate(509%) hue-rotate(279deg) brightness(109%) contrast(91%); @mauve: brightness(0) saturate(100%) invert(61%) sepia(70%) saturate(1021%) hue-rotate(210deg) brightness(109%) contrast(93%); @red: brightness(0) saturate(100%) invert(54%) sepia(37%) saturate(528%) hue-rotate(301deg) brightness(110%) contrast(87%); @maroon: brightness(0) saturate(100%) invert(66%) sepia(32%) saturate(496%) hue-rotate(306deg) brightness(99%) contrast(89%); @peach: brightness(0) saturate(100%) invert(69%) sepia(34%) saturate(532%) hue-rotate(335deg) brightness(101%) contrast(91%); @yellow: brightness(0) saturate(100%) invert(87%) sepia(19%) saturate(527%) hue-rotate(0deg) brightness(96%) contrast(93%); @green: brightness(0) saturate(100%) invert(86%) sepia(26%) saturate(541%) hue-rotate(53deg) brightness(100%) contrast(75%); @teal: brightness(0) saturate(100%) invert(85%) sepia(22%) saturate(544%) hue-rotate(117deg) brightness(96%) contrast(78%); @sky: brightness(0) saturate(100%) invert(84%) sepia(28%) saturate(526%) hue-rotate(147deg) brightness(98%) contrast(81%); @sapphire: brightness(0) saturate(100%) invert(75%) sepia(42%) saturate(530%) hue-rotate(168deg) brightness(93%) contrast(91%); @blue: brightness(0) saturate(100%) invert(65%) sepia(33%) saturate(519%) hue-rotate(182deg) brightness(98%) contrast(94%); @lavender: brightness(0) saturate(100%) invert(73%) sepia(33%) saturate(510%) hue-rotate(199deg) brightness(98%) contrast(99%); @text: brightness(0) saturate(100%) invert(73%) sepia(80%) saturate(1008%) hue-rotate(190deg) brightness(120%) contrast(92%); @subtext1: brightness(0) saturate(100%) invert(78%) sepia(12%) saturate(515%) hue-rotate(191deg) brightness(101%) contrast(81%); @subtext0: brightness(0) saturate(100%) invert(78%) sepia(15%) saturate(521%) hue-rotate(190deg) brightness(95%) contrast(70%); @overlay2: brightness(0) saturate(100%) invert(69%) sepia(16%) saturate(521%) hue-rotate(192deg) brightness(90%) contrast(72%); @overlay1: brightness(0) saturate(100%) invert(68%) sepia(16%) saturate(523%) hue-rotate(191deg) brightness(77%) contrast(80%); @overlay0: brightness(0) saturate(100%) invert(68%) sepia(18%) saturate(535%) hue-rotate(194deg) brightness(63%) contrast(78%); @surface2: brightness(0) saturate(100%) invert(52%) sepia(34%) saturate(510%) hue-rotate(193deg) brightness(54%) contrast(61%); @surface1: brightness(0) saturate(100%) invert(46%) sepia(36%) saturate(516%) hue-rotate(194deg) brightness(46%) contrast(72%); @surface0: brightness(0) saturate(100%) invert(41%) sepia(39%) saturate(513%) hue-rotate(194deg) brightness(39%) contrast(82%); @base: brightness(0) saturate(100%) invert(34%) sepia(36%) saturate(527%) hue-rotate(195deg) brightness(38%) contrast(95%); @mantle: brightness(0) saturate(100%) invert(29%) sepia(42%) saturate(541%) hue-rotate(198deg) brightness(30%) contrast(92%); @crust: brightness(0) saturate(100%) invert(27%) sepia(45%) saturate(543%) hue-rotate(200deg) brightness(25%) contrast(93%); }; + @mocha: { @rosewater: brightness(0) saturate(100%) invert(84%) sepia(22%) saturate(508%) hue-rotate(312deg) brightness(113%) contrast(91%); @flamingo: brightness(0) saturate(100%) invert(79%) sepia(23%) saturate(510%) hue-rotate(311deg) brightness(110%) contrast(90%); @pink: brightness(0) saturate(100%) invert(76%) sepia(28%) saturate(508%) hue-rotate(290deg) brightness(112%) contrast(92%); @mauve: brightness(0) saturate(100%) invert(63%) sepia(71%) saturate(1021%) hue-rotate(208deg) brightness(110%) contrast(94%); @red: brightness(0) saturate(100%) invert(61%) sepia(33%) saturate(540%) hue-rotate(293deg) brightness(101%) contrast(90%); @maroon: brightness(0) saturate(100%) invert(70%) sepia(25%) saturate(536%) hue-rotate(301deg) brightness(100%) contrast(84%); @peach: brightness(0) saturate(100%) invert(73%) sepia(36%) saturate(519%) hue-rotate(332deg) brightness(100%) contrast(93%); @yellow: brightness(0) saturate(100%) invert(85%) sepia(27%) saturate(512%) hue-rotate(336deg) brightness(108%) contrast(96%); @green: brightness(0) saturate(100%) invert(86%) sepia(22%) saturate(538%) hue-rotate(63deg) brightness(97%) contrast(88%); @teal: brightness(0) saturate(100%) invert(90%) sepia(24%) saturate(532%) hue-rotate(105deg) brightness(95%) contrast(85%); @sky: brightness(0) saturate(100%) invert(81%) sepia(27%) saturate(522%) hue-rotate(141deg) brightness(99%) contrast(86%); @sapphire: brightness(0) saturate(100%) invert(73%) sepia(43%) saturate(529%) hue-rotate(166deg) brightness(95%) contrast(93%); @blue: brightness(0) saturate(100%) invert(57%) sepia(66%) saturate(1020%) hue-rotate(195deg) brightness(115%) contrast(96%); @lavender: brightness(0) saturate(100%) invert(68%) sepia(33%) saturate(517%) hue-rotate(197deg) brightness(105%) contrast(98%); @text: brightness(0) saturate(100%) invert(75%) sepia(82%) saturate(1008%) hue-rotate(189deg) brightness(120%) contrast(90%); @subtext1: brightness(0) saturate(100%) invert(81%) sepia(11%) saturate(522%) hue-rotate(191deg) brightness(100%) contrast(81%); @subtext0: brightness(0) saturate(100%) invert(79%) sepia(13%) saturate(517%) hue-rotate(191deg) brightness(93%) contrast(71%); @overlay2: brightness(0) saturate(100%) invert(70%) sepia(13%) saturate(523%) hue-rotate(191deg) brightness(88%) contrast(75%); @overlay1: brightness(0) saturate(100%) invert(61%) sepia(17%) saturate(527%) hue-rotate(193deg) brightness(85%) contrast(66%); @overlay0: brightness(0) saturate(100%) invert(67%) sepia(15%) saturate(533%) hue-rotate(193deg) brightness(62%) contrast(82%); @surface2: brightness(0) saturate(100%) invert(58%) sepia(30%) saturate(515%) hue-rotate(196deg) brightness(45%) contrast(62%); @surface1: brightness(0) saturate(100%) invert(44%) sepia(36%) saturate(521%) hue-rotate(198deg) brightness(39%) contrast(70%); @surface0: brightness(0) saturate(100%) invert(10%) sepia(79%) saturate(1035%) hue-rotate(212deg) brightness(62%) contrast(70%); @base: brightness(0) saturate(100%) invert(7%) sepia(23%) saturate(3759%) hue-rotate(219deg) brightness(67%) contrast(84%); @mantle: brightness(0) saturate(100%) invert(22%) sepia(29%) saturate(493%) hue-rotate(204deg) brightness(44%) contrast(102%); @crust: brightness(0) saturate(100%) invert(25%) sepia(44%) saturate(549%) hue-rotate(204deg) brightness(18%) contrast(96%); }; +}; + +#lib { + .palette() { + @rosewater: @catppuccin[@@flavor][@rosewater]; + @flamingo: @catppuccin[@@flavor][@flamingo]; + @pink: @catppuccin[@@flavor][@pink]; + @mauve: @catppuccin[@@flavor][@mauve]; + @red: @catppuccin[@@flavor][@red]; + @maroon: @catppuccin[@@flavor][@maroon]; + @peach: @catppuccin[@@flavor][@peach]; + @yellow: @catppuccin[@@flavor][@yellow]; + @green: @catppuccin[@@flavor][@green]; + @teal: @catppuccin[@@flavor][@teal]; + @sky: @catppuccin[@@flavor][@sky]; + @sapphire: @catppuccin[@@flavor][@sapphire]; + @blue: @catppuccin[@@flavor][@blue]; + @lavender: @catppuccin[@@flavor][@lavender]; + @text: @catppuccin[@@flavor][@text]; + @subtext1: @catppuccin[@@flavor][@subtext1]; + @subtext0: @catppuccin[@@flavor][@subtext0]; + @overlay2: @catppuccin[@@flavor][@overlay2]; + @overlay1: @catppuccin[@@flavor][@overlay1]; + @overlay0: @catppuccin[@@flavor][@overlay0]; + @surface2: @catppuccin[@@flavor][@surface2]; + @surface1: @catppuccin[@@flavor][@surface1]; + @surface0: @catppuccin[@@flavor][@surface0]; + @base: @catppuccin[@@flavor][@base]; + @mantle: @catppuccin[@@flavor][@mantle]; + @crust: @catppuccin[@@flavor][@crust]; + @accent: @catppuccin[@@flavor][@@accentColor]; + + @rosewater-filter: @catppuccin-filters[@@flavor][@rosewater]; + @flamingo-filter: @catppuccin-filters[@@flavor][@flamingo]; + @pink-filter: @catppuccin-filters[@@flavor][@pink]; + @mauve-filter: @catppuccin-filters[@@flavor][@mauve]; + @red-filter: @catppuccin-filters[@@flavor][@red]; + @maroon-filter: @catppuccin-filters[@@flavor][@maroon]; + @peach-filter: @catppuccin-filters[@@flavor][@peach]; + @yellow-filter: @catppuccin-filters[@@flavor][@yellow]; + @green-filter: @catppuccin-filters[@@flavor][@green]; + @teal-filter: @catppuccin-filters[@@flavor][@teal]; + @sky-filter: @catppuccin-filters[@@flavor][@sky]; + @sapphire-filter: @catppuccin-filters[@@flavor][@sapphire]; + @blue-filter: @catppuccin-filters[@@flavor][@blue]; + @lavender-filter: @catppuccin-filters[@@flavor][@lavender]; + @text-filter: @catppuccin-filters[@@flavor][@text]; + @subtext1-filter: @catppuccin-filters[@@flavor][@subtext1]; + @subtext0-filter: @catppuccin-filters[@@flavor][@subtext0]; + @overlay2-filter: @catppuccin-filters[@@flavor][@overlay2]; + @overlay1-filter: @catppuccin-filters[@@flavor][@overlay1]; + @overlay0-filter: @catppuccin-filters[@@flavor][@overlay0]; + @surface2-filter: @catppuccin-filters[@@flavor][@surface2]; + @surface1-filter: @catppuccin-filters[@@flavor][@surface1]; + @surface0-filter: @catppuccin-filters[@@flavor][@surface0]; + @base-filter: @catppuccin-filters[@@flavor][@base]; + @mantle-filter: @catppuccin-filters[@@flavor][@mantle]; + @crust-filter: @catppuccin-filters[@@flavor][@crust]; + @accent-filter: @catppuccin-filters[@@flavor][@@accentColor]; + } + + .defaults() { + color-scheme: if(@flavor = latte, light, dark); + + ::selection { + background-color: fade(@accent, 30%); + } + + input, + textarea { + &::placeholder { + color: @subtext0 !important; + } + } + } + + .rgbify(@color) { + @rgb: red(@color), green(@color), blue(@color); + } + + .hslify(@color) { + @raw: e( + %("%s, %s%, %s%", hue(@color), saturation(@color), lightness(@color)) + ); + } + + .css-variables() { + --ctp-rosewater: @rosewater; + --ctp-flamingo: @flamingo; + --ctp-pink: @pink; + --ctp-mauve: @mauve; + --ctp-red: @red; + --ctp-maroon: @maroon; + --ctp-peach: @peach; + --ctp-yellow: @yellow; + --ctp-green: @green; + --ctp-teal: @teal; + --ctp-sky: @sky; + --ctp-sapphire: @sapphire; + --ctp-blue: @blue; + --ctp-lavender: @lavender; + --ctp-text: @text; + --ctp-subtext1: @subtext1; + --ctp-subtext0: @subtext0; + --ctp-overlay2: @overlay2; + --ctp-overlay1: @overlay1; + --ctp-overlay0: @overlay0; + --ctp-surface2: @surface2; + --ctp-surface1: @surface1; + --ctp-surface0: @surface0; + --ctp-base: @base; + --ctp-mantle: @mantle; + --ctp-crust: @crust; + } +} diff --git a/renovate.json b/renovate.json deleted file mode 100644 index b667acb238..0000000000 --- a/renovate.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "$schema": "https://docs.renovatebot.com/renovate-schema.json", - "extends": ["local>catppuccin/renovate-config"] -} diff --git a/renovate.json5 b/renovate.json5 new file mode 100644 index 0000000000..ffddb0785a --- /dev/null +++ b/renovate.json5 @@ -0,0 +1,11 @@ +{ + $schema: "https://docs.renovatebot.com/renovate-schema.json", + extends: ["local>catppuccin/renovate-config", "helpers:pinGitHubActionDigests"], + packageRules: [ + // Deno keep releasing minor/patch releases for doc updates so disabling updates to the standard lib + { + matchPackageNames: ["/^@jsr/std__/"], + enabled: false, + }, + ], +} diff --git a/scripts/_prettier.ts b/scripts/_prettier.ts deleted file mode 100644 index f23645d5b2..0000000000 --- a/scripts/_prettier.ts +++ /dev/null @@ -1 +0,0 @@ -import "npm:prettier@3.2.4"; diff --git a/scripts/bump-version/calver.test.ts b/scripts/bump-version/calver.test.ts new file mode 100644 index 0000000000..a193df868e --- /dev/null +++ b/scripts/bump-version/calver.test.ts @@ -0,0 +1,51 @@ +import { CalVer } from "@/bump-version/calver.ts"; + +import { assertEquals } from "@std/assert"; + +Deno.test({ + name: "constructor", + fn() { + const calver = new CalVer("2000.01.01"); + assertEquals(calver.toString(), "2000.01.01"); + }, +}); + +Deno.test({ + name: "incrementWith", + fn() { + const calver = new CalVer("2000.01.01"); + calver.incrementWith(new Date("2000-01-01")); + assertEquals(calver.toString(), "2000.01.01.1"); + calver.incrementWith(new Date("2000-01-01")); + assertEquals(calver.toString(), "2000.01.01.2"); + calver.incrementWith(new Date("2000-01-02")); + assertEquals(calver.toString(), "2000.01.02"); + }, +}); + +Deno.test({ + name: "incrementWith - new year", + fn() { + const calver = new CalVer("2000.12.31"); + calver.incrementWith(new Date("2001-01-01")); + assertEquals(calver.toString(), "2001.01.01"); + }, +}); + +Deno.test({ + name: "incrementWith - new month", + fn() { + const calver = new CalVer("2000.01.31"); + calver.incrementWith(new Date("2000-02-01")); + assertEquals(calver.toString(), "2000.02.01"); + }, +}); + +Deno.test({ + name: "incrementWith - earlier date", + fn() { + const calver = new CalVer("2000.01.01"); + calver.incrementWith(new Date("1999-12-31")); + assertEquals(calver.toString(), "1999.12.31"); + }, +}); diff --git a/scripts/bump-version/calver.ts b/scripts/bump-version/calver.ts new file mode 100644 index 0000000000..209e4bdd38 --- /dev/null +++ b/scripts/bump-version/calver.ts @@ -0,0 +1,37 @@ +export class CalVer { + year: number; + month: number; + day: number; + micro?: number; + + constructor(date: string) { + const [year, month, day, micro] = date.split(".").map((num) => + Number.parseInt(num) + ); + this.year = year; + this.month = month; + this.day = day; + this.micro = micro ?? undefined; + } + + toString() { + return `${this.year}.${this.month.toString().padStart(2, "0")}.${ + this.day.toString().padStart(2, "0") + }${this.micro ? "." + this.micro : ""}`; + } + + incrementWith(date: Date) { + const year = date.getUTCFullYear(); + const month = date.getUTCMonth() + 1; + const day = date.getUTCDate(); + + if (this.year === year && this.month === month && this.day === day) { + this.micro = (this.micro ?? 0) + 1; + } else { + this.year = year; + this.month = month; + this.day = day; + this.micro = undefined; + } + } +} diff --git a/scripts/bump-version/main.ts b/scripts/bump-version/main.ts new file mode 100644 index 0000000000..7c3b038af7 --- /dev/null +++ b/scripts/bump-version/main.ts @@ -0,0 +1,55 @@ +import * as path from "@std/path"; + +import { REPO_ROOT } from "@/constants.ts"; +import { CalVer } from "@/bump-version/calver.ts"; +import { parseArgs } from "@std/cli"; +import { getUserstylesFiles } from "@/utils.ts"; + +const args = parseArgs(Deno.args, { boolean: ["all"] }); + +if (!Deno.env.get("CI") && !args.all) { + throw new Error( + "This script should only be used in CI. Userstyle versions are automatically bumped after pull requests are merged.", + ); +} + +let files = []; + +if (args.all) { + files = getUserstylesFiles(); +} else { + files = args._.filter((val) => typeof val == "string").map((p: string) => + path.join(REPO_ROOT, p) + ); +} + +for ( + const file of files +) { + const content = await Deno.readTextFile(file); + + const metadataMatches = content.match( + /^\/\*\s*==UserStyle==[\s\S]*?==\/UserStyle==\s*\*\//, + ); + if (!metadataMatches) { + throw new Error(`No metadata found in ${file}`); + } + const metadata = metadataMatches[0]; + const post = content.slice(metadata.length); + + const versionMatches = metadata.match(/@version(\s+)(.*)/); + if (!versionMatches) { + throw new Error(`No version found in ${file}`); + } + const whitespace = versionMatches[1]; + + const version = new CalVer(versionMatches[2]); + version.incrementWith(new Date()); + + const newContent = metadata.replace( + /@version\s+.*/, + `@version${whitespace}${version.toString()}`, + ) + post; + + await Deno.writeTextFile(file, newContent); +} diff --git a/scripts/constants.ts b/scripts/constants.ts new file mode 100644 index 0000000000..0189475e68 --- /dev/null +++ b/scripts/constants.ts @@ -0,0 +1,18 @@ +import CATEGORIES_SCHEMA from "@catppuccin/catppuccin/resources/categories.schema.json" with { + type: "json", +}; +import USERSTYLES_SCHEMA from "@/userstyles.schema.json" with { + type: "json", +}; + +import * as path from "@std/path"; + +const ROOT = import.meta.dirname; +if (!ROOT) throw new Error("ROOT was not located."); + +/** + * Absolute path to the repository. + */ +export const REPO_ROOT = path.join(ROOT, ".."); + +export { CATEGORIES_SCHEMA, USERSTYLES_SCHEMA }; diff --git a/scripts/deps.ts b/scripts/deps.ts deleted file mode 100644 index 295b92de45..0000000000 --- a/scripts/deps.ts +++ /dev/null @@ -1,20 +0,0 @@ -import portsSchema from "catppuccin-repo/resources/ports.schema.json" with { - type: "json", -}; -import userStylesSchema from "@/userstyles.schema.json" with { - type: "json", -}; - -import { join } from "@std/path"; - -const ROOT = import.meta.dirname; -if (!ROOT) { - throw new Error("ROOT was not located."); -} - -/** - * absolute path to the repository - */ -export const REPO_ROOT = join(ROOT, ".."); - -export { portsSchema, userStylesSchema }; diff --git a/scripts/generate/labels.ts b/scripts/generate/labels.ts index 56bed9a39f..0d5feac6f1 100644 --- a/scripts/generate/labels.ts +++ b/scripts/generate/labels.ts @@ -1,10 +1,11 @@ -import { join } from "@std/path"; +import type { UserstylesSchema } from "@/types/mod.ts"; +import { REPO_ROOT } from "@/constants.ts"; + +import * as path from "@std/path"; +import * as yaml from "@std/yaml"; -import { REPO_ROOT } from "@/deps.ts"; -import { updateFile } from "@/generate/utils.ts"; -import { UserStylesSchema } from "@/types/mod.ts"; -import { stringify } from "@std/yaml"; import { type ColorName, flavors } from "@catppuccin/palette"; +import { writeWithPreamble } from "@/generate/utils.ts"; /** * Macchiato color definitions as hex values. @@ -15,60 +16,83 @@ const macchiatoHex = flavors.macchiato.colorEntries return acc; }, {} as Record); -const toIssueLabel = (slug: string | number) => `lbl:${slug}`; +const toIssueLabel = (key: string) => `lbl:${key}`; + +const toIssueLabelRegex = (key: string) => `/${toIssueLabel(key)}(,.*)?$/gm`; + +const toPrLabel = (key: string) => `styles/${key}/**/*`; -export const syncIssueLabels = async ( - userstyles: UserStylesSchema.Userstyles, -) => { - updateFile( - join(REPO_ROOT, ".github/issue-labeler.yml"), - stringify( +export async function syncIssueLabels(userstyles: UserstylesSchema.Userstyles) { + // .github/issue-labeler.yml + await writeWithPreamble( + path.join(REPO_ROOT, ".github/issue-labeler.yml"), + yaml.stringify( Object.entries(userstyles) - .reduce((acc, [key]) => { - acc[key.toString()] = [`/${toIssueLabel(key)}(,.*)?$/gm`]; + .reduce((acc, [key, { supports }]) => { + acc[key.toString()] = [toIssueLabelRegex(key)]; + Object.keys(supports ?? {}).forEach((key) => { + acc[key.toString()] = [toIssueLabelRegex(key)]; + }); return acc; }, {} as Record), ), ); - const userstyleIssueContent = Deno.readTextFileSync(join( + // .github/ISSUE_TEMPLATE/userstyle.yml + const userstyleIssueTemplate = Deno.readTextFileSync(path.join( REPO_ROOT, "scripts/generate/templates/userstyle-issue.yml", )); - Deno.writeTextFileSync( - join(REPO_ROOT, ".github/ISSUE_TEMPLATE/userstyle.yml"), - userstyleIssueContent.replace( + await Deno.writeTextFile( + path.join(REPO_ROOT, ".github/ISSUE_TEMPLATE/userstyle.yml"), + userstyleIssueTemplate.replace( `"$LABELS"`, `${ Object.entries(userstyles) - .map(([key]) => `"${toIssueLabel(key)}"`) + .flatMap(([slug, { supports }]) => + [slug, ...Object.keys(supports ?? {})].map((key) => + `"${toIssueLabel(key)}"` + ) + ) + .sort() .join(", ") }`, ), ); // .github/pr-labeler.yml - updateFile( - join(REPO_ROOT, ".github/pr-labeler.yml"), - stringify( + await writeWithPreamble( + path.join(REPO_ROOT, ".github/pr-labeler.yml"), + yaml.stringify( Object.entries(userstyles) - .reduce((acc, [key]) => { - acc[`${key}`] = `styles/${key}/**/*`; + .reduce((acc, [key, { supports }]) => { + acc[key] = toPrLabel(key); + Object.keys(supports ?? {}).forEach((supportedKey) => { + acc[supportedKey] = toPrLabel(key); + }); return acc; }, {} as Record), ), ); // .github/labels.yml - const syncLabelsContent = Object.entries(userstyles) - .map(([slug, style]) => { - return { - name: slug, - description: [style.name].flat().join(", "), - color: style.color ? macchiatoHex[style.color] : macchiatoHex.blue, - }; - }); - const syncLabels = join(REPO_ROOT, ".github/labels.yml"); - // deno-lint-ignore no-explicit-any - await updateFile(syncLabels, stringify(syncLabelsContent as any)); -}; + await writeWithPreamble( + path.join(REPO_ROOT, ".github/labels.yml"), + yaml.stringify( + Object.entries(userstyles).flatMap(([key, style]) => [ + { + name: key, + description: style.name, + color: style.color ? macchiatoHex[style.color] : macchiatoHex.blue, + }, + ...Object.entries(style.supports ?? {}).map(( + [supportedKey, { name }], + ) => ({ + name: supportedKey, + description: name, + color: style.color ? macchiatoHex[style.color] : macchiatoHex.blue, + })), + ]), + ), + ); +} diff --git a/scripts/generate/main.ts b/scripts/generate/main.ts index 48e58f6b81..4038b53da9 100755 --- a/scripts/generate/main.ts +++ b/scripts/generate/main.ts @@ -1,41 +1,23 @@ -#!/usr/bin/env -S deno run -A -import { join } from "@std/path"; -import { portsSchema, REPO_ROOT, userStylesSchema } from "@/deps.ts"; -import type { PortsSchema, UserStylesSchema } from "@/types/mod.ts"; +import * as path from "@std/path"; +import { REPO_ROOT } from "@/constants.ts"; import { syncIssueLabels } from "@/generate/labels.ts"; -import { generateMainReadme } from "@/generate/readme-repo.ts"; import { generateStyleReadmes } from "@/generate/readme-styles.ts"; -import { updateFile } from "@/generate/utils.ts"; -import { validateYaml } from "@/utils.ts"; +import { writeWithPreamble } from "@/generate/utils.ts"; +import { + getAuthenticatedOctokit, + getUserstylesData, + getUserstylesTeamMembers, +} from "@/utils.ts"; -const userstylesYaml = Deno.readTextFileSync( - join(REPO_ROOT, "scripts/userstyles.yml"), -); -const portsYaml = await fetch( - "https://raw.githubusercontent.com/catppuccin/catppuccin/main/resources/ports.yml", -).then((res) => res.text()); - -const [portsData, userstylesData] = await Promise.all([ - await validateYaml( - portsYaml, - portsSchema, - ), - await validateYaml( - userstylesYaml, - userStylesSchema, - ), -]); - -if (!userstylesData.userstyles) { - console.error("No userstyles found"); - Deno.exit(1); +if (!Deno.env.get("CI")) { + throw new Error( + "This script should only be used in CI. Generated READMEs and other health files are automatically updated after pull requests are merged.", + ); } -/** - * Generate the main README.md, listing all ports as a table of contents - */ -await generateMainReadme(userstylesData.userstyles, portsData); +const userstylesData = getUserstylesData(); + /** * Generate README.md files for each style */ @@ -52,24 +34,36 @@ await syncIssueLabels(userstylesData.userstyles); /** * Keep `.github/CODEOWNERS` in sync with the userstyle metadata. */ -const maintainersCodeOwners = () => { +function maintainersCodeOwners() { return Object.entries(userstylesData.userstyles!) .filter(([_, { "current-maintainers": currentMaintainers }]) => currentMaintainers.length > 0 ) .map(([slug, { "current-maintainers": currentMaintainers }]) => { const codeOwners = currentMaintainers - .map((maintainer) => `@${maintainer.url.split("/").pop()}`) + .map((name) => `@${name}`) .join(" "); return `/styles/${slug} ${codeOwners}`; }) .join("\n"); -}; -const userstylesStaffCodeOwners = () => { - const paths = ["/.github/", "/scripts/", "/template/"]; - return paths.map((path) => `${path} @catppuccin/userstyles-staff`).join("\n"); -}; -await updateFile( - join(REPO_ROOT, ".github/CODEOWNERS"), - `${maintainersCodeOwners()}\n\n${userstylesStaffCodeOwners()}`, +} +async function userstylesStaffCodeOwners() { + const paths = ["/.github/", "/scripts/", "/template/", "/lib/"]; + + const octokit = getAuthenticatedOctokit(); + // Set codeowners to include each member of the userstyles-staff team specifically instead of the team as a whole, + // to require individual reviews from each member instead of just one on behalf of the team. + const staffMembers = await getUserstylesTeamMembers( + octokit, + "userstyles-staff", + ); + return paths.map((path) => + `${path} ${staffMembers.map((member) => "@" + member).join(" ")}` + ).join( + "\n", + ); +} +await writeWithPreamble( + path.join(REPO_ROOT, ".github/CODEOWNERS"), + `${maintainersCodeOwners()}\n\n${await userstylesStaffCodeOwners()}`, ); diff --git a/scripts/generate/readme-repo.ts b/scripts/generate/readme-repo.ts deleted file mode 100644 index 652322d2e4..0000000000 --- a/scripts/generate/readme-repo.ts +++ /dev/null @@ -1,78 +0,0 @@ -import { join } from "@std/path"; -import Handlebars from "handlebars"; - -import { REPO_ROOT } from "@/deps.ts"; -import { PortsSchema, UserStylesSchema } from "@/types/mod.ts"; -import { updateFile, updateReadme } from "@/generate/utils.ts"; - -type MappedPorts = { - [k: string]: ( - UserStylesSchema.Userstyle & { path: string } - )[]; -}; - -export const generateMainReadme = async ( - userstyles: UserStylesSchema.Userstyles, - portsData: PortsSchema.PortsSchema, -) => { - if (!portsData.categories) throw ("Ports data is missing categories"); - - const categorized = Object.entries(userstyles) - .reduce((acc, [slug, { categories, ...port }]) => { - // initialize category array if it doesn't exist - // only care about the first (primary) category in the categories array - acc[categories[0]] ??= []; - - acc[categories[0]].push({ path: `styles/${slug}`, categories, ...port }); - - // Sort by name, first array entry if necessary - acc[categories[0]].sort((a, b) => - [a.name].flat()[0].localeCompare([b.name].flat()[0]) - ); - return acc; - }, {} as MappedPorts); - - const portListData = portsData.categories - .filter((category) => categorized[category.key] !== undefined) - .map((category) => { - return { meta: category, ports: categorized[category.key] }; - }); - - const portContent = Handlebars.compile(`{{#each category}} -
-{{emoji}} {{name}} - -{{#each ports}} -- {{#unless maintained}}๐Ÿšง {{/unless}}[{{#each name}}{{ this }}{{#unless @last}}, {{/unless}}{{/each}}]({{ path }}) -{{/each}} - -
-{{/each}}`)({ - category: portListData.map(({ meta, ports }) => { - return { - emoji: meta.emoji, - name: meta.name, - ports: ports.map( - ({ name, path, "current-maintainers": currentMaintainers }) => { - return { - name: [name].flat(), - maintained: currentMaintainers.length > 0, - path, - }; - }, - ), - }; - }), - }); - - const readmePath = join(REPO_ROOT, "README.md"); - await updateFile( - readmePath, - updateReadme({ - readme: Deno.readTextFileSync(readmePath), - section: "userstyles", - newContent: portContent, - }), - false, - ).catch((e) => console.error(e)); -}; diff --git a/scripts/generate/readme-styles.ts b/scripts/generate/readme-styles.ts index a9e384320e..06ea6c4a48 100644 --- a/scripts/generate/readme-styles.ts +++ b/scripts/generate/readme-styles.ts @@ -1,7 +1,9 @@ -import { UserStylesSchema } from "@/types/mod.ts"; -import { join } from "@std/path"; -import { REPO_ROOT } from "@/deps.ts"; +import type { UserstylesSchema } from "@/types/mod.ts"; +import { REPO_ROOT } from "@/constants.ts"; + +import * as path from "@std/path"; import Handlebars from "handlebars"; +import { formatListOfItems } from "@/utils.ts"; // we can have some nice things :) Handlebars.registerHelper( @@ -14,40 +16,36 @@ Handlebars.registerHelper( ); const heading = ( - name: UserStylesSchema.Name, - link: UserStylesSchema.ApplicationLink, + name: UserstylesSchema.Name, + link: UserstylesSchema.Link, + supports: UserstylesSchema.Supports | undefined, ) => { - const [nameArray, linkArray] = [[name].flat(), [link].flat()]; - - if (nameArray.length !== linkArray.length) { - throw new Error( - 'The "name" and "app-link" arrays must have the same length', - ); - } - - return nameArray.map((title, i) => { - return { title, url: linkArray[i] }; - }); + return [{ title: name, url: link }].concat( + Object.values(supports ?? {}).map(({ name, link }) => ({ + title: name, + url: link, + })), + ); }; -const extractName = ( +function getNameWithGitHubUrl( collaborators?: - | UserStylesSchema.CurrentMaintainers - | UserStylesSchema.PastMaintainers, -) => { + | UserstylesSchema.CurrentMaintainers + | UserstylesSchema.PastMaintainers, +) { // no-op when undefined if (!collaborators) return; - // set the name to the github.com/ - return collaborators.map((c) => { - c.name ??= c.url.split("/").pop(); - return c; + // keep name & set the url to the github.com/ + return collaborators.map((name) => { + return { + name, + url: `https://github.com/${name}`, + }; }); -}; +} -export const generateStyleReadmes = ( - userstyles: UserStylesSchema.Userstyles, -) => { - const stylesReadmePath = join( +export function generateStyleReadmes(userstyles: UserstylesSchema.Userstyles) { + const stylesReadmePath = path.join( REPO_ROOT, "scripts/generate/templates/userstyle.md", ); @@ -59,27 +57,33 @@ export const generateStyleReadmes = ( slug, { name, - readme, + link, + note, + supports, "current-maintainers": currentMaintainers, "past-maintainers": pastMaintainers, }, ], ) => { - console.log(`Generating README for ${slug}`); + console.log(`Generating README for styles/${slug}...`); const readmeContent = Handlebars.compile(stylesReadmeContent)({ - heading: heading(name, readme["app-link"]), + heading: heading(name, link, supports), + supportedWebsites: formatListOfItems( + Object.values(supports ?? {}).map(({ name, link }) => + `[${name}](${link})` + ), + ), slug, - usage: readme.usage, - faq: readme.faq, + note, collaborators: { - currentMaintainers: extractName(currentMaintainers), - pastMaintainers: extractName(pastMaintainers), + currentMaintainers: getNameWithGitHubUrl(currentMaintainers), + pastMaintainers: getNameWithGitHubUrl(pastMaintainers), }, }); Deno.writeTextFile( - join(REPO_ROOT, "styles", slug.toString(), "README.md"), + path.join(REPO_ROOT, "styles", slug.toString(), "README.md"), readmeContent, ).catch((e) => console.error(e)); }, ); -}; +} diff --git a/scripts/generate/templates/userstyle-issue.yml b/scripts/generate/templates/userstyle-issue.yml index c13c2f8634..d394a55fc8 100644 --- a/scripts/generate/templates/userstyle-issue.yml +++ b/scripts/generate/templates/userstyle-issue.yml @@ -1,43 +1,63 @@ # THIS FILE IS AUTOGENERATED. DO NOT EDIT IT BY HAND. name: Userstyle Issue -description: Report your problems with any of the userstyles here! +description: Report a problem with a userstyle. body: - - type: checkboxes + - id: prerequisites + type: checkboxes attributes: label: Is there an existing issue outlining your problem? description: Please search to see if an issue already exists for your problem. options: - - label: I am using the latest version of the provided userstyle. - required: true - label: I have searched the existing issues and they do not solve my problem. required: true - - type: dropdown + - id: userstyle + type: dropdown attributes: - label: What userstyles are you seeing the problem on? + label: What userstyle are you seeing the problem on? description: "Don't worry about the `lbl:` prefix, it allows issues to be automatically labeled!" - multiple: true + multiple: false options: ["$LABELS"] validations: required: true - - type: textarea + - id: description + type: textarea attributes: - label: Describe your problem. - description: Also tell us, what do you expect to see? + label: Description + description: Describe the problem and what you expect to see instead. placeholder: The navigation bar on the website is highlighted incorrectly... validations: required: true - - type: textarea + - id: screenshots + type: textarea attributes: - label: Attach screenshots. + label: Relevant screenshots description: If applicable, attach screenshots which clearly highlight the issue. - - type: input + - id: browser_version + type: input attributes: - label: What browser(s) are you seeing the problem on? - description: "The browser version is also important, you can find out how to get that info [here](https://github.com/catppuccin/userstyles/blob/main/docs/browsers.md)." + label: Browser version(s) this issue occurs on + description: "To get the browser version, see https://userstyles.catppuccin.com/getting-started/faq/#what-version-of-my-browser-am-i-using." placeholder: Firefox v112.0.2 validations: required: true - - type: textarea + - id: stylus_version + type: input + attributes: + label: Stylus extension version + description: If Stylus is pinned, right-click the extension icon and select "Manage Extension". Otherwise, in the extensions popup, click the settings icon or three dots icon if present and select "Manage Extension". The version is displayed on the resulting page. + placeholder: Stylus 2.3.17 + validations: + required: true + - id: userstyle_version + type: input + attributes: + label: Installed version of the userstyle + description: Versions are listed on Stylus' Manage page. To get the version, click the Stylus extension icon, then in the popup, click Manage. The version is found beside the name of the userstyle. + placeholder: v2025.12.05 + validations: + required: true + - id: additional_comments + type: textarea attributes: label: Any additional comments? description: Add any information that hasn't been covered in the previous sections! diff --git a/scripts/generate/templates/userstyle.md b/scripts/generate/templates/userstyle.md index 7baca4d8fc..c6c8c898b0 100644 --- a/scripts/generate/templates/userstyle.md +++ b/scripts/generate/templates/userstyle.md @@ -10,24 +10,22 @@

- +

-

- -

- -{{#if usage}} ## Usage -{{{ usage }}} -{{/if}} -{{#if faq}} -## ๐Ÿ™‹ FAQ -{{#each faq}} -- Q: {{{ question }}}\ - A: {{{ answer }}} -{{/each}} +{{#if supportedWebsites}} +> [!IMPORTANT] +> This userstyle also applies to {{ supportedWebsites }}. + +{{/if~}} + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + +{{#if note}} +> [!NOTE] +> {{{ note }}} {{/if}} {{#if collaborators.currentMaintainers.length}} @@ -36,8 +34,8 @@ - [{{name}}]({{url}}) {{/each}} {{else}} -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find! {{/if}} {{#if collaborators.pastMaintainers}} diff --git a/scripts/generate/utils.ts b/scripts/generate/utils.ts index 1293f5b52e..7e451760a1 100644 --- a/scripts/generate/utils.ts +++ b/scripts/generate/utils.ts @@ -1,36 +1,9 @@ -export const updateFile = ( +export function writeWithPreamble( filePath: string, fileContent: string, - comment = true, -) => { - const preamble = comment - ? "# THIS FILE IS AUTOGENERATED. DO NOT EDIT IT BY HAND.\n" - : ""; - return Deno.writeTextFile(filePath, preamble + fileContent); -}; - -export const updateReadme = ({ - readme, - section, - newContent, -}: { - readme: string; - section: string; - newContent: string; -}): string => { - const preamble = - ""; - const startMarker = ``; - const endMarker = ``; - const wrapped = `${startMarker}\n${preamble}\n${newContent}\n${endMarker}`; - - if ( - !(readme.includes(startMarker) && readme.includes(endMarker)) - ) { - throw new Error("Markers not found in README.md"); - } - - const pre = readme.split(startMarker)[0]; - const end = readme.split(endMarker)[1]; - return pre + wrapped + end; -}; +) { + return Deno.writeTextFile( + filePath, + "# THIS FILE IS AUTOGENERATED. DO NOT EDIT IT BY HAND.\n" + fileContent, + ); +} diff --git a/scripts/lint/file-checker.ts b/scripts/lint/file-checker.ts index e265ac1a59..6b1e751b19 100644 --- a/scripts/lint/file-checker.ts +++ b/scripts/lint/file-checker.ts @@ -1,29 +1,28 @@ -import { exists } from "@std/fs"; -import { join, relative } from "@std/path"; +import { REPO_ROOT } from "@/constants.ts"; + +import * as fs from "@std/fs"; +import * as path from "@std/path"; import core from "@actions/core"; -import { REPO_ROOT } from "@/deps.ts"; -import { log } from "@/lint/logger.ts"; -import * as color from "@std/fmt/colors"; +import { log } from "@/logger.ts"; const requiredFiles = [ - "catppuccin.user.css", - "preview.webp", + "catppuccin.user.less", ]; -export const checkForMissingFiles = async () => { - const stylesRoot = join(REPO_ROOT, "styles"); +export async function checkForMissingFiles() { + const stylesRoot = path.join(REPO_ROOT, "styles"); const missingFiles: string[] = []; for await (const entry of Deno.readDir(stylesRoot)) { if (!entry.isDirectory) continue; - const styleRoot = join(stylesRoot, entry.name); + const styleRoot = path.join(stylesRoot, entry.name); await Promise.all(requiredFiles.map(async (f) => { - const fp = join(styleRoot, f); - const rfp = relative(REPO_ROOT, fp); + const fp = path.join(styleRoot, f); + const rfp = path.relative(REPO_ROOT, fp); - if (!(await exists(fp))) { + if (!(await fs.exists(fp))) { missingFiles.push(rfp); } })); @@ -36,10 +35,10 @@ export const checkForMissingFiles = async () => { .addList(missingFiles) .write(); } else { - missingFiles.map((f) => { - log.error(color.red(`Missing file:`) + ` ${f}`, { file: f }); - }); + for (const file of missingFiles) { + log.error(`File does not exist`, { file }); + } } return missingFiles.length === 0; -}; +} diff --git a/scripts/lint/library.ts b/scripts/lint/library.ts new file mode 100644 index 0000000000..e632f86ad1 --- /dev/null +++ b/scripts/lint/library.ts @@ -0,0 +1,51 @@ +import * as path from "@std/path"; +// @ts-types="npm:@types/less"; +import less from "less"; + +import { REPO_ROOT } from "@/constants.ts"; + +const LIB_URL_PREFIX = "https://userstyles.catppuccin.com/lib"; +const LIB_DIRECTORY = path.join(REPO_ROOT, "lib"); + +class InterceptingFileManager extends less.FileManager { + #cache = new Map>(); + + override supports(filename: string) { + return filename.startsWith(LIB_URL_PREFIX); + } + override supportsSync() { + return false; + } + + override async loadFile( + filename: string, + _currentDirectory: string, + _options: Less.LoadFileOptions, + _environment: Less.Environment, + ): Promise { + const relativePath = filename.slice(LIB_URL_PREFIX.length); + const localPath = path.join(LIB_DIRECTORY, relativePath); + + let cached = this.#cache.get(localPath); + if (!cached) { + cached = Deno.readTextFile(localPath).catch(() => { + throw { + type: "File", + message: `${filename} failed: not found at ${localPath}`, + }; + }); + this.#cache.set(localPath, cached); + } + + return { contents: await cached, filename: localPath }; + } +} + +interface LessEnvironment { + addFileManager(fileManager: Less.FileManager): void; +} + +(less as unknown as { environment: LessEnvironment }).environment + .addFileManager( + new InterceptingFileManager(), + ); diff --git a/scripts/lint/main.ts b/scripts/lint/main.ts index e2ac391b32..2e6312d4c5 100755 --- a/scripts/lint/main.ts +++ b/scripts/lint/main.ts @@ -1,39 +1,40 @@ -#!/usr/bin/env -S deno run -A -import { walk } from "@std/fs"; +import { REPO_ROOT } from "@/constants.ts"; + import { parseArgs } from "@std/cli"; -import { basename, dirname, join, relative } from "@std/path"; +import * as path from "@std/path"; +import * as color from "@std/fmt/colors"; // @ts-types="npm:@types/less"; import less from "less"; -import { REPO_ROOT } from "@/deps.ts"; import { checkForMissingFiles } from "@/lint/file-checker.ts"; -import { log } from "@/lint/logger.ts"; +import { log } from "@/logger.ts"; import { verifyMetadata } from "@/lint/metadata.ts"; -import { lint } from "@/lint/stylelint.ts"; -import { getUserstylesData } from "@/utils.ts"; +import { runStylelint } from "@/lint/stylelint.ts"; +import { getUserstylesData, getUserstylesFiles } from "@/utils.ts"; import stylelintConfig from "../../.stylelintrc.js"; +import "@/lint/library.ts"; const args = parseArgs(Deno.args, { boolean: ["fix"] }); -const subDir = args._[0]?.toString() ?? ""; -const stylesheets = walk(join(REPO_ROOT, "styles", subDir), { - includeFiles: true, - includeDirs: false, - includeSymlinks: false, - match: [/\.user.css$/], -}); +const userstyle = args._[0]?.toString().match( + /(?styles\/)?(?[a-z0-9_\-.]+)(?\/)?(?catppuccin\.user\.less)?/, +)?.groups?.userstyle; +const stylesheets = userstyle + ? [path.join(REPO_ROOT, "styles", userstyle, "catppuccin.user.less")] + : getUserstylesFiles(); + const { userstyles } = getUserstylesData(); -let failed = false; +let didLintFail = false; -for await (const entry of stylesheets) { - const dir = basename(dirname(entry.path)); - const file = relative(REPO_ROOT, entry.path); +for (const style of stylesheets) { + const dir = path.basename(path.dirname(style)); + const file = path.relative(REPO_ROOT, style); - let content = await Deno.readTextFile(entry.path); + let content = await Deno.readTextFile(style); // Verify the UserCSS metadata. const { globalVars, isLess, fixed } = await verifyMetadata( - entry, + file, content, dir, userstyles, @@ -48,7 +49,7 @@ for await (const entry of stylesheets) { // Try to compile the LESS file, report any errors. less.render(content, { lint: true, globalVars: globalVars }).catch( (err: Less.RenderError) => { - failed = true; + didLintFail = true; log.error( err.message, { file, startLine: err.line, endLine: err.line, content }, @@ -57,12 +58,24 @@ for await (const entry of stylesheets) { ); // Lint with Stylelint. - await lint(entry, content, args.fix, stylelintConfig).catch(() => - failed = true - ); + const results = await runStylelint(style, content, args.fix, stylelintConfig) + .catch(() => didLintFail = true); + Deno.writeTextFileSync(file, typeof results === "string" ? results : content); } -if (await checkForMissingFiles() === false) failed = true; +if (await checkForMissingFiles() === false) didLintFail = true; // Cause the workflow to fail if any issues were found. -if (failed || log.failed) Deno.exit(1); + +const THIN_SPACE = "\u2009"; + +if (didLintFail || log.failed) { + if (!args.fix) { + console.log( + `\n ${ + color.bold(color.inverse(color.green(`${THIN_SPACE}TIP${THIN_SPACE}`))) + } Run ${color.bold("deno task lint:fix")} to fix autofixable issues.`, + ); + } + Deno.exit(1); +} diff --git a/scripts/lint/metadata.ts b/scripts/lint/metadata.ts index 51472c6616..abb0f03bb3 100644 --- a/scripts/lint/metadata.ts +++ b/scripts/lint/metadata.ts @@ -1,27 +1,26 @@ -// @ts-types="@/types/usercss-meta.d.ts"; -import usercssMeta from "usercss-meta"; +import type { Userstyles } from "@/types/userstyles.d.ts"; +import { REPO_ROOT } from "@/constants.ts"; + import * as color from "@std/fmt/colors"; +import * as path from "@std/path"; import { sprintf } from "@std/fmt/printf"; -import type { WalkEntry } from "@std/fs"; -import { join, relative } from "@std/path"; -import { REPO_ROOT } from "@/deps.ts"; -import { log } from "@/lint/logger.ts"; +// @ts-types="@/types/usercss-meta.d.ts"; +import usercssMeta from "usercss-meta"; +import { log } from "@/logger.ts"; import { formatListOfItems } from "@/utils.ts"; -import type { Userstyles } from "@/types/userstyles.d.ts"; -export const verifyMetadata = async ( - entry: WalkEntry, +export async function verifyMetadata( + file: string, content: string, userstyle: string, userstyles: Userstyles, fix: boolean, -) => { +) { // `usercss-meta` prohibits any '\r' characters, which seem to be present on Windows. content = content.replaceAll("\r\n", "\n"); - const assert = assertions(userstyle, userstyles); - const file = relative(REPO_ROOT, entry.path); + const assertions = generateAssertions(userstyle, userstyles); const { metadata, errors: parsingErrors } = usercssMeta.parse(content, { allowErrors: true, @@ -29,31 +28,44 @@ export const verifyMetadata = async ( const lines = content.split("\n"); // Pretty print / annotate the parsing errors. - parsingErrors.map((e) => { - let startLine = 0; - for (const line of lines) { - startLine++; - e.index -= line.length + 1; - if (e.index < 0) break; + for (const error of parsingErrors) { + let startLine; + if (error.index !== undefined && !Number.isNaN(error.index)) { + startLine = 0; + for (const line of lines) { + startLine++; + error.index -= line.length + 1; + if (error.index < 0) break; + } } - log.error(e.message, { file, startLine, content }); - }); - for (const [key, expected] of Object.entries(assert)) { + // Skip "missing mandatory metadata property" ParseError, assertions checks below will cover. + if (error.code === "missingMandatory") continue; + + log.error(error.message, { + file, + startLine, + content, + }); + } + + for (const [key, expected] of Object.entries(assertions)) { const current = metadata[key]; + const atKey = "@" + key; + if (current !== expected) { const line = lines - .findIndex((line) => line.includes(key)) + 1; + .findIndex((line) => line.includes(`${atKey} `)) + 1; const message = current === undefined ? sprintf( - "Metadata `%s` should not be undefined", - color.bold(key), + "UserCSS metadata property `%s` is undefined", + color.bold(atKey), ) : sprintf( - 'Metadata `%s` should be "%s" but is "%s"', - color.bold(key), + 'UserCSS metadata property `%s` should be "%s" but is "%s"', + color.bold(atKey), color.green(expected), color.red(String(current)), ); @@ -63,11 +75,18 @@ export const verifyMetadata = async ( startLine: line !== 0 ? line : undefined, content, }); + + if (fix) { + content = content.replace( + `${atKey} ${current}`, + `${atKey} ${expected}`, + ); + } } } const template = (await Deno.readTextFile( - join(REPO_ROOT, "template/catppuccin.user.css"), + path.join(REPO_ROOT, "template/catppuccin.user.less"), )) .split("\n"); @@ -125,38 +144,44 @@ export const verifyMetadata = async ( return { globalVars, - isLess: metadata.preprocessor === assert.preprocessor, + isLess: metadata.preprocessor === assertions.preprocessor, fixed: content, }; -}; +} -const assertions = (userstyle: string, userstyles: Userstyles) => { +function generateAssertions(userstyle: string, userstyles: Userstyles) { const prefix = "https://github.com/catppuccin/userstyles"; - - if (!userstyles[userstyle]) { - log.error("Metadata section for this userstyle has not been added", { - file: "scripts/userstyles.yml", - }); + const userstyleData = userstyles[userstyle]; + + if (!userstyleData) { + log.error( + `Metadata section for \`${color.bold(userstyle)}\` userstyle is missing`, + { + file: "scripts/userstyles.yml", + }, + ); Deno.exit(1); } return { name: `${ - Array.isArray(userstyles[userstyle].name) - ? (userstyles[userstyle].name as string[]).join("/") - : userstyles[userstyle].name + [ + userstyleData.name, + ...Object.values(userstyleData.supports ?? {}).map(({ name }) => name), + ].join("/") } Catppuccin`, namespace: `github.com/catppuccin/userstyles/styles/${userstyle}`, homepageURL: `${prefix}/tree/main/styles/${userstyle}`, description: `Soothing pastel theme for ${ - Array.isArray(userstyles[userstyle].name) - ? formatListOfItems(userstyles[userstyle].name as string[]) - : userstyles[userstyle].name + formatListOfItems([ + userstyleData.name, + ...Object.values(userstyleData.supports ?? {}).map(({ name }) => name), + ]) }`, author: "Catppuccin", - updateURL: `${prefix}/raw/main/styles/${userstyle}/catppuccin.user.css`, + updateURL: `${prefix}/raw/main/styles/${userstyle}/catppuccin.user.less`, supportURL: `${prefix}/issues?q=is%3Aopen+is%3Aissue+label%3A${userstyle}`, license: "MIT", preprocessor: "less", }; -}; +} diff --git a/scripts/lint/stylelint-custom/color-operation.js b/scripts/lint/stylelint-custom/color-operation.js new file mode 100644 index 0000000000..e028616c0c --- /dev/null +++ b/scripts/lint/stylelint-custom/color-operation.js @@ -0,0 +1,181 @@ +// @ts-check + +import stylelint from "stylelint"; +import valueParser from "postcss-value-parser"; +import { flavors } from "@catppuccin/palette"; + +const LESS_COLOR_OP_FUNCTIONS = [ + "saturate", + "desaturate", + "lighten", + "darken", + "fadein", + "fadeout", + "fade", + "mix", + "tint", + "shade", +]; +const NUMERICAL_VALUE_REGEX = /^[\d.]+$/; +const VALID_COLOR_VARIABLES = [ + ...Object.keys(flavors.latte.colors).map((color) => "@" + color), + "@accent", +]; + +/** + * Accepts a color operation amount and normalizes it by multiplying it by 100 if it is less than 1. + * @param {string} amount + * @returns {number} + * + * @example + * normalizeColorOperationAmount("0.3") // 30 + * normalizeColorOperationAmount("30") // 30 + */ +function normalizeColorOperationAmount(amount) { + let value = Number.parseFloat(amount); + if (value < 1) value *= 100; + return value; +} + +const { + createPlugin, + utils: { report, ruleMessages, validateOptions }, +} = stylelint; + +const ruleName = "catppuccin/color-operations"; + +const meta = { + fixable: true, +}; + +const messages = ruleMessages(ruleName, { + amount_not_percentage: () => `Function amount argument must be percentage`, + rgba_used_with_variable: () => `Use 'fade' instead of 'rgba' on variables`, + fadeout_used: () => `Use 'fade' instead of 'fadeout'`, + fadein_used: () => `Use 'fade' instead of 'fadein'`, +}); + +/** @type {import('npm:stylelint').Rule} */ +const ruleFunction = (primary, _secondary, context) => { + return (root, result) => { + const validOptions = validateOptions(result, ruleName, { + actual: primary, + possible: [true], + }); + + if (!validOptions) return; + + root.walkDecls((decl) => { + const parsed = valueParser(decl.value); + + parsed.walk((node) => { + if (node.type !== "function") return; + + const pre = decl.prop.length + + (decl.raws.between?.length || 0); + const startIndex = pre + node.sourceIndex; + const endIndex = pre + node.sourceEndIndex - 1; + + // Prevent using `rgba` with variables to change the alpha value. + if ( + node.value === "rgba" && + node.nodes.length === 3 && + node.nodes[0].value.startsWith("@") && + NUMERICAL_VALUE_REGEX.test(node.nodes[2].value) + ) { + if (context.fix) { + node.value = "fade"; + node.nodes[2].value = normalizeColorOperationAmount( + node.nodes[2].value, + ) + "%"; + } else { + report({ + result, + ruleName, + message: messages.rgba_used_with_variable(), + node: decl, + index: startIndex, + endIndex: endIndex, + }); + } + } + + // Use `fade` instead of `fadeout`. + if ( + node.value === "fadeout" + ) { + if ( + context.fix && + // Only autofixable if it follows the pattern of `fadeout(@, %)`. Otherwise, it's ambiguous. + node.nodes.length === 3 && + VALID_COLOR_VARIABLES.includes(node.nodes[0].value) + ) { + node.value = "fade"; + const value = node.nodes[2].value.replace("%", ""); + // Invert the value to get the fade amount. E.g. `fadeout(@color, 30%)` becomes `fade(@color, 70%)`. + node.nodes[2].value = (100 - normalizeColorOperationAmount(value)) + + "%"; + } else { + report({ + result, + ruleName, + message: messages.fadeout_used(), + node: decl, + index: startIndex, + endIndex: endIndex, + }); + } + } + + // Use `fade` instead of `fadein`. Not autofixable because a) on palette variables, it has no effect (increasing opaqueness on a fully opaque color) and b) it's ambiguous otherwise. + if (node.value === "fadein") { + report({ + result, + ruleName, + message: messages.fadein_used(), + node: decl, + index: startIndex, + endIndex: endIndex, + }); + } + + // Use percentage amount values for Less color operation functions. + + if (!LESS_COLOR_OP_FUNCTIONS.includes(node.value)) return; + + const amountArgIndex = node.value === "mix" ? 4 : 2; + + if ( + node.nodes.length === amountArgIndex + 1 && + !node.nodes[amountArgIndex].value.endsWith("%") + ) { + const value = node.nodes[amountArgIndex].value; + if (!NUMERICAL_VALUE_REGEX.test(value)) return; + + if (context.fix) { + node.nodes[amountArgIndex].value = normalizeColorOperationAmount( + value, + ) + "%"; + } else { + report({ + result, + ruleName, + message: messages.amount_not_percentage(), + node: decl, + index: startIndex + node.nodes[amountArgIndex].sourceIndex, + endIndex: startIndex + node.nodes[amountArgIndex].sourceEndIndex - + 1, + }); + } + } + }); + decl.value = parsed.toString(); + }); + }; +}; + +ruleFunction.ruleName = ruleName; +ruleFunction.messages = messages; +ruleFunction.meta = meta; + +export default createPlugin(ruleName, ruleFunction); diff --git a/scripts/lint/stylelint-custom/index.js b/scripts/lint/stylelint-custom/index.js new file mode 100644 index 0000000000..91278615e7 --- /dev/null +++ b/scripts/lint/stylelint-custom/index.js @@ -0,0 +1,9 @@ +import colorOperation from "@/lint/stylelint-custom/color-operation.js"; +import optimizedSvgs from "@/lint/stylelint-custom/optimized-svgs.js"; +import redundantParentSelector from "@/lint/stylelint-custom/redundant-parent-selector.js"; + +export default [ + colorOperation, + optimizedSvgs, + redundantParentSelector, +]; diff --git a/scripts/lint/stylelint-custom/optimized-svgs.js b/scripts/lint/stylelint-custom/optimized-svgs.js index 3b1ef50c27..4b2a3cf276 100644 --- a/scripts/lint/stylelint-custom/optimized-svgs.js +++ b/scripts/lint/stylelint-custom/optimized-svgs.js @@ -54,7 +54,7 @@ const ruleFunction = (primary, _secondary, context) => { "mergePaths", "removeComments", "removeUselessDefs", - "removeScriptElement", + "removeScripts", ], }).data; diff --git a/scripts/lint/stylelint-custom/redundant-parent-selector.js b/scripts/lint/stylelint-custom/redundant-parent-selector.js new file mode 100644 index 0000000000..36133065b7 --- /dev/null +++ b/scripts/lint/stylelint-custom/redundant-parent-selector.js @@ -0,0 +1,99 @@ +// @ts-check + +import stylelint from "stylelint"; +import { assert } from "@std/assert"; + +const { + createPlugin, + utils: { report, ruleMessages, validateOptions }, +} = stylelint; + +const ruleName = "catppuccin/no-redundant-parent-selector"; + +const meta = { + fixable: true, +}; + +const messages = ruleMessages(ruleName, { + rejected: () => `Redundant parent selector is not allowed`, +}); + +/** @type {import('npm:stylelint').Rule} */ +const ruleFunction = (primary, _secondary, context) => { + return (root, result) => { + const validOptions = validateOptions(result, ruleName, { + actual: primary, + possible: [true], + }); + + if (!validOptions) return; + + root.walkRules((rule) => { + if (rule.selectors.length === 1 && rule.selector === "&") { + if (context.fix) { + // Moves the rule's properties to the parent rule *in place* of the parent selector. + // & { + // color: red; + // } + // becomes + // color: red; + + const parent = rule.parent; + + if (parent) { + let idx = parent.index(rule); + assert(idx !== -1); + + rule.each((node) => { + if (node.type === "decl") { + parent.insertAfter( + parent.nodes[idx], + node.clone(), + ); + idx++; + } + }); + + rule.remove(); + } + } else { + report({ + result, + ruleName, + message: messages.rejected(), + node: rule, + }); + } + } + + rule.selector = rule.selector.replace( + // Match "& ", at the start or after a comma and optional whitespace, but not when followed by "when". + /(^|,\s*)&\s+(?!when\b)/g, + (match, prefix, offset) => { + const matchIndex = offset + prefix.length; + const matchEndIndex = matchIndex + 1; // `&` is one character long. + + if (context.fix) { + return prefix; // Remove '& ' but keep the "prefix" (start or comma and whitespace). + } else { + report({ + result, + ruleName, + message: messages.rejected(), + node: rule, + index: matchIndex, + endIndex: matchEndIndex, + }); + } + return match; + }, + ); + }); + }; +}; + +ruleFunction.ruleName = ruleName; +ruleFunction.messages = messages; +ruleFunction.meta = meta; + +export default createPlugin(ruleName, ruleFunction); diff --git a/scripts/lint/stylelint.ts b/scripts/lint/stylelint.ts index df1102307a..d3a4d29723 100644 --- a/scripts/lint/stylelint.ts +++ b/scripts/lint/stylelint.ts @@ -1,44 +1,44 @@ import * as color from "@std/fmt/colors"; -import type { WalkEntry } from "@std/fs"; -import { relative } from "@std/path"; import "postcss-less"; import stylelint from "stylelint"; import "stylelint-config-standard"; import "stylelint-config-recommended"; -import { REPO_ROOT } from "@/deps.ts"; -import { log } from "@/lint/logger.ts"; +import { log } from "@/logger.ts"; -export const lint = ( - entry: WalkEntry, +export async function runStylelint( + file: string, content: string, fix: boolean, config: stylelint.Config, -) => - stylelint.lint({ code: content, config, fix }) - .then(({ results, code }) => { - if (code) { - Deno.writeTextFileSync(entry.path, code); - } - results.map((result) => { - result.warnings.map((warning) => { - // Some cleanup for fancier logging - dims the rule name. - const message = warning.text?.replace( - new RegExp(`\\(?${warning.rule}\\)?`), - color.dim(`(${warning.rule})`), - ) ?? "unspecified stylelint error"; +): Promise { + const { results, code } = await stylelint.lint({ + code: content, + config, + fix, + }); - log.log(message, { - file: relative(REPO_ROOT, entry.path), - startLine: warning.line, - endLine: warning.endLine, - startColumn: warning.column, - endColumn: warning.endColumn, - content, - }, warning.severity); - }); + for (const result of results) { + for (const warning of result.warnings) { + // Some cleanup for fancier logging - dims the rule name. + const message = warning.text?.replace( + new RegExp(`\\(?${warning.rule}\\)?`), + color.dim(`(${warning.rule})`), + ) ?? "unspecified stylelint error"; - if (result.warnings.length > 0) throw new Error("stylelint error"); - }); - }); + log.log(message, { + file, + startLine: warning.line, + endLine: warning.endLine, + startColumn: warning.column, + endColumn: warning.endColumn, + content, + }, warning.severity); + } + + if (result.warnings.length > 0) throw new Error("stylelint error"); + } + + return code; +} diff --git a/scripts/lint/logger.ts b/scripts/logger.ts similarity index 53% rename from scripts/lint/logger.ts rename to scripts/logger.ts index 872642eb97..85df45f278 100644 --- a/scripts/lint/logger.ts +++ b/scripts/logger.ts @@ -2,15 +2,17 @@ import { sprintf } from "@std/fmt/printf"; import * as color from "@std/fmt/colors"; import core from "@actions/core"; -export type LoggerProps = core.AnnotationProperties & { content?: string }; +export type LoggerProps = core.AnnotationProperties & { + file: string; + content?: string; +}; -const prettyPrint = ( +function prettyPrint( message: string, props: LoggerProps, severity: "error" | "warning" = "warning", -) => { +) { const { file, startColumn, startLine } = props; - if (!startLine) return console.log(message); const lines = (props.content ?? "").split("\n"); @@ -19,51 +21,59 @@ const prettyPrint = ( message, ].join(" "); - const line = lines[startLine - 1].split("").map((char, i) => { - const startCol = (props.startColumn ?? 0) - 1; - const endCol = (props.endColumn ?? Infinity) - 1; + const pad = startLine ? (startLine + 1).toString().length : 0; - if (i >= startCol && i <= endCol) { - return color[severity === "error" ? "red" : "yellow"](char); - } else { - return char; - } - }).join(""); + const logs = [color.underline( + sprintf( + "%s%s%s", + file, + startLine ? ":" + startLine : "", + startColumn ? ":" + startColumn : "", + ), + )]; - const pad = startLine.toString().length; - console.log( - [ - color.underline( - sprintf( - "%s%s%s", - file, - startLine ? ":" + startLine : "", - startColumn ? ":" + startColumn : "", - ), - ), + if (startLine) { + const line = lines[startLine - 1].split("").map((char, i) => { + const startCol = (props.startColumn ?? 0) - 1; + const endCol = (props.endColumn ?? Infinity) - 1; + + if (i >= startCol && i <= endCol) { + return color[severity === "error" ? "red" : "yellow"](char); + } else { + return char; + } + }).join(""); + + logs.push(...[ sprintf( - "%*sโ”‚ %s", - pad, - color.dim(String(startLine - 1)), + "%sโ”‚ %s", + color.dim(String(startLine - 1).padStart(pad, " ")), color.dim(lines[startLine - 2]), ), - sprintf("%*sโ”‚ %s", pad, color.bold(String(startLine)), line), sprintf( - "%*sโ”‚ %s", - pad, - color.dim(String(startLine + 1)), - color.dim(lines[startLine]), + "%sโ”‚ %s", + color.bold(String(startLine).padStart(pad, " ")), + line, ), sprintf( - "%*sโ•ฐโ”€โ–บ %s", - pad, - "", - error, + "%sโ”‚ %s", + color.dim(String(startLine + 1).padStart(pad, " ")), + color.dim(lines[startLine]), ), - undefined, - ].join("\n"), + ]); + } + + logs.push( + sprintf( + "%*sโ•ฐโ”€โ–บ %s", + pad, + "", + error, + ), ); -}; + + console.log("\n" + logs.join("\n")); +} export const log = { failed: false, diff --git a/scripts/serve/main.ts b/scripts/serve/main.ts new file mode 100644 index 0000000000..65e47edf78 --- /dev/null +++ b/scripts/serve/main.ts @@ -0,0 +1,111 @@ +import { parseArgs } from "@std/cli"; +import { serveDir } from "@std/http/file-server"; +import { debounce } from "@std/async/debounce"; +import { createHash } from "node:crypto"; + +import * as path from "@std/path"; + +import { REPO_ROOT } from "@/constants.ts"; + +const args = parseArgs(Deno.args, {}); +const userstyle = args._[0] + ?.toString() + .match( + /(?styles\/)?(?[a-z0-9_\-.]+)(?\/)?(?catppuccin\.user\.less)?/, + )?.groups?.userstyle; +if (!userstyle) throw new Error("Invalid userstyle argument"); + +const server = Deno.serve({ + onListen() { + // Disable unnecessary post-startup log. + }, +}, (req: Request) => { + const pathname = new URL(req.url).pathname; + + if (pathname.startsWith("/lib")) { + return serveDir(req, { + fsRoot: "lib", + urlRoot: "lib", + }); + } + + return new Response("404: Not Found", { + status: 404, + }); +}); + +const userstylePath = path.join( + REPO_ROOT, + "styles", + userstyle, + "catppuccin.user.less", +); + +const libPath = path.join( + REPO_ROOT, + "lib", +); + +const tempUserstylePath = await Deno.makeTempFile({ + prefix: "userstyle_", + suffix: ".user.less", +}); + +async function calculateLibChecksum(): Promise { + const files = []; + for await (const entry of Deno.readDir(libPath)) { + if (entry.isFile) { + files.push(path.join(libPath, entry.name)); + } + } + + const hash = createHash("sha256"); + for (const file of files) { + const content = await Deno.readTextFile(file); + hash.update(content); + } + + return hash.digest("hex"); +} + +let lastLibChecksum = await calculateLibChecksum(); + +async function updateTempUserstyle() { + let contents = await Deno.readTextFile(userstylePath); + /* Appends a query parameter suffix to import URLs from userstyles.catppuccin.com, containing the library modules content checksum. */ + const importRegex = + /(@import\s+"https:\/\/userstyles\.catppuccin\.com\/lib\/[^\s]+\.less")/g; + contents = contents.replace(importRegex, (match) => { + return match.replace( + /(\.less)/, + `$1?v=${lastLibChecksum.slice(0, 6)}`, + ); + }); + + /* Then replace the remote userstyles.catppuccin.com host with the local(host) server URL for these imports. */ + contents = contents.replaceAll( + "https://userstyles.catppuccin.com", + `http://localhost:${server.addr.port}`, + ); + + await Deno.writeTextFile(tempUserstylePath, contents); +} + +updateTempUserstyle(); + +console.log(`[serve] ${userstyle} userstyle served at '${tempUserstylePath}'`); + +const reload = debounce(() => { + console.log( + `[serve]: reloaded ${userstyle} userstyle`, + ); + updateTempUserstyle(); +}, 200); + +const watcher = Deno.watchFs([userstylePath, libPath]); +for await (const event of watcher) { + if (event.paths.some((path) => path.startsWith(libPath))) { + lastLibChecksum = await calculateLibChecksum(); + } + reload(); +} diff --git a/scripts/import-styles/main.ts b/scripts/stylus-import/main.ts similarity index 51% rename from scripts/import-styles/main.ts rename to scripts/stylus-import/main.ts index 5d655425b8..6c098ed583 100644 --- a/scripts/import-styles/main.ts +++ b/scripts/stylus-import/main.ts @@ -1,16 +1,7 @@ -#!/usr/bin/env -S deno run -A import usercssMeta from "usercss-meta"; -import { ensureDir, walk } from "@std/fs"; -import { join } from "@std/path"; - -import { REPO_ROOT } from "@/deps.ts"; - -const stylesheets = walk(join(REPO_ROOT, "styles"), { - includeFiles: true, - includeDirs: false, - includeSymlinks: false, - match: [/\.user.css$/], -}); +import { ensureDir } from "@std/fs"; +import { calcStyleDigest } from "https://github.com/openstyles/stylus/raw/8fe35a4b90d85fb911bd7aa1deab4e4733c31150/src/js/sections-util.js"; +import { getUserstylesFiles } from "@/utils.ts"; // Recommended settings. const settings = { @@ -24,11 +15,11 @@ const settings = { const data: Record[] = [settings]; -for await (const entry of stylesheets) { - const content = await Deno.readTextFile(entry.path); +for (const file of getUserstylesFiles()) { + const content = await Deno.readTextFile(file); const { metadata } = usercssMeta.parse(content); - data.push({ + const userstyle = { enabled: true, name: metadata.name, description: metadata.description, @@ -37,8 +28,12 @@ for await (const entry of stylesheets) { updateUrl: metadata.updateURL, usercssData: metadata, sourceCode: content, - }); + } as Record; + + userstyle.originalDigest = await calcStyleDigest(userstyle); + + data.push(userstyle); } await ensureDir("dist"); -Deno.writeTextFile("dist/import.json", JSON.stringify(data)); +await Deno.writeTextFile("dist/import.json", JSON.stringify(data)); diff --git a/scripts/sync-maintainers/main.ts b/scripts/sync-maintainers/main.ts index b5945c1fb9..fd9d83fda3 100755 --- a/scripts/sync-maintainers/main.ts +++ b/scripts/sync-maintainers/main.ts @@ -1,12 +1,14 @@ -#!/usr/bin/env -S deno run -A -import * as assert from "@std/assert"; -import { Octokit } from "@octokit/rest"; +import type { Userstyle } from "@/types/userstyles.d.ts"; -import type { UserStylesSchema } from "@/types/mod.ts"; -import { getUserstylesData } from "@/utils.ts"; +import * as assert from "@std/assert"; -const octokit = new Octokit({ auth: Deno.env.get("GITHUB_TOKEN") }); -const team = { org: "catppuccin", team_slug: "userstyles-maintainers" }; +import { + addUserstylesTeamMember, + getAuthenticatedOctokit, + getUserstylesData, + getUserstylesTeamMembers, + removeUserstylesTeamMember, +} from "@/utils.ts"; const { userstyles } = getUserstylesData(); @@ -14,57 +16,51 @@ const { userstyles } = getUserstylesData(); const maintainers = [ ...new Set( Object.values(userstyles).flatMap(( - style: UserStylesSchema.Userstyle, + style: Userstyle, ) => - style["current-maintainers"].map((m) => { - const username = m.url.split("github.com/")?.pop(); - // Check that they follow github.com/username pattern. - assert.assertExists(username); - return username.toLowerCase(); + style["current-maintainers"].map((name) => { + assert.assertExists(name); + return name.toLowerCase(); }) ), ), ]; -// Lowercase usernames of all maintainers in the current GitHub team. -const teamMembers = await octokit.teams - .listMembersInOrg({ - ...team, - per_page: 100, - }) - .then((res) => res.data.map((m) => m.login.toLowerCase())); +assert.assertExists(maintainers); +assert.assert(Array.isArray(maintainers)); +assert.assertGreater(maintainers.length, 0); -const syncMaintainers = async () => { - if (!maintainers) return; - if (assert.equal(maintainers, teamMembers)) { - console.log("Maintainers are in sync"); - return; - } +const octokit = getAuthenticatedOctokit(); +const team = "userstyles-maintainers"; +const maintainersTeamMembers = await getUserstylesTeamMembers( + octokit, + team, +); - const toAdd = maintainers.filter((m) => !teamMembers.includes(m)); - const toRemove = teamMembers.filter((m) => !maintainers.includes(m)); +if (assert.equal(maintainers, maintainersTeamMembers)) { + console.log("Maintainers are in sync."); + Deno.exit(0); +} - for (const m of toAdd) { - await octokit.teams.addOrUpdateMembershipForUserInOrg({ - ...team, - username: m, - }); - console.log(`Added ${m} to the ${team.org}/${team.team_slug} team.`); - } +const toAdd = maintainers.filter((m) => !maintainersTeamMembers.includes(m)); +const toRemove = maintainersTeamMembers.filter((m) => !maintainers.includes(m)); + +for (const maintainer of toAdd) { + await addUserstylesTeamMember(octokit, team, maintainer); console.log( - `${toAdd.length} users added to the ${team.org}/${team.team_slug} team.`, + `Added ${maintainer} to the catppuccin/${team} team.`, ); +} +console.log( + `${toAdd.length} users added to the catppuccin/${team} team.`, +); - for (const m of toRemove) { - await octokit.teams.removeMembershipForUserInOrg({ - ...team, - username: m, - }); - console.log(`Removed ${m} from the ${team.org}/${team.team_slug} team.`); - } +for (const member of toRemove) { + await removeUserstylesTeamMember(octokit, team, member); console.log( - `${toRemove.length} users removed from the ${team.org}/${team.team_slug} team.`, + `Removed ${member} from the catppuccin/${team} team.`, ); -}; - -await syncMaintainers(); +} +console.log( + `${toRemove.length} users removed from the catppuccin/${team} team.`, +); diff --git a/scripts/tests/__snapshots__/lib.test.ts.snap b/scripts/tests/__snapshots__/lib.test.ts.snap new file mode 100644 index 0000000000..371e090e4e --- /dev/null +++ b/scripts/tests/__snapshots__/lib.test.ts.snap @@ -0,0 +1,20 @@ +export const snapshot = {}; + +snapshot[`#lib.rgbify 1`] = ` +"/* deno-fmt-ignore */ +/* deno-fmt-ignore */ +.foo { + --bar: 255, 0, 0; +} +" +`; + +snapshot[`#lib.hslify 1`] = ` +"/* deno-fmt-ignore */ +/* deno-fmt-ignore */ +.foo { + --bar: 0, 100%, 50%; +} +" +`; + diff --git a/scripts/tests/lib.test.ts b/scripts/tests/lib.test.ts new file mode 100644 index 0000000000..e0bd17f2bf --- /dev/null +++ b/scripts/tests/lib.test.ts @@ -0,0 +1,40 @@ +import { assertSnapshot } from "@std/testing/snapshot"; + +import { REPO_ROOT } from "../constants.ts"; + +// @ts-types="npm:@types/less"; +import less from "less"; + +async function compile(source: string) { + const result = await less.render( + ` +@import "lib/lib.less"; + +${source} +`, + { paths: [REPO_ROOT] }, + ); + return result.css; +} + +Deno.test("#lib.rgbify", async (ctx) => { + await assertSnapshot( + ctx, + await compile(` +.foo { + --bar: #lib.rgbify(red)[]; +} +`), + ); +}); + +Deno.test("#lib.hslify", async (ctx) => { + await assertSnapshot( + ctx, + await compile(` +.foo { + --bar: #lib.hslify(red)[]; +} +`), + ); +}); diff --git a/scripts/types/mod.ts b/scripts/types/mod.ts index d5f9d03acc..253094e598 100644 --- a/scripts/types/mod.ts +++ b/scripts/types/mod.ts @@ -1,9 +1,2 @@ -export * as UserStylesSchema from "@/types/userstyles.d.ts"; -export * as PortsSchema from "catppuccin-repo/resources/types/ports.d.ts"; - -import { Entries } from "type-fest"; -declare global { - interface ObjectConstructor { - entries(o: T): Entries; - } -} +export * as UserstylesSchema from "@/types/userstyles.d.ts"; +export * as CategoriesSchema from "@catppuccin/catppuccin/resources/types/categories.d.ts"; diff --git a/scripts/types/update-types.ts b/scripts/types/update-types.ts new file mode 100755 index 0000000000..12c2c20f38 --- /dev/null +++ b/scripts/types/update-types.ts @@ -0,0 +1,15 @@ +import { REPO_ROOT, USERSTYLES_SCHEMA } from "@/constants.ts"; + +import * as path from "@std/path"; +import { compile, type JSONSchema } from "json-schema-to-typescript"; + +const TYPES_ROOT = path.join(REPO_ROOT, "scripts/types"); + +const types = await compile( + USERSTYLES_SCHEMA as JSONSchema, + "UserstylesSchema", + { + bannerComment: "// deno-fmt-ignore-file", + }, +); +Deno.writeTextFileSync(path.join(TYPES_ROOT, "userstyles.d.ts"), types); diff --git a/scripts/types/userstyles.d.ts b/scripts/types/userstyles.d.ts index e8b5418cd4..cdac1bd8c3 100644 --- a/scripts/types/userstyles.d.ts +++ b/scripts/types/userstyles.d.ts @@ -1,9 +1,13 @@ // deno-fmt-ignore-file /** - * The name of the userstyle(s). + * The name of the userstyle. */ -export type Name = [string, string, ...string[]] | string; +export type Name = string; +/** + * The url of the website that is being themed. + */ +export type Link = string; /** * The categories that fit the userstyle the most, the first category is the primary category which the userstyle will be listed under on the README. * @@ -25,6 +29,7 @@ export type Category = | "development" | "discussion_forum" | "document_viewer" + | "documentation_generator" | "education" | "email_client" | "entertainment" @@ -34,13 +39,15 @@ export type Category = | "health_and_fitness" | "library" | "music" + | "news_and_journalism" | "note_taking" | "notification_daemon" + | "package_registry" | "photo_and_video" | "productivity" | "search_engine" - | "self_hosted" | "social_networking" + | "syntax_highlighting" | "system" | "terminal" | "translation_tool" @@ -71,95 +78,36 @@ export type Color = */ export type Icon = string; /** - * The hyperlink of the app that is being themed. - */ -export type ApplicationLink = [string, string, ...string[]] | string; -/** - * The Usage section of the userstyle README. - */ -export type Usage = string; -/** - * The FAQ section of the userstyle README. - * - * @minItems 1 - */ -export type FAQ = [ - { - question: Question; - answer: Answer; - [k: string]: unknown; - }, - ...{ - question: Question; - answer: Answer; - [k: string]: unknown; - }[] -]; -/** - * A question that a user may have about the userstyle. + * An additional note that users should read. */ -export type Question = string; +export type Note = string; /** - * An answer to the question about the userstyle. + * The name of the website. */ -export type Answer = string; -/** - * The display name of the collaborator to show in the userstyle README. - */ -export type DisplayName = string; -/** - * The GitHub profile link of the collaborator to show in the userstyle README. - */ -export type GitHubProfile = string; +export type WebsiteName = string; /** * List of all active maintainers for this userstyle. */ -export type CurrentMaintainers = { - name?: DisplayName; - url: GitHubProfile; - [k: string]: unknown; -}[]; +export type CurrentMaintainers = string[]; /** * List of all users that have maintained this userstyle in the past. * * @minItems 1 */ -export type PastMaintainers = [ - { - name?: DisplayName; - url: GitHubProfile; - [k: string]: unknown; - }, - ...{ - name?: DisplayName; - url: GitHubProfile; - [k: string]: unknown; - }[] -]; +export type PastMaintainers = [string, ...string[]]; /** * Represents all maintainers and contributors to all userstyles. * * @minItems 1 */ -export type AllCollaborators = [ - { - name?: DisplayName; - url: GitHubProfile; - [k: string]: unknown; - }, - ...{ - name?: DisplayName; - url: GitHubProfile; - [k: string]: unknown; - }[] -]; +export type AllCollaborators = [string, ...string[]]; export interface UserstylesSchema { userstyles?: Userstyles; collaborators?: AllCollaborators; } /** - * All userstyles in the Catppuccin org. + * All userstyles in the Catppuccin organisation. */ export interface Userstyles { [k: string]: Userstyle; @@ -172,19 +120,28 @@ export interface Userstyles { */ export interface Userstyle { name: Name; + link: Link; categories: Categories; color: Color; icon?: Icon; - readme: README; + note?: Note; + supports?: Supports; "current-maintainers": CurrentMaintainers; "past-maintainers"?: PastMaintainers; } /** - * Options to help in the auto-generation of the userstyle README. + * All websites that the userstyle also supports. + */ +export interface Supports { + [k: string]: Website; +} +/** + * The unique identifier of the supported website, usually the name of the website lowercased. + * + * This interface was referenced by `Supports`'s JSON-Schema definition + * via the `patternProperty` "[A-Za-z0-9_\-]". */ -export interface README { - "app-link": ApplicationLink; - usage?: Usage; - faq?: FAQ; - [k: string]: unknown; +export interface Website { + name: WebsiteName; + link: Link; } diff --git a/scripts/update-types.ts b/scripts/update-types.ts deleted file mode 100755 index a3303e966b..0000000000 --- a/scripts/update-types.ts +++ /dev/null @@ -1,16 +0,0 @@ -#!/usr/bin/env -S deno run -A -// deno-lint-ignore-file no-explicit-any -import { join } from "@std/path"; -import { compile, Options } from "json-schema-to-typescript"; -import { REPO_ROOT, userStylesSchema } from "@/deps.ts"; - -const options = { - bannerComment: "// deno-fmt-ignore-file", -} satisfies Partial; - -const TYPES_ROOT = join(REPO_ROOT, "scripts/types"); - -compile(userStylesSchema as any, "UserstylesSchema", options) - .then((ts) => - Deno.writeTextFileSync(join(TYPES_ROOT, "userstyles.d.ts"), ts) - ); diff --git a/scripts/userstyles.schema.json b/scripts/userstyles.schema.json index b450b68714..01846fe7c4 100644 --- a/scripts/userstyles.schema.json +++ b/scripts/userstyles.schema.json @@ -7,7 +7,7 @@ "$id": "#userstyles", "title": "Userstyles", "type": "object", - "description": "All userstyles in the Catppuccin org.", + "description": "All userstyles in the Catppuccin organisation.", "patternProperties": { "[A-Za-z0-9_\\-]": { "$id": "#userstyles/userstyle", @@ -15,121 +15,59 @@ "type": "object", "description": "The directory of the userstyle.", "examples": ["youtube"], - "required": ["name", "categories", "readme", "color", "current-maintainers"], "additionalProperties": false, "properties": { "name": { - "$id": "#userstyles/userstyle/name", - "title": "Name", - "description": "The name of the userstyle(s).", - "oneOf": [ - { - "type": "array", - "items": { - "type": "string" - }, - "minItems": 2, - "examples": [["AniList", "AniChart"]] - }, - { - "type": "string", - "examples": ["YouTube"] - } - ] + "description": "The name of the userstyle.", + "$ref": "#/$defs/name" + }, + "link": { + "$ref": "#/$defs/link" }, "categories": { - "$id": "#userstyles/userstyle/categories", - "title": "Categories", - "description": "The categories that fit the userstyle the most, the first category is the primary category which the userstyle will be listed under on the README.", "$ref": "#/$defs/categories" }, "color": { - "$id": "#userstyles/userstyle/color", - "title": "Color", - "description": "The fill color for the icon on the Catppuccin website, which should match the color used by Simple Icons. If the icon does not exist in Simple Icons, choose the most suitable color from the branding.", - "type": "string", - "enum": [ - "rosewater", - "flamingo", - "pink", - "mauve", - "red", - "maroon", - "peach", - "yellow", - "green", - "teal", - "sky", - "sapphire", - "blue", - "lavender", - "text" - ], - "examples": ["pink"] + "$ref": "#/$defs/color" }, "icon": { - "$id": "#userstyles/userstyle/icon", - "title": "Icon", - "description": "The icon to use on the website. This should be the same name as the SVG file on https://simpleicons.org/. If a `.svg` suffix is present, it's taken from the local website repository resources.", - "type": "string", - "examples": ["twitch", "twitch.svg"] + "$ref": "#/$defs/icon" }, - "readme": { - "$id": "#userstyles/userstyle/readme", - "title": "README", - "description": "Options to help in the auto-generation of the userstyle README.", + "note": { + "$id": "#userstyles/userstyle/note", + "title": "Note", + "description": "An additional note that users should read.", + "type": "string" + }, + "supports": { + "$id": "#userstyles/userstyle/supports", + "title": "Supports", "type": "object", - "required": ["app-link"], - "properties": { - "app-link": { - "$id": "#userstyles/userstyle/readme/app-link", - "title": "Application Link", - "description": "The hyperlink of the app that is being themed.", - "oneOf": [ - { - "type": "array", - "items": { - "type": "string" - }, - "minItems": 2, - "examples": [ - ["https://anilist.co", "https://anichart.net"] - ] + "description": "All websites that the userstyle also supports.", + "patternProperties": { + "[A-Za-z0-9_\\-]": { + "$id": "#userstyles/userstyle/supports/website", + "title": "Website", + "type": "object", + "description": "The unique identifier of the supported website, usually the name of the website lowercased.", + "examples": ["anichart"], + "additionalProperties": false, + "properties": { + "name": { + "$id": "#userstyles/userstyle/supports/website/name", + "title": "Website Name", + "description": "The name of the website.", + "examples": ["AniChart"], + "$ref": "#/$defs/name" }, - { - "type": "string", - "examples": ["https://github.com"] + "link": { + "$ref": "#/$defs/link" } + }, + "required": [ + "name", + "link" ] - }, - "usage": { - "$id": "#userstyles/userstyle/readme/usage", - "title": "Usage", - "description": "The Usage section of the userstyle README.", - "type": "string" - }, - "faq": { - "$id": "#userstyles/userstyle/readme/faq", - "title": "FAQ", - "description": "The FAQ section of the userstyle README.", - "type": "array", - "minItems": 1, - "items": { - "type": "object", - "properties": { - "question": { - "type": "string", - "title": "Question", - "description": "A question that a user may have about the userstyle." - }, - "answer": { - "type": "string", - "title": "Answer", - "description": "An answer to the question about the userstyle." - } - }, - "required": ["question", "answer"] - } } } }, @@ -148,7 +86,14 @@ "description": "List of all users that have maintained this userstyle in the past.", "$ref": "#/$defs/collaborators" } - } + }, + "required": [ + "name", + "categories", + "link", + "color", + "current-maintainers" + ] } } }, @@ -162,75 +107,67 @@ } }, "$defs": { + "name": { + "$id": "#name", + "title": "Name", + "type": "string", + "examples": ["YouTube"] + }, + "link": { + "$id": "#link", + "title": "Link", + "description": "The url of the website that is being themed.", + "type": "string" + }, + "color": { + "$id": "#color", + "title": "Color", + "description": "The fill color for the icon on the Catppuccin website, which should match the color used by Simple Icons. If the icon does not exist in Simple Icons, choose the most suitable color from the branding.", + "type": "string", + "enum": [ + "rosewater", + "flamingo", + "pink", + "mauve", + "red", + "maroon", + "peach", + "yellow", + "green", + "teal", + "sky", + "sapphire", + "blue", + "lavender", + "text" + ], + "examples": ["pink"] + }, + "icon": { + "$id": "#icon", + "title": "Icon", + "description": "The icon to use on the website. This should be the same name as the SVG file on https://simpleicons.org/. If a `.svg` suffix is present, it's taken from the local website repository resources.", + "type": "string", + "examples": ["twitch", "twitch.svg"] + }, "collaborators": { "$id": "#collaborators", + "description": "The GitHub username of the collaborator.", "type": "array", "items": { - "type": "object", - "properties": { - "name": { - "type": "string", - "title": "Display Name", - "description": "The display name of the collaborator to show in the userstyle README." - }, - "url": { - "type": "string", - "title": "GitHub Profile", - "description": "The GitHub profile link of the collaborator to show in the userstyle README." - } - }, - "required": ["url"] + "type": "string" } }, "categories": { "$id": "#categories", "type": "array", + "title": "Categories", + "description": "The categories that fit the userstyle the most, the first category is the primary category which the userstyle will be listed under on the README.", "minItems": 1, "maxItems": 3, "items": { - "$ref": "#/$defs/category" + "$ref": "https://raw.githubusercontent.com/catppuccin/catppuccin/refs/heads/main/resources/categories.schema.json#/$defs/category" } - }, - "category": { - "$id": "#category", - "type": "string", - "enum": [ - "3d_modelling", - "analytics", - "application_launcher", - "artificial_intelligence", - "boot_loader", - "browser", - "browser_extension", - "cli", - "code_editor", - "desktop_environment", - "development", - "discussion_forum", - "document_viewer", - "education", - "email_client", - "entertainment", - "file_manager", - "game", - "game_development", - "health_and_fitness", - "library", - "music", - "note_taking", - "notification_daemon", - "photo_and_video", - "productivity", - "search_engine", - "self_hosted", - "social_networking", - "system", - "terminal", - "translation_tool", - "userstyle", - "wiki", - "window_manager" - ] } } } diff --git a/scripts/userstyles.yml b/scripts/userstyles.yml index a9ae7349ac..57c1872f88 100644 --- a/scripts/userstyles.yml +++ b/scripts/userstyles.yml @@ -1,987 +1,1028 @@ collaborators: - - &anubisnekhet - url: https://github.com/AnubisNekhet - - &ndsboy - url: https://github.com/ndsboy - - &jn-sena - name: Sena - url: https://github.com/jn-sena - - &watatomo - name: Ren - url: https://github.com/watatomo - - &ryanccn - name: Ryan Cao - url: https://github.com/ryanccn - - &pocco81 - url: https://github.com/Pocco81 - - &glowingumbreon - name: Umbreon - url: https://github.com/GlowingUmbreon - - &justtobbi - url: https://github.com/justTOBBI - - &unseen-ninja - name: Lemon - url: https://github.com/unseen-ninja - - &lucasmelin - name: Lucas Melin - url: https://github.com/lucasmelin - - &gingeh - url: https://github.com/Gingeh - - &isabelroses - name: Isabel - url: https://github.com/isabelroses - - &thismoon - url: https://github.com/thismoon - - &cecelot - name: Sydney Newmark - url: https://github.com/cecelot - - &soya-daizu - name: soya_daizu - url: https://github.com/soya-daizu - - &jayylmao - url: https://github.com/jayylmao - - &sekki21956 - name: Sekki - url: https://github.com/Sekki21956 - - &winston - name: winston - url: https://github.com/nekowinston - - &gitmuslim - url: https://github.com/GitMuslim - - &tnixc - name: Tnixc - url: https://github.com/Tnixc - - &elkrien - name: Elkrien - url: https://github.com/elkrien - - &thememesniper - name: TheMemeSniper - url: https://github.com/TheMemeSniper - - &spaghettiosareyummy - url: https://github.com/spaghettiosareyummy - - &stonks3141 - name: Stonks3141 - url: https://github.com/Stonks3141 - - &rubyowo - url: https://github.com/rubyowo - - &gandalf-the-blue - name: Gandalf the Blue - url: https://github.com/Gandalf-the-Blue - - &francorav - name: FrancoRav - url: https://github.com/FrancoRav - - &coldenate - name: coldenate - url: https://github.com/coldenate - - &skelebro1 - name: skele - url: https://github.com/skelebro1 - - &r58Playz - name: r58Playz - url: https://github.com/r58Playz - - &rockquiet - name: rockquiet - url: https://github.com/rockquiet - - &nyameliaaaa - name: Amelia Rose - url: https://github.com/Nyameliaaaa - - &nyatalieeee - name: Natalie Raine - url: https://github.com/Nyatalieeee - - &bartlibert - name: Bart Libert - url: https://github.com/bartlibert - - &BlankParticle - name: BlankParticle - url: https://github.com/BlankParticle - - &genshibe - name: GenShibe - url: https://github.com/GenShibe - - &coopw1 - name: coopw - url: https://github.com/coopw1 - - &rooot - name: rooot - url: https://github.com/RoootTheFox - - &itzTheMeow - name: Meow - url: https://github.com/itzTheMeow - - &Dandraghas - name: Dandraghas - url: https://github.com/Dandraghas - - &uncenter - name: uncenter - url: https://github.com/uncenter - - &thomas-philippot - name: Thomas Philippot - url: https://github.com/thomas-philippot - - &Guaxinim5573 - name: Guaxinim5573 - url: https://github.com/Guaxinim5573 - - &trinkey - url: https://github.com/trinkey - - &NK308 - url: https://github.com/NK308 - name: NK308 - - &00dani - url: https://github.com/00dani - - &kerichdev - name: keri - url: https://github.com/kerichdev - - &Flapperoo - name: Eli - url: https://github.com/Flapperoo - - &jh-devv - name: jh-devv - url: https://github.com/jh-devv - - &stellophiliac - url: https://github.com/stellophiliac - - &neongamerbot - url: https://github.com/NeonGamerBot-QK + - &nik-rev nik-rev + - &AlwaysNur AlwaysNur + - &AnubisNekhet AnubisNekhet + - &ndsboy ndsboy + - &jn-sena jn-sena + - &watatomo watatomo + - &ryanccn ryanccn + - &Pocco81 Pocco81 + - &GlowingUmbreon GlowingUmbreon + - &justTOBBI justTOBBI + - &unseen-ninja unseen-ninja + - &lucasmelin lucasmelin + - &Gingeh Gingeh + - &isabelroses isabelroses + - &thismoon thismoon + - &sydrinea sydrinea + - &soya-daizu soya-daizu + - &jayylmao jayylmao + - &Sekki21956 Sekki21956 + - &nekowinston nekowinston + - &Tnixc Tnixc + - &elkrien elkrien + - &TheMemeSniper TheMemeSniper + - &spaghettiosareyummy spaghettiosareyummy + - &Stonks3141 Stonks3141 + - &rubyowo rubyowo + - &Gandalf-the-Blue Gandalf-the-Blue + - &FrancoRav FrancoRav + - &coldenate coldenate + - &skelebro1 skelebro1 + - &r58Playz r58Playz + - &rockquiet rockquiet + - &Nyameliaaaa Nyameliaaaa + - &Meowcelinee Meowcelinee + - &bartlibert bartlibert + - &BlankParticle BlankParticle + - &GenShibe GenShibe + - &coopw1 coopw1 + - &RoootTheFox RoootTheFox + - &itzTheMeow itzTheMeow + - &Dandraghas Dandraghas + - &uncenter uncenter + - &thomas-philippot thomas-philippot + - &Guaxinim5573 Guaxinim5573 + - &trinkey trinkey + - &NK308 NK308 + - &00dani 00dani + - &kerichdev kerichdev + - &Flapperoo Flapperoo + - &sofiedotcafe sofiedotcafe + - &stellophiliac stellophiliac + - &bunfluff bunfluff + - &NeonGamerBot-QK NeonGamerBot-QK + - &orangci orangci + - &Lichthagel Lichthagel + - &comfysage comfysage + - &janTatesa janTatesa + - &mxgic1337 mxgic1337 + - &steinuil steinuil + - &husjon husjon + - &RaiderHCPlay RaiderHCPlay + - &ruiiiijiiiiang ruiiiijiiiiang + - &pynappo pynappo + - &nuexq nuexq + - &WalkQuackBack WalkQuackBack + - &gradylink gradylink + - &ashish0kumar ashish0kumar + - &shnjd shnjd + - &zenoix zenoix + - &incognitotgt incognitotgt + - &NekoDrone NekoDrone + - &adamperkowski adamperkowski + - &ImenaOphelia ImenaOphelia + - &koibtw koibtw + - &TheAnonymousCrusher TheAnonymousCrusher + - &42willow 42willow userstyles: advent-of-code: name: Advent Of Code + link: https://adventofcode.com categories: [game, entertainment] icon: adventofcode color: yellow - readme: - app-link: https://adventofcode.com current-maintainers: [*rubyowo] + alacritty.org: + name: alacritty.org + link: https://alacritty.org + categories: [terminal, development] + icon: alacritty + color: peach + current-maintainers: [*AlwaysNur] + alternativeto: + name: AlternativeTo + link: https://alternativeto.net + categories: [productivity, discussion_forum] + color: sapphire + current-maintainers: [*thismoon] amplenote: name: Amplenote - categories: [productivity] + link: https://www.amplenote.com + categories: [note_taking] color: blue - readme: - app-link: "https://www.amplenote.com" current-maintainers: [*stellophiliac] anilist: - name: ["AniList", "AniChart"] + name: AniList + link: https://anilist.co categories: [entertainment, social_networking] icon: anilist color: sky - readme: - app-link: ["https://anilist.co", "https://anichart.net"] - usage: |+ - > [!NOTE] - > This theme applies to [AniChart](https://anichart.net/) as well, which is an extension of AniList. - current-maintainers: [*anubisnekhet] + supports: + anichart: + name: AniChart + link: https://anichart.net + current-maintainers: [*AnubisNekhet] + anonymous-overflow: + name: Anonymous Overflow + categories: [discussion_forum, wiki] + color: green + link: https://github.com/httpjamesm/AnonymousOverflow + current-maintainers: [*ImenaOphelia] arch-wiki: name: Arch Wiki - categories: [wiki, productivity] + link: https://wiki.archlinux.org + categories: [wiki] icon: archlinux color: blue - readme: - app-link: "https://wiki.archlinux.org/" - usage: "Make sure to use the default **Light** theme" + note: "Make sure to use the default **Light** theme." current-maintainers: [] - past-maintainers: [*genshibe] + past-maintainers: [*GenShibe] boringproxy: name: boringproxy + link: https://boringproxy.io categories: [development] color: text - readme: - app-link: "https://boringproxy.io" - current-maintainers: [*gandalf-the-blue] + current-maintainers: [*Gandalf-the-Blue] brave-search: name: Brave Search + link: https://search.brave.com categories: [search_engine] icon: brave color: peach - readme: - app-link: "https://search.brave.com" - usage: "Make sure to set the theme to either dark or light in Brave Search settings, as the automatic setting will not work." + note: "Make sure to set the theme to either dark or light in Brave Search settings, as the automatic setting will not work." current-maintainers: [*ndsboy] bsky: name: Bluesky Social - categories: [social_networking, entertainment] + link: https://bsky.app + categories: [social_networking] icon: bluesky color: blue - readme: - app-link: "https://bsky.app" - current-maintainers: [*rooot] + current-maintainers: [*RoootTheFox] bstats: name: bStats - categories: [game, entertainment] + link: https://bstats.org + categories: [analytics, game_development] color: green - readme: - app-link: "https://bstats.org" - usage: "Make sure to use the default **Teal** theme from the built-in color picker (located at the bottom of the page) for the best experience!" + note: "Make sure to use the default **Teal** theme from the built-in color picker (located at the bottom of the page) for the best experience!" current-maintainers: [*rockquiet] canvas-lms: name: Canvas LMS - categories: [education, productivity] + link: https://www.instructure.com/canvas + categories: [education] icon: canvas color: red - readme: - app-link: "https://www.instructure.com/canvas" - current-maintainers: [] - past-maintainers: [*thememesniper] + current-maintainers: [*pynappo] + past-maintainers: [*TheMemeSniper] chatgpt: name: ChatGPT - categories: [artificial_intelligence, productivity] + link: https://chat.openai.com + categories: [artificial_intelligence] icon: openai color: green - readme: - app-link: "https://chat.openai.com" current-maintainers: [*uncenter] past-maintainers: [*rubyowo] chatreplay: name: ChatReplay + link: https://chatreplay.stream categories: [entertainment, social_networking] color: peach - readme: - app-link: "https://chatreplay.stream" - current-maintainers: [*anubisnekhet] + current-maintainers: [*AnubisNekhet] chess.com: name: Chess.com - categories: [game, education] + link: https://chess.com + categories: [game] icon: chessdotcom color: green - readme: - app-link: "https://chess.com" - current-maintainers: [] + current-maintainers: [*uncenter] past-maintainers: [*skelebro1, *isabelroses, *coldenate] cinny: name: Cinny + link: https://cinny.in categories: [social_networking] color: text - readme: - app-link: "https://cinny.in" current-maintainers: [*jn-sena] + claude: + name: Claude + link: https://claude.ai + categories: [artificial_intelligence, productivity] + color: peach + icon: claude + current-maintainers: [*ruiiiijiiiiang] codeberg: name: Codeberg - categories: [development, productivity] + link: https://codeberg.org + categories: [development] icon: codeberg color: blue - readme: - app-link: "https://codeberg.org" current-maintainers: [*isabelroses] - past-maintainers: [*justtobbi] + past-maintainers: [*justTOBBI] cobalt: name: cobalt + link: https://cobalt.tools categories: [productivity, photo_and_video] color: text - readme: - app-link: "https://cobalt.tools" current-maintainers: [*kerichdev] crates.io: name: crates.io - categories: [development] + link: https://crates.io + categories: [package_registry] icon: rust color: yellow - readme: - app-link: "https://crates.io" current-maintainers: [*uncenter] crowdin: name: Crowdin - categories: [translation_tool, productivity] + link: https://crowdin.com + categories: [translation_tool] icon: crowdin color: text - readme: - app-link: "https://crowdin.com" current-maintainers: [*ryanccn] deepl: name: DeepL - categories: [translation_tool, productivity] + link: https://deepl.com + categories: [translation_tool] icon: deepl color: blue - readme: - app-link: "https://deepl.com" current-maintainers: [*watatomo] + deepseek: + name: DeepSeek + link: https://chat.deepseek.com + categories: [artificial_intelligence] + icon: deepseek + color: blue + current-maintainers: [*WalkQuackBack] + desmos: + name: Desmos + link: https://desmos.com + categories: [education] + color: green + note: "This userstyle is currently incompatible with DesModder's Visual>Syntax Highlighting plugin." + current-maintainers: [*gradylink] + dev.to: + name: DEV Community + link: https://dev.to + categories: [discussion_forum] + icon: devdotto + color: text + current-maintainers: [*shnjd] + devdocs: + name: DevDocs + link: https://devdocs.io + categories: [development, wiki] + color: text + current-maintainers: [*ashish0kumar] + docs.deno.com: + name: docs.deno.com + link: https://docs.deno.com + categories: [development] + icon: deno + color: green + current-maintainers: [*uncenter] docs.rs: name: docs.rs + link: https://docs.rs categories: [development] icon: docsdotrs color: yellow - readme: - app-link: "https://docs.rs" current-maintainers: [*uncenter] duckduckgo: name: DuckDuckGo + link: https://duckduckgo.com categories: [search_engine] icon: duckduckgo color: peach - readme: - app-link: "https://duckduckgo.com" - current-maintainers: [*genshibe] + current-maintainers: [*GenShibe] ecosia: name: Ecosia + link: https://www.ecosia.org categories: [search_engine] color: green - readme: - app-link: "https://www.ecosia.org" - current-maintainers: [*isabelroses] + current-maintainers: [] + past-maintainers: [*isabelroses] elk: name: Elk + link: https://elk.zone categories: [social_networking] color: peach - readme: - app-link: "https://elk.zone" current-maintainers: [*ryanccn] freedesktop: name: freedesktop.org + link: https://www.freedesktop.org categories: [development] icon: freedesktopdotorg color: blue - readme: - app-link: "https://www.freedesktop.org" current-maintainers: [*NK308] formative: name: Formative - categories: [education, productivity] + link: https://app.formative.com/home + categories: [education] + color: blue + current-maintainers: [] + past-maintainers: [*r58Playz] + ghostty.org: + name: Ghostty.org + link: https://ghostty.org + categories: [terminal] color: blue - readme: - app-link: "https://app.formative.com/home" - current-maintainers: [*r58Playz] + current-maintainers: [*uncenter] github: name: GitHub + link: https://github.com categories: [development, productivity] icon: github color: text - readme: - usage: "Switch to a default GitHub light/dark theme via **Settings** > **Appearance** for the best experience!" - app-link: "https://github.com" + note: "Use the **Light default** or **Dark default** themes and disable *Increase contrast* under GitHub's [Theme preferences](https://github.com/settings/appearance)." + current-maintainers: [*uncenter] + past-maintainers: [*unseen-ninja, *Pocco81, *GlowingUmbreon] + gleam.run: + name: gleam.run + link: https://gleam.run + categories: [development] + icon: gleam + color: pink current-maintainers: [*uncenter] - past-maintainers: [*unseen-ninja, *pocco81, *glowingumbreon] gmail: name: Gmail - categories: [email_client, productivity] + link: https://mail.google.com + categories: [email_client] icon: gmail color: peach - readme: - usage: "Switch to the default dark theme via the **Settings** > **Themes** > **View all** for the best experience!" - app-link: "https://mail.google.com" + note: "Switch to the default dark theme via the **Settings** > **Themes** > **View all** for the best experience!" current-maintainers: [*uncenter] past-maintainers: [*isabelroses] go.dev: name: go.dev + link: https://go.dev categories: [development, wiki] icon: go color: sapphire - readme: - app-link: "https://go.dev" current-maintainers: [*Flapperoo] google: name: Google + link: https://google.com categories: [search_engine] icon: google color: sapphire - readme: - app-link: "https://google.com" - current-maintainers: [*gitmuslim] + current-maintainers: [] google-drive: name: Google Drive + link: https://drive.google.com categories: [productivity] icon: googledrive color: blue - readme: - app-link: "https://drive.google.com" - current-maintainers: [*r58Playz] + current-maintainers: [*r58Playz, *WalkQuackBack] google-photos: name: Google Photos + link: https://photos.google.com categories: [photo_and_video] icon: googlephotos color: sapphire - readme: - app-link: "https://photos.google.com" - current-maintainers: [*genshibe] + current-maintainers: [*GenShibe, *WalkQuackBack] + grabify: + name: Grabify + link: https://grabify.link + categories: [development, productivity] + color: teal + current-maintainers: [*trinkey] graphite: name: Graphite + link: https://app.graphite.com categories: [development, productivity] icon: graphite color: text - readme: - app-link: "https://app.graphite.dev" - current-maintainers: [*isabelroses] + current-maintainers: [] + past-maintainers: [*isabelroses] google-gemini: name: Google Gemini - categories: [artificial_intelligence, productivity] + link: https://gemini.google.com + categories: [artificial_intelligence] icon: googlegemini color: mauve - readme: - app-link: "https://gemini.google.com" - current-maintainers: [*Dandraghas] + current-maintainers: [*Dandraghas, *WalkQuackBack] hackage: name: Hackage - categories: [development, productivity] + link: https://hackage.haskell.org + categories: [package_registry] icon: haskell color: mauve - readme: - app-link: "https://hackage.haskell.org" current-maintainers: [*jn-sena] hacker-news: name: Hacker News - categories: [discussion_forum, entertainment, social_networking] + link: https://news.ycombinator.com + categories: [discussion_forum] icon: ycombinator color: peach - readme: - app-link: "https://news.ycombinator.com" current-maintainers: [*lucasmelin] have-i-been-pwned: name: Have I Been Pwned + link: https://haveibeenpwned.com categories: [productivity] color: blue - readme: - app-link: "https://haveibeenpwned.com" current-maintainers: [*trinkey] holodex: name: Holodex + link: https://holodex.net categories: [entertainment, social_networking, photo_and_video] color: pink - readme: - app-link: "https://holodex.net" - usage: |+ - > [!NOTE] - > Holodex's selected theme is ignored. + note: Holodex's selected theme is ignored. current-maintainers: [*Guaxinim5573] home-manager-options-search: name: Home Manager Options Search + link: https://home-manager-options.extranix.com categories: [development] color: blue - readme: - app-link: "https://home-manager-options.extranix.com" current-maintainers: [*uncenter] homepage: name: homepage + link: https://github.com/benphelps/homepage categories: [productivity] color: sky - readme: - app-link: "https://github.com/benphelps/homepage" - current-maintainers: [*gandalf-the-blue] + current-maintainers: [*Gandalf-the-Blue] + hoogle: + name: Hoogle + link: https://hoogle.haskell.org + categories: [development, search_engine] + icon: haskell + color: mauve + current-maintainers: [*jn-sena] hoppscotch: name: Hoppscotch + link: https://hoppscotch.io categories: [development, productivity] icon: hoppscotch color: green - readme: - app-link: "https://hoppscotch.io/" - current-maintainers: [*justtobbi] + current-maintainers: [*justTOBBI] + learn-x-in-y-minutes: + name: Learn X in Y Minutes + link: https://learnxinyminutes.com + categories: [development, wiki] + color: blue + current-maintainers: [*nik-rev] hyperpipe: name: Hyperpipe + link: https://hyperpipe.surge.sh categories: [music] color: teal - readme: - app-link: "https://hyperpipe.surge.sh/" - current-maintainers: [*jn-sena] + current-maintainers: [] + past-maintainers: [*jn-sena] ichi.moe: name: ichi.moe - categories: [translation_tool, productivity] + link: https://ichi.moe + categories: [translation_tool] color: pink - readme: - app-link: "https://ichi.moe" current-maintainers: [*watatomo] inoreader: name: inoreader + link: https://inoreader.com categories: [productivity] icon: inoreader color: blue - readme: - app-link: "https://inoreader.com" current-maintainers: [*thomas-philippot] + indie-wiki-buddy: + name: Indie Wiki Buddy + link: https://getindie.wiki + categories: [browser_extension] + color: blue + current-maintainers: [*thismoon] instagram: name: Instagram - categories: [social_networking, photo_and_video, entertainment] + link: https://instagram.com + categories: [social_networking, photo_and_video] icon: instagram color: pink - readme: - app-link: "https://instagram.com" - current-maintainers: [*genshibe] + current-maintainers: [*GenShibe] past-maintainers: [*isabelroses] invidious: name: Invidious - categories: [entertainment, social_networking] + link: https://invidious.io + categories: [entertainment] icon: youtube color: red - readme: - app-link: "https://invidious.io" current-maintainers: [] - past-maintainers: [*unseen-ninja, *winston] + past-maintainers: [*unseen-ninja, *nekowinston] invokeai: name: InvokeAI + link: https://invoke-ai.github.io/InvokeAI categories: [artificial_intelligence, productivity] color: yellow - readme: - app-link: "https://invoke-ai.github.io/InvokeAI" current-maintainers: [*ryanccn] + jisho: + name: Jisho + link: https://jisho.org + categories: [translation_tool] + color: green + current-maintainers: [*Lichthagel] + keybr.com: + name: keybr.com + link: https://keybr.com + categories: [productivity, education] + color: text + current-maintainers: [*janTatesa] keyoxide: name: Keyoxide + link: https://keyoxide.org categories: [development] color: mauve - readme: - app-link: "https://keyoxide.org" current-maintainers: [*uncenter] lastfm: name: Last.fm - categories: [music, entertainment] + link: https://last.fm + categories: [music, analytics] icon: lastdotfm color: red - readme: - app-link: "https://last.fm" - current-maintainers: [*anubisnekhet] - past-maintainers: [*gingeh] + current-maintainers: [*AnubisNekhet] + past-maintainers: [*Gingeh] lemmy: name: Lemmy - categories: [discussion_forum, entertainment, social_networking] + link: https://lemmy.world + categories: [discussion_forum, social_networking] icon: lemmy color: green - readme: - app-link: "https://lemmy.world" - current-maintainers: [*gandalf-the-blue] + current-maintainers: [*Gandalf-the-Blue] libreddit: - name: ["Libreddit", "Redlib"] - categories: [discussion_forum, entertainment, social_networking] + name: Libreddit + link: https://github.com/libreddit/libreddit + categories: [discussion_forum, social_networking] icon: reddit color: peach - readme: - app-link: ["https://github.com/libreddit/libreddit", "https://github.com/redlib-org/redlib"] + supports: + redlib: + name: Redlib + link: https://github.com/redlib-org/redlib current-maintainers: [] past-maintainers: [*unseen-ninja] lichess: name: Lichess + link: https://lichess.org categories: [game] icon: lichess color: text - readme: - usage: "Switch to a default Lichess light/dark theme via **Username** > **Background** for the best experience!" - app-link: "https://lichess.org/" - current-maintainers: [*coopw1] + note: "Switch to a default Lichess light/dark theme via **Username** > **Background** for the best experience!" + current-maintainers: [*coopw1, *zenoix] lingva: name: Lingva - categories: [translation_tool, productivity] + link: https://github.com/thedaviddelta/lingva-translate + categories: [translation_tool] color: green - readme: - app-link: "https://github.com/thedaviddelta/lingva-translate" current-maintainers: [*rubyowo] linkedin: name: LinkedIn - categories: [social_networking] + link: https://www.linkedin.com + categories: [social_networking, productivity] icon: linkedin color: blue - readme: - app-link: "https://www.linkedin.com" - current-maintainers: [*isabelroses] + current-maintainers: [] + past-maintainers: [*isabelroses] listenbrainz: name: ListenBrainz - categories: [music, entertainment] + link: https://listenbrainz.org + categories: [music] icon: musicbrainz color: peach - readme: - app-link: 'https://listenbrainz.org' current-maintainers: [*00dani] + lobste.rs: + name: Lobsters + link: https://lobste.rs + categories: [discussion_forum, social_networking] + icon: lobsters + color: red + current-maintainers: [*steinuil] mastodon: name: Mastodon - categories: [social_networking, entertainment] + link: https://github.com/mastodon/mastodon + categories: [social_networking] icon: mastodon color: lavender - readme: - app-link: "https://github.com/mastodon/mastodon" - faq: - - question: "**The theme does not look the same as the preview?**" - answer: "Your Mastodon instance may be using its own custom CSS, which is changing the look of the theme." - current-maintainers: [] + current-maintainers: [*comfysage] past-maintainers: [*unseen-ninja, *isabelroses] mdbook: name: mdBook - categories: [wiki, development] + link: https://rust-lang.github.io/mdBook/ + categories: [documentation_generator] icon: mdbook color: text - readme: - app-link: "https://rust-lang.github.io/mdBook/" current-maintainers: [*uncenter] mdn: name: MDN + link: https://developer.mozilla.org categories: [development, wiki] icon: mdnwebdocs color: text - readme: - app-link: "https://developer.mozilla.org" current-maintainers: [*soya-daizu] modrinth: name: Modrinth + link: https://modrinth.com categories: [game] icon: modrinth color: green - readme: - app-link: "https://modrinth.com" current-maintainers: [*thismoon] microsoft-word: name: Microsoft Word + link: https://office.com categories: [productivity] icon: microsoftword color: blue - readme: - app-link: "https://office.com" - current-maintainers: [*gitmuslim] + current-maintainers: [] migadu-webmail: name: Migadu Webmail - categories: [email_client, productivity] + link: https://webmail.migadu.com + categories: [email_client] icon: migadu color: blue - readme: - app-link: https://webmail.migadu.com/ - usage: |+ - > [!NOTE] - > Set Migadu Webmail's built-in theme to 'Migadu' for the optimal experience. + note: Set Migadu Webmail's built-in theme to 'Migadu' for the optimal experience. current-maintainers: [*uncenter] minesweeper: name: Minesweeper Online + link: https://minesweeper.online categories: [game] color: text - readme: - app-link: "https://minesweeper.online" - current-maintainers: [*gitmuslim] + current-maintainers: [] namemc: name: NameMC - categories: [game_development, analytics, discussion_forum] + link: https://namemc.com + categories: [game_development, analytics] icon: namemc color: blue - readme: - app-link: "https://namemc.com/" - current-maintainers: [*nyatalieeee] + current-maintainers: [*Meowcelinee] + neovim.io: + name: neovim.io + link: https://neovim.io + categories: [development] + icon: neovim + color: green + current-maintainers: [*comfysage] + npmx: + name: npmx + link: https://npmx.dev + categories: [package_registry] + color: text + note: npmx-specific accent color appearance options at https://npmx.dev/settings are overriden by this userstyle. + current-maintainers: [*42willow] nitter: name: Nitter - categories: [social_networking, discussion_forum, entertainment] + link: https://nitter.net + categories: [social_networking, discussion_forum] icon: twitter color: blue - readme: - app-link: "https://nitter.net" - current-maintainers: [*anubisnekhet] + current-maintainers: [*AnubisNekhet] + nixos-manual: + name: NixOS Manual + link: https://nixos.org/manual/nixos + categories: [development, wiki] + icon: nixos + color: blue + supports: + nixpkgs-manual: + name: "Nixpkgs Manual" + link: https://nixos.org/manual/nixpkgs + current-maintainers: [*husjon] nixos-search: name: NixOS Search + link: https://search.nixos.org categories: [search_engine] icon: nixos color: blue - readme: - app-link: "https://search.nixos.org" - current-maintainers: [*cecelot] - nixos.wiki: + current-maintainers: [*sydrinea] + wiki.nixos.org: name: NixOS Wiki - categories: [wiki, productivity] + link: https://wiki.nixos.org + categories: [wiki, development] icon: nixos color: blue - readme: - app-link: "https://nixos.wiki" - current-maintainers: [] - past-maintainers: [*winston] + current-maintainers: [*orangci] + past-maintainers: [*nekowinston] npm: name: npm - categories: [development] + link: https://www.npmjs.com + categories: [package_registry] icon: npm color: red - readme: - app-link: "https://www.npmjs.com/" current-maintainers: [*uncenter] ollama: name: Ollama - categories: [development] + link: https://ollama.com + categories: [artificial_intelligence, development] color: text - readme: - app-link: "https://ollama.com" - current-maintainers: [*neongamerbot] + current-maintainers: [*NeonGamerBot-QK] openmediavault: name: openmediavault - categories: [productivity] + link: https://www.openmediavault.org + categories: [file_manager, productivity] icon: openmediavault color: sky - readme: - app-link: "https://www.openmediavault.org/" - current-maintainers: [*gandalf-the-blue] + current-maintainers: [*Gandalf-the-Blue] paste.rs: name: paste.rs + link: https://paste.rs categories: [development] icon: pastebin color: peach - readme: - app-link: "https://paste.rs" current-maintainers: [*Guaxinim5573] - past-maintainers: [*stonks3141] + past-maintainers: [*Stonks3141] perplexity: name: Perplexity + link: https://www.perplexity.ai categories: [artificial_intelligence, search_engine] icon: perplexity color: teal - readme: - app-link: "https://www.perplexity.ai" - current-maintainers: [*tnixc] + current-maintainers: [*Tnixc] past-maintainers: [*isabelroses] phanpy: name: Phanpy - categories: [social_networking, entertainment] + link: https://phanpy.social + categories: [social_networking] color: blue - readme: - app-link: "https://phanpy.social" current-maintainers: [*Guaxinim5573] picrew: name: Picrew - categories: [entertainment, photo_and_video] + link: https://picrew.me + categories: [entertainment, productivity] icon: picrew color: yellow - readme: - app-link: "https://picrew.me" - current-maintainers: [*nyatalieeee] + current-maintainers: [*Meowcelinee] pinterest: name: Pinterest + link: https://www.pinterest.com categories: [photo_and_video, entertainment, social_networking] icon: pinterest color: red - readme: - app-link: "https://www.pinterest.com" - current-maintainers: [] + current-maintainers: [*nuexq] past-maintainers: [*jn-sena] planet-minecraft: name: Planet Minecraft + link: https://planetminecraft.com categories: [game] color: green - readme: - app-link: "https://planetminecraft.com" - current-maintainers: [*nyameliaaaa] + current-maintainers: [*Nyameliaaaa] + poe: + name: Poe + link: https://poe.com + categories: [artificial_intelligence] + icon: poe + color: blue + current-maintainers: [*TheAnonymousCrusher] porkbun: name: Porkbun + link: https://porkbun.com categories: [productivity] icon: porkbun color: pink - readme: - app-link: https://porkbun.com current-maintainers: [*uncenter] + pronouns.cc: + name: pronouns.cc + link: https://pronouns.cc + categories: [social_networking] + color: mauve + current-maintainers: [*comfysage] + past-maintainers: [*NeonGamerBot-QK] pronouns.page: name: Pronouns.page + link: https://pronouns.page categories: [social_networking] icon: pronounsdotpage color: pink - readme: - app-link: "https://pronouns.page/" current-maintainers: [*uncenter] proton: name: Proton + link: https://proton.me categories: [productivity, email_client] icon: protonmail color: mauve - readme: - app-link: "https://proton.me/" - usage: |+ - > [!NOTE] - > Set Proton Mail's built-in theme to 'Snow' if you're using Latte or 'Carbon' if you're using the others. + note: Set Proton Mail's built-in theme to 'Snow' if you're using Latte or 'Carbon' if you're using the others. current-maintainers: [*soya-daizu] pypi: name: PyPI + link: https://pypi.org + categories: [package_registry] + color: sapphire + current-maintainers: [*trinkey] + pythonanywhere: + name: PythonAnywhere + link: https://pythonanywhere.com categories: [development] + icon: pythonanywhere color: sapphire - readme: - app-link: "https://pypi.org" current-maintainers: [*trinkey] quizlet: name: Quizlet + link: https://quizlet.com categories: [education, productivity] icon: quizlet color: mauve - readme: - app-link: "https://quizlet.com" current-maintainers: [*spaghettiosareyummy] raindrop: name: Raindrop + link: https://app.raindrop.io categories: [productivity] color: blue - readme: - app-link: "https://app.raindrop.io" current-maintainers: [*thismoon] + react.dev: + name: React.dev + link: https://react.dev + categories: [development] + icon: react + color: sapphire + current-maintainers: [*RaiderHCPlay] reddit: name: Reddit - categories: [discussion_forum, social_networking, entertainment] + link: https://reddit.com + categories: [discussion_forum, social_networking] color: red icon: reddit - readme: - app-link: "https://reddit.com" current-maintainers: [] past-maintainers: [*jayylmao, *rubyowo] + regex101: + name: regex101 + link: https://regex101.com + categories: [development] + color: blue + current-maintainers: [*uncenter] + rentry.co: + name: Rentry.co + link: https://rentry.co + categories: [productivity] + color: text + current-maintainers: [*thismoon] + scalar: + name: Scalar + link: https://scalar.com + categories: [development] + icon: scalar + color: text + current-maintainers: [*incognitotgt] + searchix: + name: Searchix + link: https://searchix.ovh + categories: [development, search_engine] + color: blue + current-maintainers: [*koibtw] searxng: name: SearXNG + link: https://github.com/searxng/searxng categories: [search_engine] icon: searxng color: blue - readme: - app-link: "https://github.com/searxng/searxng" - current-maintainers: [*sekki21956, *ryanccn] + current-maintainers: [*Sekki21956, *ryanccn] + seventv: + name: 7TV + link: https://7tv.app + categories: [entertainment, browser_extension] + color: sapphire + current-maintainers: [*mxgic1337] shinigami-eyes: name: Shinigami Eyes + link: https://shinigami-eyes.github.io categories: [browser_extension, social_networking] color: mauve - readme: - app-link: "https://shinigami-eyes.github.io" - current-maintainers: [*jh-devv] + current-maintainers: [*sofiedotcafe] snapchat-web: name: Snapchat Web - categories: [social_networking, photo_and_video, entertainment] + link: https://web.snapchat.com + categories: [social_networking, photo_and_video] icon: snapchat color: yellow - readme: - app-link: "https://web.snapchat.com" current-maintainers: [*itzTheMeow] spotify-web: name: Spotify Web + link: https://open.spotify.com categories: [music] icon: spotify color: green - readme: - app-link: "https://open.spotify.com" - current-maintainers: [*tnixc] + current-maintainers: [*Tnixc] stack-overflow: name: Stack Overflow - categories: [development] + link: https://stackoverflow.com + categories: [discussion_forum, wiki] icon: stackoverflow color: peach - readme: - app-link: https://stackoverflow.com current-maintainers: [*uncenter] startpage: name: Startpage + link: https://startpage.com categories: [search_engine] color: lavender - readme: - app-link: "https://startpage.com" - current-maintainers: [] + current-maintainers: [*WalkQuackBack] past-maintainers: [*bartlibert] + status.cafe: + name: status.cafe + link: https://status.cafe + categories: [social_networking] + color: sapphire + current-maintainers: [*bunfluff] stylus: name: Stylus + link: https://github.com/openstyles/stylus categories: [browser_extension] color: teal - readme: - app-link: "https://github.com/openstyles/stylus" - current-maintainers: [*gitmuslim] + current-maintainers: [*uncenter] substack: name: Substack - categories: [entertainment, social_networking] + link: https://substack.com + categories: [news_and_journalism] icon: substack color: peach - readme: - app-link: "https://substack.com" - current-maintainers: [] - past-maintainers: [*winston] + current-maintainers: [*uncenter] + past-maintainers: [*nekowinston] syncthing: name: Syncthing - categories: [productivity] + link: https://syncthing.net + categories: [file_manager, productivity] icon: syncthing color: sapphire - readme: - app-link: "https://syncthing.net" - usage: |+ - > [!NOTE] - > This theme is designed to be used with the default WebGUI and default theme provided by Syncthing. This does not theme syncthing.net. + note: This theme is designed to be used with the default WebGUI and default theme provided by Syncthing. This does not theme syncthing.net. current-maintainers: [*BlankParticle] tabnews: name: TabNews - categories: [discussion_forum, entertainment, social_networking] + link: https://tabnews.com.br + categories: [discussion_forum, social_networking] color: text - readme: - app-link: "https://tabnews.com.br" current-maintainers: [*Guaxinim5573] tldraw: name: tldraw + link: https://www.tldraw.com categories: [productivity] icon: tldraw color: text - readme: - app-link: "https://www.tldraw.com" - usage: |+ - > [!NOTE] - > This theme only changes how the colors appear on the tldraw canvas. Exported graphics **will not be Catppuccin-themed**. - current-maintainers: [*genshibe, *uncenter] + note: This theme only changes how the colors appear on the tldraw canvas. Exported graphics **will not be Catppuccin-themed**. + current-maintainers: [*NekoDrone] + past-maintainers: [*GenShibe, *uncenter] trinket: name: Trinket + link: https://trinket.io categories: [development] color: blue - readme: - app-link: "https://trinket.io" current-maintainers: [*trinkey] tuta: name: Tuta - categories: [email_client, productivity] + link: https://tuta.com + categories: [email_client] icon: tutanota color: maroon - readme: - app-link: "https://tuta.com/" - usage: |+ - > [!NOTE] - > Set Tuta's built-in theme to either **light** if you're using Latte or **dark** if you're using the others. + note: Set Tuta's built-in theme to either **light** if you're using Latte or **dark** if you're using the others. current-maintainers: [*ryanccn] twitch: name: Twitch - categories: [entertainment, social_networking, photo_and_video] + link: https://twitch.tv + categories: [entertainment, social_networking] icon: twitch color: mauve - readme: - app-link: "https://twitch.tv" - current-maintainers: [*gitmuslim, *uncenter] + current-maintainers: [*uncenter, *mxgic1337] twitter: name: Twitter - categories: [social_networking, discussion_forum, entertainment] + link: https://twitter.com + categories: [social_networking, discussion_forum] color: blue icon: twitter - readme: - app-link: "https://twitter.com" - usage: |+ - > [!NOTE] - > Set Twitter's built-in theme to **Lights out** with the blue accent. Also requires the [:has()](https://developer.mozilla.org/en-US/docs/Web/CSS/:has) selector. + note: Set Twitter's built-in theme to **Lights out** with the blue accent. current-maintainers: [*watatomo] vercel: - name: ["Vercel", "Next.js"] + name: Vercel + link: https://vercel.com categories: [development] icon: vercel color: text - readme: - app-link: ["https://vercel.com", "https://nextjs.org"] - usage: |+ - > [!NOTE] - > This theme also applies to the [Next.js](https://nextjs.org/) website. + supports: + next.js: + name: Next.js + link: https://nextjs.org current-maintainers: [*ryanccn, *Dandraghas] vikunja: name: Vikunja + link: https://vikunja.io categories: [productivity, note_taking] + icon: vikunja color: blue - readme: - app-link: "https://vikunja.io" current-maintainers: [*Guaxinim5573] web.dev: name: web.dev + link: https://web.dev categories: [development] color: blue - readme: - app-link: https://web.dev/ current-maintainers: [*uncenter] whatsapp-web: name: WhatsApp Web + link: https://web.whatsapp.com categories: [social_networking] icon: whatsapp color: green - readme: - app-link: "https://web.whatsapp.com" - current-maintainers: [*francorav] + current-maintainers: [*FrancoRav, *WalkQuackBack] wikipedia: name: Wikipedia + link: https://www.wikipedia.org categories: [wiki, search_engine, productivity] icon: wikipedia color: text - readme: - app-link: "https://www.wikipedia.org" - current-maintainers: [*gitmuslim] + current-maintainers: [*uncenter] wikiwand: name: Wikiwand + link: https://www.wikiwand.com categories: [wiki, productivity] icon: wikipedia color: text - readme: - app-link: "https://www.wikiwand.com" - current-maintainers: [*tnixc] + current-maintainers: [*Tnixc] youtube: name: YouTube + link: https://youtube.com categories: [entertainment, social_networking, photo_and_video] icon: youtube color: red - readme: - app-link: "https://youtube.com" - faq: - - question: "**What does the 'Enable for black bars' option mean?**" - answer: "It's available in case you have an OLED display. If you have one, you might want to enable this." current-maintainers: [*isabelroses, *uncenter] past-maintainers: [*elkrien] + zen-browser-docs: + name: Zen Browser Docs + link: https://zen-browser.app + categories: [productivity] + color: peach + current-maintainers: [*ashish0kumar] # yaml-language-server: $schema=userstyles.schema.json diff --git a/scripts/utils.ts b/scripts/utils.ts index 19631760f3..57e03a4503 100644 --- a/scripts/utils.ts +++ b/scripts/utils.ts @@ -1,30 +1,38 @@ -import Ajv, { Schema } from "ajv"; -import { parse } from "@std/yaml"; -import { join } from "@std/path"; -import { SetRequired } from "type-fest/source/set-required.d.ts"; - -import { REPO_ROOT, userStylesSchema } from "@/deps.ts"; -import { UserstylesSchema } from "@/types/userstyles.d.ts"; -import { log } from "@/lint/logger.ts"; +import type { CategoriesSchema, UserstylesSchema } from "@/types/mod.ts"; +import type { SetRequired } from "type-fest/source/set-required.d.ts"; +import { + CATEGORIES_SCHEMA, + REPO_ROOT, + USERSTYLES_SCHEMA, +} from "@/constants.ts"; + +import * as yaml from "@std/yaml"; +import * as path from "@std/path"; + +import Ajv, { type Schema } from "ajv"; +import { log } from "@/logger.ts"; import { sprintf } from "@std/fmt/printf"; +import { Octokit } from "@octokit/rest"; /** * @param content A string of YAML content * @param schema A JSON schema * @returns A promise that resolves to the parsed YAML content, verified against the schema. Rejects if the content is invalid. */ -export const validateYaml = ( +export function validateYaml( content: string, schema: Schema, -): T => { - const ajv = new Ajv.default(); + file: string, + options?: Ajv.Options, +): T { + const ajv = new Ajv.default(options); const validate = ajv.compile(schema); - const data = parse(content); + const data = yaml.parse(content); if (!validate(data)) { - console.log( - "Found schema errors in scripts/userstyles.yml: " + - validate.errors?.map((err) => + log.error( + validate + .errors!.map((err) => sprintf( "%s %s%s", err.instancePath.slice(1).replaceAll("/", "."), @@ -33,55 +41,84 @@ export const validateYaml = ( ? ` (${JSON.stringify(err.params.allowedValues, undefined)})` : "", ) - ).join(" and "), + ) + .join(" and "), + { + file, + }, ); Deno.exit(1); } return data as T; -}; +} /** * Utility function that calls {@link validateYaml} on the userstyles.yml file. * Fails when data.userstyles is undefined. */ -export const getUserstylesData = (): Userstyles => { +export function getUserstylesData(): Userstyles { const content = Deno.readTextFileSync( - join(REPO_ROOT, "scripts/userstyles.yml"), + path.join(REPO_ROOT, "scripts/userstyles.yml"), ); try { - const data = validateYaml( + const data = validateYaml( content, - userStylesSchema, + USERSTYLES_SCHEMA, + "scripts/userstyles.yml", + { schemas: [CATEGORIES_SCHEMA] }, ); - if (data.userstyles === undefined || data.collaborators === undefined) { - console.log("userstyles.yml is missing required fields"); - Deno.exit(1); + for (const field of ["userstyles", "collaborators"] as const) { + if (data[field] === undefined) { + log.error(`Missing required field \`${field}\``, { + file: "scripts/userstyles.yml", + }); + Deno.exit(1); + } } return data as Userstyles; } catch (err) { - if (err.name === "YAMLError") { + if (err instanceof Error && err.name === "SyntaxError") { const groups = /(?.*) at line (?\d+), column (?\d+):[\S\s]*/ - .exec(err.message)?.groups; - log.error( - groups!.message, - { - file: "scripts/userstyles.yml", - startLine: Number(groups!.line), - content: content, - }, - ); + .exec( + err.message, + )?.groups; + log.error(groups!.message, { + file: "scripts/userstyles.yml", + startLine: Number(groups!.line), + content: content, + }); } else { - console.log(err); + throw err; } Deno.exit(1); } -}; +} + +/** + * Utility function that calls {@link validateYaml} on the ports.yml file. + * Fails when data.userstyles is undefined. + */ +export async function getCategoriesData(): Promise< + CategoriesSchema.CategoryDefinitions +> { + const content = await fetch( + "https://raw.githubusercontent.com/catppuccin/catppuccin/d4f82739e687cfd19d168be355367fdbbcc8e029/resources/categories.yml", + ).then((res) => res.text()); + + const data = validateYaml( + content, + CATEGORIES_SCHEMA, + "categories.yml", + ); + + return data; +} /** * Utility function that formats a list of items into the "x, y, ..., and z" format. @@ -92,7 +129,9 @@ export const getUserstylesData = (): Userstyles => { * @example * formatListOfItems(['x', 'y', 'z']); // 'x, y, and z' */ -export const formatListOfItems = (items: unknown[]): string => { +export function formatListOfItems(items: unknown[]): string { + // If there are no items, return an empty string. + if (items.length === 0) return ""; // If there are two items, connect them with an "and". if (items.length === 2) return items.join(" and "); // Otherwise, there is either just one item or more than two items. @@ -104,6 +143,62 @@ export const formatListOfItems = (items: unknown[]): string => { // Otherwise, it is some item in the middle of the list and we can just add it as a comma followed by the item to the string. return prev + `, ${curr}`; }) as string; -}; +} + +type Userstyles = SetRequired< + UserstylesSchema.UserstylesSchema, + "userstyles" | "collaborators" +>; + +export function getUserstylesFiles(): string[] { + const files: string[] = []; + for (const dir of Deno.readDirSync(path.join(REPO_ROOT, "styles"))) { + if (!dir.isDirectory) continue; + files.push( + path.join(REPO_ROOT, "styles", dir.name, "catppuccin.user.less"), + ); + } + return files; +} + +export function getAuthenticatedOctokit() { + return new Octokit({ auth: Deno.env.get("GITHUB_TOKEN") }); +} + +export type UserstylesTeam = "userstyles-staff" | "userstyles-maintainers"; + +export async function getUserstylesTeamMembers( + octokit: Octokit, + team: UserstylesTeam, +): Promise { + const members = await octokit.teams.listMembersInOrg({ + org: "catppuccin", + team_slug: team, + per_page: 100, + }); + return members.data.map(({ login }) => login.toLowerCase()); +} + +export async function addUserstylesTeamMember( + octokit: Octokit, + team: UserstylesTeam, + username: string, +) { + await octokit.teams.addOrUpdateMembershipForUserInOrg({ + org: "catppuccin", + team_slug: team, + username, + }); +} -type Userstyles = SetRequired; +export async function removeUserstylesTeamMember( + octokit: Octokit, + team: UserstylesTeam, + username: string, +) { + await octokit.teams.removeMembershipForUserInOrg({ + org: "catppuccin", + team_slug: team, + username, + }); +} diff --git a/shell.nix b/shell.nix index b305b1d7f0..9268f18e3c 100644 --- a/shell.nix +++ b/shell.nix @@ -1,12 +1,9 @@ { deno, mkShellNoCC, - nodePackages, - ... }: mkShellNoCC { packages = [ deno - nodePackages.prettier ]; } diff --git a/styles/advent-of-code/README.md b/styles/advent-of-code/README.md index 22393a7a44..059288ff55 100644 --- a/styles/advent-of-code/README.md +++ b/styles/advent-of-code/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/advent-of-code/catppuccin.user.css b/styles/advent-of-code/catppuccin.user.less similarity index 52% rename from styles/advent-of-code/catppuccin.user.css rename to styles/advent-of-code/catppuccin.user.less index 64dfac0dfb..13cbf0f042 100644 --- a/styles/advent-of-code/catppuccin.user.css +++ b/styles/advent-of-code/catppuccin.user.less @@ -2,8 +2,8 @@ @name Advent Of Code Catppuccin @namespace github.com/catppuccin/userstyles/styles/advent-of-code @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/advent-of-code -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/advent-of-code/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/advent-of-code/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aadvent-of-code @description Soothing pastel theme for Advent Of Code @author Catppuccin @@ -15,55 +15,21 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain("adventofcode.com") { - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); +@-moz-document domain("adventofcode.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); body { background: @base; @@ -72,9 +38,7 @@ header h1 a, header h1 span { color: @green; - text-shadow: - 0 0 2px @green, - 0 0 5px @green; + text-shadow: 0 0 2px @green, 0 0 5px @green; } a { @@ -171,13 +135,13 @@ color: @subtext1; } .calendar-color-g3 { - color: darken(@green, 3); + color: darken(@green, 3%); } .calendar-color-g2 { color: @green; } .calendar-color-g4 { - color: darken(@green, 3.5); + color: darken(@green, 3.5%); } .calendar-color-u { color: @sky; @@ -186,10 +150,10 @@ color: @subtext0; } .calendar-color-g1 { - color: darken(@green, 2.5); + color: darken(@green, 2.5%); } .calendar-color-g0 { - color: darken(@green, 2); + color: darken(@green, 2%); } .calendar-color-l { color: @red; @@ -243,13 +207,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/advent-of-code/preview.webp b/styles/advent-of-code/preview.webp deleted file mode 100644 index 4e390057c3..0000000000 --- a/styles/advent-of-code/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:f9af8debf23f3d70d13731fd613b1e4818fb599536d07534ab8eb5ebcf29594a -size 372696 diff --git a/styles/alacritty.org/README.md b/styles/alacritty.org/README.md new file mode 100644 index 0000000000..8dec010cab --- /dev/null +++ b/styles/alacritty.org/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for alacritty.org + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [AlwaysNur](https://github.com/AlwaysNur) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/alacritty.org/catppuccin.user.less b/styles/alacritty.org/catppuccin.user.less new file mode 100644 index 0000000000..bac12dffe1 --- /dev/null +++ b/styles/alacritty.org/catppuccin.user.less @@ -0,0 +1,82 @@ +/* ==UserStyle== +@name alacritty.org Catppuccin +@namespace github.com/catppuccin/userstyles/styles/alacritty.org +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/alacritty.org +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/alacritty.org/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aalacritty.org +@description Soothing pastel theme for alacritty.org +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("alacritty.org") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + color: @text !important; + background-color: @base !important; + } + a { + color: @accent !important; + } + header { + background-color: @mantle !important; + border-bottom-color: @surface0 !important; + nav > a { + color: @text !important; + } + } + em { + color: @green !important; + } + strong, strong > a { + color: @blue !important; + } + #pick-version select { + color: @text !important; + background-color: @surface0; + border-color: @overlay0; + } + h1 { + color: @accent !important; + } + a:not([name]) { + text-shadow: none !important; + } + code { + background-color: @surface0; + } + video { + background-color: @overlay0 !important; + } + img:not(img#logo-img) { + border-color: @overlay0 !important; + } + img#logo-img { + border-color: @mantle !important; + } + kbd { + background-color: @surface1 !important; + border-color: @overlay0 !important; + } + } +} diff --git a/styles/alternativeto/README.md b/styles/alternativeto/README.md new file mode 100644 index 0000000000..ddb173922f --- /dev/null +++ b/styles/alternativeto/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for AlternativeTo + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [thismoon](https://github.com/thismoon) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/alternativeto/catppuccin.user.less b/styles/alternativeto/catppuccin.user.less new file mode 100644 index 0000000000..a17a46bb01 --- /dev/null +++ b/styles/alternativeto/catppuccin.user.less @@ -0,0 +1,431 @@ +/* ==UserStyle== +@name AlternativeTo Catppuccin +@namespace github.com/catppuccin/userstyles/styles/alternativeto +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/alternativeto +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/alternativeto/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aalternativeto +@description Soothing pastel theme for AlternativeTo +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("alternativeto.net") { + :root[data-theme="dark"] { + #catppuccin(@darkFlavor); + } + :root[data-theme="light"] { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --mainBrand: @accent; + --topBrand: @accent; + --footer: @mantle; + --mainBg: @base; + --mainFg: @text; + --popBrand: @accent; + --introBoxText: @text; + --introBoxLink: @text; + --introBoxMeta: @subtext0; + --meta: @subtext0; + --metaLight: @subtext1; + --linkColorHeader: @text; + --linkColor: @text; + --brandLight3: @surface2; + --brandLight4: @surface2; + --brandLight5: @surface1; + --brandLight6: @mantle; + --brandLight7: @surface0; + --brandLight8: @text; + --brandLight10: @surface0; + --brandLight11: @mantle; + --gray50: @surface0; + --gray100: @surface0; + --gray150: @surface0; + --gray200: @surface1; + --gray250: @surface1; + --gray300: @surface1; + --gray500: @overlay0; + --headingButton: @accent; + --positiveGreener: @green; + --positiveGreenerLight: fade(@green, 10%); + --positiveGreenerDark: @green; + --danger: @red; + --negativeLight: fade(@peach, 10%); + --lightDanger: fade(@red, 25%); + --dangerDark: @red; + --ctaMain: @mauve; + --ctaLight: @base; + --ctaLightest: @mantle; + --tab: @mantle; + --toastify-color-dark: @mantle; + --toastify-color-light: @text; + --toastify-color-info: @blue; + --toastify-color-success: @green; + --toastify-color-warning: @yellow; + --toastify-color-error: @red; + + // heart icon + [class^="ModernLikeButton_likeWrapper"] { + [class^="ModernLikeButton_heart"]:hover, + [class^="ModernLikeButton_liked"] { + svg { + color: @red; + } + } + } + // primary button + [class*="Button_primary"] { + color: @crust !important; + } + // footer + [class^="Footer_footer"] { + &, + p a, + [class^="Footer_footerMenu"] li a { + color: @text; + } + } + [class^="Footer_footerLogo"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + // rating stars + [class^="StarRating_star"] { + color: @text; + &[class*="StarRating_active"] { + color: @peach; + } + } + // danger "discontinued" label + [class*="AppAlertWrapper_warning"] span { + color: @peach; + } + // feature point in alternative's features + [class*="HighlightFeatureListItem_featurePoint"]:not( + [class*="HighlightFeatureListItem_gray"] + ) { + background-color: @green; + color: @green; + border-color: lighten(@green, 25%); + } + // app banner (ad) + [class*="AppBanner_iconWrapper"], + [class*="AppBanner_banner"], + [class*="AppBanner_bottom"] { + border-color: @overlay0; + } + // navigation/top bar + [class^="HeaderLinks_globalSiteNav"] a, + [class^="HeaderLinks_globalSiteNav"] span, + [class^="HeaderLinks_authAndMenu"] a, + [class*="Button_headerTextButton"] svg, + [class*="Button_headerTextButton"]:hover svg, + [class^="HeaderLinks_header"] button:focus { + color: @base !important; + } + [class^="HeaderLinks_logoSmall"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + [class*="HeaderLinks_logoLarge"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + // hanburger menu + [class^="DropdownListLink_additionalInfo"] { + color: @subtext0; + } + // svg color variables + @light-peach: lighten(@peach, 25%); + @dark-peach: darken(@peach, 25%); + @dark-blue: desaturate(darken(@blue, 60%), 40%); + @darker-blue: desaturate(darken(@blue, 65%), 40%); + // main page header + img[class*="PageIntroImage_a2-header-"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + // flipped/mirrored/right variation of the a2 robot svg (found in /about and /about/privacy) + &[src^="/static/a2-header-right"] { + transform: scale(-1, 1); + } + } + @media screen and (min-width: 1200px) { + [class*="PageIntroWrapper_wrapper"] { + @svg: escape( + '' + ); + @svg2: escape( + '' + ); + background-image: + url("data:image/svg+xml,@{svg}"), + url("data:image/svg+xml,@{svg2}"); + } + } + // news page header + [src^="/static/a2-screen"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + // new app releases page header + [src^="/static/a2-drop"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + // bottom right loading spinner icon + #nprogress .spinner-icon { + border-top-color: @accent; + border-left-color: @accent; + } + // top progress bar when loading a new page + #nprogress .peg { + box-shadow: 0 0 10px @accent, 0 0 5px @accent; + } + // toast + .Toastify__close-button { + color: @text; + } + [data-testid="toast"] > div > span { + color: @text !important; + } + // remove filter badge + li[class^="AppFilterBarCommon_current"]:hover { + a::after, + > span::after { + color: darken(@red, 25%); + } + } + // news fire icon + @newstype: { + hottest: @peach; + hot_: @yellow; + luke: @text; + }; + each( + @newstype, + { + [class^="NewsForListMeta_@{key}"] { + color: @value; + } + } + ); + // current page nummber + [class*="Pagination_current"] { + color: @subtext0; + } + // full screen screenshot button + [class^="ImageCollection-modern_expandImage"] { + background: fade(@text, 80%) !important; + svg { + color: @crust !important; + } + & when (@flavor = latte) { + background: fade(@crust, 80%) !important; + svg { + color: @text !important; + } + } + } + // social icons + // rrs + svg[color="#f26522"] { + color: @peach !important; + } + // "Share on" icons + @socialapps: { + facebook: @blue; + reddit: @peach; + }; + [class^="ShareButtons_shareButtons"] { + each( + @socialapps, + { + [title="Share on @{key}"] > svg { + color: @value !important; + } + } + ); + } + // AppStores & Other Links + [class*="Button_black"], + [class^="AppExternalLinks_appstoreWrapper"] { + background: @crust; + color: @text; + &:hover { + background: @base; + } + [src$="ms-store.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + [src$="android-store.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + [src$="ios-store.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } + // social networks + @socialnetworks: { + Facebook: @blue; + X: @text; + }; + [class^="AppExternalLinks_socialLinksWrapper"] { + each( + @socialnetworks, + { + [title^="@{key} page"] > svg { + color: @value !important; + } + } + ); + } + // yello star (e.g. the level in a user profile) + svg[color="#e39d06"] { + color: @yellow !important; + } + // list like button hover + [class*="LikeButton_likeButton"]:hover [class*="LikeButton_heart"] { + color: @red; + } + // register popup header + .data-collector .header { + color: @overlay2; + } + // danger button (clear all filters) + [class*="Button_danger"] { + background: @red; + border-color: @red; + color: @crust; + } + // warning button + [class*="Button_warning"] { + background-color: @yellow; + border-color: @yellow; + color: @crust; + } + // success button + [class*="Button_success"] { + background-color: @green; + border-color: @green; + color: @crust; + } + // disabled buttons + [class*="Button_button"][disabled] { + background-color: @surface2 !important; + border-color: @surface2 !important; + color: @overlay2 !important; + } + } +} + +@-moz-document domain("auth.alternativeto.net") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --widget-background-color: @base; + --input-background-color: @base; + --input-border-color: @surface1; + --input-text-color: @text; + --base-focus-color: @accent; + --link-color: @accent; + --primary-color: @accent; + --button-font-color: @crust; + --title-font-color: @text; + --font-default-color: @text; + --font-light-color: @subtext0; + --border-default-color: @surface1; + --social-button-border-color: @surface1; + --secondary-button-text-color: @text; + --transparency-focus-color: fade(@accent, 15%); + --icon-default-color: @overlay1; + --gray-lightest: @text; + --error-color: @red; + @error-svg: escape( + '' + ); + --icon-error: url("data:image/svg+xml,@{error-svg}"); + + body { + background: @crust; + } + .footer { + a { + color: @text; + } + background: @mantle; + color: @subtext0; + } + #prompt-logo-center { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + .password-icon-tooltip { + background: @crust; + + &::before { + border-color: @crust transparent transparent; + } + } + // "Continue with" login button icons + @loginicon: { + google: ""; + windowslive: ""; + github: ""; + apple: ""; + }; + each( + @loginicon, + { + span[data-provider="@{key}"] { + @svg: escape(@value); + background-image: url("data:image/svg+xml,@{svg}"); + } + } + ); + } +} diff --git a/styles/amplenote/README.md b/styles/amplenote/README.md index 7c961c5421..c17c0ff0ff 100644 --- a/styles/amplenote/README.md +++ b/styles/amplenote/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/amplenote/catppuccin.user.css b/styles/amplenote/catppuccin.user.less similarity index 52% rename from styles/amplenote/catppuccin.user.css rename to styles/amplenote/catppuccin.user.less index d2dc2101d2..92a0ae6574 100644 --- a/styles/amplenote/catppuccin.user.css +++ b/styles/amplenote/catppuccin.user.less @@ -2,8 +2,8 @@ @name Amplenote Catppuccin @namespace github.com/catppuccin/userstyles/styles/amplenote @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/amplenote -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/amplenote/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/amplenote/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aamplenote @description Soothing pastel theme for Amplenote @author Catppuccin @@ -15,60 +15,24 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + @-moz-document domain("amplenote.com") { body:not(.theme-light) { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } body.theme-light { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); &.themeable { --color-background-primary: @base; - --color-background-primary-rgb: #rgbify(@base) []; + --color-background-primary-rgb: #lib.rgbify(@base)[]; --color-background-secondary: @mantle; --color-background-tertiary: @mantle; @@ -86,8 +50,8 @@ --color-background-reversed-secondary: @surface2; --color-background-element-high-contrast: fade(@overlay2, 40%); - --color-background-element-medium-contrast: fade(@accent-color, 40%); - --color-background-element-medium-contrast-rgb: fade(@accent-color. 40%); + --color-background-element-medium-contrast: fade(@accent, 40%); + --color-background-element-medium-contrast-rgb: fade(@accent. 40%); --color-background-element-low-contrast: @crust; --color-background-note-menu-button: @surface0; @@ -95,11 +59,11 @@ --color-background-banner-alt: @base; --color-background-nav-divider: @surface0; - --color-background-action-low-contrast: fade(@accent-color, 50%); - --color-background-action-medium-contrast: fade(@accent-color, 60%); - --color-background-action-high-contrast: @accent-color; - --color-background-action-high-contrast-rgb: #rgbify(@accent-color) []; - --color-background-action-high-contrast-alt: fade(@accent-color, 75%); + --color-background-action-low-contrast: fade(@accent, 50%); + --color-background-action-medium-contrast: fade(@accent, 60%); + --color-background-action-high-contrast: @accent; + --color-background-action-high-contrast-rgb: #lib.rgbify(@accent)[]; + --color-background-action-high-contrast-alt: fade(@accent, 75%); --color-background-error-high-contrast: @red; --color-background-error-medium-contrast: fade(@red, 50%); @@ -120,18 +84,18 @@ --color-text-nav-lower-contrast: @surface2; --color-text-error-low-contrast: @peach; - --color-text-error-low-contrast-rgb: #rgbify(@peach) []; + --color-text-error-low-contrast-rgb: #lib.rgbify(@peach)[]; --color-text-error-medium-contrast: @red; --color-text-error-high-contrast: @red; --color-text-status: @green; - --color-text-link: @accent-color; + --color-text-link: @accent; --color-text-button: @crust; --color-background-task-value: @surface1; --color-background-sidebar-task: @surface0; - --color-overlay-low-contrast: @accent-color; + --color-overlay-low-contrast: @accent; --mdc-theme-surface: @base; } @@ -200,15 +164,15 @@ .calendar-pane .fc { .fc-timegrid-now-indicator-arrow { .line { - border-bottom-color: @accent-color; + border-bottom-color: @accent; } .material-icons { - color: @accent-color; + color: @accent; } } .fc-timegrid-now-indicator-line { - border-color: darken(@accent-color, 10%); + border-color: darken(@accent, 10%); } .fc-timegrid .fc-daygrid-day-events, @@ -233,17 +197,3 @@ } } } - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/amplenote/preview.webp b/styles/amplenote/preview.webp deleted file mode 100644 index 2ae774e753..0000000000 --- a/styles/amplenote/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6cdf3745eeff95235899fed04e45a03a7ce08c7c913a6f562273285bdb23a878 -size 66048 diff --git a/styles/anilist/README.md b/styles/anilist/README.md index 4ac1cded91..a3dc449491 100644 --- a/styles/anilist/README.md +++ b/styles/anilist/README.md @@ -10,17 +10,15 @@

- -

- -

- +

## Usage -> [!NOTE] -> This theme applies to [AniChart](https://anichart.net/) as well, which is an extension of AniList. +> [!IMPORTANT] +> This userstyle also applies to [AniChart](https://anichart.net). + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/anilist/catppuccin.user.css b/styles/anilist/catppuccin.user.css deleted file mode 100644 index ed93115c3c..0000000000 --- a/styles/anilist/catppuccin.user.css +++ /dev/null @@ -1,760 +0,0 @@ -/* ==UserStyle== -@name AniList/AniChart Catppuccin -@namespace github.com/catppuccin/userstyles/styles/anilist -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/anilist -@version 2.2.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/anilist/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aanilist -@description Soothing pastel theme for AniList and AniChart -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] - -@var select contrastColor "Contrast Color" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red*", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("anilist.co"), domain("anichart.net") { - body:not(.site-theme-dark) { - #catppuccin(@lightFlavor, @accentColor); - } - .site-theme-dark { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @contrast-color: @catppuccin[@@lookup][@@contrastColor]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - & when (@lookup =latte) { - --color-blue-dim: #rgbify(desaturate(lighten(@accent-color, 10%), 10%)) []; - - .nav[data-v-62eacfff], - .solid[data-v-62eacfff], - .transparent[data-v-62eacfff]:hover { - background: darken(@text, 10%); - color: @base; - } - - .nav-unscoped.transparent { - background: fade(darken(@text, 10%), 50%); - } - - .banner-content .name { - --color-text-bright: #rgbify(#fff) []; - } - } - - --color-background: #rgbify(@crust) []; - --color-foreground: #rgbify(@base) []; - --color-foreground-grey: #rgbify(@surface0) []; - --color-foreground-grey-dark: #rgbify(darken(@surface0, 5%)) []; - --color-foreground-blue: #rgbify(@mantle) []; - --color-foreground-blue-dark: #rgbify(@mantle) []; - --color-background-blue-dark: #rgbify(@subtext1) []; - --color-overlay: #rgbify(@surface0) []; - --color-shadow: #rgbify(@mantle) []; - --color-shadow-dark: #rgbify(darken(@text, 10%)) []; - --color-shadow-blue: #rgbify(@blue) []; - --color-text: #rgbify(@text) []; - --color-text-light: #rgbify(@subtext1) []; - --color-text-lighter: #rgbify(@subtext0) []; - --color-text-bright: #rgbify(@text) []; - --color-blue: #rgbify(@accent-color) []; - --color-white: 255, 255, 255; - --color-black: 0, 0, 0; - --color-red: #rgbify(@contrast-color) []; - --color-peach: #rgbify(@maroon) []; - --color-orange: #rgbify(@peach) []; - --color-yellow: #rgbify(@yellow) []; - --color-green: #rgbify(@green) []; - --color-background-1200: #rgbify(@text) []; - --color-background-1100: #rgbify(@text) []; - --color-background-1000: #rgbify(@text) []; - --color-background-900: #rgbify(@subtext1) []; - --color-background-800: #rgbify(@subtext0) []; - --color-background-700: #rgbify(@surface1) []; - --color-background-600: #rgbify(@surface0) []; - --color-background-500: #rgbify(@surface0) []; - --color-background-400: #rgbify(@surface0) []; - --color-background-300: #rgbify(@base) []; - --color-background-200: #rgbify(@mantle) []; - --color-background-100: #rgbify(@crust) []; - --color-gray-1200: #rgbify(@text) []; - --color-gray-1100: #rgbify(@text) []; - --color-gray-1000: #rgbify(@text) []; - --color-gray-900: #rgbify(@text) []; - --color-gray-800: #rgbify(@overlay2) []; - --color-gray-700: #rgbify(@overlay1) []; - --color-gray-600: #rgbify(@overlay0) []; - --color-gray-500: #rgbify(@surface2) []; - --color-gray-400: #rgbify(@surface1) []; - --color-gray-300: #rgbify(@surface0) []; - --color-gray-200: #rgbify(@mantle) []; - --color-gray-100: #rgbify(@crust) []; - --color-blue-100: #rgbify(@text) []; - --color-blue-200: #rgbify(@text) []; - --color-blue-300: #rgbify(@text) []; - --color-blue-400: #rgbify(@sapphire) []; - --color-blue-500: #rgbify(@sapphire) []; - --color-blue-600: #rgbify(@blue) []; - --color-blue-700: #rgbify(@blue) []; - --color-blue-800: #rgbify(@blue) []; - --color-blue-900: #rgbify(@blue) []; - --color-blue-1000: #rgbify(@blue) []; - --color-green-100: #rgbify(@teal) []; - --color-green-200: #rgbify(@green) []; - --color-green-300: #rgbify(@green) []; - --color-green-400: #rgbify(@green) []; - --color-green-500: #rgbify(@green) []; - --color-green-600: #rgbify(@green) []; - --color-green-700: #rgbify(@green) []; - --color-green-800: #rgbify(@green) []; - --color-red-100: #rgbify(@text) []; - --color-red-200: #rgbify(@flamingo) []; - --color-red-300: #rgbify(@maroon) []; - --color-red-400: #rgbify(@red) []; - --color-red-500: #rgbify(@red) []; - --color-red-600: #rgbify(@red) []; - --color-red-700: #rgbify(@red) []; - - & when not (@lookup =latte) { - --color-background: #rgbify(@crust) []; - --color-foreground: #rgbify(@base) []; - --color-foreground-grey: #rgbify(@surface0) []; - --color-foreground-grey-dark: #rgbify(darken(@surface0, 5%)) []; - --color-foreground-blue: #rgbify(@mantle) []; - --color-foreground-blue-dark: #rgbify(@mantle) []; - --color-text: #rgbify(@text) []; - --color-text-light: #rgbify(@subtext0) []; - --color-text-lighter: #rgbify(@subtext1) []; - --color-shadow-dark: #rgbify(@crust) []; - --color-shadow-blue: #rgbify(@crust) []; - --color-background-1200: #rgbify(@text) []; - --color-background-1100: #rgbify(@text) []; - --color-background-1000: #rgbify(@text) []; - --color-background-900: #rgbify(@subtext1) []; - --color-background-800: #rgbify(@subtext0) []; - --color-background-700: #rgbify(@surface1) []; - --color-background-600: #rgbify(@surface0) []; - --color-background-500: #rgbify(@surface0) []; - --color-background-400: #rgbify(@surface0) []; - --color-background-300: #rgbify(@base) []; - --color-background-200: #rgbify(@mantle) []; - --color-background-100: #rgbify(@crust) []; - --color-gray-1200: #rgbify(@text) []; - --color-gray-1100: #rgbify(@text) []; - --color-gray-1000: #rgbify(@text) []; - --color-gray-900: #rgbify(@text) []; - --color-gray-800: #rgbify(@overlay2) []; - --color-gray-700: #rgbify(@overlay1) []; - --color-gray-600: #rgbify(@overlay0) []; - --color-gray-500: #rgbify(@surface2) []; - --color-gray-400: #rgbify(@surface1) []; - --color-gray-300: #rgbify(@surface0) []; - --color-gray-200: #rgbify(@mantle) []; - --color-gray-100: #rgbify(@crust) []; - - --color-blue-dim: #rgbify(desaturate(darken(@accent-color, 10%), 10%)) []; - } - - /* DARK THEME NAV BAR */ - .nav-unscoped when not (@lookup =latte) { - background-color: @mantle; - } - .nav-unscoped.transparent when not (@lookup =latte) { - background-color: fade(@mantle, 50); - } - .nav-unscoped.transparent:hover when not (@lookup =latte) { - background-color: @mantle; - color: @subtext0; - } - - /* -----------------PROFILE FIXES----------------- */ - #profileColor(@color) { - --color-blue: #rgbify(@color) []; - & when (@lookup =latte) { - --color-blue-dim: #rgbify(lighten(@color, 10%)) []; - } - & when not (@lookup =latte) { - --color-blue-dim: #rgbify(darken(@color, 10%)) []; - } - .progress .bar { - background: linear-gradient(270deg, darken(@color, 10%), @color); - } - } - .user-page-unscoped.orange { - #profileColor(@peach); - } - .user-page-unscoped.green { - #profileColor(@green); - } - .user-page-unscoped.purple { - #profileColor(@mauve); - } - .user-page-unscoped.red { - #profileColor(@red); - } - .user-page-unscoped.blue { - #profileColor(@blue); - } - .user-page-unscoped.pink { - #profileColor(@pink); - } - .user-page-unscoped.gray { - #profileColor(@overlay1); - } - .history-day { - --color-foreground-grey-dark: #rgbify(@crust) []; - } - .x-axis { - --color-background-300: #rgbify(@surface0) []; - } - /* Fixes gap between stats */ - @media (max-width: 1540px) { - .stats-wrap { - grid-row-gap: 25px; - } - } - - /* ----Tracking Status List Stuff---- */ - .list[data-v-5776f768] { - color: @mantle !important; - } - .media-card .list-status[status="Repeating"] { - background: @pink; - } - .banner .el-icon-arrow-down::before { - color: @text !important; - } - .el-textarea__inner::placeholder { - color: @overlay1; - } - .el-dropdown-menu, - .el-dropdown-menu__item--divided::before, - .el-select-dropdown { - background-color: @surface0 !important; - } - .el-popper[x-placement^="bottom"] .popper__arrow::after, - .el-popper[x-placement^="bottom"] .popper__arrow, - .el-tooltip__popper[x-placement^="bottom"] .popper__arrow::after, - .el-tooltip__popper[x-placement^="bottom"] .popper__arrow { - border-bottom-color: @surface0; - } - .el-popper[x-placement^="top"] .popper__arrow::after, - .el-popper[x-placement^="top"] .popper__arrow, - .el-tooltip__popper[x-placement^="top"] .popper__arrow, - .el-tooltip__popper[x-placement^="top"] .popper__arrow::after { - border-top-color: @surface0; - } - .el-dropdown .feed-filter { - color: @overlay0; - } - .el-dropdown-menu { - border-color: @text !important; - } - .el-dropdown-menu__item--divided when not (@lookup =latte) { - border-top-color: @surface1; - } - .el-select-dropdown__item.hover, - .el-select-dropdown__item:hover { - background-color: @base; - } - .el-select-dropdown__item.selected { - color: @accent-color; - } - .el-tooltip__popper.is-dark { - background: @surface0; - color: @text; - } - .tooltip > div { - --color-white: #rgbify(@text) []; - } - .dropdown { - --color-gray-100: #rgbify(@base) []; - --color-background-100: #rgbify(@base) []; - --color-background-200: #rgbify(@mantle) []; - } - .medialist .notes { - --color-overlay: #rgbify(@surface0) []; - } - .el-input__inner::placeholder, - .el-input__prefix { - color: @overlay1; - } - .el-picker-panel { - color: @text; - background-color: @surface0; - border-color: @surface1; - } - .el-date-table th { - color: @overlay1; - border-bottom-color: @surface1; - } - .el-date-picker__header-label { - color: @subtext0; - - &:hover { - color: @accent-color; - } - } - .el-picker-panel__icon-btn { - color: @overlay1; - - &:hover { - color: @accent-color; - } - } - .el-date-table td.available:hover { - color: @accent-color; - } - .el-date-table td.current:not(.disabled) span { - color: @crust; - background-color: @accent-color; - } - .el-date-table td.next-month, - .el-date-table td.prev-month { - color: @surface2; - } - - /* ---------SCORE TWEAKS-------------- */ - .score[data-v-5ca094da] { - color: @base; - } - - /* --------------FOOTER--------------- */ - .footer[data-v-0f519cab] { - background: @text; - color: @crust; - - h2 { - color: rgb(var(--color-blue)); - } - - & when (@lookup =latte) { - --color-blue: #rgbify(lighten(@accent-color, 30%)) []; - } - - & when not (@lookup =latte) { - background: @mantle; - color: @subtext0; - } - } - - /* ------------------SEARCH PAGES------------------ */ - .search, - .expand-description, - .studio { - --color-background-200: #rgbify(@crust) []; - } - .search-wrap, - .filters, - .extra-filters-wrap, - .select, - .options { - --color-background-100: #rgbify(@base) []; - } - .filter.select-wrap .options { - --color-background-100: #rgbify(@mantle) []; - } - - /* ------------------MISC EDITS-------------------- */ - .list-editor-wrap .header::after { - background: fade(@mantle, 50%); - } - .filter.clear-all { - --color-background-500: #rgbify(@overlay1) []; - } - /* --Reset button in notifications----- */ - .reset-btn { - color: @base !important; - } - /* Publish Button in Replies and Messages */ - .save { - color: @base !important; - } - .el-radio { - color: @overlay1; - } - /* Mod Stuff */ - .el-color-dropdown__link-btn { - color: @accent-color; - } - .el-color-picker__color { - border-color: @surface1; - } - .el-color-picker__panel { - background-color: @surface0; - border-color: @surface1; - } - .el-color-dropdown__btn { - border-color: @surface2; - color: @subtext1; - - &:hover { - background-color: transparent; - border-color: @accent-color; - color: @accent-color; - } - } - /* Accent Text */ - .input .hint { - --color-white: #rgbify(@text) []; - } - .el-checkbox__input.is-checked + .el-checkbox__label { - color: @accent-color; - } - .button, - .option.active, - .new-badge, - .submissions .user .stats > div, - .actions .icon, - .submissions .status, - .adult-label, - .header .btn, - .media-tag-editor .btn, - [data-v-843c77a2] .btn, - [data-v-22855988] .btn, - .btn[data-v-156b3973], - .btn[data-v-dceb4a66], - .favourite-btn, - .dialog .btn, - .tag, - .filter, - .media .header div, - .list-editor-wrap .header .save-btn, - .actions > div:not(.donator-badge), - .banner-content .mod-badge-wrap, - .external-link.no-color, - .count.circle, - .el-dropdown-menu__item, - .delete, - .list-editor-wrap .list-editor .body .delete-btn, - .open-user-search, - .save-btn { - & when not (@lookup =latte) { - --color-white: #rgbify(@crust) []; - } - } - .button.comment, - .settings .button, - .el-message-box .el-button--primary, - .mod-badge-wrap, - .medialist.cards .entry-card .edit { - & when not (@lookup =latte) { - --color-text-bright: #rgbify(@crust) []; - } - } - .submit-btn, - .random-btn { - & when not (@lookup =latte) { - color: @crust; - } - } - .user .notification-dot, - .create-btn { - & when not (@lookup =latte) { - color: @crust !important; - } - } - .el-radio__inner::after { - & when not (@lookup =latte) { - background-color: @crust; - } - } - .icon, - .check { - & when not (@lookup =latte) { - --color-blue-300: #rgbify(@crust) []; - } - } - .settings .button { - & when (@lookup =latte) { - --color-text-bright: #rgbify(#fff) []; - } - } - /* ------------IMAGE COVER------------ */ - .cover .image-text, - .plus-progress { - color: @text !important; - } - - .entry .plus-progress, - .medialist.table .entry .edit { - color: @base !important; - } - /* --------SETTINGS-------- */ - .el-radio__inner when not (@lookup =latte) { - background-color: @text; - } - .el-checkbox__input.is-checked .el-checkbox__inner, - .el-radio__input.is-checked .el-radio__inner { - background-color: @accent-color; - border-color: @accent-color; - } - .el-checkbox__inner::after { - border-color: @crust; - border-width: 2px; - left: 3px; - } - .el-radio__input.is-checked + .el-radio__label { - color: @accent-color; - } - /* --------HIDE SCROLLBAR IN BIO----- */ - .section::-webkit-scrollbar { - display: none; - } - .section { - -ms-overflow-style: none; - scrollbar-width: none; - } - /* --------REMOVE DROPDOWN SHADOWS----- */ - .dropdown.dropdown { - box-shadow: none; - } - /* ---------ANILIST LIKER PLUGIN------ */ - #AnilistLikerPlugin .btntop { - margin-bottom: -4px; - margin-top: 5px; - } - #AnilistLikerPlugin .btnbottom { - margin-top: -2px; - } - /* ---------AUTOMAIL TWEAKS--------- */ - .hohMediaScore { - border-color: @surface0; - padding: 4px; - border-radius: 10px; - margin-left: 0; - background-color: @base; - color: @accent-color; - } - .activity-feed .hohNoteSuffix:not(:empty), - .activity-feed .hohRewatchSuffix:not(:empty), - .activity-feed .hohScore:not(.hohSmiley), - .hohFeedScore .hohScore { - border-radius: 5px; - padding: 2.5px 5px 1px !important; - color: @subtext1 !important; - background-color: @surface0; - - &:not(:first-of-type) { - margin: 3px; - } - } - .activity-feed .hohRewatchSuffix:not(:empty) { - padding-left: 2px !important; - } - .hohExtraFilters button { - margin-bottom: 20px; - } - .filter-group.compare-btn, - .hohButton { - color: @base; - } - .hohButton, - .hohCheckbox input:checked + .el-checkbox__inner { - background-color: @accent-color; - } - .hohCheckbox input:checked + .el-checkbox__inner { - border-color: @accent-color; - } - .medialist.table .entry:hover, - .medialist.table .entry .title a:hover, - .compare-btn[data-v-170179fc]:hover { - color: @base; - } - .hohCompare table { - background-color: @crust; - } - .hohAnimeTable, - .hohAnimeTable td, - .hohUserRow td, - .hohUserRow th, - .hohHeaderRow td, - .hohHeaderRow th { - border-color: @surface0 !important; - } - .hohUserRow td { - border-top-color: @surface0 !important; - } - .hohUserRow tr { - border-right-color: @surface0 !important; - } - hr { - color: @surface0; - } - .hohCheckbox - input:checked - + .el-checkbox__inner - .like-wrap.thread - .button.liked - .fa-heart, - .actions .favourite.liked .fa-heart, - .like-wrap.thread .button.isFavourite .fa-heart, - .actions .favourite.isFavourite .fa-heart, - .actions .favourite { - & when not (@lookup =latte) { - --color-white: #rgbify(@crust) []; - } - } - } -} - -@-moz-document domain("anichart.net") { - body:not(.site-theme-dark) { - #catppuccin(@lightFlavor, @accentColor); - } - .site-theme-dark { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accentColor]; - @contrast-color: @catppuccin[@@lookup][@@contrastColor]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - .login[data-v-0d5bfbcd], - .login[data-v-0d5bfbcd]:hover { - color: @base; - } - - [fill="#3db4f2" i] { - fill: @accent !important; - } - - & when not (@lookup =latte) { - .nav { - background: @mantle; - } - - .external-link { - background: @surface1; - - [stroke="#fff" i] { - stroke: @text !important; - } - } - - .external-link .icon, - .dropdown-menu:hover { - --color-white: #rgbify(@crust) []; - } - - [fill="#fff" i] { - fill: @crust !important; - } - } - - & when (@lookup =latte) { - --color-overlay: #rgbify(@text) []; - - .external-link { - background: @subtext0; - } - - .nav { - background: @text; - } - - a.title { - --color-white: #rgbify(@base) []; - } - } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/anilist/catppuccin.user.less b/styles/anilist/catppuccin.user.less new file mode 100644 index 0000000000..d2554eb03e --- /dev/null +++ b/styles/anilist/catppuccin.user.less @@ -0,0 +1,654 @@ +/* ==UserStyle== +@name AniList/AniChart Catppuccin +@namespace github.com/catppuccin/userstyles/styles/anilist +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/anilist +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/anilist/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aanilist +@description Soothing pastel theme for AniList and AniChart +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] + +@var select contrastColor "Contrast Color" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red*", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("anilist.co"), domain("anichart.net") { + body:not(.site-theme-dark) { + #catppuccin(@lightFlavor); + } + .site-theme-dark { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + + @contrast: @catppuccin[@@flavor][@@contrastColor]; + + #lib.defaults(); + + & when (@flavor = latte) { + --color-blue-dim: #lib.rgbify(desaturate(lighten(@accent, 10%), 10%))[]; + + .nav[data-v-62eacfff], + .solid[data-v-62eacfff], + .transparent[data-v-62eacfff]:hover { + background: darken(@text, 10%); + color: @base; + } + + .nav-unscoped.transparent { + background: fade(darken(@text, 10%), 50%); + } + } + + --color-background: #lib.rgbify(@crust)[]; + --color-foreground: #lib.rgbify(@base)[]; + --color-foreground-grey: #lib.rgbify(@surface0)[]; + --color-foreground-grey-dark: #lib.rgbify(darken(@surface0, 5%))[]; + --color-foreground-blue: #lib.rgbify(@mantle)[]; + --color-foreground-blue-dark: #lib.rgbify(@mantle)[]; + --color-background-blue-dark: #lib.rgbify(@subtext1)[]; + --color-overlay: #lib.rgbify(@surface0)[]; + --color-shadow: #lib.rgbify(@mantle)[]; + --color-shadow-dark: #lib.rgbify(darken(@text, 10%))[]; + --color-shadow-blue: #lib.rgbify(@blue)[]; + --color-text: #lib.rgbify(@text)[]; + --color-text-light: #lib.rgbify(@subtext1)[]; + --color-text-lighter: #lib.rgbify(@subtext0)[]; + --color-text-bright: #lib.rgbify(if(@flavor = latte, @crust, @text))[]; + --color-blue: #lib.rgbify(@accent)[]; + --color-white: 255, 255, 255; + --color-black: 0, 0, 0; + --color-red: #lib.rgbify(@contrast)[]; + --color-peach: #lib.rgbify(@maroon)[]; + --color-orange: #lib.rgbify(@peach)[]; + --color-yellow: #lib.rgbify(@yellow)[]; + --color-green: #lib.rgbify(@green)[]; + --color-background-1200: #lib.rgbify(@text)[]; + --color-background-1100: #lib.rgbify(@text)[]; + --color-background-1000: #lib.rgbify(@text)[]; + --color-background-900: #lib.rgbify(@subtext1)[]; + --color-background-800: #lib.rgbify(@subtext0)[]; + --color-background-700: #lib.rgbify(@surface1)[]; + --color-background-600: #lib.rgbify(@surface0)[]; + --color-background-500: #lib.rgbify(@surface0)[]; + --color-background-400: #lib.rgbify(@surface0)[]; + --color-background-300: #lib.rgbify(@base)[]; + --color-background-200: #lib.rgbify(@mantle)[]; + --color-background-100: #lib.rgbify(@crust)[]; + --color-gray-1200: #lib.rgbify(@text)[]; + --color-gray-1100: #lib.rgbify(@text)[]; + --color-gray-1000: #lib.rgbify(@text)[]; + --color-gray-900: #lib.rgbify(@text)[]; + --color-gray-800: #lib.rgbify(@overlay2)[]; + --color-gray-700: #lib.rgbify(@overlay1)[]; + --color-gray-600: #lib.rgbify(@overlay0)[]; + --color-gray-500: #lib.rgbify(@surface2)[]; + --color-gray-400: #lib.rgbify(@surface1)[]; + --color-gray-300: #lib.rgbify(@surface0)[]; + --color-gray-200: #lib.rgbify(@mantle)[]; + --color-gray-100: #lib.rgbify(@crust)[]; + --color-blue-100: #lib.rgbify(@text)[]; + --color-blue-200: #lib.rgbify(@text)[]; + --color-blue-300: #lib.rgbify(@text)[]; + --color-blue-400: #lib.rgbify(@sapphire)[]; + --color-blue-500: #lib.rgbify(@sapphire)[]; + --color-blue-600: #lib.rgbify(@blue)[]; + --color-blue-700: #lib.rgbify(@blue)[]; + --color-blue-800: #lib.rgbify(@blue)[]; + --color-blue-900: #lib.rgbify(@blue)[]; + --color-blue-1000: #lib.rgbify(@blue)[]; + --color-green-100: #lib.rgbify(@teal)[]; + --color-green-200: #lib.rgbify(@green)[]; + --color-green-300: #lib.rgbify(@green)[]; + --color-green-400: #lib.rgbify(@green)[]; + --color-green-500: #lib.rgbify(@green)[]; + --color-green-600: #lib.rgbify(@green)[]; + --color-green-700: #lib.rgbify(@green)[]; + --color-green-800: #lib.rgbify(@green)[]; + --color-red-100: #lib.rgbify(@text)[]; + --color-red-200: #lib.rgbify(@flamingo)[]; + --color-red-300: #lib.rgbify(@maroon)[]; + --color-red-400: #lib.rgbify(@red)[]; + --color-red-500: #lib.rgbify(@red)[]; + --color-red-600: #lib.rgbify(@red)[]; + --color-red-700: #lib.rgbify(@red)[]; + + & when not(@flavor = latte) { + --color-background: #lib.rgbify(@crust)[]; + --color-foreground: #lib.rgbify(@base)[]; + --color-foreground-grey: #lib.rgbify(@surface0)[]; + --color-foreground-grey-dark: #lib.rgbify(darken(@surface0, 5%))[]; + --color-foreground-blue: #lib.rgbify(@mantle)[]; + --color-foreground-blue-dark: #lib.rgbify(@mantle)[]; + --color-text: #lib.rgbify(@text)[]; + --color-text-light: #lib.rgbify(@subtext0)[]; + --color-text-lighter: #lib.rgbify(@subtext1)[]; + --color-shadow-dark: #lib.rgbify(@crust)[]; + --color-shadow-blue: #lib.rgbify(@crust)[]; + --color-background-1200: #lib.rgbify(@text)[]; + --color-background-1100: #lib.rgbify(@text)[]; + --color-background-1000: #lib.rgbify(@text)[]; + --color-background-900: #lib.rgbify(@subtext1)[]; + --color-background-800: #lib.rgbify(@subtext0)[]; + --color-background-700: #lib.rgbify(@surface1)[]; + --color-background-600: #lib.rgbify(@surface0)[]; + --color-background-500: #lib.rgbify(@surface0)[]; + --color-background-400: #lib.rgbify(@surface0)[]; + --color-background-300: #lib.rgbify(@base)[]; + --color-background-200: #lib.rgbify(@mantle)[]; + --color-background-100: #lib.rgbify(@crust)[]; + --color-gray-1200: #lib.rgbify(@text)[]; + --color-gray-1100: #lib.rgbify(@text)[]; + --color-gray-1000: #lib.rgbify(@text)[]; + --color-gray-900: #lib.rgbify(@text)[]; + --color-gray-800: #lib.rgbify(@overlay2)[]; + --color-gray-700: #lib.rgbify(@overlay1)[]; + --color-gray-600: #lib.rgbify(@overlay0)[]; + --color-gray-500: #lib.rgbify(@surface2)[]; + --color-gray-400: #lib.rgbify(@surface1)[]; + --color-gray-300: #lib.rgbify(@surface0)[]; + --color-gray-200: #lib.rgbify(@mantle)[]; + --color-gray-100: #lib.rgbify(@crust)[]; + + --color-blue-dim: #lib.rgbify(desaturate(darken(@accent, 10%), 10%))[]; + } + + /* DARK THEME NAV BAR */ + .nav-unscoped when not(@flavor = latte) { + background-color: @mantle; + } + .nav-unscoped.transparent when not(@flavor = latte) { + background-color: fade(@mantle, 50%); + } + .nav-unscoped.transparent:hover when not(@flavor = latte) { + background-color: @mantle; + color: @subtext0; + } + + /* -----------------PROFILE FIXES----------------- */ + #profileColor(@color) { + --color-blue: #lib.rgbify(@color)[]; + & when (@flavor = latte) { + --color-blue-dim: #lib.rgbify(lighten(@color, 10%))[]; + } + & when not(@flavor = latte) { + --color-blue-dim: #lib.rgbify(darken(@color, 10%))[]; + } + .progress .bar { + background: linear-gradient(270deg, darken(@color, 10%), @color); + } + } + .user-page-unscoped.orange { + #profileColor(@peach); + } + .user-page-unscoped.green { + #profileColor(@green); + } + .user-page-unscoped.purple { + #profileColor(@mauve); + } + .user-page-unscoped.red { + #profileColor(@red); + } + .user-page-unscoped.blue { + #profileColor(@blue); + } + .user-page-unscoped.pink { + #profileColor(@pink); + } + .user-page-unscoped.gray { + #profileColor(@overlay1); + } + .history-day { + --color-foreground-grey-dark: #lib.rgbify(@crust)[]; + } + .x-axis { + --color-background-300: #lib.rgbify(@surface0)[]; + } + /* Fixes gap between stats */ + @media (max-width: 1540px) { + .stats-wrap { + grid-row-gap: 25px; + } + } + + /* ----Tracking Status List Stuff---- */ + .list[data-v-5776f768] { + color: @mantle !important; + } + .media-card .list-status[status="Repeating"] { + background: @pink; + } + .banner .el-icon-arrow-down::before { + color: @text !important; + } + .el-textarea__inner::placeholder { + color: @overlay1; + } + .el-dropdown-menu, + .el-dropdown-menu__item--divided::before, + .el-select-dropdown { + background-color: @surface0 !important; + } + .el-popper[x-placement^="bottom"] .popper__arrow::after, + .el-popper[x-placement^="bottom"] .popper__arrow, + .el-tooltip__popper[x-placement^="bottom"] .popper__arrow::after, + .el-tooltip__popper[x-placement^="bottom"] .popper__arrow { + border-bottom-color: @surface0; + } + .el-popper[x-placement^="top"] .popper__arrow::after, + .el-popper[x-placement^="top"] .popper__arrow, + .el-tooltip__popper[x-placement^="top"] .popper__arrow, + .el-tooltip__popper[x-placement^="top"] .popper__arrow::after { + border-top-color: @surface0; + } + .el-dropdown .feed-filter { + color: @overlay0; + } + .el-dropdown-menu { + border-color: @text !important; + } + .el-dropdown-menu__item--divided when not(@flavor = latte) { + border-top-color: @surface1; + } + .el-select-dropdown__item.hover, + .el-select-dropdown__item:hover { + background-color: @base; + } + .el-select-dropdown__item.selected { + color: @accent; + } + .el-tooltip__popper.is-dark { + background: @surface0; + color: @text; + } + .tooltip > div { + --color-white: #lib.rgbify(@text)[]; + } + .dropdown { + --color-gray-100: #lib.rgbify(@base)[]; + --color-background-100: #lib.rgbify(@base)[]; + --color-background-200: #lib.rgbify(@mantle)[]; + } + .medialist .notes { + --color-overlay: #lib.rgbify(@surface0)[]; + } + .el-input__inner::placeholder, + .el-input__prefix { + color: @overlay1; + } + .el-picker-panel { + color: @text; + background-color: @surface0; + border-color: @surface1; + } + .el-date-table th { + color: @overlay1; + border-bottom-color: @surface1; + } + .el-date-picker__header-label { + color: @subtext0; + + &:hover { + color: @accent; + } + } + .el-picker-panel__icon-btn { + color: @overlay1; + + &:hover { + color: @accent; + } + } + .el-date-table td.available:hover { + color: @accent; + } + .el-date-table td.current:not(.disabled) span { + color: @crust; + background-color: @accent; + } + .el-date-table td.next-month, + .el-date-table td.prev-month { + color: @surface2; + } + + /* ---------SCORE TWEAKS-------------- */ + .score[data-v-5ca094da] { + color: @base; + } + + /* --------------FOOTER--------------- */ + .footer[data-v-0f519cab] { + background: @text; + color: @crust; + + h2 { + color: rgb(var(--color-blue)); + } + + & when (@flavor = latte) { + --color-blue: #lib.rgbify(lighten(@accent, 30%))[]; + } + + & when not(@flavor = latte) { + background: @mantle; + color: @subtext0; + } + } + + /* ------------------SEARCH PAGES------------------ */ + .search, + .expand-description, + .studio { + --color-background-200: #lib.rgbify(@crust)[]; + } + .search-wrap, + .filters, + .extra-filters-wrap, + .select, + .options { + --color-background-100: #lib.rgbify(@base)[]; + } + .filter.select-wrap .options { + --color-background-100: #lib.rgbify(@mantle)[]; + } + + /* ------------------MISC EDITS-------------------- */ + .list-editor-wrap .header::after { + background: fade(@mantle, 50%); + } + .filter.clear-all { + --color-background-500: #lib.rgbify(@overlay1)[]; + } + /* --Reset button in notifications----- */ + .reset-btn { + color: @base !important; + } + /* Publish Button in Replies and Messages */ + .save { + color: @base !important; + } + .el-radio { + color: @overlay1; + } + /* Mod Stuff */ + .el-color-dropdown__link-btn { + color: @accent; + } + .el-color-picker__color { + border-color: @surface1; + } + .el-color-picker__panel { + background-color: @surface0; + border-color: @surface1; + } + .el-color-dropdown__btn { + border-color: @surface2; + color: @subtext1; + + &:hover { + background-color: transparent; + border-color: @accent; + color: @accent; + } + } + /* Accent Text */ + .input .hint { + --color-white: #lib.rgbify(@text)[]; + } + .el-checkbox__input.is-checked + .el-checkbox__label { + color: @accent; + } + .button, + .option.active, + .new-badge, + .submissions .user .stats > div, + .actions .icon, + .submissions .status, + .adult-label, + .header .btn, + .media-tag-editor .btn, + [data-v-843c77a2] .btn, + [data-v-22855988] .btn, + .btn[data-v-156b3973], + .btn[data-v-dceb4a66], + .favourite-btn, + .dialog .btn, + .tag, + .filter, + .media .header div, + .list-editor-wrap .header .save-btn, + .actions > div:not(.donator-badge), + .banner-content .mod-badge-wrap, + .external-link.no-color, + .count.circle, + .el-dropdown-menu__item, + .delete, + .list-editor-wrap .list-editor .body .delete-btn, + .open-user-search, + .save-btn { + & when not(@flavor = latte) { + --color-white: #lib.rgbify(@crust)[]; + } + } + .submit-btn, + .random-btn { + & when not(@flavor = latte) { + color: @crust; + } + } + .user .notification-dot, + .create-btn { + & when not(@flavor = latte) { + color: @crust !important; + } + } + .el-radio__inner::after { + & when not(@flavor = latte) { + background-color: @crust; + } + } + .icon, + .check { + & when not(@flavor = latte) { + --color-blue-300: #lib.rgbify(@crust)[]; + } + } + /* ------------IMAGE COVER------------ */ + .cover .image-text, + .plus-progress { + color: @text !important; + } + + .entry .plus-progress, + .medialist.table .entry .edit { + color: @base !important; + } + /* --------SETTINGS-------- */ + .el-radio__inner when not(@flavor = latte) { + background-color: @text; + } + .el-checkbox__input.is-checked .el-checkbox__inner, + .el-radio__input.is-checked .el-radio__inner { + background-color: @accent; + border-color: @accent; + } + .el-checkbox__inner::after { + border-color: @crust; + border-width: 2px; + left: 3px; + } + .el-radio__input.is-checked + .el-radio__label { + color: @accent; + } + /* --------HIDE SCROLLBAR IN BIO----- */ + .section::-webkit-scrollbar { + display: none; + } + .section { + -ms-overflow-style: none; + scrollbar-width: none; + } + /* --------REMOVE DROPDOWN SHADOWS----- */ + .dropdown.dropdown { + box-shadow: none; + } + /* ---------ANILIST LIKER PLUGIN------ */ + #AnilistLikerPlugin .btntop { + margin-bottom: -4px; + margin-top: 5px; + } + #AnilistLikerPlugin .btnbottom { + margin-top: -2px; + } + /* ---------AUTOMAIL TWEAKS--------- */ + .hohMediaScore { + border-color: @surface0; + padding: 4px; + border-radius: 10px; + margin-left: 0; + background-color: @base; + color: @accent; + } + .activity-feed .hohNoteSuffix:not(:empty), + .activity-feed .hohRewatchSuffix:not(:empty), + .activity-feed .hohScore:not(.hohSmiley), + .hohFeedScore .hohScore { + border-radius: 5px; + padding: 2.5px 5px 1px !important; + color: @subtext1 !important; + background-color: @surface0; + + &:not(:first-of-type) { + margin: 3px; + } + } + .activity-feed .hohRewatchSuffix:not(:empty) { + padding-left: 2px !important; + } + .hohExtraFilters button { + margin-bottom: 20px; + } + .filter-group.compare-btn, + .hohButton { + color: @base; + } + .hohButton, + .hohCheckbox input:checked + .el-checkbox__inner { + background-color: @accent; + } + .hohCheckbox input:checked + .el-checkbox__inner { + border-color: @accent; + } + .medialist.table .entry:hover, + .medialist.table .entry .title a:hover, + .compare-btn[data-v-170179fc]:hover { + color: @base; + } + .hohCompare table { + background-color: @crust; + } + .hohAnimeTable, + .hohAnimeTable td, + .hohUserRow td, + .hohUserRow th, + .hohHeaderRow td, + .hohHeaderRow th { + border-color: @surface0 !important; + } + .hohUserRow td { + border-top-color: @surface0 !important; + } + .hohUserRow tr { + border-right-color: @surface0 !important; + } + hr { + color: @surface0; + } + .hohCheckbox + input:checked + + .el-checkbox__inner + .like-wrap.thread + .button.liked + .fa-heart, + .actions .favourite.liked .fa-heart, + .like-wrap.thread .button.isFavourite .fa-heart, + .actions .favourite.isFavourite .fa-heart, + .actions .favourite { + & when not(@flavor = latte) { + --color-white: #lib.rgbify(@crust)[]; + } + } + } +} + +@-moz-document domain("anichart.net") { + body:not(.site-theme-dark) { + #catppuccin(@lightFlavor); + } + .site-theme-dark { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + .login[data-v-0d5bfbcd], + .login[data-v-0d5bfbcd]:hover { + color: @base; + } + + [fill="#3db4f2" i] { + fill: @accent !important; + } + + & when not(@flavor = latte) { + .nav { + background: @mantle; + } + + .external-link { + background: @surface1; + + [stroke="#fff" i] { + stroke: @text !important; + } + } + + .external-link .icon, + .dropdown-menu:hover { + --color-white: #lib.rgbify(@crust)[]; + } + + [fill="#fff" i] { + fill: @crust !important; + } + } + + & when (@flavor = latte) { + --color-overlay: #lib.rgbify(@text)[]; + + .external-link { + background: @subtext0; + } + + .nav { + background: @text; + } + + a.title { + --color-white: #lib.rgbify(@base)[]; + } + } + } +} diff --git a/styles/anilist/preview.webp b/styles/anilist/preview.webp deleted file mode 100644 index 1d3753721c..0000000000 --- a/styles/anilist/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:32482735c852ffe19d4a71a996607d0d00f378c98fd021bf43bdba8b6946a3c9 -size 236912 diff --git a/styles/anonymous-overflow/README.md b/styles/anonymous-overflow/README.md new file mode 100644 index 0000000000..51c691df32 --- /dev/null +++ b/styles/anonymous-overflow/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Anonymous Overflow + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [ImenaOphelia](https://github.com/ImenaOphelia) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/anonymous-overflow/catppuccin.user.less b/styles/anonymous-overflow/catppuccin.user.less new file mode 100644 index 0000000000..ae84fa2ef2 --- /dev/null +++ b/styles/anonymous-overflow/catppuccin.user.less @@ -0,0 +1,109 @@ +/* ==UserStyle== +@name Anonymous Overflow Catppuccin +@namespace github.com/catppuccin/userstyles/styles/anonymous-overflow +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/anonymous-overflow +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/anonymous-overflow/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aanonymous-overflow +@description Soothing pastel theme for Anonymous Overflow +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +/* Working instances filtered from instance list: https://aohub.httpjames.space/. */ +@-moz-document domain("ao.vern.cc"), + domain("overflow.adminforge.de"), + domain("overflow.floppa.cloud"), + domain("overflow.hostux.net"), + domain("ao.bloat.cat"), + domain("ao.owo.si"), + domain("overflow.r4fo.com"), + domain("overflow.ducks.party"), + domain("anonymousoverflow.privacyredirect.com"), + domain("soflow.nerdvpn.de"), + domain("overflow.einfachzocken.eu"), + domain("anonymousoverflow.catsarch.com"), + domain("overflow.darkness.services"), + domain("anonflow.aketawi.space"), + domain("o.iii.st"), + domain("overflow.canine.tools") { + @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); + + :root[data-theme="auto"] { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + :root[data-theme="dark"] { + #catppuccin(@darkFlavor); + } + + :root[data-theme="light"] { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --main-bg: @base; + --text-color: @text; + --muted-text-color: @subtext0; + --link-color: @blue; + --meta-bg: @surface1; + --input-bg: @mantle; + --input-bg-hover: @surface1; + --divider-color: @overlay0; + + .view-input:focus { + border-color: @surface2; + } + + .answer-link .icon img { + background: none; + filter: @text-filter; + } + .answer-meta.accepted { + background-color: @green; + color: @base; + + .answer-link .icon img { + filter: @crust-filter; + } + } + + .sorting img[src="/static/icons/sort.svg"] { + filter: @subtext0-filter; + } + + .logo { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + hr { + border-color: @overlay0; + } + + .error { + background-color: @red; + } + .error, .success { + color: @crust; + } + } +} diff --git a/styles/arch-wiki/README.md b/styles/arch-wiki/README.md index 0a3026fe69..5185ea80b1 100644 --- a/styles/arch-wiki/README.md +++ b/styles/arch-wiki/README.md @@ -4,25 +4,24 @@

Logo
- Catppuccin for Arch Wiki + Catppuccin for Arch Wiki

- -

- -

- +

## Usage -Make sure to use the default **Light** theme +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + +> [!NOTE] +> Make sure to use the default **Light** theme. -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find! ## ๐Ÿ’– Past Maintainer - [GenShibe](https://github.com/GenShibe) diff --git a/styles/arch-wiki/catppuccin.user.css b/styles/arch-wiki/catppuccin.user.less similarity index 75% rename from styles/arch-wiki/catppuccin.user.css rename to styles/arch-wiki/catppuccin.user.less index 2f816df353..8fa43b5ff6 100644 --- a/styles/arch-wiki/catppuccin.user.css +++ b/styles/arch-wiki/catppuccin.user.less @@ -2,8 +2,8 @@ @name Arch Wiki Catppuccin @namespace github.com/catppuccin/userstyles/styles/arch-wiki @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/arch-wiki -@version 0.0.9 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/arch-wiki/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/arch-wiki/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aarch-wiki @description Soothing pastel theme for Arch Wiki @author Catppuccin @@ -15,59 +15,32 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('wiki.archlinux.org') { - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("wiki.archlinux.org") { + :root.skin-theme-clientpref-os, + .vector-feature-night-mode-enabled, + .skin-invert, + .notheme { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + :root.skin-theme-clientpref-night { + #catppuccin(@darkFlavor); + } + + :root.skin-theme-clientpref-day { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); #content table, #content h1, @@ -192,25 +165,25 @@ } .archwiki-template-box-tip { - background-color: fadeout(hsla(90, 90%, 65%, 0.3), 10%) !important; - border-color: fadeout(hsla(90, 90%, 75%, 0.3), 10%); + background-color: hsla(90, 90%, 65%, 0.2) !important; + border-color: hsla(90, 90%, 75%, 0.2); color: @subtext1; } .archwiki-template-box-note { - background-color: fadeout(hsla(208, 100%, 61%, 0.3), 5%) !important; - border-color: fadeout(hsla(208, 100%, 81%, 0.3), 5%) !important; + background-color: hsla(208, 100%, 61%, 0.25) !important; + border-color: hsla(208, 100%, 81%, 0.25) !important; color: @subtext1; } .archwiki-template-box-warning { - background-color: fadeout(hsla(7, 99%, 60%, 0.3), 5%) !important; - border-color: fadeout(hsla(7, 99%, 80%, 0.3), 05%) !important; + background-color: hsla(7, 99%, 60%, 0.25) !important; + border-color: hsla(7, 99%, 80%, 0.25) !important; color: @subtext1; } .firstHeading { - color: @accent-color !important; + color: @accent !important; } #content { @@ -236,7 +209,7 @@ .vector-pinnable-header-toggle-button, .vector-pinnable-header-unpin-button { color: @mantle; - background-color: @accent-color; + background-color: @accent; border-color: @base; } @@ -336,7 +309,7 @@ } #archnavbar ul li.anb-selected a { - color: @accent-color !important; + color: @accent !important; } .archwiki-template-message { @@ -461,7 +434,7 @@ .cdx-button:enabled, .cdx-button.cdxbutton--fake-button--enabled { color: @mantle; - background-color: @accent-color; + background-color: @accent; border-color: @base; } @@ -482,7 +455,7 @@ } .mw-headline::before { - color: @accent-color !important; + color: @accent !important; } .cdx-button { @@ -520,13 +493,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/arch-wiki/preview.webp b/styles/arch-wiki/preview.webp deleted file mode 100644 index 905eb3eed9..0000000000 --- a/styles/arch-wiki/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:e8ed69eec454585f3e78ad31aee410da54090cfea15ce0a84bbd1a3575e686a6 -size 119394 diff --git a/styles/boringproxy/README.md b/styles/boringproxy/README.md index 2e1d0def7a..275ddc4c98 100644 --- a/styles/boringproxy/README.md +++ b/styles/boringproxy/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Gandalf the Blue](https://github.com/Gandalf-the-Blue) +- [Gandalf-the-Blue](https://github.com/Gandalf-the-Blue)   diff --git a/styles/boringproxy/catppuccin.user.css b/styles/boringproxy/catppuccin.user.css deleted file mode 100644 index dc721a7558..0000000000 --- a/styles/boringproxy/catppuccin.user.css +++ /dev/null @@ -1,209 +0,0 @@ -/* ==UserStyle== -@name boringproxy Catppuccin -@namespace github.com/catppuccin/userstyles/styles/boringproxy -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/boringproxy -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/boringproxy/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aboringproxy -@description Soothing pastel theme for boringproxy -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("boring.example.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - body { - background: @base; - } - main { - background: @crust; - } - .content { - border-color: @overlay0; - } - - //Side Menu - .menu { - background: @mantle; - } - .menu-item { - background: @crust; - } - .menu-item:hover { - background: @surface2; - color: @accent-color; - } - .menu-item:any-link { - color: @text; - } - - // Right SIde Button - .button { - border-color: @accent-color; - background-color: @crust; - color: @subtext1; - } - .button:hover { - color: @surface0; - background-color: @accent-color; - border-color: @crust; - } - - // Top Headers - .list { - background-color: @crust; - } - - .list-item { - color: @accent-color; - } - // Tunnel Table - .tn-tunnel-link { - color: @subtext1; - text-decoration: none; - } - - .tn-tunnel-table__cell { - color: @text; - } - body a { - color: @text; - } - body a:visited { - color: @accent-color; - } - - .tn-attribute__name { - color: @text; - } - .tn-attribute__value { - color: @subtext0; - } - //Tunnel Adding - .tunnel-adder h1 { - color: @text; - } - - .input { - color: @text; - } - .input input { - background-color: @crust; - color: @subtext0; - border-color: @accent-color; - } - - .input select { - background-color: @crust; - color: @subtext0; - border-color: @accent-color; - } - - // Token Adding - .token-adder { - color: @text; - } - .token-adder select { - background-color: @crust; - color: @subtext0; - border-color: @accent-color; - } - - // Client Adding - .client-adder { - color: @text; - } - .client-adder select { - background-color: @crust; - color: @subtext0; - border-color: @accent-color; - } - .client-adder input { - background-color: @crust; - color: @subtext0; - border-color: @accent-color; - } - - // User Adding - .user-adder { - color: @text; - } - .user-adder input { - background-color: @crust; - color: @subtext0; - border-color: @accent-color; - } - // dialog - .dialog__content { - background-color: @crust; - color: @text; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/boringproxy/catppuccin.user.less b/styles/boringproxy/catppuccin.user.less new file mode 100644 index 0000000000..cbb39c7205 --- /dev/null +++ b/styles/boringproxy/catppuccin.user.less @@ -0,0 +1,161 @@ +/* ==UserStyle== +@name boringproxy Catppuccin +@namespace github.com/catppuccin/userstyles/styles/boringproxy +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/boringproxy +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/boringproxy/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aboringproxy +@description Soothing pastel theme for boringproxy +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("boring.example.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + background: @base; + } + main { + background: @crust; + } + .content { + border-color: @overlay0; + } + + //Side Menu + .menu { + background: @mantle; + } + .menu-item { + background: @crust; + } + .menu-item:hover { + background: @surface2; + color: @accent; + } + .menu-item:any-link { + color: @text; + } + + // Right SIde Button + .button { + border-color: @accent; + background-color: @crust; + color: @subtext1; + } + .button:hover { + color: @surface0; + background-color: @accent; + border-color: @crust; + } + + // Top Headers + .list { + background-color: @crust; + } + + .list-item { + color: @accent; + } + // Tunnel Table + .tn-tunnel-link { + color: @subtext1; + text-decoration: none; + } + + .tn-tunnel-table__cell { + color: @text; + } + body a { + color: @text; + } + body a:visited { + color: @accent; + } + + .tn-attribute__name { + color: @text; + } + .tn-attribute__value { + color: @subtext0; + } + //Tunnel Adding + .tunnel-adder h1 { + color: @text; + } + + .input { + color: @text; + } + .input input { + background-color: @crust; + color: @subtext0; + border-color: @accent; + } + + .input select { + background-color: @crust; + color: @subtext0; + border-color: @accent; + } + + // Token Adding + .token-adder { + color: @text; + } + .token-adder select { + background-color: @crust; + color: @subtext0; + border-color: @accent; + } + + // Client Adding + .client-adder { + color: @text; + } + .client-adder select { + background-color: @crust; + color: @subtext0; + border-color: @accent; + } + .client-adder input { + background-color: @crust; + color: @subtext0; + border-color: @accent; + } + + // User Adding + .user-adder { + color: @text; + } + .user-adder input { + background-color: @crust; + color: @subtext0; + border-color: @accent; + } + // dialog + .dialog__content { + background-color: @crust; + color: @text; + } + } +} diff --git a/styles/boringproxy/preview.webp b/styles/boringproxy/preview.webp deleted file mode 100644 index 8f93a2bbfc..0000000000 --- a/styles/boringproxy/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:e7777eed344798cb6698c37ef2d69c4844bfd1bacd0efc6d4bc8f0ab3ba4dd12 -size 26740 diff --git a/styles/brave-search/README.md b/styles/brave-search/README.md index 9b851cccbb..2504298c60 100644 --- a/styles/brave-search/README.md +++ b/styles/brave-search/README.md @@ -10,16 +10,15 @@

- -

- -

- +

## Usage -Make sure to set the theme to either dark or light in Brave Search settings, as the automatic setting will not work. +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + +> [!NOTE] +> Make sure to set the theme to either dark or light in Brave Search settings, as the automatic setting will not work. ## ๐Ÿ’ Current Maintainer - [ndsboy](https://github.com/ndsboy) diff --git a/styles/brave-search/catppuccin.user.css b/styles/brave-search/catppuccin.user.css deleted file mode 100644 index ba9b064cc4..0000000000 --- a/styles/brave-search/catppuccin.user.css +++ /dev/null @@ -1,213 +0,0 @@ -/* ==UserStyle== -@name Brave Search Catppuccin -@namespace github.com/catppuccin/userstyles/styles/brave-search -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/brave-search -@version 2.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/brave-search/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Abrave-search -@description Soothing pastel theme for Brave Search -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("search.brave.com") { - :root.light { - #catppuccin(@lightFlavor, @accentColor); - } - :root.dark { - #catppuccin(@darkFlavor, @accentColor); - } - :root:not(.light, .dark) { - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --color-page-background: @base; - --color-container-background: @crust; - --color-container-highlight: @mantle; - --color-serp-header-background: @crust; - --color-text-interactive: @accent-color; - --color-divider-subtle: @surface0; - --color-divider-interactive: @accent-color; - --color-text-primary: @text; - --color-serp-bar-bg: @mantle; - --color-serp-divider-subtle-container: @surface0; - --color-gray-30: @subtext0; - --color-gray-40: @overlay2; - --color-text-secondary: @subtext1; - --color-text-tertiary: @subtext0; - --color-icon-default: @overlay2; - --color-serp-snippet-background: @base; - --color-link-default: @blue; - --color-link-visited: @mauve; - --color-tabs-search-text-default: @accent-color; - --color-primary-50: @accent-color; - --color-primitive-primary-60: @accent-color; - --color-primitive-primary-70: darken(@accent-color, 5%); - --color-container-interactive: transparent; - --color-button-background: @accent-color; - --color-button-disabled: fade(@surface2, 30%); - --color-serp-settings-background: @mantle; - - dialog { - color: @text; - - &::backdrop { - background-color: fade(@crust, 30%); - } - } - - #searchform::after { - outline-color: @surface0; - } - #searchform-actions::before { - background: none !important; - } - #submit-button { - &:hover:not(:disabled) { - background: linear-gradient( - 314deg, - @peach 8.49%, - @pink 43.72%, - @mauve 99.51% - ); - } - - svg { - fill: @overlay2; - } - } - #searchbox::placeholder { - color: @subtext0; - } - - .button.type--filled.theme--default { - color: @base; - - &:disabled { - color: fade(@text, 50%); - } - } - .button.type--outlined.theme--default:hover { - background-color: @accent-color; - border-color: @accent-color !important; - color: @base !important; - } - .tab-item.active .icon { - fill: @accent-color !important; - } - .tab-item.active ::after { - background: @accent-color !important; - } - - .logo-img { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - .nav-logo .logo-large { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - .nav-logo .logo-small { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - .waves-bottom { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .waves-top { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - input[type="radio"]:checked::after { - background-color: @accent-color; - } - - .feedback-footer { - #logo { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - height: 48px; - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/brave-search/catppuccin.user.less b/styles/brave-search/catppuccin.user.less new file mode 100644 index 0000000000..12151fc855 --- /dev/null +++ b/styles/brave-search/catppuccin.user.less @@ -0,0 +1,199 @@ +/* ==UserStyle== +@name Brave Search Catppuccin +@namespace github.com/catppuccin/userstyles/styles/brave-search +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/brave-search +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/brave-search/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Abrave-search +@description Soothing pastel theme for Brave Search +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("search.brave.com") { + :root.light { + #catppuccin(@lightFlavor); + } + :root.dark { + #catppuccin(@darkFlavor); + } + :root:not(.light, .dark) { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + color: @text; // inherited text (e.g. feedback modal) + + --color-text-primary: @text; + --color-text-secondary: @subtext1; + --color-text-tertiary: @subtext0; + --color-text-disabled: @overlay1; + + --color-icon-default: @overlay2; + --color-icon-secondary: @overlay1; + --color-icon-disabled: @surface2; + + --color-divider-subtle: @surface0; + --color-divider-strong: @surface2; + + --color-button-disabled: @surface1; + + --color-search-background-page: @base; + --color-search-background-search-bar: @surface0; + --color-search-background-container: @surface0; + --color-search-links-link: @blue; + --color-search-background-settings: @mantle; + --color-search-background-highlight: @surface1; + --color-search-background-interactive-normal: fade(@accent, 20%); + --color-search-divider-subtle: @surface1; + --color-search-divider-subtle-container: @surface1; + --color-search-divider-interactive: fade(@accent, 30%); + --color-search-background-enrichment-cards: @surface0; + --color-search-background-suggest-highlight: @surface1; + --color-search-background-user-message-bubble: @surface0; + + --color-primary-20: fade(@accent, 30%); // rerank + --color-neutral-20: @surface1; // search elsewhere link hover border + --color-neutral-5: @surface0; // location sharing ip address info + + --color-white: @text; + --color-schemes-primary: @accent; + --color-schemes-on-primary: @base; + + --color-link-visited: @lavender; + + // Tooltips + --color-primitive-neutral-98: @text; + --color-primitive-neutral-0: @surface0; + + /* Search Results */ + --color-serp-header-background: @base; + .related-query .icon { + color: @overlay2; + } + // Pagination "Next" + .button.type--plain, .button.type--plain-outlined-subtle { + --dsbtn-hover-background: @surface1 !important; + } + + /* Settings */ + --color-page-background: @base; + --color-container-background: @surface0; + --color-primary-50: @accent; // icons + + .form-switch { + --switch-off-background-color: @overlay0; + --switch-off-background-color-hover: @overlay1; + --switch-off-dot-color: @text; + --switch-on-background-color: @accent; + --switch-on-background-color-hover: lighten(@accent, 5%); + --switch-on-dot-color: @base; + } + + /* Search Home */ + + .example-searches { + .card { + background: @surface0; + &:hover { + background: @surface1; + } + } + } + + .download-cta-background::before { + background-image: linear-gradient( + 90deg, + @surface0 0%, + @surface1 100% + ) !important; + mask: none; + } + + .suggestions { + border-top-color: @surface1 !important; + } + + // LLM + --gradient-icons-active: linear-gradient( + 321.5013deg, + @peach 3%, + @pink 40%, + @mauve 99% + ); + #gradient-icons-active stop { + &:nth-child(1) { + stop-color: @peach !important; + } + &:nth-child(2) { + stop-color: @pink !important; + } + &:nth-child(3) { + stop-color: @mauve !important; + } + } + .subutton:hover:not(:disabled, .unavailable), .subutton:focus-visible { + background: linear-gradient( + 314deg, + @peach 8.49%, + @pink 43.72%, + @mauve 99.51% + ); + + .icon { + fill: @base !important; + } + } + .suggestion.ask .ask-badge::before { + background-image: linear-gradient( + 352deg, + fade(@peach, 15%) 3%, + fade(@pink, 15%) 40%, + fade(@mauve, 15%) 99% + ); + } + + #logo img, #nav-logo img, .logo-large { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + .nav-logo .logo-small, .logo-wrapper img { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + .waves-bottom { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + .waves-top { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + } +} diff --git a/styles/brave-search/preview.webp b/styles/brave-search/preview.webp deleted file mode 100644 index 516a9070dc..0000000000 --- a/styles/brave-search/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:dcdac626a4514aad3e51e330cd3a7a9abde05083286a69e21e1a77f705dd07a5 -size 28500 diff --git a/styles/bsky/README.md b/styles/bsky/README.md index b145a58dc2..0b6ee1a7e7 100644 --- a/styles/bsky/README.md +++ b/styles/bsky/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [rooot](https://github.com/RoootTheFox) +- [RoootTheFox](https://github.com/RoootTheFox)   diff --git a/styles/bsky/catppuccin.user.css b/styles/bsky/catppuccin.user.css deleted file mode 100644 index cbdf9fbb97..0000000000 --- a/styles/bsky/catppuccin.user.css +++ /dev/null @@ -1,398 +0,0 @@ -/* ==UserStyle== -@name Bluesky Social Catppuccin -@namespace github.com/catppuccin/userstyles/styles/bsky -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/bsky -@version 0.0.6 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/bsky/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Absky -@description Soothing pastel theme for Bluesky Social -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('bsky.app') { - @media (prefers-color-scheme: light) { - html.colorMode--system { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - html.colorMode--system { - #catppuccin(@darkFlavor, @accentColor); - } - } - - html.theme--light { - #catppuccin(@lightFlavor, @accentColor); - } - html.theme--dim, - html.theme--dark { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --text: @text; - --background: @base; - --backgroundLight: @base; - - /* generic text */ - [style*="color: rgb(255, 255, 255)"] { - color: @text !important; - & when (@lookup = latte) { - /* fix button text in latte */ - color: @base !important; - } - } - - /* secondary text */ - [style*="rgb(163, 178, 194)"] { - color: @subtext1 !important; - } - - /* generic blue inline */ - [style*="color: rgb(16, 131, 254)"] { - color: @accent-color !important; - } - - /* blue svg inline */ - [stroke="hsl(211, 99%, 53%)"], - [stroke="#0085ff"] { - stroke: @accent-color; - } - - [fill="hsl(211, 99%, 53%)"], - [fill="#0085ff"] { - fill: @accent-color; - } - - /* a lot of blue things (buttons etc) */ - div[style*="background-color: rgb(0, 133, 255)"] { - background-color: @accent-color !important; - } - - /* red button text (delete my account) */ - [style*="color: rgb(251, 162, 178)"] { - color: @red !important; - } - - /* delete account button */ - [style^="background-color: rgb(79, 3, 20)"] { - background-color: @red !important; - } - path[fill="#fba2b2"] { - fill: @crust; - } - - /* generic background color */ - .css-175oi2r.r-13awgt0, - [style*="background-color: rgb(255, 255, 255)"], - [style*="background-color: rgb(0, 0, 0)"], - [style*="background-color: rgb(8, 10, 12)"] { - background-color: @base !important; - - & when (@lookup = latte) { - /* fix button colors in latte */ - [style*="background-color: rgb(0, 0, 0)"] { - background-color: @text !important; - } - } - } - - /* secondary background color */ - [style*="background-color: rgb(20, 25, 31)"] { - background-color: @mantle !important; - } - - /* loading circle */ - circle[style^="stroke: rgb(25, 118, 210)"] { - stroke: @accent-color !important; - } - - /* wide site: new post button (w text) */ - .r-wzwllv { - background-color: @accent-color !important; - } - - /* borders */ - .css-175oi2r { - border-color: @surface0 !important; - } - - /* fix selected tab bottom border issue caused by selector above */ - .css-175oi2r[style*="border-bottom-color: rgb(0, 133, 255)"] { - border-bottom-color: @accent-color !important; - } - - /* fixes the bottom border on tabs (timeline) having a darker color */ - .r-oucylx { - border-bottom-color: @base !important; - } - - /* current selected tab (acc page) !! KEEP THIS BELOW ABOVE DEFINITION !! */ - [style*="border-color: rgb(255, 255, 255)"] { - border-color: @accent-color !important; - } - - /* settings highlight thing */ - [style="background-color: rgb(38, 39, 45)"] { - background-color: @crust !important; - } - - /* heart/like */ - .r-84gixx, - .r-1i89l9k { - color: @red; - } - - /* repost */ - .r-5ld2xk { - color: @green; - } - - /* thin site: bluesky text */ - .r-yovm8p { - color: @blue; - } - - /* empty profile banner */ - .r-wuyfte { - background-color: @blue; - } - - /* "invalid handle" warning */ - [style*="color: rgb(236, 72, 104); border-color: rgb(209, 16, 67)"] { - color: @red !important; - border-color: @red !important; - } - - /* end of feed text */ - .r-1521r3q { - color: @overlay1; - } - - /* mobile side drawer */ - [data-testid="drawer"] { - background-color: @base; - } - - /* feedback */ - .r-m7buhn { - background-color: @blue; - } - - /* save, report, post modal button */ - [data-testid="saveBtn"] > div, - [data-testid="sendReportBtn"] > div, - [data-testid="composerPublishBtn"] > div, - [data-testid="editProfileSaveBtn"] > div { - background: unset !important; - background-color: @accent-color !important; - } - - .r-jwli3a { - color: @base !important; - } - - /* draft "Discard" button */ - [style^="background-color: rgb(209, 16, 67)"] { - background-color: @red !important; - } - - /* the round gradient post button in the bottom right when the page is thinner than usual */ - [style*="background-image: linear-gradient(2.35619rad, rgb(90, 113, 250), rgb(0, 133, 255))"] { - background: unset !important; - background-color: @accent-color !important; - } - - /* several white buttons */ - button[style*="background-color: rgb(255, 255, 255)"] - when - not - (@lookup = latte) { - background-color: @text !important; - } - - /* the white buttons text */ - [style*="color: rgb(0, 0, 0)"] { - color: @crust !important; - } - - /* replace dark fill icons with crust ones */ - path[fill="#000000"] { - fill: @crust; - } - - /* fixes a contrast issue when the suggested follows button is enabled (very ugly selector) */ - button[data-testid="suggestedFollowsBtn"][style*="background-color: rgb(255, 255, 255)"] - > svg - > path { - fill: @base !important; - } - - /* text inside most buttons */ - button > div > div[style~="color: rgb(0, 0, 0)"] { - color: @base !important; - } - - /* search bar text */ - [role="search"], - [data-testid="confirmCodeInput"] { - --placeholderTextColor: @subtext1 !important; - } - - /* search bar icon */ - svg[style^="color: rgb(141, 142, 150)"] { - color: @subtext1 !important; - } - - /* small icons */ - path[fill="#ffffff"], - path[fill="hsl(211, 20%, 100%)"] { - fill: @text; - - & when (@lookup = latte) { - fill: @base; - } - } - - /* more gray small icons (seems to only be the trash can/delete icon) */ - path[fill="#8D8E96"] { - fill: @subtext1; - } - - /* settings button at the top of the timeline */ - path[fill="hsl(211, 20%, 70%)"] { - fill: @subtext1; - } - - /* x invite codes available icon */ - div[style*="background-color: rgb(191, 225, 255)"], - div[style*="background-color: rgb(1, 37, 97)"] { - background-color: fadeout(@accent-color, 70%) !important; - > svg > path[fill="#52acfe"] { - fill: @accent-color; - } - } - - /* likes, reposts and comment counts under posts */ - [style*="color: rgb(102, 127, 153)"] { - color: @subtext0 !important; - } - - /* onboarding: continue/next button */ - [data-testid="continueBtn"] { - background-color: @accent-color !important; - } - [data-testid="continueBtn"] > div > div { - color: @base !important; - } - [data-testid="continueBtn"] > div > svg > path { - fill: @base !important; - } - - /* ... button under posts */ - path[fill="hsl(211, 20%, 50%)"] { - fill: @subtext0; - } - - /* pretty self explanatory, user mentions in the post create modal */ - .mention { - color: @accent-color; - } - - /* mentions in the notification tab (highlighted notifications) */ - div[style^="background-color: rgb(0, 16, 64)"] { - background-color: fadeout(@accent-color, 70%) !important; - } - - /* generic blue background color inline (used for buttons in notifications tab) */ - button[style*="background-color: rgb(0, 133, 255)"] { - background-color: @accent-color !important; - } - /* contrast fix for above */ - button[style*="background-color: rgb(0, 133, 255)"] > div > div { - color: @base !important; - } - - /* other button in notifications tab, inner text */ - div[style*="color: rgb(82, 172, 254)"] { - color: @accent-color !important; - } - - /* "No notifications yet!" text in the notifications tab */ - div[style*="color: rgb(141, 142, 150)"] { - color: @subtext0 !important; - } - - /* login: wrong password highlight */ - .r-w7hjet { - background-color: @red; - } - - /* please verify your email popup (green checkmark) */ - circle[fill="#20BC07"] { - fill: @green; - } - - /* toggle circle */ - [style*="background-color: rgb(185, 185, 193)"] { - background-color: @overlay2 !important; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/bsky/catppuccin.user.less b/styles/bsky/catppuccin.user.less new file mode 100644 index 0000000000..8206423159 --- /dev/null +++ b/styles/bsky/catppuccin.user.less @@ -0,0 +1,663 @@ +/* ==UserStyle== +@name Bluesky Social Catppuccin +@namespace github.com/catppuccin/userstyles/styles/bsky +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/bsky +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/bsky/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Absky +@description Soothing pastel theme for Bluesky Social +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("bsky.app") { + html.colorMode--system { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + html.theme--light { + #catppuccin(@lightFlavor); + } + html.theme--dim, + html.theme--dark { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + // fix general site background - this applies to the element + background-color: @base; + + --text: @text; + --background: @base; + --backgroundLight: @base; + + /* generic text */ + [style*="color: rgb(255, 255, 255)"], + [style*="color: rgb(241, 243, 245)"] //, + /* [style*="color: rgb(11, 15, 20)"] this breas on dark */ { + color: if(@flavor = latte, @base, @text) !important; + } + + /* some background color of follow button + hover */ + [style*="background-color: rgb(241, 243, 245)"] { + background-color: if(@flavor = latte, @crust, @text) !important; + } + + [style*="color: rgb(11, 15, 20)"] { + color: if(@flavor = latte, @text, @crust) !important; + } + + /* secondary text [contrast_700] */ + [style*="rgb(165, 178, 197)"], // dark + [style*="rgb(171, 184, 201)"], // dim + [style*="rgb(84, 110, 138)"], + [style*="rgb(66, 87, 108)"] { + color: @subtext1 !important; + } + + // white bottons on the theme/color mode selection in settings + div[style*="background-color: rgb(197, 207, 217)"], // dark + div[style*="background-color: rgb(201, 210, 219)"], // dim + div[style*="background-color: rgb(46, 63, 81)"] // light + { + background-color: @text !important; + > div { + color: @crust !important; + } + } + + /* generic blue inline (e.g. link text, etc) [primary_500] */ + [style*="color: rgb(0, 106, 255)"], // dark + [style*="color: rgb(15, 115, 255)"] // dim + { + color: @accent !important; + } + /* generic blue inline underline (links) [primary_500] */ + [style*="text-decoration-color: rgb(0, 106, 255)"], // dark + [style*="text-decoration-color: rgb(15, 115, 255)"] // dim + { + text-decoration-color: @accent !important; + } + + /* generic blue inline bg color (e.g. notification count) [primary_500] */ + [style*="background-color: rgb(0, 106, 255)"], // dark + [style*="background-color: rgb(15, 115, 255)"] // dim + { + background-color: @accent !important; + + /* notification count contrast fix, also chat message contrast fix (> div) */ + &[style*="color: rgb(241, 243, 245)"], + &[style*="color: rgb(255, 255, 255)"], + > div { + color: @crust !important; + } + + /* icon color fix */ + path[fill="#ffffff"], + path[fill="hsl(211, 20%, 95.3%)"] { + fill: @crust !important; + } + } + + /* sending/pending/failed direct message */ + [style*="background-color: rgb(1, 64, 132)"] { + background-color: fade(@accent, 30%) !important; + } + + /* a lot of blue things (buttons etc) */ + .r-wzwllv, + div[style*="background-color: rgb(0, 133, 255)"] { + background-color: @accent !important; + + /* notification count contrast fix, also chat message contrast fix (> div) */ + &[style*="color: rgb(241, 243, 245)"], + > div { + color: @crust !important; + } + } + + /* subscribe to labeler button */ + button[data-testid="toggleSubscribeBtn"] { + > div { + background-color: @mauve !important; + > div { + color: @crust !important; + } + } + } + + /* direct message "failed to send" text */ + span[style*="color: rgb(205, 10, 55)"] { + color: @red !important; + } + + /* red button text (delete my account) [negative_500] */ + [style*="color: rgb(233, 22, 70)"], // dark + [style*="color: rgb(235, 36, 82)"] // dim + { + color: @red !important; + } + + /* red button (delete, etc) */ + button[style*="background-color: rgb(244, 11, 66)"], + // dark, light (same color) + button[style*="background-color: rgb(246, 60, 103)"], // dark (hover) + button[style*="background-color: rgb(245, 41, 88)"], // dim + button[style*="background-color: rgb(247, 84, 122)"], // dim (hover) + button[style*="background-color: rgb(205, 10, 55)"] // light (hover) + { + background-color: @red !important; + &:hover { + background-color: fade(@red, 70%) !important; + } + // text color + > div { + color: @crust !important; + } + } + + /* delete account button */ + [style^="background-color: rgb(79, 3, 20)"] { + background-color: @red !important; + } + path[fill="#fba2b2"] { + fill: @crust; + } + + /* generic background color */ + [style*="background-color: rgb(255, 255, 255)"], + [style*="background-color: rgb(0, 0, 0)"], + [style*="background-color: rgb(21, 29, 40)"] // dim + { + background-color: @base !important; + + & when (@flavor = latte) { + /* fix button colors in latte */ + [style*="background-color: rgb(0, 0, 0)"] { + background-color: @text !important; + } + } + } + + /* secondary background color + sidebar button hover [contrast_25] */ + [style*="background-color: rgb(17, 24, 34)"], // dark + [style*="background-color: rgb(28, 39, 54)"] // dim + { + background-color: @mantle !important; + } + + /* secondary background color (when active?) (e.g. search bar, hovering some buttons like cancel) */ + [style*="background-color: rgb(25, 34, 46)"], // dark + [style*="background-color: rgb(34, 46, 63)"] // dim + { + background-color: @crust !important; + } + + /* some sort of tertiary background color with a slight accent */ + [style*="background-color: rgb(0, 25, 51)"] { + background-color: fade(@accent, 30%) !important; + } + + /* loading circle */ + circle[style^="stroke: rgb(25, 118, 210)"] { + stroke: @accent !important; + } + + /* wide site: new post button (w text) */ + button[style*="background-color: rgb(0, 106, 255)"], // dark + button[style*="background-color: rgb(66, 145, 255)"], // dark (hover) + button[style*="background-color: rgb(15, 115, 255)"], // dim + button[style*="background-color: rgb(77, 151, 255)"] // dim (hover) + { + background-color: @accent !important; + &:hover { + background-color: fade(@accent, 70%) !important; + } + + > div { + color: @crust !important; + } + svg > path { + fill: @crust !important; + } + } + + /* borders */ + .css-175oi2r { + border-color: @surface0 !important; + } + + /* fix selected tab bottom border issue caused by selector above */ + .css-175oi2r[style*="border-bottom-color: rgb(0, 106, 255)"] { + border-bottom-color: @accent !important; + } + + /* fixes the bottom border on tabs (timeline) having a darker color */ + .r-oucylx { + border-bottom-color: @base !important; + } + + /* current selected tab (acc page) !! KEEP THIS BELOW ABOVE DEFINITION !! */ + [style*="border-color: rgb(255, 255, 255)"] { + border-color: @accent !important; + } + + /* settings highlight thing */ + [style="background-color: rgb(38, 39, 45)"] { + background-color: @crust !important; + } + + /* thin site: bluesky text */ + .r-yovm8p { + color: @blue; + } + + /* empty profile banner */ + .r-wuyfte { + background-color: @blue; + } + + /* "invalid handle" warning */ + [style*="color: rgb(236, 72, 104); border-color: rgb(209, 16, 67)"] { + color: @red !important; + border-color: @red !important; + } + + /* end of feed text */ + .r-1521r3q { + color: @overlay1; + } + + /* mobile side drawer */ + [data-testid="drawer"] { + background-color: @base; + } + + /* feedback */ + .r-m7buhn { + background-color: @blue; + } + + /* save, report, post modal button */ + [data-testid="sendReportBtn"], + [data-testid="composerPublishBtn"], + [data-testid="editProfileSaveBtn"] { + background: unset !important; + + /* "save changes" button in edit profile */ + > div[style*="background-image: linear-gradient(94.0544deg, rgb(90, 113, 250), rgb(0, 133, 255))"] { + background: @accent !important; + } + + /* fix contrast issues */ + > div, + > div > div { + color: @crust !important; + } + } + + [data-testid="saveBtn"] { + > div[style*="background-image: linear-gradient"] { + background: unset !important; + background-color: @accent !important; + > div { + color: @crust !important; + } + } + } + + // toast notifications (e.g. "copied to clipboard") + .r-17c3jg3:has(> div[dir="auto"]) { + background-color: @crust !important; + + .r-jwli3a { + color: @text !important; + } + > svg > path { + fill: @text !important; + } + } + + /* draft "Discard" button */ + [style^="background-color: rgb(209, 16, 67)"] { + background-color: @red !important; + } + + /* Discard draft modal border, bunch of other borders around the app [contrast_100] */ + [style*="border-color: rgb(35, 46, 62)"], // dark + [style*="border-color: rgb(44, 58, 78)"] // dim + { + border-color: @surface2 !important; + } + + /* the round gradient post button in the bottom right when the page is thinner than usual */ + [data-testid="composeFAB"] > div { + background: unset !important; + background-color: @accent !important; + + // fix contrast (inner symbol) + .r-jwli3a { + color: @crust !important; + } + } + + /* blue text only button (e.g. cancel post button) */ + div[style*="color: rgb(66, 145, 255)"], // dark + div[style*="color: rgb(77, 151, 255)"], // dim + div[style*="color: rgb(0, 89, 214)"] // latte !! this overlaps with dark. might break? + { + color: @accent !important; + } + + /* text color when writing a post */ + .ProseMirror, + .ProseMirror-dark { + color: @text; + } + + /* some button background color (when hovering) [primary_100] */ + [style*="background-color: rgb(0, 40, 97)"], // dark + [style*="background-color: rgb(18, 52, 100)"], // dim + [style*="background-color: rgb(204, 225, 255)"], // latte + /* add alt text modal */ + [style*="background-color: rgb(14, 73, 137)"] { + background-color: fade(@accent, 30%) !important; + } + + /* several white buttons */ + button[style*="background-color: rgb(255, 255, 255)"] when not( + @flavor = latte + ) { + background-color: @text !important; + } + + /* the white buttons text */ + [style*="color: rgb(0, 0, 0)"] { + color: if(@flavor = latte, @text, @crust) !important; + } + + /* replace dark fill icons with crust ones */ + path[fill="#000000"] { + fill: if(@flavor = latte, @text, @crust); + } + + /* fixes a contrast issue when the suggested follows button is enabled (very ugly selector) */ + button[data-testid="suggestedFollowsBtn"][style*="background-color: rgb(255, 255, 255)"] + > svg + > path { + fill: @base !important; + } + + /* text inside most buttons */ + button > div > div[style~="color: rgb(0, 0, 0)"] { + color: @base !important; + } + + /* search bar text */ + [role="search"], + [data-testid="confirmCodeInput"] { + --placeholderTextColor: @subtext1 !important; + } + + /* search bar icon (this doesn't actually apply because path fill. keeping anyways) [contrast_500] */ + svg[style^="color: rgb(102, 123, 153"], // dark + svg[style^="color: rgb(111, 131, 159)"] // dim + { + color: @subtext1 !important; + } + + /* small icons */ + path[fill="#FFFFFF"] { + fill: @text; + + & when (@flavor = latte) { + fill: @base; + } + } + + /* more gray small icons (e.g. search bar icon, icons below posts [contrast_500] */ + path[fill="#667B99"], // dark + path[fill="#6F839F"], // dim + [style*="color: rgb(111, 131, 159)"], // dark + [style*="color: rgb(111, 131, 159)"] // dim + { + color: @subtext1 !important; + fill: @subtext1 !important; + } + /* settings button at the top of the timeline, hashtag button/icon at top of timeline [contrast_600] */ + path[fill="#8798B0"], // dark + path[fill="#8D9DB4"] // dim + { + fill: @subtext1; + } + + /* x invite codes available icon */ + div[style*="background-color: rgb(191, 225, 255)"], + div[style*="background-color: rgb(1, 37, 97)"] { + background-color: fade(@accent, 30%) !important; + > svg > path[fill="#52acfe"] { + fill: @accent; + } + } + + /* heart/like */ + .r-84gixx, + .r-1i89l9k, + div[style*="color: rgb(236, 72, 153)"], + button[data-testid="toggleLikeBtn"] + > svg:has(path[fill^="hsl(346,"]) // feed like button + { + color: @red !important; + > path { + fill: @red !important; + } + } + + /* repost */ + .r-5ld2xk, + [style*="color: rgb(92, 239, 170)"] { + color: @green !important; + > path { + fill: @green !important; + } + } + + /* saved icon on post + trending icon */ + path[fill="#006AFF"], // dark + path[fill="#0F73FF"] // dim + { + fill: @accent; + } + + /* tiny people icon on post view ("Everybody can reply") */ + path[fill="hsl(211, 24%, 43.6%)"], + /* icon above "you have no lists" */ + path[fill="hsl(211, 24%, 34.2%)"] { + fill: @subtext0; + } + + /* onboarding: continue/next button */ + [data-testid="continueBtn"] { + background-color: @accent !important; + } + [data-testid="continueBtn"] > div > div { + color: @base !important; + } + [data-testid="continueBtn"] > div > svg > path { + fill: @base !important; + } + + /* pretty self explanatory, user mentions in the post create modal */ + .mention { + color: @accent; + } + + /* mentions in the notification tab (highlighted notifications) */ + div[style*="background-color: rgb(0, 17, 36)"], // dark + div[style*="background-color: rgb(21, 41, 63)"], // dim + div[style*="background-color: rgb(240, 247, 255)"], // light + a[style*="background-color: rgb(0, 17, 36)"], // dark + a[style*="background-color: rgb(21, 41, 63)"], // dim + a[style*="background-color: rgb(240, 247, 255)"] // light + { + background-color: fade(@accent, 30%) !important; + .css-175oi2r:not([role="checkbox"] *) { + background-color: transparent !important; + } + } + + /* generic blue background color inline (used for buttons in notifications tab) */ + button[style*="background-color: rgb(0, 133, 255)"] { + background-color: @accent !important; + } + /* contrast fix for above */ + button[style*="background-color: rgb(0, 133, 255)"] > div > div { + color: @base !important; + } + + /* miscellaneous lines around the app [contrast_200] */ + [style*="border-color: rgb(49, 63, 84)"], // dark + [style*="border-color: rgb(57, 73, 96)"] // dim + { + border-color: @surface1 !important; + } + + /* other button in notifications tab, inner text */ + div[style*="color: rgb(82, 172, 254)"] { + color: @accent !important; + } + + /* "No notifications yet!" text in the notifications tab */ + div[style*="color: rgb(141, 142, 150)"] { + color: @subtext0 !important; + } + + /* login: wrong password highlight */ + .r-w7hjet { + background-color: @red; + } + + /* please verify your email popup (green checkmark) */ + circle[fill="#20BC07"] { + fill: @green; + } + + /* toggle circle */ + [style*="background-color: rgb(185, 185, 193)"] { + background-color: @overlay2 !important; + } + + /* skeletons */ + .r-kdyh1x, + .r-cpet4d { + &[style*="background-color: rgb(20, 27, 35);"] { + background-color: @surface0 !important; + } + } + + /* thread lines */ + div[style*="background-color: rgb(35, 46, 62)"].r-m5arl1 { + background: @surface1 !important; + } + + /* character limit progress circle [primary_500] */ + path[stroke="#006AFF"], // dark + path[stroke="#0F73FF"], // dim + path[stroke="#006AFF"] // light + { + stroke: @accent !important; + } + + /* bg circle [contrast_100] */ + path[stroke="#232E3E"], // dark + path[stroke="#2C3A4E"], // dim + path[stroke="#DCE2EA"] // light + { + stroke: @surface1 !important; + } + + /* load new posts button (border: [contrast_100]; bg: [primary_50]) */ + button[style*="border-color: rgb(35, 46, 62); background-color: rgb(0, 30, 71)"], + // dark + button[style*="border-color: rgb(44, 58, 78); background-color: rgb(18, 41, 73)"], + // dim + button[style*="border-color: rgb(220, 226, 234); background-color: rgb(229, 240, 255)"] // light + { + background-color: @surface0 !important; + border-color: @overlay0 !important; + } + + /* any button that's disabled (we should start using broader overrides) */ + button[disabled] > svg > path { + fill: @overlay0; + } + + /* sitewide text inputs */ + /* the divs are styled separately from the input areas */ + div[style*="border-color: rgb(46, 64, 82)"] { + border-color: @surface1 !important; + } + /* search bar [primary_500] */ + div[style*="border-color: rgb(0, 106, 255)"], // dark + div[style*="border-color: rgb(15, 115, 255)"] // dim + { + border-color: @accent !important; + } + + /* image preview borders across app */ + [style*="border-color: rgb(74, 97, 121)"] { + border-color: @surface2 !important; + } + + /* search tab trending buttons */ + [style*="background-color: rgb(142, 9, 40)"] { + background-color: @red !important; + + div { + color: @crust !important; + } + + svg > path { + fill: @crust; + } + } + /* TODO: new which is green but I can't get the right class cause nothing on bsky is a new trending topic atm */ + + /* round icon backgrounds (e.g. feeds) */ + div[style*="background-color: rgb(21, 52, 85)"] { + background-color: @surface0 !important; + } + + /* pill toggle button styles (e.g. account activity notifications) */ + /* active, hover */ + div[style*="border-color: rgb(76, 162, 254);"] { + border-color: @accent !important; + } + div[style*="background-color: rgb(18, 52, 100)"] { + background-color: fade(@accent, 40%) !important; + } + /* inactive, circle in pill */ + div[style*="background-color: rgb(91, 119, 149)"] { + background-color: @surface2 !important; + } + /* inactive, hover */ + div[style*="border-color: rgb(120, 142, 165)"] { + border-color: @overlay1 !important; + } + } +} diff --git a/styles/bsky/preview.webp b/styles/bsky/preview.webp deleted file mode 100644 index c1468d74d3..0000000000 --- a/styles/bsky/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:dd15b402b81256f2f661060608eb3bd6461a3d9dac05e558461a38714e90e329 -size 276754 diff --git a/styles/bstats/README.md b/styles/bstats/README.md index cf8720e80b..dac18bbc4a 100644 --- a/styles/bstats/README.md +++ b/styles/bstats/README.md @@ -10,16 +10,15 @@

- -

- -

- +

## Usage -Make sure to use the default **Teal** theme from the built-in color picker (located at the bottom of the page) for the best experience! +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + +> [!NOTE] +> Make sure to use the default **Teal** theme from the built-in color picker (located at the bottom of the page) for the best experience! ## ๐Ÿ’ Current Maintainer - [rockquiet](https://github.com/rockquiet) diff --git a/styles/bstats/catppuccin.user.css b/styles/bstats/catppuccin.user.less similarity index 79% rename from styles/bstats/catppuccin.user.css rename to styles/bstats/catppuccin.user.less index 725624a38e..89c9dd2af9 100644 --- a/styles/bstats/catppuccin.user.css +++ b/styles/bstats/catppuccin.user.less @@ -2,8 +2,8 @@ @name bStats Catppuccin @namespace github.com/catppuccin/userstyles/styles/bstats @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/bstats -@version 0.2.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/bstats/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/bstats/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Abstats @description Soothing pastel theme for bStats @author Catppuccin @@ -17,59 +17,21 @@ @var checkbox graphUseAccentColor "Graphs Use Accent" 0 ==/UserStyle== */ -@-moz-document domain('bstats.org') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("bstats.org") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); body, .collection-header, @@ -199,18 +161,18 @@ } /* discord logo on homepage */ - img[src="/images/discord.svg"] when (@lookup=latte) { + img[src="/images/discord.svg"] when (@flavor = latte) { filter: saturate(210%) hue-rotate(-20deg) brightness(82%); } - img[src="/images/discord.svg"] when (@lookup=frappe) { + img[src="/images/discord.svg"] when (@flavor = frappe) { filter: saturate(53%) hue-rotate(-10deg) brightness(147%) contrast(90%) sepia(15%) invert(2%); } - img[src="/images/discord.svg"] when (@lookup=macchiato) { + img[src="/images/discord.svg"] when (@flavor = macchiato) { filter: saturate(52%) hue-rotate(-15deg) brightness(157%) contrast(90%) sepia(10%); } - img[src="/images/discord.svg"] when (@lookup=mocha) { + img[src="/images/discord.svg"] when (@flavor = mocha) { filter: saturate(38%) hue-rotate(-25deg) brightness(153%) sepia(6%); } @@ -240,7 +202,7 @@ } .input-field label { - color: @accent-color !important; + color: @accent !important; } /* search unfocused */ input:not([type]), @@ -273,8 +235,8 @@ input[type="number"]:focus:not([readonly]), input[type="search"]:focus:not([readonly]), textarea.materialize-textarea:focus:not([readonly]) { - border-bottom-color: @accent-color; - box-shadow: 0 1px 0 0 @accent-color; + border-bottom-color: @accent; + box-shadow: 0 1px 0 0 @accent; } /* valid input */ input:not([type]).valid, @@ -311,7 +273,7 @@ .teal-text.text-darken-2, .teal-text.text-lighten-3, a { - color: @accent-color !important; + color: @accent !important; } .btn, @@ -376,7 +338,7 @@ } .dropdown-content li > a, .dropdown-content li > span { - color: @accent-color; + color: @accent; } .divider { @@ -394,12 +356,12 @@ } } .switch label input[type="checkbox"]:checked + .lever { - background-color: desaturate(darken(@accent-color, 25%), 50%); - & when (@lookup=latte) { - background-color: desaturate(lighten(@accent-color, 12%), 30%); + background-color: desaturate(darken(@accent, 25%), 50%); + & when (@flavor = latte) { + background-color: desaturate(lighten(@accent, 12%), 30%); } &::after { - background-color: @accent-color; + background-color: @accent; } } @@ -409,12 +371,12 @@ background-color: @surface1; } .chips .chip.selected { - background-color: @accent-color; + background-color: @accent; color: @base; } .chips.focus { - border-bottom-color: @accent-color; - box-shadow: 0 1px 0 0 @accent-color; + border-bottom-color: @accent; + box-shadow: 0 1px 0 0 @accent; } .chips .input { color: @text; @@ -425,17 +387,17 @@ /* HIGHCHARTS "let's hope this does'nt break"-section */ /* all the charts */ - .highcharts-graph when (@graphUseAccentColor=1) { - stroke: @accent-color; + .highcharts-graph when (@graphUseAccentColor = 1) { + stroke: @accent; } - .highcharts-graph when (@graphUseAccentColor=0) { + .highcharts-graph when (@graphUseAccentColor = 0) { stroke: @red; } /* "shadow" area below graph in time navigator */ .highcharts-area { fill: fade(@red, 5%) !important; - & when (@graphUseAccentColor=1) { - fill: fade(@accent-color, 5%) !important; + & when (@graphUseAccentColor = 1) { + fill: fade(@accent, 5%) !important; } } @@ -446,7 +408,7 @@ /* map blends in with background on latte flavor */ .highcharts-map-series .highcharts-point { stroke: @base !important; - & when (@lookup=latte) { + & when (@flavor = latte) { stroke: @overlay0 !important; } } @@ -474,15 +436,15 @@ .highcharts-markers .highcharts-halo.highcharts-color-0 { fill: @red !important; stroke: none !important; - & when (@graphUseAccentColor=1) { - fill: @accent-color !important; + & when (@graphUseAccentColor = 1) { + fill: @accent !important; } } .highcharts-markers path { fill: @red !important; stroke: @base !important; - & when (@graphUseAccentColor=1) { - fill: @accent-color !important; + & when (@graphUseAccentColor = 1) { + fill: @accent !important; } } @@ -587,7 +549,7 @@ color: @text !important; &:hover { color: @base !important; - background: @accent-color !important; + background: @accent !important; } } /* pie text "shadow" */ @@ -625,8 +587,8 @@ /* hover text red dot */ .highcharts-label.highcharts-tooltip-box tspan[style="fill:#F44336"] { fill: @red !important; - & when (@graphUseAccentColor=1) { - fill: @accent-color !important; + & when (@graphUseAccentColor = 1) { + fill: @accent !important; } } /* map hover text */ @@ -803,13 +765,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/bstats/preview.webp b/styles/bstats/preview.webp deleted file mode 100644 index e2483a1911..0000000000 --- a/styles/bstats/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d7ed0004a943e500a92d6ab4ffc6007282b114f20bb9a46753dc3bb8761f5c96 -size 78040 diff --git a/styles/canvas-lms/README.md b/styles/canvas-lms/README.md index ac8ec26390..8405dcf530 100644 --- a/styles/canvas-lms/README.md +++ b/styles/canvas-lms/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## ๐Ÿ’ Current Maintainer +- [pynappo](https://github.com/pynappo) ## ๐Ÿ’– Past Maintainer - [TheMemeSniper](https://github.com/TheMemeSniper) diff --git a/styles/canvas-lms/catppuccin.user.css b/styles/canvas-lms/catppuccin.user.css deleted file mode 100644 index f0f2d45757..0000000000 --- a/styles/canvas-lms/catppuccin.user.css +++ /dev/null @@ -1,189 +0,0 @@ -/* ==UserStyle== -@name Canvas LMS Catppuccin -@namespace github.com/catppuccin/userstyles/styles/canvas-lms -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/canvas-lms -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/canvas-lms/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acanvas-lms -@description Soothing pastel theme for Canvas LMS -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("instructure.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - #breadcrumbs, - #printQuizButton, - #content, - .navigation-tray-container, - .ic-Dashboard-header__layout, - .button-sidebar-wide, - .access_tokens, - .context_modules, - .textarea-container, - .Button, - .panel, - span { - background-color: @base; - color: @accent-color; - } - - #application, - .comments, - .module-sequence-footer-content, - .immersive_reader_mount_point, - .context_modules { - background: @base !important; - background-color: @base !important; - color: @accent-color !important; - } - - a, - .page-title { - color: fadeout(@text, 0.8) !important; - } - - * { - color: @text !important; - background-color: @base !important; - } - .ic-DashboardCard, - .ic-DashboardCard__header_content, - .ic-DashboardCard__action-container, - .ic-DashboardCard__header-subtitle, - .ic-DashboardCard__header-title, - .ic-DashboardCard__header-term { - background-color: @surface0 !important; - } - - .ic-app-header__main-navigation, - .ic-app-header__logomark-container { - background-color: @crust !important; - } - - .ic-app-header__menu-list-item.ic-app-header__menu-list-item--active - .ic-app-header__menu-list-link { - background-color: fadeout(@crust, 0.8); - } - - body { - background-color: @base; - } - - #right-side .events_list .event-details::after, - #right-side .events_list .todo-details::after, - #right-side .to-do-list .event-details::after, - #right-side .to-do-list .todo-details::after { - content: ""; - position: absolute; - top: 0; - right: 0; - height: 100%; - width: 12px; - background: linear-gradient( - to right, - rgba(255, 255, 255, 0) 0%, - @surface0 80% - ); - } - - :root { - --ic-brand-global-nav-avatar-border: @accent-color; - --ic-brand-font-color-dark: fadeout(@accent-color, 0.8); - --ic-brand-primary: @accent-color; - --ic-brand-global-nav-ic-icon-svg-fill: fadeout(@accent-color, 0.5); - --eMdva-color: @base !important; - --ccWIh-color: @crust; - } - .unread_count, - .menu-item-icon-container, - .menu-item__badge, - .nav-badge { - color: fadeout(@text, 0.8); - } - - .list-view a.active { - border-left-color: #007fff; - color: #007fff; - } - - // Fix file preview - nav.ViewerControls * { - background-color: @surface1 !important; - } - div.Pages, - .Page-container { - background-color: #f2f2f2 !important; - } - .Page-container * { - background-color: transparent !important; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/canvas-lms/catppuccin.user.less b/styles/canvas-lms/catppuccin.user.less new file mode 100644 index 0000000000..1d0e2bfb11 --- /dev/null +++ b/styles/canvas-lms/catppuccin.user.less @@ -0,0 +1,2440 @@ +/* ==UserStyle== +@name Canvas LMS Catppuccin +@namespace github.com/catppuccin/userstyles/styles/canvas-lms +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/canvas-lms +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/canvas-lms/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acanvas-lms +@description Soothing pastel theme for Canvas LMS +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("instructure.com"), domain("instructuremedia.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + /* GLOBALS/VARIABLES */ + --ic-brand-primary: @accent; + --ic-brand-primary-lightened-15: lighten(@accent, 5%); + --ic-brand-primary-darkened-28: darken(@accent, 10%); + --ic-brand-primary-darkened-10: darken(@accent, 3%); + --ic-brand-font-color-dark: @text; + --ic-brand-font-color-dark-lightened-15: @subtext1; + --ic-brand-font-color-dark-lightened-28: @subtext0; + --ic-brand-font-color-dark-lightened-30: @subtext0; + --ic-link-color: @blue; + --ic-link-color-darkened-10: fade(@blue, 90%); + --ic-link-color-lightened-10: lighten(@blue, 10%); + + /* hover colors, used based on whether canvas's css has a blue hover or grayed-out hover color */ + @hover-regular: fade(@surface2, 50%); + @hover-accent: mix(@base, @accent, 70%); + + /* GENERAL UI CHANGES */ + + #footer, + body { + color: @text; + border-color: @surface1; + background-color: @base; + } + hr { + border-color: @surface1; + } + select, + textarea, + input[type="text"], + input[type="password"], + input[type="datetime"], + input[type="datetime-local"], + input[type="date"], + input[type="month"], + input[type="time"], + input[type="week"], + input[type="number"], + input[type="email"], + input[type="url"], + input[type="search"], + input[type="tel"], + input[type="color"], + .uneditable-input { + &ic-Input { + border-color: @surface1; + background-color: @surface0; + } + background-color: @base; + border-color: @surface2; + } + img:not( + [src^="/"], + [src*="cloudfront.net/dist"], + [src*="instructuremedia.com/build"] + ) { + /* force a white background for user-uploaded images */ + background-color: #fffd; + } + scrollbar-color: @surface2 @surface0; + + table { + border-color: @surface1; + } + table[style*="border-color: #000000"] { + border-color: @surface1 !important; + } + thead th { + border-color: @surface1; + } + tbody tr, + tbody td { + border-color: @surface1; + } + td[class$="view-cell"] { + color: @text; + } + + :is(label, fieldset) span[class$="formFieldLabel"] { + color: @subtext1; + } + + :is(label, fieldset) span[class$="text"] { + color: @text; + } + + /* used for links */ + span[color="brand"] { + color: @blue; + } + + /* used for labels */ + span[color="primary"] { + color: @subtext1; + } + span[color="secondary"] { + color: @subtext0; + } + + .user_content { + /* for highlighted non-links in user-created content, revert to regular-ish text color */ + [style~="background-color:"]:not([style~="color:"]) + :not(a.external span) { + color: black; + } + /* just a special exception for pure black text and pure white backgrounds */ + [style*="color: rgb(0, 0, 0)"], + [style*="color: black"], + [style*="color: #000000"] { + &:not([style~="background-color:"]) { + color: @text !important; + } + } + [style*="background-color: rgb(255, 255, 255)"], + [style*="background-color: white"], + [style*="background-color: #ffffff"] { + color: @text !important; + background-color: @base !important; + } + } + + a[class$="link"]:not(.btn, .ic-DashboardCard__link), + a[class$="link"] > span, + button[class$="link"]:not(.btn) { + color: @blue; + &:focus { + outline-color: @accent; + } + } + a.external span { + color: @blue; + } + + /* sticky footers (e.g. teacher-side course settings) */ + .sticky-footer { + background-color: @surface0; + } + .form-actions-sticky-footer { + border-color: @surface1; + } + + /* spinners */ + [class*="spinner__circleTrack"] { + stroke: @surface1 !important; + } + [class*="spinner__circleSpin"] { + stroke: @accent !important; + } + + /* fullscreen background for modal popups */ + :where(body > span > span[class*="mask"]) { + /* modals */ + background-color: fade(@overlay0, 75%); + > span { + color: @text; + background-color: @base; + border-color: @surface1; + div[class$="modalHeader"] { + background-color: transparent; + border-color: @surface1; + button:has(svg[name="IconX"]) { + .flush-button(); + } + } + img { + background-color: transparent; + } + > div[class$="modalFooter"] { + background-color: @surface0; + border-color: @surface1; + button { + .neutral-button(); + } + } + } + } + + div[class*="view-panel__content"] { + color: @text; + } + + /* dialogs */ + .ui-datepicker td span.ui-state-default.ui-state-hover, + .ui-datepicker td a.ui-state-default.ui-state-hover { + border-color: @surface2; + background-color: @surface1; + } + .ui-datepicker-header.ui-widget-header, + .ui-widget-content { + background-color: @surface0; + border-color: @surface1; + } + .ui-widget-overlay { + background-color: fade(@base, 70%); + } + .ui-dialog { + .ui-dialog-titlebar { + background-color: @surface0; + border-color: @surface1; + } + background-color: @surface0; + } + .ui-datepicker .ui-datepicker-time, + .ui-dialog .ui-dialog-buttonpane { + background-color: @surface1; + border-color: @surface2; + } + .form-dialog .form-controls { + background-color: @surface1; + border-color: @surface2; + } + + /* global nav menu */ + .ic-app-header { + .ic-app-header__logomark-container { + background-color: transparent; + } + .ic-app-header__menu-list-item.ic-app-header__menu-list-item--active { + > * { + background-color: @base; + } + .menu-item__text { + background-color: transparent; + } + .ic-app-header__menu-list-link:focus { + box-shadow: + inset 0 0 0 0.125rem @base, + inset 0 0 0 0.25rem + var(--ic-brand-global-nav-menu-item__text-color--active); + } + } + } + .ic-app-header__menu-list-link:focus { + box-shadow: inset 0 0 0 0.125rem @surface1, inset 0 0 0 0.25rem @surface2; + } + --ic-brand-global-nav-menu-item__text-color--active: @accent; + --ic-brand-global-nav-menu-item__badge-text--active: @mantle; + --ic-brand-global-nav-ic-icon-svg-fill--active: @accent; + --ic-brand-global-nav-avatar-border: @text; + + --ic-brand-global-nav-bgd: @mantle; + --ic-brand-global-nav-menu-item__badge-bgd: @surface2; + --ic-brand-global-nav-menu-item__badge-text: @text; + --ic-brand-global-nav-menu-item__text-color: @text; + --ic-brand-global-nav-ic-icon-svg-fill: @text; + .menu-item-icon-container path[fill] { + fill: @text !important; + } + + /* sidebar sliding trays */ + body > span > [class*="tray"] { + background-color: @mantle; + fieldset, + label { + .Gradebook__StatusModalListItem span { + color: black !important; + } + } + div[class$="tray__content"] > div > span:last-of-type:has(> button) { + border-color: @surface1; + background-color: @crust; + } + span[data-testid$="footer"] > div { + border-color: @surface1; + background-color: @crust; + } + } + + div[aria-label="Global Navigation"] [class$="summaryText"] svg { + /* mobile nav menu icons */ + color: @blue; + } + + #nav-tray-portal { + > span > span { + background-color: @base; + [class$="listItem"] { + color: @subtext0; + } + /* needed to persist color on hover */ + a { + color: @blue; + } + div[data-timestamp] { + color: @subtext0; + } + } + label span[class$="label"] { + color: @text; + } + .help-tray li [class$="pill"] { + /* new pill */ + border-color: @green; + color: @green; + background-color: transparent; + } + .profile-tray span[class$="avatar"] { + background-color: @surface0; + span { + color: @accent; + } + } + } + + .profile-tray button[aria-describedby^="Tooltip"] { + /* info tooltip on high contrast ui checkbox */ + .flush-button(); + } + + /* link sidebar for courses */ + .list-view a.active { + border-color: @accent; + color: @accent; + } + + /* pills */ + div[class$="pill"] { + /* info pill (e.g. submitted, graded, etc) */ + background-color: transparent; + border-color: @surface2; + color: @text; + &.css-tfc09q-pill.css-tfc09q-pill { + /* red pills (late, missing) */ + color: @red; + border-color: @red; + } + } + .pill { + background-color: @surface1; + border-color: @surface2; + box-shadow: 0 1px 0 @surface2; + } + /* pills on grades tab */ + .student_assignment [class$="pill"] { + background-color: transparent; + } + .submission-missing-pill > span > div { + color: @red; + border-color: @red; + } + .submission-late-pill > span > div { + /* yes, this is blue in grades and red on dashboard */ + color: @blue; + border-color: @blue; + } + + /* filled-in buttons - this auto-generated class covers a lot of them */ + @hover-button: @surface1; + .neutral-button() { + color: @text; + background-color: @surface0; + border-color: @surface1; + &:hover { + background-color: @hover-button; + > [class$="baseButton__content"] { + background-color: @hover-button; + } + color: @text; + } + path[fill="#000000"] { + fill: @text; + } + > [class$="baseButton__content"] { + color: @text; + background-color: @surface0; + border-color: @surface1; + transition-property: background, transform, filter; + } + [class$="text"] { + color: @text; + } + } + + /* this is for buttons that are accent-colored */ + @hover-accent-button: mix(@base, @accent, 20%); + .accent-button() { + background-color: @accent; + border-color: @surface1; + path[fill="#000000"] { + fill: @mantle; + } + > [class$="baseButton__content"] { + transition-property: all; + color: @mantle; + background-color: @accent; + border-color: @surface1; + } + &:hover { + background-color: @hover-accent-button; + > [class$="baseButton__content"] { + background-color: @hover-accent-button; + } + color: @mantle; + } + } + + span[type="button"] { + .neutral-button(); + } + + /* this is for buttons that have no border/background until hovered */ + @hover-flush-button: fade(@surface1, 30%); + .flush-button() { + color: @text; + background-color: transparent; + border-color: transparent; + &:hover { + background-color: @hover-flush-button; + > [class$="baseButton__content"] { + background-color: @hover-flush-button; + } + color: @text; + } + path[fill="#000000"] { + fill: @text; + } + > [class$="baseButton__content"] { + color: @text; + transition-property: background, transform, filter; + } + [class$="text"] { + color: @text; + } + } + + .btn:not(.btn-primary, .btn-link), + .Button:not( + .Button--link, + .Button--primary, + .Button--icon-action, + .Button--icon-action-danger, + .Button--icon-action-rev + ), + .ui-button { + background-color: @surface0; + color: @text; + border-color: @surface1; + &:focus { + color: @text; + } + &:hover { + background-color: @hover-button; + color: @text; + } + &.ui-state-hover { + background-color: @hover-button; + color: @text; + border-color: darken(@surface1, 5%); + } + &:active { + background-color: darken(@hover-button, 3%); + } + &.active, &.Button--active { + background-color: @subtext0; + border-color: lighten(@surface1, 10%); + color: @mantle; + } + } + + .btn-link, + .Button--link { + &.active, &.Button--active, &.ui-button.ui-state-active, &:active { + background: @surface0; + } + &.disabled, &.ui-button.ui-state-disabled, &[disabled] { + background: transparent; + } + } + + /* the below styles are taken from canvas's common css sheet */ + .ui-button.ui-state-active:hover, + .ui-button.ui-state-active, + .ui-progressbar .ui-button.ui-widget-header { + background-color: @subtext0; + border-color: lighten(@surface1, 10%); + color: @mantle; + } + + --ic-brand-button--primary-bgd: @accent; + --ic-brand-button--primary-text: @crust; + --ic-brand-button--primary-bgd-darkened-5: darken(@accent, 5%); + --ic-brand-button--primary-bgd-darkened-15: darken(@accent, 15%); + + .ui-progressbar .btn-link.ui-button.ui-widget-header, + .ui-progressbar .Button--link.ui-button.ui-widget-header { + background: @surface0; + } + + .btn-published, + .btn-published:hover { + background: @green; + border-color: 1px solid darken(@green, 10%); + color: @crust; + } + + .btn-published:focus { + box-shadow: inset 0 0 0 2px @crust; + background: darken(@green, 10%); + color: @crust; + } + + .btn-published.disabled, + .btn-published.ui-button.ui-state-disabled, + .btn-published.disabled:hover { + border-color: darken(@green, 10%); + background: @green; + color: @crust; + } + + .btn-unpublished { + color: @crust; + text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); + background-color: @red; + background-image: @red; + border-color: @maroon; + } + + .btn-unpublished:hover, + .btn-unpublished:active, + .btn-unpublished.active, + .btn-unpublished.disabled, + .btn-unpublished.ui-button.ui-state-disabled, + .btn-unpublished[disabled] { + color: @crust; + background-color: @maroon; + } + + .btn-unpublished:focus { + color: @crust; + background: @maroon; + box-shadow: inset 0 0 0 2px @crust; + } + /* end of copy-pasted styles */ + + span[role="button"]::before, /* drag handle */ + :is(button, a)[class$="baseButton"]::before { + border-color: @accent; + } + + .ActionButtons button[id^="Drilldown"] { + .accent-button(); + } + + .Button--icon-action:hover, + .Button--icon-action-danger:hover, + .Button--icon-action-rev:hover, + .Button--icon-action:focus, + .Button--icon-action-danger:focus, + .Button--icon-action-rev:focus { + background: transparent !important; + } + + .Button--icon-action-rev:focus { + box-shadow: inset 0 0 0 2px @text; + } + + .btn-primary:focus, .Button--primary:focus { + box-shadow: inset 0 0 0 2px @crust; + } + + /* outlines around clicked elements */ + [class$="__facade"] { + &::before { + border-color: @accent; + } + } + textarea + span[class$="textArea__outline"] { + border-color: @accent; + } + + /* checkboxes */ + input + label span[class$="checkboxFacade__facade"] { + border-color: @surface2; + background-color: @base; + } + input:checked + label span[class$="checkboxFacade__facade"] { + border-color: @surface2; + background-color: @text; + color: @base; + } + + /* toggle switches */ + input + label [class*="toggleFacade__facade"] { + border-color: @surface1; + background-color: @surface0; + span[class$="__iconToggle"] { + &::before { + background-color: @text; + border-color: @surface2; + } + svg { + color: @mantle; + } + } + } + input:checked + label [class*="toggleFacade__facade"] { + border-color: @surface1; + background-color: @green; + span[class$="__iconToggle"] { + &::before { + background-color: @mantle; + border-color: @green; + } + svg { + color: @green; + } + } + } + + input + label span[class$="label"] { + color: @text; + } + + /* dropdown menu buttons */ + [class$="textInput__facade"] { + color: @text; + background-color: transparent; + border-color: @surface2; + input { + color: @text !important; + } + } + select { + color: @text; + border-color: @surface2; + background-color: @base; + } + + /* notifications */ + .ic-notification { + color: @text; + box-shadow: 0 1px 6px @surface1; + .ic-notification__content { + background-color: @base; + } + i { + color: @crust; + } + } + + .ui-state-warning, + .dialog-warning .ui-dialog-titlebar, + .dialog-warning .ui-datepicker .ui-datepicker-header, + .ui-datepicker .dialog-warning .ui-datepicker-header { + border-color: @red; + background: none; + color: @text; + } + + /* alerts */ + div[class*="view-alert"] { + color: @text; + background-color: @base; + border-color: @accent; + > div { + border-color: @accent; + } + > div:has(> svg) { + background-color: @accent; + } + } + + /* pdf reader */ + .Pages { + background-color: @surface0; + } + + /* ui tabs */ + .ui-tabs { + .ui-tabs-panel, + .ui-tabs-nav { + border-color: @surface1; + } + .ui-tabs-nav li.ui-state-hover, + .ui-tabs-nav li:hover, + .ui-tabs-nav li.ui-tabs-active, + .ui-tabs-nav li.ui-tabs-active.ui-state-hover, + .ui-tabs-nav li.ui-tabs-active:hover { + background-color: @base; + border-color: @surface1; + a { + color: @text; + } + } + + .ui-state-hover { + background-color: mix(@overlay2, @surface1, 20%); + } + .ui-tabs-panel { + background-color: @base; + } + #assignments { + tr .title { + border-color: @surface1; + } + } + } + + div[class$="view-tabs__container"] { + background-color: transparent; + div[class$="view-tab"] { + background-color: transparent; + color: @text; + &[aria-selected="true"] { + border-color: @surface2; + border-bottom-color: @base; + } + } + div[role="tabpanel"] > div { + background-color: transparent; + border-color: @surface1; + } + } + div[role="tab"] { + color: @text; + &[aria-selected="true"]::after { + background-color: @accent; + } + } + + /* RECENT ACTIVITY/HOME */ + .recent-activity-header, + .stream-category { + border-color: @surface1; + } + .stream-details tr:hover, + .stream_header:hover { + background-color: @hover-accent; + } + .pages.show .course-title { + color: @subtext0; + } + + /* ANNOUNCEMENTS */ + .ic-item-row { + box-shadow: @surface1 0 -1px 0 0; + box-shadow: 0 -1px @surface1, inset 0 -1px @surface1; + } + [data-testid="pill-container"] * { + color: @subtext0 !important; + } + + /* the unread badge */ + .ic-announcement-row span[class$="badge"] { + background-color: @accent; + } + + .ic-item-row__meta-content-timestamp > p { + color: @subtext0; + } + #mark_all_announcement_read { + .neutral-button(); + } + + /* DASHBOARD */ + .StickyButton-styles__root { + background-color: @accent; + span { + color: @mantle; + } + } + .NotificationBadge-styles__activityIndicator.NotificationBadge-styles__hasBadge + [class$="badge"] { + background-color: @accent; + } + .Day-styles__root { + background-color: @base; + color: @text; + h2 { + border-color: @surface1; + } + .Grouping-styles__title { + color: @blue; + background-color: @base; + &::after { + background-image: none; + } + } + .PlannerItem-styles__root { + border-color: @surface1; + color: @subtext0; + } + .PlannerItem-styles__secondary [class$="-text"] { + color: @subtext0; + } + } + #planner-today-btn, + .PlannerItem-styles__secondary button { + .neutral-button(); + } + + .CompletedItemsFacade-styles__root { + border-color: @surface1; + } + .CompletedItemsFacade-styles__contentPrimary * { + color: @blue; + } + button[data-testid="completed-items-toggle"] { + span[class$="summaryText"] { + color: inherit; + } + } + .ic-Dashboard-header { + background-color: @base; + } + .ic-Dashboard-header__layout { + background-color: @base; + border-color: @surface1; + } + .PlannerHeader-styles__root { + background-color: @base; + svg { + color: @text; + } + } + #DashboardOptionsMenu_Container button { + .flush-button(); + } + .ic-DashboardCard { + background-color: @surface0; + .ic-DashboardCard__header_content { + background-color: @surface0; + } + .ic-DashboardCard__header-button, + .ic-DashboardCard__header-button * { + background-color: transparent; + } + .ic-DashboardCard__action-badge { + background-color: @accent; + .unread_count { + background-color: @accent; + color: @base; + } + } + } + + .ToDoSidebarItem__Info li { + color: @text; + } + .Sidebar__TodoListContainer svg { + color: @text; + } + #right-side { + .h2, + h2 { + border-color: @surface1; + } + background-color: fade(@base, 80%); + .details .header { + color: @subtext0; + } + .ToDoSidebarItem__Close svg { + color: @text; + } + } + #right-side .events_list { + p { + color: @subtext0; + } + + .event-details::after { + background: linear-gradient(to right, transparent 0%, @base 80%); + } + } + .PlannerEmptyState-styles__root { + color: @text; + } + .EmptyDays-styles__root { + background-color: @base; + color: @text; + border-color: @surface2; + > h2 { + border-color: @surface1; + } + } + form[action="/logout"] button { + .neutral-button(); + } + .PlannerHeader [id^="Badge"] { + background-color: @accent; + color: @crust; + } + .Opportunity-styles__root { + background-color: transparent; + } + .Opportunity-styles__oppName { + color: @subtext1; + } + .Opportunity-styles__due, + .Opportunity-styles__points { + color: @subtext1; + } + + /* popup menus */ + span[data-position-content^="Menu"], + span[data-position-content^="Popover"] { + span[class$="arrow"] { + filter: @surface1-filter; + } + > span { + color: @text; + background-color: @surface1; + border-color: @surface2; + } + } + + .ui-menu .ui-menu-item a.ui-state-hover, + .ui-menu .ui-menu-item a.ui-state-active, + .ui-menu .ui-menu-item .ui-progressbar a.ui-widget-header, + .ui-progressbar .ui-menu .ui-menu-item a.ui-widget-header, + .ui-menu .ui-menu-item a.ui-state-focus { + color: @crust; + } + + /* color picker menu (e.g. on dashboard) */ + .ColorPicker__Actions button[class$="baseButton"]:not([id$="Apply"]) { + .neutral-button(); + } + #ColorPicker__Apply { + .accent-button(); + } + .ColorPicker__Container { + background-color: @surface1; + border-color: @surface2; + label span { + color: @subtext0; + } + } + + span[data-testid="RCE_RestoreAutoSaveModal"] { + span[class$="view--block"] { + background-color: transparent; + border-color: @surface1; + color: @text; + } + } + /* select dropdowns */ + span[data-position-content^="Popover"]:has(ul[role="listbox"]) { + border-color: @surface2; + span { + color: @text; + } + > span > span { + background-color: @surface1; + div[class$="separator"] { + background-color: @surface2; + } + li { + background-color: @surface1; + } + ul[role="listbox"] { + background-color: @surface1; + /* the extra selectors are because some lists have group options as list items */ + li:not(:has(ul[role="group"])) { + &:hover, + &:focus, + &:active { + color: @base; + background-color: @accent !important; + span { + color: @base; + } + } + } + li:has([aria-selected="true"]) { + background-color: mix(@surface1, @overlay2, 70%); + } + } + } + } + + /* only on canvas studio apparently */ + span[data-position-content^="Drilldown"] { + border-color: @surface2; + span { + color: @text; + } + li { + background-color: @surface1; + &:not(:has([id^="DrilldownHeader-Title"])) { + &:hover, + &:focus, + &:active { + color: @base; + background-color: @accent !important; + span { + color: @base; + } + } + } + [id^="DrilldownHeader-Separator"] { + background-color: @surface2; + } + } + } + button[id^="Drilldown"] { + > span { + background-color: @base; + color: @text; + border-color: @surface2; + } + &:hover > span { + background-color: @base; + } + } + + /* dropdown menu */ + span[data-position-content^="Menu___"] { + span { + color: @text; + } + [role="menu"] { + &::before { + border-color: @accent; + } + background-color: @surface1; + span[class$="menuItemGroup__label"] { + background-color: @surface1; + } + div[class$="menuItemSeparator"] { + background-color: @surface2; + } + [role="menuitem"], + span[class$="menuItem"] { + background-color: @surface1; + &:hover, + &:focus, + &:active { + color: @base; + background-color: @accent !important; + span { + color: @base; + } + } + } + } + } + + ul[role="menu"] { + div:has(> li[role="menuitem"][data-selected="true"]) { + color: @base; + background-color: @accent !important; + span { + color: @base; + } + } + } + + /* use more noticeable color for file preview selection */ + #App *::selection { + background-color: @accent; + } + + /* ICONS */ + .nav-icon { + background-color: @base; + color: @text; + } + .ui-icon-closethick { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + /* publish icons */ + .publish-icon.publish-icon-published, + .ig-published:not(.student-view) .ig-type-icon { + color: @green; + } + svg[name="IconPublish"], + svg[name="IconBookmark"], + .icon-check { + color: @green !important; + } + svg[name="IconX"] { + color: @text; + } + + /* tree-view expand indicators */ + svg[name="IconArrowOpenEnd"], + svg[name="IconArrowOpenDown"] { + color: @text; + } + + /* unsure what the other colors are */ + span[color="success"] > svg { + color: @green; + } + + .context_module .icon-minimize { + color: @red !important; + } + + .ally-prominent-af-download-button { + @svg: escape( + 'iconAllyDownload-ICCreated with Sketch.' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + img[src="/images/svg-icons/svg_icon_download.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + .standalone-icon::before { + color: @text; + } + + /* MODULES */ + .item-group-expandable, + .item-group-container { + border-color: @surface0; + background-color: @base; + } + .item-group-expandable .emptyMessage { + background-color: @base; + } + .header-bar { + background-color: @base; + } + .content, + .footer { + background-color: @base; + } + .ig-header { + background-color: @surface0; + color: @text; + border-color: @surface1; + .name { + text-shadow: 1px 1px 0 fade(@base, 50%); + color: @text; + } + } + .accessible-toggler { + color: @text; + } + .ig-list { + .ig-row { + color: @text; + background-color: @base; + border-color: @surface1; + } + .ig-row:hover { + background-color: @hover-accent; + } + } + .list-view a.active .nav-badge, + .nav-badge { + background-color: @accent; + color: @base; + } + #breadcrumbs { + background-color: @base; + } + .ic-app-nav-toggle-and-crumbs, + .item-group-condensed { + border-color: @surface1; + } + .pages.show .page-title { + color: @text; + } + #show_by_date, + #show_by_type { + + label > span { + color: @text; + } + &:checked + label > span { + background-color: @surface1; + } + } + + /* COURSES */ + .course-list-favorite-course .icon-star::before { + color: @peach; + } + .course-list-table .course-list-table-row:hover { + background-color: mix(@overlay2, @base, 20%); + } + .course-list-unpublished-course-row { + background-color: darken(@base, 5%); + .course-list-unpublished-course { + color: @red; + } + } + /* browse more courses */ + .course_text { + color: @text; + } + + /* CALENDAR */ + #calendar-app { + .agenda-wrapper { + background-color: @base; + } + table { + thead.fc-head, + .fc-head-container, + .fc-row { + border-color: @surface1; + } + .fc-day-header { + color: @text; + } + .fc-body { + background-color: @base; + } + .fc-today { + background-color: darken(@surface0, 5%); + } + .fc-divider { + border-color: @surface2; + } + } + .fc-agendaWeek-view .fc-day-grid .fc-row { + border-color: @surface1; + } + } + :is(.calendar, #calendar-drag-and-drop-container) + .fc-row + :is(.fc-content-skeleton, .fc-helper-skeleton) + td { + border-color: @surface1; + } + + #calendar-app .fc-event, + #calendar-drag-and-drop-container .fc-event { + background-color: transparent; + } + .calendar_header #create_new_event_link { + color: @text; + } + #calendar-list-holder, + #other-calendars-list-holder, + #undated-events { + background-color: @base; + } + + #minical { + color: @text; + background-color: @surface1; + border-color: @surface1; + h2, + .fc-widget-content { + color: @text; + } + .fc-view { + background-color: @base; + * { + border-color: transparent; + } + } + .fc-state-default { + color: @text; + } + .fc-toolbar { + border-color: @surface1; + } + } + #calendar-list-holder { + background-color: @base; + } + #calendars-context-list .context_list_context:hover, + #other-calendars-context-list .context_list_context:hover { + background-color: mix(@overlay2, @base, 20%); + } + #undated-events { + background-color: @base; + .event { + background-color: @base; + } + } + + .ui-datepicker .ui-datepicker-header .ui-datepicker-prev { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .ui-datepicker .ui-datepicker-header .ui-datepicker-next { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + /* INBOX */ + [data-testid="tool-bar"] { + background-color: @mantle; + border-color: @surface2; + button { + .neutral-button(); + } + } + button[data-testid="address-button"] { + .neutral-button(); + } + svg[name="IconEmail"] { + color: @text; + } + + /* left side */ + [data-testid="conversation"] { + border-color: @surface1; + span[class$="badge"] { + color: @text; + background-color: @surface1; + } + } + #inbox-conversation-holder > div > div > div { + /* each email entry */ + border-color: @surface2; + div[style~="background-color:"] { + background-color: mix(@base, @accent, 90%) !important; + } + div[style~="box-shadow:"] { + box-shadow: @accent -4px 0 0 inset !important; + } + + button[data-testid$="read-badge"] { + &::before { + border-color: @blue; + } + span svg { + color: @accent; + } + } + button[data-testid="visible-not-starred"], + button[data-testid="visible-starred"] { + .flush-button(); + } + } + [data-testid="unread-badge"] span svg { + color: @accent; + } + [data-testid="ic-blue-unread-badge"] span { + background-color: @accent; + } + + /* right side */ + span:has(> #inbox-conversation-holder) + span { + > div > div { + border-color: @surface1; + } + button { + .flush-button(); + } + } + /* compose message overlay */ + span[data-testid="compose-modal-desktop"] { + background-color: @surface0; + border-color: @surface1; + span[class$="view"]:has(label[for^="TextArea"]) { + border-color: @surface1; + textarea { + color: @text; + } + } + span[data-testid="past-messages"] div[class$="view"] { + border-color: @surface1; + } + > div[class$="modalBody"] { + button { + .neutral-button(); + } + } + > div[class$="modalFooter"] { + #send-message-button { + .accent-button(); + } + } + } + + /* COURSE CONTENT (QUIZZES, ETC) */ + #assignment_show .student-assignment-overview { + border-color: @surface1; + } + + #assignment_show .description.teacher-version { + border-color: @surface2; + } + + .assignment_header, + #assignment_student_details, + .quiz-header { + border-color: @surface2; + } + + span:has(> [class$="fileDrop__labelContent"]) { + [class$="fileDrop__labelContent"] { + border-color: @overlay1; + &:hover { + border-color: @accent; + } + } + [class$="fileDrop__layout"] * { + background-color: transparent; + } + label > span::before { + border-color: @accent; + } + } + + .question.fill_in_multiple_blanks_question .answer_group, + .question.multiple_dropdowns_question .answer_group { + border-color: @surface1; + } + .quiz-submission, + .question_editing { + background-color: @base; + border-color: @base; + } + .score_value { + color: @subtext1; + } + .question { + background-color: transparent; + } + .quiz_comment { + border-color: @surface1; + background-image: linear-gradient(to bottom, @base, @surface0); + &::before { + border-bottom-color: @surface1; + } + &::after { + border-bottom-color: @base; + } + } + #quiz_show { + ul#quiz_student_details { + border-color: @surface1; + } + .description.teacher-version { + border-color: @surface2; + } + } + .catppuccin_answer_arrow(@color, @filter) { + color: @mantle; + background-image: none; + text-shadow: none; + background-color: @color; + &::before, + &::after { + filter: @filter; + } + } + .answer_arrow.correct { + .catppuccin_answer_arrow(@green, @green-filter); + } + .answer_arrow.info { + .catppuccin_answer_arrow(@text, @text-filter); + } + .answer_arrow.incorrect { + .catppuccin_answer_arrow(@red, @red-filter); + } + #questions.assessment_results .question .answers .answer.wrong_answer { + border-color: @red; + } + #questions.assessment_results + .question + .answers + .answer.wrong_answer + .ui-selectmenu-status { + color: @red; + } + + .muted-notice { + background-color: @surface0; + background-image: linear-gradient(to bottom, @base, @surface0); + text-shadow: @base 1px 1px 1px; + border-color: @surface2; + } + .alert { + background-color: fade(@red, 15%); + span { + color: @red; + } + } + .icon-warning { + color: @red; + } + + .ic-Table { + td, + th.ic-Table--header-row { + border-color: @surface1; + } + } + table.summary { + td, + tbody th { + background-color: @base; + border-color: @surface1; + } + } + ul#question_list { + li.answered a { + color: @lavender; + } + li.marked { + &::before { + content: url("/dist/images/flagged_question-e2565888dd.png"); + filter: @yellow-filter; + } + padding-left: 6px; + background-image: none; + } + li i { + /* question mark icons */ + color: @subtext0; + } + } + #questions { + background-color: @base; + .ambrosiaContainerComponent * { + color: @text; + } + .question { + border-color: @surface1; + .flag_question { + filter: @blue-filter; + } + &.marked .flag_question { + filter: @yellow-filter; + } + .header { + background-color: @surface0; + border-color: @surface1; + .question_points_holder { + color: @subtext0; + } + } + } + .text { + background-color: @base; + } + .answers .answer { + border-color: @surface1; + } + } + .form-actions { + border-color: @surface1; + } + #last_saved_indicator { + color: @subtext1; + } + .ui-tooltip { + &::before { + border-color: transparent transparent @surface0; + } + &.horizontal::before { + border-color: transparent @surface0 transparent transparent; + } + background-color: @surface0; + } + + .module-sequence-footer .module-sequence-footer-content { + background-color: @base; + border-color: @surface1; + a { + .neutral-button(); + } + } + + /* submitting */ + #tinymce-parent-of-submission_body { + .canvas-rce__skins--root, + * { + color: @text; + } + } + .border { + border-color: @surface1; + } + + /* submission details */ + .submission-details-container { + border-color: @surface1; + } + .submission-details-comments { + .comment_author_and_date { + color: @subtext0; + } + .comments { + border-color: @surface1; + background-color: @surface0; + /* To style only the background-image, we move the background-image to ::before and then tweak the styles. */ + a.media-comment { + padding: 0; + background-image: none; + } + a.media-comment::before { + padding: 0 5px 0 0; + display: inline-block; + transform: translateY(2px) !important; + content: url("/dist/images/audio_comment-eeb35d0efe.gif"); + filter: @text-filter; + } + } + } + .file-upload-submission { + background-color: @surface0; + } + .submission-details-header__heading-and-grades { + border-color: @surface1; + } + .comment { + color: @text !important; + } + /* text editor */ + .tox { + * { + color: @text; + } + .tox-edit-area.active, + .tox .tox-edit-area.active iframe { + border-color: @accent; + } + .tox-split-button .tox-tbtn.tox-split-button__chevron { + background-color: transparent; + } + .tox-tbtn:focus, + .tox-split-button:focus { + background-color: fade(@overlay2, 50%); + color: @subtext0; + fill: @subtext0; + box-shadow: 0 0 0 2px @accent; + } + .tox-tbtn, + .tox-split-button, + .tox-tbtn.tox-tbtn--enabled, + .tox-split-button .tox-tbtn.tox-split-button__chevron { + &:hover, + &:active { + background-color: @surface0; + color: @subtext0; + svg { + fill: @subtext0; + } + } + } + .tox-tbtn.tox-tbtn--enabled::after { + color: @accent; + } + + .tox-mbtn:hover:not(:disabled), + .tox-mbtn:hover:not(:disabled, .tox-mbtn--active) { + background-color: @hover-button; + } + .tox-mbtn--active { + background-color: @hover-button; + } + + .tox-toolbar, + .tox-toolbar__overflow, + .tox-toolbar__primary, + .tox-editor-header, + .tox-menubar, + .tox-menubar__primary, + .tox-menubar-overlord { + background-color: @base; + } + .tox-pop { + &::after { + border-bottom-color: @surface0; + } + .tox-pop__dialog { + background-color: @surface0; + } + } + .tox-toolbar__group::after { + border-color: @surface2; + } + svg, + #Fill-1, + .tox-icon g { + fill: @text; + } + button[title="Embed Lucid Document"] image { + filter: @text-filter; + } + button[title="Embed"] svg path { + fill: @text; + } + .tox-menu { + background-color: @surface0; + border-color: @surface1; + .tox-collection__item { + color: @text; + } + } + .tox-mbtn:focus:not(:disabled) { + box-shadow: 0 0 0 2px @accent; + } + .tox-collection--list .tox-collection__group { + border-color: @surface1; + } + .tox-collection--list + .tox-collection__item--active:not( + .tox-collection__item--state-disabled + ), + .tox-collection__item--active { + background-color: mix(@accent, @base, 30%); + } + .tox-collection--list .tox-collection__item--enabled { + background-color: @surface1; + } + .tox-tbtn:focus:not(.tox-tbtn--disabled) svg { + fill: @text; + } + } + .canvas-rce__skins--root { + background-color: @base; + } + + /* equation editor */ + span[aria-label="Equation Editor"] { + div[class$="panel"] button { + .neutral-button(); + } + textarea, + math-field { + color: @text; + border-color: @surface2 !important; + } + [data-testid="mathml-preview-element"] { + color: @text; + } + button[data-testid="equation-editor-modal-done"] { + .accent-button(); + } + } + + #rubrics { + .rubric_title { + background-color: @surface0; + border-color: @surface1; + } + .rubric_container { + thead th { + background-color: @surface0; + border-color: @surface1; + } + .ratings * { + border-color: @surface1; + } + } + .rubric-footer { + border-color: @surface1; + } + } + + /* discussions */ + .headerBar { + background: @surface0; + border-color: @surface1; + } + .alert-info { + background-color: @surface0; + color: @blue; + * { + color: @blue; + } + } + .topic .entry-content { + border-color: @surface1; + } + .new-and-total-badge .new-items { + color: @base; + } + .discussion_entry > .discussion-entry-reply-area { + border-color: @surface1; + } + .discussion-reply-box { + background-color: @surface0; + border-color: @surface1; + } + .al-options { + background-color: @surface0; + border-color: @surface1; + } + + .ic-discussion-row, + .pinned-discussions-v2__wrapper, + .unpinned-discussions-v2__wrapper, + .discussions-v2__container-image, + .closed-for-comments-discussions-v2__wrapper { + border-color: @surface1; + background-color: @base; + } + .discussions-v2__container-image { + color: @text; + } + .ic-discussion-row { + box-shadow: -1px -1px @surface1, inset -1px -1px @surface1; + } + .discussion-entries { + background-color: @base; + .discussion_entry, + .toolbarView, + .entry { + background-color: @base; + border-color: @surface1; + .entry-content { + background-color: @base; + } + } + time { + color: @subtext0; + } + } + + /* new discussion redesign */ + .discussion-redesign-layout { + div[data-drawer-content^="DrawerLayout"] { + /* the header with the search bar */ + > span > div:first-child { + background-color: @base; + } + } + div[data-testid="discussion-topic-container"] > span > div { + border-color: @surface1; + } + .discussion-post-manage-discussion path { + color: @text; + } + } + + #DrawerLayoutTray { + /* split screen layout */ + background-color: @base; + border-color: @surface1; + } + button[class$="baseButton"]:has(svg[name="IconX"]) { + .flush-button(); + } + button[class$="baseButton"]:has(svg[name="IconMore"]) { + .flush-button(); + } + + .communication_message { + border-color: @surface1; + } + .communication_message div.header { + color: @subtext0; + } + span:has(> [data-testid="DiscussionEdit-container"]) { + background-color: @base; + } + [data-testid="RCEStatusBar"] { + color: @subtext0; + button { + .flush-button(); + } + > span > div { + border-color: @surface1 !important; + } + [data-btn-id="rce-editormessage-btn"] { + .neutral-button(); + } + } + button[data-testid="attach-btn"] > span { + color: @text; + } + .ic-discussion-content-container > span > span:last-child { + color: @text; + } + .discussions-container__wrapper [class$="summaryText"] { + color: @text; + } + .ic-unread-badge__unread-count { + color: @mantle; + } + .ic-unread-badge__total-count { + background-color: @surface1; + } + hr[data-testid="post-separator"] { + border-color: @surface1 !important; + } + .searchButton__container button, + .discussions-index-manage-menu > button { + .neutral-button(); + } + #add_discussion { + .accent-button(); + } + .discussions-editor + div { + button[data-testid="attach-btn"] { + .flush-button(); + } + .discussions-editor-cancel button { + .neutral-button(); + } + .discussions-editor-submit button { + .accent-button(); + } + } + .discussion-topic-reply-button button { + .accent-button(); + } + .discussion-post-manage-discussion button { + .flush-button; + } + .discussion-post-subscribe button { + .flush-button(); + } + button[data-testid="splitscreenButton"], + button[data-testid="ExpandCollapseThreads-button"] { + .neutral-button(); + } + + /* author profile picture placeholder */ + [data-testid="author_avatar"] { + background-color: @surface0; + border-color: @overlay2; + span { + color: @accent; + } + } + /* unread badges */ + .unread_dot, + #grades_summary .unread_dot, + [data-testid="is-unread"] [class$="badge"] { + background-color: @accent; + } + + /* Enhanced Assigments UI */ + + #assignments-student-footer { + background-color: @mantle !important; + border-top-color: @surface1 !important; + + #submit-button > span { + background-color: @accent; + color: @crust; + } + } + + /* Assignment status green text and circle */ + [color="success"] { + color: @green; + } + + [class*="progressCircle__track"] { + stroke: @surface1 !important; + } + [class*="progressCircle__meter"] { + stroke: @green !important; + } + + /* Upload files button */ + .submission-type-icon-contents { + &:has(svg[name="IconUpload"]) { + background-color: @accent; + + svg[name="IconUpload"] { + fill: @crust !important; + } + } + + border-color: @accent; + + &:has(svg[name="IconMore"]) { + background-color: @base; + + svg[name="IconMore"] { + fill: @accent !important; + } + } + } + [color="primary-inverse"] { + color: @crust; + } + + /* Upload files panel */ + [style*="background-color: rgb(245, 245, 245);"] { + background-color: @surface0 !important; + } + div[style]:has(> div > [data-testid="upload-pane"]) { + border-top-color: @surface2 !important; + + label[for="inputFileDrop"] { + [class*="fileDrop__labelContent"] { + border-color: @overlay1; + } + div:has(> [class*="-screenReaderContent"]) { + background-color: @base; + } + } + + div:has(> [class*="block-baseButton"]) { + background-color: @base; + border-color: @surface1; + [class*="block-baseButton"]:hover > [class$="-baseButton__content"] { + background-color: @surface0; + } + + img { + filter: @text-filter; + } + svg[name="IconFolder"] { + color: @text; + } + } + } + button[id^="webcam"] { + .neutral-button(); + } + + /* GRADES */ + .ic-Table th { + border-color: @surface2; + } + .ic-Table.ic-Table--hover-row tbody tr { + &:hover, + &.ic-Table__row--bg-neutral:hover, + &.ic-Table__row--bg-success:hover, + &.ic-Table__row--bg-alert:hover, + &.ic-Table__row--bg-danger:hover { + background-color: @hover-accent; + } + } + .react-rubric * { + color: @text; + border-color: @surface1; + background-color: transparent; + } + .react-rubric .rating-tier.selected { + .meetsMasteryShader { + background-color: @green; + .triangle { + color: @green; + background-color: transparent; + } + } + .nearMasteryShader { + background-color: @yellow; + .triangle { + color: @yellow; + background-color: transparent; + } + } + .wellBelowMasteryShader { + background-color: @red; + .triangle { + color: @red; + background-color: transparent; + } + } + } + + #grades_summary { + th.title { + border-color: @surface1; + } + tr.final_grade { + border-color: @surface2; + } + a[role="button"] { + .neutral-button(); + } + } + + .ic-Form-control.ic-Form-control--checkbox .ic-Label::before { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + background-color: @surface0; + border-color: @surface2; + } + .selected-assignment { + background-color: @hover-accent; + } + [data-id="submissions-comments-tray"] { + background-color: @mantle; + div:has(> a[class$="Button"]) { + color: @text; + background-color: @surface0; + } + } + #apply_select_menus { + .accent-button(); + } + #GradeSummarySelectMenuGroup label > span { + color: @text; + } + + /* PEOPLE */ + .ic-Table.ic-Table--striped tbody tr:nth-child(odd) { + background-color: @mantle; + } + + /* COURSE NOTIFICATIONS MENU */ + table[class$="view-table"], + table[class$="view-table"] :is(tr, th, td) { + background-color: @base; + } + thead > tr[class$="view-row"] { + border-color: @surface2; + } + .notifications tr > th span { + color: @text; + } + + /* SYLLABUS */ + #syllabus tr.date.related td, + #syllabus tr.date.related th, + #syllabus tr.date.selected td, + #syllabus tr.date.selected th { + background-color: @hover-accent; + } + #syllabus tr.date.date_passed td, + #syllabus tr.date.date_passed th { + background-color: @mantle; + } + #syllabus tr.detail_list td.not_last { + border-color: @surface0; + } + #immersive_reader_mount_point button, + #immersive_reader_mobile_mount_point button { + .neutral-button(); + } + + .mini_calendar { + .day { + color: @subtext0; + } + .day.has_event { + background-color: @surface0; + } + .day.today { + background-color: mix(@red, @surface0, 10%); + } + } + .mini-cal-header { + border-color: @surface1; + } + + /* FILES */ + .ef-header, + .ef-directory-header, + .ef-footer, + .ef-main .ef-folder-content { + border-color: @surface1; + } + .ef-item-row:hover { + background-color: @hover-regular; + } + .ef-item-row.ef-item-selected { + background-color: @hover-regular; + } + .ef-file-preview-header { + color: @text; + background-color: @mantle; + } + .ef-file-preview-header > * { + border-color: @surface1; + } + .ef-file-preview-button { + color: @subtext0 !important; + } + .ViewerControls { + background-color: @surface1; + } + .ViewerControls--current-page { + color: @text; + } + .AnnotationControlButton, + .AnnotationControlButton-outer { + background-color: @surface1; + border-color: @surface1; + } + .mimeClass-folder { + @svg: escape( + 'folder' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + .ef-big-icon { + filter: @text-filter; + } + .al-trigger-gray { + color: @overlay1; + } + + /* CHAT */ + /* this has terrible autogenerated css class names */ + .ctf-container > *, + .ctf-container { + background-color: @base; + } + .ctf-header, + .header-contents { + border-color: @surface1; + } + .header-contents span { + color: @text; + } + .ding-toggle { + label:has(svg[name="IconCheck"]) > span > span { + background-color: @green; + } + } + .ctf-message-input { + background-color: @base; + } + .ctf-message-input .ctf-message-input__wrapper { + background-color: @surface0; + border-color: @surface2; + input { + background-color: transparent; + } + } + + /* LOGIN PAGE */ + + .ic-flash-info, + .ic-flash-success, + .ic-flash-warning, + .ic-flash-error { + background-color: @surface0; + } + + /* ACCOUNT PAGE */ + th[class$="colHeader"] { + color: @text; + } + .feature-flag-wrapper { + tr span[class$="Text"] { + color: @text; + } + } + + /* CREATOR SIDE */ + /* not prioritized in this userstyle */ + + /* DASHBOARD */ + .unpublished_courses_redesign .ic-DashboardCard__box__header { + background-color: transparent; + border-color: @surface1; + } + /* MODULES */ + .module-publish-icon { + button > span { + background-color: transparent; + } + button:hover > span { + background-color: @hover-button; + } + } + .NewUserTutorialTray__Content > div > * { + border-color: @surface1; + } + .slick-header-column { + background-color: @surface0; + } + .slick-header-column.ui-state-default { + border-color: @surface1; + } + /* PAGES */ + button[class$="tag"] { + background-color: @surface0; + border-color: @surface1; + color: @text; + &:hover { + background-color: @surface1; + } + svg { + fill: @text; + } + } + + /* GRADEBOOK */ + .ui-state-default, + .ui-widget-header { + color: @subtext1; + } + button[data-testid="gradebook-settings-button"] { + .neutral-button(); + } + #gradebook-assignment-search, + #gradebook-student-search { + label span { + color: @subtext1; + } + } + + /* OUTCOMES */ + #outcome_management { + footer { + color: @text; + background-color: @base !important; + } + } + #management > div { + color: @subtext1; + } + .management-panel { + div[data-testid="outcome-group-container"] [class$="view"] { + border-color: @surface1; + } + svg { + fill: @text; + } + } + div[role="separator"] > div { + background-color: @surface0 !important; + } + span[class$="view-heading"], + h2, + h2 > span[class$="text"] { + color: @subtext1; + } + span[class$="billboard__message"], + h3, + h3 > span[class$="text"] { + color: @subtext0; + } + span[class$="billboard"] { + background-color: transparent; + } + + /* DISCUSSIONS */ + /* create discussion page */ + .discussions fieldset span:has(> button[data-testid="save-button"]) { + border-color: @surface1; + } + #manage-assign-to-container div[data-testid="item-assign-to-card"] { + border-color: @surface1; + } + + /* STUDIO */ + #settings_page_wrapper, + #collection_shared_content, + #collection_user_content { + background-color: @base; + span[role="contentinfo"] { + border-color: @surface1; + } + } + .CollectionShow__mediaListWrapper { + img { + background-color: transparent; + } + } + .DefaultLayout__main { + color: @text; + } + h1 { + color: @text; + } + #lti_media_picker { + nav { + background-color: @mantle; + border-block-end-color: @surface0; + } + ul a[class$="Button"] div { + color: @text; + } + li div[class$="topNavBarItem__container"]::after { + background-color: @surface1; + } + } + #media_upload_holder button img { + filter: @text-filter; + } + span[class$="toggleDetails__summary"] > span { + color: @text; + } + div[class$="toggleDetails__details"] { + color: @text; + } + + /* ASSIGNMENT CREATION */ + .page-action-list a { + border-bottom-color: @surface1; + } + + /* EXTENSIONS */ + /* BetterCampus */ + --bcsidebar-selection: @accent; + --bcbackground-0-ungradient: @base; + --bcbackground-0: @base; + --bcbackground-1-ungradient: @surface0; + --bcbackground-1: @surface0; + --bcbackground-2-ungradient: @surface1; + --bcbackground-2: @surface1; + --bcborders-ungradient: @surface0; + --bcborders: @surface0; + --bclinks-ungradient: @blue; + --bclinks: @blue; + --bctext-0-ungradient: @text; + --bctext-0: @text; + --bctext-1-ungradient: @subtext0; + --bctext-1: @subtext0; + --bctext-2-ungradient: @subtext1; + --bctext-2: @subtext1; + --bccards-ungradient: @surface0; + --bccards: @surface0; + --bcshadow: 0 0 10px 0 transparent; + } +} diff --git a/styles/canvas-lms/preview.webp b/styles/canvas-lms/preview.webp deleted file mode 100644 index 7164f62165..0000000000 --- a/styles/canvas-lms/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:1a1985cf2f2066fc5ef3ff25b78d0878fb5916c343d4cb74f9e5d5ff9c1cb420 -size 104552 diff --git a/styles/chatgpt/README.md b/styles/chatgpt/README.md index ccc3aee400..6c52244531 100644 --- a/styles/chatgpt/README.md +++ b/styles/chatgpt/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/chatgpt/catppuccin.user.css b/styles/chatgpt/catppuccin.user.css deleted file mode 100644 index 15caa572a2..0000000000 --- a/styles/chatgpt/catppuccin.user.css +++ /dev/null @@ -1,1232 +0,0 @@ -/* ==UserStyle== -@name ChatGPT Catppuccin -@namespace github.com/catppuccin/userstyles/styles/chatgpt -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/chatgpt -@version 0.3.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/chatgpt/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Achatgpt -@description Soothing pastel theme for ChatGPT -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("chatgpt.com") { - @import url("https://unpkg.com/@catppuccin/highlightjs@0.1.2/css/catppuccin.variables.css"); - - :root.light { - #catppuccin(@lightFlavor, @accentColor); - } - - :root.dark { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - --ctp-rosewater: #rgbify(@rosewater) []; - --ctp-flamingo: #rgbify(@flamingo) []; - --ctp-pink: #rgbify(@pink) []; - --ctp-mauve: #rgbify(@mauve) []; - --ctp-red: #rgbify(@red) []; - --ctp-maroon: #rgbify(@maroon) []; - --ctp-peach: #rgbify(@peach) []; - --ctp-yellow: #rgbify(@yellow) []; - --ctp-green: #rgbify(@green) []; - --ctp-teal: #rgbify(@teal) []; - --ctp-sky: #rgbify(@sky) []; - --ctp-sapphire: #rgbify(@sapphire) []; - --ctp-blue: #rgbify(@blue) []; - --ctp-lavender: #rgbify(@lavender) []; - --ctp-text: #rgbify(@text) []; - --ctp-subtext1: #rgbify(@subtext1) []; - --ctp-subtext0: #rgbify(@subtext0) []; - --ctp-overlay2: #rgbify(@overlay2) []; - --ctp-overlay1: #rgbify(@overlay1) []; - --ctp-overlay0: #rgbify(@overlay0) []; - --ctp-surface2: #rgbify(@surface2) []; - --ctp-surface1: #rgbify(@surface1) []; - --ctp-surface0: #rgbify(@surface0) []; - --ctp-base: #rgbify(@base) []; - --ctp-mantle: #rgbify(@mantle) []; - --ctp-crust: #rgbify(@crust) []; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - code.hljs { - background: none; - } - pre { - .bg-token-main-surface-secondary { - background-color: @surface0; - } - .bg-gray-950 { - background-color: @crust; - } - .text-token-text-secondary { - color: @subtext0; - } - } - - color: @text; - - @white: if(@lookup=latte, @crust, @text); - @black: if(@lookup=latte, @text, @crust); - --white: @white; - --black: @black; - - & when not (@lookup = latte) { - --gray-50: lighten(mix(@text, @subtext0), 5%); - --gray-100: @text; - --gray-200: @subtext1; - --gray-300: @overlay2; - --gray-400: @overlay0; - --gray-500: @surface2; - --gray-600: @surface1; - --gray-700: @surface0; - --gray-800: @base; - --gray-900: @mantle; - --gray-950: @crust; - --brand-purple: @accent-color; - --text-primary: var(--gray-100) !important; - --text-secondary: var(--gray-200) !important; - --text-tertiary: var(--gray-300) !important; - --text-quaternary: var(--gray-500) !important; - --main-surface-primary: var(--gray-800) !important; - --main-surface-secondary: var(--gray-700) !important; - --main-surface-tertiary: var(--gray-600) !important; - --sidebar-surface-primary: var(--gray-900); - --sidebar-surface-secondary: var(--gray-800); - --sidebar-surface-tertiary: var(--gray-700); - .popover, - .dark .popover, - .dark.popover, - .popover .dark { - --main-surface-primary: var(--gray-700) !important; - --main-surface-secondary: var(--gray-600) !important; - --main-surface-tertiary: var(--gray-500) !important; - --text-primary: var(--white) !important; - --text-secondary: var(--gray-200) !important; - --text-tertiary: var(--gray-300) !important; - } - } - & when (@lookup = latte) { - --gray-50: @crust; - --gray-100: @mantle; - --gray-200: @base; - --gray-300: @surface0; - --gray-400: @surface1; - --gray-500: @surface2; - --gray-600: @overlay0; - --gray-700: @overlay1; - --gray-800: @subtext0; - --gray-900: @subtext1; - --gray-950: @text; - --brand-purple: @accent-color; - --text-primary: var(--gray-950); - --text-secondary: var(--gray-600); - --text-tertiary: var(--gray-400); - --text-quaternary: var(--gray-300); - --main-surface-primary: var(--gray-200); - --main-surface-secondary: var(--gray-100); - --main-surface-tertiary: var(--gray-50); - --sidebar-surface-primary: var(--gray-100); - --sidebar-surface-secondary: var(--gray-200); - --sidebar-surface-tertiary: var(--gray-300); - .popover, - .dark .popover, - .dark.popover, - .popover .dark { - --main-surface-primary: var(--gray-200) !important; - --main-surface-secondary: var(--gray-100) !important; - --main-surface-tertiary: var(--gray-50) !important; - --text-primary: var(--gray-950) !important; - --text-secondary: var(--gray-600) !important; - --text-tertiary: var(--gray-500) !important; - } - } - - --border-light: fade(@text, 10%); - --border-medium: fade(@text, 15%); - --border-heavy: fade(@text, 20%); - --border-xheavy: fade(@text, 25%); - --link: @accent-color; - --link-hover: if( - @lookup = latte, - lighten(@accent-color, 10%), - darken(@accent-color, 10%) - ); - - *:focus { - --tw-ring-offset-color: @base; - --tw-ring-color: @accent-color; - } - - /* ChatGPT logo */ - [style*="background-color: rgb(25, 195, 125);"] { - background-color: @green !important; - color: @base !important; - } - - /* Input */ - - select { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml;@{svg}"); - } - - [multiple], - [type="date"], - [type="datetime-local"], - [type="email"], - [type="month"], - [type="number"], - [type="password"], - [type="search"], - [type="tel"], - [type="text"], - [type="time"], - [type="url"], - [type="week"], - select, - textarea { - background-color: @base; - border-color: @overlay2; - } - - [type="checkbox"], - [type="radio"] { - background-color: @base; - border-color: @overlay2; - color: @accent-color; - } - - .form-input, - .form-multiselect, - .form-select, - .form-textarea { - background-color: @base; - border-color: @overlay2; - } - - .form-input:focus, - .form-multiselect:focus, - .form-select:focus, - .form-textarea:focus { - border-color: @accent-color; - } - - .form-input::placeholder, - .form-textarea::placeholder { - color: @overlay2; - } - - /* Buttons */ - - .btn-primary, - .btn-green { - background-color: @accent-color; - color: @base; - - &:hover { - background-color: darken(@accent-color, 10%); - } - - &:focus-visible { - --tw-ring-color: darken(@accent-color, 10%) !important; - } - } - - .btn-danger { - background-color: @red; - color: @base; - - &:hover:not(:disabled) { - background-color: darken(@red, 10%); - } - - &.focus-visible, - &:focus-visible { - --tw-ring-color: darken(@red, 10%) !important; - } - } - - .btn-danger-outline { - border-color: @red; - color: @red; - - &.focus-visible, - &:focus-visible { - --tw-ring-color: lighten(@red, 10%) !important; - } - } - - .btn-neutral { - &.focus-visible, - &:focus-visible { - --tw-ring-color: @overlay0 !important; - } - } - - .btn-dark { - background-color: @surface0; - border-color: @overlay0; - color: @text; - - &:hover { - background-color: @surface1; - } - } - - .btn-light { - background-color: @overlay1; - color: @black; - - &:hover { - background-color: @overlay0; - } - } - - .btn-disabled, - .btn-disabled:hover { - background-color: @text; - } - - /* Borders */ - - .border-black, - .border-black\/10, - .border-black\/20, - .border-black\/30, - .border-black\/5 { - border-color: var(--border-light); - } - - .border-gray-100 { - border-color: var(--gray-100); - } - - .border-gray-200 { - border-color: var(--gray-200); - } - - .border-gray-300 { - border-color: var(--gray-300); - } - - .border-gray-400 { - border-color: var(--gray-400); - } - - .border-gray-500 { - border-color: var(--gray-500); - } - - .border-gray-700 { - border-color: var(--gray-700); - } - - .border-gray-950 { - border-color: var(--gray-950); - } - - .border-green-500 { - border-color: lighten(@green, 10%); - } - - .border-green-600 { - border-color: @green; - } - - .border-orange-400 { - border-color: lighten(mix(@red, @yellow), 10%); - } - - .border-orange-500 { - border-color: mix(@red, @yellow); - } - - .border-red-500 { - border-color: darken(@red, 10%); - } - - .border-white { - border-color: @white; - } - - .border-white\/20 { - border-color: fade(@white, 20%); - } - - .border-t-[\#0077FF] { - border-top-color: @blue; - } - - /* Backgrounds */ - .bg-token-main-surface-primary { - background-color: var(--main-surface-primary); - } - - .\!bg-brand-purple { - background-color: @accent-color !important; - } - - .\!bg-gray-200 { - background-color: var(--gray-200) !important; - } - - .btn-blue { - background-color: @blue; - color: @crust; - - &:hover { - background-color: darken(@blue, 5%); - } - } - - .bg-[\#0077FF], - .bg-\[\#3C46FF\], - .bg-[\#3C46FF], - .bg-[\#4046EC] { - background-color: @blue; - } - - .hover\:bg-\[\#0000FF\]:hover { - background-color: darken(@blue, 5%); - } - - .bg-[\#10A37F] { - background-color: @green; - } - - .bg-[\#B161FD] { - background-color: @accent-color; - } - - .bg-[\#F8CA27] { - background-color: @yellow; - } - - .bg-[\#FF5588] { - background-color: mix(@red, @pink); - } - - .bg-[\#FF6E3C] { - background-color: saturate(mix(@red, @yellow), 10%); - } - .dark\:radix-highlighted\:bg-\[\#2E2F33\][data-highlighted] { - background-color: @surface0; - } - - .bg-black { - background-color: @black; - } - - .bg-black\/20 { - background-color: fade(@black, 20%); - } - - .bg-black\/5 { - background-color: fade(@black, 5%); - } - - .bg-black\/50 { - background-color: fade(@black, 50%); - } - - .bg-black\/90 { - background-color: fade(@black, 90%); - } - - .bg-black\/\[\.04\] { - background-color: fade(@black, 4%); - } - - .bg-black\/\[\.08\] { - background-color: fade(@black, 8%); - } - - .bg-black\/\[\.12\] { - background-color: fade(@black, 12%); - } - - .bg-blue-100 { - background-color: lighten(@blue, 30%); - } - - .bg-blue-200 { - background-color: lighten(@blue, 20%); - } - - .bg-blue-300 { - background-color: lighten(@blue, 10%); - } - - .bg-blue-400 { - background-color: @blue; - } - - .bg-blue-500 { - background-color: darken(@blue, 5%); - } - - .bg-blue-700 { - background-color: darken(@blue, 10%); - } - - .hover\:bg-blue-700:hover { - background-color: darken(@blue, 15%); - } - - .bg-brand-blue-800 { - background-color: darken(@blue, 10%); - } - - .bg-blue-950 { - background-color: darken(@blue, 30%); - } - - .checked\:bg-blue-600:checked { - background-color: @accent-color; - } - - .bg-brand-green { - background-color: lighten(@green, 10%); - } - - .bg-brand-green\/20 { - background-color: fade(lighten(@green, 10%), 20%); - } - - .bg-brand-green\/40 { - background-color: fade(lighten(@green, 10%), 40%); - } - - .bg-brand-purple { - background-color: @accent-color; - } - - .bg-gray-100 { - background-color: var(--gray-100); - } - - .bg-gray-200 { - background-color: var(--gray-200); - } - - .bg-gray-300 { - background-color: var(--gray-300); - } - - .bg-gray-400 { - background-color: var(--gray-400); - } - - .bg-gray-50 { - background-color: var(--gray-50); - } - - .bg-gray-500 { - background-color: var(--gray-500); - } - - .bg-gray-600 { - background-color: var(--gray-600); - } - - .bg-gray-700 { - background-color: var(--gray-700); - } - - .bg-gray-900 { - background-color: var(--gray-900); - } - - .bg-gray-950 { - background-color: var(--gray-950); - } - - .bg-green-100 { - background-color: lighten(@green, 30%); - } - - .bg-green-200 { - background-color: lighten(@green, 20%); - } - - .bg-green-500 { - background-color: lighten(@green, 10%); - } - - .bg-green-500\/10 { - background-color: fade(lighten(@green, 10%), 10%); - } - - .bg-green-600 { - background-color: @green; - } - - .bg-orange-500 { - background-color: mix(@yellow, @red); - } - - .bg-orange-500\/10 { - background-color: fade(mix(@yellow, @red), 10%); - } - - .bg-red-100 { - background-color: fade(lighten(@red, 10%), 30%); - } - - .bg-red-200 { - background-color: lighten(@red, 20%); - } - - .bg-red-500 { - background-color: @red; - } - - .bg-red-500\/10 { - background-color: fade(@red, 10%); - } - - .bg-red-600 { - background-color: lighten(@red, 10%); - } - - .bg-white { - background-color: @white; - } - - .bg-white\/20 { - background-color: fade(@white, 20%); - } - - .bg-white\/25 { - background-color: fade(@white, 25%); - } - - .bg-yellow-100 { - background-color: lighten(@yellow, 20%); - } - - .bg-yellow-200 { - background-color: lighten(@yellow, 10%); - } - - .bg-yellow-400 { - background-color: @yellow; - } - - .bg-yellow-500 { - background-color: darken(@yellow, 10%); - } - - .radix-state-checked\:\!bg-green-600[data-state="checked"] { - background-color: @accent-color !important; - } - - .dark\:radix-state-checked\:border-green-600[data-state="checked"]:is( - .dark * - ) { - border-color: @accent-color; - } - - [class*="bg-transparent"] { - background-color: transparent; - } - - /* Gradients */ - - .from-white { - --tw-gradient-from: @base var(--tw-gradient-from-position); - } - - /* Fill/stroke */ - - .fill-yellow-500 { - fill: @yellow; - } - - .stroke-black { - stroke: @black; - } - - .stroke-brand-purple\/25 { - stroke: fade(@accent-color, 25%); - } - - .stroke-gray-400 { - stroke: @subtext0; - } - - /* Text */ - - .\!text-black { - color: @black !important; - } - - .text-\[\#FE7600\] { - color: mix(@yellow, @red); - } - - .text-\[\#fff\] { - color: @base; - } - - .text-black { - color: @black; - } - - .text-black\/60 { - color: fade(@black, 60%); - } - - .text-black\/70 { - color: fade(@black, 70%); - } - - .text-blue-500 { - color: lighten(@blue, 10%); - } - - .text-blue-600 { - color: @blue; - } - - .text-brand-blue-800 { - color: @blue; - } - - .text-brand-purple { - color: @accent-color; - } - - .text-gray-100 { - color: var(--gray-100); - } - - .text-gray-300 { - color: var(--gray-300); - } - - .text-gray-400 { - color: var(--gray-400); - } - - .text-gray-500 { - color: var(--gray-500); - } - - .text-gray-600 { - color: var(--gray-600); - } - - .text-gray-700 { - color: var(--gray-700); - } - - .text-gray-800 { - color: var(--gray-800); - } - - .text-gray-900 { - color: var(--gray-900); - } - - .text-green-500 { - color: lighten(@green, 10%); - } - - .text-green-600 { - color: @green; - } - - .text-green-700 { - color: darken(@green, 10%); - } - - .text-green-800 { - color: darken(@green, 20%); - } - - .text-green-900 { - color: darken(@green, 30%); - } - - .text-orange-300 { - color: lighten(mix(@yellow, @red), 15%); - } - - .text-orange-400 { - color: lighten(mix(@yellow, @red), 10%); - } - - .text-orange-500 { - color: mix(@yellow, @red); - } - - .text-red-500 { - color: @red; - } - - .text-red-600 { - color: lighten(@red, 10%); - } - - .text-red-700 { - color: @red; - } - - .text-red-800 { - color: darken(@red, 10%); - } - - .text-token-text-error { - --text-error: @red; - } - - .text-white { - color: @white; - } - - .text-white\/25 { - color: fade(@white, 25%); - } - - .text-white\/50 { - color: fade(@white, 50%); - } - - .text-white\/80 { - color: fade(@white, 80%); - } - - .text-yellow-500 { - color: @yellow; - } - - .text-yellow-700 { - color: darken(@yellow, 10%); - } - - .text-yellow-800 { - color: darken(@yellow, 20%); - } - - .text-yellow-900 { - color: darken(@yellow, 30%); - } - - /* Dark mode overrides */ - /* stylelint-disable-next-line no-duplicate-selectors */ - & when not (@lookup = latte) { - .dark\:bg-black { - background-color: @black; - } - - .dark\:bg-white { - background-color: @white; - } - - .dark\:bg-gray-700 { - background-color: var(--gray-700); - } - - /* "Was this response better or worse" dialog button hover */ - .dark\:hover\:bg-gray-800:hover { - background-color: transparent; - } - - .dark\:text-white { - color: @white; - } - - .dark\:text-black { - color: @black; - } - - /* Chat suggestions on new chat page */ - .dark\:text-gray-500 { - color: var(--gray-300); - } - - .dark\:text-\[\#D292FF\] { - color: @mauve; - } - - .dark\:focus\:border-white:focus { - border-color: @text; - } - - .dark\:border-gray-700 { - border-color: var(--gray-700); - } - - /* Up arrow send message button */ - .disabled\:dark\:bg-token-text-quaternary:is(.dark *):disabled { - background-color: var(--text-quaternary); - } - .dark\:disabled\:text-token-main-surface-secondary:disabled:is(.dark *) { - color: var(--main-surface-secondary); - } - } - - /* Other */ - - .ring-black { - --tw-ring-color: @black; - } - - .ring-black\/10 { - --tw-ring-color: fade(@black, 10%); - } - - .ring-white { - --tw-ring-color: @base; - } - - .ring-offset-black { - --tw-ring-offset-color: @base; - } - - /* Invalid LaTeX expressions */ - [style*="color: rgb(204, 0, 0)"] { - color: @red; - } - - /* Circle around OpenAI logo in center of chat */ - .gizmo-shadow-stroke::after { - --tw-shadow: inset 0 0 0 1px @surface0; - } - - .katex-error { - color: @red !important; - } - - [style="background-color: rgb(0, 0, 46);"], - [style="background-color: rgb(255, 255, 219);"] { - background-color: @crust !important; - } - - /* Icon colors for chat suggestion icons on new chat page */ - svg[style="color: rgb(203, 139, 208);"] { - color: @pink !important; - } - svg[style="color: rgb(226, 197, 65);"] { - color: @yellow !important; - } - svg[style="color: rgb(118, 208, 235);"] { - color: @teal !important; - } - svg[style="color: rgb(237, 98, 98);"] { - color: @red !important; - } - } -} - -@-moz-document domain("auth.openai.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - color: @text; - caret-color: @text; - - a { - color: @accent-color; - } - - body, - .oai-header, - .login-container { - background-color: @base; - } - - .oai-header img { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - background-color: transparent; - } - - .title { - color: @text; - } - - .email-input { - background-color: @base; - border-color: @surface0; - color: @text; - - &:focus, - &:valid { - border-color: @accent-color; - - + .email-label { - color: @accent-color; - background-color: @base; - } - } - } - .email-label { - background-color: @base; - color: @subtext0; - } - - .continue-btn { - background-color: @accent-color; - color: @base; - } - - .divider-wrapper { - &::before, - &::after { - border-bottom-color: @surface2; - } - } - - .social-btn { - background-color: @mantle; - border-color: @surface0; - color: @text; - } - - @orange: mix(@red, @yellow); - - img[alt="Google logo"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - img[alt="Microsoft logo"] { - @svg: escape( - '' - ); - - content: url("data:image/svg+xml,@{svg}"); - } - img[alt="Apple logo"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - } -} - -@-moz-document domain("auth0.openai.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - --primary-color: @accent-color; - --primary-color-no-override: @accent-color; - --action-primary-color: @accent-color; - --link-color: @accent-color; - --page-background-color: @base; - --info-color: @blue; - --success-color: @green; - --error-color: @red; - --error-text-color: @text; - --warning-color: @yellow; - --button-font-color: @text; - --widget-background-color: @base; - --presentational-content-color: @overlay2; - --gray-lightest: @base; - --gray-light: @crust; - --gray-mid: @surface0; - --gray-mid-dark: @surface1; - --gray-dark: @overlay2; - --gray-darkest: @text; - --gray-social-border: @surface0; - - ._button-login-password, - ._button-login-id { - background-color: @accent-color; - color: @base; - } - - .password-icon-tooltip { - background-color: @text; - - &::before { - border-top-color: @text; - } - } - - .oai-header svg { - fill: @text; - } - - @orange: mix(@red, @yellow); - - button > span { - &[data-provider^="google"] { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml;charset=utf-8,@{svg}"); - } - &[data-provider^="windowslive"] { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml;charset=utf-8,@{svg}"); - } - &[data-provider^="apple"] { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml;charset=utf-8,@{svg}"); - } - } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/chatgpt/catppuccin.user.less b/styles/chatgpt/catppuccin.user.less new file mode 100644 index 0000000000..98dedf0f68 --- /dev/null +++ b/styles/chatgpt/catppuccin.user.less @@ -0,0 +1,242 @@ +/* ==UserStyle== +@name ChatGPT Catppuccin +@namespace github.com/catppuccin/userstyles/styles/chatgpt +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/chatgpt +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/chatgpt/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Achatgpt +@description Soothing pastel theme for ChatGPT +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("chatgpt.com") { + // TODO: Codemirror syntax highlighting. + + .light { + #catppuccin(@lightFlavor); + } + + .dark { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + * { + --text-primary: @text; + --text-secondary: @subtext1; + --text-tertiary: @subtext0; + --text-quaternary: @overlay2; + --bg-primary: @base; + --bg-secondary: @surface0; + --bg-tertiary: @surface1; + + --bg-secondary-surface: @mantle; // sidebar + + --bg-elevated-primary: @base; // settings main panel + --bg-elevated-secondary: @mantle; + + --bg-tooltip: @crust; + + --main-surface-primary: @base; + --main-surface-secondary: @surface0; + --main-surface-tertiary: @surface1; + --interactive-bg-secondary-hover: @surface1; + --interactive-bg-secondary-press: @surface0; + + --interactive-label-accent-default: @accent; // some dropdowns in settings + + --border-light: @surface0; + --border-default: @surface1; + --border-medium: @surface2; + --interactive-border-focus: @overlay0; + + --theme-user-msg-bg: @surface0; + --theme-user-msg-text: @text; + --theme-submit-btn-bg: @accent; + --theme-submit-btn-text: @base; + + --theme-secondary-btn-bg: @surface1; + --theme-secondary-btn-text: @text; + + --sidebar-surface: @mantle; // modal backgrounds + --sidebar-surface-primary: @mantle; // syntax highlighted code block backgrounds + + --surface-hover: @surface0; // some button hovers + + --icon-tertiary: @overlay2; + + --text-status-error: @red; + + // chat input prompt border + --shadow-color-1: fade(@mantle, 50%); + --shadow-color-2: fade(@text, 80%); + + .__menu-item[data-sidebar-item] { + --menu-item-highlighted: @surface0; + } + + .__menu-item[data-color="danger"] { + --menu-item-highlighted: fade(@red, 20%); + --menu-item-active: fade(@red, 30%); + --menu-item-open: fade(@red, 30%); + } + + /* Markdown */ + + /* Inline code */ + code:not(pre > code) { + background-color: @surface0; + } + + code[class*="language-"], + pre[class*="language-"], + code.hljs { + color: @text !important; + } + + /* Components */ + + .btn-primary { + background-color: @text; + color: @base; + } + + .btn-purple { + color: @base; + background-color: @accent; + + &:hover { + background-color: lighten(@accent, 5%); + } + + &:focus, &:active { + background-color: darken(@accent, 5%); + } + } + + .btn-danger-outline { + color: @red; + border-color: @red; + } + + .btn-ghost { + &:not(:disabled) { + &:hover { + background-color: @surface0; + } + } + } + + /* Dark Overrides */ + .bg-token-bg-primary { + background-color: var(--bg-primary); + } + .bg-token-main-surface-primary { + background-color: var(--main-surface-primary); + } + .bg-token-sidebar-surface { + background-color: var(--sidebar-surface); + } + + /* Tailwind Utilities */ + .__tailwind-utility(@color, @shade, @value) { + .text-@{color}-@{shade}, + .dark\:text-@{color}-@{shade} { + color: @value; + } + .bg-@{color}-@{shade}, + .dark\:bg-@{color}-@{shade} { + background-color: @value; + } + .border-@{color}-@{shade} { + border-color: @value; + } + .radix-state-checked\:bg-@{color}-@{shade}[data-state="checked"] { + background-color: @value; + } + } + + .__tailwind-utility(green, 600, @green); // confirmation toasts + .__tailwind-utility(red, 500, @red); // failure toasts + .__tailwind-utility(blue, 400, @accent); // toggled checkmarks + .__tailwind-utility(gray, 600, @overlay0); // untoggled checkmarks + .__tailwind-utility(gray, 500, @overlay2); // faint text in/and dividers + + .text-white { + color: @base; + } + + .bg-black { + background-color: @mantle; + } + } + } +} + +@-moz-document domain("auth.openai.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + color: @text; + + background-color: @base; + --main-page-background: @base; + + // Logo + a[href="https://chatgpt.com"] > svg { + filter: @text-filter; + } + + --text-primary: @text; + --text-secondary: @subtext1; + --text-tertiary: @subtext0; + --text-placeholder: @subtext0; // form field labels above the input (e.g. "Email" and "Password") + + --accent-blue: @accent; + --link: @accent; + + --border-medium: @surface2; + + --button-primary-background: @text; + --button-primary-hover: @subtext1; + --button-text-on-primary: @base; + + --button-outline-hover: @surface0; + + --gray-100: @surface2; // divider lines + + input { + color: @text; + } + + [class*="_toggleVisibilityButton"]:where(:hover, :focus-visible)::before { + background-color: @surface0; + } + + [data-overlay-container] [class*="_tooltip"] { + --tooltip-background-color: @mantle !important; + --tooltip-color: @text !important; + } + } +} diff --git a/styles/chatgpt/preview.webp b/styles/chatgpt/preview.webp deleted file mode 100644 index a003bace3b..0000000000 --- a/styles/chatgpt/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:43e822e5ce7a62a4e99e4c920b3894d7e94ec6469254687dcb3f61ce8898cc96 -size 72220 diff --git a/styles/chatreplay/README.md b/styles/chatreplay/README.md index 195aae5929..575a88c34b 100644 --- a/styles/chatreplay/README.md +++ b/styles/chatreplay/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/chatreplay/catppuccin.user.css b/styles/chatreplay/catppuccin.user.css deleted file mode 100644 index e97ebf6b62..0000000000 --- a/styles/chatreplay/catppuccin.user.css +++ /dev/null @@ -1,217 +0,0 @@ -/* ==UserStyle== -@name ChatReplay Catppuccin -@namespace github.com/catppuccin/userstyles/styles/chatreplay -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/chatreplay -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/chatreplay/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Achatreplay -@description Soothing pastel theme for ChatReplay -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] - -@var range bg-opacity "Background Opacity" [0.2 , -0.05 , 1 , 0.05] -@var range bg-blur "Background Blur" [20, 0, 100, 1, 'px'] -==/UserStyle== */ - -@-moz-document domain("chatreplay.stream") { - :root[dark] #chat-container { - #catppuccin(@darkFlavor, @accentColor, chat); - } - :root #chat-container { - #catppuccin(@lightFlavor, @accentColor, chat); - } - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor, base); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor, base); - } - } - - /* prettier-ignore */ - @catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; - } - - #catppuccin(@lookup, @accent, @platform) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - & when (@platform = chat) { - a:not(.username), - i { - color: @accent-color; - } - color: @text; - --text-color: @text; - --timestamp-color: @subtext1; - --bg-color: @base; - --bg-color-transparent: fade(@base, 10%); - --settings-bg-color: @mantle; - --btn-bg-color: @surface0; - --bg-color-highlight: @surface0; - --scrollbar-thumb: @surface0; - --btn-hover-bg: @surface1; - --link-color: @accent-color; - --border-color: @surface0; - --settings-shadow: 0 4px 8px rgba(@crust, 0.4), 0 0 4px rgba(@crust, 0.4); - .message-notice { - border-left-color: @accent-color; - } - .message--highlighted a { - color: @accent-color; - } - .message--highlighted { - background: @accent-color; - border-color: @accent-color; - color: @base; - text-shadow: none; - } - .red-dot::after { - background: @red; - } - &[overlay] { - --bg-color: rgba(@base, var(--overlay-opacity)); - --bg-color-highlight: rgba( - @base, - max(0.4, calc(var(--overlay-opacity) * 1.2)) - ); - --text-shadow: -1px -1px 0px @base, 0px -1px 0px @base, - 1px -1px 0px @base, -1px 0px 0px @base, 1px 0px 0px @base, - -1px 1px 0px @base, 0px 1px 0px @base, 1px 1px 0px @base; - --text-color: @text; - } - .resume-scroll { - background-color: @surface0; - } - } - @keyframes rotating { - 0% { - transform: rotate(0); - } - - 100% { - transform: rotate(360deg); - scale: 1.5; - fill: @red; - } - } - - & when (@platform = base) { - background-color: @base; - color: @text; - - body { - color: @text; - } - .card { - background: fade(@crust, 80%); - } - .card.c1cw4bqg.c1cw4bqg { - color: @subtext0; - } - a, - i { - color: @accent-color; - } - button.gradient, - .btn.gradient { - background: linear-gradient( - 45deg, - @accent-color, - spin(@accent-color, 45) - ); - color: @base; - text-shadow: none; - } - button:not(.custom), - .btn { - background: @surface0; - text-shadow: none; - color: @text; - } - .item.zmyc33:hover, - .item.active.zmyc33 { - background-color: @surface0; - } - .video-title.damcrq, - .logo-text.c1j5psx1.c1j5psx1 { - color: @text; - } - [d="M 4,0 1,3 v 10 h 4 v 3 l 3,-3 h 2 L 15,8 V 0 Z m 10,7 -3,3 H 9 L 7,12 V 10 H 5 V 1 h 9 z"], - [d="m 8.5,3 3,2 -3,2 z"] { - fill: @accent-color; - } - [d="m 4,1 h 10 v 7 l -4,4 H 4 Z"] { - fill: @base; - } - .delete.c19loos5.c19loos5 { - border-color: @red; - } - .mark.z8oy0d.z8oy0d { - background: @accent-color; - color: @base; - } - .bg.c1ejz165.c1ejz165 { - opacity: @bg-opacity; - filter: blur(@bg-blur); - } - // .topbar-container.c1j5psx1.c1j5psx1 { - // border-bottom: none; - // } - #inner-a.tmgko.tmgko { - background: @mantle; - } - } - } -} -// vim:ft=less diff --git a/styles/chatreplay/catppuccin.user.less b/styles/chatreplay/catppuccin.user.less new file mode 100644 index 0000000000..fad9fbfedd --- /dev/null +++ b/styles/chatreplay/catppuccin.user.less @@ -0,0 +1,171 @@ +/* ==UserStyle== +@name ChatReplay Catppuccin +@namespace github.com/catppuccin/userstyles/styles/chatreplay +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/chatreplay +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/chatreplay/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Achatreplay +@description Soothing pastel theme for ChatReplay +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] + +@var range bg-opacity "Background Opacity" [0.2 , -0.05 , 1 , 0.05] +@var range bg-blur "Background Blur" [20, 0, 100, 1, 'px'] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("chatreplay.stream") { + :root[dark] #chat-container { + #catppuccin(@darkFlavor, chat); + } + :root #chat-container { + #catppuccin(@lightFlavor, chat); + } + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor, base); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor, base); + } + } + + #catppuccin(@flavor, @platform) { + #lib.palette(); + #lib.defaults(); + + & when (@platform = chat) { + a:not(.username), + i { + color: @accent; + } + color: @text; + --text-color: @text; + --timestamp-color: @subtext1; + --bg-color: @base; + --bg-color-transparent: fade(@base, 10%); + --settings-bg-color: @mantle; + --btn-bg-color: @surface0; + --bg-color-highlight: @surface0; + --scrollbar-thumb: @surface0; + --btn-hover-bg: @surface1; + --link-color: @accent; + --border-color: @surface0; + --settings-shadow: 0 4px 8px fade(@crust, 40%), 0 0 4px fade(@crust, 40%); + .message-notice { + border-left-color: @accent; + } + .message--highlighted a { + color: @accent; + } + .message--highlighted { + background: @accent; + border-color: @accent; + color: @base; + text-shadow: none; + } + .red-dot::after { + background: @red; + } + &[overlay] { + --bg-color: rgba(@base, var(--overlay-opacity)); + --bg-color-highlight: rgba( + @base, + max(0.4, calc(var(--overlay-opacity) * 1.2)) + ); + --text-shadow: + -1px -1px 0px @base, 0px -1px 0px @base, 1px -1px 0px @base, -1px 0px + 0px @base, 1px 0px 0px @base, -1px 1px 0px @base, 0px 1px 0px @base, + 1px 1px 0px @base; + --text-color: @text; + } + .resume-scroll { + background-color: @surface0; + } + } + @keyframes rotating { + 0% { + transform: rotate(0); + } + + 100% { + transform: rotate(360deg); + scale: 1.5; + fill: @red; + } + } + + & when (@platform = base) { + background-color: @base; + color: @text; + + body { + color: @text; + } + .card { + background: fade(@crust, 80%); + } + .card.c1cw4bqg.c1cw4bqg { + color: @subtext0; + } + a, + i { + color: @accent; + } + button.gradient, + .btn.gradient { + background: linear-gradient( + 45deg, + @accent, + spin(@accent, 45) + ); + color: @base; + text-shadow: none; + } + button:not(.custom), + .btn { + background: @surface0; + text-shadow: none; + color: @text; + } + .item.zmyc33:hover, + .item.active.zmyc33 { + background-color: @surface0; + } + .video-title.damcrq, + .logo-text.c1j5psx1.c1j5psx1 { + color: @text; + } + [d="M 4,0 1,3 v 10 h 4 v 3 l 3,-3 h 2 L 15,8 V 0 Z m 10,7 -3,3 H 9 L 7,12 V 10 H 5 V 1 h 9 z"], + [d="m 8.5,3 3,2 -3,2 z"] { + fill: @accent; + } + [d="m 4,1 h 10 v 7 l -4,4 H 4 Z"] { + fill: @base; + } + .delete.c19loos5.c19loos5 { + border-color: @red; + } + .mark.z8oy0d.z8oy0d { + background: @accent; + color: @base; + } + .bg.c1ejz165.c1ejz165 { + opacity: @bg-opacity; + filter: blur(@bg-blur); + } + // .topbar-container.c1j5psx1.c1j5psx1 { + // border-bottom: none; + // } + #inner-a.tmgko.tmgko { + background: @mantle; + } + } + } +} diff --git a/styles/chatreplay/preview.webp b/styles/chatreplay/preview.webp deleted file mode 100644 index 777b2920fb..0000000000 --- a/styles/chatreplay/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:9a2f4d528c7d7629767c5aad2ce7394a8afcbb0137e7da581ff5aca5a2d8557d -size 1148418 diff --git a/styles/chess.com/README.md b/styles/chess.com/README.md index 6b61b5881b..beae41cc0c 100644 --- a/styles/chess.com/README.md +++ b/styles/chess.com/README.md @@ -10,21 +10,20 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## ๐Ÿ’ Current Maintainer +- [uncenter](https://github.com/uncenter) ## ๐Ÿ’– Past Maintainers -- [skele](https://github.com/skelebro1) -- [Isabel](https://github.com/isabelroses) +- [skelebro1](https://github.com/skelebro1) +- [isabelroses](https://github.com/isabelroses) - [coldenate](https://github.com/coldenate)   diff --git a/styles/chess.com/assets/base/b/bb.png b/styles/chess.com/assets/base/b/bb.png deleted file mode 100644 index fcf4c29084..0000000000 --- a/styles/chess.com/assets/base/b/bb.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:17f3966c1ebe4c53ea448e4a46ed2ba119a1fac123732ae5eb1bb5df73cec348 -size 1395 diff --git a/styles/chess.com/assets/base/b/bk.png b/styles/chess.com/assets/base/b/bk.png deleted file mode 100644 index 316f437e87..0000000000 --- a/styles/chess.com/assets/base/b/bk.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:19962633023e6c23cff4d2dbb74791ad80396a0456f9c8321b5e045c040ad3e1 -size 1453 diff --git a/styles/chess.com/assets/base/b/bn.png b/styles/chess.com/assets/base/b/bn.png deleted file mode 100644 index 244524a07a..0000000000 --- a/styles/chess.com/assets/base/b/bn.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:b592d594ec7980e44ab3a55b9e2a37a4d0d909b6efc7c7c408534c6096d0b768 -size 1563 diff --git a/styles/chess.com/assets/base/b/bp.png b/styles/chess.com/assets/base/b/bp.png deleted file mode 100644 index 964a6e05f3..0000000000 --- a/styles/chess.com/assets/base/b/bp.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:1004722f7697c28779a4ccec503c3452a2515478f9b563cf991a8ecd9b971a5e -size 1168 diff --git a/styles/chess.com/assets/base/b/bq.png b/styles/chess.com/assets/base/b/bq.png deleted file mode 100644 index 6d86f98ad1..0000000000 --- a/styles/chess.com/assets/base/b/bq.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:91daa3ecc466f723cd9ce698c1e463de32e652c9d7f83dfcc26e8a1c42130c76 -size 1901 diff --git a/styles/chess.com/assets/base/b/br.png b/styles/chess.com/assets/base/b/br.png deleted file mode 100644 index a007aa1e18..0000000000 --- a/styles/chess.com/assets/base/b/br.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:4e5cf795f5c4f6dbc2dee061981b0276d2f2e977fabadc3669a384e8b996c6ac -size 1303 diff --git a/styles/chess.com/assets/base/board.png b/styles/chess.com/assets/base/board.png deleted file mode 100644 index 81537ada2e..0000000000 --- a/styles/chess.com/assets/base/board.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d9f70b1ce1add395a8e96ef86eb5c89d19f81724b66adff1a7fd4fb8bfb3db6f -size 848 diff --git a/styles/chess.com/assets/base/colorboard.png b/styles/chess.com/assets/base/colorboard.png deleted file mode 100644 index 58d3696ab1..0000000000 --- a/styles/chess.com/assets/base/colorboard.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:0b4044fb478a75ab6e7f42965f2501c690628293ee9da4c74c01fa0db961312e -size 3299 diff --git a/styles/chess.com/assets/base/w/wb.png b/styles/chess.com/assets/base/w/wb.png deleted file mode 100644 index 9263f9e74d..0000000000 --- a/styles/chess.com/assets/base/w/wb.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:02ae27a6bda80a3e1d556f272f0673a2382b07fc1a2ce91c0d340bef30a52d3e -size 1643 diff --git a/styles/chess.com/assets/base/w/wk.png b/styles/chess.com/assets/base/w/wk.png deleted file mode 100644 index b462d31024..0000000000 --- a/styles/chess.com/assets/base/w/wk.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ff7e0abfd0ed4cb50f07a15716d8bd67c2f19b3a94361eebcd79895ac7ad0e78 -size 1707 diff --git a/styles/chess.com/assets/base/w/wn.png b/styles/chess.com/assets/base/w/wn.png deleted file mode 100644 index 8f34bfd8d4..0000000000 --- a/styles/chess.com/assets/base/w/wn.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:70e80ab4cd34373f354fb46e0d42dd223652ffaa1bc216581a230f6c5eadda4e -size 1682 diff --git a/styles/chess.com/assets/base/w/wp.png b/styles/chess.com/assets/base/w/wp.png deleted file mode 100644 index e7b5698879..0000000000 --- a/styles/chess.com/assets/base/w/wp.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:e701753136fe460125bb1edf2d5746cae16387c0c3e8d934b14616202dbfc64e -size 1183 diff --git a/styles/chess.com/assets/base/w/wq.png b/styles/chess.com/assets/base/w/wq.png deleted file mode 100644 index bfbb71c170..0000000000 --- a/styles/chess.com/assets/base/w/wq.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:55a19926673f15637881e2b16c4a34d473ade9e4eebeb804c93f4afbe5c346ba -size 2171 diff --git a/styles/chess.com/assets/base/w/wr.png b/styles/chess.com/assets/base/w/wr.png deleted file mode 100644 index 0a754f318f..0000000000 --- a/styles/chess.com/assets/base/w/wr.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:bde0be75f74114eb1ffe781ec15d999ecc318b30e51e8e4c1933c192428c054c -size 1490 diff --git a/styles/chess.com/assets/frappe/b/bb.png b/styles/chess.com/assets/frappe/b/bb.png deleted file mode 100644 index 6289170102..0000000000 --- a/styles/chess.com/assets/frappe/b/bb.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:23fb1dc34abdd37519f2599a9fb629d7058c145acad996b2d87cefd46ac4b018 -size 3249 diff --git a/styles/chess.com/assets/frappe/b/bk.png b/styles/chess.com/assets/frappe/b/bk.png deleted file mode 100644 index 0148ad8c06..0000000000 --- a/styles/chess.com/assets/frappe/b/bk.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:3835d2041ff5cbbe592c038c7890246ade959658ff14874a2f8eda3af76fe79b -size 3323 diff --git a/styles/chess.com/assets/frappe/b/bn.png b/styles/chess.com/assets/frappe/b/bn.png deleted file mode 100644 index d084b319df..0000000000 --- a/styles/chess.com/assets/frappe/b/bn.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:5a715e49cf19e6b23f93fca069387cd2d7f752328c37660330fd5acd17baa1ca -size 3343 diff --git a/styles/chess.com/assets/frappe/b/bp.png b/styles/chess.com/assets/frappe/b/bp.png deleted file mode 100644 index a175ee38c8..0000000000 --- a/styles/chess.com/assets/frappe/b/bp.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:0425e2818a6e8ba8e7804c47435e0c30e6bb70ebf3959427ab8d1d813ec1f671 -size 2606 diff --git a/styles/chess.com/assets/frappe/b/bq.png b/styles/chess.com/assets/frappe/b/bq.png deleted file mode 100644 index 3804650671..0000000000 --- a/styles/chess.com/assets/frappe/b/bq.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:dad984bff15e9b9cf4943962d1e0739537e515a281e972d4a765656d779abc8e -size 4023 diff --git a/styles/chess.com/assets/frappe/b/br.png b/styles/chess.com/assets/frappe/b/br.png deleted file mode 100644 index 7127a48b88..0000000000 --- a/styles/chess.com/assets/frappe/b/br.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:e06c1af2d6fefe677e8d712227b40dffb18e448aba5fa521296b621db6f732c6 -size 2954 diff --git a/styles/chess.com/assets/frappe/blue.png b/styles/chess.com/assets/frappe/blue.png deleted file mode 100644 index 6bf183b08e..0000000000 --- a/styles/chess.com/assets/frappe/blue.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:053a6f91c29db63209922ba82c590c7a462566256cea3a1891dc3214ea8c9673 -size 28327 diff --git a/styles/chess.com/assets/frappe/flamingo.png b/styles/chess.com/assets/frappe/flamingo.png deleted file mode 100644 index 10e9b03532..0000000000 --- a/styles/chess.com/assets/frappe/flamingo.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6a206d8edcb33ed1124f2f537c2430219b4ce90bc026dc1585a653a451e47656 -size 28317 diff --git a/styles/chess.com/assets/frappe/green.png b/styles/chess.com/assets/frappe/green.png deleted file mode 100644 index 7eaa208fc3..0000000000 --- a/styles/chess.com/assets/frappe/green.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:7a5ae12aefb9aa7ef379c6f55da121a0ddc75c206c1d94a1bb2f2a5c6abca05a -size 28328 diff --git a/styles/chess.com/assets/frappe/lavender.png b/styles/chess.com/assets/frappe/lavender.png deleted file mode 100644 index 0aa1f667e2..0000000000 --- a/styles/chess.com/assets/frappe/lavender.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:aab0d67b0effbf90701d91404a0a5fd077bd7f219f2dee4de479128d2b84b94f -size 28328 diff --git a/styles/chess.com/assets/frappe/maroon.png b/styles/chess.com/assets/frappe/maroon.png deleted file mode 100644 index 088c7c2111..0000000000 --- a/styles/chess.com/assets/frappe/maroon.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:331b152f11b24177136f9078f9be98a78389684147d22423a4947ee87be10644 -size 28322 diff --git a/styles/chess.com/assets/frappe/mauve.png b/styles/chess.com/assets/frappe/mauve.png deleted file mode 100644 index edd9ff3c40..0000000000 --- a/styles/chess.com/assets/frappe/mauve.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ff39ba0bf2bb7597ad54886bdae36a888e11720ebb3242c3695690a37e16effa -size 28327 diff --git a/styles/chess.com/assets/frappe/peach.png b/styles/chess.com/assets/frappe/peach.png deleted file mode 100644 index 06e5b89b03..0000000000 --- a/styles/chess.com/assets/frappe/peach.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:cee4ee724fb875c6a87bade871f67dd2fbcec5531645813b08b1a0b82d4fb63d -size 28299 diff --git a/styles/chess.com/assets/frappe/pink.png b/styles/chess.com/assets/frappe/pink.png deleted file mode 100644 index 88e2d0c3d0..0000000000 --- a/styles/chess.com/assets/frappe/pink.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:c59008de93afbc43ad17b17d39f9ef8df74f65ff5472244f4c07c7274009f88b -size 28329 diff --git a/styles/chess.com/assets/frappe/red.png b/styles/chess.com/assets/frappe/red.png deleted file mode 100644 index 3f56131e03..0000000000 --- a/styles/chess.com/assets/frappe/red.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:890f80a9e79696be7338310068c51660ac83c5b8eddf67320bd232179d27bfc3 -size 28296 diff --git a/styles/chess.com/assets/frappe/rosewater.png b/styles/chess.com/assets/frappe/rosewater.png deleted file mode 100644 index bcba4652c5..0000000000 --- a/styles/chess.com/assets/frappe/rosewater.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:e71c415203590c4c55116261743ff1d6c4ee8fc9056c4c194aefd539ca36e914 -size 28330 diff --git a/styles/chess.com/assets/frappe/sapphire.png b/styles/chess.com/assets/frappe/sapphire.png deleted file mode 100644 index f541e5a2d8..0000000000 --- a/styles/chess.com/assets/frappe/sapphire.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6e99274e9fb9dce90e6d153f81280766be40669209f557f76c94a9464768767d -size 28330 diff --git a/styles/chess.com/assets/frappe/sky.png b/styles/chess.com/assets/frappe/sky.png deleted file mode 100644 index d2a5fd50f4..0000000000 --- a/styles/chess.com/assets/frappe/sky.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:77bd097f2410f1203a63d05e9c2a05cbdd265f8a469f1975871e119990f0260f -size 28323 diff --git a/styles/chess.com/assets/frappe/teal.png b/styles/chess.com/assets/frappe/teal.png deleted file mode 100644 index a5ddb48739..0000000000 --- a/styles/chess.com/assets/frappe/teal.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:540247183c99511c88ec25b308659bce8d4e5413ac04446ab9fdb45b048790c7 -size 28329 diff --git a/styles/chess.com/assets/frappe/w/wb.png b/styles/chess.com/assets/frappe/w/wb.png deleted file mode 100644 index cc652db092..0000000000 --- a/styles/chess.com/assets/frappe/w/wb.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:1cbbc043170ea2dc03264487a3ab1e083d1e7b6e1a4361022e8a3f88afc7cfc1 -size 3007 diff --git a/styles/chess.com/assets/frappe/w/wk.png b/styles/chess.com/assets/frappe/w/wk.png deleted file mode 100644 index b039582f5d..0000000000 --- a/styles/chess.com/assets/frappe/w/wk.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:aa99a6294dd5102ef75accc06170c0344850ca365544a84e941c726d0e6d68f8 -size 3357 diff --git a/styles/chess.com/assets/frappe/w/wn.png b/styles/chess.com/assets/frappe/w/wn.png deleted file mode 100644 index 961535bbb9..0000000000 --- a/styles/chess.com/assets/frappe/w/wn.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:9430f95a1831d6ea2e3874a4e532b209ba1b2844eccfc114919dd2f8836d58f2 -size 2972 diff --git a/styles/chess.com/assets/frappe/w/wp.png b/styles/chess.com/assets/frappe/w/wp.png deleted file mode 100644 index 43dbe7ee7f..0000000000 --- a/styles/chess.com/assets/frappe/w/wp.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ee62937fd8e1b4d175663a406b7b8d074827a70feb703c484478e11112c25e6e -size 2288 diff --git a/styles/chess.com/assets/frappe/w/wq.png b/styles/chess.com/assets/frappe/w/wq.png deleted file mode 100644 index 69cd725663..0000000000 --- a/styles/chess.com/assets/frappe/w/wq.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:57429ebfd580d8f74fc6b10abc8c4af0a261880d4be2f7fc6c7c6513874a4364 -size 3888 diff --git a/styles/chess.com/assets/frappe/w/wr.png b/styles/chess.com/assets/frappe/w/wr.png deleted file mode 100644 index 7b471a33f4..0000000000 --- a/styles/chess.com/assets/frappe/w/wr.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6f13cd0d41a52dd764915e906cf3535a4838dbd4b433c418adebaa49d4a50edf -size 2794 diff --git a/styles/chess.com/assets/frappe/yellow.png b/styles/chess.com/assets/frappe/yellow.png deleted file mode 100644 index 4cbcda8cef..0000000000 --- a/styles/chess.com/assets/frappe/yellow.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:2649d3c18b60b41c26de3104b054364ad38a59f015ee28b50660f33d4262abf8 -size 28325 diff --git a/styles/chess.com/assets/latte/b/bb.png b/styles/chess.com/assets/latte/b/bb.png deleted file mode 100644 index ac01897864..0000000000 --- a/styles/chess.com/assets/latte/b/bb.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:3c296560d7a4870ad856b921ff11e52a601b9dbae39919036ac32005b0dcce27 -size 3104 diff --git a/styles/chess.com/assets/latte/b/bk.png b/styles/chess.com/assets/latte/b/bk.png deleted file mode 100644 index 4944ed18b0..0000000000 --- a/styles/chess.com/assets/latte/b/bk.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:dcb8b5db299a7a00b49b976bdcf075a669c03627d8acb5e956e674b6619e06b3 -size 3168 diff --git a/styles/chess.com/assets/latte/b/bn.png b/styles/chess.com/assets/latte/b/bn.png deleted file mode 100644 index 5d9dfc9571..0000000000 --- a/styles/chess.com/assets/latte/b/bn.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:a81be4313282fcee4f895c1419011ca29e35692285a6a05b092a51887646f7d2 -size 3131 diff --git a/styles/chess.com/assets/latte/b/bp.png b/styles/chess.com/assets/latte/b/bp.png deleted file mode 100644 index 3eb4a53753..0000000000 --- a/styles/chess.com/assets/latte/b/bp.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:a056ef7253fa83525da4d350c6d243971ed8724f769e5a85948ef0c2f317e592 -size 2531 diff --git a/styles/chess.com/assets/latte/b/bq.png b/styles/chess.com/assets/latte/b/bq.png deleted file mode 100644 index 35b3484d8f..0000000000 --- a/styles/chess.com/assets/latte/b/bq.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:546da558bc352ea45883ee4d9d8ed3b23a3de283e808bcfec1f06fe7b49879a8 -size 3810 diff --git a/styles/chess.com/assets/latte/b/br.png b/styles/chess.com/assets/latte/b/br.png deleted file mode 100644 index d98022c3d4..0000000000 --- a/styles/chess.com/assets/latte/b/br.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6ecae99e4efb0983b0056a4561efd8e4a2cb992933c543fd5e94d8de48bd2bd6 -size 2695 diff --git a/styles/chess.com/assets/latte/blue.png b/styles/chess.com/assets/latte/blue.png deleted file mode 100644 index 44c4975eb3..0000000000 --- a/styles/chess.com/assets/latte/blue.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:4c350275fe629f0ba17f3810b5fb7e615e576fa6a45ec27840ae4380e46462bf -size 28301 diff --git a/styles/chess.com/assets/latte/flamingo.png b/styles/chess.com/assets/latte/flamingo.png deleted file mode 100644 index 610e2ec5dd..0000000000 --- a/styles/chess.com/assets/latte/flamingo.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:66a07736e319a1f829f14918f671e8e5f41b55b84bd84167c4289359effdbd1b -size 28293 diff --git a/styles/chess.com/assets/latte/green.png b/styles/chess.com/assets/latte/green.png deleted file mode 100644 index d36f7fb889..0000000000 --- a/styles/chess.com/assets/latte/green.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:f537cd2a783dcd9867d71bf78e1688ffe4626664e63eec3859a8387813b5a3ac -size 28316 diff --git a/styles/chess.com/assets/latte/lavender.png b/styles/chess.com/assets/latte/lavender.png deleted file mode 100644 index eee08de194..0000000000 --- a/styles/chess.com/assets/latte/lavender.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:a78c44162772eb0711981e6e9a9b2095586ae5ac5dbb0e107ebecace3d689733 -size 28319 diff --git a/styles/chess.com/assets/latte/maroon.png b/styles/chess.com/assets/latte/maroon.png deleted file mode 100644 index aa3ab82f65..0000000000 --- a/styles/chess.com/assets/latte/maroon.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:533cdf9aad65552f7e3d8d867f0bf229df3f26a16f566d0d942007d4be303a98 -size 28319 diff --git a/styles/chess.com/assets/latte/mauve.png b/styles/chess.com/assets/latte/mauve.png deleted file mode 100644 index dd18d436b9..0000000000 --- a/styles/chess.com/assets/latte/mauve.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:bec805ed6b4030b9fdc10622eae7b7b4735f9ac1e66a3b0bf0d7a16cfb8456c0 -size 28297 diff --git a/styles/chess.com/assets/latte/peach.png b/styles/chess.com/assets/latte/peach.png deleted file mode 100644 index 6ec94b2330..0000000000 --- a/styles/chess.com/assets/latte/peach.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:fa0f7a7a39812bff6e5e7fe08322b5786bcf9b24236b7e51f75df04a192bd7fe -size 28316 diff --git a/styles/chess.com/assets/latte/pink.png b/styles/chess.com/assets/latte/pink.png deleted file mode 100644 index d11e7379a8..0000000000 --- a/styles/chess.com/assets/latte/pink.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:5c9bba9cbd280f07c5a3d3c9910c1bc870667939e903b20eae9d5533312f42e0 -size 28295 diff --git a/styles/chess.com/assets/latte/red.png b/styles/chess.com/assets/latte/red.png deleted file mode 100644 index 0492d2d8e8..0000000000 --- a/styles/chess.com/assets/latte/red.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6a96917717102925522f1edf717b6c33b225c5a118d38076cd6f3ae4e28f3d27 -size 28322 diff --git a/styles/chess.com/assets/latte/rosewater.png b/styles/chess.com/assets/latte/rosewater.png deleted file mode 100644 index 4fa28e993a..0000000000 --- a/styles/chess.com/assets/latte/rosewater.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:a3c69456a8a5195e7bb69c56257e026de26274298b6b2be7c8cdf0f114c073ed -size 28297 diff --git a/styles/chess.com/assets/latte/sapphire.png b/styles/chess.com/assets/latte/sapphire.png deleted file mode 100644 index 02aef36251..0000000000 --- a/styles/chess.com/assets/latte/sapphire.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:b81dac689520727bf1e6d0933e16ab2a83eba84e4752fbc0bb739a4193469155 -size 28301 diff --git a/styles/chess.com/assets/latte/sky.png b/styles/chess.com/assets/latte/sky.png deleted file mode 100644 index a242a03b77..0000000000 --- a/styles/chess.com/assets/latte/sky.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:4899a34edde6afda6d8ccf228c8c982b9ba9f0994bb6137d21278e0aade86c72 -size 28294 diff --git a/styles/chess.com/assets/latte/teal.png b/styles/chess.com/assets/latte/teal.png deleted file mode 100644 index 6d98c2368b..0000000000 --- a/styles/chess.com/assets/latte/teal.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:fa19a84737aaae84332912509f6c5f937cac3eadf4020ce6548997813ae4691b -size 28297 diff --git a/styles/chess.com/assets/latte/w/wb.png b/styles/chess.com/assets/latte/w/wb.png deleted file mode 100644 index 898b0a52db..0000000000 --- a/styles/chess.com/assets/latte/w/wb.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:40759ad095760e2ce55a7981c9d1269cff6af7c74cfd3e2336762ce66051d3cd -size 3669 diff --git a/styles/chess.com/assets/latte/w/wk.png b/styles/chess.com/assets/latte/w/wk.png deleted file mode 100644 index 46f0cb73d6..0000000000 --- a/styles/chess.com/assets/latte/w/wk.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:93548e1d13d0395544fa4f8ab0333aede212675d448d1c93a585e26297dc7aaa -size 3882 diff --git a/styles/chess.com/assets/latte/w/wn.png b/styles/chess.com/assets/latte/w/wn.png deleted file mode 100644 index ab8c6385b2..0000000000 --- a/styles/chess.com/assets/latte/w/wn.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:44665c779ec4ef72926667a3db5aab386cf4262f95873d3b65e58232e3de14df -size 3529 diff --git a/styles/chess.com/assets/latte/w/wp.png b/styles/chess.com/assets/latte/w/wp.png deleted file mode 100644 index 2345881760..0000000000 --- a/styles/chess.com/assets/latte/w/wp.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:970a66b77f98bc68889bf617b59b85dcf42c30014c66ba7105b34cd1f2094e05 -size 2691 diff --git a/styles/chess.com/assets/latte/w/wq.png b/styles/chess.com/assets/latte/w/wq.png deleted file mode 100644 index 4ba1bf596a..0000000000 --- a/styles/chess.com/assets/latte/w/wq.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:faef34bcac4c1d97a288b7bea2d8de90ae00308b6adc2c215ae2f70ee00c0813 -size 4648 diff --git a/styles/chess.com/assets/latte/w/wr.png b/styles/chess.com/assets/latte/w/wr.png deleted file mode 100644 index 7bf4db9476..0000000000 --- a/styles/chess.com/assets/latte/w/wr.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d34215d679429388d7d7658599059ab2dcc4541f5ccf5b0ccdfc18f23145d907 -size 3322 diff --git a/styles/chess.com/assets/latte/yellow.png b/styles/chess.com/assets/latte/yellow.png deleted file mode 100644 index a6931ebf9a..0000000000 --- a/styles/chess.com/assets/latte/yellow.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:22608b3f316821b010ec6a596c6cee6cfcf106d2a7a80acfd89cf65928ad1fe9 -size 28297 diff --git a/styles/chess.com/assets/macchiato/b/bb.png b/styles/chess.com/assets/macchiato/b/bb.png deleted file mode 100644 index 1175157cbe..0000000000 --- a/styles/chess.com/assets/macchiato/b/bb.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:79361017da3e22acb1fc8f58a65c4e28d376706e92a3eea42776fa59104ab140 -size 3243 diff --git a/styles/chess.com/assets/macchiato/b/bk.png b/styles/chess.com/assets/macchiato/b/bk.png deleted file mode 100644 index e6e85c7052..0000000000 --- a/styles/chess.com/assets/macchiato/b/bk.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:0a12c706b54a3fdec1c9f1661cc4b468931ce1242f5146fb28d4b64f2b45ec38 -size 3625 diff --git a/styles/chess.com/assets/macchiato/b/bn.png b/styles/chess.com/assets/macchiato/b/bn.png deleted file mode 100644 index 4b34bed72a..0000000000 --- a/styles/chess.com/assets/macchiato/b/bn.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:910235c34c6c1129913d49f4db98da4dcd8270b2cf9fb2b0e0d1987418ccd31b -size 3331 diff --git a/styles/chess.com/assets/macchiato/b/bp.png b/styles/chess.com/assets/macchiato/b/bp.png deleted file mode 100644 index 1b8175c097..0000000000 --- a/styles/chess.com/assets/macchiato/b/bp.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6154621561dc85567d709324c19567e79216d1c246f32b84566f5a806e80032c -size 2712 diff --git a/styles/chess.com/assets/macchiato/b/bq.png b/styles/chess.com/assets/macchiato/b/bq.png deleted file mode 100644 index 796758dd56..0000000000 --- a/styles/chess.com/assets/macchiato/b/bq.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:c6312d5cf3bf10c523f218d5915fbf9f04181277bc082c0b16827b7f42e370cc -size 4061 diff --git a/styles/chess.com/assets/macchiato/b/br.png b/styles/chess.com/assets/macchiato/b/br.png deleted file mode 100644 index e81c0c7ebd..0000000000 --- a/styles/chess.com/assets/macchiato/b/br.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:735e02cdcdab6bb23d55bfb605fe4b1db97d0bf72b6715f369c4c4c9927f4dce -size 2910 diff --git a/styles/chess.com/assets/macchiato/blue.png b/styles/chess.com/assets/macchiato/blue.png deleted file mode 100644 index 203baf0455..0000000000 --- a/styles/chess.com/assets/macchiato/blue.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:882a1da0f97cedfb67e2ce8331eac37b7446af65ea33da805ad21b7b04c39507 -size 28331 diff --git a/styles/chess.com/assets/macchiato/flamingo.png b/styles/chess.com/assets/macchiato/flamingo.png deleted file mode 100644 index 5f6fcc553c..0000000000 --- a/styles/chess.com/assets/macchiato/flamingo.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:99096e1e9afab14f467b30d98815a195706f59865d7f4bf8b7bece87701a92ba -size 28326 diff --git a/styles/chess.com/assets/macchiato/green.png b/styles/chess.com/assets/macchiato/green.png deleted file mode 100644 index 57da448182..0000000000 --- a/styles/chess.com/assets/macchiato/green.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:9824dad577f74a8dc130aa5ecd766364c744c027e2e21558d678bb29c0c5c344 -size 28329 diff --git a/styles/chess.com/assets/macchiato/lavender.png b/styles/chess.com/assets/macchiato/lavender.png deleted file mode 100644 index 9c36c6f6ca..0000000000 --- a/styles/chess.com/assets/macchiato/lavender.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6b2b04612ab5d5b9174065d17bd3068310eabf6b50fd49e090a9c0993b01bd03 -size 28323 diff --git a/styles/chess.com/assets/macchiato/maroon.png b/styles/chess.com/assets/macchiato/maroon.png deleted file mode 100644 index 0da5a30db6..0000000000 --- a/styles/chess.com/assets/macchiato/maroon.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:5ba907de08dbfe055295ce3803ab9166344aa37a6b24dda03a13dcb29d9ba48a -size 28327 diff --git a/styles/chess.com/assets/macchiato/mauve.png b/styles/chess.com/assets/macchiato/mauve.png deleted file mode 100644 index a71d99989f..0000000000 --- a/styles/chess.com/assets/macchiato/mauve.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:3d8400e96674081f306be031b0468bed9d48e60658dd4646fd55d7b4098f5ff7 -size 28328 diff --git a/styles/chess.com/assets/macchiato/peach.png b/styles/chess.com/assets/macchiato/peach.png deleted file mode 100644 index b9c0db7d4c..0000000000 --- a/styles/chess.com/assets/macchiato/peach.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:dd4e18a1420f3a1a6e4aa41b61ecf4c1a3e18285d421b27bf73c23471f3d9650 -size 28324 diff --git a/styles/chess.com/assets/macchiato/pink.png b/styles/chess.com/assets/macchiato/pink.png deleted file mode 100644 index 700870b6f1..0000000000 --- a/styles/chess.com/assets/macchiato/pink.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:782c5382540a4095935b904bc4fef668abc86d394127c77c02bceb37f22a7488 -size 28330 diff --git a/styles/chess.com/assets/macchiato/red.png b/styles/chess.com/assets/macchiato/red.png deleted file mode 100644 index 957bb248bc..0000000000 --- a/styles/chess.com/assets/macchiato/red.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:dabb6eea4369a95b9320599a9f1cefd468aa76a90ace6545a09ffe999f1dd290 -size 28300 diff --git a/styles/chess.com/assets/macchiato/rosewater.png b/styles/chess.com/assets/macchiato/rosewater.png deleted file mode 100644 index e4330a77a5..0000000000 --- a/styles/chess.com/assets/macchiato/rosewater.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d8cae8904603d138a1b9ae41fd591522573da955e47d51b66a735d3d554a858e -size 28328 diff --git a/styles/chess.com/assets/macchiato/sapphire.png b/styles/chess.com/assets/macchiato/sapphire.png deleted file mode 100644 index c2e4b3de65..0000000000 --- a/styles/chess.com/assets/macchiato/sapphire.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:e6af40b15fe2ef586f75caf4132f9453954f43ce9a3a82a7f55425c0822bdfe9 -size 28328 diff --git a/styles/chess.com/assets/macchiato/sky.png b/styles/chess.com/assets/macchiato/sky.png deleted file mode 100644 index e1640f91ef..0000000000 --- a/styles/chess.com/assets/macchiato/sky.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:7ddcd900760f9e40346bb9890dfb9a41fd2c458cb56047dbb9ca405206d8901b -size 28329 diff --git a/styles/chess.com/assets/macchiato/teal.png b/styles/chess.com/assets/macchiato/teal.png deleted file mode 100644 index 57650b32b7..0000000000 --- a/styles/chess.com/assets/macchiato/teal.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:330f8e656244875cb73f4b447b0f54b8a5c533f61fe53a3d1a5f54e016055bae -size 28329 diff --git a/styles/chess.com/assets/macchiato/w/wb.png b/styles/chess.com/assets/macchiato/w/wb.png deleted file mode 100644 index fddf4fe5d9..0000000000 --- a/styles/chess.com/assets/macchiato/w/wb.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:2d23feb659591d710a4f9307c059ccd7424b70fe1973252134bec603f066d94b -size 3103 diff --git a/styles/chess.com/assets/macchiato/w/wk.png b/styles/chess.com/assets/macchiato/w/wk.png deleted file mode 100644 index 7700bcb8ab..0000000000 --- a/styles/chess.com/assets/macchiato/w/wk.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:207fa41c3d3d65a1a75ca317039c8bf709e89ef41116eba112da0eee9f8efee4 -size 3381 diff --git a/styles/chess.com/assets/macchiato/w/wn.png b/styles/chess.com/assets/macchiato/w/wn.png deleted file mode 100644 index 00f83d2550..0000000000 --- a/styles/chess.com/assets/macchiato/w/wn.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:1e84ab3b5f682f8f0df1a64dc550819cab5099984e629dc7308815e276d38016 -size 3109 diff --git a/styles/chess.com/assets/macchiato/w/wp.png b/styles/chess.com/assets/macchiato/w/wp.png deleted file mode 100644 index 975621c372..0000000000 --- a/styles/chess.com/assets/macchiato/w/wp.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d3e0e7a9aaaea3defe695abbad862590b1cc2346fb5d965c608a5f1193a3513d -size 2277 diff --git a/styles/chess.com/assets/macchiato/w/wq.png b/styles/chess.com/assets/macchiato/w/wq.png deleted file mode 100644 index d4cd6d1267..0000000000 --- a/styles/chess.com/assets/macchiato/w/wq.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:24e8909e33fd3d6a5a74035cdbd6e2830ffca0a10a24a2a9db27539702dbcc76 -size 3893 diff --git a/styles/chess.com/assets/macchiato/w/wr.png b/styles/chess.com/assets/macchiato/w/wr.png deleted file mode 100644 index 2a2e61c72a..0000000000 --- a/styles/chess.com/assets/macchiato/w/wr.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:f375ae2b0ac8948efa72240ccda234d0e5d52f2d51f79e341a216b8eccfb840f -size 2920 diff --git a/styles/chess.com/assets/macchiato/yellow.png b/styles/chess.com/assets/macchiato/yellow.png deleted file mode 100644 index 72eea1d7d7..0000000000 --- a/styles/chess.com/assets/macchiato/yellow.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:4b6e7fa5803381e46a83f3bb80ed2e4dc9e5888f897b752d37637e4e9c9eb1fb -size 28330 diff --git a/styles/chess.com/assets/mocha/b/bb.png b/styles/chess.com/assets/mocha/b/bb.png deleted file mode 100644 index 735328c4ca..0000000000 --- a/styles/chess.com/assets/mocha/b/bb.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:2831d162d07b88ab8b4a83da15cec56a6ab0bf9a112ebe1da0e146db8be5390d -size 3249 diff --git a/styles/chess.com/assets/mocha/b/bk.png b/styles/chess.com/assets/mocha/b/bk.png deleted file mode 100644 index e9bf90f84c..0000000000 --- a/styles/chess.com/assets/mocha/b/bk.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:2d5b4881bb20aa8094674717db5eb19169bf12770f8356df60f75dd566b04a65 -size 3651 diff --git a/styles/chess.com/assets/mocha/b/bn.png b/styles/chess.com/assets/mocha/b/bn.png deleted file mode 100644 index db2940a39b..0000000000 --- a/styles/chess.com/assets/mocha/b/bn.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ef8dd88ec0f18bbe5e37b35b81f39c13f3cb72a3f06fa673ea275e2ccac38f9e -size 3332 diff --git a/styles/chess.com/assets/mocha/b/bp.png b/styles/chess.com/assets/mocha/b/bp.png deleted file mode 100644 index 8aec3e73cc..0000000000 --- a/styles/chess.com/assets/mocha/b/bp.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:b217943ecada45d34a812b463fda20d8bd2c3039c8ad4de260b0295e07ea11e8 -size 2732 diff --git a/styles/chess.com/assets/mocha/b/bq.png b/styles/chess.com/assets/mocha/b/bq.png deleted file mode 100644 index f25209524c..0000000000 --- a/styles/chess.com/assets/mocha/b/bq.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:bd2568aa0e3f419798f7297deca1fb32af1e247f3cedd7ac2ef3daba0e1d6afa -size 4049 diff --git a/styles/chess.com/assets/mocha/b/br.png b/styles/chess.com/assets/mocha/b/br.png deleted file mode 100644 index 7e08e5387e..0000000000 --- a/styles/chess.com/assets/mocha/b/br.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:954ee8137f718d20b71cefa15f80b87369abd7e4b3a2ccba641d0a384ed9aec1 -size 2948 diff --git a/styles/chess.com/assets/mocha/blue.png b/styles/chess.com/assets/mocha/blue.png deleted file mode 100644 index 6b45737a79..0000000000 --- a/styles/chess.com/assets/mocha/blue.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:de754c691fa5c5aca9dcce9d82fe6dad0093735d5a69865c4452c57850ae4231 -size 28321 diff --git a/styles/chess.com/assets/mocha/flamingo.png b/styles/chess.com/assets/mocha/flamingo.png deleted file mode 100644 index f6305e3e3a..0000000000 --- a/styles/chess.com/assets/mocha/flamingo.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ed48f0530ec0c5ac6304f0ede8acb501b8450e290ddeab6ce74faaa8af61bb9d -size 28321 diff --git a/styles/chess.com/assets/mocha/green.png b/styles/chess.com/assets/mocha/green.png deleted file mode 100644 index 357b0c6486..0000000000 --- a/styles/chess.com/assets/mocha/green.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:c110eb389aad37123877e99286fb208ab4d7a8ff3bea885b38923a8f16bc88b1 -size 28326 diff --git a/styles/chess.com/assets/mocha/lavender.png b/styles/chess.com/assets/mocha/lavender.png deleted file mode 100644 index b0598284f2..0000000000 --- a/styles/chess.com/assets/mocha/lavender.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d11e2708e5fce0b548fab998a20f96aea74cdc4cba81689096ca690dd46da2be -size 28321 diff --git a/styles/chess.com/assets/mocha/maroon.png b/styles/chess.com/assets/mocha/maroon.png deleted file mode 100644 index 734f56fcfa..0000000000 --- a/styles/chess.com/assets/mocha/maroon.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:4a605a9c185c742a1c19e37b7e66b6f4d2912fb04a9bcf7a8a4bd48bf2b59d70 -size 28315 diff --git a/styles/chess.com/assets/mocha/mauve.png b/styles/chess.com/assets/mocha/mauve.png deleted file mode 100644 index 73e16b2358..0000000000 --- a/styles/chess.com/assets/mocha/mauve.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:5e2f9eada62ace1cb353c249d7e1236e9a25494fd9dca33e0800b59989f4374c -size 28324 diff --git a/styles/chess.com/assets/mocha/peach.png b/styles/chess.com/assets/mocha/peach.png deleted file mode 100644 index 2b66690a43..0000000000 --- a/styles/chess.com/assets/mocha/peach.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:dbfe09d04ad4bbf7a8a201fbb73209f5438d0c6c57135fe49815334420216ada -size 28326 diff --git a/styles/chess.com/assets/mocha/pink.png b/styles/chess.com/assets/mocha/pink.png deleted file mode 100644 index 8265135024..0000000000 --- a/styles/chess.com/assets/mocha/pink.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d1325d5a665d8e0f04959c3ce8469c17dba3cfd99b9f73c891166e0e4eabb7b9 -size 28325 diff --git a/styles/chess.com/assets/mocha/red.png b/styles/chess.com/assets/mocha/red.png deleted file mode 100644 index 405e42743c..0000000000 --- a/styles/chess.com/assets/mocha/red.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:c389d64ededcf3a679dee3fcdca05f096d730d6c0df91374b0c28f78eea76e2d -size 28326 diff --git a/styles/chess.com/assets/mocha/rosewater.png b/styles/chess.com/assets/mocha/rosewater.png deleted file mode 100644 index a1935d9a80..0000000000 --- a/styles/chess.com/assets/mocha/rosewater.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:78f3469bd33308b536f6ac3f1d2280a5400ffc9048c5894ff1a594d4cfe01317 -size 28324 diff --git a/styles/chess.com/assets/mocha/sapphire.png b/styles/chess.com/assets/mocha/sapphire.png deleted file mode 100644 index 1e9d2c3866..0000000000 --- a/styles/chess.com/assets/mocha/sapphire.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:c1a40603467d4fe110e6d85a3dc5fd03440d0ea27314c6e1c274f856acd2b60a -size 28322 diff --git a/styles/chess.com/assets/mocha/sky.png b/styles/chess.com/assets/mocha/sky.png deleted file mode 100644 index 050053f101..0000000000 --- a/styles/chess.com/assets/mocha/sky.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:2f0a0f3b93bb5acb93546f324994752cb7b231ca467b4cb31ec385f177ed5ea5 -size 28322 diff --git a/styles/chess.com/assets/mocha/teal.png b/styles/chess.com/assets/mocha/teal.png deleted file mode 100644 index e5452485bd..0000000000 --- a/styles/chess.com/assets/mocha/teal.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:3417ff53ca7fe248c282d0417c926d45b2c905969f39f22aefd99579baad712f -size 28328 diff --git a/styles/chess.com/assets/mocha/w/wb.png b/styles/chess.com/assets/mocha/w/wb.png deleted file mode 100644 index ca720ff0d9..0000000000 --- a/styles/chess.com/assets/mocha/w/wb.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:92429827710931867431b9d8f82ad0b8711d9b9304c75d72a9c5b75ac7e9f974 -size 2969 diff --git a/styles/chess.com/assets/mocha/w/wk.png b/styles/chess.com/assets/mocha/w/wk.png deleted file mode 100644 index 3c0d94de16..0000000000 --- a/styles/chess.com/assets/mocha/w/wk.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:20c47e09e59a1103ab2ca62026a9289297d88c9c1cba650ad1bb54a61f5ec075 -size 3379 diff --git a/styles/chess.com/assets/mocha/w/wn.png b/styles/chess.com/assets/mocha/w/wn.png deleted file mode 100644 index 98316aa1bf..0000000000 --- a/styles/chess.com/assets/mocha/w/wn.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:4e34de37a7b2edc99ec664e5e06f6da8086e3b6f16abb57ea7ac23a778d4e880 -size 2978 diff --git a/styles/chess.com/assets/mocha/w/wp.png b/styles/chess.com/assets/mocha/w/wp.png deleted file mode 100644 index 5a8ee28f51..0000000000 --- a/styles/chess.com/assets/mocha/w/wp.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ab0f9c41b2bd06a0428473a485313e21204e0695f6e6a8e2bc7bf86b3089bdd7 -size 2270 diff --git a/styles/chess.com/assets/mocha/w/wq.png b/styles/chess.com/assets/mocha/w/wq.png deleted file mode 100644 index 623d82f0c9..0000000000 --- a/styles/chess.com/assets/mocha/w/wq.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:129ecf923e8e932602f404fabd72914dd938c47b57f67975acf808c9d5231504 -size 3861 diff --git a/styles/chess.com/assets/mocha/w/wr.png b/styles/chess.com/assets/mocha/w/wr.png deleted file mode 100644 index 7975e239ac..0000000000 --- a/styles/chess.com/assets/mocha/w/wr.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6f97b0ecc753e5318a61fb35b81e66d293f5f66e95f6ca16b72d1a47a8b98b12 -size 2753 diff --git a/styles/chess.com/assets/mocha/yellow.png b/styles/chess.com/assets/mocha/yellow.png deleted file mode 100644 index e9efbca861..0000000000 --- a/styles/chess.com/assets/mocha/yellow.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:fde045c037a5a7a08e585bab4fb4326cdd714811e44a6ec731d0dd45247ec1c1 -size 28323 diff --git a/styles/chess.com/catppuccin.user.css b/styles/chess.com/catppuccin.user.css deleted file mode 100644 index ba6a205bc7..0000000000 --- a/styles/chess.com/catppuccin.user.css +++ /dev/null @@ -1,481 +0,0 @@ -/* ==UserStyle== -@name Chess.com Catppuccin -@namespace github.com/catppuccin/userstyles/styles/chess.com -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/chess.com -@version 0.1.6 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/chess.com/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Achess.com -@description Soothing pastel theme for Chess.com -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("chess.com") { - body { - #catppuccin(@lightFlavor, @accentColor); - } - - .dark-mode body { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, - @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - #piece(@piece) { - @url: url("https://media.githubusercontent.com/media/catppuccin/userstyles/main/styles/chess.com/assets/@{lookup}/@{piece}.png"); - } - - @bb: #piece("b/bb") []; - @bk: #piece("b/bk") []; - @bn: #piece("b/bn") []; - @bp: #piece("b/bp") []; - @bq: #piece("b/bq") []; - @br: #piece("b/br") []; - @wb: #piece("w/wb") []; - @wk: #piece("w/wk") []; - @wn: #piece("w/wn") []; - @wp: #piece("w/wp") []; - @wq: #piece("w/wq") []; - @wr: #piece("w/wr") []; - - --theme-background-color: @base !important; - --globalBackground: @mantle !important; - --globalBackgroundOpaque: @mantle !important; - --globalSecondaryBackground: @crust !important; - --globalTertiaryBackground: @surface0 !important; - --globalAccentBackground: @accent-color !important; - --globalSecondaryAccentBackground: darken(@accent-color, 20%) !important; - --globalSiteBackground: @base !important; - --subtleButtonBackground: hsla(0, 0%, 100%, 0.16); - --globalBorder: @surface0 !important; - --globalGray: hsla(0, 0%, 100%, 0.08); - --globalGraySoft: hsla(0, 0%, 100%, 0.08); - --globalColorThemeFull: @text !important; - --globalColorThemeHigh: @text; - --globalColorThemeMid: @overlay2 !important; - --globalColorThemeLow: @overlay0 !important; - --globalColorThemeLower: @base !important; - --globalColorThemeLink: @sapphire !important; - --globalColorThemeBlueToWhite: #fff; - --globalColorThemeBlueToMid: hsla(0, 0%, 100%, 0.72); - --globalColorThemeBlueToMidHover: hsla(0, 0%, 100%, 0.85); - --globalColorThemeBlueToHigh: hsla(0, 0%, 100%, 0.85); - --globalColorThemeBlueToHighHover: #fff; - --globalColorThemeHighToMid: hsla(0, 0%, 100%, 0.72); - --globalColorThemeFullToMid: hsla(0, 0%, 100%, 0.72); - --globalColorNeutral50: rgba(0, 0, 0, 0.1); - --globalColorNeutral100: rgba(0, 0, 0, 0.2); - --globalColorNeutral200: rgba(0, 0, 0, 0.4); - --globalOverlayBackground: @base !important; - --globalColorWin: @green !important; - --globalColorDraw: @accent-color !important; - --globalColorLoss: @red !important; - - /* index page */ - .promo-title, - .index-title { - color: @text !important; - } - - .play-quick-links-title, - .promo-rank, - .v5-header-name, - .promo-subtitle, - #tb .toolbar-action-icon { - color: @text; - } - - .home-username-link { - color: @accent-color; - } - - .index-info-item-counter { - color: @text !important; - } - - .index-info-item { - color: @subtext0 !important; - } - - .index-quote-author .index-chess-title { - background: @accent-color !important; - color: @crust !important; - } - - .authentication-intro-levels { - --labelBackground: @surface0 !important; - --labelBackgroundHover: @surface1 !important; - - .authentication-intro-level-v5.authentication-intro-selected { - border-color: @accent-color !important; - } - } - - /* ui */ - .user-username-component { - color: @text; - } - - .user-tagline-rating.user-tagline-white { - color: @overlay1; - } - - .nav-link-text { - color: @text !important; - } - .nav-menu-area:last-of-type .icon-font-chess { - color: @mantle !important; - } - #sb .nav-popover.dark .btn-link { - color: @text; - } - #sb .nav-menu-area:last-of-type .icon-font-chess { - color: @text !important; - } - .nav-link-main-design:hover, - .nav-link-main-link:hover { - color: darken(@text, 20%) !important; - } - .nav-link-main-design, - .nav-link-main-link { - color: @text !important; - } - .ui_v5-button-component { - --boxShadow: none; - --boxShadowHover: none; - - box-shadow: none; - - &.ui_v5-button-basic { - --basicColor: @text !important; - --basicHoverColor: @text !important; - --basicBgColor: @surface1 !important; - --basicBghover: @surface2 !important; - --borderColor: @surface0 !important; - } - - &.ui_v5-button-primary { - color: @crust !important; - background-color: @accent-color !important; - --borderColor: darken(@accent-color, 20%) !important; - - &:hover { - --secondaryBorderColor: fadeout(@accent-color, 20%) !important; - box-shadow: none; - } - } - } - - .ui_v5-select-component { - &:not(.ui_v5-select-light), - &.ui_v5-select-dark { - background: @base; - } - } - - .ui_v5-input-component { - background: @base; - } - - .ui_v5-input-dark { - --secondaryTextColor: @subtext0; - } - - .ui_v5-switch-checkbox:not(.ui_v5-switch-readonly):checked - + .ui_v5-switch-label { - background: @green; - } - - .nav-panel-shade { - background: @mantle; - } - - .nav-popover.dark { - background: @mantle; - } - - .nav-section-header-component { - background: @base; - } - - #sb .nav-action.has-popover + .nav-popover { - background: @mantle; - } - - .popover-friends-header { - background: @mantle; - } - - .popover-friends-content { - background: @mantle; - } - - .popover-messages-header { - background: @mantle; - } - - .popover-messages-content { - background: @mantle; - } - - .popover-settings-header { - background: @mantle; - } - - .popover-settings-content { - background: @mantle; - } - - .selector-button-button { - background: @surface0; - - &:hover { - background: @surface1; - } - } - - .time-selector-button-button { - background: @surface0; - - &:hover { - background: @surface1; - } - } - - .cc-button-primary { - --bgColor: @green; - --bgColorHover: darken(@green, 5); - color: @crust !important; - } - - .cc-button-secondary { - --bgColor: @surface0; - --bgColorHover: darken(@surface0, 5); - color: @text !important; - } - - .clock-component.clock-black { - background: @surface0; - } - - .clock-component.clock-white { - background: @text; - } - - .highlight { - background: @peach !important; - } - - .hint { - background-color: @overlay1; - filter: drop-shadow(0 0 1px @crust); - } - - .capture-hint { - background-color: @overlay1; - filter: drop-shadow(0 0 1px @crust); - z-index: -1; - } - - .modal-game-over-header-grey { - background-color: @base; - } - - .modal-content-component.modal-content-light { - background-color: @base; - } - - .modal-game-over-user-winner-active { - border-color: @lavender; - } - - .modal-game-over-user-crown { - background: @lavender; - } - - .placeholder-ad-upgrade { - background-color: @accent-color; - } - - .placeholder-ad-link { - color: @crust; - } - - div.mode-selection-button-selected > .mode-selection-button-description { - color: @surface1; - } - - div.mode-selection-button-selected > .mode-selection-button-mode { - color: @mantle; - } - - /* crowns */ - img.crowns-full-crown { - /* this selects the crown, but tbh its not easy to rotate-hue an svg to an exact color. we might make more svgs for the crowns? */ - } - - /* Board */ - .board { - background-image: url("https://media.githubusercontent.com/media/catppuccin/userstyles/main/styles/chess.com/assets/@{lookup}/@{accent}.png") !important; - } - - .game-preview-legacy-component { - background-image: url("https://media.githubusercontent.com/media/catppuccin/userstyles/main/styles/chess.com/assets/@{lookup}/@{accent}.png") !important; - } - - /* Black Pieces */ - .piece.bp { - background-image: @bp !important; - } - - .piece.bn { - background-image: @bn !important; - } - - .piece.bb { - background-image: @bb !important; - } - - .piece.br { - background-image: @br !important; - } - - .piece.bk { - background-image: @bk !important; - } - - .piece.bq { - background-image: @bq !important; - } - - /* -- Previews */ - .game-preview-legacy-piece[alt="bb"] { - content: @bb !important; - } - - .game-preview-legacy-piece[alt="bk"] { - content: @bk !important; - } - - .game-preview-legacy-piece[alt="bn"] { - content: @bn !important; - } - - .game-preview-legacy-piece[alt="bp"] { - content: @bp !important; - } - - .game-preview-legacy-piece[alt="bq"] { - content: @bq !important; - } - - .game-preview-legacy-piece[alt="br"] { - content: @br !important; - } - - .game-preview-legacy-piece[alt="wb"] { - content: @wb !important; - } - - .game-preview-legacy-piece[alt="wk"] { - content: @wk !important; - } - - .game-preview-legacy-piece[alt="wn"] { - content: @wn !important; - } - - .game-preview-legacy-piece[alt="wp"] { - content: @wp !important; - } - - .game-preview-legacy-piece[alt="wq"] { - content: @wq !important; - } - - .game-preview-legacy-piece[alt="wr"] { - content: @wr !important; - } - - /* White Pieces */ - .piece.wp { - background-image: @wp !important; - } - - .piece.wn { - background-image: @wn !important; - } - - .piece.wb { - background-image: @wb !important; - } - - .piece.wr { - background-image: @wr !important; - } - - .piece.wk { - background-image: @wk !important; - } - - .piece.wq { - background-image: @wq !important; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/chess.com/catppuccin.user.less b/styles/chess.com/catppuccin.user.less new file mode 100644 index 0000000000..e4b47d4a8e --- /dev/null +++ b/styles/chess.com/catppuccin.user.less @@ -0,0 +1,740 @@ +/* ==UserStyle== +@name Chess.com Catppuccin +@namespace github.com/catppuccin/userstyles/styles/chess.com +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/chess.com +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/chess.com/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Achess.com +@description Soothing pastel theme for Chess.com +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] + +@var select highlightColor1 "Highlight 1" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red*", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +@var select highlightColor2 "Highlight 2" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green*", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +@var select highlightColor3 "Highlight 3" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red", "maroon:Maroon", "peach:Peach*", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +@var select highlightColor4 "Highlight 4" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue*", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +@var checkbox styleBoardAndPieces "Style Board & Pieces" 1 +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("chess.com") { + .light-mode { + #catppuccin(@lightFlavor); + } + + .dark-mode { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + @highlight1: @catppuccin[@@flavor][@@highlightColor1]; + @highlight2: @catppuccin[@@flavor][@@highlightColor2]; + @highlight3: @catppuccin[@@flavor][@@highlightColor3]; + @highlight4: @catppuccin[@@flavor][@@highlightColor4]; + + --color-bg-opaque: @mantle; + --color-bg-opaque-lighter: @base; + --color-bg-subtle: @surface1; + --color-bg-subtler: @surface0; + --color-bg-input: @mantle; + --color-bg-speech: @surface0; + --color-bg-secondary: @surface0; + --color-bg-tertiary: @surface1; + --color-bg-quaternary: @surface2; + --color-gray-100: @overlay1; + --color-text-speech: @text; + + --color-icon-default: @subtext0; + --color-icon-default-hovered: @subtext1; + --color-icon-bolder: @subtext1; + --color-icon-boldest: @text; + + --color-text-boldest: @text; + --color-text-bolder: @text; + --color-text-default: @text; + --color-text-default-hovered: @subtext1; + --color-text-subtle: @subtext1; + --color-text-placeholder: @subtext0; + --color-text-inverse: @crust; + --color-text-link: @blue; + --color-text-link-hovered: @sky; + + --color-border-default: @surface1; + --color-border-subtle: @overlay2; + --color-border-selected: @accent; + + --color-green-200: lighten(@accent, 5%); + --color-green-300: @accent; + --color-green-400: darken(@accent, 5%); + + --color-red-300: @red; /* Danger */ + --color-red-400: @red; /* Danger */ + + /* Links */ + --color-blue-200: @sapphire; + --color-blue-300: @sky; + --color-blue-400: @blue; + + --color-classification-blunder: @red; + --color-classification-miss: @maroon; + --color-classification-mistake: @peach; + --color-classification-inaccuracy: @yellow; + --color-classification-best: @green; + --color-classification-excellent: @green; + --color-classification-good: @teal; + --color-classification-great: @blue; + --color-classification-brilliant: @sapphire; + --color-classification-book: @rosewater; + + --color-icon-win: @green; + --color-text-win: @green; + --color-icon-draw: @subtext0; + --color-text-draw: @subtext0; + --color-bg-draw: @subtext0; + --color-border-draw: var(--color-transparent-white-10); + --color-icon-loss: @red; + --color-text-loss: @red; + --color-border-loss: @red; + + --color-icon-bullet: @peach; + --color-icon-blitz: @yellow; + + body { + --theme-background-color: @base !important; + --theme-background-image: none; + + --globalBackground: @mantle !important; + --globalBackgroundOpaque: @mantle !important; + --globalSecondaryBackground: @crust !important; + --globalTertiaryBackground: @surface0 !important; + --globalAccentBackground: @accent !important; + --globalSecondaryAccentBackground: @surface0 !important; + --globalSiteBackground: @base !important; + --globalBorder: @surface0 !important; + --globalColorThemeFull: @text !important; + --globalColorThemeHigh: @text; + --globalColorThemeMid: @overlay2 !important; + --globalColorThemeLow: @overlay0 !important; + --globalColorThemeLower: @base !important; + --globalColorThemeLink: @sapphire !important; + --globalColorThemeBlueToMid: @text; + --globalOverlayBackground: @base !important; + --globalColorWin: @green !important; + --globalColorDraw: @accent !important; + --globalColorLoss: @red !important; + + --labelBgColor: @surface1; + --activeLabelColor: @accent; + --buttonBgColor: @text; + + --nodeColor: @text; + --nodeBackground: @yellow; + } + + /* Home page */ + .index-title, + .index-info-item-counter { + color: @text !important; + } + .index-info-item { + color: @subtext0 !important; + } + .index-suggestion-title, + .index-posts-title, + .index-post-name { + color: @text; + } + .index-quote-author, + .index-quote-body, + .index-post-author { + color: @subtext1; + } + + .promo-title, + .promo-rank { + color: @text; + } + .promo-subtitle { + color: @subtext1; + } + + .home-username-link { + color: @text; + } + + /* Lessons page */ + .level-title { + color: @text; + } + .level-desc, + .course-header-description strong { + color: @subtext1; + } + + .lessons-search-filter { + .form-dropdown-chevron, + .form-dropdown-control-label, + .form-dropdown-value { + color: @subtext1; + } + } + + /* Play lesson video */ + .lesson-status { + background-color: @text; + } + + /* More page */ + .landing-header { + color: @text; + } + + /* UI */ + .v5-title-label { + color: @text; + } + .v5-tabs-list, + .v5-tabs-list-dark { + --borderColor: @surface2; + --tabTitleColor: @subtext0; + --tabHoverTitleColor: @subtext1; + --tabSelectedBorderColor: @subtext1; + --tabSelectedTitleColor: @text; + } + .ui_v5-input-component { + --borderColor: @surface0; + --borderFocus: @surface1; + --bgColor: @base; + --textColor: @text; + --secondaryTextColor: @subtext1; + } + .ui_v5-input-group-component { + --inputIconColor: @subtext0; + } + .ui_v5-button-component { + --boxShadow: none; + --boxShadowHover: none; + box-shadow: none; + + &.ui_v5-button-basic { + --basicColor: @text !important; + --basicHoverColor: @text !important; + --basicBgColor: @surface1 !important; + --basicBghover: @surface2 !important; + --borderColor: @surface0 !important; + } + + &.ui_v5-button-primary { + color: @crust !important; + background-color: @accent; + + &:hover { + background-color: darken(@accent, 5%); + box-shadow: none; + } + } + } + .ui_v5-select-component { + --borderColor: @surface0; + --borderFocus: @surface1; + --bgColor: @base; + --textColor: @text; + --arrowColor: @subtext0; + } + + .ui_pagination-item-component { + --paginationColor: @text; + --paginationBgColor: @surface1; + --paginationBgHover: @surface2; + --paginationColorMuted: @base; + --paginationBgColorMuted: @overlay1; + } + + .nav-link-text { + color: @text !important; + } + .nav-menu-area:last-of-type .icon-font-chess { + color: @mantle !important; + } + .nav-link-main-design, + .nav-link-main-link { + color: @text !important; + + &:hover { + color: @subtext1 !important; + } + } + + #tb { + .toolbar-action-icon { + color: @subtext1; + } + + .toolbar-action-wrapper:hover .toolbar-action-icon { + color: @text !important; + } + } + + #sb { + color: @subtext0; + + &.open { + background-color: @mantle; + } + + .nav-action:hover { + background-color: @surface0; + color: @text; + } + + .nav-panel-shade, + .nav-panel-theme-bg, + .nav-action.has-popover + .nav-popover { + background: @mantle !important; + } + + .nav-popover.dark .btn-link { + color: @text; + } + .nav-menu-area:last-of-type { + color: @text !important; + } + .nav-popover.nav-search { + --search-bg-color: @surface0; + } + } + + .nav-popover.dark { + background: @mantle; + } + + .section-heading-component .back-link-component { + color: currentcolor; + } + .section-heading-black { + background-color: @surface1; + color: @text; + } + .nav-section-header-component { + background-color: @base; + color: @text; + } + + .popover-friends-header, + .popover-friends-content, + .popover-messages-header, + .popover-messages-content, + .popover-settings-header, + .popover-settings-content { + background: @mantle; + } + + /* Buttons */ + + .selector-button-button, + .time-selector-button-button { + background: @surface0; + + &:hover { + background: @surface1; + } + } + + .cc-switch-checkbox:not(.cc-switch-readonly):checked + + .cc-switch-label + .cc-switch-button { + background-color: @surface1; + } + + .cc-button-component, + .cc-button-primary { + --bgColor: @accent; + --bgColorHover: darken(@accent, 5%); + --textColor: @crust; + --textColorHover: @crust; + box-shadow: none; + } + + .cc-button-primary, + .cc-button-monetization { + --borderBottomLine: darken(@accent, 2%); + --borderBottomLineHover: darken(@accent, 4%); + } + + .cc-button-secondary { + --bgColor: @surface0; + --bgColorHover: darken(@surface0, 5%); + --iconColor: @text; + --iconColorHover: @text; + --textColor: @text; + --textColorHover: @text; + } + + .cc-button-danger { + --bgColor: @red; + --bgColorHover: darken(@red, 5%); + color: @crust; + } + + .v5-section-shadow, + .v5-section-shadow-hover { + --linkHoverBackground: @surface1; + --linkBoxShadow: 0 0.5rem 0 0 @surface2; + } + + /* Game */ + + .user-username-component, + .cc-user-username-white, + .cc-user-rating-white { + color: @text; + text-shadow: none; + } + + .user-tagline-rating.user-tagline-white { + color: @overlay1; + } + + .clock-component.clock-black { + background: @surface0; + } + .clock-component.clock-white { + background: @text; + } + + .highlight { + &[style*="rgb(235, 97, 80)"] { + background: fade(@highlight1, 80%) !important; + } + &[style*="rgb(172, 206, 89)"] { + background: fade(@highlight2, 80%) !important; + } + &[style*="rgb(255, 170, 0)"] { + background: fade(@highlight3, 80%) !important; + } + &[style*="rgb(82, 176, 220)"] { + background: fade(@highlight4, 80%) !important; + } + opacity: 1 !important; + } + .hover-square rect { + stroke: @overlay1 !important; + } + .hint { + background-color: @overlay1; + filter: drop-shadow(0 0 1px @crust); + } + .capture-hint { + background-color: @overlay1; + filter: drop-shadow(0 0 1px @crust); + z-index: -1; + } + + /* Review/evaluation */ + + .evaluation-bar-bar { + .evaluation-bar-black { + background-color: @surface2; + } + .evaluation-bar-draw { + background-color: @overlay1; + } + .evaluation-bar-white { + background-color: @text; + } + } + + .review-rating-white { + background-color: @text; + } + .review-rating-black { + background-color: @surface0; + color: @text; + } + + .overview-view-new-game-button { + background-color: @surface1; + } + + .arrow { + &[style*="rgba(248, 85, 63, 0.8)"] { + fill: @highlight1 !important; + } + &[style*="rgba(159, 207, 63, 0.8)"] { + fill: @highlight2 !important; + } + &[style*="rgba(255, 170, 0, 0.8)"] { + fill: @highlight3 !important; + } + &[style*="rgba(72, 193, 249, 0.8)"] { + fill: @highlight4 !important; + } + } + + g#winner [fill="#dbac16"] { + fill: @yellow !important; + } + + /* Game over */ + + .modal-game-over-header-grey, + .modal-game-over-header-black-win, + .game-over-header-component { + background-color: @base; + color: @text; + } + + .modal-game-over-user-winner-active, + .modal-game-over-user-crown { + background: @lavender; + } + + .game-over-review-button-label { + color: @crust; + text-shadow: none; + } + + /* Ads */ + + .placeholder-ad-upgrade { + background-color: @accent; + } + .placeholder-ad-link { + color: @crust; + } + + .modal-trial-component.modal-trial-special-offer { + .modal-trial-header-background { + background-color: @accent; + } + } + + .coach-nudges-modal-component { + background: @mantle; + } + + .ready-to-play-banner-component { + background-color: @mantle; + + .ready-to-play-banner-title, + .ready-to-play-banner-list { + color: @text; + } + } + + .notifications-links-trial .nav-link-text { + color: @crust !important; + } + + /* Misc */ + + /* GM/IM/etc badge */ + --color-bg-chesstitle: @accent; + .course-author-title, + .course-header-author-title, + .form-dropdown-short-title, + .index-chess-title, + .leaderboard-index-chess-title, + .player-header-title, + .category-headline-chess-title { + color: @crust !important; + } + + .tooltip-body { + background: @surface0; + color: @text; + + &::after { + border-top-color: @surface0 !important; + } + } + .popup-component { + background-color: @surface0; + color: @text; + &.popup-left .popup-arrow { + border-left-color: @surface0; + } + &.popup-right .popup-arrow { + border-right-color: @surface0; + } + } + + /* Error banner */ + .alerts-alert { + color: @crust; + } + + div.mode-selection-button-selected { + > .mode-selection-button-description { + color: @surface1; + } + + > .mode-selection-button-mode { + color: @mantle; + } + } + + .status-component { + background-color: @accent; + color: @crust; + } + + .navigation-footer-page-component, + .navigation-footer-platform-icon { + color: @subtext1; + text-shadow: none; + } + + .download-button-button { + color: @crust !important; + } + + .table-hover tbody tr:hover { + background-color: @surface2; + } + + /* Board */ + @light-cell: @catppuccin[@mocha][@text]; + @dark-cell: @catppuccin[@mocha][@@accentColor]; + + @board: escape( + '' + ); + + & when (@styleBoardAndPieces = 1) { + #board-play-computer, + .board.theme-selector-preview-board, + .fade-in-overlay { + background-image: url("data:image/svg+xml,@{board}") !important; + } + + /* Coordinates - Inside */ + .coordinate-light { + fill: @dark-cell; + } + .coordinate-dark { + fill: @light-cell; + } + /* Coordinates - Outside */ + .coordinate-grey { + fill: @subtext0; + } + } + + #piece(@piece, @type) { + @border: @catppuccin[@mocha][@base]; + @darkest: if( + @type = black, + @catppuccin[@mocha][@base], + @catppuccin[@mocha][@text] + ); + @darker: if( + @type = black, + @catppuccin[@mocha][@surface0], + @catppuccin[@mocha][@subtext1] + ); + @main: if( + @type = black, + @catppuccin[@mocha][@surface1], + @catppuccin[@mocha][@subtext0] + ); + @lighter: if( + @type = black, + @catppuccin[@mocha][@surface2], + @catppuccin[@mocha][@overlay2] + ); + @lightest: if( + @type = black, + @catppuccin[@mocha][@overlay0], + @catppuccin[@mocha][@overlay1] + ); + + @bishop: ''; + @king: ''; + @knight: ''; + @rook: ''; + @pawn: ''; + @queen: ''; + + @svg: escape(@@piece); + @result: url("data:image/svg+xml,@{svg}"); + } + + .board-popover-component { + background-color: @surface0; + } + + & when (@styleBoardAndPieces = 1) { + --theme-board-style-image: url("data:image/svg+xml,@{board}"); + --theme-board-style-highlight-color: @highlight1; + + --theme-piece-set-wp: #piece(pawn, white)[]; + --theme-piece-set-wn: #piece(knight, white)[]; + --theme-piece-set-wr: #piece(rook, white)[]; + --theme-piece-set-wb: #piece(bishop, white)[]; + --theme-piece-set-wq: #piece(queen, white)[]; + --theme-piece-set-wk: #piece(king, white)[]; + --theme-piece-set-bp: #piece(pawn, black)[]; + --theme-piece-set-bn: #piece(knight, black)[]; + --theme-piece-set-bb: #piece(bishop, black)[]; + --theme-piece-set-br: #piece(rook, black)[]; + --theme-piece-set-bq: #piece(queen, black)[]; + --theme-piece-set-bk: #piece(king, black)[]; + + .piece { + /* Black */ + &.bp { + background-image: #piece(pawn, black)[] !important; + } + &.bn { + background-image: #piece(knight, black)[] !important; + } + &.bb { + background-image: #piece(bishop, black)[] !important; + } + &.br { + background-image: #piece(rook, black)[] !important; + } + &.bk { + background-image: #piece(king, black)[] !important; + } + &.bq { + background-image: #piece(queen, black)[] !important; + } + + /* White */ + &.wp { + background-image: #piece(pawn, white)[] !important; + } + &.wn { + background-image: #piece(knight, white)[] !important; + } + &.wb { + background-image: #piece(bishop, white)[] !important; + } + &.wr { + background-image: #piece(rook, white)[] !important; + } + &.wk { + background-image: #piece(king, white)[] !important; + } + &.wq { + background-image: #piece(queen, white)[] !important; + } + } + } + + .chessboard-pkg-move-list-component .dark-row { + background-color: @surface1; + } + } +} diff --git a/styles/chess.com/generate.py b/styles/chess.com/generate.py deleted file mode 100755 index d7702d09d2..0000000000 --- a/styles/chess.com/generate.py +++ /dev/null @@ -1,37 +0,0 @@ -#!/usr/bin/env uv run -# /// script -# requires-python = ">=3.11" -# dependencies = [ -# "boardinator==0.1.0", -# "catppuccin==2.1.0", -# ] -# /// -from os import path -from catppuccin import PALETTE -from boardinator.boardinator import replace_colors - -cwd = path.normpath(path.dirname(__file__)) - -for flavor in PALETTE: - for color in flavor.colors: - if not color.accent: - continue - color_dict = { - # Light grayish yellow green - (237, 238, 209): ( - flavor.colors.base.rgb.r, - flavor.colors.base.rgb.g, - flavor.colors.base.rgb.b, - ), - # Dark grayish yellow green - (119, 153, 82): ( - color.rgb.r, - color.rgb.g, - color.rgb.b, - ), - } - replace_colors( - image_path=f"{cwd}/assets/base/colorboard.png", - output_path=f"{cwd}/assets/{flavor.identifier}/{color.identifier}.png", - color_dict=color_dict, - ) diff --git a/styles/chess.com/preview.webp b/styles/chess.com/preview.webp deleted file mode 100644 index 7618bb8906..0000000000 --- a/styles/chess.com/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:222cc0947504de46fe00a085110efc78f6fa53ce9b44789765ca3947802b3f45 -size 150756 diff --git a/styles/cinny/README.md b/styles/cinny/README.md index 32c4aa69e0..f1d14d34d9 100644 --- a/styles/cinny/README.md +++ b/styles/cinny/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Sena](https://github.com/jn-sena) +- [jn-sena](https://github.com/jn-sena)   diff --git a/styles/cinny/catppuccin.user.css b/styles/cinny/catppuccin.user.less similarity index 55% rename from styles/cinny/catppuccin.user.css rename to styles/cinny/catppuccin.user.less index 2b65eb4143..fe025d7165 100644 --- a/styles/cinny/catppuccin.user.css +++ b/styles/cinny/catppuccin.user.less @@ -2,8 +2,8 @@ @name Cinny Catppuccin @namespace github.com/catppuccin/userstyles/styles/cinny @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/cinny -@version 2.3.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/cinny/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/cinny/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acinny @description Soothing pastel theme for Cinny @author Catppuccin @@ -15,120 +15,30 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain("cinny.in") { - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } +@-moz-document domain("cinny.in") { + @import url("https://prismjs.catppuccin.com/variables.important.css"); + code .token { + opacity: 1 !important; + } - /* Backgrounds */ - --bg-surface: @base; - --bg-surface-transparent: fade(@base, 0%); - --bg-surface-low: @mantle; - --bg-surface-low-transparent: fade(@mantle, 0%); - --bg-surface-extra-low: @crust; - --bg-surface-extra-low-transparent: fade(@crust, 0%); - --bg-surface-border: fade(@crust, 20%); - --bg-surface-hover: @surface0; - --bg-surface-active: @surface1; - --bg-overlay: fade(@crust, 60%); - --bg-overlay-low: fade(@crust, 80%); - --bg-primary: @accent-color; - --bg-primary-hover: fade(@accent-color, 80%); - --bg-primary-active: fade(@accent-color, 70%); - --bg-primary-border: fade(@accent-color, 38%); - --bg-tooltip: @surface0; - --bg-badge: @lavender; - --bg-positive: @green; - --bg-positive-hover: fade(@green, 8%); - --bg-positive-active: fade(@green, 15%); - --bg-positive-border: fade(@green, 40%); - --bg-caution: @peach; - --bg-caution-hover: fade(@peach, 8%); - --bg-caution-active: fade(@peach, 15%); - --bg-caution-border: fade(@peach, 40%); - --bg-danger: @maroon; - --bg-danger-hover: fade(@maroon, 5%); - --bg-danger-active: fade(@maroon, 10%); - --bg-danger-border: fade(@maroon, 20%); - --bg-ping: fade(@green, 40%); - --bg-ping-hover: fade(@green, 50%); + :root, + .silver-theme { + #catppuccin(@lightFlavor); + } - /* Texts */ - --tc-surface-high: @text; - --tc-surface-normal: @text; - --tc-surface-normal-low: @subtext1; - --tc-surface-low: @subtext0; - --tc-primary-high: @crust; - --tc-primary-normal: @text; - --tc-primary-low: @subtext1; - --tc-tooltip: @subtext0; - --tc-code: @mauve; - --tc-link: @rosewater; - --tc-badge: @crust; - --tc-positive-high: @green; - --tc-positive-normal: @green; - --tc-positive-low: @green; - --tc-caution-high: @peach; - --tc-caution-normal: @peach; - --tc-caution-low: @peach; - --tc-danger-high: @maroon; - --tc-danger-normal: @maroon; - --tc-danger-low: @maroon; + .dark-theme, + .butter-theme { + #catppuccin(@darkFlavor); + } - /* Icons */ - --ic-surface-high: @text; - --ic-surface-normal: @text; - --ic-surface-low: @subtext1; - --ic-primary-high: @crust; - --ic-primary-normal: @crust; - --ic-primary-low: @crust; - --ic-positive-high: @green; - --ic-positive-normal: @maroon; - --ic-caution-high: @peach; - --ic-caution-normal: @peach; - --ic-danger-high: @maroon; - --ic-danger-normal: @maroon; + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); - /* Users */ + /* Legacy user colors */ --mx-uc-1: @blue; --mx-uc-2: @pink; --mx-uc-3: @teal; @@ -165,10 +75,10 @@ --oq6d07j: @base; - --oq6d07k: fade(@accent-color, 50%); - --oq6d07l: fade(@accent-color, 40%); - --oq6d07m: fade(@accent-color, 30%); - --oq6d07n: fade(@accent-color, 20%); + --oq6d07k: fade(@accent, 50%); + --oq6d07l: fade(@accent, 40%); + --oq6d07m: fade(@accent, 30%); + --oq6d07n: fade(@accent, 20%); --oq6d07o: @text; --oq6d07p: @subtext1; @@ -181,7 +91,7 @@ --oq6d07v: @surface1; --oq6d07w: @surface2; --oq6d07x: @overlay0; - --oq6d07y: @subtext0; + --oq6d07y: @text; --oq6d07z: fade(@green, 90%); --oq6d0710: fade(@green, 95%); @@ -222,24 +132,9 @@ --oq6d071v: fade(@crust, 60%); } - /* Syntax highlighting */ - body.prism-light, - &.prism-light, - &.prism-dark { - --prism-comment: @overlay0; - --prism-punctuation: @sky; - --prism-property: @yellow; - --prism-boolean: @peach; - --prism-selector: @green; - --prism-operator: @sky; - --prism-atrule: @pink; - --prism-keyword: @mauve; - --prism-regex: @maroon; - } - /* Search results */ - ._1m2qi7rn { - background-color: @accent-color; + ._1m2qi7rq { + background-color: @accent; color: @base; } @@ -258,25 +153,77 @@ background-color: @base; } - } - :root, - .silver-theme { - #catppuccin(@lightFlavor, @accentColor); - } + /* I don't think these actually do anything anymore, but they are + still defined in the app. They _might_ be removed in a future release. */ - .dark-theme, - .butter-theme { - #catppuccin(@darkFlavor, @accentColor); - } -} + /* Backgrounds */ + --bg-surface: @base; + --bg-surface-transparent: fade(@base, 0%); + --bg-surface-low: @mantle; + --bg-surface-low-transparent: fade(@mantle, 0%); + --bg-surface-extra-low: @crust; + --bg-surface-extra-low-transparent: fade(@crust, 0%); + --bg-surface-border: fade(@crust, 20%); + --bg-surface-hover: @surface0; + --bg-surface-active: @surface1; + --bg-overlay: fade(@crust, 60%); + --bg-overlay-low: fade(@crust, 80%); + --bg-primary: @accent; + --bg-primary-hover: fade(@accent, 80%); + --bg-primary-active: fade(@accent, 70%); + --bg-primary-border: fade(@accent, 38%); + --bg-tooltip: @surface0; + --bg-badge: @lavender; + --bg-positive: @green; + --bg-positive-hover: fade(@green, 8%); + --bg-positive-active: fade(@green, 15%); + --bg-positive-border: fade(@green, 40%); + --bg-caution: @peach; + --bg-caution-hover: fade(@peach, 8%); + --bg-caution-active: fade(@peach, 15%); + --bg-caution-border: fade(@peach, 40%); + --bg-danger: @maroon; + --bg-danger-hover: fade(@maroon, 5%); + --bg-danger-active: fade(@maroon, 10%); + --bg-danger-border: fade(@maroon, 20%); + --bg-ping: fade(@green, 40%); + --bg-ping-hover: fade(@green, 50%); -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} + /* Texts */ + --tc-surface-high: @text; + --tc-surface-normal: @text; + --tc-surface-normal-low: @subtext1; + --tc-surface-low: @subtext0; + --tc-primary-high: @crust; + --tc-primary-normal: @text; + --tc-primary-low: @subtext1; + --tc-tooltip: @subtext0; + --tc-code: @mauve; + --tc-link: @blue; + --tc-badge: @crust; + --tc-positive-high: @green; + --tc-positive-normal: @green; + --tc-positive-low: @green; + --tc-caution-high: @peach; + --tc-caution-normal: @peach; + --tc-caution-low: @peach; + --tc-danger-high: @maroon; + --tc-danger-normal: @maroon; + --tc-danger-low: @maroon; -// vim:ft=less + /* Icons */ + --ic-surface-high: @text; + --ic-surface-normal: @text; + --ic-surface-low: @subtext1; + --ic-primary-high: @crust; + --ic-primary-normal: @crust; + --ic-primary-low: @crust; + --ic-positive-high: @green; + --ic-positive-normal: @maroon; + --ic-caution-high: @peach; + --ic-caution-normal: @peach; + --ic-danger-high: @maroon; + --ic-danger-normal: @maroon; + } +} diff --git a/styles/cinny/preview.webp b/styles/cinny/preview.webp deleted file mode 100644 index 50392ab14d..0000000000 --- a/styles/cinny/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:9d064d47f4799db15b55da3a2933a6659ee0bae9118073cccdbf73ed036d5463 -size 168466 diff --git a/styles/claude/README.md b/styles/claude/README.md new file mode 100644 index 0000000000..c64d398cfb --- /dev/null +++ b/styles/claude/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Claude + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [ruiiiijiiiiang](https://github.com/ruiiiijiiiiang) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/claude/catppuccin.user.less b/styles/claude/catppuccin.user.less new file mode 100644 index 0000000000..8c08642295 --- /dev/null +++ b/styles/claude/catppuccin.user.less @@ -0,0 +1,231 @@ +/* ==UserStyle== +@name Claude Catppuccin +@namespace github.com/catppuccin/userstyles/styles/claude +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/claude +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/claude/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aclaude +@description Soothing pastel theme for Claude +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("claude.ai") { + :root[data-color-version="v2"] { + &[data-mode="dark"] { + #catppuccin(@darkFlavor); + } + &[data-mode="light"] { + #catppuccin(@lightFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --accent-brand: #hslify(@accent)[]; + --accent-000: #hslify(@accent)[]; + --accent-100: #hslify(@accent)[]; + --accent-200: #hslify(lighten(@accent, 5%))[]; + --accent-900: #hslify(darken(@accent, 10%))[]; + --accent-main-000: #hslify(@accent)[]; + --accent-main-100: #hslify(@accent)[]; + --accent-main-200: #hslify(@accent)[]; + --accent-main-900: #hslify(@accent)[]; + --accent-pro-000: #hslify(@accent)[]; + --accent-pro-100: #hslify(@accent)[]; + --accent-pro-200: #hslify(@accent)[]; + --accent-pro-900: #hslify(@accent)[]; + --accent-secondary-000: #hslify(@accent)[]; + --accent-secondary-100: #hslify(@accent)[]; + --accent-secondary-200: #hslify(@accent)[]; + --accent-secondary-900: #hslify(@accent)[]; + --bg-000: #hslify(@surface0)[]; + --bg-100: #hslify(@base)[]; + --bg-200: #hslify(@mantle)[]; + --bg-300: #hslify(@surface0)[]; + --bg-400: #hslify(@surface1)[]; + --bg-500: #hslify(@surface2)[]; + --brand-000: #hslify(@accent)[]; + --brand-100: #hslify(lighten(@accent, 5%))[]; + --brand-200: #hslify(lighten(@accent, 5%))[]; + --brand-900: #hslify(@crust)[]; + --border-000: #hslify(@base)[]; + --border-100: #hslify(@crust)[]; + --border-200: #hslify(@crust)[]; + --border-300: #hslify(@overlay0)[]; + --border-400: #hslify(@overlay1)[]; + --border-500: #hslify(@overlay2)[]; + --danger-000: #hslify(@maroon)[]; + --danger-100: #hslify(@red)[]; + --danger-200: #hslify(@red)[]; + --danger-900: #hslify(@pink)[]; + --oncolor-000: #hslify(darken(@mantle, 5%))[]; + --oncolor-100: #hslify(@mantle)[]; + --oncolor-200: #hslify(@mantle)[]; + --oncolor-300: #hslify(lighten(@mantle, 5%))[]; + --success-000: #hslify(@green)[]; + --success-100: #hslify(lighten(@green, 5%))[]; + --success-200: #hslify(lighten(@green, 5%))[]; + --success-900: #hslify(lighten(@green, 15%))[]; + --text-000: #hslify(darken(@text, 5%))[]; + --text-100: #hslify(@text)[]; + --text-200: #hslify(@text)[]; + --text-300: #hslify(@subtext0)[]; + --text-400: #hslify(@subtext1)[]; + --text-500: #hslify(@subtext0)[]; + --warning-000: #hslify(@yellow)[]; + --warning-100: #hslify(lighten(@yellow, 5%))[]; + --warning-200: #hslify(lighten(@yellow, 5%))[]; + --warning-900: #hslify(lighten(@yellow, 15%))[]; + + /* Side bar */ + nav.\!bg-bg-200 { + background: @mantle !important; + } + + /* Code blocks */ + .code-block__code { + background: @crust !important; + + code { + /* Default color */ + span { + color: @text !important; + } + + /* Green */ + span.token[style="color: rgb(152, 195, 121);"] { + color: @green !important; + } + + /* Yellow */ + span.token[style="color: rgb(209, 154, 102);"] { + color: @yellow !important; + } + + /* Blue */ + span.token[style="color: rgb(97, 175, 239);"] { + color: @blue !important; + } + + /* Red */ + span.token[style="color: rgb(224, 108, 117);"] { + color: @red !important; + } + + /* Magenta */ + span.token[style="color: rgb(198, 120, 221);"] { + color: @mauve !important; + } + + /* Gray */ + span.token[style="color: rgb(171, 178, 191);"] { + color: @overlay2 !important; + } + } + } + + /* Inline code */ + code.text-danger-000 { + color: @accent !important; + } + + /* Tooltip */ + div.bg-black\/80 { + background: @crust !important; + } + div.text-white { + color: @text !important; + } + + /* Logo */ + div.text-\[\#D97757\] { + color: @accent !important; + } + + /* "New chat" plus icon */ + div.text-always-white svg { + color: @base !important; + } + + /* "Subscribe to Pro" and "Create Team Account" buttons */ + button.bg-accent-pro-100 > span.inline-block { + color: @base !important; + } + + /* Pay monthly/annually buttons */ + button.bg-accent-secondary-900 { + span.text-text-000 { + color: @base !important; + } + span.text-text-300 { + color: @surface2 !important; + } + div.bg-accent-secondary-000 { + background: darken(@accent, 15%) !important; + } + } + + /* Delete conversation button */ + div.\!text-danger-000.\[\&\[data-highlighted\]\]\:bg-danger-900[data-highlighted] { + background: fade(@red, 20%) !important; + } + + /* Checkbox */ + input[type="checkbox"] + div.bg-bg-000 { + background: @text !important; + } + + /* "Add writing example" button */ + button.\!text-accent-secondary-100.bg-accent-secondary-900 { + color: @base !important; + &:hover { + color: @text !important; + } + } + + /* "Describe your style" list */ + button.\!bg-accent-secondary-900.text-accent-secondary-000 { + color: @base !important; + } + + /* "Be as descriptive as possible..." helper text */ + div.bg-accent-secondary-900.text-text-200 { + color: @base !important; + } + + /* "Preview with an example..." pills */ + button.hover\:bg-accent-secondary-900.hover\:text-accent-secondary-000 { + color: @accent !important; + &:hover { + color: @base !important; + } + } + + /* "Previewing with ..." dropdown button */ + button.\!text-accent-secondary-100.hover\:\!bg-accent-secondary-900 { + color: @accent !important; + &:hover { + color: @base !important; + } + } + + /* White background (e.g., toggle switch thumb) */ + .bg-white { + background-color: @text; + } + } +} + +#hslify(@color) { + @raw: e(%("%s %s% %s%", hue(@color), saturation(@color), lightness(@color))); +} diff --git a/styles/cobalt/README.md b/styles/cobalt/README.md index 9c29e5f5e7..31effbfe17 100644 --- a/styles/cobalt/README.md +++ b/styles/cobalt/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [keri](https://github.com/kerichdev) +- [kerichdev](https://github.com/kerichdev)   diff --git a/styles/cobalt/catppuccin.user.css b/styles/cobalt/catppuccin.user.css deleted file mode 100644 index 23533b2b61..0000000000 --- a/styles/cobalt/catppuccin.user.css +++ /dev/null @@ -1,92 +0,0 @@ -/* ==UserStyle== -@name cobalt Catppuccin -@namespace github.com/catppuccin/userstyles/styles/cobalt -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/cobalt -@version 0.1.0 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/cobalt/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acobalt -@description Soothing pastel theme for cobalt -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('cobalt.tools') { - :root[data-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); - } - :root[data-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --accent: @accent-color; - --accent-highlight: fade(@accent-color, 4%); - --accent-subtext: @text; - --accent-hover: @surface1; - --accent-hover-elevated: @surface2; - --accent-hover-transparent: fade(@surface1, 5%); - --accent-button: @surface0; - --accent-button-elevated: @surface1; - --glass: fade(@base, 85%); - --glass-lite: fade(@base, 98%); - --subbackground: @surface0; - --background: @base; - --background-backdrop: fade(@crust, 5%); - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/cobalt/catppuccin.user.less b/styles/cobalt/catppuccin.user.less new file mode 100644 index 0000000000..6b7c224ce3 --- /dev/null +++ b/styles/cobalt/catppuccin.user.less @@ -0,0 +1,105 @@ +/* ==UserStyle== +@name cobalt Catppuccin +@namespace github.com/catppuccin/userstyles/styles/cobalt +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/cobalt +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/cobalt/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acobalt +@description Soothing pastel theme for cobalt +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("cobalt.tools") { + [data-theme="dark"] { + #catppuccin(@darkFlavor); + } + [data-theme="light"] { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --primary: @base; + --secondary: @text; + --gray: @subtext0; + --blue: @blue; + --green: @green; + --red: @maroon; + --medium-red: @red; + --dark-red: @red; + --white: @crust; + --button: @surface0; + --button-hover: darken(@surface0, 5%); + --button-active-hover: darken(@subtext0, 5%); + --button-elevated: @surface1; + --button-elevated-hover: darken(@surface1, 5%); + --button-text: @text; + --sidebar-bg: @mantle; + --sidebar-hover: @surface0; + --sidebar-highlight: @text; + --input-border: @surface2; + --popup-bg: @mantle; + --toggle-bg-enabled: @accent; + + #donate-page { + --donate-gradient-start: @surface1 !important; + --donate-gradient-end: @surface0 !important; + } + + #banner-left { + color: @text; + } + + #banner-subtitle { + color: @subtext0; + opacity: 1; + } + + .donate-card button { + color: @text !important; + } + + .donate-card { + color: @text; + } + + .donate-card-title { + color: @text; + } + + .donate-card-subtitle { + color: @subtext0; + opacity: 1; + } + + #input-container.focused { + box-shadow: 0 0 0 2px @text inset !important; + } + + #input-dollar-sign { + color: @text; + } + + #donation-custom-input { + color: @text !important; + } + + #cobalt-logo path { + fill: @text; + } + + .sidebar-tab.active { + background-color: @accent !important; + } + } +} diff --git a/styles/cobalt/preview.webp b/styles/cobalt/preview.webp deleted file mode 100644 index 24542342dd..0000000000 --- a/styles/cobalt/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:b39566cb865648dcf86f0c0f609a0b41be0fbd877ca6e562158864a8646a4452 -size 31614 diff --git a/styles/codeberg/README.md b/styles/codeberg/README.md index 778b197d14..c8663c5ca1 100644 --- a/styles/codeberg/README.md +++ b/styles/codeberg/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Isabel](https://github.com/isabelroses) +- [isabelroses](https://github.com/isabelroses) ## ๐Ÿ’– Past Maintainer - [justTOBBI](https://github.com/justTOBBI) diff --git a/styles/codeberg/catppuccin.user.css b/styles/codeberg/catppuccin.user.css deleted file mode 100644 index 0a85237ea7..0000000000 --- a/styles/codeberg/catppuccin.user.css +++ /dev/null @@ -1,134 +0,0 @@ -/* ==UserStyle== -@name Codeberg Catppuccin -@namespace github.com/catppuccin/userstyles/styles/codeberg -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/codeberg -@version 1.1.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/codeberg/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acodeberg -@description Soothing pastel theme for Codeberg -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('codeberg.org') { - @import (css) - url("https://catppuccin.github.io/gitea/theme-catppuccin-@{lightFlavor}-@{accentColor}.css") - (prefers-color-scheme: light); - @import (css) - url("https://catppuccin.github.io/gitea/theme-catppuccin-@{darkFlavor}-@{accentColor}.css") - (prefers-color-scheme: dark); -} - -@-moz-document domain('codeberg.org') { - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - /* Base styles not needed, themed in upstream Gitea port. */ - - --color-body: @base; - --color-nav-text: @crust; - --color-nav-hover-bg: darken(@accent-color, 5%); - --color-secondary-nav-bg: @surface0; - --color-link: @blue; - --color-footer-text: @text; - - .ui.secondary.menu .dropdown.item:hover, - .ui.secondary.menu a.item:hover, - .ui.secondary.menu a.active.item:hover { - background-color: var(--color-nav-hover-bg); - color: var(--color-black); - } - - .ui.basic.red.buttons .button, - .ui.basic.red.button { - &:hover, - &:focus { - background-color: @red; - border-color: var(--color-light-border); - color: @crust; - } - } - - #codeberg-logo (@color) { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - #navbar-logo img { - #codeberg-logo(@crust); - } - .branding img { - #codeberg-logo(@text); - } - - footer { - .button:hover { - background-color: @accent-color; - color: @crust; - } - - a:hover { - color: @blue !important; - } - } - } - - @media (prefers-color-scheme: light) { - [data-theme="codeberg-dark"], - [data-theme="codeberg-light"], - [data-theme="codeberg-auto"] { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - [data-theme="codeberg-dark"], - [data-theme="codeberg-light"], - [data-theme="codeberg-auto"] { - #catppuccin(@darkFlavor, @accentColor); - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/codeberg/catppuccin.user.less b/styles/codeberg/catppuccin.user.less new file mode 100644 index 0000000000..61a3b6efdb --- /dev/null +++ b/styles/codeberg/catppuccin.user.less @@ -0,0 +1,109 @@ +/* ==UserStyle== +@name Codeberg Catppuccin +@namespace github.com/catppuccin/userstyles/styles/codeberg +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/codeberg +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/codeberg/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acodeberg +@description Soothing pastel theme for Codeberg +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("codeberg.org") { + @import (css) + url("https://catppuccin.github.io/gitea/theme-catppuccin-@{lightFlavor}-@{accentColor}.css") + (prefers-color-scheme: light); + @import (css) + url("https://catppuccin.github.io/gitea/theme-catppuccin-@{darkFlavor}-@{accentColor}.css") + (prefers-color-scheme: dark); +} + +@-moz-document domain("codeberg.org") { + [data-theme="codeberg-dark"], + [data-theme="codeberg-light"], + [data-theme="codeberg-auto"] { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + // #lib.defaults(); // Not needed, themed in upstream Gitea port. + + --color-body: @base; + --color-nav-text: @crust; + --color-nav-hover-bg: darken(@accent, 5%); + --color-secondary-nav-bg: @surface0; + --color-link: @blue; + --color-footer-text: @text; + + .ui.basic.red.buttons .button, + .ui.basic.red.button { + &:hover, + &:focus { + background-color: @red; + border-color: var(--color-light-border); + color: @crust; + } + } + + #codeberg-logo(@color) { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + .branding { + img[src^="https://design.codeberg.org/logo-kit/"] { + #codeberg-logo(@text); + } + } + + #navbar { + a#navbar-logo { + img { + #codeberg-logo(@base); + } + } + + .menu { + > a, button, details > summary { + color: @base; + } + + .donation-pretty { + --color-secondary-alpha-60: fade(darken(@accent, 10%), 60%) + !important; + + &:hover { + background: darken(@accent, 3%) !important; + } + } + } + } + + footer { + .button:hover { + background-color: @accent; + color: @crust; + } + + a:hover { + color: @blue !important; + } + } + } +} diff --git a/styles/codeberg/preview.webp b/styles/codeberg/preview.webp deleted file mode 100644 index e5190d7ffe..0000000000 --- a/styles/codeberg/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:2b65028faf3cc3f033987944220f1b0a5d25322606ca4cf630b41ffa35c45859 -size 1059076 diff --git a/styles/crates.io/README.md b/styles/crates.io/README.md index 0083912948..10a0778baf 100644 --- a/styles/crates.io/README.md +++ b/styles/crates.io/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/crates.io/catppuccin.user.css b/styles/crates.io/catppuccin.user.css deleted file mode 100644 index 8bce22c252..0000000000 --- a/styles/crates.io/catppuccin.user.css +++ /dev/null @@ -1,326 +0,0 @@ -/* ==UserStyle== -@name crates.io Catppuccin -@namespace github.com/catppuccin/userstyles/styles/crates.io -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/crates.io -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/crates.io/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acrates.io -@description Soothing pastel theme for crates.io -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('crates.io') { - @import url("https://unpkg.com/@catppuccin/highlightjs@0.2.2/css/catppuccin.variables.important.css"); - - code.hljs { - background: none !important; - } - - @media (prefers-color-scheme: light) { - :root[data-color-scheme="system"] { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root[data-color-scheme="system"] { - #catppuccin(@darkFlavor, @accentColor); - } - } - - :root[data-color-scheme="dark"] { - #catppuccin(@darkFlavor, @accentColor); - } - :root[data-color-scheme="light"] { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - --ctp-rosewater: #rgbify(@rosewater) []; - --ctp-flamingo: #rgbify(@flamingo) []; - --ctp-pink: #rgbify(@pink) []; - --ctp-mauve: #rgbify(@mauve) []; - --ctp-red: #rgbify(@red) []; - --ctp-maroon: #rgbify(@maroon) []; - --ctp-peach: #rgbify(@peach) []; - --ctp-yellow: #rgbify(@yellow) []; - --ctp-green: #rgbify(@green) []; - --ctp-teal: #rgbify(@teal) []; - --ctp-sky: #rgbify(@sky) []; - --ctp-sapphire: #rgbify(@sapphire) []; - --ctp-blue: #rgbify(@blue) []; - --ctp-lavender: #rgbify(@lavender) []; - --ctp-text: #rgbify(@text) []; - --ctp-subtext1: #rgbify(@subtext1) []; - --ctp-subtext0: #rgbify(@subtext0) []; - --ctp-overlay2: #rgbify(@overlay2) []; - --ctp-overlay1: #rgbify(@overlay1) []; - --ctp-overlay0: #rgbify(@overlay0) []; - --ctp-surface2: #rgbify(@surface2) []; - --ctp-surface1: #rgbify(@surface1) []; - --ctp-surface0: #rgbify(@surface0) []; - --ctp-base: #rgbify(@base) []; - --ctp-mantle: #rgbify(@mantle) []; - --ctp-crust: #rgbify(@crust) []; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - &, - * { - --shadow: none !important; - --csstools-color-scheme--dark: none; - - --header-bg-color: @mantle; - --main-color: @text; - --main-color-light: @subtext1; - --main-shadow-color: @surface0; - --main-bg: @mantle; - --main-bg-dark: @base; - --gray-border: @surface0; - --link-color: @accent-color; - --link-hover-color: darken(@accent-color, 5%); - --footer-header-color: @text; - - /* Main article/readme background */ - --csstools-light-dark-toggle--49: @base; - - /* Inline code background */ - --csstools-light-dark-toggle--85: @mantle; - /* Code block background */ - --csstools-light-dark-toggle--86: @mantle; - /* Copyable text hover */ - --csstools-light-dark-toggle--3: @base; - - /* Versions cards */ - --csstools-light-dark-toggle--108: @base; - --csstools-light-dark-toggle--110: @surface0; - --csstools-light-dark-toggle--105: @surface0; - [class*="_new"] { - color: @green; - } - /* Dependencies cards */ - --csstools-light-dark-toggle--73: @base; - --csstools-light-dark-toggle--69: @surface0; - --grey600: @subtext0; - --grey700: @text; - /* Dependents cards */ - --csstools-light-dark-toggle--84: @base; - --csstools-light-dark-toggle--81: @surface0; - /* Search results cards */ - --csstools-light-dark-toggle--2: @base; - /* Homepage cards */ - --csstools-light-dark-toggle--77: @base; - --csstools-light-dark-toggle--80: @surface0; - --csstools-light-dark-toggle--78: @subtext1; - - /* Header search bar */ - --csstools-light-dark-toggle--33: @crust; - --yellow500: @accent-color; - --yellow700: darken(@accent-color, 5%); - - /* Dropdown */ - --csstools-light-dark-toggle--20: @mantle; - /* Dropdown items */ - [class*="_item_"] { - button:hover, - > a:hover, - [class*="_selected_"] { - background: @surface0; - color: @text !important; - } - } - } - - /* Toasts */ - .c-notification { - --ecn-green: @green; - --ecn-blue: @blue; - --ecn-orange: @peach; - --ecn-red: @red; - - &, - .c-notification__icon { - color: @crust; - } - } - - /* Tooltips */ - .ember-tooltip { - color: @text; - background-color: @crust; - text-shadow: none; - - &[x-placement^="top"] .ember-tooltip-arrow { - border-top-color: @crust; - } - } - - /* Icons and icon badges */ - [class*="_crate-downloads_"] [class*="_stats_"] [fill="#FFF"] { - fill: @surface0 !important; - } - [fill="#B13B89"], - [fill="#B84D94"], - svg[class*="_download-icon"] { - fill: @accent-color !important; - } - [stroke="#B84D94"] { - stroke: @accent-color !important; - } - - /* Footer links */ - ._content_hautyr { - h1 { - text-shadow: none; - } - - a { - color: @accent-color; - - &:hover { - color: darken(@accent-color, 5%); - text-shadow: none; - } - } - } - - /* Misc header text */ - [class*="_header-inner_"] { - &, - a { - color: @text; - } - } - /* Header buttons and link text */ - nav, - nav + div { - button, - a { - color: @text; - } - } - - /* Search bar magnifying glass icon */ - form[action="/search"] button { - color: @crust; - } - - /* Sort by search results */ - ._icon_xsqxju { - color: @accent-color; - } - - /* Primary buttons */ - [class*="_tan-button_"], - [class*="_yellow-button_"] { - color: @crust; - background: @accent-color; - - &:hover { - background-color: darken(@accent-color, 5%); - } - } - - /* User email settings */ - [class*="_me-email_"] { - [class*="_row_"] { - border-color: @surface0; - } - [class*="_verified_"] { - color: @green; - } - } - - /* Logged out home page hero */ - [class*="_hero-title_"] { - color: @text; - text-shadow: none; - } - [class*="_hero-button_"] [class*="_icon_"] { - color: @crust; - } - [class*="_blurb_"] [class*="_stats-value_"] { - [class*="_label_"], - svg { - color: @subtext0; - } - } - - /* User avatar backgrounds */ - [class*="_avatar_"] { - background-color: @surface0; - box-shadow: none; - } - - [class*="_yanked-badge_"] { - background-color: @red; - color: @crust; - } - - /* Tables in READMEs */ - table { - th, - td { - border-color: @surface1; - } - } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/crates.io/catppuccin.user.less b/styles/crates.io/catppuccin.user.less new file mode 100644 index 0000000000..3a441a2815 --- /dev/null +++ b/styles/crates.io/catppuccin.user.less @@ -0,0 +1,260 @@ +/* ==UserStyle== +@name crates.io Catppuccin +@namespace github.com/catppuccin/userstyles/styles/crates.io +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/crates.io +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/crates.io/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acrates.io +@description Soothing pastel theme for crates.io +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("crates.io") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); + + code.hljs { + background: none !important; + } + + :root[data-color-scheme="system"] { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + :root[data-color-scheme="dark"] { + #catppuccin(@darkFlavor); + } + :root[data-color-scheme="light"] { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + &, + * { + --shadow: none !important; + --csstools-color-scheme--dark: none; + + --header-bg-color: @mantle; + --main-color: @text; + --main-color-light: @subtext1; + --main-shadow-color: @surface0; + --main-bg: @mantle; + --main-bg-dark: @base; + --gray-border: @surface0; + --link-color: @accent; + --link-hover-color: darken(@accent, 5%); + --footer-header-color: @text; + + /* Main article/readme background */ + --csstools-light-dark-toggle--63: @base; + + /* Inline code background */ + --csstools-light-dark-toggle--92: @mantle; + /* Code block background */ + --csstools-light-dark-toggle--91: @mantle; + /* Copyable text hover */ + --csstools-light-dark-toggle--78: @base; + + /* Versions cards */ + --csstools-light-dark-toggle--111: @text; + --csstools-light-dark-toggle--113: @base; + --csstools-light-dark-toggle--114: fade(@green, 15%); + --csstools-light-dark-toggle--117: fade(@yellow, 15%); + --csstools-light-dark-toggle--109: @surface0; + --csstools-light-dark-toggle--110: @surface0; + --csstools-light-dark-toggle--115: @surface0; + --csstools-light-dark-toggle--118: @surface0; + --csstools-light-dark-toggle--126: @text; + [class*="_new"] { + color: @green; + } + /* Dependencies cards */ + --csstools-light-dark-toggle--83: @base; + --csstools-light-dark-toggle--79: @surface0; + --csstools-light-dark-toggle--80: @text; + --csstools-light-dark-toggle--81: @text; + --csstools-light-dark-toggle--84: @subtext0; + --grey600: @subtext0; + --grey700: @text; + /* Dependents cards */ + --csstools-light-dark-toggle--89: @base; + --csstools-light-dark-toggle--86: @surface0; + /* Search results cards */ + --csstools-light-dark-toggle--2: @base; + /* Homepage cards */ + --csstools-light-dark-toggle--74: @base; + --csstools-light-dark-toggle--77: @surface0; + --csstools-light-dark-toggle--75: @subtext1; + --csstools-light-dark-toggle--76: @text; + --csstools-light-dark-toggle--19: @subtext0; + --csstools-light-dark-toggle--20: @subtext0; + + /* Header search bar */ + --csstools-light-dark-toggle--34: @crust; + --yellow500: @accent; + --yellow700: darken(@accent, 5%); + + /* Dropdown */ + --csstools-light-dark-toggle--23: @mantle; + --csstools-light-dark-toggle--35: @mantle; + /* Dropdown items */ + [class*="_item_"] { + button:hover, + > a:hover, + [class*="_selected_"] { + background: @surface0; + color: @text !important; + } + } + } + + /* Toasts */ + .c-notification { + --ecn-green: @green; + --ecn-blue: @blue; + --ecn-orange: @peach; + --ecn-red: @red; + + &, + .c-notification__icon { + color: @crust; + } + } + + /* Tooltips */ + .ember-tooltip { + color: @text; + background-color: @crust; + text-shadow: none; + + &[x-placement^="top"] .ember-tooltip-arrow { + border-top-color: @crust; + } + } + + /* Icons and icon badges */ + [class*="downloads_"] [fill="#FFF"] { + fill: @surface0 !important; + } + [fill="#B13B89"], + [fill="#B84D94"], + svg[class*="_download-icon"] { + fill: @accent !important; + } + [stroke="#B84D94"] { + stroke: @accent !important; + } + + /* Footer links */ + ._content_hautyr { + h1 { + text-shadow: none; + } + + a { + color: @accent; + + &:hover { + color: darken(@accent, 5%); + text-shadow: none; + } + } + } + + /* Misc header text */ + [class*="_header-inner_"] { + &, + a { + color: @text; + } + } + + /* Search bar magnifying glass icon */ + form[action="/search"] button { + color: @crust; + } + + /* Sort by search results */ + ._icon_xsqxju { + color: @accent; + } + + /* Primary buttons */ + [class*="_tan-button_"], + [class*="_yellow-button_"] { + color: @crust !important; + background: @accent; + + &:hover { + background-color: darken(@accent, 5%); + } + } + + [class*="_red-button_"] { + --bg-color-top: @maroon; + --bg-color-bottom: @maroon; + --bg-color-top-dark: @red; + --bg-color-bottom-dark: @red; + } + + /* User email settings */ + [class*="_me-email_"] { + [class*="_row_"] { + border-color: @surface0; + } + [class*="_verified_"] { + color: @green; + } + } + + /* Logged out home page hero */ + [class*="_hero-title_"] { + color: @text; + text-shadow: none; + } + [class*="_hero-button_"] [class*="_icon_"] { + color: @crust; + } + [class*="_blurb_"] [class*="_stats-value_"] { + [class*="_label_"], + svg { + color: @subtext0; + } + } + + /* User avatar backgrounds */ + [class*="_avatar_"] { + background-color: @surface0; + box-shadow: none; + } + + [class*="_yanked-badge_"] { + background-color: @red; + color: @crust; + } + + /* Tables in READMEs */ + table { + th, + td { + border-color: @surface1; + } + } + } +} diff --git a/styles/crates.io/preview.webp b/styles/crates.io/preview.webp deleted file mode 100644 index 5f7d9cddd5..0000000000 --- a/styles/crates.io/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:cf59d9a5acbcc80c6ff27ca237c21073b0c3d9bb57b64ac0bb97fbd832b77ade -size 191786 diff --git a/styles/crowdin/README.md b/styles/crowdin/README.md index 58aeaa1531..071b91ae3f 100644 --- a/styles/crowdin/README.md +++ b/styles/crowdin/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Ryan Cao](https://github.com/ryanccn) +- [ryanccn](https://github.com/ryanccn)   diff --git a/styles/crowdin/catppuccin.user.css b/styles/crowdin/catppuccin.user.css deleted file mode 100644 index 98a369638b..0000000000 --- a/styles/crowdin/catppuccin.user.css +++ /dev/null @@ -1,204 +0,0 @@ -/* ==UserStyle== -@name Crowdin Catppuccin -@namespace github.com/catppuccin/userstyles/styles/crowdin -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/crowdin -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/crowdin/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acrowdin -@description Soothing pastel theme for Crowdin -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document regexp("https://crowdin.com(?!/translate).*") -{ - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - :root:root:root:root:root { - --app-bg: @mantle; - --body-bg: @base; - --light-bg: @surface0; - --search-bg: @surface0; - --super-light-bg: @surface1; - --body-color: @text; - --link-hover: @green; - --primary: @green; - --secondary: @rosewater; - --tertiary: @pink; - --primary-btn: @green; - --primary-btn-hover: @teal; - --warning-content: @yellow; - --info: @blue; - --crowdin-primary-blue-gray-05: @surface1; - --crowdin-primary-blue-gray: @overlay0; - } - - .btn-primary, - .btn-primary:hover { - color: @base; - } - - .btn-outline-primary, - .btn-outline-primary:hover { - color: @green; - border-color: @green; - } - } -} - -@-moz-document regexp("https://crowdin.com/translate/.*") -{ - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - body { - background-color: @mantle !important; - color: @text !important; - } - - #left_panel, - .nav-tabs, - .navbar-inner.editor-navbar, - #discussions_control, - #main_menu { - background-color: @surface0 !important; - } - - #editor-center-layout, - .editor-pane-inner, - #translation_wrapper, - #translation_text_container, - .texts-to-translate-header, - #right_panel, - .texts-to-translate-paging, - #asset_preview_wrapper.no-preview, - .editor-pane-title-and-buttons-helper { - background-color: @base !important; - color: @text !important; - } - - .body.dark-theme #main_menu .nav-pills > li.active > a { - background-color: @blue; - } - - .progress .bar-validate { - background-color: @lavender; - } - .progress .bar-translate { - background-color: @sapphire; - } - - a, - .btn-link { - color: @rosewater !important; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/crowdin/catppuccin.user.less b/styles/crowdin/catppuccin.user.less new file mode 100644 index 0000000000..41fb8ac2ae --- /dev/null +++ b/styles/crowdin/catppuccin.user.less @@ -0,0 +1,120 @@ +/* ==UserStyle== +@name Crowdin Catppuccin +@namespace github.com/catppuccin/userstyles/styles/crowdin +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/crowdin +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/crowdin/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Acrowdin +@description Soothing pastel theme for Crowdin +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document regexp("https://crowdin.com(?!/translate).*") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + :root:root:root:root:root { + --app-bg: @mantle; + --body-bg: @base; + --light-bg: @surface0; + --search-bg: @surface0; + --super-light-bg: @surface1; + --body-color: @text; + --link-hover: @green; + --primary: @green; + --secondary: @rosewater; + --tertiary: @pink; + --primary-btn: @green; + --primary-btn-hover: @teal; + --warning-content: @yellow; + --info: @blue; + --crowdin-primary-blue-gray-05: @surface1; + --crowdin-primary-blue-gray: @overlay0; + } + + .btn-primary, + .btn-primary:hover { + color: @base; + } + + .btn-outline-primary, + .btn-outline-primary:hover { + color: @green; + border-color: @green; + } + } +} + +@-moz-document regexp("https://crowdin.com/translate/.*") { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + background-color: @mantle !important; + color: @text !important; + } + + #left_panel, + .nav-tabs, + .navbar-inner.editor-navbar, + #discussions_control, + #main_menu { + background-color: @surface0 !important; + } + + #editor-center-layout, + .editor-pane-inner, + #translation_wrapper, + #translation_text_container, + .texts-to-translate-header, + #right_panel, + .texts-to-translate-paging, + #asset_preview_wrapper.no-preview, + .editor-pane-title-and-buttons-helper { + background-color: @base !important; + color: @text !important; + } + + .body.dark-theme #main_menu .nav-pills > li.active > a { + background-color: @blue; + } + + .progress .bar-validate { + background-color: @lavender; + } + .progress .bar-translate { + background-color: @sapphire; + } + + a, + .btn-link { + color: @rosewater !important; + } + } +} diff --git a/styles/crowdin/preview.webp b/styles/crowdin/preview.webp deleted file mode 100644 index f652db8bc6..0000000000 --- a/styles/crowdin/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:76db9036e754e9109311d90a900d12f859f7238c56c1c74c9b0762f620e9ddad -size 206804 diff --git a/styles/deepl/README.md b/styles/deepl/README.md index b3f35b2c1b..b54096642a 100644 --- a/styles/deepl/README.md +++ b/styles/deepl/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Ren](https://github.com/watatomo) +- [watatomo](https://github.com/watatomo)   diff --git a/styles/deepl/catppuccin.user.css b/styles/deepl/catppuccin.user.less similarity index 56% rename from styles/deepl/catppuccin.user.css rename to styles/deepl/catppuccin.user.less index a33b87b377..dbf76bed64 100644 --- a/styles/deepl/catppuccin.user.css +++ b/styles/deepl/catppuccin.user.less @@ -2,8 +2,8 @@ @name DeepL Catppuccin @namespace github.com/catppuccin/userstyles/styles/deepl @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/deepl -@version 1.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/deepl/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/deepl/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Adeepl @description Soothing pastel theme for DeepL @author Catppuccin @@ -15,62 +15,21 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + @-moz-document regexp("https:\\/\\/www.deepl.com\\/?(.*\\/)translator.*$") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @text-filter: @catppuccin[@@lookup][@text_filter]; - @blue-filter: @catppuccin[@@lookup][@blue_filter]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); /* header */ .BasePageHeader-module--container--d81cb { @@ -94,6 +53,10 @@ background-color: @mantle !important; } + .scrollablePopiverListRoot-module--root--588fe { + background-color: @base !important; + } + /* text color */ h1, h2, @@ -148,7 +111,7 @@ .TranslatorTab-module--active--0b6ea .TranslatorTab-module--innerLower--8a080 { - background-color: @accent-color !important; + background-color: @accent !important; } .ring-neutral-next-900 { @@ -178,16 +141,25 @@ } [class*="SourceTranslatorArea-module--focusBorder--"]:has( - div[contenteditable="true"]:focus - ) { - border-color: @accent-color; + div[contenteditable="true"]:focus + ) { + border-color: @accent; } [class*="PageHeaderLink-module--pageHeaderLink--"]:not( - [class*="PageHeaderLink-module--nohover--"] - ):hover { - color: @accent-color; - border-color: @accent-color; + [class*="PageHeaderLink-module--nohover--"] + ):hover { + color: @accent; + border-color: @accent; + } + + .hover\:bg-\[\#B4DAE8\]:hover { + background-color: @surface2 !important; + } + + /* highlight */ + .bg-\[\#E1F0F5\] { + background-color: @surface1 !important; } /* buttons */ @@ -310,8 +282,7 @@ #top-navi-sidemenu-opener, .pageFooterV2-module--socialMediaLinks--71305, .ProBanner2021-module--checkitem--2d8e7, - [src*="https://static.deepl.com/img/app_desktop.svg"] - { + [src*="https://static.deepl.com/img/app_desktop.svg"] { filter: @text-filter; } @@ -322,13 +293,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @blue_filter: brightness(0) saturate(100%) invert(26%) sepia(100%) saturate(1906%) hue-rotate(213deg) brightness(97%) contrast(97%); @lavender: #7287fd; @text: #4c4f69; @text_filter: brightness(0) saturate(100%) invert(31%) sepia(12%) saturate(1015%) hue-rotate(196deg) brightness(94%) contrast(91%); @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @blue_filter: brightness(0) saturate(100%) invert(68%) sepia(9%) saturate(1948%) hue-rotate(186deg) brightness(98%) contrast(90%); @lavender: #babbf1; @text: #c6d0f5; @text_filter: brightness(0) saturate(100%) invert(80%) sepia(11%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @blue_filter: brightness(0) saturate(100%) invert(65%) sepia(13%) saturate(1397%) hue-rotate(184deg) brightness(103%) contrast(91%); @lavender: #b7bdf8; @text: #cad3f5; @text_filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1385%) hue-rotate(192deg) brightness(101%) contrast(92%); @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @blue_filter: brightness(0) saturate(100%) invert(65%) sepia(51%) saturate(534%) hue-rotate(188deg) brightness(98%) contrast(101%); @lavender: #b4befe; @text: #cdd6f4; @text_filter: brightness(0) saturate(100%) invert(87%) sepia(6%) saturate(985%) hue-rotate(191deg) brightness(96%) contrast(99%); @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/deepl/preview.webp b/styles/deepl/preview.webp deleted file mode 100644 index f9c4dfc221..0000000000 --- a/styles/deepl/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:4aef20f73d0147512fcab6557ce8eb474f17da3738614d443e37c112149eb501 -size 127544 diff --git a/styles/deepseek/README.md b/styles/deepseek/README.md new file mode 100644 index 0000000000..0d252a88a6 --- /dev/null +++ b/styles/deepseek/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for DeepSeek + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [WalkQuackBack](https://github.com/WalkQuackBack) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/deepseek/catppuccin.user.less b/styles/deepseek/catppuccin.user.less new file mode 100644 index 0000000000..181ef9ead7 --- /dev/null +++ b/styles/deepseek/catppuccin.user.less @@ -0,0 +1,264 @@ +/* ==UserStyle== +@name DeepSeek Catppuccin +@namespace github.com/catppuccin/userstyles/styles/deepseek +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/deepseek +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/deepseek/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Adeepseek +@description Soothing pastel theme for DeepSeek +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document url-prefix("https://chat.deepseek.com") { + @import url("https://prismjs.catppuccin.com/variables.important.css"); + + body[data-ds-dark-theme] { + #catppuccin(@darkFlavor); + } + body:not([data-ds-dark-theme]) { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + #ds-rgb() { + --ds-bordered-secondary-button-color: var(--dsr-text-1); + --ds-button-hover-color: initial; + --ds-input-prefix-color: var(--dsr-text-1); + --ds-modal-content-color: @surface0; + --ds-rgb-bg-base: var(--ds-rgb-black); + --ds-rgb-elevated: #lib.rgbify(@surface0)[]; + --ds-rgb-error: #lib.rgbify(@red)[]; + --ds-rgb-header: 40 40 40; + --ds-rgb-info: #lib.rgbify(@blue)[]; + --ds-rgb-input-focus: var(--ds-rgb-neutral-900); + --ds-rgb-input-strong: var(--ds-rgb-neutral-700); + --ds-rgb-input: var(--ds-rgb-neutral-800); + --ds-rgb-label-1: #lib.rgbify(@text)[]; + --ds-rgb-label-2: #lib.rgbify(@subtext0)[]; + --ds-rgb-label-3: #lib.rgbify(@overlay1)[]; + --ds-rgb-link: var(--ds-rgb-primary); + --ds-rgb-primary-foreground: #lib.rgbify(@base)[]; + --ds-rgb-primary: #lib.rgbify(@accent)[]; + --ds-rgb-segmented-button: var(--ds-rgb-neutral-500); + --ds-rgb-segmented-separator: var(--ds-rgb-neutral-500); + --ds-rgb-segmented: var(--ds-rgb-neutral-600); + --ds-rgb-separator-strong: #lib.rgbify(@overlay0)[]; + --ds-rgb-separator: #lib.rgbify(@surface2)[]; + --ds-rgb-success: #lib.rgbify(@green)[]; + --ds-rgb-tag: var(--ds-rgb-neutral-600); + --ds-rgb-thumb: var(--ds-rgb-neutral-200); + --ds-rgb-track: var(--ds-rgb-neutral-500); + --ds-rgb-warning: #lib.rgbify(@yellow)[]; + --ds-rgba-transparent: 255 255 255/0; + --ds-tabs-active-color: @accent; + --ds-text-primary-button-color: @accent; + --ds-rgb-hover: #lib.rgbify(mix(@text, @base, 8%))[]; + + --ds-toast-custom-color: @surface0; + --ds-toast-custom-text-color: @text; + --ds-toast-cutsom-border: 1px solid @surface1; + --ds-md-inline-code-color: @base; + } + + --dsw-alias-bg-base: @base; + --dsw-alias-bg-layer-1: @mantle; + --dsw-alias-bg-layer-2: @base; + --dsw-alias-bg-layer-3: @surface0; + + --dsw-alias-bg-mask-1: rgba(0, 0, 0, 0.5); + --dsw-alias-bg-mask-2: rgba(0, 0, 0, 0.2); + --dsw-alias-bg-multi-select: mix(@accent, @mantle, 8%); + --dsw-alias-bg-skeleton: fade(@text, 8%); + + --dsw-alias-border-inverted2: rgba(255, 255, 255, 0.08); + --dsw-alias-border-inverted: rgba(255, 255, 255, 0.06); + --dsw-alias-border-l1: rgba(255, 255, 255, 0.06); + --dsw-alias-border-l2-darkmode-thin: rgba(255, 255, 255, 0.06); + --dsw-alias-border-l2: @surface1; + --dsw-alias-border-l3: @surface2; + --dsw-alias-border-l4: @overlay0; + + --dsw-alias-brand-primary-invert: @text; + --dsw-alias-brand-primary: @accent; + --dsw-alias-brand-text: @accent; + + --dsw-alias-button-contrast-fill: @text; + --dsw-alias-button-elevated-fill: @surface1; + + --dsw-alias-button-floating-fill: @base; + --dsw-alias-button-floating-hover: mix(@text, @base, 8%); + + --dsw-alias-button-ghost-active-border: @accent; + --dsw-alias-button-ghost-active-fill: fade(@accent, 14%); + --dsw-alias-button-ghost-active-hover: fade(@accent, 18%); + + --dsw-alias-button-primary-dimmed: darken(@accent, 8%); + --dsw-alias-button-primary-fill: var(--dsw-alias-brand-primary); + --dsw-alias-button-primary-hover: lighten(@accent, 8%); + + --dsw-alias-interactive-bg-active: fade(@text, 14%); + --dsw-alias-interactive-bg-hover-accent: fade(@text, 24%); + --dsw-alias-interactive-bg-hover-danger: fade(@red, 15%); + --dsw-alias-interactive-bg-hover: fade(@text, 8%); + + --dsw-alias-label-caption: @overlay0; + --dsw-alias-label-dimmed: @surface1; + --dsw-alias-label-primary-dimmed: var(--dsw-static-neutral-bluish-100); + --dsw-alias-label-primary-inverted: var(--dsw-static-neutral-bluish-800); + + --dsw-alias-label-primary: @text; + --dsw-alias-label-secondary: @subtext0; + --dsw-alias-label-tertiary: @overlay1; + + --dsw-alias-markdown-citation: var(--dsw-static-neutral-bluish-800); + --dsw-alias-markdown-code-block-banner: @surface0; + --dsw-alias-markdown-code-block: @mantle; + --dsw-alias-markdown-code-segment-selected: var( + --dsw-static-neutral-bluish-800 + ); + --dsw-alias-markdown-code-segment-unselected: var( + --dsw-static-neutral-bluish-900 + ); + --dsw-alias-markdown-inline-code: @surface0; + --dsw-alias-markdown-tag: var(--dsw-static-neutral-bluish-850); + + --dsw-alias-scrollbar-bg-l1: @surface2; + --dsw-alias-scrollbar-bg-l2: @overlay0; + --dsw-alias-scrollbar-hover-l1: @overlay0; + --dsw-alias-scrollbar-hover-l2: @overlay1; + + --dsw-alias-state-error-primary: @red; + --dsw-alias-state-error-secondary: @red; + + --dsw-alias-state-success-primary: @green; + --dsw-alias-state-success-secondary: @green; + + --dsw-alias-state-warn-label: var(--dsw-static-amber-600); + --dsw-alias-state-warn-primary: var(--dsw-static-amber-500); + --dsw-alias-state-warn-secondary: var(--dsw-static-amber-400); + --dsw-alias-state-warn-tertiary: var(--dsw-static-amber-900); + + --dsw-alias-toast-bg: var(--dsw-static-neutral-bluish-750); + --dsw-alias-tooltip-bg: var(--dsw-static-neutral-bluish-750); + + --dsw-specific-bubble: @surface0; + --dsw-specific-input-major: @surface0; + --dsw-specific-login-input: var(--dsw-static-neutral-900); + --dsw-specific-menu: var(--dsw-alias-bg-layer-3); + --dsw-specific-selector: fade(@text, 14%); + --dsw-specific-sidebar-fill: @mantle; + --dsw-specific-sidebar-nav-item-active-accent: @surface0; + --dsw-specific-sidebar-nav-item-active: @surface0; + --dsw-specific-sidebar-nav-item-hover: fade(@text, 8%); + --dsw-specific-tip: var(--dsw-static-neutral-bluish-800); + + --dsr-bg: @crust; + --dsr-text-0: @text; + --dsr-text-1: @subtext1; + --dsr-text-2: @subtext0; + --dsr-text-3: @overlay2; + --dsr-text-4: @overlay1; + --dsr-border-1: rgb(var(--ds-rgb-neutral-450)); + --dsr-border-2: rgb(var(--ds-rgb-neutral-600)); + --dsr-input-border: #5a5a69; + --dsr-input-bg: #404045; + --dsr-button-main-bg: #509fff; + --dsr-button-main-bg-hover: #4166d5; + --dsr-button-second-bg: var(--dsr-main-2); + --dsr-button-grey-0: rgb(var(--ds-rgb-neutral-600)); + --dsr-button-grey-1: rgb(var(--ds-rgb-neutral-650)); + --dsr-button-grey-2: rgb(var(--ds-rgb-neutral-700)); + --dsr-delete-button-bg: rgb(var(--ds-rgb-red-500) / 0.85); + --dsr-delete-button-bg-hover: rgb(var(--ds-rgb-red-550) / 0.45); + --dsr-tooltip-fg: rgb(var(--ds-rgb-zinc-650)); + --dsr-tooltip-bg: #000; + --dsr-side-bg: #212327; + --dsr-side-hover-bg-rgb: 51, 51, 51; + --dsr-side-hover-bg: rgb(var(--ds-rgb-neutral-750)); + --dsr-icon-fg-1: rgb(var(--ds-rgb-neutral-350)); + --dsr-icon-hover-0: rgb(var(--ds-rgb-neutral-500)); + --dsr-icon-hover-1: rgb(var(--ds-rgb-neutral-700)); + --dsr-side-icon-hover: rgb(var(--ds-rgb-zinc-750)); + --dsr-error-fg: rgb(var(--ds-rgb-red-450)); + --dsr-risk-text: #e4773d; + --dsr-risk-border: #4c4740; + --dsr-risk-fill: #31302e; + + .ds-elevated, [data-elevated] { + #ds-rgb() !important; + } + &, .ds-theme { + #ds-rgb() !important; + + --wip-ds-color-bg-tooltip: @surface0; + } + + .ds-sign-up-form__main { + background: @base; + } + .ds-switch.ds-switch.ds-switch { + --switch-color: @surface2; + --switch-thumb-color: if(@flavor = latte, @base, @text); + &.ds-switch--checked { + --switch-color: @accent; + --switch-thumb-color: @base; + } + } + .ds-basic-button--primary { + --ds-primary-button-text-color: @base; + } + .ds-checkbox svg { + color: @base; + } + + .ds-tooltip { + --tooltip-text-color: @text; + } + + /* Fade out text on active sidebar nav item */ + ._546d736.b64fb9ae ._254829d { + --mask-base-color: #lib.rgbify(@surface0)[]; + } + /* Fade out text on hovered sidebar nav item */ + ._546d736 ._254829d { + --mask-base-color: #lib.rgbify(@surface0)[]; + } + + /* Fade out on top of conversation */ + .c99b79f8.c99b79f8.c99b79f8 { + background: linear-gradient(to bottom, @crust, transparent); + } + /* Fade out on top of conversation when multiselect active */ + .a51c5344 .c99b79f8.c99b79f8.c99b79f8 { + background: linear-gradient( + to bottom, + var(--dsw-alias-bg-multi-select), + transparent + ); + } + + /* Response feedback rating radio button focus */ + ._74d6322 + .ds-radio-button-group + .ds-radio-button.ds-radio-button--active::after { + box-shadow: var(--radio-button-group-button-outline-box-shadow-focus); + } + + /* Send button icon */ + ._7436101 { + color: @base; + } + } +} diff --git a/styles/desmos/README.md b/styles/desmos/README.md new file mode 100644 index 0000000000..192cc6817a --- /dev/null +++ b/styles/desmos/README.md @@ -0,0 +1,37 @@ + + + +

+ Logo
+ + Catppuccin for Desmos + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + +> [!NOTE] +> This userstyle is currently incompatible with DesModder's Visual>Syntax Highlighting plugin. + +## ๐Ÿ’ Current Maintainer +- [gradylink](https://github.com/gradylink) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/desmos/catppuccin.user.less b/styles/desmos/catppuccin.user.less new file mode 100644 index 0000000000..b5aa3a530c --- /dev/null +++ b/styles/desmos/catppuccin.user.less @@ -0,0 +1,1316 @@ +/* ==UserStyle== +@name Desmos Catppuccin +@namespace github.com/catppuccin/userstyles/styles/desmos +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/desmos +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/desmos/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Adesmos +@description Soothing pastel theme for Desmos +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document regexp( + "^(https?:\/\/)(?!(cl|teacher|student)\.desmos\.com)([a-zA-Z0-9-]+\.)?desmos\.com(\/.*)?$" + ) { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); + + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + .dcg-desmos-svg-logo g { + fill: @text; + } + + .dcg-expression-top-bar { + border-right-color: @surface0 !important; + border-bottom-color: @surface0 !important; + } + + .user-info, .dcg-saved-graphs-tile-or-row, .dcg-graph-list__header-row { + border-bottom-color: @surface0 !important; + } + + .dcg-exppanel-container { + --dcg-item-background-color: @base; + background: @base; + } + + i:not( + .dcg-shared-product-icon, + .dcg-icon-error, + .dcg-geo-basic-tools .dcg-icon-caret-down, + .dcg-geometry-toolbar-view i, + .dcg-btn-short-blue i + ) { + opacity: 1 !important; + text-shadow: none !important; + color: @text !important; + } + + .dcg-expressionitem:not(.dcg-selected) .dcg-tab, + .dcg-account-reminder, + .search-container input, + .dcg-evaluation-view__wrapped-value, + .dcg-loading-background-div, + .dcg-mq-sqrt-container .dcg-mq-empty, + .dcg-mq-fraction .dcg-mq-empty, + .dcg-my-graphs-modal__footer, + .dcg-product-filter__button.dcg-hovered, + .dsm-panic-button, + .dcg-select-dropdown-option.dcg-hovered { + background: @mantle !important; + } + + .dcg-expressionitem.dcg-selected .dcg-tab { + background: @accent !important; + + .dcg-num { + color: @mantle !important; + } + + .dcg-slider-menu-opener i, .dcg-icon-zoom-fit, .dcg-icon-create-table { + color: @mantle !important; + } + + .dcg-circular-icon:not(:has(.dcg-icon-parametric-solid)):not( + .dcg-colored-icon + ) { + border-color: @mantle !important; + + i { + color: @mantle !important; + } + } + } + + /* This is not applied to entire view to prevent the graph from changing color. */ + .dcg-new-expression-fade, + .dcg-mq-editable-field::after, + .dcg-popover, + .dcg-options-menu, + .dcg-dropdown-popover__interior, + .dcg-arrow, + .dcg-table-container, + .dcg-mq-editing-overflow-left::before, + .dcg-exppanel-outer__wrapper { + --dcg-custom-background-color: @base; + } + + .dcg-popover .dcg-new-item, + .dcg-evaluation-view__equals-sign, + .dcg-circular-icon-container { + opacity: 1 !important; + } + + .dcg-popover-interior, + .dcg-dropdown-popover__interior, + .dcg-notice--authenticate, + .dcg-btn-white-outline, + .dcg-action-save.dcg-disabled, + .dcg-calc-option, + .dcg-end-test-button, + .dcg-action-cartesian, + .dcg-action-polar, + .dcg-evaluation-view__plaintext, + .dcg-add-inference-wizard__table th, + .dcg-add-inference-wizard__table td, + .dcg-add-inference-wizard__sample-type-selector.dcg-selected, + .dcg-table--cell, + .dcg-checkbox:not(.dcg-geometry-toolbar-view .dcg-checkbox), + .dcg-product-filter__button { + border-color: @text !important; + } + + .dcg-btn-white-outline.dcg-hovered, .dcg-end-test-button.dcg-hovered { + box-shadow: 0 0 0 1px @text !important; + } + + .dcg-arrow::after, .dcg-add-inference-wizard__header { + border-bottom-color: @text !important; + } + + .dcg-expressionitem.dcg-selected { + border-color: @accent !important; + --dcg-item-border-color: @accent !important; + } + + .dcg-expressionitem:not(.dcg-selected) { + border-top-color: @surface0 !important; + } + + .dcg-popover-title, .dcg-dropdown-popover__title, .dcg-help-menu-title { + color: @accent !important; + background-color: transparent !important; + border-bottom-color: @accent !important; + } + + .dcg-toggle-track { + background: @subtext0 !important; + } + + .dcg-toggle-switch, .dcg-or-separator { + background: @text !important; + } + + .dcg-toggled .dcg-toggle-switch { + background: @overlay1 !important; + } + + .dcg-keypad-btn.dcg-btn-light-on-gray, + .dcg-keypad-btn.dcg-btn-light-gray, + .dcg-ctrl-toggle-cover { + background: @mantle !important; + border-color: @surface0 !important; + } + + .dcg-keypad-btn.dcg-btn-dark-on-gray { + background: @crust !important; + border-color: @surface0 !important; + } + + @layer { + .dcg-btn-short-blue, .dcg-btn-blue, .dcg-copy-button { + background: @accent !important; + border-color: transparent !important; + color: @base !important; + + *, *::before { + color: @base !important; + } + } + } + + .dcg-btn-red { + background: @red !important; + border-color: none !important; + color: @base !important; + } + + .dcg-unstyled-button.dcg-disabled { + color: @subtext0 !important; + border-color: @subtext0 !important; + } + + .dcg-overgraph-icon-container { + background: @base; + border-radius: 5px; + } + + .dcg-header, + .dcg-main-header-container, + .navbar-inner, + .dcg-practice-header-view { + background: @crust !important; + border-bottom-color: @surface0 !important; + *:not( + .dcg-btn-blue, + .dcg-dropdown-popover__title, + .dcg-copy-button > span, + .dcg-copy-button, + .dcg-help-menu-title + ) { + color: @text !important; + } + } + + .dcg-variable-permalink, + .dcg-shared-input-blue-outline:not( + .dcg-geometry-toolbar-view .dcg-shared-input-blue-outline + ), + .dcg-input-blue-outline:not( + .dcg-geometry-toolbar-view .dcg-input-blue-outline + ) { + background: @mantle; + border-color: @text !important; + + &.dcg-focus-visible { + box-shadow: inset 0 0 0 1px @accent !important; + border-color: @accent !important; + } + } + + *:not(.dcg-header-right-content) + > * + > *:not(.dcg-share-menu__sharing-options-button) + > .dcg-icon-print, + *:not(.dcg-share-menu__sharing-options-button) > .dcg-icon-export, + .dcg-icon-embed { + box-shadow: 0 0 0 1px @accent !important; + } + + .dcg-hovered:not(.dcg-share-menu__sharing-options-button) > .dcg-icon-print, + .dcg-hovered:not(.dcg-share-menu__sharing-options-button) + > .dcg-icon-export, + .dcg-hovered > .dcg-icon-embed { + background: fade(@accent, 26%) !important; + } + + .dcg-notice--authenticate, + .dcg-authentication-modal, + .dcg-authentication-modal__detail, + .dcg-btn-gray-outline.dcg-hovered:not(.dcg-frontpage-landing__button), + .dcg-resources-container, + .dcg-account-link, + .dcg-title, + .dcg-lost-work-link, + .dcg-action-save.dcg-disabled, + .account-name, + .account-email, + .dcg-account-container *, + .dcg-icon-remove::before, + .dcg-tooltip-message, + .dcg-attempt-recovery.dcg-hovered, + .no-matches, + .dcg-basic-calculator-footer, + .dcg-basic-calculator-footer *, + .dcg-checkbox-label, + .dcg-input-blue-outline, + .dcg-shared-modal-contents-wrapper + *:not( + .dcg-btn-blue, + .dcg-gray-link, + .dcg-blue-link, + .dcg-shared-tab-gray-underline + ), + .dcg-start-practice-screen, + .dcg-calc-option, + .dcg-keypad-control-toggle, + code, + h3, + .dcg-show-more-row-interior, + .dcg-label-input, + .dcg-checkbox-children, + .dcg-axis-label-to, + .pulsing-message, + .dsm-panic-close-button, + #dsm-panic-reopen-button { + color: @text !important; + } + + .dcg-shared-modal-contents-wrapper, + .dcg-shared-modal-title::before, + .dcg-authentication-modal__detail, + .dcg-user-bar, + .dcg-scrollable, + .dcg-expressionitem.dcg-shell, + .dcg-loading-div-container, + .dcg-mini-play-pause, + .dcg-start-practice-screen, + .dcg-basic-calc-practice, + .dcg-cell.dcg-non-editable.dcg-selected, + pre, + .dcg-action-polar:not(.dcg-selected), + .dcg-action-cartesian:not(.dcg-selected), + .dcg-my-graphs-modal__options, + #dsm-panic-popover, + .dcg-hotkeys-header, + .dcg-select-dropdown-list { + background: @base !important; + } + + .dcg-authentication-modal__divider::before, + .dcg-authentication-modal__divider::after { + border-bottom-color: @text !important; + } + + .dcg-btn-gray-outline, .dcg-dropdown-input { + background: @mantle !important; + border-color: @surface0 !important; + + &.dcg-hovered { + box-shadow: 0 0 0 1px @text !important; + } + } + + .dcg-user-bar { + border-bottom-color: @surface0 !important; + } + + .graph-link-container.dcg-hovered, + .graph-link-container.dcg-selected .graph-link, + .dcg-tooltip-message, + .dcg-sliding-interior, + .dcg-keypad-control-toggle, + .dcg-dropdown-choice.dcg-selected, + .dcg-saved-graphs-tile-or-row.dcg-selected, + .dcg-track > .dcg-graphic { + background: @crust !important; + } + + .dcg-circular-icon { + border-color: @text !important; + opacity: 1 !important; + } + + .dcg-thumb > .dcg-graphic { + background: fade(@accent, 59%) !important; + } + + .dcg-thumb > .dcg-center, + .dcg-action-cartesian.dcg-selected, + .dcg-action-polar.dcg-selected { + background: @accent !important; + } + + .dcg-evaluation-view__wrapped-value, + .dcg-circular-icon.dcg-hidden, + .dcg-keypad-control-toggle, + .dcg-btn-gray-outline { + border-color: @surface0 !important; + box-shadow: none !important; + } + + .dcg-tooltip-arrow { + border-bottom-color: @crust !important; + } + + .dcg-hovered > .dcg-add-blank { + background: fade(@text, 26%) !important; + } + + .dcg-icon-error { + color: @yellow !important; + } + + .dcg-action-redo.dcg-disabled, .dcg-action-undo.dcg-disabled { + opacity: 1 !important; + + i { + color: @surface1 !important; + } + } + + .dcg-loading-div { + filter: @text-filter !important; + } + + .dcg-inline-math-input-view .dcg-math-field, + .dcg-ticker-settings-internal .dcg-math-field { + border-bottom-color: @overlay2 !important; + + &.dcg-focus { + border-bottom-color: @accent !important; + } + } + + .dcg-mq-ghost { + opacity: 1 !important; + color: @overlay2; + } + + .dcg-mq-root-block::after, .dcg-action-cancel { + opacity: 1 !important; + } + + .dcg-mini-play-pause { + border-color: @base !important; + } + + .dcg-gray-link, .dcg-centered-top-link, .dcg-cancel-while-loading { + color: @accent !important; + } + + .dcg-shared-tab-gray-underline.dcg-selected { + border-bottom-color: @accent !important; + } + + .dcg-calc-option.dcg-is-selected { + border-color: @accent !important; + box-shadow: 0 0 0 1px @accent !important; + background: fade(@accent, 13%) !important; + } + + /* To make this !important more important than Desmos' !important */ + @layer { + .dcg-mq-selection { + &, + .dcg-mq-non-leaf, + .dcg-mq-scaled { + background: @accent !important; + color: @base !important; + } + } + } + + .dcg-cell.dcg-first-column, .dcg-cell.dcg-interior-column { + border-right-color: @text !important; + } + + .dcg-cell.dcg-table-header { + border-bottom-color: @text !important; + } + + .dcg-cell.dcg-interior-row, .dcg-show-more-row { + border-bottom-color: @surface2 !important; + } + + .dcg-cell.dcg-selected { + box-shadow: inset 0 0 0 2px @accent !important; + + &:not(.dcg-computed-cell)::after, .dcg-inner-border { + border-color: @accent !important; + } + } + + .dcg-action-changeimage.dcg-hovered, + .dcg-expressionitem .dcg-icon-remove.dcg-hovered::before, + .dcg-complex-enabled-note, + .dcg-expression-warning, + .dcg-reference-count, + .dcg-maxLabel.dcg-hovered, + .dcg-minLabel.dcg-hovered { + color: @subtext0 !important; + } + + .active-arrow .dcg-graphic { + border-right-color: @base !important; + } + + .dcg-row:nth-of-type(2) .dcg-cell, + table th, + table td, + .footer, + .dcg-add-inference-wizard--create-button-wrapper, + .dcg-small-screen-menu__logout-container, + .dcg-product-filter__clear-filter-container { + border-top-color: @text !important; + } + + .dcg-row .dcg-cell, + .dcg-expressionfolder .dcg-fade-container::after, + .dcg-expressionitem.dcg-inFolder .dcg-fade-container::after { + border-left-color: @text !important; + } + + .dcg-row:not(:nth-of-type(2)) .dcg-cell { + border-top-color: @surface2 !important; + } + + .dcg-cell .dcg-empty-line { + border-top-color: transparent !important; + } + + #pageHeader.brand, .dcg-grapher__error-in-graph-bounds { + text-shadow: none !important; + } + + .dcg-btn-light-gray, .dcg-btn-light-on-gray { + background: @mantle !important; + box-shadow: none !important; + border-color: @text !important; + color: @text !important; + } + + .spa-header { + background: @green !important; + color: @base; + + @layer { + .spa-header .dcg-icon-desmos { + color: @base !important; + } + } + + .state-name, .test-name { + border-left-color: @base !important; + } + } + + .dcg-complex-container, + .dcg-axes-settings-container, + .dcg-options-menu-section { + border-top-color: @overlay2 !important; + } + + .dcg-visual-settings { + border-bottom-color: @overlay2 !important; + } + + .dcg-checkbox__box, + .dcg-axis-label, + .dcg-clickable-menu-row:has(.dcg-input-label) > .dcg-mathquill-wrapper { + --dcg-accent-color: @accent !important; + } + + .dcg-segmented-control-btn.dcg-selected, + .dcg-action-cartesian.dcg-selected > i::before, + .dcg-action-polar.dcg-selected > i::before, + .dcg-grapher__error-in-graph-bounds, + .dcg-toast-view, + .dcg-toast .dcg-undo, + .dcg-segmented-control-container .dcg-selected i::before, + .dcg-selected-graphs-actions__icon-btn i::before, + .dcg-segmented-control-btn.dcg-selected * { + color: @base !important; + } + + @layer { + .dcg-btn-blue:has(> .dcg-icon-caret-down) { + i { + color: @base !important; + } + + &::before { + border-left-color: @base !important; + } + } + } + + .dcg-label-input { + border-color: @text !important; + + &:focus { + border-color: @accent !important; + box-shadow: 0 1px @accent !important; + } + } + + .dcg-toast { + background: @yellow !important; + border-color: @peach !important; + } + + .dcg-expressionitem.dcg-inference-wizard-insert-target { + --dcg-item-border-color: @text !important; + } + + .dcg-add-inference-wizard__table td:has(.dcg-focus)::after, + .dcg-table--cell:has(.dcg-focus)::after { + border-color: @accent !important; + } + + .dcg-add-inference-wizard__sample-type-selector.dcg-hovered:not( + .dcg-selected + ) { + border-color: @overlay0 !important; + } + + @layer { + .dcg-frontpage-landing-interactive__graph-link, + .dcg-frontpage-landing-interactive__arrow-overlay { + i { + color: @base !important; + } + } + } + + .dcg-my-graphs-modal__heading--selectable { + &.dcg-hovered { + box-shadow: 0 3px @overlay0 !important; + } + + &.dcg-selected { + box-shadow: 0 3px @accent !important; + } + } + + .dcg-saved-graphs-tile { + --dcg-saved-graphs-tile-or-row-hover-color: @crust !important; + background: @mantle !important; + } + + .dcg-graph-list__row.dcg-hovered:not(.dcg-selected), + .dcg-my-graphs-modal__currently-open, + .dcg-graph-list__field-btn.dcg-hovered, + .dcg-product-filter__option--selected { + background: @mantle !important; + } + + @layer { + .dcg-saved-graphs-tile__subtitle { + color: @base !important; + } + } + + .dcg-geometry-toolbar-view { + .dcg-component-checkbox, & { + color: #000 !important; + } + } + + .dcg-my-graphs-modal-empty-state__logged-out { + border-color: @surface1 !important; + } + + .dcg-shortcuts-table tr { + border-bottom-color: @surface2 !important; + } + + --dcg-custom-text-color: @text; + --dcg-custom-background-color-shaded: @base; + + /* DesModder */ + .dsm-plugin-title-bar, + .dsm-version-number, + .dsm-plugin-info-body, + .cm-panel, + #intellisense-container td, + .dsm-vc-outfile-name { + color: @text !important; + } + + .cm-gutters, .cm-foldPlaceholder, .selected-intellisense-option { + background: @crust !important; + } + + .อผb { + color: @mauve !important; + } + + .อผe { + color: @red !important; + } + + .อผd { + color: @green !important; + } + + .cm-activeLineGutter, #intellisense-container, .dsm-vc-outfile-name { + background: @mantle !important; + } + + .cm-focused .cm-matchingBracket { + background: fade(@accent, 25%) !important; + } + + .cm-activeLine { + background: fade(@surface0, 50%) !important; + } + + .cm-foldPlaceholder, #intellisense-container { + border-color: @surface0 !important; + } + + .cm-gutters { + color: @subtext0 !important; + border-right-color: @surface0; + } + + .cm-panels, .dsm-vc-preview-inner { + background: @base !important; + } + + .cm-panels-bottom { + border-top-color: @surface0 !important; + } + + .cm-lintRange-error { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .cm-cursor { + border-left-color: @text !important; + } + + .cm-selectionBackground { + background: @surface1 !important; + } + + .compact-view-enabled .dcg-mq-cursor { + border-color: @text !important; + } + + @layer { + .dsm-vc-preview-expand, + .dsm-vc-remove-frame, + .dsm-vc-preview-play-pause { + i { + color: @base !important; + } + } + } + + .dsm-vc-outfile-name { + border-bottom-color: @overlay0 !important; + + &.dcg-hovered { + box-shadow: 0 1px @overlay0 !important; + } + + &:focus { + border-bottom-color: @accent !important; + box-shadow: 0 1px @accent !important; + } + } + + /* Non-Calculator Pages */ + .cls-1, #states path { + fill: @accent !important; + } + + #states path:not(.uses-desmos) { + filter: brightness(125%); + } + + .dcg-frontpage-landing-hero, + .dcg-frontpage-landing__button--hero, + .dcg-text--dark-blue, + .dcg-for-work-hero__label, + .accessibility-main details[open] summary, + .accessibility-main details[open] summary h3 { + color: @base !important; + } + + .dcg-frontpage-landing__button, .dcg-for-work-hero__button { + background: @text !important; + color: @base !important; + opacity: 1 !important; + } + + .dcg-frontpage-landing-geometry__primary-link { + background: @mauve !important; + } + + .dcg-frontpage-landing-3d__primary-link { + background: @maroon !important; + } + + .dcg-frontpage-landing-section, + .dcg-frontpage-landing-tools__link, + .dcg-link-section-title, + .dcg-finalist-name, + li, + .section-interior *, + .dcg-p-tag, + .dcg-search-container input, + .dcg-searchable-dropdown-list, + .section-interior, + .careers-hero h1, + .sticky-nav li:not(.active) a, + .top-info, + .partners, + .dcg-principles-section *, + .dcg-for-work-hero, + body, + .dcg-basic-markdown-container p, + .dcg-basic-markdown-container table th, + .accessibility-main { + color: @text !important; + } + + .dcg-frontpage-landing-interactive__arrow-overlay { + /* Desmos' normal solution looks bad when zoomed in (it uses like 10 stacked text-shadows.) */ + text-shadow: none; + paint-order: stroke fill; + -webkit-text-stroke: 4px white; + } + + .dcg-frontpage-landing-section--bg-light, + .dcg-frontpage-landing-section--bg-dark, + .dcg-facts-wrapper, + .dcg-principles-container__light-bg, + .dcg-for-work-hero, + .dcg-section--gray, + .callout--primary, + .lt-dropdown-menu, + .dcg-basic-markdown-container table th, + .accessibility-main section:nth-of-type(2n) { + background: @crust !important; + } + + .dcg-frontpage-landing-classroom__card, + body, + .dcg-frontpage-landing-testing__bullets, + .accessibility-features-in-tools li, + .accessibility-main details { + background-color: @base !important; + } + + .dcg-blue-link, + .dcg-footer-link, + .dcg-primary-link, + .dcg-shared-tab-gray-underline, + .dcg-btn-blue-outline { + color: @accent !important; + } + + .dcg-footer-legal-content-container, + .sticky-nav li.active a, + .dcg-principles-header, + .dcg-for-work-hero__label, + .accessibility-main details[open] summary { + background: @accent !important; + } + + .dcg-finalist-location, .dcg-subtitle, .breadcrumbs li::before { + color: @subtext0 !important; + } + + .dcg-shared-tab-gray-underline.dcg-hovered { + border-bottom-color: @accent !important; + } + + .dcg-footer-main-content-container, + .careers-hero, + .dcg-background--light-blue, + .state-info:not(.modal-view) { + background: @base !important; + } + + .dcg-footer-legal-info a, + .dcg-footer-title, + .dcg-copyright, + .dcg-footer-legal-info, + .sticky-nav li.active a, + .dcg-principles-header * { + color: @base !important; + } + + .dcg-test-blurb, + .dcg-key-command, + pre, + .dcg-container, + .lt-dropdown-menu, + .accessibility-main details { + border-color: @surface0 !important; + } + + .dcg-search-container input, + .dcg-searchable-dropdown-list, + .sticky-nav li:not(.active) a, + .dcg-key-command, + .dcg-btn-blue-outline, + *:not(pre) > code { + background: @mantle !important; + } + + .dcg-search-container input:focus, + .pdf-button, + .dcg-btn-blue-outline, + .callout--primary, + .lt-btn, + .lt-section-subscribe button { + border-color: @accent !important; + } + + .dividing-line { + background: @surface0 !important; + } + + .job-openings-message-container .white-background { + background: transparent !important; + } + + .pdf-button.dcg-hovered, .dcg-btn-blue-outline.dcg-hovered { + box-shadow: 0 0 0 1px @accent !important; + } + + .dcg-footer-logo img, .dcg-testimonial__image { + filter: @text-filter; + } + + .dcg-for-work-hero__input { + border-color: @text !important; + + &:focus { + box-shadow: 0 0 0 1px @text !important; + } + } + + .dcg-basic-markdown-container table { + th, td { + border-color: @text !important; + } + } + + /* Scientific, Geometric, and Matrix */ + .dcg-calc-basic-main, #main { + --dcg-custom-background-color: @base; + border-color: transparent !important; + } + + .dcg-basic-list-container, .dcg-matrix-list-container { + border-top-color: @surface0 !important; + } + + .dcg-basic-list-placeholder, + .dcg-keypad-control-bar, + .dcg-matrix-list-placeholder { + border-left-color: @surface0 !important; + border-right-color: @surface0 !important; + } + + .dcg-basic-keypad-container, + .dcg-basic-expression, + .dcg-latex-expression, + .dcg-matrix-expression { + border-color: @surface0 !important; + } + + .dcg-keypad-control-btn.dcg-selected::after, + .dcg-segmented-control-btn.dcg-selected { + background: @accent !important; + } + + .dcg-basic-expression.dcg-focused, + .dcg-matrix-expression.dcg-focused, + .dcg-latex-expression.dcg-focused { + border-color: @accent !important; + box-shadow: inset 0 0 0 1px @accent !important; + } + + .dcg-resize-action { + background: @mantle !important; + border-color: @surface0 !important; + } + + .dcg-matrix-container, .dcg-segmented-control-btn.dcg-selected { + border-color: @text !important; + } + + .dcg-matrix-view .dcg-mq-math-mode.dcg-mq-focused { + border-bottom-color: @accent !important; + } + + .dcg-mq-ans { + border-color: @accent !important; + color: @accent !important; + background: fade(@accent, 26%) !important; + + &::after { + border-color: @accent !important; + color: @accent !important; + background: @mantle !important; + } + } + + .dcg-keypad-control-btn.dcg-disabled { + opacity: 1 !important; + color: @surface1 !important; + + i { + color: @surface1 !important; + } + } + + --dcg-custom-text-color-shaded: @text; + + /* Help Center */ + .lt-container-inner *, + .lt-topbar, + .hc-multiselect-toggle li span[aria-label]::before { + color: @text !important; + } + + .lt-container-inner a:not(.lt-btn--primary), .lt-topbar__link { + color: @accent !important; + } + + .lt-topbar { + background: @crust !important; + } + + .lt-topbar__logo { + filter: @text-filter; + } + + .lt-hero-unit__bg, + .lt-footer-submit-ticket, + .tab, + .lt-new-request-tip, + .form-field input, + .form-field textarea, + .hc-multiselect-toggle, + .hc-multiselect-menu { + background: @mantle !important; + } + + input[type="submit"], .lt-block-list-item__link, .lt-btn--primary { + background: @accent !important; + border-color: @accent !important; + color: @base !important; + } + + input[type="search"] { + background: @crust !important; + border-color: @text !important; + } + + .search::before { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .lt-block-list-item__link * { + color: @base !important; + } + + .lt-custom-block__icon { + filter: @accent-filter; + } + + .lt-footer, + .lt-search-box:not(.lt-search-box--hero-unit), + .lt-breadcrumbs-wrapper, + .hc-multiselect-menu li:focus, + .hc-multiselect-toggle li { + background: @base !important; + } + + .lt-scroll-to-top { + color: @accent !important; + } + + .pagination-list *, .lt-scroll-to-top, .lt-new-request-tip { + border-color: @accent !important; + } + + .lt-header, .lt-search-result { + border-bottom-color: @surface0 !important; + } + + .lt-search-result__text em { + background: @yellow !important; + color: @base !important; + } + + .lt-toc--link.is-active > span { + color: @base !important; + } + + .tab, .key-command, .hc-multiselect-toggle, .hc-multiselect-menu { + border-color: @surface0 !important; + } + + @layer { + .tabs-link { + color: @text !important; + + &:hover { + color: @accent !important; + } + + &.is-active { + color: @base !important; + background: @accent !important; + border-color: @accent !important; + } + } + } + + .upload-dropzone[data-hc-focus="true"] { + border-color: @accent !important; + } + + --input-border-color: @surface0; + --input-focus-border-color: @accent; + + /* Blog */ + .content-wrap *:not(a), .tag-links > a { + color: @text !important; + } + + .article header { + border-top-color: @surface0 !important; + } + + *:not(.tag-links) > a:not(.img-card, .btn-blue, .btn-blue-outline) { + color: @accent; + } + + .tag-container a { + border-color: @text !important; + + &:active { + background: fade(@text, 50%) !important; + } + } + + .img-card { + border-color: @surface2 !important; + + &:hover { + box-shadow: 0 0 0 1px @surface2 !important; + } + } + + .btn-blue { + background: @accent !important; + color: @base !important; + } + + .btn-blue-outline { + border-color: @accent !important; + color: @accent !important; + + &:hover { + box-shadow: 0 0 0 1px @accent !important; + } + } + + .dcg-frontpage-landing__announcement { + background: @accent; + color: @text; + } + + .dcg-frontpage-landing__announcement-interior { + background-color: fade(@crust, 50%); + } + + /* Exams & Testing Pages (desmos.com/testing/default/{fourfunction,graphing,scientific}) */ + .spa-sample-calculator-view { + .dcg-sample-calculator__header i.dcg-icon-desmos { + color: @base !important; + } + + .dcg-sample-calculator__header { + background-color: @accent !important; + color: @base !important; + } + + .dcg-sample-calculator__calculator-name, + .dcg-sample-calculator__state-name { + border-color: @base; + } + } + + /* Login/sign up modal */ + .dcg-shared-modal-dialog { + color: @text; + --dcg-modal-background-color: @base; + + /* Account signup welcome */ + .dcg-authentication-modal__sublabel { + color: @subtext0; + } + .dcg-authentication-modal__tag { + background-color: fade(@accent, 20%); + + &:hover { + background-color: fade(@accent, 30%); + } + + &.dcg-authentication-modal__tag--selected { + border-color: @accent; + } + } + } + + /* Account button/dropdown (displays username) */ + .dcg-header-bar__account-menu { + &.dcg-hovered, &[aria-expanded="true"] { + background-color: @surface0; + } + } + /* Account settings modal */ + .dcg-shared-account-dialog { + color: @text; + } + + /* Desmos Professional (desmos.com/professional) */ + .dcg-professional-hero { + background-color: @crust; + color: @text; + } + .dcg-section__beta-button { + color: @base; + background-color: @text; + + &.dcg-hovered { + background-color: @subtext1; + } + + &.dcg-depressed { + background-color: @subtext0; + } + } + + /* "powered by" text above logo */ + .dcg-powered-by { + color: @text !important; + } + + /* saved graph titles */ + .dcg-checkbox__content { + color: @accent; + } + /* saved folders */ + .dcg-saved-graphs { + --dcg-folder-background-color: @mantle; + } + + /* slider bounds */ + .dcg-slider { + --dcg-custom-secondary-text-color: @accent; + } + + /* tutorial (internally called tour/trip) */ + .dcg-trip-interior, .dcg-trip-content { + background: @base !important; + color: @text; + } + + /* folders */ + .dcg-folder { + --dcg-folder-background-color: @mantle !important; + } + .dcg-folder-item-count { + color: @subtext1; + } + .dcg-my-graphs-modal__back-btn-text, + .dcg-folder__name, + .dcg-my-graphs-modal__folder-header + > .dcg-my-graphs-modal-saved-graphs-header, + .dcg-example-gallery__heading, + .dcg-saved-graphs-tile__title { + color: @accent; + } + + /* folders search (no items found) */ + .dcg-my-graphs-modal-empty-state__heading { + color: @accent !important; + } + .dcg-my-graphs-modal-empty-state__no-search-results { + color: @subtext1; + } + + /* new graph button */ + .dcg-new-my-graphs-item__button { + color: @text !important; + } + .dropdown-option-container > .dcg-dropdown-choice[role="menuitem"] { + color: @text; + } + + /* update to new behavior button (write f()=random() then enter/exit text mode) */ + .dcg-update-behavior-btn { + border-color: @surface0 !important; + } + + /* desmodder: intellisense current variable highlight */ + .pfc-param-selected { + background: @surface0 !important; + color: @text !important; + } + + /* line numbers */ + .dcg-num { + color: @text; + } + } +} diff --git a/styles/dev.to/README.md b/styles/dev.to/README.md new file mode 100644 index 0000000000..baf9306538 --- /dev/null +++ b/styles/dev.to/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for DEV Community + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [shnjd](https://github.com/shnjd) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/dev.to/catppuccin.user.less b/styles/dev.to/catppuccin.user.less new file mode 100644 index 0000000000..e4fb491516 --- /dev/null +++ b/styles/dev.to/catppuccin.user.less @@ -0,0 +1,260 @@ +/* ==UserStyle== +@name DEV Community Catppuccin +@namespace github.com/catppuccin/userstyles/styles/dev.to +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/dev.to +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/dev.to/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Adev.to +@description Soothing pastel theme for DEV Community +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("dev.to"), domain("forem.com") { + @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); + + body.dark-theme { + #catppuccin(@darkFlavor); + } + body.light-theme { + #catppuccin(@lightFlavor); + } + body[data-user-status="logged-out"] { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --body-bg: @mantle; + --black: if(@flavor = latte, @text, @crust); + --body-color: @text; + --color-primary: @subtext1; + --color-secondary: @subtext0; + + --header-bg: @base; + --header-shadow: @crust; + + --footer-bg: @crust; + --footer-color: @subtext0; + + --form-bg: @crust; + --form-bg-focus: @base; + --form-border: @surface0; + --form-border-hover: @surface1; + --form-border-focus: @accent; + --focus: @accent !important; + + --base-100: @text; + --base-90: @subtext1; + --base-80: @subtext1; + --base-70: @subtext0; + --base-60: @overlay2; + --base-50: @overlay1; + --base-20: @base; + --base-0: @crust; + --base-inverted: @surface0; + + --tab-color-current: @accent; + --tab-color: @text; + --tab-color-hover: @base; + --tab-bg-hover: fade(@accent, 70%); + + --link-branded-color: @accent; + --link-branded-color-hover: @accent; + --link-color: @text; + --link-color-hover: @blue; + --link-bg-hover: @mantle; + --link-color-secondary: @subtext1; + --link-color-secondary-hover: @text; + --link-bg-current: @mantle; + --link-color-current: @accent; + --link-current-bg: @surface0; + --link-current-color: @accent; + + --btn-bg-hover: @surface0; + --btn-color: @text; + --btn-color-hover: @accent; + --btn-primary-bg: @accent; + --btn-primary-bg-hover: fade(@accent, 90%); + --btn-primary-color: @base; + --btn-primary-color-hover: @crust; + + --button-primary-color: @base; + --button-primary-color-hover: @base; + --button-primary-bg: @accent; + --button-primary-bg-hover: fade(@accent, 90%); + --button-secondary-bg: @surface1; + --button-secondary-bg-hover: fade(@surface1, 90%); + --button-secondary-color: @subtext1; + --button-secondary-color-hover: @text; + --button-outlined-bg-hover: @mantle; + --button-outlined-color: @subtext1; + --button-outlined-color-hover: @text; + --button-outlined-border: @surface0; + --button-outlined-border-hover: @surface1; + --button-ghost-bg-hover: @base; + --button-ghost-color: @text; + --button-ghost-color-hover: @text; + --button-ghost-dimmed-color: @subtext0; + --button-ghost-dimmed-color-hover: @subtext1; + + --reaction-like-bg: fade(@red, 10%); + --reaction-like-color: @red; + --reaction-comment-color: @yellow; + --reaction-save-color: @blue; + // Article like button when liked. + img[src^="https://assets.dev.to/assets/heart-plus-active-"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + --divider: @surface0; + + --label-primary: @text; + --label-secondary: @subtext1; + + --accent-brand: @accent; + --accent-danger-darker: @red; + --accent-danger: @red; + --accent-warning: @yellow; + --accent-warning-a10: fade(@yellow, 10%); + --accent-success-a10: fade( + @green, + 20% + ); // Share article link "copied to clipboard" confirmation. + + --card-bg: @base; + --card-color: @text; + --card-border: @mantle; + --card-secondary-bg: @surface0; + --card-secondary-bg-hover: fade(@surface0, 90%); + --card-secondary-color: @subtext1; + --card-secondary-border: @surface0; + --card-tertiary-bg: @surface0; + --card-tertiary-bg-hover: fade(@surface0, 90%); + --card-color-tertiary: @text; + + --cta-branded-bg-hover: @accent; + --cta-branded-color: @accent; + --cta-branded-color-hover: @base; + --cta-branded-border: @accent; + --cta-branded-border-hover: @accent; + + --tooltip-bg: @surface2; + --tooltip-color: @text; + + --modal-bg: @surface0; + + --tag-bg: fade(@blue, 10%); + --tag-bg-hover: fade(@blue, 20%); + --tag-color: @blue; + --tag-color-hover: @blue; + --tag-prefix: @blue; + --tag-prefix-hover: @blue; + + --indicator-bg: @blue; + --indicator-color: @base; + --indicator-subtle-bg: fade(@blue, 20%); + --indicator-subtle-color: @subtext1; + + --syntax-background-color: @mantle; + + // popular colors have accent colors. These colors are dynamically assigned, + // whereas other tags fallback color is not overrided by root variables. + .crayons-tag__prefix { + --tag-prefix: @blue; + } + + // danger button + .crayons-btn--danger { + --color: @base; + --color-hover: @crust; + } + + // like and reply button icons in comments + .crayons-btn--ghost .reaction-icon { + filter: none; + } + + // billboard cards on right column has statically coded borders + .text-styles--billboard { + > div { + border-color: @surface0 !important; + } + } + + // dev.to doesn't provide style for
+ hr { + border-color: @surface2; + } + + // Dev++ page + // NOTE: This styling might change in future + // as it is wrapped with custom conatiner with different variables. + #custom { + background-color: @crust; + color: @text; + + // background + .tw-bg-dolphin, + .tw-bg-white, + .tw-bg-black, + .tw-bg-zinc-50, + .tw-bg-zinc-950 { + background-color: @crust; + } + + .tw-bg-zinc-100, + .tw-bg-zinc-200, + .tw-bg-zinc-800, + .tw-bg-zinc-900 { + background-color: @mantle; + } + + // text + .tw-text-black, + .tw-text-white, + .tw-text-zinc-50, + .tw-text-zinc-950 { + color: @text; + } + + .tw-text-zinc-100, + .tw-text-zinc-200, + .tw-text-zinc-800, + .tw-text-zinc-900 { + color: @subtext1; + } + + .tw-text-zinc-300, + .tw-text-zinc-400, + .tw-text-zinc-600, + .tw-text-zinc-700 { + color: @subtext0; + } + + // border + .tw-border-zinc-800, + .tw-border-zinc-600 { + border-color: @surface0; + } + } + } +} diff --git a/styles/devdocs/README.md b/styles/devdocs/README.md new file mode 100644 index 0000000000..0a2016d903 --- /dev/null +++ b/styles/devdocs/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for DevDocs + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [ashish0kumar](https://github.com/ashish0kumar) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/devdocs/catppuccin.user.less b/styles/devdocs/catppuccin.user.less new file mode 100644 index 0000000000..5760a0fb4b --- /dev/null +++ b/styles/devdocs/catppuccin.user.less @@ -0,0 +1,106 @@ +/* ==UserStyle== +@name DevDocs Catppuccin +@namespace github.com/catppuccin/userstyles/styles/devdocs +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/devdocs +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/devdocs/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Adevdocs +@description Soothing pastel theme for DevDocs +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("devdocs.io") { + @import url("https://prismjs.catppuccin.com/variables.important.css"); + + html._theme-default { + #catppuccin(@lightFlavor); + } + html._theme-dark { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --documentBackground: @base; + --contentBackground: @base; + --textColor: @text; + --textColorLight: @subtext1; + --textColorLighter: @subtext0; + --textColorRed: @red; + + --focusBackground: @surface0; + --focusBorder: @surface1; + --focusText: @text; + --selectionBackground: @accent; + --selectionText: @base; + --selectionBorder: @surface1; + --highlightBackground: @surface2; + --loadingText: @overlay2; + + --linkColor: @blue; + --linkColorHover: @sky; + + --headerBackground: @crust; + --headerBorder: @surface1; + + --searchTagBackground: @crust; + --searchBorder: @surface1; + --inputFocusBorder: @accent; + + --sidebarBackground: @mantle; + --sidebarBorder: @surface1; + --scrollbarColor: @overlay0; + --scrollbarColorHover: @overlay1; + + --boxHeaderBackground: @mantle; + --boxHeaderColor: @text; + --boxBackground: @mantle; + --boxBorder: @surface1; + --boxBorderLight: @surface1; + + --noteBackground: @surface0; + --noteBorder: @surface1; + --noteGreenBackground: fade(@green, 30%); + --noteGreenBorder: @surface1; + --noteBlueBackground: fade(@blue, 30%); + --noteBlueBorder: @surface1; + --noteOrangeBackground: fade(@peach, 30%); + --noteOrangeBorder: @surface1; + --noteRedBackground: fade(@red, 30%); + --noteRedBorder: @surface1; + + --notifBackground: @surface0; + --notifBorder: 1px solid @surface1; + --notifColor: @text; + --tipBackground: @surface0; + --tipBorder: 1px solid @surface1; + --noticeBackground: @surface0; + --noticeBorder: @surface1; + --labelBackground: @surface0; + + ._list-arrow { + fill: @overlay0; + opacity: 1; + + &:hover { + fill: @overlay1; + } + } + + ._search > svg { + fill: @overlay2; + opacity: 1; + } + } +} diff --git a/styles/docs.deno.com/README.md b/styles/docs.deno.com/README.md new file mode 100644 index 0000000000..1f69d5e5bd --- /dev/null +++ b/styles/docs.deno.com/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for docs.deno.com + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [uncenter](https://github.com/uncenter) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/docs.deno.com/catppuccin.user.less b/styles/docs.deno.com/catppuccin.user.less new file mode 100644 index 0000000000..843df3c48c --- /dev/null +++ b/styles/docs.deno.com/catppuccin.user.less @@ -0,0 +1,303 @@ +/* ==UserStyle== +@name docs.deno.com Catppuccin +@namespace github.com/catppuccin/userstyles/styles/docs.deno.com +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/docs.deno.com +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/docs.deno.com/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Adocs.deno.com +@description Soothing pastel theme for docs.deno.com +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("docs.deno.com") { + @import url("https://prismjs.catppuccin.com/variables.important.css"); + + :root.dark { + #catppuccin(@lightFlavor); + } + :root.light { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --primary: #hsla(@accent)[]; + --background-primary: #hsla(@base)[]; + --background-secondary: #hsla(@mantle)[]; + --background-tertiary: #hsla(@crust)[]; + --foreground-primary: #hsla(@text)[]; + --foreground-secondary: #hsla(@subtext1)[]; + --foreground-tertiary: #hsla(@overlay0)[]; + --foreground-quaternary: #hsla(@surface0)[]; + --runtime-background: 124deg, 100%, 3%; + --runtime-foreground: 184deg, 100%, 90%; + --note: #hsla(@blue)[]; + --info: #hsla(@teal)[]; + --caution: #hsla(@yellow)[]; + --tip: #hsla(@green)[]; + + .banner-runtime { + background-color: fade(@accent, 10%); + color: @text; + border-color: @accent; + } + .banner-deploy { + background-color: fade(@sky, 10%); + color: @text; + border-color: @sky; + } + + .runtime-link { + color: @accent; + text-decoration-color: @accent; + + &:hover { + color: darken(@accent, 5%); + text-decoration-color: darken(@accent, 5%); + } + } + .deploy-link { + color: @sky; + text-decoration-color: @sky; + + &:hover { + color: @sapphire; + text-decoration-color: @sapphire; + } + } + .help-link { + color: @mauve; + text-decoration-color: @mauve; + + &:hover { + color: darken(@mauve, 5%); + text-decoration-color: darken(@mauve, 5%); + } + } + + .heading-runtime { + text-decoration-color: @accent; + } + .heading-deploy { + text-decoration-color: @sky; + } + .heading-purple { + text-decoration-color: @mauve; + } + + .runtime-cta { + background-color: @accent; + border-color: @accent; + + &:hover { + background-color: darken(@accent, 5%); + } + } + .jsr-cta { + background-color: @yellow; + border-color: @yellow; + color: @crust; + + &:hover { + background-color: darken(@yellow, 5%); + } + } + .deploy-cta { + background-color: @sky; + border-color: @sky; + color: @crust; + + &:hover { + background-color: @sapphire; + } + } + + &, + [data-color-mode] { + --color-fg-default: @text; + --color-fg-muted: @subtext1; + --color-canvas-default: @base; + --color-canvas-subtle: @mantle; + --color-border-default: @surface2; + --color-border-muted: @surface0; + --color-accent-fg: @accent; + --color-accent-emphasis: darken(@accent, 5%); + --color-danger-fg: @red; + + --color-prettylights-syntax-markup-deleted-bg: fade(@red, 20%); + --color-prettylights-syntax-markup-inserted-bg: fade(@green, 20%); + } + + // Logo + .fill-black { + fill: @text; + } + + &.light { + .theme-toggle { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + } + &.dark { + .theme-toggle { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + } + + .markdownBlockTitle { + background-color: @surface0; + border-color: @overlay0; + color: @subtext1; + } + .check-icon [stroke="green"] { + stroke: @green !important; + } + .markdown-body .admonition { + &.note { + background-color: fade(@blue, 5%); + .title::before { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + } + &.tip { + background-color: fade(@green, 5%); + .title::before { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + } + &.caution { + background-color: fade(@yellow, 5%); + + .title::before { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + } + &.info { + background-color: fade(@teal, 5%); + + .title::before { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + } + } + + // "Did you find what you needed?" + .bg-blue-50 { + background-color: fade(@blue, 20%); + } + .border-blue-100 { + border-color: fade(@blue, 30%); + } + + // Breadcrumbs + .crumb-link::after { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + // Toggle switches (tutorial filters) + .slider { + background-color: @overlay2; + } + .filter:checked + .slider { + background-color: @accent; + } + .slider::before { + background-color: @surface0; + } + + // Download and install tabbed component + .deno-tabs > div.deno-tabs-content > div, + .deno-tabs > ul.deno-tabs-buttons > li > button[data-active="true"] { + background-color: @surface1; + color: @text; + border-color: @overlay0; + } + .deno-tabs > ul.deno-tabs-buttons > li > button { + background-color: @surface0; + color: @subtext0; + } + .markdown-body .deno-tabs pre { + background-color: @mantle; + border-color: @overlay0; + } + + /* API reference */ + .ddoc { + #ddoc(@token, @color) { + .text-@{token} { + color: @color; + } + .bg-@{token}\/15 { + background-color: fade(@color, 15%); + } + } + + #ddoc( + Namespace, + @yellow, + ); + #ddoc( + Interface, + @sapphire, + ); + #ddoc( + Enum, + @teal, + ); + #ddoc( + Class, + @mauve, + ); + #ddoc( + Function, + @blue, + ); + #ddoc( + Variable, + @lavender, + ); + #ddoc( + TypeAlias, + @pink, + ); + } + } +} + +#hsla(@color) { + @raw: e( + %("%s, %s%, %s%", hue(@color), saturation(@color), lightness(@color)) + ); +} diff --git a/styles/docs.rs/README.md b/styles/docs.rs/README.md index 77ccbdc13b..a7a8d1db55 100644 --- a/styles/docs.rs/README.md +++ b/styles/docs.rs/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/docs.rs/catppuccin.user.css b/styles/docs.rs/catppuccin.user.less similarity index 78% rename from styles/docs.rs/catppuccin.user.css rename to styles/docs.rs/catppuccin.user.less index ea0c52063b..dd5ad7fb00 100644 --- a/styles/docs.rs/catppuccin.user.css +++ b/styles/docs.rs/catppuccin.user.less @@ -2,8 +2,8 @@ @name docs.rs Catppuccin @namespace github.com/catppuccin/userstyles/styles/docs.rs @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/docs.rs -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/docs.rs/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/docs.rs/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Adocs.rs @description Soothing pastel theme for docs.rs @author Catppuccin @@ -15,75 +15,36 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('docs.rs'), domain('doc.rust-lang.org') { - @media (prefers-color-scheme: light) { - :root:not([data-docs-rs-theme]) { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("docs.rs"), domain("doc.rust-lang.org") { + :root:not([data-docs-rs-theme]) { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root:not([data-docs-rs-theme]) { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - :root[data-docs-rs-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } :root[data-docs-rs-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); --color-background-code: @mantle; --color-background: @base; --input-color: @text; - --input-box-shadow-focus: 0 0 8px 4px @accent-color; + --input-box-shadow-focus: 0 0 8px 4px @accent; --color-border-light: @surface2; --color-border: @surface0; - --color-doc-link-background: @accent-color; - --color-doc-link-hover: @accent-color; + --color-doc-link-background: @accent; + --color-doc-link-hover: @accent; --color-error-hover: red; --color-error: red; --color-macro: red; @@ -94,7 +55,7 @@ --color-brand: @text; --color-struct: red; --color-type: @peach; - --color-url: @accent-color; + --color-url: @accent; --color-warn-background: @peach; --color-warn-msg: @crust; --color-warn-hover: red; @@ -108,12 +69,17 @@ --main-background-color: @base; --main-color: @text; - --settings-input-color: @accent-color; + --settings-input-color: @accent; --settings-input-border-color: @surface0; --settings-button-color: @text; - --settings-button-border-focus: @accent-color; + --settings-button-border-focus: @accent; + --settings-menu-filter: @subtext0-filter; + --settings-menu-hover-filter: @subtext1-filter; --sidebar-background-color: @mantle; --sidebar-background-color-hover: @crust; + --sidebar-border-color: @overlay1; + --sidebar-resizer-hover: @sky; + --sidebar-resizer-active: @sapphire; --source-sidebar-background-selected: @surface0; --source-sidebar-background-hover: @base; --code-block-background-color: @mantle; @@ -123,7 +89,7 @@ --right-side-color: @surface2; --code-attribute-color: @yellow; --toggles-color: @subtext1; - --search-input-focused-border-color: @accent-color; + --search-input-focused-border-color: @accent; --copy-path-button-color: @text; --codeblock-error-hover-color: @red; --codeblock-error-color: fade(@red, 70%); @@ -136,11 +102,11 @@ --function-link-color: @green; --macro-link-color: @green; --keyword-link-color: @yellow; - --mod-link-color: @accent-color; - --link-color: @accent-color; - --sidebar-link-color: @accent-color; + --mod-link-color: @accent; + --link-color: @accent; + --sidebar-link-color: @accent; --sidebar-current-link-background-color: @surface0; - --search-result-link-focus-background-color: fade(@accent-color, 20%); + --search-result-link-focus-background-color: fade(@accent, 20%); --search-result-border-color: @surface0; --search-color: @text; --search-error-code-background-color: red; @@ -149,10 +115,10 @@ --search-tab-title-count-color: @subtext0; --search-tab-button-not-selected-border-top-color: @crust; --search-tab-button-not-selected-background: @crust; - --search-tab-button-selected-border-top-color: @accent-color; + --search-tab-button-selected-border-top-color: @accent; --search-tab-button-selected-background: @base; --stab-background-color: @surface0; - --stab-code-color: @accent-color; + --stab-code-color: @accent; --code-highlight-kw-color: @mauve; --code-highlight-kw-2-color: @mauve; --code-highlight-lifetime-color: @blue; @@ -165,14 +131,14 @@ --code-highlight-self-color: @red; --code-highlight-macro-color: @blue; --code-highlight-question-mark-color: @teal; - --code-highlight-comment-color: @overlay0; - --code-highlight-doc-comment-color: @overlay0; + --code-highlight-comment-color: @overlay2; + --code-highlight-doc-comment-color: @overlay2; --color-syntax-foreground: inherit; --color-syntax-attribute: @yellow; --color-syntax-background: @mantle; --color-syntax-bool: @red; - --color-syntax-comment: @overlay0; - --color-syntax-doc-comment: @overlay0; + --color-syntax-comment: @overlay2; + --color-syntax-doc-comment: @overlay2; --color-syntax-keyword1: @mauve; --color-syntax-keyword2: @mauve; --color-syntax-lifetime: @blue; @@ -183,14 +149,14 @@ --color-syntax-question-mark: @teal; --color-syntax-self: @red; --color-syntax-string: @green; - --src-line-numbers-span-color: @accent-color; - --src-line-number-highlighted-background-color: fade(@accent-color, 30%); + --src-line-numbers-span-color: @accent; + --src-line-number-highlighted-background-color: fade(@accent, 30%); --test-arrow-color: #dedede; --test-arrow-background-color: red; --test-arrow-hover-color: #dedede; --test-arrow-hover-background-color: red; - --target-background-color: fade(@accent-color, 10%); - --target-border-color: @accent-color; + --target-background-color: fade(@accent, 10%); + --target-border-color: @accent; --kbd-color: @text; --kbd-background: @mantle; --kbd-box-shadow-color: @surface1; @@ -201,16 +167,14 @@ --codeblock-link-background: fade(@surface0, 50%); --scrape-example-toggle-line-background: red; --scrape-example-toggle-line-hover-background: red; - --scrape-example-code-line-highlight: fade(@accent-color, 40%); - --scrape-example-code-line-highlight-focus: fade(@accent-color, 40%); + --scrape-example-code-line-highlight: fade(@accent, 40%); + --scrape-example-code-line-highlight-focus: fade(@accent, 40%); --scrape-example-help-border-color: @subtext0; --scrape-example-help-color: @subtext1; --scrape-example-help-hover-border-color: @text; --scrape-example-help-hover-color: @text; --scrape-example-code-wrapper-background-start: @base; --scrape-example-code-wrapper-background-end: @base; - --sidebar-resizer-hover: @sky; - --sidebar-resizer-active: @sapphire; select { background-color: @mantle; @@ -328,13 +292,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/docs.rs/preview.webp b/styles/docs.rs/preview.webp deleted file mode 100644 index c5689cb722..0000000000 --- a/styles/docs.rs/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:17c6374e28c3bea67f8e08e1e9d30a832d4795e8446706f917180be8d4ada957 -size 84206 diff --git a/styles/duckduckgo/README.md b/styles/duckduckgo/README.md index 35aeaea620..59720b0c45 100644 --- a/styles/duckduckgo/README.md +++ b/styles/duckduckgo/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/duckduckgo/catppuccin.user.css b/styles/duckduckgo/catppuccin.user.less similarity index 88% rename from styles/duckduckgo/catppuccin.user.css rename to styles/duckduckgo/catppuccin.user.less index 19e8737c33..7cd043f716 100644 --- a/styles/duckduckgo/catppuccin.user.css +++ b/styles/duckduckgo/catppuccin.user.less @@ -2,8 +2,8 @@ @name DuckDuckGo Catppuccin @namespace github.com/catppuccin/userstyles/styles/duckduckgo @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/duckduckgo -@version 0.2.7 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/duckduckgo/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/duckduckgo/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aduckduckgo @description Soothing pastel theme for DuckDuckGo @author Catppuccin @@ -15,71 +15,46 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain(duckduckgo.com) { - :root:not(.dark-bg) { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("duckduckgo.com"), domain("duck.ai") { + :root:not(.dark-bg, .no-theme) { + #catppuccin(@lightFlavor); } :root.dark-bg { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); + :root.no-theme { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); --sds-color-text-02: @text !important; - --theme-col-txt-page-separator: @text!important; + --sds-color-text-disabled: @overlay0 !important; + --theme-col-txt-page-separator: @text !important; --theme-col-page-separator: @text !important; --theme-col-txt-url: @text !important; - --theme-col-txt-title-visited: @mauve !important; + --theme-col-txt-title: @blue !important; + --theme-col-txt-title-visited: @lavender !important; --theme-col-txt-snippet: @text !important; --theme-col-txt-card-title: @text; --theme-col-txt-url-domain: @subtext1 !important; - --theme-col-txt-title: @blue !important; --theme-col-bg-card: @surface0 !important; --theme-col-about-link: @blue; --theme-col-border-ui: @surface1 !important; --theme-col-bg-expandcollapse: @surface0 !important; - --sds-color-palette-gray-60: @accent-color !important; + --sds-color-palette-gray-60: @accent !important; + --sds-color-text-accent-01: @accent !important; --theme-col-txt-msg: @text !important; --theme-col-txt-url-path: @subtext0 !important; --theme-col-border-expandcollapse: @surface1; @@ -88,7 +63,7 @@ --theme-col-bg-page: @base !important; --sds-color-text-01: @text !important; --sds-color-text-on-color: @base !important; - --theme-spp-high-contrast-text-secondary: @accent-color !important; + --theme-spp-high-contrast-text-secondary: @accent !important; --theme-spp-high-contrast-card-indicator-color: @surface0 !important; --theme-spp-high-contrast-title-span-text: @text !important; --theme-spp-high-contrast-bg: @surface0 !important; @@ -100,7 +75,7 @@ --sds-color-text-03: @subtext0 !important; --col-slate-light: @subtext0; --col-silver-dark: @overlay1; - --theme-col-txt-button-secondary: @accent-color !important; + --theme-col-txt-button-secondary: @accent !important; --theme-bg-legacy-home: @base !important; --theme-bg-cta-cards: @surface0 !important; --theme-button-primary-bg: @blue !important; @@ -149,6 +124,7 @@ --theme-col-bg-header: @mantle !important; --theme-col-bg-header-modal: @surface0 !important; --theme-col-bg-button-primary: @blue !important; + --sds-color-background-dark: @crust !important; /* ai chat */ --sds-color-text-link-02-hover: @text !important; --theme-dc-color-background-dark: @base !important; @@ -165,16 +141,34 @@ --sds-color-text-success: @green !important; --sds-color-text-link-01: @blue !important; --sds-color-background-container-01: @surface0 !important; - --sds-color-border-accent-01: @accent-color !important; + --sds-color-border-accent-01: @accent !important; --theme-dc-color-container-message: @surface0 !important; --sds-color-palette-gray-85: @surface1 !important; --sds-color-palette-white: @crust !important; - --sds-color-background-accent-01: @accent-color !important; + --sds-color-background-accent-01: @accent !important; --theme-col-txt-card-body-light: @text !important; --theme-col-bg-page-alt-2: @surface0 !important; + --theme-col-bg-ui-active: @surface1 !important; --theme-dc-color-llama-main: @pink !important; --theme-dc-color-mixtral-main: @peach !important; --theme-dc-color-anchor-sleep: @subtext0 !important; + --theme-assist-bg-chat-system: @mantle !important; + --theme-assist-gradient-stop: @mantle !important; + --sds-color-palette-gray-40: @text !important; + /* maps */ + --sds-color-background-01: @base !important; + --sds-color-background-02: @mantle !important; + --sds-color-palette-red-40: @red !important; + --sds-color-border-01: @surface0 !important; + --col-blue-30: @blue !important; + --sds-color-palette-green-60: @green !important; + --sds-color-background-utility: @surface0 !important; + + .address-detail { + background-color: @mantle; + color: @text; + border-color: @surface0; + } .footer, .footer--mobile, @@ -295,7 +289,7 @@ } .calendar__today { color: @mantle; - background-color: @accent-color; + background-color: @accent; } .zci.is-active { @@ -303,7 +297,7 @@ } .module__toggle--more::after { - background: linear-gradient(rgba(40, 40, 40, 0), @surface0); + background: linear-gradient(transparent, @surface0); } /* button on hover */ @@ -331,7 +325,7 @@ } .stocks-module__timePeriod.selected { color: @mantle; - background-color: @accent-color; + background-color: @accent; } .ia-module--stocks.increase .color-coded { color: @green !important; @@ -414,7 +408,7 @@ border-color: @surface2; } .module__inner-toggle--chevron { - color: @accent-color !important; + color: @accent !important; background-color: @surface1 !important; border-color: @surface2; } @@ -422,6 +416,14 @@ .module__inner-toggle::after { background-color: @surface2 !important; } + .module--lyrics:not(.is-expanded) + .module--lyrics__footer.can-expand::after { + background: linear-gradient(transparent, @surface0); + } + .module--lyrics__explicit-tag { + border-color: @subtext1; + color: @subtext0; + } // translation boxes .module--translations .dropdown--translation-select, @@ -450,12 +452,12 @@ //coding info box .module:not( - .module--carousel, - .module--placeholder, - .module--images, - .module--translations, - .module__chromeless - ) { + .module--carousel, + .module--placeholder, + .module--images, + .module--translations, + .module__chromeless + ) { background: @surface0 !important; border-color: @surface1 !important; } @@ -474,7 +476,7 @@ color: @text !important; } code { - background-color: @base !important; + background-color: @mantle !important; } .lit { color: @peach !important; @@ -514,7 +516,7 @@ } .module--definitions__group ol li::before { - color: @accent-color !important; + color: @accent !important; } .module--definitions__usage { @@ -526,10 +528,10 @@ } .play-btn__icn_hollow { - fill: @accent-color !important; + fill: @accent !important; } .module__toggle { - color: @accent-color !important; + color: @accent !important; } // weather info box @@ -551,7 +553,7 @@ } .module__temperature-unit, .module__temperature-unit:hover { - color: @accent-color !important; + color: @accent !important; } .module__detail__precip-label, .module__items-precip-label, @@ -570,7 +572,7 @@ border-color: @surface2 !important; } .module__weatherkit-logo { - fill: @accent-color; + fill: @accent; } .module__warnings, .module__temperature-unit--on { @@ -636,9 +638,7 @@ color: @text !important; } .tile__display.selected { - box-shadow: - inset -1px -1px 0 @blue, - inset 1px 1px 0 @blue !important; + box-shadow: inset -1px -1px 0 @blue, inset 1px 1px 0 @blue !important; } .tile__ctrl--important { background-color: @yellow !important; @@ -650,7 +650,7 @@ color: @subtext0 !important; } .tile__option--active { - color: @accent-color !important; + color: @accent !important; } .bg-delayed-color { @@ -802,6 +802,13 @@ border-color: @surface1 !important; } + .modal__header, + .module__section, + .module__section:first-child.place-detail__section--tab, + .module__clickable-header { + border-color: @surface1 !important; + } + .btn.is-disabled:hover, .frm__switch__label:hover, .feedback-modal__submit.is-disabled:hover, @@ -811,17 +818,17 @@ border-color: @surface2 !important; } .is-checked .frm__switch__label.btn { - background-color: @accent-color !important; + background-color: @accent !important; color: @mantle !important; } .js-set-exit { - background-color: @accent-color !important; - border-color: @accent-color !important; + background-color: @accent !important; + border-color: @accent !important; color: @base !important; } .js-set-exit:hover { - background-color: fade(@accent-color, 80%) !important; - border-color: fade(@accent-color, 80%) !important; + background-color: fade(@accent, 80%) !important; + border-color: fade(@accent, 80%) !important; color: @base !important; } .set-bookmarklet__data { @@ -835,11 +842,11 @@ } .metabar__dropdowns-wrap::before { - background-image: linear-gradient(90deg, @base, rgba(255, 255, 255, 0)); + background-image: linear-gradient(90deg, @base, transparent); } .metabar__dropdowns-wrap::after { - background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), @base); + background-image: linear-gradient(90deg, transparent, @base); } .nav-menu__item__badge { @@ -854,14 +861,14 @@ } .zcm--right-fade::before { - background: linear-gradient(90deg, rgba(255, 255, 255, 0), @mantle); + background: linear-gradient(90deg, transparent, @mantle); } .search-filters-wrap::before { - background: linear-gradient(90deg, @base, rgba(255, 255, 255, 0)); + background: linear-gradient(90deg, @base, transparent); } .search-filters-wrap::after { - background: linear-gradient(90deg, rgba(255, 255, 255, 0), @base); + background: linear-gradient(90deg, transparent, @base); } .footer, @@ -873,7 +880,7 @@ #duckbar, .zcm__link:not(.dropdown__button).is-active, .set-main-footer { - border-color: @accent-color !important; + border-color: @accent !important; } #more-results { @@ -924,7 +931,8 @@ .frm__label, .js-cloudsave-new-suggestion, .zci__body, - .zci__body a { + .zci__body a, + .c-base__title { color: @text !important; } @@ -988,12 +996,12 @@ .detail--xd .tile-nav--sm, .detail__close, .module--definitions__collapsed-group ol li::before { - color: @accent-color !important; + color: @accent !important; } .search__button:hover, .search--header.has-text.search--hover .search__button { - background-color: @accent-color !important; + background-color: @accent !important; color: @base !important; } @@ -1018,7 +1026,7 @@ color: @text !important; } .frm__select::after { - color: @accent-color !important; + color: @accent !important; } .switch, @@ -1043,7 +1051,7 @@ } .switch.is-on { - background-color: @accent-color !important; + background-color: @accent !important; } .dropdown__switch.is-on::before { @@ -1108,55 +1116,31 @@ } } -@-moz-document domain(start.duckduckgo.com) { +@-moz-document domain("start.duckduckgo.com") { :root:not(.theme-dark) { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } :root.theme-dark { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); + #catppuccin(@flavor) { + #lib.palette(); + + color-scheme: if(@flavor = latte, light, dark); ::selection { - background-color: fade(@accent-color, 30%); + background-color: fade(@accent, 30%); } + // TODO: Why does this ::placeholder from defaults explicitly not apply to ? textarea { &::placeholder { color: @subtext0 !important; } } + input { background-color: @surface0 !important; color: @text !important; @@ -1181,7 +1165,7 @@ --color-yellow60: @yellow !important; --theme-button-primary-bg: @blue !important; - --theme-searchbox-caret-bg: @accent-color !important; + --theme-searchbox-caret-bg: @accent !important; .home_root__naJUp { --theme-bg-home: @base !important; @@ -1191,8 +1175,7 @@ --theme-border-color-home-searchbox: @surface0 !important; } .searchbox_suggestions__umkQH { - --theme-searchbox-bg: @surface0 !important - ; + --theme-searchbox-bg: @surface0 !important; } .minimal-homepage_minimalHeroLogo__QSVlf { @svg: escape( @@ -1214,17 +1197,7 @@ .searchbox_searchButton__F5Bwq:not(:disabled), .searchbox_hasQuery__j8_VE:focus-within { color: @mantle !important; - background-color: @accent-color !important; + background-color: @accent !important; } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/duckduckgo/preview.webp b/styles/duckduckgo/preview.webp deleted file mode 100644 index 67998370ea..0000000000 --- a/styles/duckduckgo/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:bf2c0df024785966dac281df7bb976d608ff7ed16d869a3a20ba3d7b64e5f6b8 -size 510052 diff --git a/styles/ecosia/README.md b/styles/ecosia/README.md index f782e0f0b2..2ee1e8da21 100644 --- a/styles/ecosia/README.md +++ b/styles/ecosia/README.md @@ -10,18 +10,19 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer -- [Isabel](https://github.com/isabelroses) +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find! +## ๐Ÿ’– Past Maintainer +- [isabelroses](https://github.com/isabelroses)   diff --git a/styles/ecosia/catppuccin.user.css b/styles/ecosia/catppuccin.user.css deleted file mode 100644 index 37faab97d5..0000000000 --- a/styles/ecosia/catppuccin.user.css +++ /dev/null @@ -1,150 +0,0 @@ -/* ==UserStyle== -@name Ecosia Catppuccin -@namespace github.com/catppuccin/userstyles/styles/ecosia -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/ecosia -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/ecosia/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aecosia -@description Soothing pastel theme for Ecosia -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("ecosia.org") { - :root.light { - #catppuccin(@lightFlavor, @accentColor); - } - - :root.dark { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --color-brand-primary: @accent-color !important; - --color-brand-secondary: @crust !important; - --color-error: @red !important; - --color-success: @green !important; - --color-disabled: @overlay1 !important; - --color-button-background-primary: @accent-color !important; - --color-button-background-primary-active: @accent-color !important; - --color-button-background-primary-hover: @accent-color; - --color-button-background-secondary: @surface0 !important; - --color-button-background-secondary-active: @surface2 !important; - --color-button-background-secondary-hover: @surface1 !important; - --color-button-content-primary: @base !important; - --color-button-content-secondary: @text !important; - --color-button-content-tertiary: @accent-color !important; - --color-button-border: @surface0 !important; - --color-button-background-transparent-hover: @surface1; - --color-button-background-transparent-active: @surface2; - --color-background-primary: @base !important; - --color-background-secondary: @crust !important; - --color-background-tertiary: @mantle !important; - --color-background-quaternary: @surface0; - --color-background-elevation-1: @mantle !important; - --color-highlighter: @surface0 !important; - --color-highlight-primary: @surface0 !important; - --color-overlay-primary: @overlay0 !important; - --color-overlay-secondary: @overlay1 !important; - --color-text-primary: @text !important; - --color-text-secondary: @subtext0 !important; - --color-text-tertiary: @text !important; - --color-link-primary: @sapphire !important; - --color-link-secondary: @sky !important; - --color-url: @sapphire !important; - --color-link-results-default: @sapphire !important; - --color-link-results-visited: @teal !important; - --color-decorative-icon: @accent-color !important; - --color-elevation-layer-1: @surface1; - --color-elevation-layer-2: @surface2; - --color-decorative-border-1: @surface1 !important; - --color-focused: @accent-color !important; - --color-form-border-default: @surface0 !important; - --color-form-border-hover: @surface1 !important; - --color-form-border-primary-active: @accent-color !important; - --color-tripadvisor-rating: @subtext0 !important; - --color-tree-counter-tree-tall: @yellow !important; - --color-green-leaf-icon-color-top: @green !important; - --color-green-leaf-icon-color-bottom: @green !important; - --color-fossil-fuel-icon-color-top: @flamingo !important; - --color-fossil-fuel-icon-color-bottom: @maroon !important; - - /* search page */ - --color-above-fold-background: @surface0 !important; - --color-above-fold-background-addon: @overlay1 !important; - --color-above-fold-text: @text !important; - --color-section-wrapper-background-gray: @surface1 !important; - --color-section-wrapper-background-dark-green: @surface0 !important; - --color-section-wrapper-background-light-green: @surface0 !important; - --color-section-header-title: @text !important; - --color-projects-title: @text !important; - --color-projects-description: @surface1; - --color-financial-report-total-background: @surface0 !important; - --color-financial-report-total-text: @text !important; - --color-forest-background-addon: @surface1 !important; - --color-forest-background-secondary: @surface0 !important; - --color-before-after-text: @text !important; - - /* override color digit on homepage */ - .count__digit, - .counter__description { - color: @text !important; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/ecosia/catppuccin.user.less b/styles/ecosia/catppuccin.user.less new file mode 100644 index 0000000000..2ecfea20a6 --- /dev/null +++ b/styles/ecosia/catppuccin.user.less @@ -0,0 +1,104 @@ +/* ==UserStyle== +@name Ecosia Catppuccin +@namespace github.com/catppuccin/userstyles/styles/ecosia +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/ecosia +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/ecosia/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aecosia +@description Soothing pastel theme for Ecosia +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("ecosia.org") { + :root.light { + #catppuccin(@lightFlavor); + } + + :root.dark { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --color-brand-primary: @accent !important; + --color-brand-secondary: @crust !important; + --color-error: @red !important; + --color-success: @green !important; + --color-disabled: @overlay1 !important; + --color-button-background-primary: @accent !important; + --color-button-background-primary-active: @accent !important; + --color-button-background-primary-hover: @accent; + --color-button-background-secondary: @surface0 !important; + --color-button-background-secondary-active: @surface2 !important; + --color-button-background-secondary-hover: @surface1 !important; + --color-button-content-primary: @base !important; + --color-button-content-secondary: @text !important; + --color-button-content-tertiary: @accent !important; + --color-button-border: @surface0 !important; + --color-button-background-transparent-hover: @surface1; + --color-button-background-transparent-active: @surface2; + --color-background-primary: @base !important; + --color-background-secondary: @crust !important; + --color-background-tertiary: @mantle !important; + --color-background-quaternary: @surface0; + --color-background-elevation-1: @mantle !important; + --color-highlighter: @surface0 !important; + --color-highlight-primary: @surface0 !important; + --color-overlay-primary: @overlay0 !important; + --color-overlay-secondary: @overlay1 !important; + --color-text-primary: @text !important; + --color-text-secondary: @subtext0 !important; + --color-text-tertiary: @text !important; + --color-link-primary: @sapphire !important; + --color-link-secondary: @sky !important; + --color-url: @sapphire !important; + --color-link-results-default: @sapphire !important; + --color-link-results-visited: @teal !important; + --color-decorative-icon: @accent !important; + --color-elevation-layer-1: @surface1; + --color-elevation-layer-2: @surface2; + --color-decorative-border-1: @surface1 !important; + --color-focused: @accent !important; + --color-form-border-default: @surface0 !important; + --color-form-border-hover: @surface1 !important; + --color-form-border-primary-active: @accent !important; + --color-tripadvisor-rating: @subtext0 !important; + --color-tree-counter-tree-tall: @yellow !important; + --color-green-leaf-icon-color-top: @green !important; + --color-green-leaf-icon-color-bottom: @green !important; + --color-fossil-fuel-icon-color-top: @flamingo !important; + --color-fossil-fuel-icon-color-bottom: @maroon !important; + + /* search page */ + --color-above-fold-background: @surface0 !important; + --color-above-fold-background-addon: @overlay1 !important; + --color-above-fold-text: @text !important; + --color-section-wrapper-background-gray: @surface1 !important; + --color-section-wrapper-background-dark-green: @surface0 !important; + --color-section-wrapper-background-light-green: @surface0 !important; + --color-section-header-title: @text !important; + --color-projects-title: @text !important; + --color-projects-description: @surface1; + --color-financial-report-total-background: @surface0 !important; + --color-financial-report-total-text: @text !important; + --color-forest-background-addon: @surface1 !important; + --color-forest-background-secondary: @surface0 !important; + --color-before-after-text: @text !important; + + /* override color digit on homepage */ + .count__digit, + .counter__description { + color: @text !important; + } + } +} diff --git a/styles/ecosia/preview.webp b/styles/ecosia/preview.webp deleted file mode 100644 index d4f160cb7c..0000000000 --- a/styles/ecosia/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:0d85ff2ba09f44c61e00eaf8a723e91ec55622efa4e1ef7a7ba14f11b7f37898 -size 597086 diff --git a/styles/elk/README.md b/styles/elk/README.md index bcc38d4526..129b7433be 100644 --- a/styles/elk/README.md +++ b/styles/elk/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Ryan Cao](https://github.com/ryanccn) +- [ryanccn](https://github.com/ryanccn)   diff --git a/styles/elk/catppuccin.user.css b/styles/elk/catppuccin.user.css deleted file mode 100644 index 63731a135d..0000000000 --- a/styles/elk/catppuccin.user.css +++ /dev/null @@ -1,171 +0,0 @@ -/* ==UserStyle== -@name Elk Catppuccin -@namespace github.com/catppuccin/userstyles/styles/elk -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/elk -@version 0.2.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/elk/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aelk -@description Soothing pastel theme for Elk -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("elk.zone") { - :root.dark { - #catppuccin(@darkFlavor, @accentColor); - } - :root.light { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --c-primary: @accent-color !important; - --c-primary-active: lighten(@accent-color, 10%) !important; - --c-primary-light: @surface0 !important; - --c-border: @surface0 !important; - --c-border-dark: @surface1 !important; - --c-bg-base: @base !important; - --rgb-bg-base: red(@mantle), green(@mantle), blue(@mantle) !important; - --c-bg-active: @surface0 !important; - --c-bg-code: @surface0 !important; - --c-bg-selection: @accent-color !important; - --c-bg-fade: @surface0 !important; - --c-text-base: @text !important; - --c-text-code: @rosewater !important; - --c-text-secondary: @subtext0 !important; - --c-text-secondary-light: @subtext1 !important; - --c-bg-btn-disabled: @surface1 !important; - --c-text-btn-disabled: @text !important; - --c-text-btn: @text !important; - --c-success: @green !important; - --c-warning: @yellow !important; - --c-error: @red !important; - --c-danger: @red !important; - --c-danger-active: lighten(@red, 10%) !important; - --c-bg-dm: @surface0 !important; - - .btn-solid, - [btn-solid=""] { - color: var(--c-bg-base); - } - - ::-webkit-scrollbar-thumb { - background: alpha(@surface1, 0.7); - } - - ::-webkit-scrollbar-thumb:hover { - background: alpha(@surface1, 0.8); - } - - [text-red], - [text-red-600], - [hover^="text-red"]:hover { - color: rgbA(red(@red), green(@red), blue(@red), var(--un-text-opacity)); - } - - [text-blue], - [hover^="text-blue"]:hover { - color: rgbA( - red(@blue), - green(@blue), - blue(@blue), - var(--un-text-opacity) - ); - } - - [text-green], - [hover^="text-green"]:hover { - color: rgbA( - red(@green), - green(@green), - blue(@green), - var(--un-text-opacity) - ); - } - - [text-yellow], - [hover^="text-yellow"]:hover { - color: rgbA( - red(@yellow), - green(@yellow), - blue(@yellow), - var(--un-text-opacity) - ); - } - - [text-purple], - [hover^="text-purple"]:hover { - color: rgbA( - red(@lavender), - green(@lavender), - blue(@lavender), - var(--un-text-opacity) - ); - } - - [group-hover^="bg-purple/10"]:hover { - background-color: alpha(@lavender, 0.1); - } - - .filter-saturate-0, - [filter-saturate-0=""] { - filter: none; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/elk/catppuccin.user.less b/styles/elk/catppuccin.user.less new file mode 100644 index 0000000000..7eebf6054f --- /dev/null +++ b/styles/elk/catppuccin.user.less @@ -0,0 +1,105 @@ +/* ==UserStyle== +@name Elk Catppuccin +@namespace github.com/catppuccin/userstyles/styles/elk +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/elk +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/elk/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aelk +@description Soothing pastel theme for Elk +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("elk.zone") { + :root.dark { + #catppuccin(@darkFlavor); + } + :root.light { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --c-primary: @accent !important; + --c-primary-active: lighten(@accent, 10%) !important; + --c-primary-light: @surface0 !important; + --c-border: @surface0 !important; + --c-border-dark: @surface1 !important; + --c-bg-base: @base !important; + --rgb-bg-base: #lib.rgbify(@mantle)[] !important; + --c-bg-active: @surface0 !important; + --c-bg-code: @surface0 !important; + --c-bg-selection: @accent !important; + --c-bg-fade: @surface0 !important; + --c-text-base: @text !important; + --c-text-code: @rosewater !important; + --c-text-secondary: @subtext0 !important; + --c-text-secondary-light: @subtext1 !important; + --c-bg-btn-disabled: @surface1 !important; + --c-text-btn-disabled: @text !important; + --c-text-btn: @text !important; + --c-success: @green !important; + --c-warning: @yellow !important; + --c-error: @red !important; + --c-danger: @red !important; + --c-danger-active: lighten(@red, 10%) !important; + --c-bg-dm: @surface0 !important; + + .btn-solid, + [btn-solid=""] { + color: var(--c-bg-base); + } + + ::-webkit-scrollbar-thumb { + background: fade(@surface1, 70%); + } + + ::-webkit-scrollbar-thumb:hover { + background: fade(@surface1, 80%); + } + + [text-red], + [text-red-600], + [hover^="text-red"]:hover { + color: rgba(#lib.rgbify(@red)[], var(--un-text-opacity)); + } + + [text-blue], + [hover^="text-blue"]:hover { + color: rgba(#lib.rgbify(@blue)[], var(--un-text-opacity)); + } + + [text-green], + [hover^="text-green"]:hover { + color: rgba(#lib.rgbify(@green)[], var(--un-text-opacity)); + } + + [text-yellow], + [hover^="text-yellow"]:hover { + color: rgba(#lib.rgbify(@yellow)[], var(--un-text-opacity)); + } + + [text-purple], + [hover^="text-purple"]:hover { + color: rgba(#lib.rgbify(@lavender)[], var(--un-text-opacity)); + } + + [group-hover^="bg-purple/10"]:hover { + background-color: fade(@lavender, 10%); + } + + .filter-saturate-0, + [filter-saturate-0=""] { + filter: none; + } + } +} diff --git a/styles/elk/preview.webp b/styles/elk/preview.webp deleted file mode 100644 index a8d071be13..0000000000 --- a/styles/elk/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:29f5034c7ec90a82e13585e58cf24a8c7237566adac0841c01a560a228e8b438 -size 152892 diff --git a/styles/formative/README.md b/styles/formative/README.md index e3709af423..158744c56c 100644 --- a/styles/formative/README.md +++ b/styles/formative/README.md @@ -10,18 +10,19 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer -- [r58Playz](https://github.com/r58Playz) +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find! +## ๐Ÿ’– Past Maintainer +- [r58Playz](https://github.com/r58Playz)   diff --git a/styles/formative/catppuccin.user.css b/styles/formative/catppuccin.user.less similarity index 82% rename from styles/formative/catppuccin.user.css rename to styles/formative/catppuccin.user.less index 20a2e1b922..b768c79b0c 100644 --- a/styles/formative/catppuccin.user.css +++ b/styles/formative/catppuccin.user.less @@ -2,8 +2,8 @@ @name Formative Catppuccin @namespace github.com/catppuccin/userstyles/styles/formative @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/formative -@version 0.2.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/formative/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/formative/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aformative @description Soothing pastel theme for Formative @author Catppuccin @@ -15,60 +15,26 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('app.formative.com'), domain("goformative.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("app.formative.com"), domain("goformative.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @contrast-accent-color: if(@lookup = latte, @text, @base); + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } + @contrast: if(@flavor = latte, @text, @base); input, textarea { - &::placeholder { - color: @subtext0 !important; - } border-color: @overlay0; color: @text; } @@ -114,21 +80,21 @@ background: @surface0; .SideTabItem__RootButton-sc-vtkzgr-0 { &.selected { - background: fade(@accent-color, 50%); + background: fade(@accent, 50%); &::after { - background: @accent-color; + background: @accent; } } &:hover { .avatar { - box-shadow: @accent-color 0 0 0 1px; + box-shadow: @accent 0 0 0 1px; } } &:not(.selected):hover { .side-tab-item-label-div, .material-icons-outlined, .svg-icons svg { - color: @accent-color; + color: @accent; } } } @@ -139,8 +105,8 @@ } } .notifications-count { - background: @accent-color; - color: @contrast-accent-color; + background: @accent; + color: @contrast; } .NotificationCenterAlert__TriggerDiv-sc-165xmi4-0 { background-color: @surface0; @@ -149,7 +115,7 @@ } } .avatar:hover { - box-shadow: @accent-color 0 0 0 1px; + box-shadow: @accent 0 0 0 1px; } .MainAppHeader__RootDiv-sc-1gw0bt9-0 { background-color: @surface0; @@ -162,10 +128,10 @@ color: @text; } .TabsItem__RootDiv-sc-tj1og8-0:hover > a { - color: @accent-color; + color: @accent; } .TabsItem__SelectedLineDiv-sc-tj1og8-1 { - background: @accent-color !important; + background: @accent !important; } .TabsItem__TabLink-sc-tj1og8-3:focus-visible { background: transparent !important; @@ -242,13 +208,13 @@ .TabsItem__TabDiv-sc-tj1og8-4:hover, .RespondusTroubleshootLink__TroubleshootingAnchor-sc-17na5u4-7, .Summary__RawButtonLink-sc-1ofq6fd-2 { - color: @accent-color; + color: @accent; } .FormativesShelf__StyledSecondaryHeader-sc-1pswvpk-4 { border-color: @overlay0; } .TabsItem__SelectedLineDiv-sc-tj1og8-1 { - background: @accent-color !important; + background: @accent !important; } .Pill__RootDiv-sc-4b6mpn-0, .ItemInfoPill-sc-ecx83e-0, @@ -275,8 +241,8 @@ background: @surface0; border-color: @overlay0; &.selected { - border-color: @accent-color; - outline-color: @accent-color; + border-color: @accent; + outline-color: @accent; } .material-icons-outlined { color: @text; @@ -284,14 +250,14 @@ &:hover { .FormativeCard__TitleOverflowEllipsis-sc-tkxjaz-7, .SectionCard__SectionTitleOverflowEllipsis-sc-ir1v2v-4 { - color: @accent-color; + color: @accent; } } } .ClassAvatar__RootDiv-sc-i7tto7-0, .avatar > div { - background: @accent-color; - color: @contrast-accent-color; + background: @accent; + color: @contrast; } .ReactSelect__control { background: @surface0; @@ -305,7 +271,7 @@ color: @text; } &:focus-within { - border-color: @accent-color !important; + border-color: @accent !important; } } .react-select-icon { @@ -316,14 +282,14 @@ color: @text; .SearchBarOption__RootLink-sc-191bb28-1:hover .SearchBarOption__TitleOverflowEllipsis-sc-191bb28-0 { - color: @accent-color; + color: @accent; } .ReactSelect__option--is-focused { background: @overlay0; } .ReactSelect__option--is-selected { - background: @accent-color; - color: @contrast-accent-color; + background: @accent; + color: @contrast; } .ReactSelect__menu-notice { color: @subtext0; @@ -340,19 +306,19 @@ background: @surface0 !important; &, .material-icons-outlined { - color: @accent-color !important; + color: @accent !important; border-color: @overlay0; } &:hover, &:enabled:focus { background: @surface1; - border-color: @accent-color; + border-color: @accent; } } .Switch__RootButton-sc-1ss5zxi-0 { background: @surface0; &[aria-checked="true"] { - background: @accent-color; + background: @accent; } .Switch__BallDiv-sc-1ss5zxi-1 { background: @overlay0; @@ -369,16 +335,16 @@ } .FormativeCardScore__PercentageSpan-sc-p5mc30-1 { &[style*="rgba(32, 213, 171, 0.2)"] { - background: fade(@green, 50) !important; + background: fade(@green, 50%) !important; } &[style*="rgba(255, 222, 51, 0.2)"] { - background: fade(@yellow, 50) !important; + background: fade(@yellow, 50%) !important; } &[style*="rgba(0, 165, 251, 0.2)"] { - background: fade(@blue, 50) !important; + background: fade(@blue, 50%) !important; } &[style*="rgba(255, 76, 77, 0.2)"] { - background: fade(@red, 50) !important; + background: fade(@red, 50%) !important; } } @@ -411,7 +377,7 @@ } .DropdownList__TriggerButton-sc-1hvvmg1-0, .EmptyExplainer__StyledMaterialIcon-sc-1ixiesy-4 { - color: @accent-color; + color: @accent; } .ProfileAccountInfo__DashedGroup-sc-1nbrrm9-2 { @@ -423,10 +389,10 @@ &:focus, &.selected { .BadgeCard__BadgeLabelDiv-sc-13976oo-8 { - color: @accent-color; + color: @accent; } .Card__RootDiv-sc-4gt2nj-0 { - border-color: @accent-color; + border-color: @accent; } } .BadgeCard__ProgressPercentSpan-sc-13976oo-7 { @@ -465,13 +431,13 @@ .ProgressBar__ProgressDiv-sc-4qm1te-0 { background: @overlay0; .ProgressBar__ProgressBarDiv-sc-4qm1te-2 { - background: @accent-color; + background: @accent; } } .notification { &.notification-success { background: @green !important; - color: @contrast-accent-color !important; + color: @contrast !important; } } .Tooltip__Content-sc-1k6bq57-0 { @@ -483,7 +449,7 @@ } } .Modal__Overlay-sc-1uf7odj-0 { - background: fade(@crust, 80); + background: fade(@crust, 80%); } .Modal__Content-sc-1uf7odj-1 { background: @base; @@ -502,7 +468,7 @@ background: @surface0; &:enabled:hover { background: @surface1 !important; - border-color: @accent-color; + border-color: @accent; } } .CopyablePracticeSetInfo__LinkText-sc-14zdsnw-3, @@ -514,12 +480,12 @@ outline-color: @text !important; } &[style*="outline: rgb(13, 100, 242)"] { - outline-color: @accent-color !important; + outline-color: @accent !important; } } } .ReactModal__Overlay { - background: fade(@crust, 80); + background: fade(@crust, 80%); .ReactModal__ActualContent { background: @base !important; .ModalBody-sc-1lg094f-0 > * { @@ -539,7 +505,7 @@ color: @overlay2 !important; } &:focus { - border-color: @accent-color; + border-color: @accent; } } &.CookiePolicyModal__AccordionDiv-sc-dpnzx7-0 @@ -554,14 +520,14 @@ color: @text; } .CookiePolicyModal__BlueAlertText-sc-dpnzx7-5 { - color: @accent-color; + color: @accent; } } } .ModalBody-sc-1lg094f-0:has(.Submit__ContentTitleH3-sc-1vceatk-1) svg path { - fill: @accent-color; + fill: @accent; } .ModalTitle { background: @base; @@ -577,7 +543,7 @@ } &[src*="match-preview"] { @svg: escape( - '' + '' ); content: url("data:image/svg+xml,@{svg}"); } @@ -611,7 +577,7 @@ .material-icons-outlined { color: @text; &:hover { - color: @accent-color; + color: @accent; } } } @@ -652,7 +618,7 @@ background: @mantle; border-color: @overlay0; .selectedSection { - border-color: @accent-color; + border-color: @accent; } .formative-nav-item { &, @@ -660,13 +626,13 @@ color: @text; } .FormativeStudentNavItem__StyledMessageIcon-sc-i1u5ts-4 { - color: @accent-color; + color: @accent; } &:hover, &:focus { background: @surface1; - color: @accent-color; - border-color: @accent-color; + color: @accent; + border-color: @accent; } .fxpwVv { background-color: @green; @@ -693,21 +659,21 @@ .checkbox-root { button { background: @surface0; - border-color: @accent-color !important; + border-color: @accent !important; box-shadow: none !important; } &.checked button { - background: @accent-color !important; + background: @accent !important; } .Checkbox__RadioCircleDiv-sc-1oy0ey9-3 { - background: @contrast-accent-color !important; + background: @contrast !important; } .Checkbox__IndicatorIcon-sc-1oy0ey9-5 { - color: @contrast-accent-color; + color: @contrast; } } .FormativeUnavailableMessage__InnerDiv-sc-14kxg7t-1 { - border-color: @accent-color; + border-color: @accent; background-color: @surface0; } .FormativeItemViewable__RootDiv-sc-m0kwch-0, @@ -733,7 +699,7 @@ &[style*="rgb(32, 213, 171)"] { background-color: @green !important; .material-icons-outlined { - color: @contrast-accent-color !important; + color: @contrast !important; } } &[style*="rgb(255, 222, 51)"] { @@ -745,14 +711,14 @@ &[style*="rgb(255, 76, 77)"] { background-color: @red !important; .material-icons-outlined { - color: @contrast-accent-color !important; + color: @contrast !important; } } border-color: @overlay2 !important; } .BlankOutput__FillableEntity-sc-15mzaww-3, .BlankOutput__FillableNumericDiv-sc-15mzaww-2 { - outline-color: @accent-color; + outline-color: @accent; color: @text; background: @surface0; .KatexOutput__RootDiv-sc-gu2jna-0 { @@ -774,14 +740,14 @@ } .TargetElementViewable__BoxDiv-sc-1cp2mml-1 { background: @surface0; - border-color: @accent-color; + border-color: @accent; .TargetChoiceViewable__ContentDiv-sc-6nylj9-1 { background: @surface1; border-color: @overlay0; } .TargetElementViewable__AddSelectedChoiceButton-sc-1cp2mml-6 i { - background: @accent-color; - color: @contrast-accent-color; + background: @accent; + color: @contrast; } } .MatchingTable__Table-sc-1rhxmvo-1 { @@ -791,7 +757,7 @@ border-color: @overlay0; } tr.isOver { - outline-color: @accent-color; + outline-color: @accent; } } .ChoiceElementViewable__RootDiv-sc-viwu2x-0 { @@ -799,7 +765,7 @@ border-color: @overlay0; &:hover, &.highlight { - border-color: @accent-color; + border-color: @accent; background: @surface1; } .ChoiceElementViewable__LabelRichText-sc-viwu2x-4 { @@ -834,7 +800,7 @@ } .InlineChoiceOutput__InlineChoiceOutputDiv-sc-1694w84-2 { background: @surface0; - border-color: @accent-color; + border-color: @accent; } .DrawingCardButton__RootButton-sc-u2qprg-1 { border-color: @overlay0; @@ -853,12 +819,12 @@ .DrawingCardButton__IncompleteIndicatorDiv-sc-u2qprg-4 { background: @yellow; svg path { - fill: @contrast-accent-color; + fill: @contrast; } } &:hover .DrawingCardButton__ShowYourWorkPseudoButtonDiv-sc-u2qprg-0 { background: @surface2; - border-color: @accent-color; + border-color: @accent; } } .DragAndDropImageDropLocation__DropLocationContainerDiv-sc-oq3fcx-1 { @@ -892,7 +858,7 @@ background: @surface2 !important; } } - border-color: @accent-color !important; + border-color: @accent !important; background: @surface0; .dropzone-number { background: @surface1; @@ -912,7 +878,7 @@ } .DragAndDropDropzoneOutput__RootDiv-sc-1is7exh-0 { background: @surface0; - border-color: @accent-color; + border-color: @accent; &.hasAnswer { border-color: @overlay0; } @@ -922,7 +888,7 @@ background: @green; } .material-icons-outlined { - color: @contrast-accent-color; + color: @contrast; } } .ShortAnswerViewableDetails__InputAutosizeTextarea-sc-1ugk4gk-0 { @@ -947,7 +913,7 @@ background: @surface0; } span { - color: @accent-color; + color: @accent; } } } @@ -993,7 +959,7 @@ color: @text; } .Thumb__RootSpan-sc-yv6w5k-0 { - background: @accent-color; + background: @accent; z-index: 2; } .Segment__SegmentSpan-sc-r0cy9o-0 { @@ -1022,14 +988,14 @@ &, .svg-icons, .material-icons-outlined { - color: @accent-color; + color: @accent; } } .selected { &::after { - background: @accent-color; + background: @accent; } - color: @accent-color; + color: @accent; } } .DrawingSidebar__ExpandedAnswerDiv-sc-1hvcy70-0 { @@ -1050,21 +1016,21 @@ } .MathLiveInput__RootDiv-sc-tki2b-0 { .keyboard-button-wrapper .svg-icons svg path { - fill: @accent-color !important; + fill: @accent !important; } color: @text; border-color: @overlay0; background: @surface0; &:focus-within, &:hover { - border-color: @accent-color; + border-color: @accent; } &.invalid { color: @red; } math-field { - --caret-color: @accent-color; - --selection-background-color: fade(@accent-color, 50); + --caret-color: @accent; + --selection-background-color: fade(@accent, 50%); --selection-color: @text; --correct-color: @text; --incorrect-color: @red; @@ -1073,7 +1039,7 @@ } .ML__keyboard--plate { --keyboard-text: @text; - --keyboard-text-active: @accent-color; + --keyboard-text-active: @accent; --keyboard-background: @surface0; --keycap-background: @surface1; --keycap-background-active: @surface2; @@ -1081,7 +1047,7 @@ --keycap-background-border-bottom: @overlay0; --keycap-text: @text; --keycap-secondary-text: @subtext0; - --keycap-text-active: @accent-color; + --keycap-text-active: @accent; --keycap-modifier-background: @surface2; --keycap-modifier-background-active: @overlay0; --keycap-modifier-border: @overlay1; @@ -1140,7 +1106,7 @@ } path[fill="rgb(255,255,255)"], path[fill="rgb(242,242,242)"] { - fill: @contrast-accent-color !important; + fill: @contrast !important; } path[stroke="rgb(32,213,171)"], @@ -1165,7 +1131,7 @@ } path[stroke="rgb(255,255,255)"], path[stroke="rgb(242,242,242)"] { - stroke: @contrast-accent-color !important; + stroke: @contrast !important; } } } @@ -1189,25 +1155,25 @@ color: @text; } .NewselaServiceLoginButton__ActionDiv-sc-mk13mj-2 { - color: @accent-color; + color: @accent; } } } .JoinQuickCode__StyledLink-sc-1uhfett-2, .CallToActionLink__StyledLink-sc-yuiy65-0, .Login__ForgotLink-sc-5w2jun-1 { - color: @accent-color; + color: @accent; } .react-code-input { input { background: @surface1; border-color: @overlay0; &:focus-within { - border-color: @accent-color; + border-color: @accent; } } &:not(:focus-within).empty [data-id="0"] { - border-color: @accent-color; + border-color: @accent; } } .JoinQuickCode__StyledPrimaryButton-sc-1uhfett-5 { @@ -1231,7 +1197,7 @@ } &, .material-icons-outlined { - color: @contrast-accent-color; + color: @contrast; } } .FloatingToolButton__FloatingButton-sc-1gy4xsl-0 { @@ -1243,7 +1209,7 @@ background: @overlay1; } .material-icons-outlined { - color: @accent-color; + color: @accent; } } .PracticeSet__StyledHeader-sc-1wup6tb-6 { @@ -1259,7 +1225,7 @@ .HeaderBackLink__TertiaryButtonLink-sc-1vx1tro-0, .Button__StyledButton-sc-aum9f1-1 { background: @surface1 !important; - color: @accent-color !important; + color: @accent !important; &:not([disabled]):hover { background: @surface2; } @@ -1299,7 +1265,7 @@ color: @text; &:hover { background: @surface2; - color: @accent-color; + color: @accent; } } } @@ -1316,9 +1282,9 @@ } .FileUploadButton__DropZoneDiv-sc-88u8tg-2 { background: @surface0; - border-color: @accent-color; + border-color: @accent; .material-icons-outlined { - color: @accent-color; + color: @accent; } } .DividerWord__LineDiv-sc-59xl7-1 { @@ -1382,9 +1348,9 @@ background: @overlay0; } &.active { - color: @accent-color; + color: @accent; svg { - fill: @accent-color; + fill: @accent; } } svg { @@ -1402,7 +1368,7 @@ } .CookiePolicyBanner__ContainerDiv-sc-1p3fxjn-1 { background: @surface0; - border-color: @accent-color; + border-color: @accent; .Button__StyledButton-sc-aum9f1-1 { background: @surface1; &:hover { @@ -1425,7 +1391,7 @@ .HeaderBackLink__TertiaryButtonLink-sc-1vx1tro-0, .Button__StyledButton-sc-aum9f1-1 { background: @surface1; - color: @accent-color; + color: @accent; &:hover { background: @surface2; } @@ -1437,11 +1403,11 @@ } &[aria-checked="true"], &[aria-checked="true"] div { - outline-color: @accent-color !important; + outline-color: @accent !important; } } .TitleCard__StartButton-sc-xz0ejb-1 { - background: @accent-color; + background: @accent; color: @base; } .QuizSession__BodyDiv-sc-4aco0-0 { @@ -1465,13 +1431,13 @@ background: @green; i, span { - color: @contrast-accent-color; + color: @contrast; } } background: @red; i, span { - color: @contrast-accent-color; + color: @contrast; } } .AnswerChoiceCard__CorrectnessOverlay-sc-lns4c-3 { @@ -1479,7 +1445,7 @@ background: @green; } i { - color: @contrast-accent-color !important; + color: @contrast !important; } background: @red; } @@ -1489,13 +1455,13 @@ .MatchingSessionSummary__CheckmarkOverlayDiv-sc-d3unim-1 { background: @base; .Glow__RootDiv-sc-1c8wp5s-0 { - background: @accent-color !important; - color: @contrast-accent-color; + background: @accent !important; + color: @contrast; } .MatchingSessionSummary__SessionDiv-sc-d3unim-13 { border-color: @overlay0; &.highlight { - background: fade(@yellow, 25); + background: fade(@yellow, 25%); } } } @@ -1517,7 +1483,7 @@ background: @surface0; border-color: @overlay0; .Glow__RootDiv-sc-1c8wp5s-0 { - background: @accent-color !important; + background: @accent !important; } } } @@ -1533,13 +1499,13 @@ .StreakProgressBar__Progress-sc-1b8tyg3-2 { background: @surface0; .StreakProgressBar__ProgressBarDiv-sc-1b8tyg3-3 { - background: @accent-color; + background: @accent; } } .StreakProgressBar__StyledSvgIcon-sc-1b8tyg3-4 { svg path { fill: @yellow; - stroke: @contrast-accent-color; + stroke: @contrast; } &.visible { animation: 0.5s ease 0s 1 normal none running @@ -1547,7 +1513,7 @@ } } .PracticeSession__AnswerButton-sc-1t2vn9a-3 { - color: @contrast-accent-color; + color: @contrast; &.red { background: @red; } @@ -1559,7 +1525,7 @@ .PillToggleGroup__Item-sc-12fkyq8-1 { &[aria-checked="true"] { background: @surface0; - color: @accent-color; + color: @accent; } &:hover { background: @surface0; @@ -1597,15 +1563,15 @@ } @keyframes catppuccin-formative-practiceset-quiz-streak { 0% { - filter: drop-shadow(fade(@yellow, 80) 0 0 0); + filter: drop-shadow(fade(@yellow, 80%) 0 0 0); transform: scale(0.8); } 50% { - filter: drop-shadow(fade(@yellow, 80) 0 0 12px); + filter: drop-shadow(fade(@yellow, 80%) 0 0 12px); transform: scale(1.3); } 100% { - filter: drop-shadow(fade(@yellow, 80) 0 0 0); + filter: drop-shadow(fade(@yellow, 80%) 0 0 0); transform: scale(1); } } @@ -1615,15 +1581,15 @@ background: @surface1; &:hover { background: @surface2; - box-shadow: @accent-color 0 0 0 1px; + box-shadow: @accent 0 0 0 1px; .label { - color: @accent-color; + color: @accent; } } .ShelfTile__IconDiv-sc-1oc4c00-1 { - background: @accent-color !important; + background: @accent !important; i { - color: @contrast-accent-color; + color: @contrast; } } } @@ -1648,13 +1614,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/formative/preview.webp b/styles/formative/preview.webp deleted file mode 100644 index 5561ffb8bd..0000000000 --- a/styles/formative/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:8f1ebe6734b11c96c3c6f051cc0180e30419425812ed57005a877fe1590e97a2 -size 89274 diff --git a/styles/freedesktop/README.md b/styles/freedesktop/README.md index ffa9104d1e..a0f01ebcc3 100644 --- a/styles/freedesktop/README.md +++ b/styles/freedesktop/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/freedesktop/catppuccin.user.css b/styles/freedesktop/catppuccin.user.css deleted file mode 100644 index 2132a3d706..0000000000 --- a/styles/freedesktop/catppuccin.user.css +++ /dev/null @@ -1,149 +0,0 @@ -/* ==UserStyle== -@name freedesktop.org Catppuccin -@namespace github.com/catppuccin/userstyles/styles/freedesktop -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/freedesktop -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/freedesktop/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Afreedesktop -@description Soothing pastel theme for freedesktop.org -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('www.freedesktop.org'), domain('specifications.freedesktop.org') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - body { - background-color: @base; - color: @text; - } - - #content h1, - #content h2, - #content h3 { - color: @accent-color; - } - - .pageheader { - background-color: @mantle; - border-color: @crust; - color: @subtext1; - } - - .pageheader .actions ul li a, - input[type="submit"] { - background-color: transparent; - color: @accent-color; - border-color: @accent-color; - } - - input#searchbox { - color: @subtext1; - background-color: @overlay0; - border-color: @overlay1; - box-shadow: none; - &:focus { - border-color: @accent-color; - outline-color: none; - outline-style: none; - } - } - - .headerpath .title { - color: @subtext1; - } - - a:link { - color: @blue; - } - - a:visited { - color: @lavender; - } - code { - background-color: @crust; - color: @text; - } - - pre { - background-color: @mantle; - border-color: @surface0; - - code { - background-color: @mantle; - color: @text; - } - } - - hr { - border-style: solid; - border-color: @surface1; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/freedesktop/catppuccin.user.less b/styles/freedesktop/catppuccin.user.less new file mode 100644 index 0000000000..9728bd7e64 --- /dev/null +++ b/styles/freedesktop/catppuccin.user.less @@ -0,0 +1,110 @@ +/* ==UserStyle== +@name freedesktop.org Catppuccin +@namespace github.com/catppuccin/userstyles/styles/freedesktop +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/freedesktop +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/freedesktop/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Afreedesktop +@description Soothing pastel theme for freedesktop.org +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("www.freedesktop.org"), + domain("specifications.freedesktop.org") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + background-color: @base; + color: @text; + } + + #content h1, + #content h2, + #content h3, + #content h4, + #content h5, + #content h6 { + color: @accent; + } + + .pageheader { + background-color: @mantle; + border-color: @crust; + color: @subtext1; + } + + .pageheader .actions ul li a, + input[type="submit"] { + background-color: transparent; + color: @accent; + border-color: @accent; + } + + input#searchbox { + color: @subtext1; + background-color: @overlay0; + border-color: @overlay1; + box-shadow: none; + &:focus { + border-color: @accent; + outline-color: none; + outline-style: none; + } + } + + .headerpath .title { + color: @subtext1; + } + + a:link { + color: @blue; + } + + a:visited { + color: @lavender; + } + code { + background-color: @crust; + color: @text; + } + + pre { + background-color: @mantle; + border-color: @surface0; + + code { + background-color: @mantle; + color: @text; + } + } + + hr { + border-style: solid; + border-color: @surface1; + } + + .topnav, tr:nth-child(2n+1) { + border-color: @surface0; + background-color: @mantle; + } + } +} diff --git a/styles/freedesktop/preview.webp b/styles/freedesktop/preview.webp deleted file mode 100644 index c3a07034cc..0000000000 --- a/styles/freedesktop/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ccc52264818d19b7fc434f5a3f2eadf4a162f8f329c9349f8839a2ec34dc8701 -size 931430 diff --git a/styles/ghostty.org/README.md b/styles/ghostty.org/README.md new file mode 100644 index 0000000000..2a12a58cb0 --- /dev/null +++ b/styles/ghostty.org/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Ghostty.org + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [uncenter](https://github.com/uncenter) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/ghostty.org/catppuccin.user.less b/styles/ghostty.org/catppuccin.user.less new file mode 100644 index 0000000000..e071e5c766 --- /dev/null +++ b/styles/ghostty.org/catppuccin.user.less @@ -0,0 +1,93 @@ +/* ==UserStyle== +@name Ghostty.org Catppuccin +@namespace github.com/catppuccin/userstyles/styles/ghostty.org +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/ghostty.org +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/ghostty.org/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aghostty.org +@description Soothing pastel theme for Ghostty.org +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("ghostty.org") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); + + html, body { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --brand-color: @accent; + --brand-color-hsl: #hslify(@accent)[]; + --gray-0: @base; + --gray-1: @surface0; + --gray-2: @surface1; + --gray-3: @overlay1; + --gray-4: @subtext0; + --gray-5: @subtext1; + --gray-6: @subtext1; + --gray-7: @subtext1; + --gray-8: @text; + --gray-9: @text; + --black: @crust; + --white: @text; + + --callout-note: @blue; + --callout-tip: @green; + --callout-important: @mauve; + --callout-warning: @yellow; + --callout-caution: @red; + + div[class^="Terminal-module"] { + --adw-headerbar-color: @mantle !important; + --color-sunset-orange: @red; + --color-pastel-orange: @peach; + --color-malachite: @green; + } + + [class*="__buttonLink"][class*="__brand"]:hover, + ul[class*="NavTree-module__"] [class*="__active"] { + color: @crust !important; + } + + img[alt="Ghostty"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + [class*="DownloadPage_header"] img { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + pre code { + color: @text; + } + } +} + +/* #lib.hslify() with spaces instead of commas. */ +#hslify(@color) { + @raw: e(%("%s %s% %s%", hue(@color), saturation(@color), lightness(@color))); +} diff --git a/styles/github/README.md b/styles/github/README.md index f9ce5d8283..70cce4d092 100644 --- a/styles/github/README.md +++ b/styles/github/README.md @@ -10,24 +10,23 @@

- -

- -

- +

## Usage -Switch to a default GitHub light/dark theme via **Settings** > **Appearance** for the best experience! +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + +> [!NOTE] +> Use the **Light default** or **Dark default** themes and disable *Increase contrast* under GitHub's [Theme preferences](https://github.com/settings/appearance). ## ๐Ÿ’ Current Maintainer - [uncenter](https://github.com/uncenter) ## ๐Ÿ’– Past Maintainers -- [Lemon](https://github.com/unseen-ninja) +- [unseen-ninja](https://github.com/unseen-ninja) - [Pocco81](https://github.com/Pocco81) -- [Umbreon](https://github.com/GlowingUmbreon) +- [GlowingUmbreon](https://github.com/GlowingUmbreon)   diff --git a/styles/github/catppuccin.user.css b/styles/github/catppuccin.user.less similarity index 60% rename from styles/github/catppuccin.user.css rename to styles/github/catppuccin.user.less index 55f836a4a3..3a42256b1f 100644 --- a/styles/github/catppuccin.user.css +++ b/styles/github/catppuccin.user.less @@ -1,13 +1,13 @@ /* ==UserStyle== -@name GitHub Catppuccin -@namespace github.com/catppuccin/userstyles/styles/github -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/github -@version 1.7.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/github/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agithub -@description Soothing pastel theme for GitHub -@author Catppuccin -@license MIT +@name GitHub Catppuccin +@namespace github.com/catppuccin/userstyles/styles/github +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/github +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/github/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agithub +@description Soothing pastel theme for GitHub +@author Catppuccin +@license MIT @preprocessor less @var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] @@ -15,141 +15,102 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document regexp("https:\/\/(gist\.)*github\.com(?!((\/.+?\/.+?\/commit\/[A-Fa-f0-9]+\.(patch|diff)$)|\/home$|\/features($|\/.*)|\/marketplace($|\?.*|\/.*)|\/organizations\/plan)).*$") { - [data-color-mode="auto"] { +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document /* Match every page on GitHub except github.com/home, github.com/features/*, and github.com/organizations/plan. */ +regexp( + "https:\/\/github\.com(?!(\/home$|\/features($|\/.*)|\/organizations\/plan)).*$" + ), + domain("gist.github.com"), + domain("docs.github.com"), + domain("viewscreen.githubusercontent.com") { + [data-color-mode][data-color-mode="auto"] { @media (prefers-color-scheme: light) { &[data-light-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } &[data-light-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } } @media (prefers-color-scheme: dark) { &[data-dark-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } &[data-dark-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); + header[data-color-mode] { + #catppuccin(@darkFlavor); + } } } } [data-color-mode="light"][data-light-theme="dark"], [data-color-mode="dark"][data-dark-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } [data-color-mode="light"][data-light-theme="light"], [data-color-mode="dark"][data-dark-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); - } - - html:not([data-light-theme="light"], [data-light-theme="dark"]) - body:not(.logged-out)::after, - html:not([data-dark-theme="dark"], [data-dark-theme="light"]) - body:not(.logged-out)::after { - position: fixed; - top: 0; - left: 0; - padding: 1rem; - margin: 1rem; - border-radius: 0.5rem; - max-width: 40ch; - background-color: var(--color-danger-fg); - color: var(--color-header-bg); - content: "Unsupported GitHub theme detected! Please switch to the default light/dark theme via the GitHub Appearance settings to get the best experience for the Catppuccin GitHub userstyle."; - z-index: 9999; + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); .cm-placeholder { color: @subtext0; } - accent-color: @accent-color; + accent-color: @accent; color: @text; - --color-social-reaction-bg-reacted-hover: fade(@accent-color, 30%); - --color-notifications-button-hover-bg: fade(@accent-color, 60%); + --color-social-reaction-bg-reacted-hover: fade(@accent, 30%); + --color-notifications-button-hover-bg: fade(@accent, 60%); --color-workflow-card-header-shadow: rgba(27, 31, 35, 0.04); --color-icon-directory: var(--fgColor-muted, var(--color-fg-muted)); - --color-calendar-halloween-graph-day-L1-bg: fadeout( - @accent-color, - 60% - ) !important; - --color-calendar-halloween-graph-day-L2-bg: fadeout( - @accent-color, + --color-calendar-halloween-graph-day-L1-bg: fade( + @accent, 40% ) !important; - --color-calendar-halloween-graph-day-L3-bg: fadeout( - @accent-color, - 20% - ) !important; - --color-calendar-halloween-graph-day-L4-bg: @accent-color !important; - --color-calendar-winter-graph-day-L1-bg: fadeout( - @accent-color, + --color-calendar-halloween-graph-day-L2-bg: fade( + @accent, 60% ) !important; - --color-calendar-winter-graph-day-L2-bg: fadeout( - @accent-color, + --color-calendar-halloween-graph-day-L3-bg: fade( + @accent, + 80% + ) !important; + --color-calendar-halloween-graph-day-L4-bg: @accent !important; + --color-calendar-winter-graph-day-L1-bg: fade( + @accent, 40% ) !important; - --color-calendar-winter-graph-day-L3-bg: fadeout( - @accent-color, - 20% + --color-calendar-winter-graph-day-L2-bg: fade( + @accent, + 60% + ) !important; + --color-calendar-winter-graph-day-L3-bg: fade( + @accent, + 80% ) !important; - --color-calendar-winter-graph-day-L4-bg: @accent-color !important; + --color-calendar-winter-graph-day-L4-bg: @accent !important; --color-calendar-graph-day-bg: @surface0 !important; --color-calendar-graph-day-border: transparent !important; - --color-calendar-graph-day-L1-bg: fadeout(@accent-color, 60%) !important; - --color-calendar-graph-day-L2-bg: fadeout(@accent-color, 40%) !important; - --color-calendar-graph-day-L3-bg: fadeout(@accent-color, 20%) !important; - --color-calendar-graph-day-L4-bg: @accent-color !important; + --color-calendar-graph-day-L1-bg: fade(@accent, 40%) !important; + --color-calendar-graph-day-L2-bg: fade(@accent, 60%) !important; + --color-calendar-graph-day-L3-bg: fade(@accent, 80%) !important; + --color-calendar-graph-day-L4-bg: @accent !important; --color-calendar-graph-day-L2-border: transparent !important; --color-calendar-graph-day-L3-border: transparent !important; --color-calendar-graph-day-L4-border: transparent !important; - --color-user-mention-fg: @accent-color; - --color-user-mention-bg: fade(@accent-color, 30%); + --contribution-default-bgColor-0: fade(@accent, 10%) !important; + --contribution-default-bgColor-1: fade(@accent, 40%) !important; + --contribution-default-bgColor-2: fade(@accent, 60%) !important; + --contribution-default-bgColor-3: fade(@accent, 80%) !important; + --contribution-default-bgColor-4: @accent !important; + --color-user-mention-fg: @accent; + --color-user-mention-bg: fade(@accent, 30%); --color-dashboard-feed-bg: var(--color-scale-gray-9); --color-mktg-btn-shadow-outline: rgba(255, 255, 255, 0.25) 0 0 0 1px inset; --color-marketing-icon-secondary: var(--color-scale-blue-5); @@ -161,33 +122,37 @@ --topicTag-borderColor: #0000; --highlight-neutral-bgColor: fade(@yellow, 30%); --page-header-bgColor: @crust; - --diffBlob-addition-fgColor-text: @text; - --diffBlob-addition-fgColor-num: @text; - --diffBlob-addition-bgColor-num: fadeout(@green, 70%); - --diffBlob-addition-bgColor-line: fadeout(@green, 85%); - --diffBlob-addition-bgColor-word: fadeout(@green, 70%); - --diffBlob-deletion-fgColor-text: @text; - --diffBlob-deletion-fgColor-num: @text; - --diffBlob-deletion-bgColor-num: fadeout(@red, 70%); - --diffBlob-deletion-bgColor-line: fadeout(@red, 85%); - --diffBlob-deletion-bgColor-word: fadeout(@red, 70%); - --diffBlob-hunk-bgColor-num: fadeout(@accent-color, 60%); - --diffBlob-expander-iconColor: #848d97; + --diffBlob-additionNum-bgColor: fade(@green, 30%); + --diffBlob-additionNum-fgColor: @text; + --diffBlob-additionLine-bgColor: fade(@green, 15%); + --diffBlob-additionWord-bgColor: fade(@green, 30%); + --diffBlob-additionWord-fgColor: @text; + --diffBlob-deletionNum-bgColor: fade(@red, 30%); + --diffBlob-deletionNum-fgColor: @text; + --diffBlob-deletionLine-bgColor: fade(@red, 15%); + --diffBlob-deletionWord-bgColor: fade(@red, 30%); + --diffBlob-deletionWord-fgColor: @text; + --diffBlob-hunkNum-bgColor-rest: fade(@accent, 40%); + --diffBlob-hunkNum-bgColor-hover: fade(@accent, 75%); + --diffBlob-hunkLine-bgColor: fade(@accent, 25%); + --diffBlob-expander-iconColor: @subtext0; + --diffBlob-emptyNum-bgColor: @mantle; + --diffBlob-emptyLine-bgColor: @mantle; --codeMirror-fgColor: @text; --codeMirror-bgColor: @base; --codeMirror-gutters-bgColor: @base; --codeMirror-gutterMarker-fgColor-default: @base; --codeMirror-gutterMarker-fgColor-muted: @overlay0; - --codeMirror-lineNumber-fgColor: @subtext1; + --codeMirror-lineNumber-fgColor: @overlay1; --codeMirror-cursor-fgColor: @text; --codeMirror-selection-bgColor: #388bfd66; --codeMirror-activeline-bgColor: #6e768166; --codeMirror-matchingBracket-fgColor: @text; --codeMirror-lines-bgColor: @base; - --codeMirror-syntax-fgColor-comment: @overlay0; + --codeMirror-syntax-fgColor-comment: @overlay2; --codeMirror-syntax-fgColor-constant: @blue; --codeMirror-syntax-fgColor-entity: @blue; - --codeMirror-syntax-fgColor-keyword: @pink; + --codeMirror-syntax-fgColor-keyword: @mauve; --codeMirror-syntax-fgColor-storage: @peach; --codeMirror-syntax-fgColor-string: @green; --codeMirror-syntax-fgColor-support: #79c0ff; @@ -231,15 +196,15 @@ --control-danger-fgColor-hover: @crust; --control-danger-bgColor-hover: fade(@red, 80%); --control-danger-bgColor-active: @red; - --control-checked-bgColor-rest: @accent-color; - --control-checked-bgColor-hover: lighten(@accent-color, 5%); - --control-checked-bgColor-active: lighten(@accent-color, 5%); + --control-checked-bgColor-rest: @accent; + --control-checked-bgColor-hover: lighten(@accent, 5%); + --control-checked-bgColor-active: lighten(@accent, 5%); --control-checked-bgColor-disabled: #6e7681; --control-checked-fgColor-rest: @crust; --control-checked-fgColor-disabled: #010409; - --control-checked-borderColor-rest: @accent-color; - --control-checked-borderColor-hover: @accent-color; - --control-checked-borderColor-active: @accent-color; + --control-checked-borderColor-rest: @accent; + --control-checked-borderColor-hover: @accent; + --control-checked-borderColor-active: @accent; --control-checked-borderColor-disabled: @surface0; --controlTrack-bgColor-rest: @surface0; --controlTrack-bgColor-hover: @surface1; @@ -279,7 +244,7 @@ --button-primary-borderColor-disabled: fade(@green, 70%); --button-primary-shadow-selected: 0px 0px 0px 0px #000; --button-invisible-fgColor-rest: @text; - --button-invisible-fgColor-hover: lighten(@accent-color, 10%); + --button-invisible-fgColor-hover: lighten(@accent, 10%); --button-invisible-fgColor-disabled: #6e7681; --button-invisible-iconColor-rest: @overlay2; --button-invisible-iconColor-hover: #e6edf3; @@ -334,7 +299,7 @@ --buttonCounter-danger-fgColor-rest: @red; --buttonCounter-danger-fgColor-hover: @text; --buttonCounter-danger-fgColor-disabled: fade(@red, 50%); - --focus-outlineColor: @accent-color; + --focus-outlineColor: @accent; --menu-bgColor-active: @mantle; --overlay-bgColor: @base; --overlay-borderColor: @surface0; @@ -344,23 +309,23 @@ --sideNav-bgColor-selected: #21262d; --skeletonLoader-bgColor: #161b22; --timelineBadge-bgColor: @mantle; - --treeViewItem-leadingVisual-iconColor-rest: #848d97; - --underlineNav-borderColor-active: @accent-color; + --treeViewItem-leadingVisual-iconColor-rest: @subtext0; + --underlineNav-borderColor-active: @accent; --underlineNav-borderColor-hover: #6e768166; --underlineNav-iconColor-rest: #848d97; - --selection-bgColor: fade(@accent-color, 30%); - --reactionButton-selected-bgColor-rest: fade(@accent-color, 20%); - --reactionButton-selected-bgColor-hover: fade(@accent-color, 35%); - --reactionButton-selected-fgColor-rest: @accent-color; - --reactionButton-selected-fgColor-hover: @accent-color; + --selection-bgColor: fade(@accent, 30%); + --reactionButton-selected-bgColor-rest: fade(@accent, 20%); + --reactionButton-selected-bgColor-hover: fade(@accent, 35%); + --reactionButton-selected-fgColor-rest: @accent; + --reactionButton-selected-fgColor-hover: @accent; --fgColor-default: @text; --fgColor-muted: @subtext1; --fgColor-onEmphasis: @base; - --fgColor-white: if(@lookup = latte, @crust, @text); + --fgColor-white: @text; --fgColor-disabled: @surface2; - --fgColor-link: @accent-color; - --fgColor-neutral: #6e7681; - --fgColor-accent: @accent-color; + --fgColor-link: @accent; + --fgColor-neutral: @subtext1; + --fgColor-accent: @accent; --fgColor-success: @green; --fgColor-attention: @yellow; --fgColor-severe: @peach; @@ -378,8 +343,8 @@ --bgColor-transparent: #0000; --bgColor-neutral-muted: fade(@surface0, 40%); --bgColor-neutral-emphasis: @subtext0; - --bgColor-accent-muted: fade(@accent-color, 20%); - --bgColor-accent-emphasis: @accent-color; + --bgColor-accent-muted: fade(@accent, 20%); + --bgColor-accent-emphasis: @accent; --bgColor-success-muted: #2ea04326; --bgColor-success-emphasis: @green; --bgColor-attention-muted: fade(@yellow, 15%); @@ -403,8 +368,8 @@ --borderColor-transparent: #0000; --borderColor-neutral-muted: #6e768166; --borderColor-neutral-emphasis: #6e7681; - --borderColor-accent-muted: fade(@accent-color, 50%); - --borderColor-accent-emphasis: @accent-color; + --borderColor-accent-muted: fade(@accent, 50%); + --borderColor-accent-emphasis: @accent; --borderColor-success-muted: darken(@green, 5%); --borderColor-success-emphasis: @green; --borderColor-attention-muted: fade(@flamingo, 30%); @@ -421,14 +386,14 @@ --borderColor-done-emphasis: @mauve; --borderColor-sponsors-muted: #db61a266; --borderColor-sponsors-emphasis: @pink; - & when (@lookup =latte) { + & when (@flavor = latte) { --color-ansi-black: @subtext1; --color-ansi-black-bright: @subtext0; --color-ansi-gray: @subtext0; --color-ansi-white: @surface2; --color-ansi-white-bright: @surface1; } - & when not (@lookup =latte) { + & when not(@flavor = latte) { --color-ansi-black: @surface1; --color-ansi-black-bright: @surface2; --color-ansi-gray: @surface2; @@ -447,25 +412,26 @@ --color-ansi-magenta-bright: @pink; --color-ansi-cyan: @teal; --color-ansi-cyan-bright: @teal; - --color-prettylights-syntax-comment: @overlay1; + --color-prettylights-syntax-comment: @overlay2; --color-prettylights-syntax-constant: @blue; + --color-prettylights-syntax-constant-other-reference-link: @blue; --color-prettylights-syntax-entity: @blue; --color-prettylights-syntax-storage-modifier-import: @peach; - --color-prettylights-syntax-entity-tag: @teal; - --color-prettylights-syntax-keyword: @pink; + --color-prettylights-syntax-entity-tag: @blue; + --color-prettylights-syntax-keyword: @mauve; --color-prettylights-syntax-string: @green; --color-prettylights-syntax-variable: @peach; --color-prettylights-syntax-invalid-illegal-text: @red; - --color-prettylights-syntax-invalid-illegal-bg: fadeout(@red, 85%); - --color-prettylights-syntax-markup-heading: @teal; + --color-prettylights-syntax-invalid-illegal-bg: fade(@red, 15%); + --color-prettylights-syntax-markup-heading: @red; --color-prettylights-syntax-markup-italic: @yellow; --color-prettylights-syntax-markup-bold: @yellow; --color-prettylights-syntax-markup-deleted-text: @text; - --color-prettylights-syntax-markup-deleted-bg: fadeout(@red, 60%); + --color-prettylights-syntax-markup-deleted-bg: fade(@red, 40%); --color-prettylights-syntax-markup-inserted-text: @text; - --color-prettylights-syntax-markup-inserted-bg: fadeout(@green, 60%); + --color-prettylights-syntax-markup-inserted-bg: fade(@green, 40%); --color-prettylights-syntax-markup-changed-text: @text; - --color-prettylights-syntax-markup-changed-bg: fadeout(@yellow, 60%); + --color-prettylights-syntax-markup-changed-bg: fade(@yellow, 40%); --color-prettylights-syntax-markup-ignored-text: @text; --bgColor-white: @base; --color-scale-white: @base; @@ -484,28 +450,67 @@ --shadow-resting-xsmall: 0px 1px 0px 0px @crust; --shadow-resting-small: 0px 1px 0px 0px @crust, 0px 1px 3px 0px @crust; --shadow-resting-medium: 0px 3px 6px 0px @crust; - --shadow-floating-small: 0px 0px 0px 1px @base, 0px 6px 12px -3px @crust, - 0px 6px 18px 0px @crust; - --shadow-floating-medium: 0px 0px 0px 1px @surface0, - 0px 8px 16px -4px @crust, 0px 4px 32px -4px @crust, - 0px 24px 48px -12px @crust, 0px 48px 96px -24px @crust; - --shadow-floating-large: 0px 0px 0px 1px @surface0, - 0px 24px 48px 0px #010409; - --shadow-floating-xlarge: 0px 0px 0px 1px @surface0, - 0px 32px 64px 0px #010409; + --shadow-floating-small: + 0px 0px 0px 1px @base, 0px 6px 12px -3px @crust, 0px 6px 18px 0px @crust; + --shadow-floating-medium: + 0px 0px 0px 1px @surface0, 0px 8px 16px -4px @crust, 0px 4px 32px -4px + @crust, 0px 24px 48px -12px @crust, 0px 48px 96px -24px @crust; + --shadow-floating-large: + 0px 0px 0px 1px @surface0, 0px 24px 48px 0px #010409; + --shadow-floating-xlarge: + 0px 0px 0px 1px @surface0, 0px 32px 64px 0px #010409; --shadow-floating-legacy: 0px 6px 12px -3px @crust, 0px 6px 18px 0px @crust; --outline-focus: @blue solid 2px; - /* New Enhanced Repo Insights Views - https://github.com/orgs/community/discussions/135572 */ - --data-blue-color: @accent-color; - --data-red-color: @red; - --data-green-color: @green; + /* Feed Links */ + .feed-item-content a code, .feed-item-content a tt { + color: @accent; + } + + /* Customer Terms & Agreements Page: https://github.com/customer-terms */ + .enterprise-customer-agreement { + color: @text !important; + + &:hover { + .octicon, + h3 { + color: @accent !important; + } + } + } + + /* Enhanced Repo Insights Views - https://github.com/orgs/community/discussions/135572 */ + --data-blue-color-emphasis: @accent; + --data-red-color-emphasis: @red; + --data-green-color-emphasis: @green; + + /* Copilot Chat */ + --display-green-fgColor: @green; + --display-teal-fgColor: @teal; + --display-purple-fgColor: @mauve; + --display-blue-fgColor: @blue; + --display-pink-fgColor: @pink; + --display-gray-fgColor: @subtext0; + react-app[app-name="copilot-immersive-v1"], + copilot-dashboard-entrypoint { + button { + color: @text; + } + } + + /* docs.github.com */ + --color-fg-default: @text; + --color-canvas-default: @base; + --color-canvas-subtle: @mantle; + + --tooltip-fgColor: @base; + --tooltip-bgColor: @overlay2; - --tooltip-fgColor: @text; - --tooltip-bgColor: @crust; + /* Refined GitHub */ + --rgh-heat-color: @peach; .turbo-progress-bar { - background-color: @accent-color; + background-color: @accent; } .form-select { @@ -515,29 +520,23 @@ background-image: url("data:image/svg+xml,@{svg}"); } - img[src="https://github.githubassets.com/assets/mona-loading-default-c3c7aad1282f.gif"] - { + img[src="https://github.githubassets.com/assets/mona-loading-default-c3c7aad1282f.gif"] { content: url("https://giscus.catppuccin.com/assets/loading_48x48.gif"); } /* Header when logged out */ - .HeaderMenu-link { - color: var(--fgColor-default); - - &:hover { - color: var(--fgColor-default); + .header-search-button { + svg { + fill: @text !important; } } - .header-search-button.placeholder { - color: @subtext0; - } .HeaderMenu-toggle-bar { - background-color: @text; + border-color: @text; } .notification-indicator .mail-status { background-image: linear-gradient( - @accent-color, - darken(@accent-color, 5%) + @accent, + darken(@accent, 5%) ); } @@ -566,73 +565,73 @@ } .js-activity-overview-graph .js-highlight-blob { - fill: @accent-color; - stroke: @accent-color; + fill: @accent; + stroke: @accent; + } + + .subnav-link.selected { + border-bottom-color: @accent; + } + + /* Pull request check in progress indicator */ + [stroke="#DBAB0A" i] { + stroke: fade(@yellow, 70%) !important; + } + [fill="#DBAB0A" i] { + fill: @yellow !important; + } + + /* Issue timeline icon */ + [class*="prc-Timeline-TimelineBadge"], .TimelineItem-Badge { + /* Completed */ + path[d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm1.5 0a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm10.28-1.72-4.5 4.5a.75.75 0 0 1-1.06 0l-2-2a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018l1.47 1.47 3.97-3.97a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z"], + /* Duplicate / Not planned */ + path[d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM3.965 13.096a6.5 6.5 0 0 0 9.131-9.131ZM1.5 8a6.474 6.474 0 0 0 1.404 4.035l9.131-9.131A6.499 6.499 0 0 0 1.5 8Z"], + /* Reopen */ + path[d="M5.029 2.217a6.5 6.5 0 0 1 9.437 5.11.75.75 0 1 0 1.492-.154 8 8 0 0 0-14.315-4.03L.427 1.927A.25.25 0 0 0 0 2.104V5.75A.25.25 0 0 0 .25 6h3.646a.25.25 0 0 0 .177-.427L2.715 4.215a6.491 6.491 0 0 1 2.314-1.998ZM1.262 8.169a.75.75 0 0 0-1.22.658 8.001 8.001 0 0 0 14.315 4.03l1.216 1.216a.25.25 0 0 0 .427-.177V10.25a.25.25 0 0 0-.25-.25h-3.646a.25.25 0 0 0-.177.427l1.358 1.358a6.501 6.501 0 0 1-11.751-3.11.75.75 0 0 0-.272-.506Z"], + path[d="M9.06 9.06a1.5 1.5 0 1 1-2.12-2.12 1.5 1.5 0 0 1 2.12 2.12Z"] { + fill: @base; + } } } } -@-moz-document url-prefix("https://viewscreen.githubusercontent.com/markdown/mermaid") -{ +@-moz-document url-prefix( + "https://viewscreen.githubusercontent.com/markdown/mermaid" + ) { [data-color-mode="auto"] { @media (prefers-color-scheme: light) { &[data-light-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } &[data-light-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } } @media (prefers-color-scheme: dark) { &[data-dark-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } &[data-dark-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } } } [data-color-mode="light"][data-light-theme="dark"], [data-color-mode="dark"][data-dark-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } [data-color-mode="light"][data-light-theme="light"], [data-color-mode="dark"][data-dark-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + #catppuccin(@flavor) { + #lib.palette(); ::selection { - background-color: fade(@accent-color, 30%); + background-color: fade(@accent, 30%); } background-color: @base; @@ -645,8 +644,18 @@ --color-btn-active-bg: @surface2; --color-btn-selected-bg: @surface2; --color-btn-counter-bg: @surface2; - --color-btn-outline-text: @accent-color; + --color-btn-outline-text: @accent; --color-fg-muted: @subtext1; + --button-default-fgColor-rest: @text; + --button-default-bgColor-rest: @surface0; + --button-default-bgColor-hover: @surface1; + --button-default-bgColor-active: @surface2; + --button-default-bgColor-selected: @surface2; + --button-default-bgColor-disabled: fade(@surface0, 70%); + --button-default-borderColor-rest: @surface1; + --button-default-borderColor-hover: @surface1; + --button-default-borderColor-active: @surface1; + --button-default-borderColor-disabled: fade(@surface0, 70%); #diagram { .node rect, @@ -654,8 +663,13 @@ .node ellipse, .node polygon, .node path { - fill: fade(@accent-color, 10%); - stroke: @accent-color; + fill: fade(@accent, 10%); + stroke: @accent; + } + + .cluster rect { + fill: @surface0; + stroke: @surface2; } .label text, @@ -665,7 +679,9 @@ color: @text; } - .flowchart-link, + .flowchart-link { + stroke: @subtext0; + } .marker { stroke: @subtext0; fill: @subtext0; @@ -673,6 +689,9 @@ .edgeLabel { background-color: @crust; + p { + background-color: @surface2; + } } } @@ -682,69 +701,33 @@ } } -@-moz-document regexp("https:\/\/notebooks\.githubusercontent\.com\/view\/ipynb.*") { +@-moz-document regexp( + "https:\/\/notebooks\.githubusercontent\.com\/view\/ipynb.*" + ) { :root { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); --jp-border-color0: var(--color-scale-gray-7); --jp-border-color1: var(--color-scale-gray-7); --jp-border-color2: var(--color-scale-gray-8); --jp-border-color3: var(--color-scale-gray-9); --jp-ui-font-color0: @text; - --jp-ui-font-color1: fadeout(@text, 13%); - --jp-ui-font-color2: fadeout(@text, 46%); - --jp-ui-font-color3: fadeout(@text, 72%); + --jp-ui-font-color1: fade(@text, 87%); + --jp-ui-font-color2: fade(@text, 54%); + --jp-ui-font-color3: fade(@text, 28%); --jp-ui-inverse-font-color0: @crust; - --jp-ui-inverse-font-color1: fadeout(@crust, 20%); - --jp-ui-inverse-font-color2: fadeout(@crust, 50%); - --jp-ui-inverse-font-color3: fadeout(@crust, 70%); + --jp-ui-inverse-font-color1: fade(@crust, 80%); + --jp-ui-inverse-font-color2: fade(@crust, 50%); + --jp-ui-inverse-font-color3: fade(@crust, 30%); --jp-content-font-color0: @text; --jp-content-font-color1: @text; - --jp-content-font-color2: fadeout(@text, 30%); - --jp-content-font-color3: fadeout(@text, 50%); + --jp-content-font-color2: fade(@text, 70%); + --jp-content-font-color3: fade(@text, 50%); --jp-content-link-color: @sapphire; --jp-layout-color0: @base !important; --jp-layout-color1: var(--color-scale-gray-9); @@ -781,21 +764,22 @@ --jp-info-color1: var(--color-scale-blue-5); --jp-info-color2: var(--color-scale-blue-3); --jp-info-color3: var(--color-scale-blue-1); + --jp-cell-editor-background: @mantle; --jp-cell-editor-border-color: var(--color-scale-gray-7); --jp-cell-editor-box-shadow: inset 0 0 2px var(--color-scale-blue-3); - --jp-cell-prompt-not-active-font-color: fadeout(@text, 50%); + --jp-cell-prompt-not-active-font-color: fade(@text, 50%); --jp-cell-inprompt-font-color: var(--color-scale-blue-6); --jp-cell-outprompt-font-color: var(--color-scale-coral-6); - --jp-notebook-multiselected-color: fadeout(@overlay2, 86%); - --jp-rendermime-error-background: fadeout(@red, 82%); + --jp-notebook-multiselected-color: fade(@overlay2, 14%); + --jp-rendermime-error-background: fade(@red, 18%); --jp-rendermime-table-row-background: var(--color-scale-gray-9); - --jp-rendermime-table-row-hover-background: fadeout(@surface2, 86%); - --jp-dialog-background: fadeout(@crust, 40%); - --jp-toolbar-box-shadow: 0px 0px 2px 0px fadeout(@crust, 20%); + --jp-rendermime-table-row-hover-background: fade(@surface2, 14%); + --jp-dialog-background: fade(@crust, 60%); + --jp-toolbar-box-shadow: 0px 0px 2px 0px fade(@crust, 80%); --jp-input-box-shadow: inset 0 0 2px var(--color-scale-blue-3); --jp-input-background: var(--color-scale-gray-8); - --jp-input-active-box-shadow-color: fadeout(@blue, 70%); - --jp-editor-selected-focused-background: fadeout(@blue, 86%); + --jp-input-active-box-shadow-color: fade(@blue, 30%); + --jp-editor-selected-focused-background: fade(@blue, 14%); --jp-mirror-editor-keyword-color: var(--color-scale-green-5); --jp-mirror-editor-atom-color: var(--color-scale-blue-3); --jp-mirror-editor-number-color: var(--color-scale-green-4); @@ -829,13 +813,3 @@ --jp-icon-contrast-color3: var(--color-scale-blue-6); } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/github/preview.webp b/styles/github/preview.webp deleted file mode 100644 index 4bc533db28..0000000000 --- a/styles/github/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:b952bf2ef7ee762e6b74692ecf5bd4f07c2e9e250d541baff1576db6b0149005 -size 229132 diff --git a/styles/nixos.wiki/README.md b/styles/gleam.run/README.md similarity index 63% rename from styles/nixos.wiki/README.md rename to styles/gleam.run/README.md index da507746ce..644600dafc 100644 --- a/styles/nixos.wiki/README.md +++ b/styles/gleam.run/README.md @@ -4,26 +4,23 @@

Logo
- Catppuccin for NixOS Wiki + Catppuccin for gleam.run

- - + +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## ๐Ÿ’ Current Maintainer +- [uncenter](https://github.com/uncenter) -## ๐Ÿ’– Past Maintainer -- [winston](https://github.com/nekowinston)   diff --git a/styles/gleam.run/catppuccin.user.less b/styles/gleam.run/catppuccin.user.less new file mode 100644 index 0000000000..7c7b1cd08e --- /dev/null +++ b/styles/gleam.run/catppuccin.user.less @@ -0,0 +1,173 @@ +/* ==UserStyle== +@name gleam.run Catppuccin +@namespace github.com/catppuccin/userstyles/styles/gleam.run +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/gleam.run +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/gleam.run/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agleam.run +@description Soothing pastel theme for gleam.run +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("gleam.run") { + @import url("https://prismjs.catppuccin.com/variables.important.css"); + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); + + code.hljs { + background: none !important; + } + + body { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + + &.theme-light { + #catppuccin(@lightFlavor); + } + &.theme-dark { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --color-text-main: @text; + + --color-underwater-blue: @base; + --color-black: @mantle; + --color-blacker: @crust; + --color-white: @text; + --color-faff-pink: @accent; + --color-aged-plastic-yellow: @text; + --color-code-grey: @subtext1; + --color-code-blue: @sky; + --color-code-green: @green; + --color-code-dark-grey: @overlay2; + --color-code-yellow: @yellow; + --color-code-red: @red; + --color-code-orange: @peach; + --color-code-light-pink: @pink; + + --charcoal: var(--color-charcoal); + --underwater-blue: var(--color-underwater-blue); + --black: var(--color-black); + --blacker: var(--color-blacker); + --white: var(--color-white); + --faff-pink: var(--color-faff-pink); + --aged-plastic-yellow: var(--color-aged-plastic-yellow); + --unnamed-blue: var(--color-unnamed-blue); + --code-grey: var(--color-code-grey); + --code-blue: var(--color-code-blue); + --code-green: var(--color-code-green); + --code-dark-grey: var(--color-code-dark-grey); + --code-yellow: var(--color-code-yellow); + --code-red: var(--color-code-red); + --code-orange: var(--color-code-orange); + --code-light-pink: var(--color-code-light-pink); + + img[src="https://gleam.run/images/lucy/lucy.svg"], + img[src="/images/lucy/lucy.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + .hero-lucy-container:hover .hero-lucy, .logo:hover .footer-lucy { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + .pride .page-header { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .home-waves { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + p > code, li > code { + background-color: @surface0; + opacity: 1; + } + + /* gleam.run home */ + .button { + color: @crust !important; + background-color: @accent; + } + .home-still-here { + .button { + background-color: @text; + color: @crust; + } + + /* Wanna keep in touch? */ + input[type="submit"] { + background-color: @text !important; + color: @crust; + } + input[type="email"] { + background-color: @mantle; + color: @text; + } + } + + /* tour.gleam.run */ + --color-text: @text; + --color-link: @text; + --color-background: @base; + --color-background-dim: @crust; + --color-text-accent: @accent; + --color-accent-muted: fade(@accent, 50%); + + --code-background: @base; + --code-token-base: @text; + --color-code: @accent; + + /* packages.gleam.run */ + --page-background: @base; + --card-background: @surface0; + --card-border: @surface1; + --card-border-highlight: @surface2; + --text-regular: @text; + --text-highlight: @text; + img[src="/static/packages-icon.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + .darkmode-toggle { + filter: @crust-filter; + } + .page-nav a { + color: @crust; + } + .package-button img { + filter: @accent-filter; + } + } +} diff --git a/styles/gmail/README.md b/styles/gmail/README.md index a6ebca2017..28dee0a018 100644 --- a/styles/gmail/README.md +++ b/styles/gmail/README.md @@ -10,22 +10,21 @@

- -

- -

- +

## Usage -Switch to the default dark theme via the **Settings** > **Themes** > **View all** for the best experience! +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + +> [!NOTE] +> Switch to the default dark theme via the **Settings** > **Themes** > **View all** for the best experience! ## ๐Ÿ’ Current Maintainer - [uncenter](https://github.com/uncenter) ## ๐Ÿ’– Past Maintainer -- [Isabel](https://github.com/isabelroses) +- [isabelroses](https://github.com/isabelroses)   diff --git a/styles/gmail/catppuccin.user.css b/styles/gmail/catppuccin.user.less similarity index 71% rename from styles/gmail/catppuccin.user.css rename to styles/gmail/catppuccin.user.less index ac38bd61cf..ff39030c04 100644 --- a/styles/gmail/catppuccin.user.css +++ b/styles/gmail/catppuccin.user.less @@ -2,8 +2,8 @@ @name Gmail Catppuccin @namespace github.com/catppuccin/userstyles/styles/gmail @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/gmail -@version 0.2.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/gmail/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/gmail/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agmail @description Soothing pastel theme for Gmail @author Catppuccin @@ -15,63 +15,24 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + @-moz-document domain("mail.google.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @crust-filter: @catppuccin[@@lookup][@crust_filter]; - @text-filter: @catppuccin[@@lookup][@text_filter]; - @yellow-filter: @catppuccin[@@lookup][@yellow_filter]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); input, textarea { - &::placeholder { - color: @subtext0 !important; - } - caret-color: @text; } @@ -94,8 +55,7 @@ /* Gmail logo */ [src="https://ssl.gstatic.com/ui/v1/icons/mail/rfr/logo_gmail_lockup_default_1x_r5.png"], - [src="https://ssl.gstatic.com/ui/v1/icons/mail/rfr/logo_gmail_lockup_dark_1x_r5.png"] - { + [src="https://ssl.gstatic.com/ui/v1/icons/mail/rfr/logo_gmail_lockup_dark_1x_r5.png"] { height: unset !important; width: unset !important; @svg: escape( @@ -105,7 +65,8 @@ } /* Tooltips */ - .T-ays-iP { + .T-ays-iP, + .gb_Ac { background-color: @crust; color: @text; } @@ -114,7 +75,7 @@ /* Solid primary */ .T-I-atl { - background-color: @accent-color; + background-color: @accent; color: @crust; } @@ -122,10 +83,10 @@ .l0, div.b8 .a8k, .bAo > .ad { - color: @accent-color; + color: @accent; &::before { - background-color: @accent-color; + background-color: @accent; } } @@ -154,23 +115,30 @@ background-color: @mantle; } /* Header icons */ - .gb_Fc svg, - .gb_Lc.gb_Pc svg, - .gb_Fc .gb_7c .gb_fd, - .gb_Fc .gb_7c .gb_Ec, - .gb_Fc .gb_7c .gb_9c, - .gb_Lc.gb_Pc .gb_fd { + .gb_Kc svg, + .gb_Pc.gb_Uc svg, + .gb_Lc .gb_rd .gb_sd, + .gb_Lc .gb_rd .gb_Kc, + .gb_Lc .gb_rd .gb_ud, + .gb_Pc.gb_Uc .gb_sd { color: @text; } /* Search mail input */ - .gb_Fc .gb_Md { - background-color: @crust; + .gb_Kc .gb_hd { + background-color: @surface1; .gb_je, + .gb_qe, + .gsan_a, + .gsas_a, svg { color: @text; } } + /* Search mail input on focus */ + .gb_hd.gb_id { + background-color: @base; + } /* Active search / filter modal */ .gssb_c { /* Icons */ @@ -192,7 +160,7 @@ background-color: @surface0; > .gssb_a { - border-left-color: @accent-color; + border-left-color: @accent; } /* X icon */ @@ -237,7 +205,7 @@ } &.bws { - background-color: @accent-color; + background-color: @accent; color: @crust; fill: @crust; @@ -246,7 +214,7 @@ } &:hover .H1 { - background-color: darken(@accent-color, 5%); + background-color: darken(@accent, 5%); } } } @@ -285,7 +253,7 @@ color: @text; &:focus { - box-shadow: inset 0 -1px 0 0 @accent-color; + box-shadow: inset 0 -1px 0 0 @accent; } } @@ -317,7 +285,7 @@ color: @crust; &::before { - background-color: fade(@accent-color, 70%); + background-color: fade(@accent, 70%); } } @@ -326,7 +294,7 @@ color: @crust; &::before { - background-color: @accent-color; + background-color: @accent; } } @@ -419,7 +387,7 @@ /* Compose email button */ .z0 > .L3 { - background-color: @accent-color; + background-color: @accent; color: @crust; &:focus { @@ -544,7 +512,7 @@ } /* Selected unread emails */ .x7 { - background-color: @accent-color; + background-color: @accent; color: @mantle; /* Dates */ @@ -580,6 +548,48 @@ background-color: @surface1; color: @text; } + /* Your social/promotions/updates tab is empty */ + .aRs { + background-color: @base; + color: @subtext0; + + .aRv { + color: @text; + } + .aRq { + color: @accent; + } + } + /* You could lose access banner */ + .GR { + background-color: @base; + + /* Primary text */ + .GX { + color: @text; + } + /* Subtext */ + .GT { + color: @subtext1; + } + + /* Dismiss button */ + .GW { + color: @text; + + &::before { + background-color: @text; + } + } + /* Add recovery info button */ + .GV { + color: @accent; + + &::before { + background-color: @accent; + } + } + } /* Attachments chips */ .brc { box-shadow: inset 0 0 0 1px @surface0; @@ -658,7 +668,7 @@ box-shadow: inset 0 -2px 0 0 @surface2; &:focus { - box-shadow: inset 0 -2px 0 0 @accent-color; + box-shadow: inset 0 -2px 0 0 @accent; } } /* Magnifying glass icon */ @@ -695,7 +705,7 @@ /* Save button */ div.Kj-JD-Jl > button.J-at1-atl, div.Kj-JD-Jl > button.J-at1-auR { - background-color: @accent-color; + background-color: @accent; color: @crust; } } @@ -779,7 +789,7 @@ /* Send button */ .gU .v7.T-I:not(.btz), .gU .hG:not(.v6) { - background-color: @accent-color; + background-color: @accent; color: @crust; } .hG > .G-asx, @@ -842,7 +852,7 @@ /* Currently selected tab */ .fZ { - box-shadow: inset 0 -2px 0 0 @accent-color; + box-shadow: inset 0 -2px 0 0 @accent; } } /* Main panel */ @@ -861,7 +871,7 @@ .sA, .r4 .e, .el { - color: @accent-color; + color: @accent; } #input-styling(); @@ -878,7 +888,7 @@ /* Some buttons */ .Uu { box-shadow: inset 0 0 0 1px @surface0; - color: @accent-color; + color: @accent; } } /* Labels page */ @@ -897,7 +907,7 @@ /* Links */ .alP { - color: @accent-color; + color: @accent; } /* Dividers */ @@ -914,7 +924,7 @@ /* Buttons */ [data-mdc-dialog-action="ok"] { - background-color: @accent-color; + background-color: @accent; --gm3-button-text-label-text-color: @crust; --gm3-button-text-hover-label-text-color: @crust; --gm3-button-text-pressed-label-text-color: @crust; @@ -935,13 +945,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @yellow_filter: brightness(0) saturate(100%) invert(84%) sepia(47%) saturate(5389%) hue-rotate(348deg) brightness(92%) contrast(90%);; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @text_filter: brightness(0) saturate(100%) invert(31%) sepia(12%) saturate(1015%) hue-rotate(196deg) brightness(94%) contrast(91%); @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; @crust_filter: brightness(0) saturate(100%) invert(96%) sepia(3%) saturate(583%) hue-rotate(187deg) brightness(92%) contrast(97%); }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @yellow_filter: brightness(0) saturate(100%) invert(79%) sepia(20%) saturate(586%) hue-rotate(1deg) brightness(103%) contrast(84%); @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @text_filter: brightness(0) saturate(100%) invert(80%) sepia(11%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; @crust_filter: brightness(0) saturate(100%) invert(11%) sepia(6%) saturate(3257%) hue-rotate(192deg) brightness(93%) contrast(88%); }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @yellow_filter: brightness(0) saturate(100%) invert(87%) sepia(24%) saturate(488%) hue-rotate(350deg) brightness(97%) contrast(93%); @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @text_filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1385%) hue-rotate(192deg) brightness(101%) contrast(92%); @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; @crust_filter: brightness(0) saturate(100%) invert(9%) sepia(7%) saturate(2560%) hue-rotate(198deg) brightness(95%) contrast(97%); }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @yellow_filter: brightness(0) saturate(100%) invert(83%) sepia(35%) saturate(324%) hue-rotate(347deg) brightness(105%) contrast(95%); @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @text_filter: brightness(0) saturate(100%) invert(87%) sepia(6%) saturate(985%) hue-rotate(191deg) brightness(96%) contrast(99%); @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; @crust_filter: brightness(0) saturate(100%) invert(3%) sepia(12%) saturate(3951%) hue-rotate(206deg) brightness(96%) contrast(92%); }; -} - -// vim:ft=less diff --git a/styles/gmail/preview.webp b/styles/gmail/preview.webp deleted file mode 100644 index a6b7b5ea3a..0000000000 --- a/styles/gmail/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:b91723f250222b2704fb65c3b55440a654663ba51aaaa9e079f05bb0112afe8e -size 297876 diff --git a/styles/go.dev/README.md b/styles/go.dev/README.md index 1839703c34..aab20e9dca 100644 --- a/styles/go.dev/README.md +++ b/styles/go.dev/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Eli](https://github.com/Flapperoo) +- [Flapperoo](https://github.com/Flapperoo)   diff --git a/styles/go.dev/catppuccin.user.css b/styles/go.dev/catppuccin.user.less similarity index 72% rename from styles/go.dev/catppuccin.user.css rename to styles/go.dev/catppuccin.user.less index 8f6ceb6295..8a4022a982 100644 --- a/styles/go.dev/catppuccin.user.css +++ b/styles/go.dev/catppuccin.user.less @@ -2,8 +2,8 @@ @name go.dev Catppuccin @namespace github.com/catppuccin/userstyles/styles/go.dev @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/go.dev -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/go.dev/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/go.dev/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ago.dev @description Soothing pastel theme for go.dev @author Catppuccin @@ -15,67 +15,29 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('go.dev') { - @media (prefers-color-scheme: light) { - :root[data-theme="auto"], - :root:not([data-theme]) { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("go.dev") { + :root[data-theme="auto"], + :root:not([data-theme]) { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root[data-theme="auto"], - :root:not([data-theme]) { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } + :root[data-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } :root[data-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); background-color: @base; @@ -88,29 +50,30 @@ --color-background-card-footer: @crust; --color-background-code: @surface0; // Code Snippets --color-background-info: @surface1; + --color-background-alert: fade(@red, 40%); --color-background-inverted: @crust; --color-background-logo: @text; --color-background-playground-input: @mantle; - --color-brand-primary: @accent-color; // Affects most Go-Color Elements - --color-button: @accent-color; - --color-button-accented: @accent-color; + --color-brand-primary: @accent; // Affects most Go-Color Elements + --color-button: @accent; + --color-button-accented: @accent; --color-button-text: @crust; --color-button-text-disabled: @subtext0; - --color-bright-text-link: @accent-color; + --color-bright-text-link: @accent; --color-text: @text; - --color-text-link: @accent-color; + --color-text-link: @accent; --color-text-subtle: @subtext1; - --focus-box-shadow: 0 0 0.0625rem 0.0625rem @accent-color; // Only modifies color; + --focus-box-shadow: 0 0 0.0625rem 0.0625rem @accent; // Only modifies color; --gray-2: @surface0; --gray-3: @text; --gray-6: @crust; --pink: @red; - --turq-dark: @accent-color; + --turq-dark: @accent; --white: @text; --border-code: 0.0625rem @surface2 solid; .btn { - background: @accent-color; + background: @accent; color: @crust; } // /dl page in go.dev @@ -131,14 +94,6 @@ .go-Footer { background-color: @mantle; - button[aria-label="Shorcuts Modal"] img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - img.Footer-gopher, img.go-Footer-gopher { @svg: escape( @@ -167,7 +122,7 @@ } // Download button in /learn .Learn-heroAction { - background-color: @accent-color; + background-color: @accent; .js-downloadBtn { color: @crust; @@ -175,16 +130,16 @@ } // Active indicator in /learn .LearnNav .active svg circle { - fill: @accent-color; + fill: @accent; } .LeftNav a.active, .LeftNav a:hover { - background-color: fade(@accent-color, 30%); + background-color: fade(@accent, 30%); img { @svg: escape( - '' + '' ); content: url("data:image/svg+xml,@{svg}"); } @@ -237,7 +192,7 @@ // Drawer Selection .NavigationDrawer-listItem--active { - background-color: fade(@accent-color, 30%); + background-color: fade(@accent, 30%); } } // /play @@ -248,7 +203,7 @@ } // Run Button for Code Snippet .Playground-runButton { - border-color: @accent-color; + border-color: @accent; } // Go Main Header .Site-header, @@ -257,7 +212,7 @@ .Header-menuItem--active a, .go-Header-menuItem--active a { - border-bottom-color: @accent-color; + border-bottom-color: @accent; } // Mobile Burger Icon button.Header-navOpen--white, @@ -273,7 +228,7 @@ .WhyGo-reasons { .WhyGo-reasonPackagesHeader img { @svg: escape( - '' + '' ); content: url("data:image/svg+xml,@{svg}"); } @@ -309,24 +264,6 @@ ); content: url("data:image/svg+xml,@{svg}"); } - // Theme Selector Icons - .Footer img[alt="Dark theme"], - .go-Footer img[alt="Dark theme"], - .top-bar img.go-Icon--inverted[data-value="dark"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - // Right Arrow Icons - .go-NavigationDrawer-listItem a[href="#"] img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } .SiteBreadcrumb .BreadcrumbNav-li::after { @svg: escape( @@ -335,29 +272,10 @@ background-image: url("data:image/svg+xml,@{svg}"); } - .Footer img[alt="Light theme"], - .go-Footer img[alt="Light theme"], - .top-bar img.go-Icon--inverted[data-value="light"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - - .Footer img[alt="System theme"], - .go-Footer img[alt="System theme"], - .top-bar img.go-Icon--inverted[data-value="auto"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } // Menu Active Selector img.TabSection-underline { @svg: escape( - '' + '' ); content: url("data:image/svg+xml,@{svg}"); } @@ -371,7 +289,7 @@ } } // Companies in Main Page Contrast - & when (@lookup = latte) { + & when (@flavor = latte) { .WhoUsesCaseStudyList-caseStudyLink { background-color: @surface0; } @@ -379,54 +297,26 @@ } } -@-moz-document domain('pkg.go.dev') { - @media (prefers-color-scheme: light) { - :root[data-theme="auto"], - :root:not([data-theme]) { - #catppuccin(@lightFlavor, @accentColor); +@-moz-document domain("pkg.go.dev") { + :root[data-theme="auto"], + :root:not([data-theme]) { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root[data-theme="auto"], - :root:not([data-theme]) { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } + :root[data-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } :root[data-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + #catppuccin(@flavor) { + #lib.palette(); // Pkg.go Carousel .go-Carousel { @@ -450,59 +340,26 @@ .go-Chip--alert { color: @crust; } - // Pkg.go Clipboard Icon - .go-Clipboard img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } // Pkg.go Header .go-Header { .go-Header-submenu { - border-color: @accent-color; + border-color: @accent; } // Triangle Icon Accented - .go-Header-menuItem:hover img.go-Icon[alt="submenu dropdown icon"], - .go-Header-menuItem:focus-within - img.go-Icon[alt="submenu dropdown icon"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; + .go-Header-menuItem:hover a img.go-Icon { + filter: @accent-filter !important; } } - // Triangle Icon - .go-Header, - .go-Main-navMobile { - @svg: escape( - '' - ); - - img.go-Icon[alt="submenu dropdown icon"] { - content: url("data:image/svg+xml,@{svg}"); - filter: none; + // Icons + .go-Icon { + &:not(.go-Icon--accented) { + filter: @text-filter; } - - .go-Select { - background-image: url("data:image/svg+xml,@{svg}"); + &.go-Icon--accented { + filter: @accent-filter; } } - // Info Icon - .go-Main-banner .go-Message .go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - // Pkg.go Subheader - .go-Main-header { - background-color: @mantle; - } // Pkg.go Fixed Header .go-Main-header[data-raised="true"] { background-color: @crust; @@ -521,7 +378,7 @@ } .go-NavigationDrawer-listItem--active { - background-color: fade(@accent-color, 30%); + background-color: fade(@accent, 30%); } } //Pkg.go Search Bar @@ -539,10 +396,12 @@ background-color: @text; } // External Link Icon - .Homepage-helpLink, .UnitFiles-titleLink, a[href='https://www.meetup.com/pro/go'], a[href='https://github.com/golang/go/wiki/Conferences'] - { + .Homepage-helpLink, + .UnitFiles-titleLink, + a[href="https://www.meetup.com/pro/go"], + a[href="https://github.com/golang/go/wiki/Conferences"] { @svg: escape( - '' + '' ); img, @@ -561,14 +420,6 @@ .JumpDialog-active { color: @crust; } - - .go-Button[aria-label="Close"] img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } } // Pkg.go Package Search Results .SearchResults-header { @@ -576,109 +427,20 @@ display: none; } } - // Search Icon - .SearchResults-header, - .go-SearchForm { - button[aria-label="Submit search"] img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - } // Search Icon in pkg.go - Accented form.Homepage-search--symbol::before { @svg: escape( - '' + '' ); background-image: url("data:image/svg+xml,@{svg}"); } - .ShortcutsDialog { - .go-Button[aria-label="Close"] img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - } - // Pkg.go Package Page - .UnitDetails { - #section-documentation img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - - .UnitReadme-title img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - } - - .UnitDirectories img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - - .UnitFiles img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } // Pkg.go Package Details Section .UnitMeta { - .UnitMeta-details { - img.go-Icon { - // Question Tooltip - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - - img.go-Icon[alt="unchecked"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - - img.go-Icon.go-Icon--accented[alt="checked"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - } - .UnitMeta-links { - img.go-Icon { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - filter: none; - } - img.depsdev-Icon { @svg: escape( - '' + '' ); content: url("data:image/svg+xml,@{svg}"); } @@ -700,55 +462,26 @@ } } -@-moz-document url-prefix("https://go.dev/tour") -{ - @media (prefers-color-scheme: light) { - :root[data-theme="auto"], - :root:not([data-theme]) { - #catppuccin(@lightFlavor, @accentColor); +@-moz-document url-prefix("https://go.dev/tour") { + :root[data-theme="auto"], + :root:not([data-theme]) { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root[data-theme="auto"], - :root:not([data-theme]) { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } + :root[data-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } :root[data-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + #catppuccin(@flavor) { + #lib.palette(); #editor-container { #left-side { @@ -756,11 +489,11 @@ background-color: @base; a { - color: @accent-color; + color: @accent; } code { - background-color: @accent-color !important; + background-color: @accent !important; color: @crust; } @@ -781,7 +514,7 @@ color: @text; a { - color: @accent-color; + color: @accent; } } } @@ -859,7 +592,7 @@ } a#run { - background-color: @accent-color; + background-color: @accent; } pre.info { @@ -885,7 +618,7 @@ background-color: @mantle; span.ng-binding { background-color: @base; - color: @accent-color; + color: @accent; } .toc-lesson span.ng-binding { @@ -922,19 +655,9 @@ } a { - color: @accent-color; + color: @accent; } } } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/go.dev/preview.webp b/styles/go.dev/preview.webp deleted file mode 100644 index 61bb3303ed..0000000000 --- a/styles/go.dev/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:37b055ec01d120b6b2183337ddd9d038f85f6a60bdd67340ba512579d239dd8b -size 66598 diff --git a/styles/google-drive/README.md b/styles/google-drive/README.md index 81014256f5..4f3ff0ade2 100644 --- a/styles/google-drive/README.md +++ b/styles/google-drive/README.md @@ -10,17 +10,17 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer +## ๐Ÿ’ Current Maintainers - [r58Playz](https://github.com/r58Playz) +- [WalkQuackBack](https://github.com/WalkQuackBack)   diff --git a/styles/google-drive/catppuccin.user.css b/styles/google-drive/catppuccin.user.less similarity index 61% rename from styles/google-drive/catppuccin.user.css rename to styles/google-drive/catppuccin.user.less index 19f47d3d66..99004f9b74 100644 --- a/styles/google-drive/catppuccin.user.css +++ b/styles/google-drive/catppuccin.user.less @@ -2,8 +2,8 @@ @name Google Drive Catppuccin @namespace github.com/catppuccin/userstyles/styles/google-drive @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/google-drive -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google-drive/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google-drive/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle-drive @description Soothing pastel theme for Google Drive @author Catppuccin @@ -15,57 +15,27 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('drive.google.com') { - :root:has(.KkxPLb) { - .vhoiae.vhoiae.vhoiae, - & { - #catppuccin(@lightFlavor, @accentColor); - } - } - :root:has(.LgGVmb) { - .vhoiae.vhoiae.vhoiae, - & { - #catppuccin(@darkFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("drive.google.com") { + .vhoiae { + &.KkxPLb { + #catppuccin(@lightFlavor); } - } - #rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); + &.LgGVmb, .yYWAMb.bvmRsc, .dif24c.bvmRsc { + #catppuccin(@darkFlavor); + } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + #catppuccin(@flavor) { + #lib.palette(); - color-scheme: if(@lookup = latte, light, dark); + // TODO: Try to make use `#lib.defaults()` here, but it causes issues with the color scheme (see below). + // #lib.defaults(); // Color scheme is already set by Google Drive; setting it here causes bugs, and there are no known side effects as Google does not use native UI elements (which would reflect `color-scheme` state and cause potential issues). ::selection { - background-color: fade(@accent-color, 30%); + background-color: fade(@accent, 30%); } input, @@ -85,17 +55,22 @@ --dt-surface-variant: @surface0; --dt-inverse-on-surface: @surface0; --dt-surface: @base; - --dt-surface-tint: @accent-color; - --dt-shadow-elevation-1: 0px 3px 1px -2px fade(@base, 20%), - 0px 2px 2px 0px fade(@base, 14%), 0px 1px 5px 0px fade(@base, 12%); - --dt-shadow-elevation-2: 0px 2px 4px -1px fade(@base, 20%), - 0px 4px 5px 0px fade(@base, 14%), 0px 1px 10px 0px fade(@base, 12%); - --dt-shadow-elevation-3: 0px 5px 5px -3px fade(@base, 20%), - 0px 8px 10px 1px fade(@base, 14%), 0px 3px 14px 2px fade(@base, 12%); - --dt-shadow-elevation-4: 0px 5px 5px -3px fade(@base, 20%), - 0px 8px 10px 1px fade(@base, 14%), 0px 3px 14px 2px fade(@base, 12%); - --dt-shadow-elevation-5: 0px 8px 10px -6px fade(@base, 20%), - 0px 16px 24px 2px fade(@base, 14%), 0px 6px 30px 5px fade(@base, 12%); + --dt-surface-tint: @accent; + --dt-shadow-elevation-1: + 0px 3px 1px -2px fade(@base, 20%), 0px 2px 2px 0px fade(@base, 14%), 0px + 1px 5px 0px fade(@base, 12%); + --dt-shadow-elevation-2: + 0px 2px 4px -1px fade(@base, 20%), 0px 4px 5px 0px fade(@base, 14%), 0px + 1px 10px 0px fade(@base, 12%); + --dt-shadow-elevation-3: + 0px 5px 5px -3px fade(@base, 20%), 0px 8px 10px 1px fade(@base, 14%), 0px + 3px 14px 2px fade(@base, 12%); + --dt-shadow-elevation-4: + 0px 5px 5px -3px fade(@base, 20%), 0px 8px 10px 1px fade(@base, 14%), 0px + 3px 14px 2px fade(@base, 12%); + --dt-shadow-elevation-5: + 0px 8px 10px -6px fade(@base, 20%), 0px 16px 24px 2px fade(@base, 14%), + 0px 6px 30px 5px fade(@base, 12%); --dt-surface-container-lowest: @crust; --dt-surface-container-low: @mantle; --dt-surface-container: @surface0; @@ -106,11 +81,11 @@ --dt-on-primary-container: @text; --dt-primary-container-icon: @text; --dt-primary-container-link: @text; - --dt-primary: @accent-color; - --dt-primary-action: @accent-color; - --dt-primary-action-stateful: @accent-color; - --dt-primary-outline: @accent-color; - --dt-primary-action-state-layer: @accent-color; + --dt-primary: @accent; + --dt-primary-action: @accent; + --dt-primary-action-stateful: @accent; + --dt-primary-outline: @accent; + --dt-primary-action-state-layer: @accent; --dt-primary-container: @surface0; --dt-on-primary: @base; --dt-primary-icon: @base; @@ -118,11 +93,11 @@ --dt-on-secondary-container: @text; --dt-secondary-container-icon: @text; --dt-secondary-container-link: @text; - --dt-secondary: @accent-color; - --dt-secondary-action: @accent-color; - --dt-secondary-action-stateful: @accent-color; - --dt-secondary-outline: @accent-color; - --dt-secondary-action-state-layer: @accent-color; + --dt-secondary: @accent; + --dt-secondary-action: @accent; + --dt-secondary-action-stateful: @accent; + --dt-secondary-outline: @accent; + --dt-secondary-action-state-layer: @accent; --dt-secondary-container: @surface0; --dt-on-secondary: @base; --dt-secondary-icon: @base; @@ -130,11 +105,11 @@ --dt-on-tertiary-container: @text; --dt-tertiary-container-icon: @text; --dt-tertiary-container-link: @text; - --dt-tertiary: @accent-color; - --dt-tertiary-action: @accent-color; - --dt-tertiary-action-stateful: @accent-color; - --dt-tertiary-outline: @accent-color; - --dt-tertiary-action-state-layer: @accent-color; + --dt-tertiary: @accent; + --dt-tertiary-action: @accent; + --dt-tertiary-action-stateful: @accent; + --dt-tertiary-outline: @accent; + --dt-tertiary-action-state-layer: @accent; --dt-tertiary-container: @surface0; --dt-on-tertiary: @base; --dt-tertiary-icon: @base; @@ -194,116 +169,116 @@ --dt-light-error-banner-button: @red; --gm3-sys-color-background: @base; - --gm3-sys-color-background-rgb: #rgbify(@base) []; + --gm3-sys-color-background-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-error: @red; - --gm3-sys-color-error-rgb: #rgbify(@red) []; + --gm3-sys-color-error-rgb: #lib.rgbify(@red)[]; --gm3-sys-color-error-container: @surface2; - --gm3-sys-color-error-container-rgb: #rgbify(@surface2) []; + --gm3-sys-color-error-container-rgb: #lib.rgbify(@surface2)[]; --gm3-sys-color-inverse-on-surface: @surface0; - --gm3-sys-color-inverse-on-surface-rgb: #rgbify(@surface0) []; + --gm3-sys-color-inverse-on-surface-rgb: #lib.rgbify(@surface0)[]; --gm3-sys-color-inverse-primary: red; --gm3-sys-color-inverse-primary-rgb: 255, 0, 0; --gm3-sys-color-inverse-surface: @text; - --gm3-sys-color-inverse-surface-rgb: #rgbify(@text) []; + --gm3-sys-color-inverse-surface-rgb: #lib.rgbify(@text)[]; --gm3-sys-color-on-background: @text; - --gm3-sys-color-on-background-rgb: #rgbify(@text) []; + --gm3-sys-color-on-background-rgb: #lib.rgbify(@text)[]; --gm3-sys-color-on-error: @base; - --gm3-sys-color-on-error-rgb: #rgbify(@base) []; + --gm3-sys-color-on-error-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-on-error-container: @red; - --gm3-sys-color-on-error-container-rgb: #rgbify(@red) []; + --gm3-sys-color-on-error-container-rgb: #lib.rgbify(@red)[]; --gm3-sys-color-on-primary: @base; - --gm3-sys-color-on-primary-rgb: #rgbify(@base) []; + --gm3-sys-color-on-primary-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-on-primary-container: @text; - --gm3-sys-color-on-primary-container-rgb: #rgbify(@text) []; + --gm3-sys-color-on-primary-container-rgb: #lib.rgbify(@text)[]; --gm3-sys-color-on-primary-fixed: @base; - --gm3-sys-color-on-primary-fixed-rgb: #rgbify(@base); + --gm3-sys-color-on-primary-fixed-rgb: #lib.rgbify(@base); --gm3-sys-color-on-primary-fixed-variant: @base; - --gm3-sys-color-on-primary-fixed-variant-rgb: #rgbify(@base); + --gm3-sys-color-on-primary-fixed-variant-rgb: #lib.rgbify(@base); --gm3-sys-color-on-secondary: @base; - --gm3-sys-color-on-secondary-rgb: #rgbify(@base) []; + --gm3-sys-color-on-secondary-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-on-secondary-container: @text; - --gm3-sys-color-on-secondary-container-rgb: #rgbify(@text) []; + --gm3-sys-color-on-secondary-container-rgb: #lib.rgbify(@text)[]; --gm3-sys-color-on-secondary-fixed: @base; - --gm3-sys-color-on-secondary-fixed-rgb: #rgbify(@base) []; + --gm3-sys-color-on-secondary-fixed-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-on-secondary-fixed-variant: @base; - --gm3-sys-color-on-secondary-fixed-variant-rgb: #rgbify(@base) []; + --gm3-sys-color-on-secondary-fixed-variant-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-on-surface: @text; - --gm3-sys-color-on-surface-rgb: #rgbify(@text) []; + --gm3-sys-color-on-surface-rgb: #lib.rgbify(@text)[]; --gm3-sys-color-on-surface-variant: @text; - --gm3-sys-color-on-surface-variant-rgb: #rgbify(@text) []; + --gm3-sys-color-on-surface-variant-rgb: #lib.rgbify(@text)[]; --gm3-sys-color-on-tertiary: @base; - --gm3-sys-color-on-tertiary-rgb: #rgbify(@base) []; + --gm3-sys-color-on-tertiary-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-on-tertiary-container: @text; - --gm3-sys-color-on-tertiary-container-rgb: #rgbify(@text) []; + --gm3-sys-color-on-tertiary-container-rgb: #lib.rgbify(@text)[]; --gm3-sys-color-on-tertiary-fixed: @base; - --gm3-sys-color-on-tertiary-fixed-rgb: #rgbify(@base) []; + --gm3-sys-color-on-tertiary-fixed-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-on-tertiary-fixed-variant: @base; - --gm3-sys-color-on-tertiary-fixed-variant-rgb: #rgbify(@base) []; + --gm3-sys-color-on-tertiary-fixed-variant-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-outline: @overlay0; - --gm3-sys-color-outline-rgb: #rgbify(@overlay0) []; + --gm3-sys-color-outline-rgb: #lib.rgbify(@overlay0)[]; --gm3-sys-color-outline-variant: @surface2; - --gm3-sys-color-outline-variant-rgb: #rgbify(@surface2) []; - --gm3-sys-color-primary: @accent-color; - --gm3-sys-color-primary-rgb: #rgbify(@accent-color) []; + --gm3-sys-color-outline-variant-rgb: #lib.rgbify(@surface2)[]; + --gm3-sys-color-primary: @accent; + --gm3-sys-color-primary-rgb: #lib.rgbify(@accent)[]; --gm3-sys-color-primary-container: @surface0; - --gm3-sys-color-primary-container-rgb: #rgbify(@surface0) []; - --gm3-sys-color-primary-fixed: @accent-color; - --gm3-sys-color-primary-fixed-rgb: #rgbify(@accent-color) []; - --gm3-sys-color-primary-fixed-dim: @accent-color; - --gm3-sys-color-primary-fixed-dim-rgb: #rgbify(@accent-color) []; - --gm3-sys-color-secondary: @accent-color; - --gm3-sys-color-secondary-rgb: #rgbify(@accent-color); + --gm3-sys-color-primary-container-rgb: #lib.rgbify(@surface0)[]; + --gm3-sys-color-primary-fixed: @accent; + --gm3-sys-color-primary-fixed-rgb: #lib.rgbify(@accent)[]; + --gm3-sys-color-primary-fixed-dim: @accent; + --gm3-sys-color-primary-fixed-dim-rgb: #lib.rgbify(@accent)[]; + --gm3-sys-color-secondary: @accent; + --gm3-sys-color-secondary-rgb: #lib.rgbify(@accent); --gm3-sys-color-secondary-container: @surface0; - --gm3-sys-color-secondary-container-rgb: #rgbify(@surface0) []; + --gm3-sys-color-secondary-container-rgb: #lib.rgbify(@surface0)[]; --gm3-sys-color-secondary-fixed: #c2e7ff; --gm3-sys-color-secondary-fixed-rgb: 194, 231, 255; --gm3-sys-color-secondary-fixed-dim: #7fcfff; --gm3-sys-color-secondary-fixed-dim-rgb: 127, 207, 255; --gm3-sys-color-surface: @base; - --gm3-sys-color-surface-rgb: #rgbify(@base) []; + --gm3-sys-color-surface-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-surface-bright: @base; - --gm3-sys-color-surface-bright-rgb: #rgbify(@base) []; + --gm3-sys-color-surface-bright-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-surface-container: @surface0; - --gm3-sys-color-surface-container-rgb: #rgbify(@surface0) []; + --gm3-sys-color-surface-container-rgb: #lib.rgbify(@surface0)[]; --gm3-sys-color-surface-container-high: @surface1; - --gm3-sys-color-surface-container-high-rgb: #rgbify(@surface1) []; + --gm3-sys-color-surface-container-high-rgb: #lib.rgbify(@surface1)[]; --gm3-sys-color-surface-container-highest: @surface2; - --gm3-sys-color-surface-container-highest-rgb: #rgbify(@surface2) []; + --gm3-sys-color-surface-container-highest-rgb: #lib.rgbify(@surface2)[]; --gm3-sys-color-surface-container-low: @mantle; - --gm3-sys-color-surface-container-low-rgb: #rgbify(@mantle) []; + --gm3-sys-color-surface-container-low-rgb: #lib.rgbify(@mantle)[]; --gm3-sys-color-surface-container-lowest: @crust; - --gm3-sys-color-surface-container-lowest-rgb: #rgbify(@crust) []; + --gm3-sys-color-surface-container-lowest-rgb: #lib.rgbify(@crust)[]; --gm3-sys-color-surface-dim: @crust; - --gm3-sys-color-surface-dim-rgb: #rgbify(@crust) []; - --gm3-sys-color-surface-tint: @accent-color; - --gm3-sys-color-surface-tint-rgb: #rgbify(@accent-color) []; + --gm3-sys-color-surface-dim-rgb: #lib.rgbify(@crust)[]; + --gm3-sys-color-surface-tint: @accent; + --gm3-sys-color-surface-tint-rgb: #lib.rgbify(@accent)[]; --gm3-sys-color-surface-variant: @surface0; - --gm3-sys-color-surface-variant-rgb: #rgbify(@surface0) []; - --gm3-sys-color-tertiary: @accent-color; - --gm3-sys-color-tertiary-rgb: #rgbify(@accent-color) []; + --gm3-sys-color-surface-variant-rgb: #lib.rgbify(@surface0)[]; + --gm3-sys-color-tertiary: @accent; + --gm3-sys-color-tertiary-rgb: #lib.rgbify(@accent)[]; --gm3-sys-color-tertiary-container: @surface0; - --gm3-sys-color-tertiary-container-rgb: #rgbify(@surface0); - --gm3-sys-color-tertiary-fixed: @accent-color; - --gm3-sys-color-tertiary-fixed-rgb: #rgbify(@accent-color) []; - --gm3-sys-color-tertiary-fixed-dim: @accent-color; - --gm3-sys-color-tertiary-fixed-dim-rgb: #rgbify(@accent-color) []; + --gm3-sys-color-tertiary-container-rgb: #lib.rgbify(@surface0); + --gm3-sys-color-tertiary-fixed: @accent; + --gm3-sys-color-tertiary-fixed-rgb: #lib.rgbify(@accent)[]; + --gm3-sys-color-tertiary-fixed-dim: @accent; + --gm3-sys-color-tertiary-fixed-dim-rgb: #lib.rgbify(@accent)[]; - & when (@lookup = latte) { + & when (@flavor = latte) { --dt-scrim: fade(@text, 50%); --dt-scrim-2x: fade(@text, 50%); --gm3-sys-color-scrim: @text; - --gm3-sys-color-scrim-rgb: #rgbify(@text) []; + --gm3-sys-color-scrim-rgb: #lib.rgbify(@text)[]; --gm3-sys-color-shadow: @text; - --gm3-sys-color-shadow-rgb: #rgbify(@text) []; + --gm3-sys-color-shadow-rgb: #lib.rgbify(@text)[]; } - & when not (@lookup = latte) { + & when not(@flavor = latte) { --dt-scrim: fade(@base, 50%); --dt-scrim-2x: fade(@base, 50%); --gm3-sys-color-scrim: @base; - --gm3-sys-color-scrim-rgb: #rgbify(@base) []; + --gm3-sys-color-scrim-rgb: #lib.rgbify(@base)[]; --gm3-sys-color-shadow: @base; - --gm3-sys-color-shadow-rgb: #rgbify(@base) []; + --gm3-sys-color-shadow-rgb: #lib.rgbify(@base)[]; } /* Settings menu title & back button */ @@ -370,14 +345,18 @@ } /* File preview (separate tab) top bar */ - &.ndfHFb-c4YZDc-uoC0bf.ndfHFb-c4YZDc-i5oIFb .ndfHFb-c4YZDc-Wrql6b.ndfHFb-c4YZDc-Wrql6b-Hyc8Sd, - .a-b-uoC0bf.a-b-L .a-b-K.a-b-K-Hyc8Sd /* File preview (in Drive) top bar */ { + &.ndfHFb-c4YZDc-uoC0bf.ndfHFb-c4YZDc-i5oIFb + .ndfHFb-c4YZDc-Wrql6b.ndfHFb-c4YZDc-Wrql6b-Hyc8Sd, + .a-b-uoC0bf.a-b-L .a-b-K.a-b-K-Hyc8Sd /* File preview (in Drive) top bar */ + { background-color: fade(@base, 85%); } /* File preview (separate tab) bottom bar */ - .ndfHFb-c4YZDc-q77wGc .ndfHFb-c4YZDc-DARUcf-NnAfwf-i5oIFb, .ndfHFb-c4YZDc-q77wGc .ndfHFb-c4YZDc-nJjxad-nK2kYb-i5oIFb, - .a-b-vo .a-b-La-yc-L, .a-b-vo .a-b-Kb-ac-L /* File preview (in Drive) bottom bar */ { + .ndfHFb-c4YZDc-q77wGc .ndfHFb-c4YZDc-DARUcf-NnAfwf-i5oIFb, + .ndfHFb-c4YZDc-q77wGc .ndfHFb-c4YZDc-nJjxad-nK2kYb-i5oIFb, + .a-b-vo .a-b-La-yc-L, + .a-b-vo .a-b-Kb-ac-L /* File preview (in Drive) bottom bar */ { background-color: fade(@base, 85%); color: @text !important; /* File preview (separate tab) page input */ @@ -389,26 +368,31 @@ } /* File preview (separate tab) share button */ - &.ndfHFb-c4YZDc-uoC0bf .zAYgkb-uoC0bf .tk3N6e-LgbsSe, &.ndfHFb-c4YZDc-uoC0bf .zAYgkb-mAKE4e-LQLjdd-xl07Ob-LgbsSe.VIpgJd-Kb3HCc-xl07Ob-LgbsSe, - .a-b-uoC0bf .ae-uoC0bf .g-d, .a-b-uoC0bf .ae-mAKE4e-Hc-w-d.h-R-w-d /* File preview (in Drive) share button */ { - background-color: @accent-color; + &.ndfHFb-c4YZDc-uoC0bf .zAYgkb-uoC0bf .tk3N6e-LgbsSe, + &.ndfHFb-c4YZDc-uoC0bf + .zAYgkb-mAKE4e-LQLjdd-xl07Ob-LgbsSe.VIpgJd-Kb3HCc-xl07Ob-LgbsSe, + .a-b-uoC0bf .ae-uoC0bf .g-d, + .a-b-uoC0bf + .ae-mAKE4e-Hc-w-d.h-R-w-d /* File preview (in Drive) share button */ { + background-color: @accent; color: @base; /* File preview (separate tab) share icon */ .IyROMc-euCgFf-LJSvSb, .ae-c /* File preview (in Drive) share icon */ { - & when (@lookup = latte) { - filter: brightness(0) invert(97%) sepia(4%) saturate(152%) - hue-rotate(183deg) brightness(94%) contrast(106%); + & when (@flavor = latte) { + filter: brightness(0) invert(97%) sepia(4%) saturate(152%) hue-rotate( + 183deg + ) brightness(94%) contrast(106%); } - & when (@lookup = frappe) { + & when (@flavor = frappe) { filter: brightness(0) invert(15%) sepia(8%) saturate(2252%) hue-rotate(192deg) brightness(98%) contrast(85%); } - & when (@lookup = macchiato) { + & when (@flavor = macchiato) { filter: brightness(0) invert(13%) sepia(26%) saturate(823%) hue-rotate(195deg) brightness(90%) contrast(92%); } - & when (@lookup = mocha) { + & when (@flavor = mocha) { filter: brightness(0) invert(10%) sepia(36%) saturate(650%) hue-rotate(201deg) brightness(90%) contrast(93%); } @@ -443,19 +427,19 @@ /* File preview (separate tab) share Quick options row icon */ .IyROMc-euCgFf-LJSvSb, .ba-ea-i /* File preview (in Drive) share Quick options row icon */ { - & when (@lookup = latte) { + & when (@flavor = latte) { filter: brightness(0) invert(31%) sepia(10%) saturate(1268%) hue-rotate(196deg) brightness(90%) contrast(86%); } - & when (@lookup = frappe) { + & when (@flavor = frappe) { filter: brightness(0) invert(80%) sepia(7%) saturate(1070%) hue-rotate(192deg) brightness(104%) contrast(92%); } - & when (@lookup = macchiato) { + & when (@flavor = macchiato) { filter: brightness(0) invert(84%) sepia(13%) saturate(579%) hue-rotate(193deg) brightness(99%) contrast(94%); } - & when (@lookup = mocha) { + & when (@flavor = mocha) { filter: brightness(0) invert(84%) sepia(19%) saturate(370%) hue-rotate(192deg) brightness(98%) contrast(95%); } @@ -465,29 +449,35 @@ .ndfHFb-c4YZDc-Bz112c:not([style]), .ndfHFb-c4YZDc-Bz112c[style*="googlematerialicons"], .ndfHFb-c4YZDc-Bz112c[style="user-select: none;"], - .ndfHFb-c4YZDc-Wrql6b-htvI8d-wcotoc-wHEfpf-ndfHFb-Bz112c /* File preview (separate tab) Save to drive */, - .ndfHFb-c4YZDc-Wrql6b-w37qKe-Bz112c /* File preview (separate tab) Save to drive (clicked) */, + .ndfHFb-c4YZDc-Wrql6b-htvI8d-wcotoc-wHEfpf-ndfHFb-Bz112c + /* File preview (separate tab) Save to drive */, + .ndfHFb-c4YZDc-Wrql6b-w37qKe-Bz112c + /* File preview (separate tab) Save to drive (clicked) */, /* File preview (in Drive) Print, Download, 3 dots */ .a-b-c:not([style]), .a-b-c[style*="googlematerialicons"], .a-b-c[style="user-select: none;"], .a-b-K-zc-Eb-bg-a-c /* File preview (in Drive) Save to drive */, .a-b-K-X-c /* File preview (in Drive) Save to drive (clicked) */ { - & when (@lookup = latte) { - filter: brightness(0) invert(31%) sepia(10%) saturate(1268%) - hue-rotate(196deg) brightness(90%) contrast(86%); + & when (@flavor = latte) { + filter: brightness(0) invert(31%) sepia(10%) saturate(1268%) hue-rotate( + 196deg + ) brightness(90%) contrast(86%); } - & when (@lookup = frappe) { - filter: brightness(0) invert(80%) sepia(7%) saturate(1070%) - hue-rotate(192deg) brightness(104%) contrast(92%); + & when (@flavor = frappe) { + filter: brightness(0) invert(80%) sepia(7%) saturate(1070%) hue-rotate( + 192deg + ) brightness(104%) contrast(92%); } - & when (@lookup = macchiato) { - filter: brightness(0) invert(84%) sepia(13%) saturate(579%) - hue-rotate(193deg) brightness(99%) contrast(94%); + & when (@flavor = macchiato) { + filter: brightness(0) invert(84%) sepia(13%) saturate(579%) hue-rotate( + 193deg + ) brightness(99%) contrast(94%); } - & when (@lookup = mocha) { - filter: brightness(0) invert(84%) sepia(19%) saturate(370%) - hue-rotate(192deg) brightness(98%) contrast(95%); + & when (@flavor = mocha) { + filter: brightness(0) invert(84%) sepia(19%) saturate(370%) hue-rotate( + 192deg + ) brightness(98%) contrast(95%); } } /* File preview (separate tab) File title */ @@ -519,20 +509,21 @@ } /* File preview (separate tab) No preview available Download icon */ .ndfHFb-c4YZDc-bN97Pc-nupQLb-LgbsSe-Bz112c, - .a-b-x-rb-d-c /* File preview (in Drive) No preview available Download icon */ { - & when (@lookup = latte) { + .a-b-x-rb-d-c /* File preview (in Drive) No preview available Download icon */ + { + & when (@flavor = latte) { filter: brightness(0) invert(31%) sepia(10%) saturate(1268%) hue-rotate(196deg) brightness(90%) contrast(86%); } - & when (@lookup = frappe) { + & when (@flavor = frappe) { filter: brightness(0) invert(80%) sepia(7%) saturate(1070%) hue-rotate(192deg) brightness(104%) contrast(92%); } - & when (@lookup = macchiato) { + & when (@flavor = macchiato) { filter: brightness(0) invert(84%) sepia(13%) saturate(579%) hue-rotate(193deg) brightness(99%) contrast(94%); } - & when (@lookup = mocha) { + & when (@flavor = mocha) { filter: brightness(0) invert(84%) sepia(19%) saturate(370%) hue-rotate(192deg) brightness(98%) contrast(95%); } @@ -540,7 +531,8 @@ } /* File preview (in Drive) text document */ .a-b-r-x, - .ndfHFb-c4YZDc-fmcmS-bN97Pc /* File preview (separate tab) text document */ { + .ndfHFb-c4YZDc-fmcmS-bN97Pc /* File preview (separate tab) text document */ + { &, pre { background-color: @surface0 !important; @@ -595,12 +587,14 @@ /* Drive sharing window material icon */ .SbpzSe .VfPpkd-StrnGf-rymPhb-f7MjDc { - color: @accent-color; + color: @accent; } /* Drive sharing window access hover */ - .lfDNBb:hover, .lfDNBb:focus-within, - .ZelW3e:hover .FYhd9e, .ZelW3e:focus-within .FYhd9e /* Drive sharing window person row hover */ { + .lfDNBb:hover, + .lfDNBb:focus-within, + .ZelW3e:hover .FYhd9e, + .ZelW3e:focus-within .FYhd9e /* Drive sharing window person row hover */ { background-color: @surface0; } @@ -637,21 +631,25 @@ } /* Drive applications sidebar get addons */ .Yb-Il-d#qJTzr .Yb-Il-d-c-j { - & when (@lookup = latte) { - filter: brightness(0) invert(31%) sepia(10%) saturate(1268%) - hue-rotate(196deg) brightness(90%) contrast(86%); + & when (@flavor = latte) { + filter: brightness(0) invert(31%) sepia(10%) saturate(1268%) hue-rotate( + 196deg + ) brightness(90%) contrast(86%); } - & when (@lookup = frappe) { - filter: brightness(0) invert(80%) sepia(7%) saturate(1070%) - hue-rotate(192deg) brightness(104%) contrast(92%); + & when (@flavor = frappe) { + filter: brightness(0) invert(80%) sepia(7%) saturate(1070%) hue-rotate( + 192deg + ) brightness(104%) contrast(92%); } - & when (@lookup = macchiato) { - filter: brightness(0) invert(84%) sepia(13%) saturate(579%) - hue-rotate(193deg) brightness(99%) contrast(94%); + & when (@flavor = macchiato) { + filter: brightness(0) invert(84%) sepia(13%) saturate(579%) hue-rotate( + 193deg + ) brightness(99%) contrast(94%); } - & when (@lookup = mocha) { - filter: brightness(0) invert(84%) sepia(19%) saturate(370%) - hue-rotate(192deg) brightness(98%) contrast(95%); + & when (@flavor = mocha) { + filter: brightness(0) invert(84%) sepia(19%) saturate(370%) hue-rotate( + 192deg + ) brightness(98%) contrast(95%); } } /* Drive applications sidebar close button white background */ @@ -660,7 +658,7 @@ } /* Drive icon */ - .gb_Nc.gb_Nd { + [src="//ssl.gstatic.com/images/branding/product/1x/drive_2020q4_48dp.png"] { @darkBlue: mix(@blue, @base, 80%); @darkGreen: mix(@green, @base, 80%); @@ -676,13 +674,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/google-drive/preview.webp b/styles/google-drive/preview.webp deleted file mode 100644 index 098fa96b19..0000000000 --- a/styles/google-drive/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:1b1e95702d47cba48511ad9e1a861586fa53b29ad32c203347f9b1b955fd5953 -size 176172 diff --git a/styles/google-gemini/README.md b/styles/google-gemini/README.md index d0ed681bed..fa9136bb9c 100644 --- a/styles/google-gemini/README.md +++ b/styles/google-gemini/README.md @@ -10,17 +10,17 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer +## ๐Ÿ’ Current Maintainers - [Dandraghas](https://github.com/Dandraghas) +- [WalkQuackBack](https://github.com/WalkQuackBack)   diff --git a/styles/google-gemini/catppuccin.user.css b/styles/google-gemini/catppuccin.user.less similarity index 52% rename from styles/google-gemini/catppuccin.user.css rename to styles/google-gemini/catppuccin.user.less index 1cce6f5c9e..7b53490bd7 100644 --- a/styles/google-gemini/catppuccin.user.css +++ b/styles/google-gemini/catppuccin.user.less @@ -2,8 +2,8 @@ @name Google Gemini Catppuccin @namespace github.com/catppuccin/userstyles/styles/google-gemini @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/google-gemini -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google-gemini/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google-gemini/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle-gemini @description Soothing pastel theme for Google Gemini @author Catppuccin @@ -15,90 +15,25 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('gemini.google.com') { - @import url("https://unpkg.com/@catppuccin/highlightjs@0.2.2/css/catppuccin.variables.important.css"); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; - :root body.dark-theme { - #catppuccin(@darkFlavor, @accentColor); - } +@-moz-document domain("gemini.google.com") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); - :root body.light-theme { - #catppuccin(@lightFlavor, @accentColor); + :root .dark-theme { + #catppuccin(@darkFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - --ctp-rosewater: #rgbify(@rosewater) []; - --ctp-flamingo: #rgbify(@flamingo) []; - --ctp-pink: #rgbify(@pink) []; - --ctp-mauve: #rgbify(@mauve) []; - --ctp-red: #rgbify(@red) []; - --ctp-maroon: #rgbify(@maroon) []; - --ctp-peach: #rgbify(@peach) []; - --ctp-yellow: #rgbify(@yellow) []; - --ctp-green: #rgbify(@green) []; - --ctp-teal: #rgbify(@teal) []; - --ctp-sky: #rgbify(@sky) []; - --ctp-sapphire: #rgbify(@sapphire) []; - --ctp-blue: #rgbify(@blue) []; - --ctp-lavender: #rgbify(@lavender) []; - --ctp-text: #rgbify(@text) []; - --ctp-subtext1: #rgbify(@subtext1) []; - --ctp-subtext0: #rgbify(@subtext0) []; - --ctp-overlay2: #rgbify(@overlay2) []; - --ctp-overlay1: #rgbify(@overlay1) []; - --ctp-overlay0: #rgbify(@overlay0) []; - --ctp-surface2: #rgbify(@surface2) []; - --ctp-surface1: #rgbify(@surface1) []; - --ctp-surface0: #rgbify(@surface0) []; - --ctp-base: #rgbify(@base) []; - --ctp-mantle: #rgbify(@mantle) []; - --ctp-crust: #rgbify(@crust) []; - - color-scheme: if(@lookup =latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } + :root .light-theme { + #catppuccin(@lightFlavor); + } - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); - --bard-color-primary-background: @base; - --bard-color-primary-opacity-08: fade(@accent-color, 8%); --bard-color-neutral-90: @mantle; - --bard-color-on-primary: darken(@accent-color, 10%); --bard-color-on-selected-conversation-metadata-v2: @text; --bard-color-surface-container: @mantle; --bard-color-on-surface-opacity-38: @surface2 !important; @@ -107,44 +42,40 @@ --bard-color-inverse-on-surface: darken(@mantle, 1%); --bard-color-sidenav-mobile-controls: @text; --bard-color-main-container-background: @base; - --bard-color-main-container-background-rgb: #rgbify(@base) []; + --bard-color-main-container-background-rgb: #lib.rgbify(@base)[]; --bard-color-window-container-background: @base; --bard-color-response-container-background: @base; - --bard-color-response-container-background-rgb: #rgbify(@base) []; - --bard-color-selected-conversation-metadata-v2: fade(@accent-color, 50%); + --bard-color-response-container-background-rgb: #lib.rgbify(@base)[]; --bard-color-onhover-conversation-metadata-button-v2: @surface1; --bard-color-selected-conversation-metadata-button-v2: fade( - @accent-color, + @accent, 40% ); --bard-color-new-conversation-button: @surface0; --bard-color-on-new-conversation-button: @text; --bard-color-onhover-conversation-metadata-v2: @surface0; - --bard-color-sidenav-upgrade-button: @surface0; --bard-color-form-field-placeholder: @subtext0; - --bard-color-extensions-window-container-background: @crust; - --bard-color-extension-card-container-background: @mantle; --bard-color-discovery-carousel-background: @mantle; + --bard-color-discovery-carousel-icon: @accent; --bard-color-example-prompt-background: @crust; --bard-color-bard-mode-logo-prefix: @subtext1; - --bard-color-discovery-carousel-icon: @accent-color; --bard-color-neutral-96: @crust; --bard-color-adv-marketing-basic-background: @surface0; --bard-color-adv-marketing-product-background: @surface0; --bard-color-adv-marketing-disclaimer: @subtext0; --bard-color-input-area-buttons-selected-background: fade( - @accent-color, + @accent, 70% ); - --bard-color-zero-state-card-selected: fade(@accent-color, 30%); - --bard-color-zero-state-prompt-chip-background: fade(@accent-color, 50%); - --bard-color-zero-state-prompt-chip-text: lighten(@accent-color, 5%); - --bard-color-regular-banner: @accent-color; + --bard-color-zero-state-card-selected: fade(@accent, 30%); + --bard-color-zero-state-prompt-chip-background: fade(@accent, 50%); + --bard-color-zero-state-prompt-chip-text: lighten(@accent, 5%); + --bard-color-regular-banner: @accent; --bard-color-regular-banner-text: @crust; - --bard-color-skeleton-loader-background-1-rgb: #rgbify(@mantle) []; - --bard-color-skeleton-loader-background-2-rgb: #rgbify(@accent-color) []; - --bard-color-skeleton-loader-background-3-rgb: #rgbify(@accent-color) []; + --bard-color-skeleton-loader-background-1-rgb: #lib.rgbify(@mantle)[]; + --bard-color-skeleton-loader-background-2-rgb: #lib.rgbify(@accent)[]; + --bard-color-skeleton-loader-background-3-rgb: #lib.rgbify(@accent)[]; --bard-color-brand-text-gradient-stop-1: @blue; --bard-color-brand-text-gradient-stop-2: @sapphire; --bard-color-brand-text-gradient-stop-3: @peach; @@ -166,18 +97,18 @@ --bard-color-tunable-selection-menu-text: @text; --bard-color-tunable-selection-menu-background: @mantle; --bard-color-tunable-selection-textarea-background: @base; - --bard-color-tunable-selection-shimmer-non-advanced: @accent-color; - --bard-color-action-tooltip-background: darken(@accent-color, 20%); + --bard-color-tunable-selection-shimmer-non-advanced: @accent; + --bard-color-onegooglebar-product-controls: @text; --bard-color-adv-marketing-check: @text; - --mdc-switch-selected-hover-handle-color: lighten(@accent-color, 10%); - --mdc-switch-selected-focus-handle-color: lighten(@accent-color, 10%); - --mdc-switch-selected-pressed-handle-color: lighten(@accent-color, 15%); - --mdc-switch-selected-track-color: fade(@accent-color, 50%); - --mdc-switch-selected-hover-track-color: fade(@accent-color, 50%); - --mdc-switch-selected-focus-track-color: fade(@accent-color, 50%); - --mdc-switch-selected-pressed-track-color: fade(@accent-color, 50%); - --mdc-switch-selected-handle-color: @accent-color; + --mdc-switch-selected-hover-handle-color: lighten(@accent, 10%); + --mdc-switch-selected-focus-handle-color: lighten(@accent, 10%); + --mdc-switch-selected-pressed-handle-color: lighten(@accent, 15%); + --mdc-switch-selected-track-color: fade(@accent, 50%); + --mdc-switch-selected-hover-track-color: fade(@accent, 50%); + --mdc-switch-selected-focus-track-color: fade(@accent, 50%); + --mdc-switch-selected-pressed-track-color: fade(@accent, 50%); + --mdc-switch-selected-handle-color: @accent; --mdc-switch-unselected-handle-color: @subtext0; --mdc-switch-unselected-hover-handle-color: @subtext1; --mdc-switch-unselected-focus-handle-color: @text; @@ -186,22 +117,40 @@ --mdc-switch-unselected-hover-track-color: @surface2; --mdc-switch-unselected-pressed-track-color: @surface2; --mdc-switch-unselected-focus-track-color: @surface2; + --mdc-checkbox-selected-icon-color: @accent; + --mdc-checkbox-selected-checkmark-color: var(--gem-sys-color--on-primary); + --mdc-checkbox-selected-hover-icon-color: @accent; + --mdc-checkbox-selected-pressed-icon-color: @accent; + --mdc-checkbox-selected-focus-icon-color: @accent; + --mdc-checkbox-selected-focus-state-layer-color: @accent; + --mdc-checkbox-selected-hover-state-layer-color: @accent; + --mdc-checkbox-selected-pressed-state-layer-color: @text; + --mdc-checkbox-unselected-pressed-state-layer-color: @accent; + --mdc-checkbox-unselected-focus-state-layer-color: @text; + --mdc-checkbox-unselected-hover-state-layer-color: @text; + --mdc-checkbox-unselected-focus-icon-color: @text; + --mdc-checkbox-unselected-icon-color: @subtext1; + --mdc-checkbox-unselected-hover-icon-color: @text; --mdc-text-button-label-text-color: @subtext1; --mdc-text-button-hover-label-text-color: @overlay2; --mdc-list-list-item-hover-label-text-color: @text; - --mdc-filled-button-label-text-color: @text; - --mdc-circular-progress-active-indicator-color: @accent-color; + --mdc-filled-button-label-text-color: @crust; + --mdc-circular-progress-active-indicator-color: @accent; --mdc-outlined-button-focus-outline-color: @text; --mdc-outlined-button-hover-label-text-color: @subtext1; --mdc-list-list-item-focus-label-text-color: @text; + --mdc-icon-button-disabled-icon-color: @surface2; + --mdc-outlined-text-field-input-text-color: @text; + --mdc-outlined-text-field-focus-outline-color: @accent; + --mdc-outlined-text-field-outline-color: @overlay1; --mat-app-text-color: @text; --mat-text-button-state-layer-color: @overlay2; - --mat-icon-color: @text; --mat-sidenav-container-text-color: @text; --mat-expansion-header-text-color: @text; --mat-expansion-header-indicator-color: @text; --mat-expansion-container-text-color: @text; + --mat-checkbox-label-text-color: @text; --mat-bottom-sheet-container-text-color: @text; --mat-bottom-sheet-container-background-color: @base; --mat-menu-item-hover-state-layer-color: @surface0; @@ -210,57 +159,56 @@ --mat-menu-container-color: @base; --mat-menu-item-icon-color: @text; --mat-filled-button-state-layer-color: @overlay2; + --mat-focus-indicator-border-color: @accent; --mat-fab-small-hover-state-layer-opacity: 1; - --mat-divider-color: @surface0; + --mat-divider-color: @overlay2; --gm-outlinedtextfield-outline-color: @subtext0; - --gm-outlinedtextfield-outline-color--stateful: @accent-color; + --gm-outlinedtextfield-outline-color--stateful: @accent; --gm-outlinedtextfield-ink-color: @text; --gm3-sys-color-on-secondary-container: @crust; --gm3-sys-color-secondary-container: @text; --gem-sys-color--surface: @base; --gem-sys-color--surface-container: @mantle; + --gem-sys-color--surface--rgb: #lib.rgbify(@base)[]; --gem-sys-color--on-surface: @text; - --gem-sys-color--outline-variant: @subtext0; + --gem-sys-color--on-surface-variant: @subtext1; + --gem-sys-color--outline-variant: @surface1; --gem-sys-color--surface-container-high: @surface0; --gem-sys-color--surface-container-low: lighten(@mantle, 2%); --gem-sys-color--outline: @subtext0; - --gem-sys-color--on-surface-variant: @subtext1; --gem-sys-color--on-primary-container: @text; - --gem-sys-color--primary: @accent-color; - --gem-sys-color--on-surface--rgb: #rgbify(@subtext0) []; - --gem-sys-color--surface-dim--rgb: #rgbify(@crust) []; + --gem-sys-color--on-primary-fixed: darken(@accent, 40%); + --gem-sys-color--on-primary: darken(@accent, 60%); + --gem-sys-color--primary: @accent; + --gem-sys-color--primary-container: fade(@accent, 60%); + --gem-sys-color--on-surface--rgb: #lib.rgbify(@subtext0)[]; + --gem-sys-color--surface-dim--rgb: #lib.rgbify(@crust)[]; + --gem-sys-color--surface-container-highest: @surface0; + --gem-sys-color--primary-fixed: @text; + --gem-sys-color--on-secondary: fade(@accent, 30%); + --gem-sys-color--surface-variant: @surface0; + --gem-sys-color--surface-bright: @surface0; --og-theme-color: @text; - .new-feature { - background: @surface2; - } - .button-pressed { - --bard-color-primary: @mantle; - } .action-icon { + --gem-sys-color--on-primary: @accent; --gem-sys-color--on-surface-variant: @mantle; } - button[mat-flat-button] { - --bard-color-on-primary: @crust; - } .draft-preview-label-chip.selected { color: @crust; } .buttons-container-link-button { color: @crust; } - .link-icon { - --mat-icon-color: @crust; - } .mdc-text-field--outlined:hover:not( - .mdc-text-field--disabled, - .mdc-text-field--focused - ) { - & .mdc-notched-outline__leading, - & .mdc-notched-outline__trailing { + .mdc-text-field--disabled, + .mdc-text-field--focused + ) { + .mdc-notched-outline__leading, + .mdc-notched-outline__trailing { border-color: @text !important; } } @@ -280,16 +228,16 @@ --mat-outlined-button-state-layer-color: @overlay2; } .gmat-mdc-button.mat-mdc-outlined-button:not( - .mat-mdc-button-disabled, - [disabled], - :disabled - ).mdc-ripple-upgraded--background-focused, + .mat-mdc-button-disabled, + [disabled], + :disabled + ).mdc-ripple-upgraded--background-focused, .gmat-mdc-button.mat-mdc-outlined-button:not( - .mat-mdc-button-disabled, - [disabled], - :disabled, - .mdc-ripple-upgraded - ):focus { + .mat-mdc-button-disabled, + [disabled], + :disabled, + .mdc-ripple-upgraded + ):focus { color: @text; } .gmat-mdc-chip { @@ -309,10 +257,6 @@ --mdc-plain-tooltip-container-color: @overlay0; --mdc-plain-tooltip-supporting-text-color: @text; } - .mdc-checkbox { - --mdc-checkbox-selected-icon-color: @accent-color; - --mdc-checkbox-selected-checkmark-color: @crust; - } .mdc-form-field { --mdc-form-field-label-text-color: @text; } @@ -322,14 +266,14 @@ .mdc-dialog__surface { background-color: @base !important; } - .mat-mdc-button-disabled { - --mat-icon-color: rgba(var(--bard-color-on-surface-rgb), 0.38); + .expandable-button:disabled { + color: rgba(var(--gem-sys-color--on-surface--rgb), 0.38); } .mat-mdc-progress-bar { - --mdc-linear-progress-active-indicator-color: @accent-color; - --mdc-linear-progress-track-color: fade(@accent-color, 50%); + --mdc-linear-progress-active-indicator-color: @accent; + --mdc-linear-progress-track-color: fade(@accent, 50%); } - .mdc-list-item__primary-text, + .mdc-list-item, .gmat-mdc-list { --mdc-list-list-item-hover-state-layer-color: @overlay1; --mdc-list-list-item-label-text-color: @text; @@ -337,9 +281,9 @@ --mdc-list-list-item-focus-state-layer-color: @overlay2; } .gmat-mdc-button.mat-mdc-button.mat-primary { - --mdc-text-button-label-text-color: @accent-color; - --mdc-text-button-hover-label-text-color: lighten(@accent-color, 5%); - --mdc-text-button-focus-label-text-color: lighten(@accent-color, 8%); + --mdc-text-button-label-text-color: @accent; + --mdc-text-button-hover-label-text-color: lighten(@accent, 5%); + --mdc-text-button-focus-label-text-color: lighten(@accent, 8%); } .gmat-mdc-button.mat-mdc-button.mat-unthemed { --mat-text-button-state-layer-color: @overlay2; @@ -348,14 +292,14 @@ --mat-icon-button-state-layer-color: @overlay2; } .gmat-mdc-button.mat-mdc-fab:not( - .mat-mdc-button-disabled - ).mat-primary.gmat-mdc-fab-fill { - --mdc-fab-container-color: @accent-color; + .mat-mdc-button-disabled + ).mat-primary.gmat-mdc-fab-fill { + --mdc-fab-container-color: @accent; --mat-fab-foreground-color: @crust; } .gmat-mdc-button.mat-mdc-mini-fab:not( - .mat-mdc-button-disabled - ).mat-primary.gmat-mdc-fab-outline { + .mat-mdc-button-disabled + ).mat-primary.gmat-mdc-fab-outline { --mat-fab-small-state-layer-color: @surface0; } .mat-mdc-fab:not(.mdc-riple-upgraded):focus::before, @@ -365,26 +309,16 @@ .mat-mdc-menu-panel { background-color: @base !important; } - .mat-mdc-tab-group, - .mat-mdc-tab-nav-bar { - --mat-tab-header-inactive-label-text-color: @subtext0; - --mat-tab-header-inactive-hover-label-text-color: @subtext0; - --mat-tab-header-inactive-focus-label-text-color: @subtext0; - } .mat-mdc-fab.mat-accent { --mat-fab-foreground-color: @text; } .xap-count-badge-dot { background-color: @red; } - .experiment-updates-banner-icon { - color: @crust; - } - .banner-close-button { - --mat-icon-color: @crust; - } - & when (@lookup = latte) { - --bard-color-action-tooltip-background: lighten(@accent-color, 30%); + & when (@flavor = latte) { + --gem-sys-color--on-primary-fixed: @accent; + --gem-sys-color--on-primary: @mantle; + --gem-sys-color--primary-fixed: @crust; } [data-mat-icon-name="search"] svg { > path:nth-child(1) { @@ -400,27 +334,26 @@ fill: @red; } } + .google-logo img { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } [src="https://www.gstatic.com/lamda/images/replit_dark_24px_7d0347bf84c2570074db9.svg"], - [src="https://www.gstatic.com/lamda/images/replit_light_24px_3a2ee6003110f3c8460c9.svg"] - { + [src="https://www.gstatic.com/lamda/images/replit_light_24px_3a2ee6003110f3c8460c9.svg"] { @svg: escape( '' ); content: url("data:image/svg+xml,@{svg}"); } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; + /* Gemini Advanced shadows */ + chat-window > div > input-container { + background: unset; + } + input-container::before { + background: unset; + } + } } - -// vim:ft=less diff --git a/styles/google-gemini/preview.webp b/styles/google-gemini/preview.webp deleted file mode 100644 index b54239d376..0000000000 --- a/styles/google-gemini/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:14146df622083c94ad8dfdbb5d7159ef1692aed2deae68481c1366c184d91eee -size 147722 diff --git a/styles/google-photos/README.md b/styles/google-photos/README.md index f8082d3c5d..dfbd953c62 100644 --- a/styles/google-photos/README.md +++ b/styles/google-photos/README.md @@ -10,17 +10,17 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer +## ๐Ÿ’ Current Maintainers - [GenShibe](https://github.com/GenShibe) +- [WalkQuackBack](https://github.com/WalkQuackBack)   diff --git a/styles/google-photos/catppuccin.user.css b/styles/google-photos/catppuccin.user.less similarity index 78% rename from styles/google-photos/catppuccin.user.css rename to styles/google-photos/catppuccin.user.less index 2b23933594..f6245658c9 100644 --- a/styles/google-photos/catppuccin.user.css +++ b/styles/google-photos/catppuccin.user.less @@ -2,8 +2,8 @@ @name Google Photos Catppuccin @namespace github.com/catppuccin/userstyles/styles/google-photos @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/google-photos -@version 0.0.5 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google-photos/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google-photos/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle-photos @description Soothing pastel theme for Google Photos @author Catppuccin @@ -15,840 +15,501 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('photos.google.com') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --pkw-background: @surface0; - --gm3-dialog-refactored-container-color: @base; - --pkw-on-surface-variant: @subtext0; - --pkw-on-surface: @text; - --gm-colortextbutton-ink-color: @blue; - --gm3-sys-color-on-surface-variant: @text; - .gp1Lgf { - --gm3-card-outlined-hover-outline-color: @surface2; - --gm3-card-outlined-container-color: @surface0; - --gm3-card-outlined-outline-color: @surface2; - } - .hIolmc { - --gm3-chip-assist-flat-label-text-color: @text; - --gm3-chip-assist-flat-hover-label-text-color: @accent-color; - --gm3-chip-assist-flat-outline-color: @surface2; - --gm3-sys-color-outline: @surface2; - } - .I2nt9 { - --gm3-text-field-filled-container-color: @surface2; - --gm3-text-field-filled-input-text-color: @text; - --gm3-sys-color-primary: @accent-color; - --gm3-sys-color-on-surface: @text; - --gm3-text-field-filled-caret-color: @accent-color; - --gm3-text-field-filled-label-text-color: @text; - } - /* checkbox */ - --mdc-checkbox-selected-icon-color: @accent-color; - --mdc-checkbox-selected-checkmark-color: @mantle; - --mdc-checkbox-unselected-icon-color: @surface0; - /* radio checkbox/switches */ - .bEtrNb { - --gm3-radio-selected-focus-icon-color: @accent-color; - --gm3-radio-selected-hover-icon-color: @accent-color; - --gm3-radio-selected-icon-color: @accent-color; - --gm3-radio-selected-pressed-icon-color: @accent-color; - --gm3-radio-selected-hover-state-layer-color: @accent-color; - --gm3-radio-unselected-icon-color: @surface0; - --gm3-radio-unselected-hover-icon-color: @surface2; - } - - .OKFoxe { - --gm3-switch-selected-focus-track-color: @accent-color; - --gm3-switch-selected-hover-state-layer-color: @accent-color; - --gm3-switch-selected-track-color: @accent-color; - --gm3-switch-selected-hover-track-color: @accent-color; - --gm3-switch-selected-pressed-state-layer-color: @accent-color; - --gm3-switch-selected-pressed-track-color: @accent-color; - --gm3-switch-selected-hover-handle-color: darken(@accent-color, 20%); - --gm3-switch-selected-pressed-handle-color: darken(@accent-color, 15%); - --gm3-switch-selected-handle-color: darken(@accent-color, 10%); - --gm3-switch-selected-icon-color: @base; - } - /* uploading photo popups */ - .z1QT7e { - --gm3-card-elevated-container-color: @surface0; - } - - /* editing photo sidebar */ - .dm7YTc .FcHdhd { - --gm3-navigation-drawer-coplanar-container-color: @base; - } - - /* loading circle */ - .DMuDh { - --gm3-circular-progress-active-indicator-color: @accent-color; - } - - /* main background */ - .uGCjIb, - .HnzzId, - body { - background-color: @base !important; - color: @text !important; - } - /* uploading photo popups */ - .RUTfA { - background-color: @blue !important; - color: @mantle !important; - } - .uq8qae, - .wgq1ae { - color: @text !important; - } - .BNcPhf { - background-color: @blue !important; - } - /* top bar */ - .QtDoYb { - background-color: @crust; - border-color: @crust; - } - /* search bar in the top bar */ - .Aul2T, - .cI2tlc .jBmls { - background-color: @surface0 !important; - } - .LAL5ie .ZAGvjd { - color: @text; - -webkit-text-fill-color: @text; - } - .cI2tlc .jBmls { - box-shadow: none !important; - } - .l9dCke, - .ggIr1e, - .OmFprf { - border-color: @surface1 !important; - } - .LAL5ie .jBmls { - border-top-color: @surface1; - } - .obNJBf.wH28vf > .lEclge { - color: @text; - } - .obNJBf { - color: @subtext0; - } - /* the word photos in the google photos logo */ - .EIug8e { - color: @text; - } - /* the text in the carousel at the top of the main page */ - .oedbUb { - color: @text; - } - /* date of when the photos were taken */ - .xA0gfb { - color: @subtext1; - } - /* place where photos were taken */ - .LzExud { - color: @subtext0; - } - /* top and sidebar svgs */ - .v1262d, - .gb_Ra.gb_Ja svg { - fill: @text !important; - } - .uprWmb .v1262d { - fill: @mantle !important; - } - /* sidebar */ - .RSjvib { - background-color: @crust; - } - .uprWmb:hover, - .uprWmb { - background: @accent-color !important; - } - .HksvWb, - .HEHjMc { - color: @text; - } - .HEHjMc:hover { - color: @accent-color; - } - - .uprWmb .HksvWb { - color: @mantle !important; - } - .ylKyWb { - color: @subtext0; - } - .lJ21id { - background-color: @surface0; - } - .Olf00, - .J0dufb { - background-color: @accent-color !important; - color: @mantle; - } - /* sidebar slider */ - .bButFf { - background-color: @surface0; - border-bottom-color: @accent-color; - color: @text; - } - /* year when scrolling */ - .HrGXnb { - background-color: @surface0; - color: @text; - } - /* unlock storage discount button */ - .z3RRjd:not(:disabled) { - color: @accent-color; - border-color: @surface0; - } - /* search bar */ - .fXq1Rc:not(.A82uMb) .Aul2T.qs41qe { - background: @surface1; - } - /* storage used bar */ - .XCxRFf { - background-color: @accent-color; - box-shadow: 2px 0 0 lighten(@accent-color, 10%); - } - .DFG23b { - background-color: @overlay0; - } - /* carousel buttons */ - .yhB1zd { - background: @surface0; - } - - /* favorites page */ - .ZEmz6b { - color: @text; - } - - /* albums page */ - /* background */ - .gN5aAe, - .eReC4e { - background-color: @base; - } - /* album title */ - .mfQCM, - .go6nxb, - .MXxZYe, - .NbrDvb, - .mfQCMe { - color: @text; - } - .kmqzh .tL9Q4c { - color: @text; - background-color: @surface0; - } - /* # of photos in album */ - .UV4Xae, - .Me6kjf { - color: @subtext0; - } - /* album date */ - .UmNiJe { - color: @subtext0; - } - /* play highlights button */ - .HQ97kd { - color: @text; - background-color: @base; - } - /* sharing dialog */ - .ju3TMb, - .hUsHhf, - .ex6r4d, - .dqAVOd { - color: @text; - background-color: @surface0; - } - .J2j0Cc.uH98yc { - background-color: @surface2; - } - /* ... menu in album */ - .s2VtY.JPdR6b { - background-color: @surface0; - } - .o7Osof .oJeWuf { - color: @text; - } - /* add to album */ - .Purf9b { - background-color: @base; - } - .Pk50Ic { - background: @accent-color; - } - /* underline on album title */ - .kmqzh .cXrdqd::before, - .kmqzh .cXrdqd::after { - background: @blue !important; - } - - /* favorites page */ - .YzU3ub.Sn08je { - background-color: @surface0; - } - - /* print store */ - .E2jkGc, - .bVnuib, - .D8oEA, - .mKmjtc, - .GVzd9d { - color: @text; - } - /* products */ - .CxyEyc { - background-color: @surface0; - border-color: @surface2; - } - /* photo books and canvases */ - .bYS0Le .p102md { - background-color: @surface0; - border-color: @surface2; - } - .INNc9c, - .fGZ5Db, - .KhXBec { - color: @text; - } - .b9GWRb { - color: @subtext0; - } - - /* explore page */ - .OgirMe, - .dykGZb { - color: @text; - } - /* names under faces */ - .hsohWb { - color: @text; - } - /* text in photos */ - .ydXkjb, - .WABMHe, - .fn6ocf { - color: @text; - } - /* categories inside the footer */ - .QmUPuf { - color: @text; - } - .QkA5Vc:not(:disabled) { - color: @subtext0; - } - - /* cannot connect page */ - .Ih0h6e, - .aPRVsf { - color: @text; - } - /* rety button */ - .RSxr8 { - background-color: darken(@accent-color, 15%); - } - - /* sharing page */ - /* item */ - .I7yCae { - color: @text; - } - .DcsHOb { - border-color: @surface2; - } - /* partner sharing dialog */ - .VfPpkd-P5QLlc, - .I4p4db, - .t1IGPc, - .Co16uf { - background-color: @surface0; - } - .osOuXd:not(.VfPpkd-O1htCb-OWXEXe-OWB6Me) .VfPpkd-TkwUic, - .osOuXd .VfPpkd-YPmvEd { - background-color: @surface2; - } - .V639qd .VfPpkd-cnG4Wd, - .fpyzKd, - .osOuXd:not(.VfPpkd-O1htCb-OWXEXe-OWB6Me) .VfPpkd-uusGie-fmcmS, - .osOuXd.VfPpkd-OkbHre.VfPpkd-rymPhb-Gtdoyb, - .VfPpkd-OkbHre .VfPpkd-rymPhb-fpDzbe-fmcmS, - .jc9Jq, - .Qwsrhf, - .VfPpkd-k2Wrsb { - color: @text; - } - .osOuXd - .VfPpkd-OkbHre.VfPpkd-rymPhb-ibnC6b.VfPpkd-rymPhb-ibnC6b-OWXEXe-gk6SMd { - background-color: @overlay2; - } - /* disabled text */ - .oFJeZc:disabled { - color: @surface2; - } - /* the small arrow in the dropdown box */ - .hqBSCb:not(.VfPpkd-O1htCb-OWXEXe-OWB6Me).VfPpkd-O1htCb-OWXEXe-XpnDCe - .VfPpkd-t08AT-Bz112c { - fill: @accent-color; - } +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; - /* sharing via links subpage */ - /* background */ - .Cv8Rjc { - background-color: @base; - } - /* page title & subtitle */ - .UtdETd, - .wMLcHf { - color: @text; - } - /* date when it was shared */ - .DtcBIe { - color: @subtext1; - } - /* item border */ - .j90Xnb { - border-color: @surface1; - } - - /* settings page */ - /* main text */ - h1, - .fl9QFd, - .CZ5Sfb, - .mSbCD, - .Ecvatc, - .C96I0d, - .HiceN, - .Qizfvf, - .bCPWJc, - .P0eWkf, - .rvEjke, - .IGdgBf, - .Sn08je, - .Ja4Wfd, - .tLNx2, - .x1vyqd, - .CqtWH, - .wbspQd, - .vUbGoc { - color: @text; - } - /* top bar */ - .eReC4e.FbgB9 { - border-color: @surface0; - } - .yNVtPc .ZAGvjd .Ny5lGc::placeholder { - color: @text; - } - /* upload button */ - .s4MBmb { - color: @text; - } - /* automatic album label */ - .ecTDsc { - background-color: @accent-color; - color: @crust; - } - /* subtext */ - .fYwTV, - .rN6Qmb, - .eT2rxc, - .EqBDpe, - .cuFkEd, - .hcClrf, - .o7Osof .HhLEze, - .k4Or1e { - color: @subtext0; - } - /* "view" button links */ - .oFJeZc:not(:disabled) { - color: @accent-color; - } - /* sectional borders */ - .X0f2Ie, - .TYKfpe { - border-color: @surface0 !important; +@-moz-document domain("photos.google.com") { + body { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - /* storage discount button */ - .kDryjd:not(:disabled) { - background-color: @accent-color; - color: @crust; - } - /* selected radial selector */ - .bEtrNb - .VfPpkd-gBXA9-bMcfAe:enabled:checked - + .VfPpkd-RsCWK - .VfPpkd-wVo5xe-LkdAo, - .bEtrNb .VfPpkd-gBXA9-bMcfAe:enabled + .VfPpkd-RsCWK .VfPpkd-Z5TpLc-LkdAo { - border-color: @accent-color; - } - /* unselected radial selector */ - .bEtrNb - .VfPpkd-gBXA9-bMcfAe:enabled:not(:checked) - + .VfPpkd-RsCWK - .VfPpkd-wVo5xe-LkdAo { - border-color: @surface0; - } - /* switch that is in the off position */ - .OKFoxe .VfPpkd-uMhiad::before { - background: @mantle; - } - .OKFoxe:disabled .VfPpkd-l6JLsf::before { - background-color: @surface1 !important; - } - .OKFoxe.VfPpkd-scr2fc-OWXEXe-uqeOfd:disabled .VfPpkd-pafCAf { - fill: @accent-color; - } - /* switch that is in the on position */ - .OKFoxe.VfPpkd-scr2fc-OWXEXe-gk6SMd:enabled .VfPpkd-uMhiad::after { - background-color: @accent-color; - } - .OKFoxe.VfPpkd-scr2fc-OWXEXe-gk6SMd:enabled .VfPpkd-pafCAf { - fill: @mantle; - } - .OKFoxe:enabled .VfPpkd-l6JLsf::after { - background: @surface1; - } - - /* partner sharing */ - .QYw5Ld { - background-color: @accent-color; - border-color: @surface0; - } - - .QYw5Ld span { - color: @crust; - } - - .Sxge7c, - .GkGmge { - color: @text !important; - } - - /* print orders page */ - .fwAVoc { - color: @text; - } - - /* privacy page */ - .UNOf0e, - .bTd6c { - color: @text; - } - /* footer */ - .rniux { - color: @subtext0; - } - - /* slideshow buttons */ - .UPRhTe { - background-color: @base; - } - - /* activity log page */ - /* main backgroound */ - .X67EZe { - background-color: @surface0; - } - /* main text */ - .vLZJlf, - .GiPflf, - .iEGkef { - color: @text; - } - /* type of activity */ - .PDX3vc.LMgvRb { - color: @green; - } - .y03tld .e2CuFe { - border-top-color: @green; - } - /* reached the end */ - .EIkL5b { - color: @subtext0; + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } + } - /* utilities page */ - /* headings */ - .ARSUIf { - color: @text; - } - /* elements */ - .FkWMmd { - color: @text; - } - .lnQi4 { - border-color: @surface2; - } - /* "new" pill thingy idk what to call this lol */ - .Li8WFe { - color: @mantle; - background-color: @accent-color; - } - /* create highlight video subpage */ - .a4dmPd { - border-color: @surface0; - } - .BH0KJc { - color: @text; - } - .z3RRjd:disabled { - color: @subtext0; - } - .IZzwM.bu4MSb { - --gm3-chip-input-without-avatar-label-text-color: @text; - --gm3-chip-input-without-avatar-with-trailing-icon-trailing-icon-color: @text; - background-color: @overlay0; - } + .zKHdkd { + #catppuccin(@lightFlavor); + } - /* trash page */ - .NSzyed { - color: @text; - } + .dm7YTc { + #catppuccin(@darkFlavor); + } - /* storage page */ - .hwDBSe, - .tzFvIf, - .BZXMjd .MrqLTc, - .ZbJY6, - .NKihpc, - .V3WOgd { - color: @text; - } - .gyqWff, - .BZXMjd .chfDde { - color: @subtext0; - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + @inverse-theme: if(@flavor = latte, mocha, latte); + @inverse-accent: @catppuccin[@@inverse-theme][@@accentColor]; + // @color-scheme: if(@flavor = latte, light, dark); // Seems like a bug, this should be `color-scheme` not `@color-scheme`? This variable is not used anywhere else. + + // GM3 base + + @gm3-sys-color-error: @red; + @gm3-sys-color-error-rgb: #lib.rgbify(@gm3-sys-color-error)[]; + @gm3-sys-color-error-container: saturate( + mix(@gm3-sys-color-error, @mantle, 30%), + 20% + ); + @gm3-sys-color-error-container-rgb: #lib.rgbify( + @gm3-sys-color-error-container, + )[]; + + @gm3-sys-color-on-error: saturate( + mix(@gm3-sys-color-error, @base, 20%), + 25% + ); + @gm3-sys-color-on-error-rgb: #lib.rgbify(@gm3-sys-color-on-error)[]; + @gm3-sys-color-on-error-container: saturate( + mix(@gm3-sys-color-error-container, @text, 20%), + 25% + ); + @gm3-sys-color-on-error-container-rgb: #lib.rgbify( + @gm3-sys-color-on-error-container, + )[]; + + @gm3-sys-color-primary: @accent; + @gm3-sys-color-primary-rgb: #lib.rgbify(@gm3-sys-color-primary)[]; + @gm3-sys-color-primary-fixed: lighten(@accent, 5%); + @gm3-sys-color-primary-fixed-rgb: #lib.rgbify( + @gm3-sys-color-primary-fixed, + )[]; + @gm3-sys-color-primary-fixed-dim: darken(@accent, 5%); + @gm3-sys-color-primary-fixed-dim-rgb: #lib.rgbify( + @gm3-sys-color-primary-fixed-dim, + )[]; + + @gm3-sys-color-on-primary: saturate( + mix(@gm3-sys-color-primary, @base, 20%), + 25% + ); + @gm3-sys-color-on-primary-rgb: #lib.rgbify(@gm3-sys-color-on-primary)[]; + @gm3-sys-color-on-primary-fixed: darken(@gm3-sys-color-on-primary, 5%); + @gm3-sys-color-on-primary-fixed-rgb: #lib.rgbify( + @gm3-sys-color-on-primary-fixed, + )[]; + @gm3-sys-color-on-primary-fixed-variant: lighten( + @gm3-sys-color-on-primary, + 5% + ); + @gm3-sys-color-on-primary-fixed-variant-rgb: #lib.rgbify( + @gm3-sys-color-on-primary-fixed-variant, + )[]; + + @gm3-sys-color-primary-container: saturate( + mix(@gm3-sys-color-primary, @mantle, 30%), + 20% + ); + @gm3-sys-color-primary-container-rgb: #lib.rgbify( + @gm3-sys-color-primary-container, + )[]; + @gm3-sys-color-on-primary-container: saturate( + mix(@gm3-sys-color-primary, @text, 20%), + 25% + ); + @gm3-sys-color-on-primary-container-rgb: #lib.rgbify( + @gm3-sys-color-on-primary-container, + )[]; + + @gm3-sys-color-secondary: desaturate(@accent, 20%); + @gm3-sys-color-secondary-rgb: #lib.rgbify(@gm3-sys-color-secondary)[]; + @gm3-sys-color-secondary-fixed: lighten(@gm3-sys-color-secondary, 5%); + @gm3-sys-color-secondary-fixed-rgb: #lib.rgbify( + @gm3-sys-color-secondary-fixed, + )[]; + @gm3-sys-color-secondary-fixed-dim: darken(@gm3-sys-color-secondary, 5%); + @gm3-sys-color-secondary-fixed-dim-rgb: #lib.rgbify( + @gm3-sys-color-secondary-fixed-dim, + )[]; + + @gm3-sys-color-on-secondary: saturate( + mix(@gm3-sys-color-secondary, @base, 20%), + 25% + ); + @gm3-sys-color-on-secondary-rgb: #lib.rgbify(@gm3-sys-color-on-secondary)[]; + @gm3-sys-color-on-secondary-fixed: darken( + @gm3-sys-color-on-secondary, + 5% + ); + @gm3-sys-color-on-secondary-fixed-rgb: #lib.rgbify( + @gm3-sys-color-on-secondary-fixed, + )[]; + @gm3-sys-color-on-secondary-fixed-variant: lighten( + @gm3-sys-color-on-primary, + 5% + ); + @gm3-sys-color-on-secondary-fixed-variant-rgb: #lib.rgbify( + @gm3-sys-color-on-secondary-fixed-variant, + )[]; + + @gm3-sys-color-secondary-container: saturate( + mix(@gm3-sys-color-secondary, @mantle, 35%), + 10% + ); + @gm3-sys-color-secondary-container-rgb: #lib.rgbify( + @gm3-sys-color-secondary-container, + )[]; + @gm3-sys-color-on-secondary-container: saturate( + mix(@gm3-sys-color-secondary, @text, 75%), + 25% + ); + @gm3-sys-color-on-secondary-container-rgb: #lib.rgbify( + @gm3-sys-color-on-secondary-container, + )[]; + + @gm3-sys-color-tertiary: @accent; + @gm3-sys-color-tertiary-rgb: #lib.rgbify(@gm3-sys-color-tertiary)[]; + @gm3-sys-color-tertiary-fixed: lighten(@gm3-sys-color-tertiary, 5%); + @gm3-sys-color-tertiary-fixed-rgb: #lib.rgbify( + @gm3-sys-color-tertiary-fixed, + )[]; + @gm3-sys-color-tertiary-fixed-dim: darken(@gm3-sys-color-tertiary, 5%); + @gm3-sys-color-tertiary-fixed-dim-rgb: #lib.rgbify( + @gm3-sys-color-tertiary-fixed-dim, + )[]; + + @gm3-sys-color-on-tertiary: saturate( + mix(@gm3-sys-color-tertiary, @base, 20%), + 25% + ); + @gm3-sys-color-on-tertiary-rgb: #lib.rgbify(@gm3-sys-color-on-tertiary)[]; + @gm3-sys-color-on-tertiary-fixed: darken(@gm3-sys-color-on-tertiary, 5%); + @gm3-sys-color-on-tertiary-fixed-rgb: #lib.rgbify( + @gm3-sys-color-on-tertiary-fixed, + )[]; + @gm3-sys-color-on-tertiary-fixed-variant: lighten( + @gm3-sys-color-on-tertiary, + 5% + ); + @gm3-sys-color-on-tertiary-fixed-variant-rgb: #lib.rgbify( + @gm3-sys-color-on-tertiary-fixed-variant, + )[]; + + @gm3-sys-color-tertiary-container: saturate( + mix(@gm3-sys-color-tertiary, @mantle, 20%), + 0% + ); + @gm3-sys-color-tertiary-container-rgb: #lib.rgbify( + @gm3-sys-color-tertiary-container, + )[]; + @gm3-sys-color-on-tertiary-container: saturate( + mix(@gm3-sys-color-tertiary-container, @text, 20%), + 25% + ); + @gm3-sys-color-on-tertiary-container-rgb: #lib.rgbify( + @gm3-sys-color-on-tertiary-container, + )[]; + + @gm3-sys-color-background: @base; + @gm3-sys-color-background-rgb: #lib.rgbify(@gm3-sys-color-background)[]; + @gm3-sys-color-on-background: @text; + @gm3-sys-color-on-background-rgb: #lib.rgbify( + @gm3-sys-color-on-background, + )[]; + + @gm3-sys-color-surface: @base; + @gm3-sys-color-surface-rgb: #lib.rgbify(@gm3-sys-color-surface)[]; + @gm3-sys-color-surface-bright: @surface0; + @gm3-sys-color-surface-bright-rgb: #lib.rgbify( + @gm3-sys-color-surface-bright, + )[]; + @gm3-sys-color-surface-dim: @crust; + @gm3-sys-color-surface-dim-rgb: #lib.rgbify(@gm3-sys-color-surface-dim)[]; + @gm3-sys-color-surface-variant: mix(@mantle, @accent, 87.5%); + @gm3-sys-color-surface-variant-rgb: #lib.rgbify( + @gm3-sys-color-surface-variant, + )[]; + @gm3-sys-color-surface-tint: @accent; + @gm3-sys-color-surface-tint-rgb: #lib.rgbify(@gm3-sys-color-surface-tint)[]; + + @gm3-sys-color-on-surface: @text; + @gm3-sys-color-on-surface-rgb: #lib.rgbify(@gm3-sys-color-on-surface)[]; + @gm3-sys-color-on-surface-variant: @subtext0; + @gm3-sys-color-on-surface-variant-rgb: #lib.rgbify( + @gm3-sys-color-on-surface-variant, + )[]; + + @gm3-sys-color-inverse-surface: @text; + @gm3-sys-color-inverse-surface-rgb: #lib.rgbify( + @gm3-sys-color-inverse-surface, + )[]; + @gm3-sys-color-inverse-on-surface: @mantle; + @gm3-sys-color-inverse-on-surface-rgb: #lib.rgbify( + @gm3-sys-color-inverse-on-surface, + )[]; + @gm3-sys-color-inverse-primary: @inverse-accent; + @gm3-sys-color-inverse-primary-rgb: #lib.rgbify( + @gm3-sys-color-inverse-primary, + )[]; + + @gm3-sys-color-surface-container-highest: @surface1; + @gm3-sys-color-surface-container-highest-rgb: #lib.rgbify( + @gm3-sys-color-surface-container-highest, + )[]; + @gm3-sys-color-surface-container-high: @surface0; + @gm3-sys-color-surface-container-high-rgb: #lib.rgbify( + @gm3-sys-color-surface-container-high, + )[]; + @gm3-sys-color-surface-container: @surface0; + @gm3-sys-color-surface-container-rgb: #lib.rgbify( + @gm3-sys-color-surface-container, + )[]; + @gm3-sys-color-surface-container-low: @mantle; + @gm3-sys-color-surface-container-low-rgb: #lib.rgbify( + @gm3-sys-color-surface-container-low, + )[]; + @gm3-sys-color-surface-container-lowest: @crust; + @gm3-sys-color-surface-container-lowest-rgb: #lib.rgbify( + @gm3-sys-color-surface-container-lowest, + )[]; + + @gm3-sys-color-outline: @overlay2; + @gm3-sys-color-outline-rgb: #lib.rgbify(@gm3-sys-color-outline)[]; + @gm3-sys-color-outline-variant: @overlay0; + @gm3-sys-color-outline-variant-rgb: #lib.rgbify( + @gm3-sys-color-outline-variant, + )[]; + + @gm3-sys-color-scrim: #000; + @gm3-sys-color-scrim-rgb: #lib.rgbify(@gm3-sys-color-scrim)[]; + @gm3-sys-color-shadow: #000; + @gm3-sys-color-shadow-rgb: #lib.rgbify(@gm3-sys-color-shadow)[]; + + --gm3-sys-color-background: @gm3-sys-color-background; + --gm3-sys-color-background-rgb: @gm3-sys-color-background-rgb; + --gm3-sys-color-error: @gm3-sys-color-error; + --gm3-sys-color-error-rgb: @gm3-sys-color-error-rgb; + --gm3-sys-color-error-container: @gm3-sys-color-error-container; + --gm3-sys-color-error-container-rgb: @gm3-sys-color-error-container-rgb; + --gm3-sys-color-inverse-on-surface: @gm3-sys-color-inverse-on-surface; + --gm3-sys-color-inverse-on-surface-rgb: @gm3-sys-color-inverse-on-surface-rgb; + --gm3-sys-color-inverse-primary: @gm3-sys-color-inverse-primary; + --gm3-sys-color-inverse-primary-rgb: @gm3-sys-color-inverse-primary-rgb; + --gm3-sys-color-inverse-surface: @gm3-sys-color-inverse-surface; + --gm3-sys-color-inverse-surface-rgb: @gm3-sys-color-inverse-surface-rgb; + --gm3-sys-color-on-background: @gm3-sys-color-on-background; + --gm3-sys-color-on-background-rgb: @gm3-sys-color-on-background-rgb; + --gm3-sys-color-on-error: @gm3-sys-color-on-error; + --gm3-sys-color-on-error-rgb: @gm3-sys-color-on-error-rgb; + --gm3-sys-color-on-error-container: @gm3-sys-color-on-error-container; + --gm3-sys-color-on-error-container-rgb: @gm3-sys-color-on-error-container-rgb; + --gm3-sys-color-on-primary: @gm3-sys-color-on-primary; + --gm3-sys-color-on-primary-rgb: @gm3-sys-color-on-primary-rgb; + --gm3-sys-color-on-primary-container: @gm3-sys-color-on-primary-container; + --gm3-sys-color-on-primary-container-rgb: @gm3-sys-color-on-primary-container-rgb; + --gm3-sys-color-on-primary-fixed: @gm3-sys-color-on-primary-fixed; + --gm3-sys-color-on-primary-fixed-rgb: @gm3-sys-color-on-primary-fixed-rgb; + --gm3-sys-color-on-primary-fixed-variant: @gm3-sys-color-on-primary-fixed-variant; + --gm3-sys-color-on-primary-fixed-variant-rgb: @gm3-sys-color-on-primary-fixed-variant-rgb; + --gm3-sys-color-on-secondary: @gm3-sys-color-on-secondary; + --gm3-sys-color-on-secondary-rgb: @gm3-sys-color-on-secondary-rgb; + --gm3-sys-color-on-secondary-container: @gm3-sys-color-on-secondary-container; + --gm3-sys-color-on-secondary-container-rgb: @gm3-sys-color-on-secondary-container-rgb; + --gm3-sys-color-on-secondary-fixed: @gm3-sys-color-on-secondary-fixed; + --gm3-sys-color-on-secondary-fixed-rgb: @gm3-sys-color-on-secondary-fixed-rgb; + --gm3-sys-color-on-secondary-fixed-variant: @gm3-sys-color-on-secondary-fixed-variant; + --gm3-sys-color-on-secondary-fixed-variant-rgb: @gm3-sys-color-on-secondary-fixed-variant-rgb; + --gm3-sys-color-on-surface: @gm3-sys-color-on-surface; + --gm3-sys-color-on-surface-rgb: @gm3-sys-color-on-surface-rgb; + --gm3-sys-color-on-surface-variant: @gm3-sys-color-on-surface-variant; + --gm3-sys-color-on-surface-variant-rgb: @gm3-sys-color-on-surface-variant-rgb; + --gm3-sys-color-on-tertiary: @gm3-sys-color-on-tertiary; + --gm3-sys-color-on-tertiary-rgb: @gm3-sys-color-on-tertiary-rgb; + --gm3-sys-color-on-tertiary-container: @gm3-sys-color-on-tertiary-container; + --gm3-sys-color-on-tertiary-container-rgb: @gm3-sys-color-on-tertiary-container-rgb; + --gm3-sys-color-on-tertiary-fixed: @gm3-sys-color-on-tertiary-fixed; + --gm3-sys-color-on-tertiary-fixed-rgb: @gm3-sys-color-on-tertiary-fixed-rgb; + --gm3-sys-color-on-tertiary-fixed-variant: @gm3-sys-color-on-tertiary-fixed-variant; + --gm3-sys-color-on-tertiary-fixed-variant-rgb: @gm3-sys-color-on-tertiary-fixed-variant-rgb; + --gm3-sys-color-outline: @gm3-sys-color-outline; + --gm3-sys-color-outline-rgb: @gm3-sys-color-outline-rgb; + --gm3-sys-color-outline-variant: @gm3-sys-color-outline-variant; + --gm3-sys-color-outline-variant-rgb: @gm3-sys-color-outline-variant-rgb; + --gm3-sys-color-primary: @gm3-sys-color-primary; + --gm3-sys-color-primary-rgb: @gm3-sys-color-primary-rgb; + --gm3-sys-color-primary-container: @gm3-sys-color-primary-container; + --gm3-sys-color-primary-container-rgb: @gm3-sys-color-primary-container-rgb; + --gm3-sys-color-primary-fixed: @gm3-sys-color-primary-fixed; + --gm3-sys-color-primary-fixed-rgb: @gm3-sys-color-primary-fixed-rgb; + --gm3-sys-color-primary-fixed-dim: @gm3-sys-color-primary-fixed-dim; + --gm3-sys-color-primary-fixed-dim-rgb: @gm3-sys-color-primary-fixed-dim-rgb; + --gm3-sys-color-scrim: @gm3-sys-color-scrim; + --gm3-sys-color-scrim-rgb: @gm3-sys-color-scrim-rgb; + --gm3-sys-color-secondary: @gm3-sys-color-secondary; + --gm3-sys-color-secondary-rgb: @gm3-sys-color-secondary-rgb; + --gm3-sys-color-secondary-container: @gm3-sys-color-secondary-container; + --gm3-sys-color-secondary-container-rgb: @gm3-sys-color-secondary-container-rgb; + --gm3-sys-color-secondary-fixed: @gm3-sys-color-secondary-fixed; + --gm3-sys-color-secondary-fixed-rgb: @gm3-sys-color-secondary-fixed-rgb; + --gm3-sys-color-secondary-fixed-dim: @gm3-sys-color-secondary-fixed-dim; + --gm3-sys-color-secondary-fixed-dim-rgb: @gm3-sys-color-secondary-fixed-dim-rgb; + --gm3-sys-color-shadow: @gm3-sys-color-shadow; + --gm3-sys-color-shadow-rgb: @gm3-sys-color-shadow-rgb; + --gm3-sys-color-surface: @gm3-sys-color-surface; + --gm3-sys-color-surface-rgb: @gm3-sys-color-surface-rgb; + --gm3-sys-color-surface-bright: @gm3-sys-color-surface-bright; + --gm3-sys-color-surface-bright-rgb: @gm3-sys-color-surface-bright-rgb; + --gm3-sys-color-surface-container: @gm3-sys-color-surface-container; + --gm3-sys-color-surface-container-rgb: @gm3-sys-color-surface-container-rgb; + --gm3-sys-color-surface-container-high: @gm3-sys-color-surface-container-high; + --gm3-sys-color-surface-container-high-rgb: @gm3-sys-color-surface-container-high-rgb; + --gm3-sys-color-surface-container-highest: @gm3-sys-color-surface-container-highest; + --gm3-sys-color-surface-container-highest-rgb: @gm3-sys-color-surface-container-highest-rgb; + --gm3-sys-color-surface-container-low: @gm3-sys-color-surface-container-low; + --gm3-sys-color-surface-container-low-rgb: @gm3-sys-color-surface-container-low-rgb; + --gm3-sys-color-surface-container-lowest: @gm3-sys-color-surface-container-lowest; + --gm3-sys-color-surface-container-lowest-rgb: @gm3-sys-color-surface-container-lowest-rgb; + --gm3-sys-color-surface-dim: @gm3-sys-color-surface-dim; + --gm3-sys-color-surface-dim-rgb: @gm3-sys-color-surface-dim-rgb; + --gm3-sys-color-surface-tint: @gm3-sys-color-surface-tint; + --gm3-sys-color-surface-tint-rgb: @gm3-sys-color-surface-tint-rgb; + --gm3-sys-color-surface-variant: @gm3-sys-color-surface-variant; + --gm3-sys-color-surface-variant-rgb: @gm3-sys-color-surface-variant-rgb; + --gm3-sys-color-tertiary: @gm3-sys-color-tertiary; + --gm3-sys-color-tertiary-rgb: @gm3-sys-color-tertiary-rgb; + --gm3-sys-color-tertiary-container: @gm3-sys-color-tertiary-container; + --gm3-sys-color-tertiary-container-rgb: @gm3-sys-color-tertiary-container-rgb; + --gm3-sys-color-tertiary-fixed: @gm3-sys-color-tertiary-fixed; + --gm3-sys-color-tertiary-fixed-rgb: @gm3-sys-color-tertiary-fixed-rgb; + --gm3-sys-color-tertiary-fixed-dim: @gm3-sys-color-tertiary-fixed-dim; + --gm3-sys-color-tertiary-fixed-dim-rgb: @gm3-sys-color-tertiary-fixed-dim-rgb; + --mdc-ripple-color: var(--gm3-sys-color-primary); + + // GM3 Photos + + @gm3-sys-color-caution: @yellow; + @gm3-sys-color-caution-rgb: #lib.rgbify(@gm3-sys-color-caution)[]; + @gm3-sys-color-on-caution: saturate( + mix(@gm3-sys-color-caution, @base, 20%), + 25% + ); + @gm3-sys-color-on-caution-rgb: #lib.rgbify(@gm3-sys-color-on-caution)[]; + @gm3-sys-color-caution-container: saturate( + mix(@gm3-sys-color-caution, @mantle, 30%), + 20% + ); + @gm3-sys-color-caution-container-rgb: #lib.rgbify( + @gm3-sys-color-caution-container, + )[]; + @gm3-sys-color-on-caution-container: saturate( + mix(@gm3-sys-color-caution-container, @text, 20%), + 25% + ); + @gm3-sys-color-on-caution-container-rgb: #lib.rgbify( + @gm3-sys-color-on-caution-container, + )[]; + @gm3-sys-color-storage-meter-normal-primary: @blue; + @gm3-sys-color-storage-meter-normal-primary-rgb: #lib.rgbify( + @gm3-sys-color-storage-meter-normal-primary, + )[]; + @gm3-sys-color-storage-meter-normal-secondary: lighten( + spin(@blue, -20deg), + 10% + ); + @gm3-sys-color-storage-meter-normal-secondary-rgb: #lib.rgbify( + @gm3-sys-color-storage-meter-normal-secondary, + )[]; + @gm3-sys-color-storage-meter-caution-primary: saturate( + darken(@yellow, 10%), + 10% + ); + @gm3-sys-color-storage-meter-caution-primary-rgb: #lib.rgbify( + @gm3-sys-color-storage-meter-caution-primary, + )[]; + @gm3-sys-color-storage-meter-caution-secondary: @yellow; + @gm3-sys-color-storage-meter-caution-secondary-rgb: #lib.rgbify( + @gm3-sys-color-storage-meter-caution-secondary, + )[]; + @gm3-sys-color-storage-meter-warning-primary: saturate( + darken(@red, 10%), + 10% + ); + @gm3-sys-color-storage-meter-warning-primary-rgb: #lib.rgbify( + @gm3-sys-color-storage-meter-warning-primary, + )[]; + @gm3-sys-color-storage-meter-warning-secondary: @red; + @gm3-sys-color-storage-meter-warning-secondary-rgb: #lib.rgbify( + @gm3-sys-color-storage-meter-warning-secondary, + )[]; + @gm3-sys-color-on-scrim: #fff; + @gm3-sys-color-on-scrim-rgb: #lib.rgbify(@gm3-sys-color-on-scrim)[]; + @gm3-sys-color-lights-out-background: #000; + @gm3-sys-color-lights-out-background-rgb: #lib.rgbify( + @gm3-sys-color-lights-out-background, + )[]; + @gm3-sys-color-gems-main: @blue; + @gm3-sys-color-gems-main-rgb: #lib.rgbify(@gm3-sys-color-gems-main)[]; + @gm3-sys-color-gems-muted: @sapphire; + @gm3-sys-color-gems-muted-rgb: #lib.rgbify(@gm3-sys-color-gems-muted)[]; + @gm3-sys-color-gems-analog: @lavender; + @gm3-sys-color-gems-analog-rgb: #lib.rgbify(@gm3-sys-color-gems-analog)[]; + @gm3-sys-color-gems-complement: @peach; + @gm3-sys-color-gems-complement-rgb: #lib.rgbify( + @gm3-sys-color-gems-complement, + )[]; + @gm3-sys-color-twitter: @text; + @gm3-sys-color-twitter-rgb: #lib.rgbify(@gm3-sys-color-twitter)[]; + + --gm3-sys-color-caution: @gm3-sys-color-caution; + --gm3-sys-color-caution-rgb: @gm3-sys-color-caution-rgb; + --gm3-sys-color-on-caution: @gm3-sys-color-on-caution; + --gm3-sys-color-on-caution-rgb: @gm3-sys-color-on-caution-rgb; + --gm3-sys-color-caution-container: @gm3-sys-color-caution-container; + --gm3-sys-color-caution-container-rgb: @gm3-sys-color-caution-container-rgb; + --gm3-sys-color-on-caution-container: @gm3-sys-color-on-caution-container; + --gm3-sys-color-on-caution-container-rgb: @gm3-sys-color-on-caution-container-rgb; + --gm3-sys-color-storage-meter-normal-primary: @gm3-sys-color-storage-meter-normal-primary; + --gm3-sys-color-storage-meter-normal-primary-rgb: @gm3-sys-color-storage-meter-normal-primary-rgb; + --gm3-sys-color-storage-meter-normal-secondary: @gm3-sys-color-storage-meter-normal-secondary; + --gm3-sys-color-storage-meter-normal-secondary-rgb: @gm3-sys-color-storage-meter-normal-secondary-rgb; + --gm3-sys-color-storage-meter-caution-primary: @gm3-sys-color-storage-meter-caution-primary; + --gm3-sys-color-storage-meter-caution-primary-rgb: @gm3-sys-color-storage-meter-caution-primary-rgb; + --gm3-sys-color-storage-meter-caution-secondary: @gm3-sys-color-storage-meter-caution-secondary; + --gm3-sys-color-storage-meter-caution-secondary-rgb: @gm3-sys-color-storage-meter-caution-secondary-rgb; + --gm3-sys-color-storage-meter-warning-primary: @gm3-sys-color-storage-meter-warning-primary; + --gm3-sys-color-storage-meter-warning-primary-rgb: @gm3-sys-color-storage-meter-warning-primary-rgb; + --gm3-sys-color-storage-meter-warning-secondary: @gm3-sys-color-storage-meter-warning-secondary; + --gm3-sys-color-storage-meter-warning-secondary-rgb: @gm3-sys-color-storage-meter-warning-secondary-rgb; + --gm3-sys-color-on-scrim: @gm3-sys-color-on-scrim; + --gm3-sys-color-on-scrim-rgb: @gm3-sys-color-on-scrim-rgb; + --gm3-sys-color-lights-out-background: @gm3-sys-color-lights-out-background; + --gm3-sys-color-lights-out-background-rgb: @gm3-sys-color-lights-out-background-rgb; + --gm3-sys-color-gems-main: @gm3-sys-color-gems-main; + --gm3-sys-color-gems-main-rgb: @gm3-sys-color-gems-main-rgb; + --gm3-sys-color-gems-muted: @gm3-sys-color-gems-muted; + --gm3-sys-color-gems-muted-rgb: @gm3-sys-color-gems-muted-rgb; + --gm3-sys-color-gems-analog: @gm3-sys-color-gems-analog; + --gm3-sys-color-gems-analog-rgb: @gm3-sys-color-gems-analog-rgb; + --gm3-sys-color-gems-complement: @gm3-sys-color-gems-complement; + --gm3-sys-color-gems-complement-rgb: @gm3-sys-color-gems-complement-rgb; + --gm3-sys-color-twitter: @gm3-sys-color-twitter; + --gm3-sys-color-twitter-rgb: @gm3-sys-color-twitter-rgb; - /* how much storage is used bar */ - .O4tDGf:nth-of-type(1), - .vN9JEc:nth-of-type(1) > .ZbKZ3d { - background-color: @accent-color; - } - .O4tDGf:nth-of-type(2), - .vN9JEc:nth-of-type(2) > .ZbKZ3d { - background-color: lighten(@accent-color, 15%); - } - .yVr0Vb { - background-color: @overlay0; - } /* google 1 more storage border */ .BZXMjd.mPxwXe { - background-image: conic-gradient(@surface0, @surface0), + background-image: conic-gradient( - from 2deg, - @peach 0deg, - @peach 90deg, - @green 90deg, - @green 180deg, - @blue 180deg, - @blue 270deg, - @red 270deg, - @red 1turn + var(--gm3-sys-color-background), + var(--gm3-sys-color-background) ), - linear-gradient(@surface2, @surface2); - } - /* review and delete */ - .nfTM4e, - .UKzvpf .ASWyTc, - .TTlRAe .oevqcc { - color: @text; - } - .UKzvpf .YvjW7c { - color: @subtext0; - } - .UKzvpf:not(:last-child) .e0CX4d::after { - background-color: @overlay0; - } - .KVhwqd .TTlRAe .e0CX4d, - .TTlRAe:not(:last-child) .e0CX4d { - border-color: @overlay0; - } - - /* photo editing sidebar */ - .gmtNPe { - background-color: @surface0; - } - .bYXAhf, - .hGASzd, - .YFLDdf, - .QEQULc { - color: @text; - } - .dm7YTc .kDryjd:disabled { - color: fade(@text, 35%); - background-color: fade(@base, 40%); - } - .ALaST { - border-color: @surface0; - } - /* cropping tol */ - .j1AIcc { - background-color: @surface0; - } - .TERVqe { - background-color: @mantle; - } - /* effect sliders */ - .dm7YTc .fEUJ5b .dCWhBf, - .dm7YTc .fEUJ5b .R4GWv, - .dm7YTc .fEUJ5b.qoCZef .dCWhBf, - .dm7YTc .fEUJ5b.qoCZef .R4GWv, - .dm7YTc .fEUJ5b.qs41qe .dCWhBf, - .dm7YTc .fEUJ5b.qs41qe .R4GWv, - .dm7YTc .fEUJ5b .bBKqme { - background-color: @accent-color; - } - /* filters tool */ - .XlI4Ne { - color: @text; - } - /* pen tool */ - .W3FYdb { - background-color: @surface0; - } - /* photo info */ - .Q77Pt { - background-color: @base; - } - .WUbige { - color: @text; - } - .wiOkb, - .R9U8ab, - .x1LMef { - color: @text; - } - .JzSi2b, - .oBMhZb { - color: @subtext0; - } - .KefOhc { - border-bottom-color: @surface0; - } - /* editing date/location */ - .rrk4We:not(.VfPpkd-fmcmS-yrriRe-OWXEXe-OWB6Me), - .sGhbA, - .LAL5ie .jBmls, - .VfPpkd-fmcmS-OyKIhb::after { - background-color: @surface2; - } - .oMg70c:not(.VfPpkd-fmcmS-yrriRe-OWXEXe-OWB6Me) .VfPpkd-NLUYnc-V67aGc, - .oMg70c:not(.VfPpkd-fmcmS-yrriRe-OWXEXe-OWB6Me) - .VfPpkd-NLUYnc-V67aGc-OWXEXe-TATcMc-KLRBe, - .oMg70c:not(.VfPpkd-fmcmS-yrriRe-OWXEXe-OWB6Me) .VfPpkd-fmcmS-wGMbrd, - .sGhbA, - .osOuXd:not(.VfPpkd-O1htCb-OWXEXe-OWB6Me) - .VfPpkd-NLUYnc-V67aGc-OWXEXe-TATcMc-KLRBe, - .BnQsec, - .mplJGb { - color: @text; - } - .osOuXd:not(.VfPpkd-O1htCb-OWXEXe-OWB6Me) .VfPpkd-RWgCYc-ksKsZd::after { - border-color: @accent-color; - } - .ddaf0 .qggZ5d .d1dlne::after { - background-color: @accent-color; - } - .pRVpNc { - color: @subtext0; - } - - /* unsupported videos page */ - /* video title & amount of vid selected */ - .nTuy2b, - .dSfdaf, - .rtExYb { - color: @text; - } - /* date & size of vid */ - .iKLDRc { - color: @subtext0; - } - /* selected video backgrounc */ - .s67Ibf.UYcdu { - background: fade(@accent-color, 40%); - } - - /* skipped suggestions page */ - /* suggestion background */ - .AbQ7md { - background: @surface0; - border-color: @surface2; - } - /* date of suggestion */ - .Vy0KAc { - color: @text; - } - - a { - color: @blue; - } - - .ATUW8c { - box-shadow: 0 0 0 1px var(--pkw-outline, (@surface2)) inset; + conic-gradient( + from 2deg, + @yellow 0deg, + @yellow 90deg, + @green 90deg, + @green 180deg, + @blue 180deg, + @blue 270deg, + @red 270deg, + @red 1turn + ), + linear-gradient( + var(--gm3-sys-color-outline-variant,), + var(--gm3-sys-color-outline-variant,) + ); } - // google 1 icon + // google one icon .BZXMjd.mPxwXe .oXxEid { @svg: escape( '' @@ -856,7 +517,7 @@ background-image: url("data:image/svg+xml,@{svg}") !important; } - //google logo + // google logo .UDKXKd, .uuRyud { @svg: escape( @@ -872,7 +533,7 @@ ); background-image: url("data:image/svg+xml,@{svg}") !important; - & when (@lookup =latte) { + & when (@flavor = latte) { @svg: escape( '' ); @@ -880,14 +541,14 @@ } } - //google play install button + // google play install button .Od6mvf { @svg: escape( '' ); background-image: url("data:image/svg+xml,@{svg}") !important; - & when (@lookup =latte) { + & when (@flavor = latte) { @svg: escape( '' ); @@ -906,12 +567,12 @@ // favorites image .ryy2Zd { @svg: escape( - '' + '' ); background-image: url("data:image/svg+xml,@{svg}") !important; } - //album image + // album image .AAF8rf { @svg: escape( '' @@ -919,7 +580,7 @@ background-image: url("data:image/svg+xml,@{svg}") !important; } - //archive image + // archive image .ZgMovb { @svg: escape( '' @@ -934,7 +595,7 @@ ); background-image: url("data:image/svg+xml,@{svg}") !important; - & when (@lookup =latte) { + & when (@flavor = latte) { @svg: escape( '' ); @@ -942,14 +603,14 @@ } } - //app download page image + // app download page image .TN5Asf { @svg: escape( '' ); background-image: url("data:image/svg+xml,@{svg}") !important; - & when (@lookup =latte) { + & when (@flavor = latte) { @svg: escape( '' ); @@ -957,13 +618,13 @@ } } - //google shield icon + // google shield icon .SAdUce { @svg: escape( '' ); background-image: url("data:image/svg+xml,@{svg}") !important; - & when (@lookup =latte) { + & when (@flavor = latte) { @svg: escape( '' ); @@ -971,7 +632,7 @@ } } - //trash icon + // trash icon .bR1LEf { @svg: escape( '' @@ -995,13 +656,8 @@ background-image: url("data:image/svg+xml,@{svg}") !important; } } -} -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} -// vim:ft=less + a { + color: var(--gm3-sys-color-primary); + } +} diff --git a/styles/google-photos/preview.webp b/styles/google-photos/preview.webp deleted file mode 100644 index a62a540b82..0000000000 --- a/styles/google-photos/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:8f7715dbbe9c5f5ef6c705ce514417c976303b0ef1ae2fa26f3be3692de8f065 -size 135204 diff --git a/styles/google/README.md b/styles/google/README.md index dfe36c12fa..b3bbf1dc9e 100644 --- a/styles/google/README.md +++ b/styles/google/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer -- [GitMuslim](https://github.com/GitMuslim) +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find!   diff --git a/styles/google/catppuccin.user.css b/styles/google/catppuccin.user.less similarity index 66% rename from styles/google/catppuccin.user.css rename to styles/google/catppuccin.user.less index ada555dd94..a4c80bdc5d 100644 --- a/styles/google/catppuccin.user.css +++ b/styles/google/catppuccin.user.less @@ -2,8 +2,8 @@ @name Google Catppuccin @namespace github.com/catppuccin/userstyles/styles/google @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/google -@version 0.2.7 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/google/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agoogle @description Soothing pastel theme for Google @author Catppuccin @@ -15,63 +15,27 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document regexp("^https?://(www\\.|images\\.)?google\\..*") -{ - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document regexp("^https?://(www\\.|images\\.)?google\\..*") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + // Unset color-scheme from `#lib.defaults()`. iframe { color-scheme: none !important; } - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - &, body { background: @base !important; @@ -86,14 +50,20 @@ --uv-styles-color-icon-on-secondary: @subtext0; --uv-styles-color-on-tertiary: @text; --uv-styles-color-icon-on-tertiary: @text; + --uv-styles-color-scrim: fade(@crust, 75%); + --uv-styles-color-on-scrim: @text; + --uv-styles-color-icon-on-scrim: @text; --xhUGwc: @base; --bbQxAb: @text; --IXoxUe: @subtext0; --COEmY: @text; --YLNNHc: @text; + --JKqx2: @blue; --gS5jXb: @surface0; + --mXZkqc: @surface0; --EpFNW: @mantle; --XKMDxc: @mantle; + --TSWZIb: @mantle; --tefdc5886c2f04483: @text; --te8f1ea4d4928be48: @text !important; --ta884a309a24f44f4: @subtext0 !important; @@ -103,7 +73,7 @@ --t7d1a3050c2c1c0a5: @text !important; --t6a0469853a1a02c1: @text !important; --t5feec22832a0fdd6: @surface0 !important; - --t342c96645d13ae13: @accent-color !important; + --t342c96645d13ae13: @accent !important; --t6c7325fca9d536d4: @text !important; --tf7148cf5018d5074: @text !important; --t9ab8d922307d428d: @text; @@ -146,10 +116,10 @@ } .VfPpkd-StrnGf-rymPhb-f7MjDc, .VfPpkd-qPzbhe-JNdkSc-Bz112c { - color: @accent-color !important; + color: @accent !important; } .EL3pcf { - color: @accent-color !important; + color: @accent !important; } .bVfPpkd-StrnGf-rymPhb, .DMZ54e { @@ -175,19 +145,125 @@ background-color: @mantle !important; } .VfPpkd-cTi5dd { - color: @accent-color !important; + color: @accent !important; } /* news column thingymaboober idk what it's actually called, but it's like these columns of news headlines so yeah */ - .z7T1i, .nEklgc { background-color: @surface0; } - .rbYSKb { - color: @subtext0; + .JJZKK.Wui1sd { + border-color: @surface0; } - .FuOudf { + .rbYSKb, + .FuOudf, + .GI74Re { color: @subtext0; } + /* widgets */ + /* timer */ + .pMz3A, + .qhXOwb, + .yrvNxb .pv60Cd, + .LPl7kb .pv60Cd, + .Q7q8pf .pv60Cd { + background-color: @mantle !important; + } + + /* color picker */ + .P2c8Dd { + background-color: @base; + } + + .R9RxHd { + border-color: @surface0; + } + + /* unit converter */ + .LNn04b { + background-color: @mantle; + color: @text !important; + border-color: @surface0; + } + + .vXQmIe, + .vk_c { + color: @text !important; + border-color: @surface0 !important; + } + + .NIzGle { + background-color: @yellow; + color: @crust; + } + + /* periodic table */ + .DJ3Gm { + background-color: @peach; + color: @crust; + } + + .nA1S9d { + background-color: @mauve; + color: @crust; + } + + .qY66Od { + background-color: @blue; + color: @crust; + } + + .IJR6Te { + background-color: @sky; + color: @crust; + } + + .asrVsb { + background-color: @surface0; + } + + .VCIyZb { + background-color: @red; + color: @crust; + } + + .QRbwTb { + background-color: @teal; + color: @crust; + } + + .tASb2d { + background-color: darken(@red, 5%); + color: @crust; + } + + .Fm9Me { + background-color: @yellow; + color: @crust; + } + + .wo1y7c { + background-color: @green; + color: @crust; + } + + /* search bar right beneath websites */ + .YbqTTb, + g-flat-button.BwMo1 { + background-color: @base; + border-color: @surface0; + } + + .YbqTTb:focus { + border-color: @accent; + } + + /* some play buttons on games */ + .fxvhbc, + .pGGGle { + background-color: @accent; + color: @crust; + } + /* calculator senpai~ */ .zRQJhd { background-color: @base !important; @@ -250,6 +326,39 @@ border-color: @overlay0; } } + /* more button */ + .CybWFf { + background-color: @surface0; + } + .Lu57id { + color: @subtext0; + } + /* live sports */ + .Wrsj9b, + .ofy7ae, + .PPjCfd, + .lr-imso-fix { + background-color: @accent !important; + color: @crust !important; + } + + .liveresults-sports-immersive__match-grid-bottom-border, + .liveresults-sports-immersive__match-grid-right-border, + .YENodc { + border-color: @surface0; + } + + .liveresults-sports-immersive__match-tile:hover, + .KAIX8d:hover, + .kwbMAe { + background-color: @surface0; + } + + .imspo_mt__dt-t, + .imspo_mt__pm-infc, + .GOsQPe { + color: @text !important; + } /* knowoledge panel uwu */ .H73aad { &, @@ -301,7 +410,7 @@ } .PGbOqf { - background-color: @accent-color; + background-color: @accent; } .yAbdSd { @@ -480,11 +589,19 @@ /* End of AI search */ - /* "People also search for.." section */ - .vIifob { + /* "People also search for.." / "People also ask" section */ + .vIifob, + .p8Jhnd { background-color: @surface0 !important; } + .vBnbff, + .RSWv0c.NaC7Cf, + .RSWv0c.NaC7Cf .q8U8x > div:nth-child(1) { + background-color: @surface0 !important; + color: @text !important; + } + .DxHbyd { background-color: @surface2 !important; } @@ -493,15 +610,83 @@ color: @text !important; } + /* mobile ui */ + /* header background & search bar */ + .v6U7rf { + background-color: @base; + } + + .zGVn2e, + .u4frDf { + background: @surface0 !important; + } + + /* search suggestions */ + .K4VNlb, + .Sl6fgd.A7Yvie, + .Sl6fgd .zGVn2e, + .UUbT9 { + background-color: @surface0; + border-color: @surface0 !important; + } + .sb43 { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + /* text */ + .SAuUUd-z5C9Gb-fmcmS, + .tJaMb, + .TElO2c, + .cQp1Ab { + color: @text !important; + } + + .s49v2 { + b, + span { + color: @text !important; + } + } + + .ob9lvb { + color: @subtext0; + } + + /* borders */ + .Dgr5Hb, + .GqbEwc { + border-color: @surface0 !important; + } + + #gsr { + background-color: @mantle; + } + + .Ww4FFb { + box-shadow: 0 0 0 1px @base; + } + + .Faw6Fe, + .GpOXq { + border-color: @surface0 !important; + } + + .zGVn2e, + .jh86Nb { + border-color: @surface1 !important; + } + /* Featured snippets */ @media (prefers-reduced-motion: no-preference) { .c2xzTb .ILfuVd b { background: linear-gradient( - 90deg, - fade(@accent-color, 30%) 50%, - #0000 50% - ) - no-repeat 75% 0; + 90deg, + fade(@accent, 30%) 50%, + #0000 50% + ) no-repeat 75% 0; background-size: 200% 100%; } } @@ -689,7 +874,7 @@ } .z1asCe, .ikb4Bb { - color: @text !important; + color: @subtext1 !important; } .rsGxI.Ww4FFb, .Ww4FFb { @@ -702,7 +887,8 @@ .related-question-pair div.iDjcJe { color: @text; } - .cUnQKe .ILfuVd b { + .cUnQKe .ILfuVd b, + .cUnQKe .QBI8hf b { background-color: fade(@blue, 25%); color: @text; } @@ -733,11 +919,7 @@ background-color: @surface0; } .language_list_languages.tw-ll-top::after { - background: linear-gradient( - to bottom, - rgba(red(@base), green(@base), blue(@base), 0), - rgba(red(@base), green(@base), blue(@base), 1) - ); + background: linear-gradient(to bottom, transparent, @base); } .HsZQAe { border-bottom-color: @surface2; @@ -851,6 +1033,10 @@ .YrbPuc { color: @subtext1; } + .SRfaKe, + .SRfaKe h2 { + background-color: @mantle; + } .y6CIle { background-color: @surface0; } @@ -869,6 +1055,9 @@ border-color: @surface1; background-color: @base; } + .PewBWb { + border-top-color: @surface1; + } .eadHV.Ses7yd { color: @text !important; } @@ -1117,9 +1306,6 @@ a:visited { color: @mauve; } - .F9Idpe { - background: linear-gradient(to right, transparent 0%, @base 60%, @base); - } .SvoXfb > .x5f7Bc { fill: @subtext0; } @@ -1216,6 +1402,7 @@ } .dG2XIf { background: @base; + border-color: @surface0 !important; } .Z0LcW { color: @text; @@ -1660,7 +1847,7 @@ } .NQyKp { color: @surface0 !important; - background: @accent-color !important; + background: @accent !important; } .b0Xfjd { color: @base !important; @@ -1869,20 +2056,19 @@ .act-switch-area { background-color: @base !important; } - .q8U8x > div:nth-child(1) { - background-color: @base !important; - } .EwDHG, .vNdLpe, .vNdLpe:visited { color: @subtext0 !important; } // "Looking for results in English?" popup - [style*="background:#1f1000;border:1px solid #502900"] { + [style*="background:#1f1000;border:1px solid #502900"], + [style*="background:#feefc3;border:1px solid #fdd663"] { background: @mantle !important; border-color: @surface0 !important; box-shadow: 0 2px 4px @mantle !important; - [style*="color:#bdc1c6"] { + [style*="color:#bdc1c6"], + [style*="color:#202124"] { color: @text !important; } } @@ -1952,59 +2138,181 @@ @mantle ); } + + /// tv show information + // episode title + .huUgrf { + color: @blue; + } + // episode divider + .PZPZlf, .Ea7JLb { + border-color: @surface2; + } + /// season selection + // underline + .A0zxBb { + color: @text; + } + // background and border + .qFF17c { + background-color: @surface0 !important; + border-color: @surface2 !important; + } + // middle divider + .qFF17c > div { + border-color: @surface2 !important; + } + // text + .F3Istb > span { + color: @subtext1 !important; + } + // text underline + .F9SH7d { + border-color: @text !important; + } + /// watch buttons + // button + .ZkkK1e { + background-color: @surface0; + border-color: @surface1; + } + // text + .HJFlGc { + color: @text; + } + // play button + .GzErzd { + color: @blue !important; + } + + // footer logo + [style^="background:url(/images/nav_logo321.webp)"] { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + // tweets horizontal list + g-right-button, + g-left-button { + > g-fab { + background: @crust !important; + border-color: @surface0; + } + } + .vwfsqc { + .QuU3Wb { + color: @text; + } + } + // image overlays + .yUzGqc.wr8GYd { + background: fade(@crust, 75%); + color: @text; + } + // google lens icon hover + .ig2Tkd:hover:not(.RDPZE) { + background: fade(@mantle, 80%); + } + // image resolution + .UWuvyf { + background-color: fade(@crust, 80%); + color: @text; + } + // image hover shadow + .mkpRId.qyKxnc:hover .F0uyec { + background: fade(@crust, 5%); + box-shadow: 0 2px 12px 0 @crust; + } + // advanced search + input.jfk-textinput, + .gGbPid { + background: @base; + color: @text; + border-color: @overlay0; + } + .goog-menu { + background: @mantle; + } + .goog-menuitem-highlight, + .goog-menuitem-hover { + background: @surface0; + border-color: @surface0; + } + .goog-menuitem, + .goog-menuitem-highlight .goog-menuitem-content, + .goog-menuitem-hover .goog-menuitem-content { + color: @text; + } + .goog-flat-menu-button-hover { + border-color: @overlay2; + .goog-flat-menu-button-dropdown { + border-color: @overlay2 transparent; + } + } + .goog-flat-menu-button-dropdown { + border-color: @overlay0 transparent; + } + div.otByu div.FAcADc, + div.lFApYd, + .jfk-radiobutton-label { + color: @subtext1; + } + // knowledge panel + .Qc895c, + .Utq4Cb.PZPZlf, + .SU02Qd g-inner-card { + background-color: @surface0 !important; + } + .Qc895c div, + .Utq4Cb.PZPZlf div, + .CYJS5e { + color: @text !important; + } + .CYJS5e.W0urI, + .REySof.T9jMmf, + .b0Xfjd.Hyaw8c, + .dvfTSb.OdANFd { + background-color: @surface0 !important; + color: @text !important; + } + .CYJS5e.W0urI:hover { + background-color: @surface1 !important; + } + .gEYEQc.x5W9xd.qYvl9c.klitem, + .MJfuMd { + background-color: @base !important; + border-color: @surface1 !important; + } + .NQyKp.Hyaw8c.h4wEae.Maj6Tc { + border-color: @text !important; + } color: @subtext0; } @media (prefers-color-scheme: light) { body { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } } @media (prefers-color-scheme: dark) { body { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } } } -@-moz-document regexp("^https?://(ogs\\.)?google\\..*") -{ - @media (prefers-color-scheme: light) { - body { - #catppuccin(@lightFlavor, @accentColor); +@-moz-document regexp("^https?://(ogs\\.)?google\\..*") { + body { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - body { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + + #catppuccin(@flavor) { + #lib.palette(); .aRDKUe { .rRF0wd { @@ -2122,13 +2430,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/google/preview.webp b/styles/google/preview.webp deleted file mode 100644 index 71544556d2..0000000000 --- a/styles/google/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:f9a5d27a8a8bd8be4b654f7a1f865b47e768c12cc245430376b60df053687b67 -size 27950 diff --git a/styles/grabify/README.md b/styles/grabify/README.md new file mode 100644 index 0000000000..0c3a59b82c --- /dev/null +++ b/styles/grabify/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Grabify + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [trinkey](https://github.com/trinkey) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/grabify/catppuccin.user.less b/styles/grabify/catppuccin.user.less new file mode 100644 index 0000000000..781a71d3be --- /dev/null +++ b/styles/grabify/catppuccin.user.less @@ -0,0 +1,525 @@ +/* ==UserStyle== +@name Grabify Catppuccin +@namespace github.com/catppuccin/userstyles/styles/grabify +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/grabify +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/grabify/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agrabify +@description Soothing pastel theme for Grabify +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("grabify.link") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + background-color: @base; + + a { + color: @accent; + + &:hover, + &:focus { + color: darken(@accent, 5%); + } + + &[style*="color: "] { + color: @accent !important; + + &:hover, + &:focus { + color: darken(@accent, 5%) !important; + } + } + } + + hr, + .light-shaded { + background-color: @surface0; + } + + body, + strong, + article :is(h1, h2, li), + .content :is(h1, h2, h3), + .label, + .radio:hover, + .checkbox:hover, + .title, + .subtitle, + .pw-post-title, + .pw-post-body-paragraph { + color: @text; + } + + // Live support box + #wrapper ~ div:has(iframe[style*="color-scheme:light"]) { + display: none !important; + } + + .has-text-white { + color: @text !important; + } + + .has-text-white-ter { + color: @subtext1 !important; + } + + .has-text-grey, + .is-author-metadata, + figcaption, + article blockquote p { + color: @subtext0 !important; + } + + .navbar { + background-color: @crust; + border-color: @surface0; + } + + .navbar-item, + .navbar-link { + color: @text; + + &:hover, + &:focus { + color: @accent !important; + } + } + + .navbar-link:not(.is-arrowless)::after { + border-color: @accent; + } + + .navbar-dropdown { + background-color: @crust; + color: @text; + border-top-color: @surface0; + box-shadow: none; + } + + .has-gradient-bg.to-bottom-left { + background: @mantle; + } + + .landing-hero { + background: @mantle; + } + + polygon[fill="white"] { + fill: @base !important; + } + + [style*="color: red"], + [style*="color: rgb(224, 36, 36);"], + [style*="color: rgb(224, 185, 36);"], + [style="color: rgb(33, 150, 243);"] { + color: @accent !important; + } + + [style="color: rgb(44, 62, 80);"], + [style="font-style: italic; color: rgb(0, 0, 0);"] { + color: @subtext0 !important; + } + + [style="color: rgb(41, 182, 246);"] { + color: @blue !important; + } + + [style="color: rgb(0, 150, 136);"] { + color: @teal !important; + } + + [style="color: rgb(139, 195, 74);"] { + color: @green !important; + } + + .how-it-works-box { + background-color: @mantle; + box-shadow: none; + } + + [data-tooltip] { + &.has-tooltip-arrow { + &.has-tooltip-right::after { + border-right-color: @surface0; + } + + &.has-tooltip-bottom::after { + border-bottom-color: @surface0; + } + + &.has-tooltip-left::after { + border-left-color: @surface0; + } + + &.has-tooltip-top::after { + border-top-color: @surface0; + } + } + + &::before { + background-color: @surface0; + color: @text; + } + } + + [aria-label="Share Post"] path { + fill: @text; + } + + .dropdown-content { + background-color: @mantle; + + a.dropdown-item { + color: @text !important; + + &:hover { + background-color: @crust; + } + } + } + + .footer { + background-color: @mantle !important; + color: @text; + + .footer-separator { + background-color: @surface0; + } + } + + .switch[type="checkbox"] { + + label { + &::before { + background-color: @surface0; + } + + &::after { + background-color: @text; + } + } + + &:checked + label { + &::before { + background-color: @accent; + } + + &::after { + background-color: @base; + } + } + } + + .message.is-primary { + background: transparent; + + .message-header { + background-color: @mantle; + color: @text; + } + + .message-body { + background-color: @surface0; + color: @text; + } + } + + .button { + &:not(.is-ghost), + &.is-light { + border-color: @surface0; + background-color: @mantle; + + &, + strong { + color: @text; + } + + &:hover, + &.is-hovered { + background-color: @crust; + } + } + + &.is-primary, + &.is-info, + &.is-link { + background-color: @accent; + + &, + strong { + color: @crust; + } + + &:hover, + &.is-hovered { + background-color: darken(@accent, 5%); + } + } + + &.is-info.is-outlined { + border-color: @accent; + background: transparent; + + &, + strong { + color: @text; + } + + &:hover, + &.is-hovered { + color: @accent; + } + } + + &.is-danger { + background-color: @red; + + &, + strong { + color: @crust; + } + + &:hover, + &.is-hovered { + background-color: darken(@red, 5%); + } + } + } + + .input { + background-color: @mantle; + box-shadow: none; + border-color: @surface0; + color: @text; + } + + .card { + background-color: @mantle; + color: @text; + border-color: @surface0; + + .card__description, + .card__title, + .card__website { + color: @text; + } + + .card__image { + border-bottom-color: @surface0; + } + } + + .box { + box-shadow: none; + color: @text; + background-color: @mantle !important; + border-color: @surface0 !important; + } + + .table { + background-color: @mantle; + + &.is-hoverable tbody tr:hover, + &.is-striped tbody tr:nth-child(2n) { + background-color: @crust !important; + } + + .sortable th[data-sorted] { + &:hover { + background-color: @crust; + color: @text; + } + + &::after { + color: @text; + } + } + + th, + td { + border-color: @surface0; + color: @text; + + &[style*="color:"] { + color: @subtext0 !important; + } + } + } + + .log-table { + :is(.is-table-date, .is-table-ip, .is-table-country) div:nth-child(2), + .is-table-referrer .is-no-referrer { + color: @subtext0; + } + } + + .notification { + &.is-success { + background-color: @green; + } + + &.is-warning { + background-color: @yellow; + } + + &.is-danger { + background-color: @red; + } + + &, + strong { + color: @crust; + } + } + + #ab { + // Ad block detection modal + .css1.css2, + .ab_footer { + background-color: @base !important; + box-shadow: 0 2px 12px 0 fade(@crust, 20%); + } + + [style*="color: rgb(44, 62, 80)"] { + color: @text !important; + } + } + + #ab, + .modal-background { + background-color: fade(@crust, 65%) !important; + } + + .modal-card-head, + .modal-card-body, + .modal-card-foot { + background-color: @base; + border-color: @surface0; + } + + .modal-card-title { + color: @text; + } + + .delete { + &::before, + &::after { + background-color: @text; + } + } + + #root .app { + // Ad block disable instructions + [style="color: rgb(0, 0, 0);"] { + color: @text !important; + } + + .btn { + background-color: @accent; + + &[style="background-color: rgb(23, 188, 156);"] { + background-color: @accent !important; + } + + [style="color: rgb(255, 255, 255);"] { + color: @mantle !important; + } + + &.btn-outline { + background: @crust; + box-shadow: inset 0 0 0 1px + @surface0; // the outline property exists for a reason... + } + } + + .blockers { + .blocker.selected, + .blocker:hover { + background-color: @mantle; + } + + .arrow-icon path { + fill: @text !important; + } + } + } + + .select { + &:not(.is-multiple, .is-loading)::after { + border-color: @text; + } + + select { + background-color: @mantle; + border-color: @surface0; + color: @text; + + &:focus { + box-shadow: 0 0 0 0.125em @surface0; // once again, just use outline + } + } + } + + img[src$="images/grabify.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + img[src$="images/grabify-inverted.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + img[src$="images/homepage/2.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + img[src$="images/homepage/4.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + img[src$="images/homepage/5.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + .is-world-background { + @svg: escape( + 'includes kosovo' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + } +} diff --git a/styles/graphite/README.md b/styles/graphite/README.md index f9628fdd3b..d981268960 100644 --- a/styles/graphite/README.md +++ b/styles/graphite/README.md @@ -4,24 +4,25 @@

Logo
- Catppuccin for Graphite + Catppuccin for Graphite

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer -- [Isabel](https://github.com/isabelroses) +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find! +## ๐Ÿ’– Past Maintainer +- [isabelroses](https://github.com/isabelroses)   diff --git a/styles/graphite/catppuccin.user.css b/styles/graphite/catppuccin.user.css deleted file mode 100644 index 9f058cfd0a..0000000000 --- a/styles/graphite/catppuccin.user.css +++ /dev/null @@ -1,112 +0,0 @@ -/* ==UserStyle== -@name Graphite Catppuccin -@namespace github.com/catppuccin/userstyles/styles/graphite -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/graphite -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/graphite/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agraphite -@description Soothing pastel theme for Graphite -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('app.graphite.dev') { - :root[data-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); - } - :root[data-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); - } - - #createset(@color, @type) { - --color-@{type}-default: @color; - --color-@{type}-lowest-contrast: darken(@color, 60%); - --color-@{type}-low-contrast: @color; - --color-@{type}-high-contrast: @color; - --color-@{type}-highest-contrast: lighten(@color, 10%); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --color-bg-light: @base; - --color-bg-med: @mantle; - --color-bg-dark: @crust; - - --text-color-light: @crust; // this means on a light background - --text-color-default: @text; - --text-color-low-contrast: @text; - --text-color-high-contrast: @text; - --text-color-disabled: @subtext0; - - --btn-color-neutral-selected: @surface0; - --btn-color-neutral-default: @surface0; - --btn-color-neutral-hover: @surface0; - - --icon-color-default: @text; - - --border-color-default: @surface1; - - --color-gray-60: @surface0; - - #createset(@accent-color, emphasis); - #createset(@green, positive); - #createset(@peach, caution); - #createset(@red, negative); - #createset(@mauve, action); - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/graphite/catppuccin.user.less b/styles/graphite/catppuccin.user.less new file mode 100644 index 0000000000..2c57f2f94a --- /dev/null +++ b/styles/graphite/catppuccin.user.less @@ -0,0 +1,66 @@ +/* ==UserStyle== +@name Graphite Catppuccin +@namespace github.com/catppuccin/userstyles/styles/graphite +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/graphite +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/graphite/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Agraphite +@description Soothing pastel theme for Graphite +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("app.graphite.com") { + :root[data-theme="light"] { + #catppuccin(@lightFlavor); + } + :root[data-theme="dark"] { + #catppuccin(@darkFlavor); + } + + #createset(@color, @type) { + --color-@{type}-default: @color; + --color-@{type}-lowest-contrast: darken(@color, 60%); + --color-@{type}-low-contrast: @color; + --color-@{type}-high-contrast: @color; + --color-@{type}-highest-contrast: lighten(@color, 10%); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --color-bg-light: @base; + --color-bg-med: @mantle; + --color-bg-dark: @crust; + + --text-color-light: @crust; // this means on a light background + --text-color-default: @text; + --text-color-low-contrast: @text; + --text-color-high-contrast: @text; + --text-color-disabled: @subtext0; + + --btn-color-neutral-selected: @surface0; + --btn-color-neutral-default: @surface0; + --btn-color-neutral-hover: @surface0; + + --icon-color-default: @text; + + --border-color-default: @surface1; + + --color-gray-60: @surface0; + + #createset(@accent, emphasis); + #createset(@green, positive); + #createset(@peach, caution); + #createset(@red, negative); + #createset(@mauve, action); + } +} diff --git a/styles/graphite/preview.webp b/styles/graphite/preview.webp deleted file mode 100644 index 3306c236a8..0000000000 --- a/styles/graphite/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:64f5f46b519869ffeb4d8b2c9795c8553d2264e599e695920b6ccea2b16903d3 -size 404700 diff --git a/styles/hackage/README.md b/styles/hackage/README.md index a87fafc083..e552adc2d5 100644 --- a/styles/hackage/README.md +++ b/styles/hackage/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Sena](https://github.com/jn-sena) +- [jn-sena](https://github.com/jn-sena)   diff --git a/styles/hackage/catppuccin.user.css b/styles/hackage/catppuccin.user.less similarity index 64% rename from styles/hackage/catppuccin.user.css rename to styles/hackage/catppuccin.user.less index 2a6a978e15..b6c6e9595d 100644 --- a/styles/hackage/catppuccin.user.css +++ b/styles/hackage/catppuccin.user.less @@ -2,8 +2,8 @@ @name Hackage Catppuccin @namespace github.com/catppuccin/userstyles/styles/hackage @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/hackage -@version 0.1.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/hackage/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/hackage/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahackage @description Soothing pastel theme for Hackage @author Catppuccin @@ -15,59 +15,22 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain("hackage.haskell.org") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("hackage.haskell.org"), + domain("hackage-content.haskell.org") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); &, body { @@ -80,10 +43,10 @@ } a[href]:link { - color: @accent-color; + color: @accent; } a[href]:visited { - color: average(@overlay2, @accent-color); + color: average(@overlay2, @accent); } a[href].def:link, @@ -94,6 +57,15 @@ color: average(@overlay2, @subtext0); } + button { + background-color: @mantle; + color: @text; + + &:hover { + background-color: @crust; + } + } + .caption, h1, h2, @@ -101,15 +73,21 @@ h4, h5, h6, - summary { - color: overlay(@accent-color, @surface0); + summary, + .section1, + .section2, + .section3, + .section4, + .section5, + .section6 { + color: @text; filter: none; } .collapser::before, .expander::before, .noexpander::before { - color: @accent-color; + color: @accent; } pre { @@ -119,11 +97,25 @@ blockquote { background-color: @surface0; - border-color: @accent-color; + border-color: @accent; } - .src { + .src, + .decl, + .declname, + .declbut, + .topdecl, + .arg, + .inline-code { background-color: @mantle; + color: @text; + } + + .declbut { + border-color: @overlay0 !important; + a { + color: @overlay2 !important; + } } /* @@ -132,9 +124,9 @@ #page-header, #package-header { - background-color: @accent-color; + background-color: @accent; color: @surface1; - border-color: shade(@accent-color, 25%); + border-color: shade(@accent, 25%); } #page-header .caption, @@ -144,8 +136,9 @@ color: @base !important; } - #module-header .caption { - color: @accent-color; + #module-header .caption, + .modulebar { + color: @accent; border-color: @surface1; } @@ -179,6 +172,31 @@ button { color: @base; } + + button { + background-color: transparent; + } + } + + .topbar { + background-color: @accent; + + .topbut { + border-color: @overlay0; + + a { + background-color: transparent; + color: @base; + } + } + .title { + color: @base; + } + } + + .botbar { + background-color: @crust; + color: @text; } /* @@ -225,7 +243,7 @@ */ .embedded-author-content { - border-color: @accent-color; + border-color: @accent; } /* @@ -236,14 +254,23 @@ background-color: @mantle; } - #table-of-contents { + h2#table-of-contents { + background-color: @mantle; + color: @text; + } + + div#table-of-contents { background-color: @base; border-color: @surface1; } #synopsis { - summary { - color: transparent; + summary, + #control\.syn { + @svg: escape( + 'SynopsisSynopsis' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; } ul { @@ -269,14 +296,14 @@ #search-form { input { - border-color: @accent-color; + border-color: @accent; } } #search-results { - border-color: @accent-color; + border-color: @accent; - & > ul > li { + > ul > li { border-bottom-color: @overlay0; } } @@ -295,7 +322,7 @@ } .keyboard-shortcuts th { - color: @accent-color; + color: @accent; } .key { @@ -313,13 +340,13 @@ border-color: @surface0; button { - background-color: @accent-color; + background-color: @accent; color: @mantle; border-color: @surface2; &:hover, &:active { - background-color: @accent-color; + background-color: @accent; color: @mantle; } } @@ -366,6 +393,11 @@ } } + .infohead, + .infoval { + color: @subtext1; + } + div#table_length.dataTables_length, div#table_filter.dataTables_filter { color: @text; @@ -387,8 +419,10 @@ #interface { .src { - .selflink .link { - color: @overlay2; + .link, + .selflink { + color: @overlay2 !important; + background-color: transparent !important; } } p.src .link { @@ -421,26 +455,29 @@ &[href]:link, &:link:hover { - color: @accent-color; + color: @accent; } &:visited, &:visited:hover { - color: average(@overlay2, @accent-color); + color: average(@overlay2, @accent); } &:link:hover, &:visited:hover { background-image: none; - background-color: @surface1; + background-color: @mantle; border-color: transparent; } } - .current, - .current:hover { + .current { background-image: none; - background-color: @surface0; - color: @accent-color; + background-color: @mantle; + color: @accent; border-color: transparent; + + &:hover { + background-color: @crust !important; + } } } @@ -467,6 +504,7 @@ input { background-color: @mantle; + color: @text; border-style: solid; border-color: @surface0; border-radius: 4px; @@ -487,15 +525,24 @@ } } - input[type="submit"] { - color: @text; - } - input[type="range"]:hover, input[type="submit"]:hover { background-color: @crust; } + /* + * Upload + */ + + input[type="file"] { + background-color: transparent; + + &::file-selector-button { + background-color: @mantle; + color: @text; + } + } + /* * Others */ @@ -545,11 +592,11 @@ } .text-button { - color: @accent-color; + color: @accent; } p.registration-email { - border-color: @accent-color; + border-color: @accent; } :target { @@ -590,7 +637,7 @@ .MathJax_Menu { background-color: @surface0; color: @text; - border-color: @accent-color; + border-color: @accent; box-shadow: 0 10px 20px @mantle; -webkit-box-shadow: 0 10px 20px @mantle; -moz-box-shadow: 0 10px 20px @mantle; @@ -642,59 +689,63 @@ } } - span.mathjax img when not (@lookup = latte) { - filter: invert(100%); + span.mathjax img { + filter: @text-filter; } /* * Sources */ - /* Old */ - - .hs-keyglyph, - .hs-layout { - color: @overlay2; - } - .hs-comment a { - color: @overlay0; - } - .hs-str, - .hs-chr { - color: @green; - } - - /* Modern */ - + span.definition, .hs-identifier { color: @blue; } + .hs-identifier.hs-type { color: @yellow; } + + span.keyword, .hs-keyword { color: @mauve; } + + span.str, + span.char, .hs-string, - .hs-char { + .hs-char, + .hs-str, + .hs-chr { color: @green; } + .hs-number { color: @peach; } + .hs-operator { color: @sky; } + + span.keyglyph, + span.layout, + span.conop, + .hs-keyglyph, + .hs-layout, .hs-glyph, .hs-special { color: @overlay2; } - .hs-comment { + + span.comment, + .hs-comment, + .hs-comment a { color: @overlay0; } - .hs-pragma { - color: @pink; - } + + span.cpp, + .hs-pragma, .hs-cpp { color: @pink; } @@ -719,18 +770,8 @@ span.annottext { background-color: @surface0; - border-color: @accent-color; + border-color: @accent; } } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/hackage/preview.webp b/styles/hackage/preview.webp deleted file mode 100644 index bc314f5f2e..0000000000 --- a/styles/hackage/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:b5dec0982b163ed9e51647b4c3d2cd1d0bc747a39d565bf8bf4215f931c15a3f -size 104186 diff --git a/styles/hacker-news/README.md b/styles/hacker-news/README.md index 00a898d5fa..43df843788 100644 --- a/styles/hacker-news/README.md +++ b/styles/hacker-news/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Lucas Melin](https://github.com/lucasmelin) +- [lucasmelin](https://github.com/lucasmelin)   diff --git a/styles/hacker-news/catppuccin.user.css b/styles/hacker-news/catppuccin.user.css deleted file mode 100644 index aec06d177c..0000000000 --- a/styles/hacker-news/catppuccin.user.css +++ /dev/null @@ -1,208 +0,0 @@ -/* ==UserStyle== -@name Hacker News Catppuccin -@namespace github.com/catppuccin/userstyles/styles/hacker-news -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/hacker-news -@version 1.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/hacker-news/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahacker-news -@description Soothing pastel theme for Hacker News -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("news.ycombinator.com") { - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @orange: mix(@peach, @yellow); - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - [bgcolor="#fafaf0"], - [bgcolor="#f6f6ef"] { - background-color: @base; - } - body { - background-color: @mantle; - } - - td { - color: @text; - } - - /* Header */ - td[bgcolor="#ff6600"] { - background-color: @orange; - - .pagetop, - .pagetop a { - color: @crust !important; - } - - img[src="y18.svg"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - border-color: @crust !important; - } - - [color="#ffffff"] { - color: @crust; - } - } - - td[bgcolor="#ffffaa"] { - background-color: @yellow; - - td { - color: @crust; - } - } - - .subtext, - .comhead { - &, - a:link, - a:visited { - color: @overlay2; - } - } - - a:link { - color: @blue; - } - .hnmore a:link, - a:visited { - color: @lavender; - } - - [color="#3c963c"] { - color: @green; - } - - /* Story points */ - .score { - color: @subtext0; - } - - /* Story ranking number */ - .title { - color: @lavender; - } - - /* Comment text */ - .commtext { - color: @text; - } - - /* Comment hyperlinks */ - .commtext a:link { - color: @sapphire; - } - - /* Comment box */ - input, - textarea, - select { - background-color: @mantle; - color: @text; - border-width: 1px; - border-style: solid; - border-color: @surface0; - border-radius: 2px; - } - - input { - padding: 2px; - } - - /* Poll questions */ - td.comment > div > font { - color: @text; - } - - /* Text post content */ - .toptext { - color: @text; - } - - .votearrow { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .yclinks { - color: @surface2; - } - - b { - color: @text; - } - - table[bgcolor="#ff6600"] { - background-color: @orange; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/hacker-news/catppuccin.user.less b/styles/hacker-news/catppuccin.user.less new file mode 100644 index 0000000000..b5e70980dd --- /dev/null +++ b/styles/hacker-news/catppuccin.user.less @@ -0,0 +1,162 @@ +/* ==UserStyle== +@name Hacker News Catppuccin +@namespace github.com/catppuccin/userstyles/styles/hacker-news +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/hacker-news +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/hacker-news/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahacker-news +@description Soothing pastel theme for Hacker News +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("news.ycombinator.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + [bgcolor="#fafaf0"], + [bgcolor="#f6f6ef"] { + background-color: @base; + } + body { + background-color: @mantle; + color: @text; + } + + td { + color: @text; + } + + /* Header */ + td[bgcolor="#ff6600"] { + background-color: @accent; + + .pagetop, + .pagetop a { + color: @crust !important; + } + + img[src="y18.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + border-color: @crust !important; + } + + [color="#ffffff"] { + color: @crust; + } + } + + td[bgcolor="#ffffaa"] { + background-color: @yellow; + + td { + color: @crust; + } + } + + .subtext, + .comhead { + &, + a:link, + a:visited, + a:hover { + color: @overlay2 !important; + } + } + + a:link { + color: @blue; + &:hover { + color: @sky; + } + } + .hnmore a:link, + a:visited { + color: @lavender; + } + + [color="#3c963c"] { + color: @green; + } + + /* Story points */ + .score { + color: @subtext0; + } + + /* Story ranking number */ + .title { + color: @lavender; + } + + /* Comment text */ + .commtext { + color: @text; + } + + /* Comment box */ + input, + textarea, + select { + background-color: @mantle; + color: @text; + border-width: 1px; + border-style: solid; + border-color: @surface0; + border-radius: 2px; + } + + input { + padding: 2px; + } + + /* Poll questions */ + td.comment > div > font { + color: @text; + } + + /* Text post content */ + .toptext { + color: @text; + } + + .votearrow { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .yclinks { + color: @surface2; + } + + b { + color: @text; + } + + table[bgcolor="#ff6600"] { + background-color: @accent; + } + } +} diff --git a/styles/hacker-news/preview.webp b/styles/hacker-news/preview.webp deleted file mode 100644 index 34db2b8c3a..0000000000 --- a/styles/hacker-news/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6b799861b5dac0506cca04cf57b06c907acb9b9e28864324466e15aeed6e26a8 -size 414436 diff --git a/styles/have-i-been-pwned/README.md b/styles/have-i-been-pwned/README.md index 7755a8d442..7cb23cc027 100644 --- a/styles/have-i-been-pwned/README.md +++ b/styles/have-i-been-pwned/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/have-i-been-pwned/catppuccin.user.css b/styles/have-i-been-pwned/catppuccin.user.less similarity index 65% rename from styles/have-i-been-pwned/catppuccin.user.css rename to styles/have-i-been-pwned/catppuccin.user.less index 194a250897..1b38f32497 100644 --- a/styles/have-i-been-pwned/catppuccin.user.css +++ b/styles/have-i-been-pwned/catppuccin.user.less @@ -2,8 +2,8 @@ @name Have I Been Pwned Catppuccin @namespace github.com/catppuccin/userstyles/styles/have-i-been-pwned @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/have-i-been-pwned -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/have-i-been-pwned/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/have-i-been-pwned/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahave-i-been-pwned @description Soothing pastel theme for Have I Been Pwned @author Catppuccin @@ -15,60 +15,21 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('haveibeenpwned.com') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("haveibeenpwned.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @text_filter: @catppuccin[@@lookup][@text_filter]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); body { background-color: @base; @@ -88,12 +49,12 @@ } &:hover { - background-color: fade(@accent-color, 30%); + background-color: fade(@accent, 30%); } } img.pwnLogo.large.modalLogo { - filter: @text_filter; + filter: @text-filter; } .bodyGradient { @@ -139,8 +100,8 @@ } .main-logo .logo { - border-color: @accent-color; - background-color: fade(@accent-color, 30%); + border-color: @accent; + background-color: fade(@accent, 30%); } .pwnedCompanyList { @@ -214,7 +175,7 @@ img.pwnLogo { &[src$="/List.png"], &[src$="/Email.png"] { - filter: @text_filter; + filter: @text-filter; } } @@ -224,7 +185,7 @@ border-color: @surface0 !important; &:focus { - box-shadow: 0 0 8px fade(@accent-color, 30%); + box-shadow: 0 0 8px fade(@accent, 30%); } } @@ -234,7 +195,7 @@ border-color: @surface0 !important; &:hover { - background-color: fade(@accent-color, 30%); + background-color: fade(@accent, 30%); } } @@ -245,7 +206,7 @@ } .progress-bar { - background-color: @accent-color; + background-color: @accent; } .form-group .termsOfUse { @@ -277,8 +238,8 @@ .panel-primary { border-color: @surface0; - & > .panel-heading, - & > .panel-footer { + > .panel-heading, + > .panel-footer { color: @text; border-color: @surface0; background-color: @mantle; @@ -302,7 +263,7 @@ border-color: @surface0; } - & > .pwnedRow { + > .pwnedRow { background: @red; .pwnedWebsite { @@ -430,7 +391,7 @@ .dropdown-menu { background-color: @base; - & > li > a { + > li > a { &:hover, &:focus { background-color: @mantle; @@ -451,13 +412,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @text_filter: brightness(0) saturate(100%) invert(30%) sepia(7%) saturate(1674%) hue-rotate(196deg) brightness(97%) contrast(91%); @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @text_filter: brightness(0) saturate(100%) invert(74%) sepia(16%) saturate(454%) hue-rotate(192deg) brightness(110%) contrast(92%); @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @text_filter: brightness(0) saturate(100%) invert(82%) sepia(77%) saturate(662%) hue-rotate(181deg) brightness(103%) contrast(92%); @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @text_filter: brightness(0) saturate(100%) invert(88%) sepia(10%) saturate(1247%) hue-rotate(191deg) brightness(99%) contrast(93%); @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/have-i-been-pwned/preview.webp b/styles/have-i-been-pwned/preview.webp deleted file mode 100644 index 4b4545537a..0000000000 --- a/styles/have-i-been-pwned/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ed22185e6de862d59ce004850b1bd70f1fbffefc1d8f1b629a169d200b7adca6 -size 169590 diff --git a/styles/holodex/README.md b/styles/holodex/README.md index ad150af868..6d94380bc2 100644 --- a/styles/holodex/README.md +++ b/styles/holodex/README.md @@ -10,18 +10,15 @@

- -

- -

- +

## Usage -> [!NOTE] -> Holodex's selected theme is ignored. +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). +> [!NOTE] +> Holodex's selected theme is ignored. ## ๐Ÿ’ Current Maintainer - [Guaxinim5573](https://github.com/Guaxinim5573) diff --git a/styles/holodex/catppuccin.user.css b/styles/holodex/catppuccin.user.css deleted file mode 100644 index 310683c0b3..0000000000 --- a/styles/holodex/catppuccin.user.css +++ /dev/null @@ -1,275 +0,0 @@ -/* ==UserStyle== -@name Holodex Catppuccin -@namespace github.com/catppuccin/userstyles/styles/holodex -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/holodex -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/holodex/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aholodex -@description Soothing pastel theme for Holodex -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('holodex.net') { - :root:has(.theme--dark) { - #catppuccin(@darkFlavor, @accentColor); - } - - :root:has(.theme--light) { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --v-anchor-base: @accent-color; - --v-primary-base: @accent-color; - --v-primary-lighten1: lighten(@accent-color, 4%); - --v-primary-lighten2: lighten(@accent-color, 8%); - --v-primary-lighten3: lighten(@accent-color, 9%); - --v-primary-lighten4: lighten(@accent-color, 18%); - --v-primary-lighten5: lighten(@accent-color, 19%); - --v-primary-darken1: darken(@accent-color, 14%); - --v-primary-darken2: darken(@accent-color, 31%); - --v-primary-darken3: darken(@accent-color, 35%); - --v-primary-darken4: darken(@accent-color, 43%); - - --v-accent-base: @accent-color; - --v-accent-lighten1: lighten(@accent-color, 4%); - --v-accent-lighten2: lighten(@accent-color, 8%); - --v-accent-lighten3: lighten(@accent-color, 9%); - --v-accent-lighten4: lighten(@accent-color, 18%); - --v-accent-lighten5: lighten(@accent-color, 19%); - --v-accent-darken1: darken(@accent-color, 14%); - --v-accent-darken2: darken(@accent-color, 31%); - --v-accent-darken3: darken(@accent-color, 35%); - --v-accent-darken4: darken(@accent-color, 43%); - - --v-secondary-base: @accent-color; - --v-secondary-lighten1: lighten(@accent-color, 4%); - --v-secondary-lighten2: lighten(@accent-color, 8%); - --v-secondary-lighten3: lighten(@accent-color, 9%); - --v-secondary-lighten4: lighten(@accent-color, 18%); - --v-secondary-lighten5: lighten(@accent-color, 19%); - --v-secondary-darken1: darken(@accent-color, 14%); - --v-secondary-darken2: darken(@accent-color, 31%); - --v-secondary-darken3: darken(@accent-color, 35%); - --v-secondary-darken4: darken(@accent-color, 43%); - - --v-error-base: @red; - --v-error-lighten1: lighten(@red, 4%); - --v-error-lighten2: lighten(@red, 8%); - --v-error-lighten3: lighten(@red, 9%); - --v-error-lighten4: lighten(@red, 18%); - --v-error-lighten5: lighten(@red, 19%); - --v-error-darken1: darken(@red, 14%); - --v-error-darken2: darken(@red, 31%); - --v-error-darken3: darken(@red, 35%); - --v-error-darken4: darken(@red, 43%); - - --v-info-base: @blue; - --v-info-lighten1: lighten(@blue, 4%); - --v-info-lighten2: lighten(@blue, 8%); - --v-info-lighten3: lighten(@blue, 9%); - --v-info-lighten4: lighten(@blue, 18%); - --v-info-lighten5: lighten(@blue, 19%); - --v-info-darken1: darken(@blue, 14%); - --v-info-darken2: darken(@blue, 31%); - --v-info-darken3: darken(@blue, 35%); - --v-info-darken4: darken(@blue, 43%); - - --v-success-base: @green; - --v-success-lighten1: lighten(@green, 4%); - --v-success-lighten2: lighten(@green, 8%); - --v-success-lighten3: lighten(@green, 9%); - --v-success-lighten4: lighten(@green, 18%); - --v-success-lighten5: lighten(@green, 19%); - --v-success-darken1: darken(@green, 14%); - --v-success-darken2: darken(@green, 31%); - --v-success-darken3: darken(@green, 35%); - --v-success-darken4: darken(@green, 43%); - - --v-warning-base: @yellow; - --v-warning-lighten1: lighten(@yellow, 4%); - --v-warning-lighten2: lighten(@yellow, 8%); - --v-warning-lighten3: lighten(@yellow, 9%); - --v-warning-lighten4: lighten(@yellow, 18%); - --v-warning-lighten5: lighten(@yellow, 19%); - --v-warning-darken1: darken(@yellow, 14%); - --v-warning-darken2: darken(@yellow, 31%); - --v-warning-darken3: darken(@yellow, 35%); - --v-warning-darken4: darken(@yellow, 43%); - - --v-background-base: @base; - --v-background-lighten1: lighten(@base, 4%); - --v-background-lighten2: lighten(@base, 8%); - --v-background-lighten3: lighten(@base, 9%); - --v-background-lighten4: lighten(@base, 18%); - --v-background-lighten5: lighten(@base, 19%); - --v-background-darken1: darken(@base, 14%); - --v-background-darken2: darken(@base, 31%); - --v-background-darken3: darken(@base, 35%); - --v-background-darken4: darken(@base, 43%); - - div.v-application { - background: @base !important; - color: @text; - } - - header#top-bar, - header.v-toolbar, - div.v-navigation-drawer__content, - div#bottom-bar, - div.v-main__wrap > div, - div.v-select__selections, - div.v-slide-group__wrapper, - div.v-bottom-navigation, - div.v-select__slot, - div.v-input__slot, - div.v-overlay__scrim { - background: @base !important; - } - div.v-sheet { - background: @base; - border-color: @base; - } - - .v-btn.v-btn--has-bg:not(.nav-btn) { - background-color: @surface0 !important; - } - - .v-list, - .v-list-item, - .v-card, - .v-sheet, - .v-select__selections, - .v-label, - .text--secondary, - .v-input__slot input { - color: @text !important; - path:not([fill*="iid-1"]) { - fill: @text; - } - } - - .v-messages, - .v-list-item__subtitle, - .v-tab:not(.v-tab--active) { - color: @subtext0 !important; - } - - svg.logo path { - fill: darken(@accent-color, 2%) !important; - - &:last-child { - fill: darken(@blue, 8%) !important; - } - } - - .v-chip { - background: @blue; - } - - .primary--text, - .name-vtuber { - color: @accent-color !important; - } - - .text-live { - color: @red; - } - - .stream-count-chip { - color: @crust !important; - } - - .nav-btn.v-btn--active { - color: @accent-color !important; - } - - div.v-sheet.v-alert { - background: none !important; - color: @yellow !important; - - .v-icon path { - fill: @yellow !important; - } - } - - hr { - border-color: @base; - } - - // Snack - div.v-snack { - color: @text; - - div.v-sheet { - background: @surface0 !important; - } - - button.v-btn--text { - color: @text !important; - } - - button.v-btn--is-elevated.v-btn--has-bg { - background: @accent-color !important; - color: @base; - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/holodex/catppuccin.user.less b/styles/holodex/catppuccin.user.less new file mode 100644 index 0000000000..8da3759e63 --- /dev/null +++ b/styles/holodex/catppuccin.user.less @@ -0,0 +1,229 @@ +/* ==UserStyle== +@name Holodex Catppuccin +@namespace github.com/catppuccin/userstyles/styles/holodex +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/holodex +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/holodex/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aholodex +@description Soothing pastel theme for Holodex +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("holodex.net") { + :root:has(.theme--dark) { + #catppuccin(@darkFlavor); + } + + :root:has(.theme--light) { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --v-anchor-base: @accent; + --v-primary-base: @accent; + --v-primary-lighten1: lighten(@accent, 4%); + --v-primary-lighten2: lighten(@accent, 8%); + --v-primary-lighten3: lighten(@accent, 9%); + --v-primary-lighten4: lighten(@accent, 18%); + --v-primary-lighten5: lighten(@accent, 19%); + --v-primary-darken1: darken(@accent, 14%); + --v-primary-darken2: darken(@accent, 31%); + --v-primary-darken3: darken(@accent, 35%); + --v-primary-darken4: darken(@accent, 43%); + + --v-accent-base: @accent; + --v-accent-lighten1: lighten(@accent, 4%); + --v-accent-lighten2: lighten(@accent, 8%); + --v-accent-lighten3: lighten(@accent, 9%); + --v-accent-lighten4: lighten(@accent, 18%); + --v-accent-lighten5: lighten(@accent, 19%); + --v-accent-darken1: darken(@accent, 14%); + --v-accent-darken2: darken(@accent, 31%); + --v-accent-darken3: darken(@accent, 35%); + --v-accent-darken4: darken(@accent, 43%); + + --v-secondary-base: @accent; + --v-secondary-lighten1: lighten(@accent, 4%); + --v-secondary-lighten2: lighten(@accent, 8%); + --v-secondary-lighten3: lighten(@accent, 9%); + --v-secondary-lighten4: lighten(@accent, 18%); + --v-secondary-lighten5: lighten(@accent, 19%); + --v-secondary-darken1: darken(@accent, 14%); + --v-secondary-darken2: darken(@accent, 31%); + --v-secondary-darken3: darken(@accent, 35%); + --v-secondary-darken4: darken(@accent, 43%); + + --v-error-base: @red; + --v-error-lighten1: lighten(@red, 4%); + --v-error-lighten2: lighten(@red, 8%); + --v-error-lighten3: lighten(@red, 9%); + --v-error-lighten4: lighten(@red, 18%); + --v-error-lighten5: lighten(@red, 19%); + --v-error-darken1: darken(@red, 14%); + --v-error-darken2: darken(@red, 31%); + --v-error-darken3: darken(@red, 35%); + --v-error-darken4: darken(@red, 43%); + + --v-info-base: @blue; + --v-info-lighten1: lighten(@blue, 4%); + --v-info-lighten2: lighten(@blue, 8%); + --v-info-lighten3: lighten(@blue, 9%); + --v-info-lighten4: lighten(@blue, 18%); + --v-info-lighten5: lighten(@blue, 19%); + --v-info-darken1: darken(@blue, 14%); + --v-info-darken2: darken(@blue, 31%); + --v-info-darken3: darken(@blue, 35%); + --v-info-darken4: darken(@blue, 43%); + + --v-success-base: @green; + --v-success-lighten1: lighten(@green, 4%); + --v-success-lighten2: lighten(@green, 8%); + --v-success-lighten3: lighten(@green, 9%); + --v-success-lighten4: lighten(@green, 18%); + --v-success-lighten5: lighten(@green, 19%); + --v-success-darken1: darken(@green, 14%); + --v-success-darken2: darken(@green, 31%); + --v-success-darken3: darken(@green, 35%); + --v-success-darken4: darken(@green, 43%); + + --v-warning-base: @yellow; + --v-warning-lighten1: lighten(@yellow, 4%); + --v-warning-lighten2: lighten(@yellow, 8%); + --v-warning-lighten3: lighten(@yellow, 9%); + --v-warning-lighten4: lighten(@yellow, 18%); + --v-warning-lighten5: lighten(@yellow, 19%); + --v-warning-darken1: darken(@yellow, 14%); + --v-warning-darken2: darken(@yellow, 31%); + --v-warning-darken3: darken(@yellow, 35%); + --v-warning-darken4: darken(@yellow, 43%); + + --v-background-base: @base; + --v-background-lighten1: lighten(@base, 4%); + --v-background-lighten2: lighten(@base, 8%); + --v-background-lighten3: lighten(@base, 9%); + --v-background-lighten4: lighten(@base, 18%); + --v-background-lighten5: lighten(@base, 19%); + --v-background-darken1: darken(@base, 14%); + --v-background-darken2: darken(@base, 31%); + --v-background-darken3: darken(@base, 35%); + --v-background-darken4: darken(@base, 43%); + + div.v-application { + background: @base !important; + color: @text; + } + + header#top-bar, + header.v-toolbar, + div.v-navigation-drawer__content, + div#bottom-bar, + div.v-main__wrap > div, + div.v-select__selections, + div.v-slide-group__wrapper, + div.v-bottom-navigation, + div.v-select__slot, + div.v-input__slot, + div.v-overlay__scrim { + background: @base !important; + } + div.v-sheet { + background: @base; + border-color: @base; + } + + .v-btn.v-btn--has-bg:not(.nav-btn) { + background-color: @surface0 !important; + } + + .v-list, + .v-list-item, + .v-card, + .v-sheet, + .v-select__selections, + .v-label, + .text--secondary, + .v-input__slot input { + color: @text !important; + path:not([fill*="iid-1"]) { + fill: @text; + } + } + + .v-messages, + .v-list-item__subtitle, + .v-tab:not(.v-tab--active) { + color: @subtext0 !important; + } + + svg.logo path { + fill: darken(@accent, 2%) !important; + + &:last-child { + fill: darken(@blue, 8%) !important; + } + } + + .v-chip { + background: @blue; + } + + .primary--text, + .name-vtuber { + color: @accent !important; + } + + .text-live { + color: @red; + } + + .stream-count-chip { + color: @crust !important; + } + + .nav-btn.v-btn--active { + color: @accent !important; + } + + div.v-sheet.v-alert { + background: none !important; + color: @yellow !important; + + .v-icon path { + fill: @yellow !important; + } + } + + hr { + border-color: @base; + } + + // Snack + div.v-snack { + color: @text; + + div.v-sheet { + background: @surface0 !important; + } + + button.v-btn--text { + color: @text !important; + } + + button.v-btn--is-elevated.v-btn--has-bg { + background: @accent !important; + color: @base; + } + } + } +} diff --git a/styles/holodex/preview.webp b/styles/holodex/preview.webp deleted file mode 100644 index a2e41667a3..0000000000 --- a/styles/holodex/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:4fff48eb9bf12b06e27c656750004cf219060ce9390ca8d1996175ba1c422198 -size 1129982 diff --git a/styles/home-manager-options-search/README.md b/styles/home-manager-options-search/README.md index 06e648715a..d42143be4a 100644 --- a/styles/home-manager-options-search/README.md +++ b/styles/home-manager-options-search/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/home-manager-options-search/catppuccin.user.css b/styles/home-manager-options-search/catppuccin.user.css deleted file mode 100644 index 042ca5a5c2..0000000000 --- a/styles/home-manager-options-search/catppuccin.user.css +++ /dev/null @@ -1,198 +0,0 @@ -/* ==UserStyle== -@name Home Manager Options Search Catppuccin -@namespace github.com/catppuccin/userstyles/styles/home-manager-options-search -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/home-manager-options-search -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/home-manager-options-search/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahome-manager-options-search -@description Soothing pastel theme for Home Manager Options Search -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('home-manager-options.extranix.com') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - body { - background-color: @base; - color: @text; - } - - header { - background-color: @mantle; - - nav.shortcuts li a { - color: @text; - - &:hover { - background-color: @surface0; - color: @text; - } - } - } - - #lastUpdateElement { - color: @text; - } - - a, - a:visited { - color: @accent-color; - } - - input, - textarea, - select { - background-color: @mantle; - color: @text; - caret-color: @text; - border-color: @surface0; - } - - .progress-bar-striped { - background-image: linear-gradient( - 45deg, - fade(@text, 40%) 25%, - transparent 25%, - transparent 50%, - fade(@text, 40%) 50%, - fade(@text, 40%) 75%, - transparent 75%, - transparent - ); - background-color: @accent-color; - color: @crust; - } - - .form-control:focus { - border-color: @accent-color; - box-shadow: - inset 0 1px 1px rgba(0, 0, 0, 0.075), - 0 0 8px @accent-color; - } - - .table-striped > tbody > tr:nth-of-type(2n + 1) { - background-color: @surface0; - } - - table#indexedOptionsTable tr td, - .table > thead > tr > th { - border-color: @surface2 !important; - } - - table tr.optrow:focus-visible, - table tr.optrow:hover { - background-color: @surface1 !important; - } - - .modal-content { - background-color: @base; - - .modal-header, - .modal-footer { - border-color: @surface0 !important; - } - - .close { - color: @text; - text-shadow: 0 1px 0 @text; - } - - pre { - color: @text; - background-color: @mantle; - border-color: @surface0; - } - } - - .btn-default { - background: @surface0; - color: @text; - text-shadow: none; - box-shadow: none; - border-color: @surface0; - - &:hover, - &:focus, - &:active, - .focus, - .active { - background-color: @surface1; - color: @text; - border-color: @surface0; - } - } - - footer { - background-color: @mantle; - color: @text; - border-color: @surface2; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/home-manager-options-search/catppuccin.user.less b/styles/home-manager-options-search/catppuccin.user.less new file mode 100644 index 0000000000..5b18cea093 --- /dev/null +++ b/styles/home-manager-options-search/catppuccin.user.less @@ -0,0 +1,148 @@ +/* ==UserStyle== +@name Home Manager Options Search Catppuccin +@namespace github.com/catppuccin/userstyles/styles/home-manager-options-search +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/home-manager-options-search +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/home-manager-options-search/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahome-manager-options-search +@description Soothing pastel theme for Home Manager Options Search +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("home-manager-options.extranix.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + background-color: @base; + color: @text; + } + + header { + background-color: @mantle; + + nav.shortcuts li a { + color: @text; + + &:hover { + background-color: @surface0; + color: @text; + } + } + } + + #lastUpdateElement { + color: @text; + } + + a, + a:visited { + color: @accent; + } + + input, + textarea, + select { + background-color: @mantle; + color: @text; + caret-color: @text; + border-color: @surface0; + } + + .progress-bar-striped { + background-image: linear-gradient( + 45deg, + fade(@text, 40%) 25%, + transparent 25%, + transparent 50%, + fade(@text, 40%) 50%, + fade(@text, 40%) 75%, + transparent 75%, + transparent + ); + background-color: @accent; + color: @crust; + } + + .form-control:focus { + border-color: @accent; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px @accent; + } + + .table-striped > tbody > tr:nth-of-type(2n+1) { + background-color: @surface0; + } + + table#indexedOptionsTable tr td, + .table > thead > tr > th { + border-color: @surface2 !important; + } + + table tr.optrow:focus-visible, + table tr.optrow:hover { + background-color: @surface1 !important; + } + + .modal-content { + background-color: @base; + + .modal-header, + .modal-footer { + border-color: @surface0 !important; + } + + .close { + color: @text; + text-shadow: 0 1px 0 @text; + } + + pre { + color: @text; + background-color: @mantle; + border-color: @surface0; + } + } + + .btn-default { + background: @surface0; + color: @text; + text-shadow: none; + box-shadow: none; + border-color: @surface0; + + &:hover, + &:focus, + &:active, + .focus, + .active { + background-color: @surface1; + color: @text; + border-color: @surface0; + } + } + + footer { + background-color: @mantle; + color: @text; + border-color: @surface2; + } + } +} diff --git a/styles/home-manager-options-search/preview.webp b/styles/home-manager-options-search/preview.webp deleted file mode 100644 index 41817c818b..0000000000 --- a/styles/home-manager-options-search/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d536058afb94b30bbc8e72bd5709834cb6afb0f8e7c57756e8a2c2e333bd2efa -size 228262 diff --git a/styles/homepage/README.md b/styles/homepage/README.md index 791e46090f..6291af83fe 100644 --- a/styles/homepage/README.md +++ b/styles/homepage/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Gandalf the Blue](https://github.com/Gandalf-the-Blue) +- [Gandalf-the-Blue](https://github.com/Gandalf-the-Blue)   diff --git a/styles/homepage/catppuccin.user.css b/styles/homepage/catppuccin.user.css deleted file mode 100644 index 36a324b284..0000000000 --- a/styles/homepage/catppuccin.user.css +++ /dev/null @@ -1,204 +0,0 @@ -/* ==UserStyle== -@name homepage Catppuccin -@namespace github.com/catppuccin/userstyles/styles/homepage -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/homepage -@version 0.0.5 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/homepage/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahomepage -@description Soothing pastel theme for homepage -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("homepage.example.com"), regexp("https?://homepage\\..*") -{ - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - //Page Level Features - - :is(.dark .dark\:bg-theme-800) { - --tw-bg-opacity: 1; - background-color: @base; //background Color - } - - .dark { - --bg-color: @base; - --scrollbar-thumb: @accent-color; //ScrollBar - --scrollbar-track: @mantle; //Scrollbar base - } - - //Information Widget Features - - :is(.dark .dark\:bg-theme-200\/20) { - background-color: @overlay0 //Information Widgets Progress Bar Background -; - } - :is(.dark .dark\:bg-theme-200\/50) { - background-color: @text //Information Widgets Progress Bar Value -; - } - .border-theme-300 { - --tw-border-opacity: 1; - border-color: @surface0 !important; //Search bar Border (important is needed so top separator doesn't override) - } - :is(.dark .dark\:bg-white\/10) { - background-color: @base //Search bar background -; - } - :is(.dark .dark\:focus\:ring-white\/50:focus) { - --tw-ring-color: @text; //Search bar Focus Border - } - - :is(.dark .dark\:text-white) { - --tw-text-opacity: 1; - color: @accent-color //Search bar Text -; - } - - // Services Level Features - - :is(.dark .dark\:bg-white\/5) { - background-color: @mantle; //Box Background - } - :is(.dark .dark\:shadow-theme-900\/20) { - --tw-shadow-color: @mantle; //Box Shadows - --tw-shadow: var(--tw-shadow-colored); - } - - :is(.dark .dark\:hover\:bg-white\/10:hover) { - background-color: @surface1 //Box Hover Color -; - } - - :is(.dark .dark\:bg-theme-900\/50) { - background-color: @crust; //Ping & Docker Stats Box Background - } - :is(.dark .dark\:bg-theme-900\/20) { - background-color: @surface0; //Stats Background Color - } - - :is(.dark .dark\:bg-theme-900\/40) { - background-color: @accent-color; //Progress Bar - } - :is(.dark .dark\:text-theme-300) { - color: @text; //Section Names + Container Description - } - - // api error - .text-theme-900 { - --tw-border-opacity: 1; - color: @base; // api error text color - } - - .bg-rose-900\/80 { - --tw-border-opacity: 1; - background-color: @red; // api error box color - } - // - - :is(.dark .dark\:text-theme-400) { - --tw-border-opacity: 1; - color: @text; // update and version text - } - - .text-white { - color: @subtext1; // search bar icon - } - - :is(.dark .dark\:border-theme-200\/50) { - --tw-border-opacity: 1; - border-color: @surface2; // top separator - } - - :is(.dark .dark\:hover\:text-theme-300:hover) { - --tw-text-opacity: 1; - color: darken( - @accent-color, - 10% - ); //Section Names + Container Description Hover Color - } - :is(.dark .dark\:text-theme-200) { - --tw-text-opacity: 1; - color: @text; // Container Names + Stats - } - - .text-emerald-500\/80 { - color: lighten( - @green, - 10% - ); //Ping & Docker Status Text (Running + Healthy) - } - .text-orange-400\/50 { - color: lighten(@yellow, 10%); //Docker Status Text (Unhealthy) - } - .text-rose-500\/80 { - color: darken(@red, 10%); //Ping Status Text (Bad) - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/homepage/catppuccin.user.less b/styles/homepage/catppuccin.user.less new file mode 100644 index 0000000000..1b69d038a5 --- /dev/null +++ b/styles/homepage/catppuccin.user.less @@ -0,0 +1,152 @@ +/* ==UserStyle== +@name homepage Catppuccin +@namespace github.com/catppuccin/userstyles/styles/homepage +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/homepage +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/homepage/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahomepage +@description Soothing pastel theme for homepage +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("homepage.example.com"), + regexp("https?://homepage\\..*") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + //Page Level Features + + :is(.dark .dark\:bg-theme-800) { + --tw-bg-opacity: 1; + background-color: @base; //background Color + } + + .dark { + --bg-color: @base; + --scrollbar-thumb: @accent; //ScrollBar + --scrollbar-track: @mantle; //Scrollbar base + } + + //Information Widget Features + + :is(.dark .dark\:bg-theme-200\/20) { + background-color: @overlay0; //Information Widgets Progress Bar Background + } + :is(.dark .dark\:bg-theme-200\/50) { + background-color: @text; //Information Widgets Progress Bar Value + } + .border-theme-300 { + --tw-border-opacity: 1; + border-color: @surface0 + !important; //Search bar Border (important is needed so top separator doesn't override) + } + :is(.dark .dark\:bg-white\/10) { + background-color: @base; //Search bar background + } + :is(.dark .dark\:focus\:ring-white\/50:focus) { + --tw-ring-color: @text; //Search bar Focus Border + } + + :is(.dark .dark\:text-white) { + --tw-text-opacity: 1; + color: @accent; //Search bar Text + } + + // Services Level Features + + :is(.dark .dark\:bg-white\/5) { + background-color: @mantle; //Box Background + } + :is(.dark .dark\:shadow-theme-900\/20) { + --tw-shadow-color: @mantle; //Box Shadows + --tw-shadow: var(--tw-shadow-colored); + } + + :is(.dark .dark\:hover\:bg-white\/10:hover) { + background-color: @surface1; //Box Hover Color + } + + :is(.dark .dark\:bg-theme-900\/50) { + background-color: @crust; //Ping & Docker Stats Box Background + } + :is(.dark .dark\:bg-theme-900\/20) { + background-color: @surface0; //Stats Background Color + } + + :is(.dark .dark\:bg-theme-900\/40) { + background-color: @accent; //Progress Bar + } + :is(.dark .dark\:text-theme-300) { + color: @text; //Section Names + Container Description + } + + // api error + .text-theme-900 { + --tw-border-opacity: 1; + color: @base; // api error text color + } + + .bg-rose-900\/80 { + --tw-border-opacity: 1; + background-color: @red; // api error box color + } + // + + :is(.dark .dark\:text-theme-400) { + --tw-border-opacity: 1; + color: @text; // update and version text + } + + .text-white { + color: @subtext1; // search bar icon + } + + :is(.dark .dark\:border-theme-200\/50) { + --tw-border-opacity: 1; + border-color: @surface2; // top separator + } + + :is(.dark .dark\:hover\:text-theme-300:hover) { + --tw-text-opacity: 1; + color: darken( + @accent, + 10% + ); //Section Names + Container Description Hover Color + } + :is(.dark .dark\:text-theme-200) { + --tw-text-opacity: 1; + color: @text; // Container Names + Stats + } + + .text-emerald-500\/80 { + color: lighten( + @green, + 10% + ); //Ping & Docker Status Text (Running + Healthy) + } + .text-orange-400\/50 { + color: lighten(@yellow, 10%); //Docker Status Text (Unhealthy) + } + .text-rose-500\/80 { + color: darken(@red, 10%); //Ping Status Text (Bad) + } + } +} diff --git a/styles/homepage/preview.webp b/styles/homepage/preview.webp deleted file mode 100644 index b9ba43d2c7..0000000000 --- a/styles/homepage/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:f25115113bc4f54476fe8b8040b7f0dcef61677a2ccb05066df385ce4b0cf091 -size 51490 diff --git a/styles/hoogle/README.md b/styles/hoogle/README.md new file mode 100644 index 0000000000..dd5eecb44e --- /dev/null +++ b/styles/hoogle/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Hoogle + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [jn-sena](https://github.com/jn-sena) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/hoogle/catppuccin.user.less b/styles/hoogle/catppuccin.user.less new file mode 100644 index 0000000000..0d32d24275 --- /dev/null +++ b/styles/hoogle/catppuccin.user.less @@ -0,0 +1,254 @@ +/* ==UserStyle== +@name Hoogle Catppuccin +@namespace github.com/catppuccin/userstyles/styles/hoogle +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/hoogle +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/hoogle/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahoogle +@description Soothing pastel theme for Hoogle +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("hoogle.haskell.org") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + a { + color: @accent; + + &:hover { + background-color: @surface0; + } + } + + body { + background-color: @base; + color: @text; + } + + /* + * Top + */ + + #links { + background-color: @accent; + color: @surface1; + border-color: shade(@accent, 25%); + } + + #top-menu li { + border-color: @crust; + + a, + a:visited, + a:link { + color: @base; + } + a:hover { + background-color: fade(@overlay0, 30%); + } + } + + #logo { + img { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + &:hover { + background-color: transparent; + } + } + + #hoogle, + #scope, + #submit { + background-color: @mantle; + color: @subtext1; + border-style: solid; + border-width: 2px; + border-color: @surface0; + border-radius: 4px; + } + + .chosen-container { + .chosen-drop { + background-color: @mantle; + border-color: @surface0; + } + + .chosen-single { + background-image: none; + background-color: @mantle; + box-shadow: none; + border-style: solid; + border-width: 2px; + border-color: @surface0; + color: @subtext1; + } + + .chosen-default { + color: @crust; + } + + .chosen-search input { + border-color: @surface1; + border-radius: 4px; + } + + .chosen-results { + color: @subtext1; + + li.disabled-result { + color: @overlay0; + } + + li.highlighted { + background-image: none; + background-color: @accent; + color: @base; + } + + li.no-results { + color: @subtext1; + background-color: @mantle; + } + } + } + + /* + * Left + */ + + #left { + a { + color: @accent; + } + .plus { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + color: @green; + } + .minus { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + color: @red; + } + } + + /* + * Footer + */ + + #footer { + background-color: @crust; + color: @subtext1; + border-color: @overlay0; + } + + /* + * Other + */ + + .error { + border-color: @red; + } + + #example { + background-color: @mantle; + color: @subtext1; + border-color: @surface0; + } + + /* + * Results + */ + + .result.active { + background-color: @mantle; + } + + .ans { + background-color: @mantle; + border-color: @surface0; + + a { + color: @subtext1; + } + .name { + color: @accent; + } + } + + .links a { + color: @overlay1; + } + + .from a, + .p1, + .p2 { + color: @green; + } + + .doc, + .doc a { + color: @subtext1; + } + + .open { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + .shut { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .c0 { + background-color: @rosewater; + } + .c1 { + background-color: @green; + } + .c2 { + background-color: @lavender; + } + .c3 { + background-color: @yellow; + } + .c4 { + background-color: @pink; + } + .c5 { + background-color: @teal; + } + } +} diff --git a/styles/hoppscotch/README.md b/styles/hoppscotch/README.md index c1671c52ec..f8dc6aadd6 100644 --- a/styles/hoppscotch/README.md +++ b/styles/hoppscotch/README.md @@ -4,19 +4,18 @@

Logo
- Catppuccin for Hoppscotch + Catppuccin for Hoppscotch

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/hoppscotch/catppuccin.user.css b/styles/hoppscotch/catppuccin.user.css deleted file mode 100644 index 27c53375c1..0000000000 --- a/styles/hoppscotch/catppuccin.user.css +++ /dev/null @@ -1,131 +0,0 @@ -/* ==UserStyle== -@name Hoppscotch Catppuccin -@namespace github.com/catppuccin/userstyles/styles/hoppscotch -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/hoppscotch -@version 1.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/hoppscotch/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahoppscotch -@description Soothing pastel theme for Hoppscotch -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("hoppscotch.io") { - :root.dark { - #catppuccin(@darkFlavor, @accentColor); - } - - :root.light { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @accent-color-light-alpha: 1.1; - @accent-color-dark-alpha: 0.9; - @accent-gradient-from-color: 1.05; - @accent-gradient-via-color: 1.2; - @accent-gradient-to-color: 0.85; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --primary-color: @base; - --primary-light-color: @surface1; - --primary-dark-color: @crust; - --primary-contrast-color: @mantle; - --secondary-color: @subtext0; - --secondary-light-color: @subtext0; - --secondary-dark-color: @subtext1; - --divider-color: @overlay0; - --divider-light-color: @overlay1; - --divider-dark-color: @surface2; - --error-color: @red; - --tooltip-color: @text; - --popover-color: @crust; - --editor-theme: "vscode-esque"; - --editor-type-color: fade(@mauve, 0.9); - --editor-name-color: @blue; - --editor-operator-color: @mauve; - --editor-invalid-color: @maroon; - --editor-separator-color: @overlay0; - --editor-meta-color: @overlay0; - --editor-variable-color: @green; - --editor-link-color: @sapphire; - --editor-constant-color: fade(@lavender, 1.2); - --editor-keyword-color: @red; - --accent-color: @accent-color; - --accent-light-color: fade(@accent-color, @accent-color-light-alpha); - --accent-dark-color: fade(@accent-color, @accent-color-dark-alpha); - --accent-contrast-color: @crust; - --gradient-from-color: fade(@accent-color, @accent-gradient-from-color); - --gradient-via-color: fade(@accent-color, @accent-gradient-via-color); - --gradient-to-color: fade(@accent-color, @accent-gradient-to-color); - - --editor-process-color: @text; - - .อผ1 .cm-placeholder { - color: @text; - } - - .cm-focused .cm-activeLine { - background-color: @surface0; - } - - .cm-focused .cm-activeLineGutter { - background-color: @surface2; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/hoppscotch/catppuccin.user.less b/styles/hoppscotch/catppuccin.user.less new file mode 100644 index 0000000000..aed0de7b3d --- /dev/null +++ b/styles/hoppscotch/catppuccin.user.less @@ -0,0 +1,109 @@ +/* ==UserStyle== +@name Hoppscotch Catppuccin +@namespace github.com/catppuccin/userstyles/styles/hoppscotch +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/hoppscotch +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/hoppscotch/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahoppscotch +@description Soothing pastel theme for Hoppscotch +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("hoppscotch.io") { + :root.dark { + #catppuccin(@darkFlavor); + } + + :root.light { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + @accent-light-alpha: 1.1; + @accent-dark-alpha: 80%; + @accent-gradient-from-color: 1.05; + @accent-gradient-via-color: 1.2; + @accent-gradient-to-color: 0.85; + + --primary-color: @base; + --primary-light-color: @mantle; + --primary-dark-color: @crust; + --primary-contrast-color: @mantle; + --secondary-color: @subtext0; + --secondary-light-color: @subtext0; + --secondary-dark-color: @subtext1; + --divider-color: @surface0; + --divider-light-color: @surface0; + --divider-dark-color: @surface0; + --error-color: @red; + --tooltip-color: @text; + --popover-color: @crust; + --editor-theme: "vscode-esque"; + --editor-type-color: fade(@mauve, 90%); + --editor-name-color: @blue; + --editor-operator-color: @mauve; + --editor-invalid-color: @maroon; + --editor-separator-color: @overlay0; + --editor-meta-color: @overlay0; + --editor-variable-color: @green; + --editor-link-color: @sapphire; + --editor-constant-color: fade(@lavender, 1.2%); + --editor-keyword-color: @red; + --accent-color: @accent; + --accent-light-color: fade(@accent, @accent-light-alpha); + --accent-dark-color: fade(@accent, @accent-dark-alpha); + --accent-contrast-color: @crust; + --gradient-from-color: fade(@accent, @accent-gradient-from-color); + --gradient-via-color: fade(@accent, @accent-gradient-via-color); + --gradient-to-color: fade(@accent, @accent-gradient-to-color); + + --editor-process-color: @text; + --banner-info-color: fade(@blue, 20%); + + --method-get-color: @green; + --method-post-color: @yellow; + --method-put-color: @sapphire; + --method-patch-color: @mauve; + --method-delete-color: @red; + --method-head-color: @teal; + --method-options-color: @lavender; + --method-default-color: @overlay1; + --status-info-color: @blue; + --status-success-color: @green; + --status-redirect-color: @peach; + --status-critical-error-color: @red; + --status-server-error-color: @red; + --status-missing-data-color: @overlay0; + + .cm-editor { + background: @mantle; + + .cm-placeholder { + color: @text; + } + } + + .cm-focused .cm-activeLine { + background-color: @base; + } + + .cm-focused .cm-activeLineGutter { + background-color: @surface0; + } + + .cm-selectionBackground { + background: fade(@accent, 30%) !important; + } + } +} diff --git a/styles/hoppscotch/preview.webp b/styles/hoppscotch/preview.webp deleted file mode 100644 index 2e89fc18f6..0000000000 --- a/styles/hoppscotch/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:23308b1b27eb31401d64d14d73a10641bec5d47868a1a13c9ada32476dd23300 -size 184974 diff --git a/styles/hyperpipe/README.md b/styles/hyperpipe/README.md index 40eb633806..1fe862ee85 100644 --- a/styles/hyperpipe/README.md +++ b/styles/hyperpipe/README.md @@ -4,24 +4,25 @@

Logo
- Catppuccin for Hyperpipe + Catppuccin for Hyperpipe

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer -- [Sena](https://github.com/jn-sena) +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find! +## ๐Ÿ’– Past Maintainer +- [jn-sena](https://github.com/jn-sena)   diff --git a/styles/hyperpipe/catppuccin.user.css b/styles/hyperpipe/catppuccin.user.css deleted file mode 100644 index be2786475d..0000000000 --- a/styles/hyperpipe/catppuccin.user.css +++ /dev/null @@ -1,124 +0,0 @@ -/* ==UserStyle== -@name Hyperpipe Catppuccin -@namespace github.com/catppuccin/userstyles/styles/hyperpipe -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/hyperpipe -@version 0.1.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/hyperpipe/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahyperpipe -@description Soothing pastel theme for Hyperpipe -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("hyperpipe.surge.sh"), - domain("hyperpipe.esmailelbob.xyz"), - domain("listen.whatever.social"), - domain("music.adminforge.de"), - domain("music.pfcd.me"), - domain("listen.whateveritworks.org"), - domain("hyperpipe.frontendfriendly.xyz"), - domain("hyperpipe.drgns.space"), - domain("hyperpipe.projectsegfau.lt"), - domain("hp.ggtyler.dev"), - domain("hyperpipe.lunar.icu"), - domain("hp.iqbalrifai.eu.org"), - domain("hp.ngn.tf"), - domain("hyperpipe.ducks.party") { - @media (prefers-color-scheme: light) { - body { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - body { - #catppuccin(@darkFlavor, @accentColor); - } - } - - body[data-theme^="light"] { - #catppuccin(@lightFlavor, @accentColor); - } - - body[data-theme^="dark"], - body[data-theme^="black"], - body[data-theme^="dracula"], - body[data-theme^="nord"] { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --color-foreground: @accent-color !important; - --color-background: @base !important; - --color-background-soft: @surface0 !important; - --color-background-mute: @surface1 !important; - --color-border: @surface0 !important; - --color-border-hover: @overlay0 !important; - --color-shadow: @crust !important; - --color-blur: fade(@mantle, 45%) !important; - --color-gradient: linear-gradient( - 45deg, - @accent-color, - fade(@accent-color, 45%) - ); - --color-scrollbar: @accent-color !important; - --color-heading: @text !important; - --color-text: @text !important; - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/hyperpipe/catppuccin.user.less b/styles/hyperpipe/catppuccin.user.less new file mode 100644 index 0000000000..b371086662 --- /dev/null +++ b/styles/hyperpipe/catppuccin.user.less @@ -0,0 +1,62 @@ +/* ==UserStyle== +@name Hyperpipe Catppuccin +@namespace github.com/catppuccin/userstyles/styles/hyperpipe +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/hyperpipe +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/hyperpipe/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ahyperpipe +@description Soothing pastel theme for Hyperpipe +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("hyperpipe.surge.sh") { + body { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + body[data-theme^="light"] { + #catppuccin(@lightFlavor); + } + + body[data-theme^="dark"], + body[data-theme^="black"], + body[data-theme^="dracula"], + body[data-theme^="nord"] { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --color-foreground: @accent !important; + --color-background: @base !important; + --color-background-soft: @surface0 !important; + --color-background-mute: @surface1 !important; + --color-border: @surface0 !important; + --color-border-hover: @overlay0 !important; + --color-shadow: @crust !important; + --color-blur: fade(@mantle, 45%) !important; + --color-gradient: linear-gradient( + 45deg, + @accent, + fade(@accent, 45%) + ); + --color-scrollbar: @accent !important; + --color-heading: @text !important; + --color-text: @text !important; + } +} diff --git a/styles/hyperpipe/preview.webp b/styles/hyperpipe/preview.webp deleted file mode 100644 index 10521827df..0000000000 --- a/styles/hyperpipe/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:1afa5bea5bdc46916cee6246b8b69d0fcf53c86b01ae7e7afd45be81ddf6c38e -size 507634 diff --git a/styles/ichi.moe/README.md b/styles/ichi.moe/README.md index b7bf3d2b63..b22a224662 100644 --- a/styles/ichi.moe/README.md +++ b/styles/ichi.moe/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Ren](https://github.com/watatomo) +- [watatomo](https://github.com/watatomo)   diff --git a/styles/ichi.moe/catppuccin.user.css b/styles/ichi.moe/catppuccin.user.css deleted file mode 100644 index fa2e6d723f..0000000000 --- a/styles/ichi.moe/catppuccin.user.css +++ /dev/null @@ -1,428 +0,0 @@ -/* ==UserStyle== -@name ichi.moe Catppuccin -@namespace github.com/catppuccin/userstyles/styles/ichi.moe -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/ichi.moe -@version 1.1.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/ichi.moe/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aichi.moe -@description Soothing pastel theme for ichi.moe -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] - -@var checkbox zen "Zen Mode" 0 -==/UserStyle== */ - -@-moz-document domain("ichi.moe") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - html, - body { - background: @base; - color: @text; - } - - footer { - color: @subtext1; - } - - span.query-word:hover { - border-color: @pink; - } - - .panel-error { - background-color: fadeout(@red, 0.2); - } - - .highlight { - background-color: fadeout(@yellow, 0.2); - } - - .gloss { - & when (@lookup ="latte") { - background-color: @base; - border-color: @surface2; - } - background-color: @surface0; - border-color: @overlay0; - } - - .gloss-rtext { - & when (@lookup ="latte") { - border-color: @surface2; - } - border-color: @overlay0; - } - - .gloss:target { - & when (@lookup ="latte") { - box-shadow: 0 0 5px @surface2; - -webkit-box-shadow: 0 0 5px @surface2; - -moz-box-shadow: 0 0 5px @surface2; - } - box-shadow: 0 0 5px @overlay0; - -webkit-box-shadow: 0 0 5px @overlay0; - -moz-box-shadow: 0 0 5px @overlay0; - } - - a { - color: @sapphire; - } - - a.wiktionary-link { - color: @text; - } - - a.info-link { - color: @text; - } - - a.info-link:hover { - border-bottom-color: @sapphire; - } - - .note-skipped a { - color: @subtext1; - } - - .note-skipped a:hover { - border-color: @subtext1; - } - - .jspDrag { - & when (@lookup ="latte") { - background-color: @surface1; - } - background-color: @surface2; - } - - .conj-negative { - color: @red; - } - - .conj-formal { - color: @blue; - } - - .pos-desc { - color: @green; - } - - .reading-table tr:nth-of-type(2n) { - & when (@lookup ="latte") { - background: fadeout(@surface0, 0.5); - } - background: fadeout(@surface1, 0.5); - } - - table.kanji-match tr:nth-of-type(2n) { - & when (@lookup ="latte") { - background: fadeout(@surface0, 0.5); - } - background: fadeout(@surface1, 0.5); - } - - .kanji-big a { - color: @subtext1; - } - - .autocomplete-suggestions { - & when (@lookup ="latte") { - background: @base; - border-color: @surface2; - } - background: @surface0; - border-color: @overlay0; - } - - .autocomplete-selected { - & when (@lookup ="latte") { - background: @base; - } - background: @surface0; - } - - .autocomplete-suggestions strong { - color: @lavender; - } - - .autocomplete-group strong { - border-bottom-color: @text; - } - - .button { - background-color: @sapphire; - border-color: @sapphire; - color: @base; - } - - button:hover, - button:focus, - .button:hover, - .button:focus { - background-color: darken(@sapphire, 25%); - color: @base; - } - - h1, - h2, - h3, - h4, - h5, - h6 { - color: @text; - } - - input[type="text"], - input[type="password"], - input[type="date"], - input[type="datetime"], - input[type="datetime-local"], - input[type="month"], - input[type="week"], - input[type="email"], - input[type="number"], - input[type="search"], - input[type="tel"], - input[type="time"], - input[type="url"], - input[type="color"], - textarea, - input[type="file"], - input[type="checkbox"], - input[type="radio"], - select, - input[type="text"]:focus, - input[type="password"]:focus, - input[type="date"]:focus, - input[type="datetime"]:focus, - input[type="datetime-local"]:focus, - input[type="month"]:focus, - input[type="week"]:focus, - input[type="email"]:focus, - input[type="number"]:focus, - input[type="search"]:focus, - input[type="tel"]:focus, - input[type="time"]:focus, - input[type="url"]:focus, - input[type="color"]:focus, - textarea:focus, - input[type="file"]:focus, - input[type="checkbox"]:focus, - input[type="radio"]:focus, - select:focus { - & when (@lookup ="latte") { - background-color: @base; - border-color: @surface0; - } - background-color: @surface0; - border-color: @surface1; - color: @text; - } - - .header-nav a { - color: @pink; - } - - .header-nav a:hover { - color: darken(@pink, 15%); - } - - .jspTrack { - & when (@lookup ="latte") { - background: @surface0; - } - background: @surface1; - } - - .f-dropdown { - & when (@lookup ="latte") { - background-color: @base; - } - background-color: @surface0; - border-color: @subtext1; - } - - .f-dropdown::before { - border-color: transparent transparent @subtext1; - } - - span.query-pick { - color: @text; - } - - .has-tip { - color: @subtext1; - border-color: @overlay1; - } - - .has-tip:hover, - .has-tip:focus { - border-bottom-color: @sapphire; - color: @sapphire; - } - - label { - color: @subtext1; - } - - table { - background: @base; - & when (@lookup ="latte") { - background-color: @surface0; - } - background-color: @surface1; - } - - table tr th, - table tr td { - color: @subtext1; - } - - .kanji-table td { - & when (@lookup ="latte") { - border-color: @surface0; - } - border-color: @surface1; - } - - table tr.even, - table tr.alt, - table tr:nth-of-type(2n) { - & when (@lookup ="latte") { - background: fadeout(@surface0, 0.5); - } - background: fadeout(@surface1, 0.5); - } - - .reading-table tr ~ tr > td { - & when (@lookup ="latte") { - border-color: @surface0; - } - border-color: @surface1; - } - - table.kanji-match td { - & when (@lookup ="latte") { - border-color: @surface0; - } - border-color: @surface1; - } - - tr.match-row-kanji, - tr.match-row-reading { - & when (@lookup ="latte") { - border-color: @surface0; - } - border-color: @surface1; - } - - img { - filter: contrast(1.2) opacity(85%); - } - - /* Options */ - & when (@zen = 1) { - .header, - footer, - .landing-page { - display: none; - } - - div.wrapper { - display: flex; - flex-direction: column; - align-items: center; - place-content: center center; - padding: 50px 0; - min-height: 100vh; - margin: 0; - } - - .gloss-all { - width: 100%; - padding: 0 10px; - } - - #div-ichiran-result { - padding: 0 10px; - } - - #div-kanji-form, - #w-form { - width: 100%; - } - - #k-form > div > div, - #w-form > div > div { - width: 100%; - max-width: 304px; - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/ichi.moe/catppuccin.user.less b/styles/ichi.moe/catppuccin.user.less new file mode 100644 index 0000000000..1db2272c63 --- /dev/null +++ b/styles/ichi.moe/catppuccin.user.less @@ -0,0 +1,321 @@ +/* ==UserStyle== +@name ichi.moe Catppuccin +@namespace github.com/catppuccin/userstyles/styles/ichi.moe +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/ichi.moe +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/ichi.moe/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aichi.moe +@description Soothing pastel theme for ichi.moe +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] + +@var checkbox zen "Zen Mode" 0 +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("ichi.moe") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + html, + body { + background: @base; + color: @text; + } + + footer { + color: @subtext1; + } + + span.query-word:hover { + border-color: @pink; + } + + .panel-error { + background-color: fade(@red, 80%); + } + + .highlight { + background-color: fade(@yellow, 80%); + } + + .gloss { + background-color: if(@flavor = "latte", @base, @surface0); + } + + .gloss, + .gloss-rtext { + border-color: if(@flavor = "latte", @surface2, @overlay0); + } + + .gloss:target { + & when (@flavor = "latte") { + box-shadow: 0 0 5px @surface2; + -webkit-box-shadow: 0 0 5px @surface2; + -moz-box-shadow: 0 0 5px @surface2; + } + box-shadow: 0 0 5px @overlay0; + -webkit-box-shadow: 0 0 5px @overlay0; + -moz-box-shadow: 0 0 5px @overlay0; + } + + a { + color: @sapphire; + } + + a.wiktionary-link { + color: @text; + } + + a.info-link { + color: @text; + } + + a.info-link:hover { + border-bottom-color: @sapphire; + } + + .note-skipped a { + color: @subtext1; + } + + .note-skipped a:hover { + border-color: @subtext1; + } + + .jspDrag { + background-color: if(@flavor = "latte", @surface1, @surface2); + } + + .conj-negative { + color: @red; + } + + .conj-formal { + color: @blue; + } + + .pos-desc { + color: @green; + } + + .reading-table tr:nth-of-type(2n), + table.kanji-match tr:nth-of-type(2n) { + background: fade(if(@flavor = "latte", @surface0, @surface1), 50%); + } + + .kanji-big a { + color: @subtext1; + } + + .autocomplete-suggestions { + border-color: if(@flavor = "latte", @surface2, @overlay0); + } + + .autocomplete-suggestions, + .autocomplete-selected { + background: if(@flavor = "latte", @base, @surface0); + } + + .autocomplete-suggestions strong { + color: @lavender; + } + + .autocomplete-group strong { + border-bottom-color: @text; + } + + .button { + background-color: @sapphire; + border-color: @sapphire; + color: @base; + } + + button:hover, + button:focus, + .button:hover, + .button:focus { + background-color: darken(@sapphire, 25%); + color: @base; + } + + h1, + h2, + h3, + h4, + h5, + h6 { + color: @text; + } + + input[type="text"], + input[type="password"], + input[type="date"], + input[type="datetime"], + input[type="datetime-local"], + input[type="month"], + input[type="week"], + input[type="email"], + input[type="number"], + input[type="search"], + input[type="tel"], + input[type="time"], + input[type="url"], + input[type="color"], + textarea, + input[type="file"], + input[type="checkbox"], + input[type="radio"], + select, + input[type="text"]:focus, + input[type="password"]:focus, + input[type="date"]:focus, + input[type="datetime"]:focus, + input[type="datetime-local"]:focus, + input[type="month"]:focus, + input[type="week"]:focus, + input[type="email"]:focus, + input[type="number"]:focus, + input[type="search"]:focus, + input[type="tel"]:focus, + input[type="time"]:focus, + input[type="url"]:focus, + input[type="color"]:focus, + textarea:focus, + input[type="file"]:focus, + input[type="checkbox"]:focus, + input[type="radio"]:focus, + select:focus { + & when (@flavor = "latte") { + background-color: @base; + border-color: @surface0; + } + background-color: @surface0; + border-color: @surface1; + color: @text; + } + + .header-nav a { + color: @pink; + } + + .header-nav a:hover { + color: darken(@pink, 15%); + } + + .jspTrack { + background: if(@flavor = "latte", @surface0, @surface1); + } + + .f-dropdown { + background-color: if(@flavor = "latte", @base, @surface0); + border-color: @subtext1; + } + + .f-dropdown::before { + border-color: transparent transparent @subtext1; + } + + span.query-pick { + color: @text; + } + + .has-tip { + color: @subtext1; + border-color: @overlay1; + } + + .has-tip:hover, + .has-tip:focus { + border-bottom-color: @sapphire; + color: @sapphire; + } + + label { + color: @subtext1; + } + + table { + background: @base; + background-color: if(@flavor = "latte", @surface0, @surface1); + } + + table tr th, + table tr td { + color: @subtext1; + } + + table tr.even, + table tr.alt, + table tr:nth-of-type(2n) { + background: fade(if(@flavor = "latte", @surface0, @surface1), 50%); + } + + .kanji-table td, + .reading-table tr ~ tr > td, + table.kanji-match td, + tr.match-row-kanji, + tr.match-row-reading { + border-color: if(@flavor = "latte", @surface0, @surface1); + } + + img { + filter: contrast(1.2) opacity(85%); + } + + /* Options */ + & when (@zen = 1) { + .header, + footer, + .landing-page { + display: none; + } + + div.wrapper { + display: flex; + flex-direction: column; + align-items: center; + place-content: center center; + padding: 50px 0; + min-height: 100vh; + margin: 0; + } + + .gloss-all { + width: 100%; + padding: 0 10px; + } + + #div-ichiran-result { + padding: 0 10px; + } + + #div-kanji-form, + #w-form { + width: 100%; + } + + #k-form > div > div, + #w-form > div > div { + width: 100%; + max-width: 304px; + } + } + } +} diff --git a/styles/ichi.moe/preview.webp b/styles/ichi.moe/preview.webp deleted file mode 100644 index 746240471d..0000000000 --- a/styles/ichi.moe/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:184d8aa5341bebf1ad5b6122d61969fc929fbbf1b790c9e9114ce3fb7cc26033 -size 240882 diff --git a/styles/indie-wiki-buddy/README.md b/styles/indie-wiki-buddy/README.md new file mode 100644 index 0000000000..016391b98d --- /dev/null +++ b/styles/indie-wiki-buddy/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Indie Wiki Buddy + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [thismoon](https://github.com/thismoon) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/indie-wiki-buddy/catppuccin.user.less b/styles/indie-wiki-buddy/catppuccin.user.less new file mode 100644 index 0000000000..90172a7c6c --- /dev/null +++ b/styles/indie-wiki-buddy/catppuccin.user.less @@ -0,0 +1,115 @@ +/* ==UserStyle== +@name Indie Wiki Buddy Catppuccin +@namespace github.com/catppuccin/userstyles/styles/indie-wiki-buddy +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/indie-wiki-buddy +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/indie-wiki-buddy/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aindie-wiki-buddy +@description Soothing pastel theme for Indie Wiki Buddy +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +/* +To get a list of supported search engines, run the following command: +curl -s https://raw.githubusercontent.com/KevinPayravi/indie-wiki-buddy/main/manifest-firefox.json | python -c "import sys, json;print(*json.loads(sys.stdin.read())['content_scripts'][2]['matches'], sep='\n')" +*/ +@-moz-document domain("bing.com"), + domain("search.brave.com"), + domain("duckduckgo.com"), + domain("ecosia.org"), + domain("kagi.com"), + domain("qwant.com"), + domain("search.yahoo.com"), + domain("startpage.com"), + domain("ya.ru"), + regexp("^https?://(www\\.)?google\\..*"), + regexp("^https?://(www\\.)?yandex\\..*") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + + .iwb-new-link button { + color: @base; + background: @blue; + &:hover { + background: @sky; + } + } + .iwb-result-controls { + color: @text !important; + } + } +} + +@-moz-document domain("fandom.com"), + domain("fextralife.com"), + domain("neoseeker.com"), + domain("breezewiki.com"), + domain("antifandom.com"), + domain("bw.artemislena.eu"), + domain("breezewiki.catsarch.com"), + domain("breezewiki.esmailelbob.xyz"), + domain("breezewiki.frontendfriendly.xyz"), + domain("bw.hamstro.dev"), + domain("breeze.hostux.net"), + domain("breezewiki.hyperreal.coffee"), + domain("breeze.mint.lgbt"), + domain("breezewiki.nadeko.net"), + domain("nerd.whatever.social"), + domain("breeze.nohost.network"), + domain("z.opnxng.com"), + domain("bw.projectsegfau.lt"), + domain("breezewiki.pussthecat.org"), + domain("bw.vern.cc"), + domain("breeze.whateveritworks.org"), + domain("breezewiki.woodland.cafe") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + + .indie-wiki-banner { + background: @mantle; + color: @text; + ::selection { + background-color: fade(@accent, 30%); + } + } + .indie-wiki-banner-exit { + color: @text; + } + .indie-wiki-banner-link { + color: @blue; + + &:hover { + color: @sky; + } + } + .indie-wiki-banner-disabled { + color: @subtext0; + } + } +} diff --git a/styles/inoreader/README.md b/styles/inoreader/README.md index 359748a961..40c9045c74 100644 --- a/styles/inoreader/README.md +++ b/styles/inoreader/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Thomas Philippot](https://github.com/thomas-philippot) +- [thomas-philippot](https://github.com/thomas-philippot)   diff --git a/styles/inoreader/catppuccin.user.css b/styles/inoreader/catppuccin.user.less similarity index 70% rename from styles/inoreader/catppuccin.user.css rename to styles/inoreader/catppuccin.user.less index b1119d0f3d..88ba27c309 100644 --- a/styles/inoreader/catppuccin.user.css +++ b/styles/inoreader/catppuccin.user.less @@ -2,8 +2,8 @@ @name inoreader Catppuccin @namespace github.com/catppuccin/userstyles/styles/inoreader @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/inoreader -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/inoreader/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/inoreader/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ainoreader @description Soothing pastel theme for inoreader @author Catppuccin @@ -15,59 +15,21 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('inoreader.com') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("inoreader.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); body, .inno_dialog, @@ -106,6 +68,7 @@ .inno_toolbar_button, #sb_rp_heading, .article_header_text, + .article_content, .profile_menu_themes_heading, .inno_toolbar_switcher_button:hover, #sb_rp_heading span.icon16, @@ -123,14 +86,21 @@ .inno_tabs_wrapper .inno_tabs_header .inno_tabs_tab a:link, .inno_tabs_wrapper .inno_tabs_header .inno_tabs_tab a:active, .inno_tabs_wrapper .inno_tabs_header .inno_tabs_tab a:visited, - #tabs_pane .nav-item a i, - #tabs_pane .nav-item a { + #tree_pane .plus_img { color: @text; } - a.text-color { + a.text-color, + a.nav-item-btn, + .icon-arrow_collapse { color: @text !important; } + .progress { + --bs-progress-bar-color: @accent; + --bs-progress-bar-bg: @accent; + --bs-bar-bg: @overlay1; + } + .text-muted-color { color: @subtext0 !important; } @@ -156,28 +126,44 @@ background-color: @text; } - .st_usage_slider_inner { - background-color: @accent-color; + .st_usage_slider_inner, + #text-menu .dropdown-menu, + .article_unreaded .article_unread_dot .article_unread_dot_internal { + background-color: @accent; + } + + .bg-primary { + background-color: @accent !important; } #tree_pane .parent_div_inner_selected .plus_img { - color: @accent-color; + color: @accent; } .active-url .item-name, .active-url span[class^="icon-"].h4, .active-url i[class^="icon-"].h4 { - color: @accent-color !important; + color: @accent !important; + } + + .icon-logo_circle { + color: @crust !important; } - #tree_pane .plus_img, #tabs_pane .nav-item a i, + #tabs_pane .nav-item a span, #tabs_pane #bottom_tabs .nav-item a i { - color: @text; + color: @crust; + } + + #tabs_pane .tabs-counter, + #tabs_pane #bottom_tabs .nav-item a i.icon-full { + color: @text !important; + background-color: @base !important; } #hint-pref { - fill: @accent-color; + fill: @accent; } .article_footer_buttons.icon-article_topbar_read_later_full, @@ -210,8 +196,8 @@ } .tabs-counter { - background-color: @blue !important; - outline-color: @blue !important; + background-color: @accent !important; + outline-color: @accent !important; color: @mantle; } @@ -258,7 +244,7 @@ #header_pane, .search_context_dropdown.open { - background-color: @mantle !important; + background-color: @base !important; color: @text; } @@ -290,7 +276,7 @@ .dropdown-menu .dropdown-item:active { background-color: @surface0; - color: @accent-color; + color: @accent; } .dropdown-menu .dropdown-item.active, @@ -301,7 +287,7 @@ .nav.nav-hover .active-url, .lang_bubble.lang_bubble_current { background-color: @surface1; - color: @accent-color; + color: @accent; } .btn.btn-outline-text { @@ -312,8 +298,8 @@ .btn.btn-primary, .btn.btn-primary:hover { color: @text; - background-color: @accent-color; - border-color: @accent-color; + background-color: @accent; + border-color: @accent; } .dropdown-menu-active, @@ -333,8 +319,8 @@ button:focus, input[type="password"]:focus, input[type="email"]:focus { - box-shadow: 0 0 3px @accent-color !important; - border-color: @accent-color !important; + box-shadow: 0 0 3px @accent !important; + border-color: @accent !important; } input[type="text"], @@ -356,6 +342,16 @@ div.article_magazine.article_bulk_selected { box-shadow: 0 0 0 1px @subtext0; } + .view_style_3 #reader_pane .ar.article_current .article_tile_picture { + box-shadow: inset 3px 3px 0 -2px @accent, inset -3px 2px 0 -2px @accent; + } + .view_style_3 #reader_pane .ar.article_current { + box-shadow: inset 0 0 0 1px @accent; + } + + .view_style_4 #reader_pane .ar.article_current { + box-shadow: 0 0 0 1px @accent; + } .view_style_2 #reader_pane .ar.article_current_3way, .view_style_2 #reader_pane .ar.article_expanded { box-shadow: none; @@ -396,22 +392,22 @@ .inno_tabs_header .inno_tabs_tab.inno_tabs_tab_current a:visited { - color: @accent-color !important; + color: @accent !important; } #new_articles_overlay { - color: @accent-color; + color: @accent; background-color: @base; } input.apple-switch:checked { - background-color: @accent-color; - border-color: @accent-color; + background-color: @accent; + border-color: @accent; } .add_content_simulated_button.expanded { background-color: @surface0; - box-shadow: inset 0 -1px 0 0 @accent-color; + box-shadow: inset 0 -1px 0 0 @accent; } .inno_toolbar_button_menu, @@ -440,14 +436,14 @@ .bluebutton, .inno_dialog .inno_dialog_buttonbar_button:nth-child(1) { - background-color: @accent-color; + background-color: @accent; color: @crust; border-style: none; } .inno_dialog .inno_dialog_buttonbar_button:nth-child(1):hover:enabled { - background-color: @accent-color; - border-color: @accent-color; + background-color: @accent; + border-color: @accent; } .inno_dialog_buttonbar_button { @@ -523,8 +519,8 @@ input[type="checkbox"].form-check-input:checked, input[type="radio"].form-check-input:checked { - background-color: @accent-color; - border-color: @accent-color; + background-color: @accent; + border-color: @accent; } .normal_dim { @@ -535,7 +531,7 @@ #preferences_header, #tabs_pane, .add_content_simulated_button_menu_line_item:hover { - background-color: @accent-color; + background-color: @accent; color: @mantle; } @@ -546,15 +542,11 @@ .article_tile.article_unreaded.article_expanded { background-color: @base; - box-shadow: - 0 1px 8px @mantle, - 0 1px 3px @mantle; + box-shadow: 0 1px 8px @mantle, 0 1px 3px @mantle; } div.article_current_3way { - box-shadow: - inset 0 0 0 1 @accent-color, - inset 5px 0 0 0 @accent-color; + box-shadow: inset 0 0 0 1 @accent, inset 5px 0 0 0 @accent; } div.article_tile.article_expanded { @@ -569,24 +561,22 @@ .inno_toolbar_switcher:hover .inno_toolbar_switcher_button_active, .inno_toolbar_switcher:hover .inno_toolbar_switcher_button_active:hover { - color: @accent-color; + color: @accent; background-color: @base; - border-color: @accent-color; + border-color: @accent; } .inno_tabs_tab:hover { - color: @accent-color; - border-color: @accent-color; + color: @accent; + border-color: @accent; } - } -} -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; + #audio_player_nav.is-overlay .tab-content, + #audio_player_nav .media-player.maximized .container, + #notifications_nav.is-overlay .tab-content, + #support_nav.is-overlay .tab-content, + #profile_nav.is-overlay .tab-content { + background-color: @base; + } + } } - -// vim:ft=less diff --git a/styles/inoreader/preview.webp b/styles/inoreader/preview.webp deleted file mode 100644 index c507ade90f..0000000000 --- a/styles/inoreader/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:e1734a437d28f146f4ff0ff76347d555681272c475cde310afbd580ab4b4cf81 -size 159466 diff --git a/styles/instagram/README.md b/styles/instagram/README.md index 257186c31d..63b1e77833 100644 --- a/styles/instagram/README.md +++ b/styles/instagram/README.md @@ -10,20 +10,19 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer - [GenShibe](https://github.com/GenShibe) ## ๐Ÿ’– Past Maintainer -- [Isabel](https://github.com/isabelroses) +- [isabelroses](https://github.com/isabelroses)   diff --git a/styles/instagram/catppuccin.user.css b/styles/instagram/catppuccin.user.less similarity index 51% rename from styles/instagram/catppuccin.user.css rename to styles/instagram/catppuccin.user.less index 7860b3f80b..e7729da6e3 100644 --- a/styles/instagram/catppuccin.user.css +++ b/styles/instagram/catppuccin.user.less @@ -2,8 +2,8 @@ @name Instagram Catppuccin @namespace github.com/catppuccin/userstyles/styles/instagram @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/instagram -@version 0.2.7 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/instagram/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/instagram/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ainstagram @description Soothing pastel theme for Instagram @author Catppuccin @@ -15,59 +15,22 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('instagram.com') { +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("instagram.com") { ._aa4d { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } ._aa4c { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @text-filter: @catppuccin[@@lookup][@text-filter]; - @dark-color: if(@lookup = latte, @text, @crust); - @light-color: if(@lookup = latte, @crust, @text); - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + @dark-color: if(@flavor = latte, @text, @crust); + @light-color: if(@flavor = latte, @crust, @text); &, .x1qjc9v5, @@ -76,52 +39,59 @@ .xdt5ytf, .x1iyjqo2, .xl56j7k { - --web-always-black: #rgbify(@dark-color) []; - --ig-primary-icon: #rgbify(@text) []; - --web-always-white: #rgbify(@light-color) []; - --always-white: #rgbify(@light-color) []; - --overlay-alpha-80: fadeout(@dark-color, 50); - --grey-9: #rgbify(@crust) []; - --ig-primary-background: #rgbify(@base) []; - --ig-secondary-background: #rgbify(@surface0) []; - --ig-banner-background: #rgbify(@crust) []; - --ig-highlight-background: #rgbify(@surface0) []; - --ig-elevated-background: #rgbify(@crust) []; - --ig-elevated-highlight-background: #rgbify(@surface0) []; - --ig-hover-overlay: #rgbify(@text) [], 0.1; - --hover-overlay: fadeout(@surface0, 80); - --ig-text-on-color: #rgbify(@crust) []; - --ig-badge: #rgbify(@accent-color) []; - --ig-primary-button: #rgbify(@accent-color) []; - --ig-primary-button-hover: fadeout(@accent-color, 20); - --ig-secondary-button-background: #rgbify(@surface0) []; - --ig-secondary-button-hover: #rgbify(@surface1) []; - --ig-secondary-button: #rgbify(@text) []; - --ig-primary-text: #rgbify(@text) []; - --ig-secondary-text: #rgbify(@subtext0) []; - --ig-tertiary-text: #rgbify(@subtext0) []; + --web-always-black: #lib.rgbify(@dark-color)[]; + --ig-primary-icon: #lib.rgbify(@text)[]; + --web-always-white: #lib.rgbify(@light-color)[]; + --always-white: #lib.rgbify(@light-color)[]; + --overlay-alpha-80: fade(@dark-color, 50%); + --grey-9: #lib.rgbify(@crust)[]; + --ig-primary-background: #lib.rgbify(@base)[]; + --ig-secondary-background: #lib.rgbify(@surface0)[]; + --ig-banner-background: #lib.rgbify(@crust)[]; + --ig-highlight-background: #lib.rgbify(@surface0)[]; + --ig-elevated-background: #lib.rgbify(@crust)[]; + --ig-elevated-highlight-background: #lib.rgbify(@surface0)[]; + --ig-hover-overlay: #lib.rgbify(@text)[], 0.1; + --hover-overlay: fade(@surface0, 20%); + --ig-text-on-color: #lib.rgbify(@crust)[]; + --ig-badge: #lib.rgbify(@accent)[]; + --ig-primary-button: #lib.rgbify(@accent)[]; + --ig-primary-button-hover: fade(@accent, 80%); + --ig-secondary-button-background: #lib.rgbify(@surface0)[]; + --ig-secondary-button-hover: #lib.rgbify(@surface1)[]; + --ig-secondary-button: #lib.rgbify(@text)[]; + --ig-primary-text: #lib.rgbify(@text)[]; + --ig-secondary-text: #lib.rgbify(@subtext0)[]; + --ig-tertiary-text: #lib.rgbify(@subtext0)[]; --wbloks-primary-text: @text; - --ig-text-on-media: #rgbify(@text) []; - --ig-separator: #rgbify(@surface0) []; - --chat-admin-text-color: #rgbify (@subtext0) []; - --ig-elevated-separator: #rgbify(@surface0) []; - --post-separator: #rgbify(@overlay0) []; - --ig-stroke: #rgbify(@overlay0) []; - --grey-2: #rgbify(@overlay0) []; - --ig-link: #rgbify(@accent-color) []; - --ig-error-or-destructive: #rgbify(@red) []; - --ig-success: #rgbify(@green) []; - --blue-2: #rgbify(@blue) []; - --ig-close-friends-refreshed: #rgbify(@green) []; - --ig-text-input-border-hover-prism: #rgbify(@surface1) []; - --ig-toggle-outline-prism: #rgbify(@text) []; - --ig-toggle-background-on-prism: #rgbify(@text) []; - --ig-stroke-prism: #rgbify(@crust) []; - --barcelona-logo: #rgbify (@text) []; - --ig-bubble-background: #rgbify (@surface1) []; - --ig-tertiary-icon: #rgbify (@accent-color) []; - --always-dark-overlay: @accent-color; - scrollbar-color: @accent-color @crust; + --ig-text-on-media: #lib.rgbify(@text)[]; + --ig-separator: #lib.rgbify(@surface0)[]; + --chat-admin-text-color: #lib.rgbify(@subtext0)[]; + --ig-elevated-separator: #lib.rgbify(@surface0)[]; + --post-separator: #lib.rgbify(@overlay0)[]; + --ig-stroke: #lib.rgbify(@overlay0)[]; + --grey-2: #lib.rgbify(@overlay0)[]; + --ig-link: #lib.rgbify(@accent)[]; + --ig-error-or-destructive: #lib.rgbify(@red)[]; + --ig-success: #lib.rgbify(@green)[]; + --blue-2: #lib.rgbify(@blue)[]; + --ig-close-friends-refreshed: #lib.rgbify(@green)[]; + --ig-text-input-border-hover-prism: #lib.rgbify(@surface1)[]; + --ig-toggle-outline-prism: #lib.rgbify(@text)[]; + --ig-toggle-background-on-prism: #lib.rgbify(@text)[]; + --ig-stroke-prism: #lib.rgbify(@crust)[]; + --barcelona-logo: #lib.rgbify(@text)[]; + --ig-bubble-background: #lib.rgbify(@surface1)[]; + --ig-tertiary-icon: #lib.rgbify(@accent)[]; + --always-dark-overlay: @accent; + --secondary-text: @subtext0; + --primary-text: @text; + --primary-icon: @accent; + --primary-button-text: @mantle !important; + --primary-button: @blue !important; + --mwp-primary-theme-color: darken(@blue, 10%); + --chat-composer-button-color: darken(@blue, 10%); + scrollbar-color: @accent @crust; } #splash-screen { background-color: @base !important; @@ -148,12 +118,12 @@ /* Story progress bar */ ._ac3p { - background-color: @accent-color !important; + background-color: @accent !important; } /* close friends story things */ .x9bdzbf { - color: @mantle !important; + color: @text !important; } /* Story seen / not seen ring */ @@ -168,7 +138,7 @@ } &[aria-label^="Story by"][aria-label$="not seen"] span { - outline-color: @accent-color; + outline-color: @accent; outline-width: 0.2rem; } &[aria-label^="Story by"]:not([aria-label$="not seen"]) span { @@ -182,7 +152,7 @@ background-color: @mantle; border-color: @overlay0 !important; border-radius: var(--modal-border-radius); - box-shadow: 0 3px 5px -1px fadeout(@dark-color, 20); + box-shadow: 0 3px 5px -1px fade(@dark-color, 80%); box-sizing: border-box; } ._aatc ._aasi, @@ -192,14 +162,27 @@ } /* Icons */ - svg[aria-label="Unlike"] { - fill: @accent-color; + svg[aria-label="Unlike"], + svg[aria-label="Verified"] { + fill: @accent !important; } + svg[aria-label="Next"], + svg[aria-label="Go back"], svg[aria-label="Close"] { - color: @text; + fill: @text !important; } - svg[aria-label="Verified"] { - fill: @accent-color; + + /* new post thingy */ + ._aa1q._aa1q { + color: @text !important; + } + + /* sumting wong's popup box */ + .x879a55, + .x7ywyr2:not( + [style*="background-color: rgb(var(--ig-highlight-background))"] + ) { + background-color: var(--surface1) !important; } /* Share box */ @@ -208,13 +191,13 @@ color: @text !important; &:hover { color: @mantle !important; - background-color: @accent-color !important; + background-color: @accent !important; } } .xk5f4mz { background-color: @mantle; &:hover { - background-color: @accent-color; + background-color: @accent; } } .x3nfvp2 { @@ -226,12 +209,12 @@ /* reel icon */ .xq3z1fi { - color: @accent-color !important; + color: @accent !important; } /* Toggle sliders */ .x1r7x56h { - background-color: @accent-color; + background-color: @accent; } .x100vrsf { background-color: @surface0; @@ -241,7 +224,7 @@ background-color: @mantle; } span[data-bloks-name="bk.components.TextSpan"] { - color: @accent-color !important; + color: @accent !important; } .xs7f9wi { background-color: @mantle !important; @@ -255,286 +238,286 @@ } /* Excluded: - _9ys7, _9_1f, _9ys8 (verified icon) */ [style*='background-image: url("https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png")'], - ._9zkj, - ._a3ds, - ._a3dt, - ._a3du, - ._a3dv, - ._a3dw, - ._9-b3, - ._9znl, - ._9z-6, - ._a3dx, - ._a3dy, - ._a3dz, - ._a3d-, - ._a3d_, - ._a3e0, - ._9zm4, - ._a3e1, - ._a3e2, - ._a3e3, - ._a3e4, - ._a3e5, - ._a3e6, - ._a3e7, - ._a3e8, - ._a3e9, - ._a3ea, - ._9_57, - ._9_n5, - ._9-y3, - ._a3eb, - ._a3ec, - ._a3ed, - ._a3ee, - ._9zlu, - ._9-yp, - ._a3ef, - ._a3eg, - ._9_wm, - ._a3eh, - ._a3ei, - ._9-j_, - ._a3ej, - ._a3ek, - ._9_ij, - ._9_d_, - ._9_e1, - ._9-mm, - ._9_cx, - ._9zm0, - ._9zfi, - ._9-ub, - ._a3el, - ._9-7-, - ._9-1a, - ._a3em, - ._9zrp, - ._a3en, - ._9zz9, - ._a3eo, - ._9zmr, - ._9-8d, - ._9zhi, - ._a3ep, - ._9zs0, - ._9-j-, - ._a3eq, - ._9zli, - ._9_4y, - ._9zm2, - ._9zfj, - ._9zlg, - ._a3er, - ._9-lv, - ._9_ug, - ._9_sh, - ._9_sj, - ._9-k0, - ._9z-c, - ._9_35, - ._9_hh, - ._a3es, - ._a3et, - ._a3eu, - ._9-v-, - ._9_4d, - ._9zlh, - ._a3ev, - ._a3ew, - ._a3ex, - ._a3ey, - ._9_7m, - ._9_fv, - ._a3ez, - ._9-zf, - ._9-zg, - ._9-ze, - ._a9fa, - ._9-zh, - ._9-zi, - ._9-zj, - ._9-zk, - ._9-zl, - ._9-zm, - ._9-zn, - ._9-zo, - ._9-zp, - ._9-zq, - ._9-zr, - ._9-zs, - ._9-zt, - ._a3op, - ._a3oq, - ._9-zu, - ._9-zv, - ._9-zw, - ._9-zx, - ._9-zy, - ._9-zz, - ._9-z-, - ._a3or, - ._a3ot, - ._a3os, - ._9zs1, - ._9zs2, - ._9-z_, - ._9--0, - ._9--1, - ._9--2, - ._9--3, - ._9--4, - ._9--5, - ._9--6, - ._9--7, - ._9--f, - ._9--8, - ._9--9, - ._9--a, - ._9--b, - ._9--c, - ._9--d, - ._9--e, - ._a3ou, - ._9--g, - ._9--h, - ._9--i, - ._9--j, - ._9--l, - ._9--k, - ._9--m, - ._9--n, - ._9--o, - ._9--p, - ._9--q, - ._a3ov, - ._9--s, - ._9--r, - ._9--t, - ._9--u, - ._9--v, - ._9--x, - ._9--y, - ._9--w, - ._9--z, - ._9--_, - ._9-_0, - ._9-_1, - ._9-_2, - ._9-_3, - ._9---, - ._9-_4, - ._9-_5, - ._9-_6, - ._9-_7, - ._a3wy, - ._9-_8, - ._9-_9, - ._a3ow, - ._9-_a, - ._9-_b, - ._9-_c, - ._9-_d, - ._9-_e, - ._9-_f, - ._9-_g, - ._9-_h, - ._9-_i, - ._9-_j, - ._9-_k, - ._9-_l, - ._9-_m, - ._9-_n, - ._9-_o, - ._a3ox, - ._9-_p, - ._9-_q, - ._a9fb, - ._9-_t, - ._9-_r, - ._9-_s, - ._a93g, - ._9-_u, - ._9-_v, - ._a9fc, - ._9-_w, - ._9-_x, - ._9-_y, - ._9-_z, - ._9-_-, - ._9-__, - ._9_00, - ._a3oy, - ._9_01, - ._9_02, - ._9_03, - ._9_04, - ._9_05, - ._9_08, - ._9_09, - ._9_07, - ._9_06, - ._9_0a, - ._9_0b, - ._9_0c, - ._9_0d, - ._9_0e, - ._9_0f, - ._9_0g, - ._a93h, - ._9_0h, - ._9_0i, - ._9_0j, - ._9_0k, - ._aepo, - ._9_0l, - ._9_0m, - ._9_0n, - ._9_0o, - ._9_0p, - ._a3oz, - ._a93l, - ._9_0r, - ._9_0s, - ._a7tk, - ._9_0q, - ._a3o-, - ._9_0t, - ._9_0v, - ._9_0u, - ._a9ej, - ._9_0w, - ._9_0x, - ._9_0y, - ._9_0z, - ._9_0_, - ._9_0-, - ._9_10, - ._9_11, - ._9_12, - ._9_13, - ._9_14, - ._9_15, - ._a3o_, - ._9_18, - ._9_19, - ._9_1a, - ._9_1e, - ._9_1b, - ._9_1c, - ._9_1d, - ._9_16, - ._9_17, - ._a3p0, - ._9_1g, - ._9_1i, - ._9_1h, - ._9_1j, - ._9_1k, - ._9_1l, - ._9_1m, - ._a9pw { + ._9zkj, + ._a3ds, + ._a3dt, + ._a3du, + ._a3dv, + ._a3dw, + ._9-b3, + ._9znl, + ._9z-6, + ._a3dx, + ._a3dy, + ._a3dz, + ._a3d-, + ._a3d_, + ._a3e0, + ._9zm4, + ._a3e1, + ._a3e2, + ._a3e3, + ._a3e4, + ._a3e5, + ._a3e6, + ._a3e7, + ._a3e8, + ._a3e9, + ._a3ea, + ._9_57, + ._9_n5, + ._9-y3, + ._a3eb, + ._a3ec, + ._a3ed, + ._a3ee, + ._9zlu, + ._9-yp, + ._a3ef, + ._a3eg, + ._9_wm, + ._a3eh, + ._a3ei, + ._9-j_, + ._a3ej, + ._a3ek, + ._9_ij, + ._9_d_, + ._9_e1, + ._9-mm, + ._9_cx, + ._9zm0, + ._9zfi, + ._9-ub, + ._a3el, + ._9-7-, + ._9-1a, + ._a3em, + ._9zrp, + ._a3en, + ._9zz9, + ._a3eo, + ._9zmr, + ._9-8d, + ._9zhi, + ._a3ep, + ._9zs0, + ._9-j-, + ._a3eq, + ._9zli, + ._9_4y, + ._9zm2, + ._9zfj, + ._9zlg, + ._a3er, + ._9-lv, + ._9_ug, + ._9_sh, + ._9_sj, + ._9-k0, + ._9z-c, + ._9_35, + ._9_hh, + ._a3es, + ._a3et, + ._a3eu, + ._9-v-, + ._9_4d, + ._9zlh, + ._a3ev, + ._a3ew, + ._a3ex, + ._a3ey, + ._9_7m, + ._9_fv, + ._a3ez, + ._9-zf, + ._9-zg, + ._9-ze, + ._a9fa, + ._9-zh, + ._9-zi, + ._9-zj, + ._9-zk, + ._9-zl, + ._9-zm, + ._9-zn, + ._9-zo, + ._9-zp, + ._9-zq, + ._9-zr, + ._9-zs, + ._9-zt, + ._a3op, + ._a3oq, + ._9-zu, + ._9-zv, + ._9-zw, + ._9-zx, + ._9-zy, + ._9-zz, + ._9-z-, + ._a3or, + ._a3ot, + ._a3os, + ._9zs1, + ._9zs2, + ._9-z_, + ._9--0, + ._9--1, + ._9--2, + ._9--3, + ._9--4, + ._9--5, + ._9--6, + ._9--7, + ._9--f, + ._9--8, + ._9--9, + ._9--a, + ._9--b, + ._9--c, + ._9--d, + ._9--e, + ._a3ou, + ._9--g, + ._9--h, + ._9--i, + ._9--j, + ._9--l, + ._9--k, + ._9--m, + ._9--n, + ._9--o, + ._9--p, + ._9--q, + ._a3ov, + ._9--s, + ._9--r, + ._9--t, + ._9--u, + ._9--v, + ._9--x, + ._9--y, + ._9--w, + ._9--z, + ._9--_, + ._9-_0, + ._9-_1, + ._9-_2, + ._9-_3, + ._9---, + ._9-_4, + ._9-_5, + ._9-_6, + ._9-_7, + ._a3wy, + ._9-_8, + ._9-_9, + ._a3ow, + ._9-_a, + ._9-_b, + ._9-_c, + ._9-_d, + ._9-_e, + ._9-_f, + ._9-_g, + ._9-_h, + ._9-_i, + ._9-_j, + ._9-_k, + ._9-_l, + ._9-_m, + ._9-_n, + ._9-_o, + ._a3ox, + ._9-_p, + ._9-_q, + ._a9fb, + ._9-_t, + ._9-_r, + ._9-_s, + ._a93g, + ._9-_u, + ._9-_v, + ._a9fc, + ._9-_w, + ._9-_x, + ._9-_y, + ._9-_z, + ._9-_-, + ._9-__, + ._9_00, + ._a3oy, + ._9_01, + ._9_02, + ._9_03, + ._9_04, + ._9_05, + ._9_08, + ._9_09, + ._9_07, + ._9_06, + ._9_0a, + ._9_0b, + ._9_0c, + ._9_0d, + ._9_0e, + ._9_0f, + ._9_0g, + ._a93h, + ._9_0h, + ._9_0i, + ._9_0j, + ._9_0k, + ._aepo, + ._9_0l, + ._9_0m, + ._9_0n, + ._9_0o, + ._9_0p, + ._a3oz, + ._a93l, + ._9_0r, + ._9_0s, + ._a7tk, + ._9_0q, + ._a3o-, + ._9_0t, + ._9_0v, + ._9_0u, + ._a9ej, + ._9_0w, + ._9_0x, + ._9_0y, + ._9_0z, + ._9_0_, + ._9_0-, + ._9_10, + ._9_11, + ._9_12, + ._9_13, + ._9_14, + ._9_15, + ._a3o_, + ._9_18, + ._9_19, + ._9_1a, + ._9_1e, + ._9_1b, + ._9_1c, + ._9_1d, + ._9_16, + ._9_17, + ._a3p0, + ._9_1g, + ._9_1i, + ._9_1h, + ._9_1j, + ._9_1k, + ._9_1l, + ._9_1m, + ._a9pw { filter: @text-filter; } @@ -548,8 +531,7 @@ @blue 90% ); /* Instagram text logo */ - [style*="background-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/yU/r/H5Bq7ru-y9E.png\");"] - { + [style*="background-image: url(\"https://static.cdninstagram.com/rsrc.php/v3/yU/r/H5Bq7ru-y9E.png\");"] { @svg: escape( '' ); @@ -567,13 +549,12 @@ /* "All caught up" icon */ img[src="/images/instagram/xig/web/illo-confirm-refresh-light.png"] { @svg: escape( - '' + '' ); content: url("data:image/svg+xml,@{svg}"); } - [style*='background-image: url("https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png")'] - { + [style*='background-image: url("https://static.cdninstagram.com/rsrc.php/v3/y4/r/ewSyA8IItw_.png")'] { /* No photo icon */ &[style*="background-position: 0px -97px"] { filter: none; @@ -617,7 +598,7 @@ } ._acas:not(._acao):hover { background-color: @surface0 !important; - color: @accent-color !important; + color: @accent !important; } /* Secondary buttons */ @@ -637,12 +618,12 @@ div:has(> .x1mu97ne) { background-color: @crust; border-color: @overlay0; - box-shadow: 0 10px 35px 2px fadeout(@dark-color, 0.7); + box-shadow: 0 10px 35px 2px fade(@dark-color, 30%); } /* Dialog overlay */ .x7r02ix[role="dialog"] { - box-shadow: 0 5px 10px 0 fadeout(@dark-color, 0.5); + box-shadow: 0 5px 10px 0 fade(@dark-color, 50%); } /* Settings */ @@ -681,7 +662,7 @@ &[style*="border-radius: 4px"] { /* Selected radio */ &[style*="background: rgb(0\, 149\, 246)"] { - background-color: @accent-color !important; + background-color: @accent !important; } /* Not selected radio */ @@ -717,7 +698,7 @@ .leaflet-popup-content-wrapper, .leaflet-popup-tip { background-color: @mantle; - box-shadow: 0 5px 15px fadeout(@dark-color, 0.4); + box-shadow: 0 5px 15px fade(@dark-color, 60%); * { color: @text !important; @@ -730,48 +711,22 @@ } ::-webkit-scrollbar-thumb { - background-color: @accent-color; + background-color: @accent; border-radius: 10px; } } } -@-moz-document regexp('^.*instagram.com/direct.*') { +@-moz-document regexp("^.*instagram.com/direct.*") { ._aa4d { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } ._aa4c { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, - @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + + #catppuccin(@flavor) { + #lib.palette(); .x11jlvup { --chat-outgoing-message-bubble-background-color: fade(@blue, 80%); @@ -811,7 +766,7 @@ color: @crust; } .x1bvjpef:hover { - color: lighten(@accent-color, 5%); + color: lighten(@accent, 5%); } /* notes */ @@ -828,35 +783,52 @@ ); } + /* voice clip */ + div.x7ywyr2 { + &[style*="background-color: rgb(var(--ig-highlight-background))"] { + div[aria-label="Play"], + div[aria-label="Pause"], + div[role="timer"], + div[role="slider"] { + background-color: @text !important; + } + div[style*="clip-path"] div.x5yr21d.xh8yej3.x1bhxuv2 { + background-color: @subtext0 !important; + } + div[aria-label="Play"]:hover { + background-color: @subtext1 !important; + } + } + &[style*="background-color: var(--mwp-primary-theme-color)"] { + background-color: var(--mwp-primary-theme-color) !important; + div[aria-label="Play"], + div[aria-label="Pause"], + div[role="slider"], + div[role="timer"] { + background-color: @text !important; + } + div[aria-label="Play"]:hover { + background-color: @subtext1 !important; + } + } + } + /* voice clip recording container */ + div[style*="background-color: var(--chat-composer-button-color)"] { + div[role="slider"] { + opacity: 1 !important; + background-color: darken(@blue, 4%) !important; + } + div[aria-label="Play"], + div[aria-label="Pause"], + div[role="timer"], + div[aria-label="Stop recording"] { + background-color: @text !important; + } + } + /* explicit music icon in notes */ .x1cp0k07 { color: @text; } } } - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { - @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; - @text-filter: brightness(0) saturate(100%) invert(28%) sepia(17%) saturate(835%) hue-rotate(196deg) brightness(97%) contrast(85%); - }; - @frappe: { - @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; - @text-filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1519%) hue-rotate(192deg) brightness(100%) contrast(93%); - }; - @macchiato: { - @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; - @text-filter: brightness(0) saturate(100%) invert(80%) sepia(18%) saturate(377%) hue-rotate(192deg) brightness(103%) contrast(92%); - }; - @mocha: { - @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; - @text-filter: brightness(0) saturate(100%) invert(85%) sepia(6%) saturate(1356%) hue-rotate(194deg) brightness(103%) contrast(91%); - }; -} - -// vim:ft=less diff --git a/styles/instagram/preview.webp b/styles/instagram/preview.webp deleted file mode 100644 index 718576b3ae..0000000000 --- a/styles/instagram/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:7d65b8f55b2d686bf292607d95d758b26db4aa9e7f64e48cd96b763e89c88081 -size 143156 diff --git a/styles/invidious/README.md b/styles/invidious/README.md index 70eb961b06..7371b148ab 100644 --- a/styles/invidious/README.md +++ b/styles/invidious/README.md @@ -10,21 +10,20 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find! ## ๐Ÿ’– Past Maintainers -- [Lemon](https://github.com/unseen-ninja) -- [winston](https://github.com/nekowinston) +- [unseen-ninja](https://github.com/unseen-ninja) +- [nekowinston](https://github.com/nekowinston)   diff --git a/styles/invidious/catppuccin.user.css b/styles/invidious/catppuccin.user.css deleted file mode 100644 index 5f157f8873..0000000000 --- a/styles/invidious/catppuccin.user.css +++ /dev/null @@ -1,344 +0,0 @@ -/* ==UserStyle== -@name Invidious Catppuccin -@namespace github.com/catppuccin/userstyles/styles/invidious -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/invidious -@version 0.4.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/invidious/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ainvidious -@description Soothing pastel theme for Invidious -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] - -@var checkbox styleVideoPlayer "Style Video Player" 1 -==/UserStyle== */ - -/** - * kept up-to-date with - * `curl https://api.invidious.io/instances.json | jq '.[] | select(.[1].type=="https") | .[0]'` - */ -@-moz-document domain("anontube.lvkaszus.pl"), - domain("inv.citw.lgbt"), - domain("inv.in.projectsegfau.lt"), - domain("inv.tux.pizza"), - domain("inv.us.projectsegfau.lt"), - domain("inv.zzls.xyz"), - domain("invidious.asir.dev"), - domain("invidious.drgns.space"), - domain("invidious.einfachzocken.eu"), - domain("invidious.fdn.fr"), - domain("invidious.io.lol"), - domain("invidious.lunar.icu"), - domain("invidious.nerdvpn.de"), - domain("invidious.no-logs.com"), - domain("invidious.perennialte.ch"), - domain("invidious.privacydev.net"), - domain("invidious.private.coffee"), - domain("invidious.projectsegfau.lt"), - domain("invidious.protokolla.fi"), - domain("invidious.slipfox.xyz"), - domain("iv.datura.network"), - domain("iv.ggtyler.dev"), - domain("iv.melmac.space"), - domain("iv.nboeck.de"), - domain("iv.winston.sh"), - domain("onion.tube"), - domain("vid.priv.au"), - domain("vid.puffyan.us"), - domain("yewtu.be"), - domain("yt.artemislena.eu"), - domain("yt.cdaut.de"), - domain("yt.drgnz.club"), - domain("yt.oelrichsgarcia.de") { - @media (prefers-color-scheme: light) { - .no-theme { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - .no-theme { - #catppuccin(@darkFlavor, @accentColor); - } - } - - .light-theme { - #catppuccin(@lightFlavor, @accentColor); - } - .dark-theme { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - #lightenOrDarken(@color, @value) { - @result: if( - @lookup = latte, - darken(@color, @value), - lighten(@color, @value) - ); - } - - @link-color: @accent-color; - @link-hover: #lightenOrDarken(@accent-color, 5%) [ @result]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - background-color: @base !important; - color: @text !important; - - a, - /* menu under the search bar */ - .pure-menu-heading { - color: @link-color; - &:hover, - &:focus, - &:active { - color: @link-hover !important; - } - } - - hr, - /* legend borders are visible as dividers in Settings */ - legend { - border-color: @surface1; - border-style: solid; - } - - legend { - color: @accent-color !important; - } - - .pure-button-primary { - background-color: @surface1 !important; - color: @text !important; - border-color: @surface1 !important; - &:hover, - &:focus { - background-color: @surface2 !important; - color: @text !important; - border-color: @surface1 !important; - } - } - .pure-button-secondary { - background-color: @accent-color !important; - color: @crust !important; - border-color: @surface1 !important; - &:hover, - &:focus { - background-color: #lightenOrDarken(@accent-color, 2%) [ @result] !important; - color: @crust !important; - border-color: @surface1 !important; - } - } - - #subscribe { - background-color: @link-color !important; - color: @crust !important; - :hover, - :focus { - background-color: @link-hover !important; - color: @crust !important; - } - } - - #filters-box { - background-color: @surface0 !important; - } - - .underlined { - border-color: @overlay1; - } - - .video-js .vjs-control-bar, - .vjs-menu-button-popup .vjs-menu .vjs-menu-content { - background-color: @crust !important; - color: @text !important; - } - - .video-js .vjs-slider:hover, - .video-js button:hover { - color: @accent-color !important; - } - - .video-js .vjs-slider { - background-color: @surface2 !important; - } - - .video-js .vjs-load-progress, - .video-js .vjs-load-progress div { - background-color: @surface2 !important; - } - - .video-js.player-style-invidious .vjs-play-progress { - background-color: @accent-color !important; - } - - .vjs-menu li.vjs-menu-item:focus, - .vjs-menu li.vjs-menu-item:hover { - background-color: @surface0 !important; - color: @text !important; - } - - .vjs-menu li.vjs-selected, - .vjs-menu li.vjs-selected:focus, - .vjs-menu li.vjs-selected:hover { - background-color: @blue !important; - } - - .vjs-menu li.vjs-selected, - .vjs-menu li.vjs-selected:focus, - .vjs-menu li.vjs-selected:hover, - .js-focus-visible .vjs-menu li.vjs-selected:hover { - color: @crust !important; - } - - .vjs-modal-dialog-content { - backdrop-filter: blur(4px); - } - - .vjs-share__title { - color: @text !important; - } - .vjs-share__subtitle { - color: @subtext0 !important; - opacity: 100% !important; - } - .vjs-share__short-link { - color: @text !important; - background: @base !important; - } - .vjs-share__btn { - background: @crust !important; - svg path { - fill: @text !important; - } - } - - #related-videos > .h-box > div:not(#autoplay-controls) { - margin-bottom: 48px !important; - } - - footer a, - footer span { - color: @subtext0 !important; - } - - footer span a, - footer span:has(i) { - &:hover { - color: @accent-color !important; - } - } - - .pure-form-message-inline { - color: @subtext0; - } - - select, - input[type="text"], - input[type="number"], - input[type="input"], - input[type="password"] { - color: @text !important; - background-color: @surface0 !important; - border-color: @surface1 !important; - box-shadow: none !important; - &:active { - color: @text !important; - } - } - input[type="search"] { - color: @text !important; - background-color: @base !important; - border-bottom-color: @overlay1 !important; - box-shadow: none !important; - } - input[type="checkbox"] { - background-color: @surface2; - border-color: @surface1; - height: 1rem; - width: 1rem; - -webkit-appearance: none; - appearance: none; - cursor: pointer; - &:checked { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - } - - /* video player background */ - #player-container > .video-js > video, - /* placeholder for loading thumbnails */ - .vjs-poster { - & when (@styleVideoPlayer = 1) { - background-color: @mantle !important; - } - } - - /* watch progress on videos */ - div.watched-indicator { - background-color: @red; - } - - /* Channel owner comments */ - a.channel-owner { - color: @crust; - background-color: @accent-color; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; } - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; } - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; } - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; } -} - -// vim:ft=less diff --git a/styles/invidious/catppuccin.user.less b/styles/invidious/catppuccin.user.less new file mode 100644 index 0000000000..e80627e1ea --- /dev/null +++ b/styles/invidious/catppuccin.user.less @@ -0,0 +1,297 @@ +/* ==UserStyle== +@name Invidious Catppuccin +@namespace github.com/catppuccin/userstyles/styles/invidious +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/invidious +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/invidious/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ainvidious +@description Soothing pastel theme for Invidious +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] + +@var checkbox styleVideoPlayer "Style Video Player" 1 +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +/** + * kept up-to-date with + * `curl https://api.invidious.io/instances.json | jq '.[] | select(.[1].type=="https") | .[0]'` + */ +@-moz-document domain("anontube.lvkaszus.pl"), + domain("inv.citw.lgbt"), + domain("inv.in.projectsegfau.lt"), + domain("inv.tux.pizza"), + domain("inv.us.projectsegfau.lt"), + domain("inv.zzls.xyz"), + domain("invidious.asir.dev"), + domain("invidious.drgns.space"), + domain("invidious.einfachzocken.eu"), + domain("invidious.fdn.fr"), + domain("invidious.io.lol"), + domain("invidious.lunar.icu"), + domain("invidious.nerdvpn.de"), + domain("invidious.no-logs.com"), + domain("invidious.perennialte.ch"), + domain("invidious.privacydev.net"), + domain("invidious.private.coffee"), + domain("invidious.projectsegfau.lt"), + domain("invidious.protokolla.fi"), + domain("invidious.slipfox.xyz"), + domain("iv.datura.network"), + domain("iv.ggtyler.dev"), + domain("iv.melmac.space"), + domain("iv.nboeck.de"), + domain("iv.winston.sh"), + domain("onion.tube"), + domain("vid.priv.au"), + domain("vid.puffyan.us"), + domain("yewtu.be"), + domain("yt.artemislena.eu"), + domain("yt.cdaut.de"), + domain("yt.drgnz.club"), + domain("yt.oelrichsgarcia.de") { + .no-theme { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + .light-theme { + #catppuccin(@lightFlavor); + } + .dark-theme { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + // TODO: Can we remove lightenOrDarken in favor of shades/tints? Should we add it to the shared lib for now? + #lightenOrDarken(@color, @value) { + @result: if( + @flavor = latte, + darken(@color, @value), + lighten(@color, @value) + ); + } + + @link-color: @accent; + @link-hover: #lightenOrDarken(@accent, 5%)[@result]; + + background-color: @base !important; + color: @text !important; + + a, + /* menu under the search bar */ + .pure-menu-heading { + color: @link-color; + &:hover, + &:focus, + &:active { + color: @link-hover !important; + } + } + + hr, + /* legend borders are visible as dividers in Settings */ + legend { + border-color: @surface1; + border-style: solid; + } + + legend { + color: @accent !important; + } + + .pure-button-primary { + background-color: @surface1 !important; + color: @text !important; + border-color: @surface1 !important; + &:hover, + &:focus { + background-color: @surface2 !important; + color: @text !important; + border-color: @surface1 !important; + } + } + .pure-button-secondary { + background-color: @accent !important; + color: @crust !important; + border-color: @surface1 !important; + &:hover, + &:focus { + background-color: #lightenOrDarken(@accent, 2%)[@result] !important; + color: @crust !important; + border-color: @surface1 !important; + } + } + + #subscribe { + background-color: @link-color !important; + color: @crust !important; + :hover, + :focus { + background-color: @link-hover !important; + color: @crust !important; + } + } + + #filters-box { + background-color: @surface0 !important; + } + + .underlined { + border-color: @overlay1; + } + + .video-js .vjs-control-bar, + .vjs-menu-button-popup .vjs-menu .vjs-menu-content { + background-color: @crust !important; + color: @text !important; + } + + .video-js .vjs-slider:hover, + .video-js button:hover { + color: @accent !important; + } + + .video-js .vjs-slider { + background-color: @surface2 !important; + } + + .video-js .vjs-load-progress, + .video-js .vjs-load-progress div { + background-color: @surface2 !important; + } + + .video-js.player-style-invidious .vjs-play-progress { + background-color: @accent !important; + } + + .vjs-menu li.vjs-menu-item:focus, + .vjs-menu li.vjs-menu-item:hover { + background-color: @surface0 !important; + color: @text !important; + } + + .vjs-menu li.vjs-selected, + .vjs-menu li.vjs-selected:focus, + .vjs-menu li.vjs-selected:hover { + background-color: @blue !important; + } + + .vjs-menu li.vjs-selected, + .vjs-menu li.vjs-selected:focus, + .vjs-menu li.vjs-selected:hover, + .js-focus-visible .vjs-menu li.vjs-selected:hover { + color: @crust !important; + } + + .vjs-modal-dialog-content { + backdrop-filter: blur(4px); + } + + .vjs-share__title { + color: @text !important; + } + .vjs-share__subtitle { + color: @subtext0 !important; + opacity: 100% !important; + } + .vjs-share__short-link { + color: @text !important; + background: @base !important; + } + .vjs-share__btn { + background: @crust !important; + svg path { + fill: @text !important; + } + } + + #related-videos > .h-box > div:not(#autoplay-controls) { + margin-bottom: 48px !important; + } + + footer a, + footer span { + color: @subtext0 !important; + } + + footer span a, + footer span:has(i) { + &:hover { + color: @accent !important; + } + } + + .pure-form-message-inline { + color: @subtext0; + } + + select, + input[type="text"], + input[type="number"], + input[type="input"], + input[type="password"] { + color: @text !important; + background-color: @surface0 !important; + border-color: @surface1 !important; + box-shadow: none !important; + &:active { + color: @text !important; + } + } + input[type="search"] { + color: @text !important; + background-color: @base !important; + border-bottom-color: @overlay1 !important; + box-shadow: none !important; + } + input[type="checkbox"] { + background-color: @surface2; + border-color: @surface1; + height: 1rem; + width: 1rem; + -webkit-appearance: none; + appearance: none; + cursor: pointer; + &:checked { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + } + + /* video player background */ + #player-container > .video-js > video, + /* placeholder for loading thumbnails */ + .vjs-poster { + & when (@styleVideoPlayer = 1) { + background-color: @mantle !important; + } + } + + /* watch progress on videos */ + div.watched-indicator { + background-color: @red; + } + + /* Channel owner comments */ + a.channel-owner { + color: @crust; + background-color: @accent; + } + } +} diff --git a/styles/invidious/preview.webp b/styles/invidious/preview.webp deleted file mode 100644 index 85a58cac18..0000000000 --- a/styles/invidious/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:0f3f2c87b916568483c2e6427b86952dbf9f1ce0aaa18c63764c8c547dd18e2c -size 445266 diff --git a/styles/invokeai/README.md b/styles/invokeai/README.md index d0e8f58bb7..be399dc76a 100644 --- a/styles/invokeai/README.md +++ b/styles/invokeai/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Ryan Cao](https://github.com/ryanccn) +- [ryanccn](https://github.com/ryanccn)   diff --git a/styles/invokeai/catppuccin.user.css b/styles/invokeai/catppuccin.user.css deleted file mode 100644 index 0dc276512b..0000000000 --- a/styles/invokeai/catppuccin.user.css +++ /dev/null @@ -1,138 +0,0 @@ -/* ==UserStyle== -@name InvokeAI Catppuccin -@namespace github.com/catppuccin/userstyles/styles/invokeai -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/invokeai -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/invokeai/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ainvokeai -@description Soothing pastel theme for InvokeAI -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document regexp("http:\\/\\/(127\\.0\\.0\\.1|localhost):9090(.*)") { - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - :root, - [data-theme]:root { - --accent-color-dim: lighten(@accent-color, -10%); - --accent-color: @accent-color; - --accent-color-bright: lighten(@accent-color, 10%); - --accent-color-hover: var(--accent-color-bright); - --root-bg-color: @mantle; - --background-color: @base; - --background-color-light: @surface0; - --background-color-secondary: @base; - --text-color: @text; - --text-color-secondary: @subtext0; - --subtext-color: @subtext1; - --subtext-color-bright: @subtext0; - --border-color: @surface1; - --border-color-light: @surface2; - --tab-color: @accent-color; - --tab-list-bg: @accent-color; - --btn-delete-image: @red; - --status-good-color: @green; - --status-good-color-glow: lighten(@green, 10%); - --border-color-invalid: @red; - --box-shadow-color-invalid: lighten(@red, 5%); - --tab-panel-bg: var(--background-color-light); - --tab-hover-color: var(--background-color-secondary); - --tab-list-text: white; - --prompt-bg-color: var(--background-color-light); - --switch-bg-color: var(--background-color-secondary); - --btn-base-color: var(--background-color-light); - --btn-base-color-hover: var(--background-color-secondary); - --destructive-color: @red; - --slider-color: @lavender; - --slider-mark-color: var(--slider-color); - --switch-bg-active-color: var(--accent-color); - --console-icon-button-bg-color: var(--btn-base-color); - --console-icon-button-bg-color-hover: var(--btn-base-color-hover); - --console-bg-color: var(--background-color-light); - --svg-color: var(--text-color); - --btn-load-more: var(--background-color-light); - --tab-list-text-inactive: var(--text-color-secondary); - } - - .invokeai-style-cache-1m5jnul { - --number-input-color: var(--text-color-secondary) !important; - } - - .invoke-btn, - .invokeai__button[data-active], - .site-header-right-side .lang-select-btn[data-selected="true"], - .site-header-right-side .lang-select-btn[data-selected="true"]:hover, - button.chakra-button.invokeai__icon-button[data-selected="true"] { - --svg-color: var(--root-bg-color); - color: var(--root-bg-color) !important; - } - - .invokeai-style-cache-vs1g06, - .invokeai-style-cache-vs1g06:hover { - background-color: var(--background-color-light); - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/invokeai/catppuccin.user.less b/styles/invokeai/catppuccin.user.less new file mode 100644 index 0000000000..53c001085c --- /dev/null +++ b/styles/invokeai/catppuccin.user.less @@ -0,0 +1,94 @@ +/* ==UserStyle== +@name InvokeAI Catppuccin +@namespace github.com/catppuccin/userstyles/styles/invokeai +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/invokeai +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/invokeai/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ainvokeai +@description Soothing pastel theme for InvokeAI +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document regexp("http:\\/\\/(127\\.0\\.0\\.1|localhost):9090(.*)") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + :root, + [data-theme]:root { + --accent-color-dim: lighten(@accent, -10%); + --accent-color: @accent; + --accent-color-bright: lighten(@accent, 10%); + --accent-color-hover: var(--accent-color-bright); + --root-bg-color: @mantle; + --background-color: @base; + --background-color-light: @surface0; + --background-color-secondary: @base; + --text-color: @text; + --text-color-secondary: @subtext0; + --subtext-color: @subtext1; + --subtext-color-bright: @subtext0; + --border-color: @surface1; + --border-color-light: @surface2; + --tab-color: @accent; + --tab-list-bg: @accent; + --btn-delete-image: @red; + --status-good-color: @green; + --status-good-color-glow: lighten(@green, 10%); + --border-color-invalid: @red; + --box-shadow-color-invalid: lighten(@red, 5%); + --tab-panel-bg: var(--background-color-light); + --tab-hover-color: var(--background-color-secondary); + --tab-list-text: white; + --prompt-bg-color: var(--background-color-light); + --switch-bg-color: var(--background-color-secondary); + --btn-base-color: var(--background-color-light); + --btn-base-color-hover: var(--background-color-secondary); + --destructive-color: @red; + --slider-color: @lavender; + --slider-mark-color: var(--slider-color); + --switch-bg-active-color: var(--accent-color); + --console-icon-button-bg-color: var(--btn-base-color); + --console-icon-button-bg-color-hover: var(--btn-base-color-hover); + --console-bg-color: var(--background-color-light); + --svg-color: var(--text-color); + --btn-load-more: var(--background-color-light); + --tab-list-text-inactive: var(--text-color-secondary); + } + + .invokeai-style-cache-1m5jnul { + --number-input-color: var(--text-color-secondary) !important; + } + + .invoke-btn, + .invokeai__button[data-active], + .site-header-right-side .lang-select-btn[data-selected="true"], + .site-header-right-side .lang-select-btn[data-selected="true"]:hover, + button.chakra-button.invokeai__icon-button[data-selected="true"] { + --svg-color: var(--root-bg-color); + color: var(--root-bg-color) !important; + } + + .invokeai-style-cache-vs1g06, + .invokeai-style-cache-vs1g06:hover { + background-color: var(--background-color-light); + } + } +} diff --git a/styles/invokeai/preview.webp b/styles/invokeai/preview.webp deleted file mode 100644 index ee44e54e05..0000000000 --- a/styles/invokeai/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:a4b55bb73ccd6d0f145132a3e2b26d8fd41006513c962c84e6dcd4db1dfb176c -size 81698 diff --git a/styles/jisho/README.md b/styles/jisho/README.md new file mode 100644 index 0000000000..5a6fac248a --- /dev/null +++ b/styles/jisho/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Jisho + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [Lichthagel](https://github.com/Lichthagel) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/jisho/catppuccin.user.less b/styles/jisho/catppuccin.user.less new file mode 100644 index 0000000000..a85de81e07 --- /dev/null +++ b/styles/jisho/catppuccin.user.less @@ -0,0 +1,453 @@ +/* ==UserStyle== +@name Jisho Catppuccin +@namespace github.com/catppuccin/userstyles/styles/jisho +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/jisho +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/jisho/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ajisho +@description Soothing pastel theme for Jisho +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("jisho.org") { + :root[data-color-theme="auto"] { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + :root[data-color-theme="dark"] { + #catppuccin(@darkFlavor); + } + :root[data-color-theme="light"] { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + @accent-dim: if( + @flavor = latte, + desaturate(lighten(@accent, 8%), 10%), + desaturate(darken(@accent, 8%), 10%) + ); + + body { + background-color: @base !important; + color: @text; + + a { + color: @accent; + + &:hover { + color: @accent-dim; + } + } + } + + each( + range(6), + { + h@{value} { + color: @text; + } + } + ); + + button, + .button, + .tabs .tab-title > a { + background-color: @overlay0; + color: @text; + + &:hover, + &:focus { + background-color: @overlay1; + color: @text; + } + } + + // ! There is some white space between the buttons in the button group + // ! This is somewhat mitigated by using `margin: 0 -2px;` originally + // ! We use `display: flex;` instead + .button-group { + display: flex; + flex-wrap: wrap; + + &.radius > *, + > li { + margin: unset; + } + } + + .f-dropdown { + background-color: @mantle; + border-color: @overlay0; + + &::before { + border-bottom-color: @surface0; + } + + li:hover { + background-color: @crust; + } + } + + header.row { + background-color: @base; + } + + h1.logo a { + background-image: if( + @flavor = latte, + url("//assets.jisho.org/assets/jisho-logo-v4@2x-7330091c079b9dd59601401b052b52e103978221c8fb6f5e22406d871fcc746a.png"), + url("//assets.jisho.org/assets/jisho-logo-v4-dark@2x-e676613b426d34187b61928823730a225b52165aaef99f948bd3dc5fc16fa787.png") + ); + } + + nav .links { + .color_theme_picker--wrapper:hover { + background-color: @mantle; + } + + .color_theme_picker--choices { + background-color: @mantle; + + li a:hover { + background-color: @crust; + } + } + } + + form.search { + .input_methods, + .input_method_button h4 { + color: @subtext0; + } + + .input_method_button:hover { + background-color: @surface0; + } + + .main { + background-color: @surface0; + box-shadow: none; + } + + .inner { + background-color: @surface1; + + input { + color: @text; + } + } + + .search_type { + border-right-color: @overlay0; + color: @subtext0; + } + + .submit { + background-color: @overlay1; + color: @text; + } + + .search-form_clear-button { + background-color: transparent; // ! Unsure if this needs a background, also extends beyond the input + .clear-icon { + fill: @subtext0; + } + } + + .results, + #radical_area .results { + .result_label { + color: @text; + } + + .result { + background-color: @surface1; + + &:hover { + color: @text; + } + } + + each( + range(8), + { + .g@{value} { + color: @blue; + } + } + ); + } + + #radical_area { + .radical_table { + background-image: repeating-linear-gradient( + 180deg, + @surface1, + @surface1 32px, + @surface2 32px, + @surface2 64px + ); + + .number { + background-color: @text; + color: @base; + } + + .radical { + background-image: none; // ! some radicals are rendered with a background image by default + color: @text; + + &.available:hover { + background-color: @overlay0; + } + + &.selected { + border-color: @text; + background-color: fade(@yellow, 30%); + } + } + } + + &.combined_mode { + // ! what is combined mode? + .reset_radicals { + color: @subtext0; + + &:hover { + color: @text; + background-color: @overlay0; + } + } + } + } + + .handwriting { + .panel { + background-color: @surface1; + } + + .pencil-icon { + color: @surface2 !important; + } + } + } + + .speech_area_active #speech_button, + .radical_area_active #radical_button, + .handwriting_area_active #handwriting_button { + border-bottom-color: @accent; + } + + #what_is_this { + color: unset; + } + + .japanese_word__furigana-invisible { + opacity: 0; // ! Jisho uses `color: #fff;` to hide furigana, however this does not work in the dark theme + } + + #zen_bar li[data-pos="Noun"] a, + #zen_bar li[data-pos="Proper noun"] a, + #zen_bar li[data-pos="Pronoun"] a, + #zen_bar li[data-pos="Suffix"] a, + #zen_bar li[data-pos="Prefix"] a, + #zen_bar li[data-pos="Symbol"] a, + #zen_bar li[data-pos="Interjection"] a, + #zen_bar li[data-pos="Propernoun"] a { + color: @peach; + border-bottom-color: @peach; + } + + #zen_bar li[data-pos="Particle"] a { + color: @red; + border-bottom-color: @red; + } + + #zen_bar li[data-pos="Verb"] a { + color: @subtext0; + border-bottom-color: @subtext0; + } + + #main_results h4 .result_count { + color: @subtext0; + } + + .fact { + outline-color: @mantle; + border-color: @base; + background-color: @mantle; + } + + .concept_light { + border-bottom-color: @overlay0; + } + + .concept_light-status .concept_light-tag { + color: @base; + background-color: @subtext0; + + &.concept_light-common { + background-color: @green; + } + + a { + color: @base; + } + } + .concept_light-meanings { + .meaning-tags, + .meaning-definition-section_divider { + color: @subtext0; + } + } + + .concept_light .sentence, + .meaning-abstract, + .supplemental_info { + color: @subtext0; + } + + .kanji_light { + border-bottom-color: @overlay0; + + .info { + color: @subtext0; + } + } + + .sentences_block .sentence { + border-bottom-color: @overlay0; + } + + #secondary aside .minor-text { + color: @subtext0; + } + + .kanji-details__main-readings-list a { + border-bottom-color: @subtext0; + } + + .kanji_strokes { + .kanji_play_button, + .replay_button, + .toggle_kanji_actions { + color: @text; + background-color: transparent; + } + + .actions { + background-color: @base; + + h3 { + color: @text; + } + } + + .noUi-target { + .noUi-background { + background-color: @accent; + } + + .noUi-base { + border-color: @surface1; + } + + .noUi-origin { + background-color: @overlay0; + } + + .noUi-handle { + background-color: @text; + border-color: @surface2; + } + + .noUi-active { + background-color: @subtext0; + } + } + } + + .stroke_order_diagram--bounding_box, + .stroke_order_diagram--guide_line { + stroke: @surface0; + } + + .stroke_order_diagram--path_start { + fill: fade(@red, 80%); + } + + .stroke_order_diagram--current_path { + stroke: @text; + } + + .stroke_order_diagram--existing_path { + stroke: fade(@subtext0, 50%); + } + + .kanji { + table { + background-color: @mantle; + border-color: @overlay0; + } + + tr { + background-color: @surface0; + + td { + color: @subtext0; + } + } + } + + .discussion_thread { + .comment_body { + background-color: @surface0; + border-color: @overlay0; + + .discussion_status { + background-color: @surface1; + border-bottom-color: @overlay0; + color: @subtext0; + } + + .discussion_about { + background-color: mix(@surface0, @teal, 80%); + color: @teal; + } + + .comment_status { + background-color: @surface2; + color: @subtext0; + } + } + + .discussion_title a { + color: @text !important; + } + } + + footer { + .ornament { + background-color: @red; + box-shadow: 0 0 10px 5px if(@flavor = latte, @base, @overlay0); + } + } + } +} diff --git a/styles/keybr.com/README.md b/styles/keybr.com/README.md new file mode 100644 index 0000000000..aee77c4b11 --- /dev/null +++ b/styles/keybr.com/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for keybr.com + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [janTatesa](https://github.com/janTatesa) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/keybr.com/catppuccin.user.less b/styles/keybr.com/catppuccin.user.less new file mode 100644 index 0000000000..757192b575 --- /dev/null +++ b/styles/keybr.com/catppuccin.user.less @@ -0,0 +1,108 @@ +/* ==UserStyle== +@name keybr.com Catppuccin +@namespace github.com/catppuccin/userstyles/styles/keybr.com +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/keybr.com +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/keybr.com/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Akeybr.com +@description Soothing pastel theme for keybr.com +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("keybr.com") { + html[data-color="dark"] { + #catppuccin(@darkFlavor); + } + html[data-color="light"] { + #catppuccin(@lightFlavor); + } + html[data-color="system"] { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --primary-d2: @overlay0; + --primary-d1: @overlay0; + --primary: @base; + --primary-l1: @crust; + --primary-l2: @mantle; + --secondary-d1: @subtext0; + --secondary: @text; + --secondary-l1: @subtext0; + --secondary-l2: @accent; + --secondary-f1: @subtext0; + --secondary-f2: @subtext0; + --accent-d2: @accent; + --accent-d1: @accent; + --accent: @accent; + --accent-l1: @accent; + --accent-l2: @accent; + --error-d1: @red; + --error: @red; + --error-l1: @red; + --shadow-color: fade(@crust, 88%); + --slow-key-color: @red; + --fast-key-color: @green; + --Chart-speed__color: @green; + --Chart-accuracy__color: @peach; + --Chart-complexity__color: @pink; + --Chart-threshold__color: @maroon; + --Chart-hist-h__color: @lavender; + --Chart-hist-m__color: @maroon; + --Chart-hist-r__color: @mauve; + --KeyboardKey-pointer__color: @accent; + --KeyboardKey-symbol__color: @crust; + --pinky-zone-color: @green; + --ring-zone-color: @teal; + --middle-zone-color: @yellow; + --left-index-zone-color: @blue; + --right-index-zone-color: @maroon; + --thumb-zone-color: @mauve; + --effort-0-color: @crust; + --effort-1-color: @crust; + --effort-2-color: @accent; + --effort-3-color: @accent; + --Value--more__color: @green; + --Value--less__color: @red; + --KeyboardKey-button--depressed__color: @accent; + --LessonKey--included__color: @crust; + --LessonKey--uncalibrated__background-color: @surface0; + --LessonKey--excluded__background-color: @surface0; + --LessonKey--excluded__color: @overlay0; + --DailyGoal-bar__color: @accent; + --KeyboardKey-button__color: @accent; + --textinput__color: @text; + --textinput--special__color: @subtext1; + --textinput--hit__color: @subtext0; + --textinput--miss__color: @red; + --syntax-keyword: @mauve; + --syntax-string: @green; + --syntax-number: @peach; + --syntax-comment: @overlay2; + --MenuItem__background-color: @mantle; + --MenuItem__color: @text; + --MenuItem--hover__background-color: @surface0; + --MenuItem--hover__color: @text; + --KeyboardKey-symbol--dead__color: @red; + --KeyboardKey-symbol--ligature__color: @blue; + --Name-color: @subtext0; + --Value-color: @accent; + --effort-color: @accent; + } +} diff --git a/styles/keyoxide/README.md b/styles/keyoxide/README.md index d18b0fe72c..a6c5e59e22 100644 --- a/styles/keyoxide/README.md +++ b/styles/keyoxide/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/keyoxide/catppuccin.user.css b/styles/keyoxide/catppuccin.user.css deleted file mode 100644 index 4edbf6350a..0000000000 --- a/styles/keyoxide/catppuccin.user.css +++ /dev/null @@ -1,306 +0,0 @@ -/* ==UserStyle== -@name Keyoxide Catppuccin -@namespace github.com/catppuccin/userstyles/styles/keyoxide -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/keyoxide -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/keyoxide/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Akeyoxide -@description Soothing pastel theme for Keyoxide -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document url-prefix('https://keyoxide.org') -{ - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @text-filter: @catppuccin[@@lookup][@text-filter]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --primary-color: @accent-color; - --primary-color-subtle: lighten(@accent-color, 5%); - --body-background-color: @mantle; - --section-background-color: @base; - --text-color: @text; - --text-color-subtle: @subtext1; - --text-color-inverse: @crust; - - --link-color: @blue; - --link-color-subtle: var(--text-color); - --link-color-hover: lighten(@blue, 5%); - --line-color-subtle: @surface1; - --button-text-color: var(--text-color); - --button-text-color-hover: var(--text-color); - --button-border-color: @surface0; - --button-border-color-hover: @surface0; - --button-background-color: @surface0; - --button-background-color-hover: @surface1; - --input-text-color: var(--text-color); - --input-text-color-hover: var(--text-color); - --input-border-color: @surface0; - --input-border-color-hover: @surface0; - --input-background-color: @mantle; - --input-background-color-hover: @mantle; - --footer-text-color: var(--text-color-subtle); - - .kx-item details summary .info img, - .kx-item details .subsection > img { - filter: @text-filter; - } - - kx-claim, - kx-key { - --loader-color: @subtext1; - --success-color: @green; - --failure-color: @red; - --background-color: @surface0; - --header-background-color: @surface1; - } - - a.button.button--donate.button--opencollective { - background-color: @blue; - color: @crust; - - &:hover { - background-color: lighten(@blue, 5%); - } - - svg { - fill: @crust; - } - } - } -} - -@-moz-document domain('docs.keyoxide.org'), domain('blog.keyoxide.org') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @text-filter: @catppuccin[@@lookup][@text-filter]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - background-color: @base; - - --clr-primary-100: @crust; - --clr-primary-99: @crust; - --clr-primary-98: @mantle; - --clr-primary-95: @base; - --clr-primary-90: lighten(@accent-color, 30%); - --clr-primary-80: lighten(@accent-color, 20%); - --clr-primary-70: lighten(@accent-color, 10%); - --clr-primary-60: @accent-color; - --clr-primary-50: darken(@accent-color, 5%); - --clr-primary-40: darken(@accent-color, 10%); - --clr-primary-35: darken(@accent-color, 15%); - --clr-primary-30: darken(@accent-color, 20%); - --clr-primary-25: darken(@accent-color, 25%); - --clr-primary-20: darken(@accent-color, 30%); - --clr-primary-10: darken(@accent-color, 35%); - --clr-primary-0: @text; - --clr-primary: @accent-color; - --clr-header: @text; - --clr-header-subtle: @subtext1; - --clr-text: @text; - --clr-text-subtle: @subtext1; - --clr-bg: @mantle; - --clr-bg-alt: @crust; - --clr-border: @surface0; - --clr-link: @blue; - - --clr-secondary-20: @subtext1; - - nav a.active { - color: @crust; - } - - .quick-links img, - [src="/chevron-up.svg"], - [src="/chevron-down.svg"] { - filter: @text-filter; - } - img[title="Keyoxide logo"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - table { - &, - td { - border-color: @surface0; - } - } - - pre { - background-color: @mantle !important; - color: @text !important; - - span[style="color:#c82728;"] { - color: @blue !important; - } - span[style="color:#4271ae;"], - span[style="color:#f07219;"] { - color: @green !important; - } - span[style="color:#8e908c;"] { - color: @overlay0 !important; - } - span[style="color:#8959a8;"] { - color: @mauve !important; - } - span[style="color:#839c00;"] { - color: @green !important; - } - span[style="color:#3e999f;"] { - color: @teal !important; - } - } - - .info { - background-color: @mantle; - - &::before { - background-color: @sky; - color: @crust; - } - } - - .warning { - background-color: @mantle; - - &::before { - background-color: @yellow; - color: @crust; - } - } - - .widget { - background-color: fade(@accent-color, 60%); - border-color: @accent-color; - - .title { - color: @text; - } - - input, - select { - background-color: @mantle; - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @text-filter: brightness(0) saturate(100%) invert(32%) sepia(14%) saturate(808%) hue-rotate(196deg) brightness(92%) contrast(95%); @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @text-filter: brightness(0) saturate(100%) invert(82%) sepia(17%) saturate(401%) hue-rotate(191deg) brightness(97%) contrast(98%); @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @text-filter: brightness(0) saturate(100%) invert(72%) sepia(78%) saturate(147%) hue-rotate(195deg) brightness(103%) contrast(92%); @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @text-filter: brightness(0) saturate(100%) invert(94%) sepia(11%) saturate(2056%) hue-rotate(182deg) brightness(96%) contrast(99%); @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/keyoxide/catppuccin.user.less b/styles/keyoxide/catppuccin.user.less new file mode 100644 index 0000000000..e5d96531ad --- /dev/null +++ b/styles/keyoxide/catppuccin.user.less @@ -0,0 +1,216 @@ +/* ==UserStyle== +@name Keyoxide Catppuccin +@namespace github.com/catppuccin/userstyles/styles/keyoxide +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/keyoxide +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/keyoxide/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Akeyoxide +@description Soothing pastel theme for Keyoxide +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document url-prefix("https://keyoxide.org") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --primary-color: @accent; + --primary-color-subtle: lighten(@accent, 5%); + --body-background-color: @mantle; + --section-background-color: @base; + --text-color: @text; + --text-color-subtle: @subtext1; + --text-color-inverse: @crust; + + --link-color: @blue; + --link-color-subtle: var(--text-color); + --link-color-hover: lighten(@blue, 5%); + --line-color-subtle: @surface1; + --button-text-color: var(--text-color); + --button-text-color-hover: var(--text-color); + --button-border-color: @surface0; + --button-border-color-hover: @surface0; + --button-background-color: @surface0; + --button-background-color-hover: @surface1; + --input-text-color: var(--text-color); + --input-text-color-hover: var(--text-color); + --input-border-color: @surface0; + --input-border-color-hover: @surface0; + --input-background-color: @mantle; + --input-background-color-hover: @mantle; + --footer-text-color: var(--text-color-subtle); + + .kx-item details summary .info img, + .kx-item details .subsection > img { + filter: @text-filter; + } + + kx-claim, + kx-key { + --loader-color: @subtext1; + --success-color: @green; + --failure-color: @red; + --background-color: @surface0; + --header-background-color: @surface1; + } + + a.button.button--donate.button--opencollective { + background-color: @blue; + color: @crust; + + &:hover { + background-color: lighten(@blue, 5%); + } + + svg { + fill: @crust; + } + } + } +} + +@-moz-document domain("docs.keyoxide.org"), domain("blog.keyoxide.org") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + + @text-filter: @catppuccin-filters[@@flavor][@text]; + + #lib.defaults(); + + background-color: @base; + + --clr-primary-100: @crust; + --clr-primary-99: @crust; + --clr-primary-98: @mantle; + --clr-primary-95: @base; + --clr-primary-90: lighten(@accent, 30%); + --clr-primary-80: lighten(@accent, 20%); + --clr-primary-70: lighten(@accent, 10%); + --clr-primary-60: @accent; + --clr-primary-50: darken(@accent, 5%); + --clr-primary-40: darken(@accent, 10%); + --clr-primary-35: darken(@accent, 15%); + --clr-primary-30: darken(@accent, 20%); + --clr-primary-25: darken(@accent, 25%); + --clr-primary-20: darken(@accent, 30%); + --clr-primary-10: darken(@accent, 35%); + --clr-primary-0: @text; + --clr-primary: @accent; + --clr-header: @text; + --clr-header-subtle: @subtext1; + --clr-text: @text; + --clr-text-subtle: @subtext1; + --clr-bg: @mantle; + --clr-bg-alt: @crust; + --clr-border: @surface0; + --clr-link: @blue; + + --clr-secondary-20: @subtext1; + + nav a.active { + color: @crust; + } + + .quick-links img, + [src="/chevron-up.svg"], + [src="/chevron-down.svg"] { + filter: @text-filter; + } + img[title="Keyoxide logo"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + table { + &, + td { + border-color: @surface0; + } + } + + pre { + background-color: @mantle !important; + color: @text !important; + + span[style="color:#c82728;"] { + color: @blue !important; + } + span[style="color:#4271ae;"], + span[style="color:#f07219;"] { + color: @green !important; + } + span[style="color:#8e908c;"] { + color: @overlay0 !important; + } + span[style="color:#8959a8;"] { + color: @mauve !important; + } + span[style="color:#839c00;"] { + color: @green !important; + } + span[style="color:#3e999f;"] { + color: @teal !important; + } + } + + .info { + background-color: @mantle; + + &::before { + background-color: @sky; + color: @crust; + } + } + + .warning { + background-color: @mantle; + + &::before { + background-color: @yellow; + color: @crust; + } + } + + .widget { + background-color: fade(@accent, 60%); + border-color: @accent; + + .title { + color: @text; + } + + input, + select { + background-color: @mantle; + } + } + } +} diff --git a/styles/keyoxide/preview.webp b/styles/keyoxide/preview.webp deleted file mode 100644 index 7c0730851b..0000000000 --- a/styles/keyoxide/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:29d11a7613e01415057fcf11ab946bbaa0df2d91337dd4376923bb1666c27f5a -size 69306 diff --git a/styles/lastfm/README.md b/styles/lastfm/README.md index f19599571c..9781e30fcf 100644 --- a/styles/lastfm/README.md +++ b/styles/lastfm/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/lastfm/catppuccin.user.css b/styles/lastfm/catppuccin.user.css deleted file mode 100644 index 01b1c32ff9..0000000000 --- a/styles/lastfm/catppuccin.user.css +++ /dev/null @@ -1,1728 +0,0 @@ -/* ==UserStyle== -@name Last.fm Catppuccin -@namespace github.com/catppuccin/userstyles/styles/lastfm -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/lastfm -@version 1.2.0 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/lastfm/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alastfm -@description Soothing pastel theme for Last.fm -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("last.fm") { - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @accent-color-dim: darken(@accent-color, 3%); - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - & when not (@lookup = latte) { - @accent-color-dim: fadeout(@accent-color, 50); - .layout-image { - background: @base; - .layout-image-image { - &[src="https://lastfm.freetls.fastly.net/i/u/300x300/4128a6eb29f94943c9d206c08e625904.jpg"], - &[src="https://lastfm.freetls.fastly.net/i/u/237x178/2a96cbd8b46e442fc41c2b86b821562f.jpg"], - &[src="https://lastfm.freetls.fastly.net/i/u/300x300/c6f59c1e5e7240a4c0d427abd71f3dbb.jpg"] - { - mix-blend-mode: screen; - filter: invert(1); - } - } - } - [src="https://lastfm.freetls.fastly.net/i/u/avatar70s/2a96cbd8b46e442fc41c2b86b821562f.jpg"], - [src="https://lastfm.freetls.fastly.net/i/u/64s/4128a6eb29f94943c9d206c08e625904.jpg"], - [src="https://lastfm.freetls.fastly.net/i/u/64s/c6f59c1e5e7240a4c0d427abd71f3dbb.jpg"] - { - mix-blend-mode: screen; - filter: invert(1); - } - .cover-art { - background: @base; - } - .avatar::after, - .cover-art::after, - .image-list-item::after, - .video-thumbnail::after { - box-shadow: inset 0 0 0 1px rgb(@subtext0, 7%); - } - } - - /* ------UNIVERSAL STYLES INCASE SOME GET MISSED------ */ - body { - color: @text; - background: @base; - } - h1 { - color: @accent-color; - } - .mimic-link { - color: @sapphire; - } - hr { - border-color: @overlay1; - } - a { - color: @accent-color; - &:hover { - color: @accent-color-dim; - } - } - - // Mixin to dynamically set colors of album, artist and track categories - - .category-colors() { - &artist { - --category-background: @yellow; - } - &album { - --category-background: @green; - } - &track { - --category-background: @blue; - } - } - - // Evil image mask hack - // Use as follows: - // .maskimage(mask-image, background-color, mask-position, mask-size, mask-repeat); - // Setting any value to "skip" skips that attribute - .mask-image(@mask-image: url(""), @mask-color: skip, @mask-position: skip, @mask-size: skip, @mask-repeat: skip) { - & when not (@mask-color = skip) { - background-image: none !important; - background-color: @mask-color; - } - & when not (@mask-image = skip) { - mask-image: @mask-image; - -webkit-mask-image: @mask-image; - } - & when not (@mask-position = skip) { - mask-position: @mask-position; - -webkit-mask-position: @mask-position; - } - & when not (@mask-size = skip) { - mask-size: @mask-size; - -webkit-mask-size: @mask-size; - } - & when not (@mask-repeat = skip) { - mask-repeat: @mask-repeat; - -webkit-mask-repeat: @mask-repeat; - } - } - /* -----------------SETTINGS------------------- */ - .content-form .form-row-help-text, - .footnotes { - color: @overlay0; - } - .content-form legend { - color: @subtext1; - } - .change-username-upsell { - background: @mantle; - } - .change-username-faded h2::after { - .mask-image(url("/static/images/icons/lock_dark_24@2x.a7652d49d507.png"), @overlay0, skip, 24px 24px, no-repeat); - } - /* -----------CHECKBOXES, DROPDOWNS AND RADIOS---------- */ - .lfm-form-radio input[type="radio"]:checked + label::before { - border-color: @accent-color; - box-shadow: inset 0 0 0 4px @accent-color; - background-color: @base; - } - .lfm-form-radio input[type="radio"] + label::before { - background-color: @crust; - border-color: @surface1; - } - .content-form select { - background-image: none; // Tempfix - } - - /* HOME PAGE */ - .main-content, - .container, - .content-top-has-nav .content-top, - .two-column-layout .content-top { - background-color: @base; - } - - .content-top-has-nav .content-top::after, - .two-column-layout .content-top::after { - border-top-color: @accent-color-dim; - } - - .homefeed .content-top .secondary-nav-item-link--active, - .home-welcome-header { - color: @text; - } - .secondary-nav-item-link { - color: @subtext0; - } - - .secondary-nav-item-link:focus, - .secondary-nav-item-link:hover, - .homefeed .content-top .secondary-nav-item-link--active, - .homefeed .content-top .secondary-nav-item-link--active:focus, - .homefeed .content-top .secondary-nav-item-link--active:hover { - color: @text; - } - - .homefeed { - .content-top .secondary-nav-item { - &--artists, - &--albums, - &--tracks, - &--events { - .secondary-nav-item-link:hover::after { - background-color: @accent-color-dim; - } - } - } - &--artists, - &--albums, - &--tracks, - &--events { - .content-top .secondary-nav-item-link--active::after { - background-color: @accent-color-dim; - } - } - } - .recs-feed .recs-feed, - .grid-items { - &-cover-image-wrap::after { - background-image: linear-gradient( - 180deg, - transparent 0, - rgba(@mantle, 0.4) 50%, - rgba(@mantle, 0.7) 50%, - rgba(@mantle, 0.7) 100% - ); - } - } - - .recs-feed .context { - background: @mantle; - color: @text; - box-shadow: none; - box-shadow: - inset 1px 0 darken(@mantle, 3%), - inset -1px -1px @crust; - } - .recs-feed .recs-feed-item { - background: transparent; - box-shadow: none; - } - - .stationlink-list .stationlink { - color: @subtext0; - &:focus, - &:hover { - color: @text; - &::before { - background-color: @subtext0; - } - } - &::after { - border-bottom-color: @accent-color-dim; - } - &::before { - background-color: @accent-color; - -webkit-filter: invert(0%); - filter: invert(0%); - } - } - - .subscribe-cta, - .mpu-subscription-upsell, - .mpu-subscription-upsell--mpu { - display: none; - } - .join-cta { - background-color: transparent; - } - .join-cta h3 { - color: @accent-color; - } - - .lazy-features-footer { - display: none; - } - /* ERROR */ - #error { - color: @text; - } - - /* LIVE */ - /* MUSIC */ - .content-top-header { - color: @accent-color; - } - - .minimal-navigation-item-link { - &, - &:focus, - &:hover { - color: @subtext0; - } - } - - .minimal-navigation-item-link--active, - .music-section-heading, - .music-more-artists-item-name a, - .music-releases-item-name a { - &, - &:focus, - &:hover { - color: @text; - } - } - - .music-releases-item-artist, - .column-tracks-item-name, - .column-tracks-item-artist, - .music-gallery-artist { - color: @text; - } - - .music-section-rediscover-subscribe-banner-cta { - background-color: @base; - } - - /* PROFILE */ - /* BANNER */ - .header--overview .header-background { - opacity: 0.4; - } - - /* SEARCH */ - .artist-result-heading, - .album-result-heading { - color: @text; - } - - /* RECOMMENDATIONS */ - & when not (@lookup = "latte") { - .recs-feed-title a { - color: @text !important; - } - } - & when (@lookup = "latte") { - .recs-feed-title a { - color: @crust !important; - } - } - .recs-feed-item, - .recs-feed .recs-feed-item { - &-- { - .category-colors(); - } - } - @media (min-width: 768px) { - .recs-feed .context::before { - border-radius: 50%; - content: ""; - height: 32px; - left: auto; - position: absolute; - right: 15px; - top: -16px; - width: 32px; - background: var(--category-background) !important; - z-index: 1; - } - .recs-feed .recs-feed-item .context::after { - .mask-image(url("/static/images/icons/rec_types_16.93a8040cce71.png"), @crust, 0 0, 32px 160px, no-repeat); - z-index: 2; - } - .recs-feed .recs-feed-item--album .context::after { - -webkit-mask-position: 0 -64px; - } - .recs-feed .recs-feed-item--artist .context::after { - -webkit-mask-position: 0 -32px; - } - } - .recs-feed .context-love-icon::before { - .mask-image(url("/static/images/icons/love_12.be2fe9170476.png"), @red, 0 0, 12px 12px, no-repeat); - } - .secondary-nav { - box-shadow: inset 0 -1px @accent-color; - } - .music-recommended-artists-artist-name, - .music-recommended-artists-context, - .pagination-page, - .pagination-next { - color: @text; - } - - .music-recommended-albums- { - &item-name, - &album-artist, - &album-context { - color: @text; - } - } - - .recommended-tracks-item-name, - .recommended-tracks-item-artist, - .big-tags-item-context { - color: @text; - } - - p { - color: @subtext0; - } - - /* RECAP PROMOS */ - .promo-v3 .listening-report-promo { - background: @mantle; - border-color: rgba(@mantle, 0.5); - &:hover, - &:focus { - background: @crust; - border-color: rgba(@crust, 0.5); - } - &-date::after { - .mask-image(url("/static/images/listening-report/v3/report-arrow-up.b6c5a2eb4c3b.svg"), @text, skip, contain); - height: 0; - width: 0; - padding: 7px; - filter: none; - } - } - - /* CHARTS */ - .adaptive-skin-wrapper, - .row { - background-color: @base; - } - - .two-column-layout .container { - background-size: 0; - background-position: 0 0; - background-color: @base; - } - - ._buffer-reset, - .sidebar-heading { - color: @accent-color; - } - - .sidebar-group-heading { - color: @text; - } - - .resource-list--sidebar-item-name { - color: @text; - } - .js-link-block.globalchart-item { - background-color: @crust; - box-shadow: - 0 1px @base, - inset 0 -1px @base; - } - .globalchart a, - .globalchart a:focus, - .globalchart a:hover { - color: @text; - } - - .footer-top-row { - background-color: @mantle; - } - - /* EVENTS */ - .events-filter, - .events-filter-recommended, - .dropdown-menu-clickable-button:focus, - .dropdown-menu-clickable-button:hover { - color: @text; - } - - .events-filters { - border-bottom-color: @accent-color; - } - - .events-list-item-venue--address, - .events-list-item-event--lineup { - color: @subtext0; - } - .events-list-anhv1 a, - .events-list-anhv1 a:focus, - .events-list-anhv1 a:hover, - .events-list-item-event--title, - .events-list-item-venue--title { - color: @text; - } - - /* FEATURES */ - .features-header .features-teaser-body, - .features-teaser-wrap--promoted .features-teaser-body { - background: @base; - } - - .features-teaser-title a, - .features-teaser-title a:focus, - .features-teaser-title a:hover { - color: @text; - } - - /* FEATURES POST */ - .features-post-header-body { - background-color: @base; - } - - .features-post-header-title { - color: @accent-color; - } - - .features-post-artist { - color: @text; - } - - .features-post-byline-item.features-post-author { - color: @text; - } - - /* PROFILE */ - .header-avatar-add { - &, - &:not(.cta--inactive):focus, - &:not(.cta--inactive):hover { - background-color: @accent-color-dim; - } - } - .dropdown-menu-clickable, - #share-library-artist, - .dropdown-menu-clickable-item:active, - body:not([data-whatinput="touch"]) .dropdown-menu-clickable-item:focus, - body:not([data-whatinput="touch"]) .dropdown-menu-clickable-item:hover { - background-color: @base; - } - .header--overview { - background-color: @base; - } - .header-metadata .header-metadata-title, - .header-scrobble-since, - .header-title-display-name { - color: @subtext1; - } - .chartlist-play-button::before { - background-color: @accent-color; - -webkit-filter: invert(0%); - filter: invert(0%); - } - .chartlist-play-button:focus:focus::before, - .chartlist-play-button:focus:hover::before, - .chartlist-play-button:hover:focus::before, - .chartlist-play-button:hover:hover::before { - box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.15); - background-color: @subtext0; - } - - .text-Color-link, - h2, - .dropdown-menu-clickable-button.disclose-active { - color: @accent-color; - } - .dropdown-menu-clickable-button, - .dropdown-menu-clickable-item--selected { - &, - &:focus, - &:hover { - color: @accent-color; - } - } - .dropdown-menu-clickable-item, - .dropdown-menu-clickable-item:active, - body:not([data-whatinput="touch"]) .dropdown-menu-clickable-item:focus, - body:not([data-whatinput="touch"]) .dropdown-menu-clickable-item:hover { - color: @text; - } - .btn-secondary { - background-color: @accent-color-dim; - color: @crust; - } - - body:not(.js-focus-visible) - body:not([data-whatinput="touch"]) - .btn-secondary:focus, - body:not([data-whatinput="touch"]) .btn-secondary .focus-visible, - body:not([data-whatinput="touch"]) .btn-secondary:hover { - background-color: @accent-color; - color: @crust; - } - input[type="password"] { - background-color: @crust !important; - border-color: @crust !important; - } - - @keyframes chartlist-anim { - 0% { - background-position: 0% 50%; - } - 50% { - background-position: 100% 51%; - } - 100% { - background-position: 0% 50%; - } - } - @keyframes chartlist-anim { - 0% { - background-position: 0% 50%; - } - 50% { - background-position: 100% 51%; - } - 100% { - background-position: 0% 50%; - } - } - @keyframes chartlist-anim { - 0% { - background-position: 0% 50%; - } - 50% { - background-position: 100% 51%; - } - 100% { - background-position: 0% 50%; - } - } - - .chartlist-row--highlight, - .chartlist-row--now-scrobbling { - /* background-color: #5a1717; */ - background: linear-gradient(270deg, @base 60%, rgba(@accent-color, 0.2)); - background-size: 200% 200%; - -webkit-animation: chartlist-anim 10s ease infinite; - -moz-animation: chartlist-anim 10s ease infinite; - animation: chartlist-anim 10s ease infinite; - } - - .chartlist-name, - .chartlist-artist { - color: @subtext0; - } - - .chartlist-break::after, - .chartlist-row::after { - border-bottom-color: @surface0; - } - - .chartlist-row:hover { - background-color: @crust; - } - - .chartlist-count-bar-slug { - background-color: transparent !important; - background-image: linear-gradient(to right, @accent-color, @accent-color); - color: @crust; - } - .chartlist-count-bar-value { - color: @crust; - } - a:focus .chartlist-count-bar-slug, - a:hover .chartlist-count-bar-slug { - background-color: @accent-color-dim; - } - - .chartlist-count-bar-link { - &, - &:focus, - &:hover { - color: @text; - } - } - - .shout-form textarea { - background-color: @crust; - } - - .chartlist-index { - color: @text; - } - - .chartlist tr:nth-child(1) td.chartlist-index { - color: @accent-color; - } - - /* LISTENING REPORT */ - - // Set color for containers - - .report-box-container { - background: @mantle; - color: @text; - } - - // Topmost report box - - .report-box-container--overview { - background: @accent-color; - color: @base; - // Top border design (////) - .report-headline-border { - .mask-image(url("/static/images/listening-report/v3/bg-lines.73682e46b8be.svg")); - background: @base; - } - .report-headline-top { - color: @base; - border-bottom-color: @base; - } - // Comparison badge colors - .report-headline-meta - .badge-container - .report-badge.report-badge--comparison { - border-color: @base; - .report-arrow { - background: @base; - } - } - // Topmost report chart styling - .report-headline__chart { - .highcharts-series-0 .highcharts-point { - fill: @base; - stroke: rgba(@base, 0.5); - } - .highcharts-series-1 .highcharts-point { - fill: rgba(@base, 0.5); - stroke: transparent; - } - .highcharts-axis-labels { - stroke: @base; - } - } - } - // Middle report containers - .user-dashboard-layout--version-3 .main-content, - .user-dashboard-layout--version-3 .user-dashboard > .container { - // Set background - background: @base; - .listening-report-row { - // Header divider colors follow accent - border-bottom-color: @accent-color; - } - .top-item-overview { - // Style category boxes - &-- { - .category-colors(); - } - background: var(--category-background); - color: @base; - // Badge color is base on accent - .badge-container { - .report-badge { - border-color: @base; - } - .report-badge--comparison .report-arrow { - background: @base; - } - } - // Chart styling - .highcharts-series-group .highcharts-point { - fill: @base; - } - } - // Set color for badges - .listening-report-top-item { - &-- { - .category-colors(); - } - .listening-report-top-item-badge { - background: var(--category-background); - } - color: @text; - } - .top-new-item-type { - &__ { - .category-colors(); - } - background: var(--category-background); - } - // Triangle visualizer comparison subtext - .triangle-ratio--details .comparison { - color: @subtext0; - } - // Style badges on mantle background - .badge-container .report-badge--comparison { - border-color: @text; - .report-arrow { - background: @text; - vertical-align: initial; - } - } - // Style subtext - .quick-fact-row { - color: @subtext1; - &:hover { - color: @text; - } - } - .listening-report-highlight-comparison, - .quick-fact-comparison-text { - color: @subtext0; - } - // User comparison icons - .tag-label { - background: linear-gradient( - 90deg, - darken(@accent-color, 5%), - @accent-color - ); - // Total scrobbles header - &--total-scrobbles::before { - .mask-image(url("/static/images/icons/icon-scrobble.66a5e6978c62.svg"), @base); - } - // Highest discovery header - &--discovery::before { - .mask-image(url("/static/images/icons/icon-compass.ce30ab3b6240.svg"), @base); - } - } - .header-metadata-title { - color: @text; - } - .listening-report-brick { - &-divider { - border-color: @surface0; - } - &-head { - border-bottom-color: @crust; - } - &-inner:hover { - background: mix(@mantle, @base); - } - &-item-scrobbles { - color: @overlay1; - } - // Highlight self for higher or lower position on chart - &-inner--highlight { - &.listening-report-highlight--down { - background: rgba(@red, 0.1); - &:hover { - background: rgba(@red, 0.15); - } - } - &.listening-report-highlight--up { - background: rgba(@green, 0.1); - &:hover { - background: rgba(@green, 0.15); - } - } - } - } - } - - // footer - .user-dashboard-layout--version-3 .footer { - background-color: @mantle; - } - - // Top tags visualizer: Rainbow colors implemented from Catppuccin Palette - - @gradient-colors: @rosewater, @flamingo, @pink, @mauve, @red, @maroon, - @peach, @yellow, @green, @teal, @sky, @sapphire, @blue, @lavender; - each(range(0, 11), { - - .report-box-container--top-tags-over-time .top-tags-over-time-colour-@{value} { - fill: extract(@gradient-colors, @value + 1); - stroke: extract(@gradient-colors, @value + 1); - } - }); - - .highcharts-radial-axis-grid .highcharts-grid-line { - stroke: @surface0; - } - - // universal report arrows - .report-arrow { - .mask-image(url("/static/images/listening-report/v3/report-arrow-up.b6c5a2eb4c3b.svg"), @base, skip, contain); - background-size: contain; - padding: 4px; - margin: 2px; - height: 0; - width: 0; - filter: invert(0) !important; - } - - .music-decades-chart-container { - .highcharts-series-1 .highcharts-point { - fill: rgba(@accent-color, 0.5); - } - } - - /* SHOUT BOX */ - - .shout { - &--active { - background-color: fadeout(@surface1, 0.3); - } - - &, - &-form { - border-bottom-color: @surface0; - } - &-user a { - color: @text; - } - &-timestamp, - &-reply { - color: @subtext0; - &:hover { - color: @overlay2; - } - } - &-reply::before { - .mask-image(url("/static/images/icons/reply_sprite_16@2x.a145ef7db2f5.png"), @subtext0, skip, 16px 32px); - } - - &-form { - border-color: none; - } - &-permalink.shout-permalink { - &:focus, - &:hover { - color: @overlay2; - } - } - .vote-button { - color: @overlay1; - &::before { - .mask-image(url("/static/images/icons/upvote_sprite_16@2x.5e02a31189da.png"), @overlay2, 0 0, 16px 32px); - } - &--voted { - color: @green; - &::before { - .mask-image(skip, @green, 0 -16px, skip); - } - } - } - } - - /* LIBRARY */ - .col-sidebar._buffer-sidebar - > figure - > div - > div - > svg - > .highcharts-background { - fill: @base; - } - - .highcharts-point { - fill: @accent-color-dim; - &-select { - fill: @accent-color; - } - } - - .highcharts-axis-labels > text { - fill: @text !important; - } - - #scrobble-chart-content { - .highcharts-background { - fill: @base; - } - .highcharts-point { - fill: rgba(@accent-color, 0.2); - } - .highcharts-xaxis .highcharts-axis-line, - .highcharts-yaxis-grid .highcharts-grid-line { - stroke: @surface2; - stroke-width: 1; - } - .highcharts-axis-title { - fill: @subtext0 !important; - } - } - - /* FOLLOWING */ - .user-list-name { - color: @text; - } - .user-follow, - .user-follow::after { - color: @accent-color; - background-color: @surface0; - } - - /* FOLLOW BUTTON */ - [data-toggle-button-current-state="unfollowed"] - .header-follower-btn::before { - background-color: @red; - color: @text; - } - [data-toggle-button-current-state="followed"] .header-follower-btn::before { - background-color: @green; - color: @text; - } - [data-toggle-button-current-state="followed"] - .header-follower-btn:hover::before { - background-color: @red; - color: @text; - } - - .header-follower-btn { - color: @accent-color; - } - - /* BOOKMARKS */ - .music-bookmarks-artists-item-name { - color: @text; - } - - /* TASTE-O-METER COLORS */ - .tasteometer-donut-base { - fill: @surface1; - } - .tasteometer-avatar img { - border-color: @surface1; - } - .tasteometer-compat-very_low .tasteometer-compat-colour { - color: @subtext0; - fill: @subtext0; - } - .tasteometer-compat-low .tasteometer-compat-colour { - color: @mauve; - fill: @mauve; - } - .tasteometer-compat-medium .tasteometer-compat-colour { - color: @green; - fill: @green; - } - .tasteometer-compat-very_high .tasteometer-compat-colour { - color: @peach; - fill: @peach; - } - .tasteometer-compat-super .tasteometer-compat-colour { - color: @red; - fill: @red; - } - - /* ARTIST */ - .section-with-separator::after { - background-color: @base; - } - body .header-new-bookmark-button, - body .header-new-download-button, - body .header-new-love-button, - body .header-new-more-button { - color: @base; - background-color: @accent-color; - } - body:not([data-whatinput="touch"]) { - .header-new-bookmark-button, - .header-new-download-button, - .header-new-love-button, - .header-new-more-button { - .focus-visible, - &:hover { - color: @base; - background-color: @accent-color; - } - } - } - .wiki-block-inner, - .catalogue-metadata-heading, - .catalogue-metadata-description, - .header-metadata-tnew-title { - color: @subtext0; - } - - .text-18 { - color: @accent-color; - } - - .artist-similar-artists-sidebar-item-name, - .artist-top-albums-item-name, - .listeners-section-item-name, - .catalogue-overview-similar-artists-full-width-item-name, - .similar-albums-item-name, - .discovery-stat-top-item-name, - .source-album-artist, - .source-album-name, - .track-similar-tracks-item-name, - .about-artist-name, - .catalogue-overview-similar-artists-item-name { - a { - &, - &:focus, - &:hover { - color: @text; - } - } - } - - .events-list-item-event-name.link-block-target > span { - color: @text; - } - - .events-list-item-venue > span { - color: @subtext0; - } - - .resource-external-link, - .resource-external-link:hover { - color: @text; - } - .js-playlink-station.desktop-playlink.inline-section-control.stationlink { - color: @text; - } - .section-with-settings .section-control::before { - border-right-color: @subtext0; - } - - .header-metadata .header-metadata-display a { - color: @accent-color; - } - - .big-artist-list-title a { - color: var(--subtext1); - } - .big-artist-list-title a:hover { - color: @text; - } - - /* SIMILAR ARTISTS */ - .similar-artists-item-name { - color: @text; - } - - .similar-artists-item-wiki-inner-2 { - color: @subtext0; - } - - .section-playlink::before { - background-color: @accent-color; - -webkit-filter: invert(0%); - filter: invert(0%); - } - - .section-playlink:hover::before { - box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.15); - background-color: @subtext0; - } - - .section-playlink.js-playlink-station { - color: @text; - } - - .stationlink::before { - background-color: @accent-color; - -webkit-filter: invert(0%); - filter: invert(0%); - } - - .stationlink:focus::before, - .stationlink:hover::before { - box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.15); - background-color: @subtext0; - } - - .video-preview-upload-cta { - background-color: @crust; - box-shadow: 0 0 0 2px @accent-color-dim; - } - - .video-preview-upload-cta:not(.cta--inactive):focus, - .video-preview-upload-cta:not(.cta--inactive):hover { - background-color: @base; - } - - .highcharts-plot-bands-0 > path { - fill: @overlay0; - } - - .listener-trend .highcharts-area { - fill: fadeout(@red, 0.1); - } - - .listener-trend .highcharts-graph { - stroke: @red; - } - - .Colored-cta { - background-color: fadeout(@surface2, 0.3); - } - .Colored-cta:not(.cta--inactive):focus, - .Colored-cta:not(.cta--inactive):hover { - background-color: fadeout(@surface2, 0.7); - } - .similar-items-sidebar-item-name { - color: @text; - } - .resource-list--release-list-item-name { - color: @text; - } - .shout--deleted, - .shout--reported { - background: @base; - } - .play-this-track-playlinks { - color: @text; - } - - /* WIKI */ - .factbox-item, - #factbox-more-members { - color: @subtext0; - } - - .factbox-item > h4 { - color: @accent-color; - } - - .alert-warning { - color: @peach; - background-color: @crust; - } - - .content-form { - .form-control, - input[type="date"], - input[type="email"], - input[type="number"], - input[type="password"], - input[type="text"], - input[type="url"], - select, - textarea { - background-color: @crust !important; - border-color: @crust !important; - color: @subtext0 !important; - &:focus { - box-shadow: none !important; - border-color: @crust !important; - } - &:hover:not([disabled]) { - border-color: @crust !important; - color: @text !important; - } - } - } - .control-label { - color: @accent-color; - } - .join-form .form-row-help-text { - color: @text; - background-color: @surface1; - } - #stylerules { - background-color: @overlay0; - color: @subtext0; - } - .secondary-nav-item-link--active::after, - a.secondary-nav-item-link:focus::after, - a.secondary-nav-item-link:hover::after { - background-color: @accent-color; - } - - /* DOCUMENTATION/API SECTION */ - #app { - .sidebar { - background: @mantle; - border-color: @mantle; - } - a.sidebar-link { - color: @text; - &:hover { - color: @accent-color; - } - } - .sidebar-heading { - color: @subtext1; - } - a.sidebar-link.active { - color: @accent-color; - border-left-color: @accent-color; - } - a { - color: @accent-color; - } - } - - /* OBSESSIONS */ - .obsession-history-play-all::before { - background-color: @accent-color; - -webkit-filter: invert(0%); - filter: invert(0%); - color: @text; - } - - .obsession-history-play-all.js-playlink-station.inline-section-control { - color: @text; - } - - .obsession-history-play-all:hover::before { - box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.15); - background-color: @subtext0; - } - - .obsession-search-result-header { - color: @accent-color; - } - - .obsession-candidate-heading { - color: @text; - } - - .modal-dialog.popup_content, - .modal-content { - background-color: @mantle; - box-shadow: none; - } - - .modal-body { - background-color: @base; - box-shadow: none; - } - - .content-form textarea:focus { - box-shadow: none; - } - - .content-form textarea:hover:not([disabled]) { - border-color: @accent-color; - } - - /* MESSAGES */ - .inbox-notifications .inbox-notifications__item { - color: @subtext0; - } - - .inbox-notifications .inbox-notifications__item--highlight { - background-color: @overlay0; - } - .inbox-notifications .inbox-notifications__item--hover { - box-shadow: none; - } - .inbox-notifications__item--highlight-hover:hover { - background-color: @crust; - } - - .inbox-message-subject { - color: @accent-color; - } - - .inbox-message-message { - color: @text; - } - - .inbox-message-view .inbox-message-message blockquote { - background: @crust; - border-color: @accent-color; - } - - body:not([data-whatinput="touch"]) - .inbox-notifications - .inbox-notifications__item--hover:hover { - background-color: @crust; - } - - .inbox .inbox-message { - background-color: @crust; - } - - .inbox .inbox-message--unviewed { - background-color: @overlay0; - } - - .inbox .inbox-message--unviewed .inbox-message-status::after { - background-color: @accent-color; - } - - /* ADS */ - .lastfm-ad { - display: none; - } - .full-bleed-ad-container, - .sidebar-ad-container { - background-color: @base; - } - - /* RECOMMENDATIONS ON PROFILE */ - .profile-card-content { - background: @surface0 !important; - } - /* UPGRADE TO PRO */ - .btn-subscribe, - .btn-subscribe:hover, - .btn-subscribe:active { - background-color: @accent-color !important; - } - .listening-report-brick--upsell { - display: none; - } - .your-progress { - color: @text; - } - /* ----Profile Cards Hide------- */ - .profile-cards-container { - display: none !important; - } - /* HEADER */ - .header--overview, - .header--sub-page { - color: @text; - } - /* -----Primary Button------ */ - .btn-primary, - .btn-primary:hover, - .btn-primary:active, - .no-data-message-button, - .no-data-message-button:hover, - .no-data-message-button:active, - .api-session-connect, - .api-session-disconnect:hover, - .api-session-disconnect:active, - .clipboard-button, - body:not(.js-focus-visible) - body:not([data-whatinput="touch"]) - .clipboard-button:focus, - body:not([data-whatinput="touch"]) .clipboard-button .focus-visible, - body:not([data-whatinput="touch"]) .clipboard-button:hover { - background-color: @accent-color !important; - color: @base !important; - } - .api-session-disconnect { - background-color: @accent-color-dim !important; - color: @base !important; - } - /* -----Shortcut Button------ */ - .btn-shortcut, - .btn-shortcut:hover, - .btn-shortcut:active { - background-color: @accent-color-dim !important; - color: @text !important; - } - /* ------HEADER----- */ - header { - background: @mantle; - } - /* ------FOOTER----- */ - .footer .footer-heading { - color: @subtext1; - } - .footer { - background-color: @mantle; - color: @text; - } - .footer .footer-bottom { - border-top-color: none; - } - .footer .footer-bottom .row { - background-color: @mantle; - } - .footer .footer-language--active, - .footer-timezone strong, - .footer .footer-language--active strong { - color: @text; - } - .footer .footer-language, - .footer-timezone, - .footer .footer-legal { - color: @overlay0; - } - .translation { - color: @subtext0; - } - /* --------TOP BAR---------- */ - .top-bar, - .player-bar, - .player-bar .player-bar-progress, - .main-content::before, - .masthead-nav { - background: @mantle; - color: @text !important; - } - .player-bar .player-bar-progress-slug { - background: @accent-color; - } - .masthead-nav-control, - .site-auth-control, - .site-auth--anon::before, - .masthead-nav .navlist-more { - color: @text !important; - } - .auth-dropdown-menu { - background-color: @base !important; - box-shadow: - 0 1px 10px rgba(0, 0, 0, 0.3), - 0 0 0 1px @surface1 !important; - } - .auth-dropdown-menu-item { - color: @text !important; - } - .auth-dropdown-menu-item:hover, - .auth-dropdown-menu-item:active { - background-color: @surface0 !important; - color: @text !important; - } - .auth-dropdown-menu::before, - .js .auth-dropdown-menu::before, - .site-auth:focus .auth-dropdown-menu::before, - .site-auth:hover .auth-dropdown-menu::before { - .mask-image(url("/static/images/dropdown_arrow_dark@2x.7b7cfaa4e8ee.png"), @surface1, skip, 36px 18px, no-repeat); - } - .masthead-nav .masthead-nav-control, - .masthead-nav .navlist-more, - .site-auth-control { - &:focus, - &:hover { - background-color: transparent; - color: @accent-color !important; - } - } - .site-auth-control.btn-secondary { - color: @base !important; - } - .masthead-search-form { - background-color: @mantle; - } - .masthead-search-submit { - background-color: @accent-color; - color: @base; - } - body:not(.js-focus-visible) - body:not([data-whatinput="touch"]) - .masthead-search-submit:focus, - body:not([data-whatinput="touch"]) .masthead-search-submit .focus-visible, - body:not([data-whatinput="touch"]) .masthead-search-submit:hover { - background-color: @accent-color; - color: @base; - } - .masthead-search-field { - color: @text; - } - /* -------PLAYLISTS--------- */ - .chartlist-timestamp { - color: @subtext0; - } - /* -----GENRES TODAY----- */ - .genretodaybar, - .rolling_no { - background: @mantle !important; - } - /* -----NAV ITEMS----- */ - .library-controls .secondary-nav .secondary-nav-item-link--active, - .date-range-picker-button-inner, - .library-controls .secondary-nav .secondary-nav-item-link--active:focus, - .library-controls .secondary-nav .secondary-nav-item-link--active:hover, - body:not([data-whatinput="touch"]) .catalogue-tags .tag a:hover { - color: @accent-color !important; - } - /* ------ARTIST TAGS----- */ - .catalogue-tags .tag a, - .catalogue-tags .tags-add, - .catalogue-tags .tags-add-cta, - body:not([data-whatinput="touch"]) .catalogue-tags .tag a:hover { - color: @accent-color; - box-shadow: inset 0 0 0 1px @accent-color-dim; - } - /* -----HIDE PLAY BUTTON ON TOP TRACK------ */ - .image-overlay-playlink-link::before { - display: none; - } - /* ---------CHARTS FIX--------- */ - .globalchart .globalchart-item:first-child { - background-color: fadeout(@mantle, 0.8); - } - .globalchart-item:first-child .globalchart-rank { - color: @accent-color !important; - } - .globalchart-item .globalchart-rank { - color: @text; - } - /* -------LOG IN PAGE------- */ - .auth-container > .auth-container-animation { - background-color: transparent; - } - #join-animation-container { - display: none !important; - } - h1.text-24 { - color: @accent-color; - } - .checkbox { - color: @text; - } - - /* ----ICONS---- */ - .lazy-buylinks-toggle::before { - .mask-image(url("/static/images/icons/download_sprite_16.2d7999c89e09.png"), @text); - } - - .chartlist-more-button::before { - .mask-image(url("/static/images/icons/more_sprite_16.bceb4a93c77a.png"), @text); - } - - .lazy-buylinks-toggle:hover::before, - .lazy-buylinks-toggle:focus::before, - .chartlist-more-button:hover::before, - .chartlist-more-button:focus::before { - background-color: @subtext0; - } - - .chartlist-love-button, - .header-new-love-button { - &::before { - .mask-image(url("/static/images/icons/love_animation_tracklist_24.3c884b0287d4.png"), @text, -24px 0); - } - &:focus::before, - &:hover::before { - .mask-image(skip, @red, -24px 0); - } - } - - [data-toggle-button-current-state="loved"] .chartlist-love-button, - [data-toggle-button-current-state="loved"] .header-new-love-button { - &::before, - &:focus::before, - &:hover::before { - .mask-image(skip, @red, -552px 0); - transition: mask-position 0.7s steps(22) !important; - -webkit-transition: -webkit-mask-position 0.7s steps(22) !important; - } - } - - .section-settings-toggle::before { - .mask-image(url("/static/images/icons/settings_222_16.f63779d3cbad.png"), @text); - } - - .share-button-profile::before { - .mask-image(url("/static/images/icons/share_222_16.9aba752fb1e9.png"), @text); - } - - .section-settings-toggle:hover::before, - .section-settings-toggle:focus::before, - .share-button-profile:hover::before, - .share-button-profile:focus::before { - background-color: @subtext0; - } - - .cta-link::before, - .lyrics-snippet-more-link ::before, - .trending-tracks-more-link ::before, - .more-link-fullwidth-right ::before { - .mask-image(url("/static/images/icons/arrow_small_right_005399_12.8f025ef116be.png"), @accent-color); - } - - .play-this-track-playlink--itunes::before { - .mask-image(url("/static/images/icons/apple_music_color_24.17c0b1b9e185.png"), @text); - } - - .resource-external-link--homepage::before { - .mask-image(url("/static/images/icons/external_links_16.3d45e81fa3fc.png"), @text); - } - - .alert-warning::before { - .mask-image(url("/static/images/icons/alert/warning_16.93f2fe437139.png"), @peach); - } - - .masthead-search-toggle::before { - .mask-image(url("/static/images/icons/search_16.bde37072495a.png"), @text); - } - - .masthead-search-toggle:hover::before, - .masthead-search-toggle:focus::before { - background-color: @subtext0; - } - - .masthead-search-toggle.disclose-active::before { - .mask-image(url("/static/images/icons/delete_999_24.78e2a3de3ab8.png"), @text); - } - - .masthead-search-toggle.disclose-active:hover::before, - .masthead-search-toggle.disclose-active:focus::before { - background-color: @subtext0; - } - - .js .date-range-picker-button::before { - .mask-image(url("/static/images/icons/date_picker_icon.1d7b21ee3a36.svg"), @accent-color, 0 0, 14px 24px, no-repeat); - } - - .masthead-logo { - .mask-image(url("/static/images/logo_static.adb61955725c.png"), @red, 50% 50%, skip, no-repeat); - } - - .catalogue-tags .tags-add::before { - .mask-image(url("/static/images/icons/add_link_16.637996ed0e2f.png"), @accent-color); - } - - .masthead-logo-loading { - .mask-image(url("/static/images/logo_animate@2x.e93e5b7db3de.gif"), @red, 50% 50%, contain, no-repeat); - } - - .layout-image { - background: @crust; - .layout-image-image { - mix-blend-mode: screen; - } - } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color) green(@color) blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/lastfm/catppuccin.user.less b/styles/lastfm/catppuccin.user.less new file mode 100644 index 0000000000..f7bc4df875 --- /dev/null +++ b/styles/lastfm/catppuccin.user.less @@ -0,0 +1,895 @@ +/* ==UserStyle== +@name Last.fm Catppuccin +@namespace github.com/catppuccin/userstyles/styles/lastfm +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/lastfm +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/lastfm/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alastfm +@description Soothing pastel theme for Last.fm +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("last.fm") { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + html, html body { + color: @text; + background-color: @base; + } + + /* Components */ + + a, .mimic-link { + color: @accent; + } + + .btn-primary() { + background-color: @accent; + color: @crust; + + &:hover { + background-color: darken(@accent, 5%) !important; + color: @crust !important; + } + } + .btn-primary { + .btn-primary(); + } + .btn-secondary { + background-color: @surface0; + color: @text; + + &:hover { + background-color: @surface1 !important; + color: @text !important; + } + } + .btn-cancel { + color: @subtext1; + } + + .dropdown-menu-clickable { + background: @mantle; + &::before { + filter: @mantle-filter; + } + + .dropdown-menu-clickable-item { + color: @text; + + &:hover { + background-color: @base !important; + } + + &.dropdown-menu-clickable-item--selected { + color: @accent; + } + } + } + .dropdown-menu-clickable-button { + color: @subtext0; + + &:hover, &.disclose-active { + color: @subtext1; + } + + .section-with-settings &.section-control::before { + border-right-color: @surface2; + } + + &::after { + filter: @subtext1-filter; + } + } + + .content-form { + textarea, input, select { + background-color: @mantle !important; + color: @text !important; + border-color: @surface1 !important; + + &:focus { + box-shadow: 0 3px 9px 0 @surface0 !important; + } + } + + .lfm-form-radio input[type="radio"] { + + label::before { + background-color: @base; + border-color: @overlay1; + } + &:checked + label::before { + box-shadow: inset 0 0 0 4px @accent; + border-color: @accent; + } + } + + .form-row-help-text, .footnotes { + color: @subtext0; + } + + legend { + color: @subtext1; + } + } + + .search-form { + .search-submit::before { + filter: @overlay0-filter; + } + + &::after { + border-right-color: @surface1; + } + } + + // Alerts + .alert-warning { + background-color: fade(@peach, 30%); + color: @peach; + + &::before { + filter: @peach-filter; + } + } + + // Modals + .modal-body { + background: @mantle; + } + + // Other + + .section-with-separator::after { + background-color: @surface0; + } + + .container { + background: @base; + } + + .content-top-back-link { + color: @subtext0; + + a::before { + filter: @overlay2-filter; + } + } + + /* Footer */ + .footer { + background: @mantle; + color: @text; + + .footer-heading { + color: @subtext0; + } + + .footer-language { + color: @subtext0; + &.footer-language--active { + color: @text; + } + } + + .footer-timezone { + color: @subtext0; + strong { + color: @text; + } + } + + .footer-legal { + color: @subtext1; + } + + .container { + background: none; + } + } + + /* Header */ + .top-bar { + background: @mantle; + + svg { + filter: @accent-filter; + } + } + .masthead { + .masthead-search-toggle { + &::before { + filter: @text-filter; + } + &::after { + background-color: @text; + } + } + .masthead-nav .masthead-nav-control { + color: @text; + + &::after { + background-color: @text; + } + } + + .auth-avatar-notification-count-badge { + background: @accent; + } + .auth-dropdown-menu { + background: @mantle !important; + + .auth-dropdown-profile { + background-color: @crust; + + .auth-dropdown-profile-info { + .username { + color: @text; + } + .scrobble-count { + color: @subtext0; + } + } + } + .auth-dropdown-menu-links { + background: @mantle; + + .auth-dropdown-menu-item .auth-dropdown-menu-link img { + filter: @text-filter; + } + } + .auth-dropdown-menu-footer { + background: @mantle; + + .auth-upgrade-cta { + background: @mantle; + box-shadow: inset 0 0 0 1px @overlay0; + color: @yellow; + + &:hover { + box-shadow: inset 0 0 0 1px @yellow !important; + color: @yellow !important; + } + } + .auth-logout-cta { + box-shadow: inset 0 0 0 1px @overlay0; + background: @mantle; + color: @text; + } + } + } + } + + .header { + &.header--overview, &.header--sub-page { + color: @text; + } + &.header--overview .container, &.header--sub-page .container { + background: none; + } + + background: @base; + + .header-info { + .header-featured-track { + .featured-item-heading { + color: @subtext1; + } + } + + .header-title-secondary { + .header-scrobble-since, .header-title-display-name { + color: @subtext1; + } + } + + .header-info-secondary { + color: @text; + } + } + } + .header-metadata .header-metadata-title { + color: @subtext1; + } + .secondary-nav { + .secondary-nav-item-link:hover::after, + .secondary-nav-item-link--active::after { + background: @accent; + } + } + + .chartlist { + .chartlist-row { + &:hover { + background-color: @surface0; + } + + &.chartlist-row--highlight, &.chartlist-row--now-scrobbling { + background-color: fade(@accent, 20%); + } + + .chartlist-play { + .chartlist-play-button { + &::before { + background-color: transparent; + filter: @text-filter; + box-shadow: 0 0 0 1px fade(@mantle, 20%); + } + } + } + + .chartlist-loved { + button.chartlist-love-button { + &::before { + filter: @overlay2-filter; + } + &:hover::before, &[data-analytics-action="UnloveTrack"]::before { + filter: @accent-filter; + } + } + } + + .lazy-buylinks-toggle, .chartlist-more-button { + &::before { + filter: @overlay2-filter; + } + &:hover::before { + filter: @subtext0-filter; + } + } + .chartlist-more { + .chartlist-more-menu { + .more-item--track::before, + .more-item--artist::before, + .more-item--obsession::before { + filter: @subtext0-filter; + } + .more-item--delete::before { + filter: @red-filter; + } + } + } + + .chartlist-timestamp { + color: @subtext0; + + .chartlist-now-scrobbling::before { + filter: @subtext0-filter; + } + } + + .chartlist-bar { + .chartlist-count-bar-slug { + background-color: transparent !important; + background-image: linear-gradient( + to right, + fade(@accent, 20%), + fade(@accent, 20%) + ); + color: @crust; + } + .chartlist-count-bar-value { + color: @text; + } + } + } + .chartlist-break::after, .chartlist-row::after { + border-bottom-color: @surface1; + } + + .cover-art { + img[src="https://lastfm.freetls.fastly.net/i/u/64s/c6f59c1e5e7240a4c0d427abd71f3dbb.jpg"] { + mix-blend-mode: screen; + filter: invert(1); + } + + &::after { + box-shadow: inset 0 0 0 1px fade(@subtext0, 7%); + } + } + } + #top-tracks { + .section-settings-toggle::before, + .share-chart .share-button-profile::before { + filter: @subtext0-filter; + } + } + + /* Track Page */ + .catalogue-metadata .lyrics-snippet-more-link a::before, + .more-link-fullwidth-right a::before, + .more-items::before, + .more-link a::before { + filter: @accent-filter; + } + .more-items { + color: @accent; + } + .catalogue-tags { + .tag a, .tags-add, .tags-add-cta { + color: @accent; + box-shadow: inset 0 0 0 1px @accent; + + &:hover { + color: darken(@accent, 5%) !important; + box-shadow: inset 0 0 0 1px darken(@accent, 5%) !important; + } + } + .tags-add::before { + filter: @accent-filter; + } + } + .source-album .source-album-stats, + .about-artist .about-artist-listeners, + .trending-tracks .trending-tracks-item-listeners, + .catalogue-overview-similar-artists-item-aux-text { + color: @subtext1; + } + + .trending-tracks-section { + &, .container { + color: @text; + background: @surface0; + } + } + + .stationlink-list .stationlink::after, + .resource-external-link::after, + .play-this-track-playlink::after { + border-bottom-color: @surface1; + } + + .video-preview-upload-cta { + background: @surface0; + box-shadow: 0 0 0 2px @surface1; + + &:hover { + background: @surface1 !important; + } + + &::before { + filter: @text-filter; + } + } + + /* Shoutbox */ + #shoutbox { + .shout, + .shout-form { + border-bottom-color: @surface0; + } + + .shout-list { + .shout-user a { + color: @text; + } + .shout-timestamp { + color: @subtext0; + + &:focus, + &:hover { + color: @text !important; + } + } + + .shout-action, + .shout-reply, + .vote-button { + color: @subtext1; + + &::before { + filter: @subtext1-filter; + } + + &:focus, + &:hover { + color: @text !important; + + &::before { + filter: @text-filter; + } + } + } + + .vote-button--voted::before, + .vote-button--unvoted:focus::before, + .vote-button--unvoted:hover::before { + filter: @green-filter !important; + } + + .shout-action-more { + .shout-more-actions { + &::before { + filter: @subtext1-filter; + } + + &:focus::before, + &:hover::before { + filter: @text-filter !important; + } + } + .shout-more-actions-menu { + .more-item--report::before { + filter: @subtext0-filter; + } + } + } + } + } + + /* Settings */ + .main-content, + .content-top-has-nav .content-top, + .two-column-layout .content-top { + background: @base; + } + .two-column-layout .container, .two-column-layout .main-content { + background-image: none; + } + .content-top-has-nav .content-top::after, + .two-column-layout .content-top::after { + border-top-color: @surface1; + } + + .change-username-upsell { + background-color: fade(@yellow, 20%); + } + + /* Inbox/Notifications */ + .inbox-notifications { + .inbox-notifications__item--hover { + box-shadow: inset 0 -1px @surface1; + + &:hover { + background-color: @surface0 !important; + } + } + .inbox-notifications__item--highlight-hover { + background-color: @surface1; + } + .inbox-notifications__item-timestamp { + color: @subtext0; + } + } + .inbox .inbox-buttons .inbox-compose-button { + .btn-primary(); + } + + /* Home */ + .secondary-nav-item-link { + &--active::after { + .homefeed--artists .content-top & { + background-color: @yellow; + } + .homefeed--albums .content-top & { + background-color: @green; + } + .homefeed--tracks .content-top & { + background-color: @blue; + } + .homefeed--events .content-top & { + background-color: @mauve; + } + } + &:hover::after { + .homefeed .content-top .secondary-nav-item--artists & { + background-color: @yellow; + } + .homefeed .content-top .secondary-nav-item--albums & { + background-color: @green; + } + .homefeed .content-top .secondary-nav-item--tracks & { + background-color: @blue; + } + .homefeed .content-top .secondary-nav-item--events & { + background-color: @mauve; + } + } + } + .recs-feed { + .recs-feed-item { + .recs-feed-cover-image-wrap { + color: @text; + } + + .recs-feed-playlink::before { + background-color: @text; + } + + &.recs-feed-item--artist .context { + &::before { + background-color: @yellow; + } + &::after { + mask-position: 0 -32px; + } + } + &.recs-feed-item--track .context { + &::before { + background-color: @blue; + } + &::after { + mask-position: 0 -96px; + } + } + &.recs-feed-item--album .context { + &::before { + background-color: @green; + } + &::after { + mask-position: 0 -64px; + } + } + .context { + // Hack using .mask-image() to allow us to mask icons with a background. + &::before { + border-radius: 50%; + content: ""; + height: 32px; + left: auto; + position: absolute; + right: 15px; + top: -16px; + width: 32px; + z-index: 1; + } + &::after { + .mask-image( + url("/static/images/icons/rec_types_16@2x.5bf9cfd03a3e.png"), + @crust, + 0 0, + 32px 160px, + no-repeat, + ); + z-index: 2; + } + + color: @subtext1; + background-color: @surface0; + box-shadow: inset 1px 0 @surface1, inset -1px -1px @surface1; + } + } + } + + // Events - Browse Popular Music (no event recommendations) + .no-data-message-button { + .btn-primary(); + } + + .stationlinks { + .stationlink-list .stationlink::before { + background-color: @text; + } + } + .mpu-subscription-upsell { + color: @subtext0; + } + .subscribe-cta { + background-color: fade(@yellow, 10%); + } + + .subscribe-cta a, .btn-subscribe { + background-color: @yellow; + color: @crust; + + &:hover { + background-color: darken(@yellow, 5%) !important; + color: @crust !important; + } + } + + /* Profile */ + .profile-cards-items { + .profile-card .profile-card-content { + background: linear-gradient( + 90deg, + @surface0 185px 80%, + fade(@surface0, 75%) 95%, + transparent + ); + + .profile-card-content-title { + color: @text; + } + p { + color: @subtext1; + } + } + } + + /* Reports */ + .listening-report-promo { + background-color: @surface0 !important; + border-color: @surface1 !important; + + .listening-report-promo-date::after { + filter: @overlay2-filter; + } + + .listening-report-promo-title { + color: @subtext0; + } + } + + /* Library */ + .library-controls { + .secondary-nav-item .secondary-nav-item-link { + &::before { + filter: @text-filter; + } + &--active, &:hover { + color: @accent; + + &::before { + filter: @accent-filter; + } + } + } + } + .library-controls-datepicker { + .date-range-picker-button { + color: @accent; + + &::before, .date-range-picker-button-inner::before { + filter: @accent-filter; + } + } + } + .date-range-picker-content { + background-color: @mantle; + + &::before { + filter: @mantle-filter; + } + + .date-range-picker-presets a { + color: @text; + + &:hover { + background-color: @surface0 !important; + } + } + + .date-range-picker-form { + border-top-color: @surface1; + + .control-label { + color: @subtext1; + } + } + } + #scrobble-chart-content { + .highcharts-background { + fill: @base !important; + } + .highcharts-axis-title { + fill: @subtext1 !important; + } + .highcharts-axis-labels text { + fill: @subtext0 !important; + } + + .highcharts-yaxis-grid .highcharts-grid-line { + stroke: @overlay0 !important; + } + .highcharts-xaxis .highcharts-axis-line { + stroke: @overlay1 !important; + } + + .highcharts-series-group { + .highcharts-point { + fill: fade(@accent, 30%); + } + } + + .highcharts-tooltip { + .highcharts-tooltip-box:not(.highcharts-shadow) { + fill: @mantle !important; + stroke: @surface0 !important; + } + + text { + fill: @text !important; + } + } + } + .metadata-title { + color: @subtext1; + } + .date-heading { + color: @subtext0; + } + + // Pagination + .pagination { + .pagination-page { + &[aria-current] { + color: @accent; + box-shadow: inset 0 -2px @accent; + } + &:not(.pagination-page--ellipsis):hover { + box-shadow: inset 0 -2px @accent; + } + } + } + + /* Followers */ + .text-light { + color: @subtext1; + } + .user-list-follower-btn { + [data-toggle-button-current-state="followed"] & { + background-color: @green; + + &:hover { + background-color: @red !important; + } + } + [data-toggle-button-current-state="unfollowed"] & { + background-color: @accent; + + &:hover { + background-color: darken(@accent, 5%) !important; + } + } + + &::before { + filter: @crust-filter; + } + } + + /* Obsessions */ + .obsession-candidates-row::before { + border-top-color: @surface1; + } + + // TODO: https://www.last.fm/music + // TODO: https://www.last.fm/user/*/listening-report/week (Reports) + } +} + +// Usage: +// .maskimage(mask-image, background-color, mask-position, mask-size, mask-repeat); +// Setting any value to "skip" skips that attribute. +// We cannot apply filters to psuedo elements with background-images when the pseudo element also has a background(-color), which is when this must be used. +.mask-image( + @mask-image: url(""), + @mask-color: skip, + @mask-position: skip, + @mask-size: skip, + @mask-repeat: skip, +) { + & when not(@mask-color = skip) { + background-image: none !important; + background-color: @mask-color; + } + & when not(@mask-image = skip) { + mask-image: @mask-image; + } + & when not(@mask-position = skip) { + mask-position: @mask-position; + } + & when not(@mask-size = skip) { + mask-size: @mask-size; + } + & when not(@mask-repeat = skip) { + mask-repeat: @mask-repeat; + } +} diff --git a/styles/lastfm/preview.webp b/styles/lastfm/preview.webp deleted file mode 100644 index 9b0a0d91a6..0000000000 --- a/styles/lastfm/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:a4dc576eb90028fc34ecab45dd9c673fb82d9be48d0fc8dca021b04f41492ae1 -size 116566 diff --git a/styles/learn-x-in-y-minutes/README.md b/styles/learn-x-in-y-minutes/README.md new file mode 100644 index 0000000000..53b0104c2f --- /dev/null +++ b/styles/learn-x-in-y-minutes/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Learn X in Y Minutes + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [nik-rev](https://github.com/nik-rev) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/learn-x-in-y-minutes/catppuccin.user.less b/styles/learn-x-in-y-minutes/catppuccin.user.less new file mode 100644 index 0000000000..966ed644db --- /dev/null +++ b/styles/learn-x-in-y-minutes/catppuccin.user.less @@ -0,0 +1,151 @@ +/* ==UserStyle== +@name Learn X in Y Minutes Catppuccin +@namespace github.com/catppuccin/userstyles/styles/learn-x-in-y-minutes +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/learn-x-in-y-minutes +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/learn-x-in-y-minutes/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alearn-x-in-y-minutes +@description Soothing pastel theme for Learn X in Y Minutes +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("learnxinyminutes.com") { + @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); + + html.light { + #catppuccin(@lightFlavor); + } + + html.dark { + #catppuccin(@darkFlavor); + } + + html:not(.dark, .light) { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + .highlight { + background-color: @mantle; + + pre { + background-color: @mantle !important; + } + } + + &:not(.dark, .light) { + p { + color: @subtext0 !important; + } + + span { + color: @text; + } + } + + .share { + background-color: @mantle; + border-color: @crust; + + &:hover { + background-color: @surface0; + } + } + + .theme-choice button { + color: @text; + background-color: @mantle; + border-color: @crust; + + &:hover { + background-color: @surface0; + } + } + + #lang-select { + color: @text; + background-color: @mantle; + border-color: @crust; + } + + td.lang span a { + color: @text; + background-color: @mantle; + border-color: @crust; + + &:hover { + background-color: @surface0; + } + } + + &, + body { + background-color: @base; + color: @text; + border-color: @base; + box-shadow: none; + } + + td, + th { + color: @text; + border-bottom-color: @surface0; + } + + footer { + p { + color: @subtext1; + } + } + + a { + color: @accent !important; + + code { + color: @accent !important; + } + + &:visited { + color: darken(@accent, 5%) !important; + } + + &.active { + color: @base !important; + background-color: @accent !important; + border-color: darken(@accent, 15%) !important; + + &:visited { + background-color: darken(@accent, 5%) !important; + color: @base !important; + border-color: darken(@accent, 10%) !important; + } + } + } + + hr { + border-color: @surface1; + } + + code { + background-color: @mantle; + color: @text; + } + } +} diff --git a/styles/lemmy/README.md b/styles/lemmy/README.md index 1be664264e..938de631bd 100644 --- a/styles/lemmy/README.md +++ b/styles/lemmy/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Gandalf the Blue](https://github.com/Gandalf-the-Blue) +- [Gandalf-the-Blue](https://github.com/Gandalf-the-Blue)   diff --git a/styles/lemmy/catppuccin.user.css b/styles/lemmy/catppuccin.user.less similarity index 53% rename from styles/lemmy/catppuccin.user.css rename to styles/lemmy/catppuccin.user.less index 56bc1663e2..2f4fb1752c 100644 --- a/styles/lemmy/catppuccin.user.css +++ b/styles/lemmy/catppuccin.user.less @@ -2,8 +2,8 @@ @name Lemmy Catppuccin @namespace github.com/catppuccin/userstyles/styles/lemmy @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/lemmy -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/lemmy/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/lemmy/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alemmy @description Soothing pastel theme for Lemmy @author Catppuccin @@ -15,60 +15,21 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain("lemmy.ml"), - domain("lemmy.world") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("lemmy.ml"), domain("lemmy.world") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); [data-bs-theme="dark"] { --bs-body-color: @text; @@ -89,15 +50,15 @@ --bs-primary-bg-subtle: @base; --bs-secondary-bg-subtle: @mantle; --bs-success-bg-subtle: @green; - --bs-info-bg-subtle: @accent-color; + --bs-info-bg-subtle: @accent; --bs-warning-bg-subtle: @yellow; --bs-danger-bg-subtle: @red; --bs-light-bg-subtle: @base; --bs-dark-bg-subtle: @base; - --bs-primary-border-subtle: @accent-color; - --bs-secondary-border-subtle: @accent-color; + --bs-primary-border-subtle: @accent; + --bs-secondary-border-subtle: @accent; --bs-success-border-subtle: @green; - --bs-info-border-subtle: @accent-color; + --bs-info-border-subtle: @accent; --bs-warning-border-subtle: @yellow; --bs-danger-border-subtle: @red; --bs-light-border-subtle: @crust; @@ -107,14 +68,14 @@ --bs-link-color: @blue; --bs-link-hover-color: @maroon; --bs-code-color: @lavender; - --bs-highlight-color: @accent-color; + --bs-highlight-color: @accent; --bs-highlight-bg: @mantle; --bs-border-color: @crust; --bs-form-valid-color: @green; --bs-form-valid-border-color: @green; --bs-form-invalid-color: @red; --bs-form-invalid-border-color: @red; - --bs-dark-rgb: @accent-color; + --bs-dark-rgb: @accent; --bs-btn-bg: @base; } @@ -124,7 +85,7 @@ } .nav-link { - color: @accent-color; + color: @accent; } .card { --bs-card-cap-bg: @mantle; @@ -145,11 +106,11 @@ --bs-btn-color: @text; --bs-btn-bg: @base; --bs-btn-border-color: @overlay1; - --bs-btn-hover-color: @accent-color; + --bs-btn-hover-color: @accent; --bs-btn-hover-bg: @crust; --bs-btn-hover-border-color: @overlay2; --bs-btn-active-color: @text; - --bs-btn-active-bg: @accent-color; + --bs-btn-active-bg: @accent; --bs-btn-active-border-color: @crust; --bs-btn-active-shadow: inset 0 3px 5px @crust; --bs-btn-disabled-color: @red; @@ -168,10 +129,10 @@ --bs-dropdown-border-color: @mantle; --bs-dropdown-box-shadow: @mantle; --bs-dropdown-link-color: @blue; - --bs-dropdown-link-hover-color: @accent-color; + --bs-dropdown-link-hover-color: @accent; --bs-dropdown-divider-bg: @overlay0; --bs-dropdown-link-hover-bg: @crust; - --bs-dropdown-link-active-color: @accent-color; + --bs-dropdown-link-active-color: @accent; --bs-dropdown-link-active-bg: @mantle; --bs-dropdown-link-disabled-color: @red; --bs-dropdown-header-color: @text; @@ -186,10 +147,10 @@ .btn-outline-secondary { --bs-btn-color: @text; --bs-btn-border-color: @mantle; - --bs-btn-hover-color: @accent-color; + --bs-btn-hover-color: @accent; --bs-btn-hover-bg: @crust; --bs-btn-hover-border-color: @overlay0; - --bs-btn-active-color: @accent-color; + --bs-btn-active-color: @accent; --bs-btn-active-bg: @crust; --bs-btn-active-border-color: @crust; --bs-btn-active-shadow: inset 0 3px 5px @crust; @@ -199,7 +160,7 @@ .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { - color: @accent-color; + color: @accent; background-color: @crust; border-color: @mantle; } @@ -215,17 +176,17 @@ --bs-dropdown-border-color: @mantle; --bs-dropdown-box-shadow: @mantle; --bs-dropdown-link-color: @blue; - --bs-dropdown-link-hover-color: @accent-color; + --bs-dropdown-link-hover-color: @accent; --bs-dropdown-divider-bg: @overlay0; --bs-dropdown-link-hover-bg: @crust; - --bs-dropdown-link-active-color: @accent-color; + --bs-dropdown-link-active-color: @accent; --bs-dropdown-link-active-bg: @mantle; --bs-dropdown-link-disabled-color: @red; --bs-dropdown-header-color: @text; } a { - color: @accent-color; + color: @accent; } .text-bg-primary { @@ -233,11 +194,11 @@ } .text-muted { - color: @accent-color; + color: @accent; } .text-bg-light { color: @text !important; - background-color: rgba(#rgbify(@mantle) [], 1) !important; + background-color: rgba(#lib.rgbify(@mantle)[], 1) !important; } .alert-info, .alert-warning { @@ -247,17 +208,3 @@ } } } - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/lemmy/preview.webp b/styles/lemmy/preview.webp deleted file mode 100644 index fee764e700..0000000000 --- a/styles/lemmy/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6570fe8e224449b00d315f96335ddc10cbf392ab4f7cae25d0520ebab463f3fe -size 299738 diff --git a/styles/libreddit/README.md b/styles/libreddit/README.md index c063e15620..232a6fef72 100644 --- a/styles/libreddit/README.md +++ b/styles/libreddit/README.md @@ -10,20 +10,22 @@

- +

-

- -

+## Usage + +> [!IMPORTANT] +> This userstyle also applies to [Redlib](https://github.com/redlib-org/redlib). +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find! ## ๐Ÿ’– Past Maintainer -- [Lemon](https://github.com/unseen-ninja) +- [unseen-ninja](https://github.com/unseen-ninja)   diff --git a/styles/libreddit/catppuccin.user.css b/styles/libreddit/catppuccin.user.css deleted file mode 100644 index 9a2b17ec05..0000000000 --- a/styles/libreddit/catppuccin.user.css +++ /dev/null @@ -1,191 +0,0 @@ -/* ==UserStyle== -@name Libreddit/Redlib Catppuccin -@namespace github.com/catppuccin/userstyles/styles/libreddit -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/libreddit -@version 2.0.7 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/libreddit/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alibreddit -@description Soothing pastel theme for Libreddit and Redlib -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("libredd.it"), -domain("libreddit.spike.codes"), -domain("libreddit.dothq.co"), -domain("libreddit.kavin.rocks"), -domain("reddit.invak.id"), -domain("reddit.phii.me"), -domain("lr.riverside.rocks"), -domain("libreddit.strongthany.cc"), -domain("libreddit.database.red"), -domain("libreddit.privacy.com.de"), -domain("libreddit.domain.glass"), -domain("libreddit.sugoma.tk"), -domain("libreddit.jamiethalacker.dev"), -domain("reddit.artemislena.eu"), -domain("r.nf"), -domain("libreddit.some-things.org"), -domain("reddit.stuehieyr.com"), -domain("lr.mint.lgbt"), -domain("libreddit.igna.rocks"), -domain("libreddit.autarkic.org"), -domain("libreddit.flux.industries"), -domain("libreddit.drivet.xyz"), -domain("lr.oversold.host"), -domain("libreddit.de"), -domain("libreddit.pussthecat.org"), -domain("libreddit.mutahar.rocks"), -domain("libreddit.northboot.xyz"), -domain("leddit.xyz"), -domain("de.leddit.xyz"), -domain("lr.cowfee.moe"), -domain("libreddit.hu"), -domain("libreddit.totaldarkness.net"), -domain("libreddit.esmailelbob.xyz"), -domain("lr.vern.cc"), -domain("libreddit.nl"), -domain("lr.stilic.ml"), -domain("reddi.tk"), -domain("libreddit.bus-hit.me"), -domain("libreddit.datatunnel.xyz"), -domain("libreddit.crewz.me"), -domain("r.walkx.org"), -domain("libreddit.kylrth.com"), -domain("libreddit.yonalee.eu"), -domain("libreddit.winscloud.net"), -domain("libreddit.tiekoetter.com"), -domain("reddit.rtrace.io"), -domain("libreddit.lunar.icu"), -domain("libreddit.privacydev.net"), -domain("libreddit.notyourcomputer.net"), -domain("r.ahwx.org"), -domain("bob.fr.to"), -domain("reddit.beparanoid.de"), -domain("libreddit.dcs0.hu"), -domain("reddit.dr460nf1r3.org"), -domain("rd.jae.su"), -domain("libreddit.mha.fi"), -domain("libreddit.foss.wtf"), -domain("libreddit.encrypted-data.xyz"), -domain("libreddit.eu.org"), -domain("l.opnxng.com"), -domain("safereddit.com"), -domain("libreddit.projectsegfau.lt"), -domain("libreddit.bus-hit.me"), -domain("reddit.invak.id"), -domain("redlib.catsarch.com"), -domain("reddit.idevicehacked.com"), -domain("redlib.freedit.eu"), -domain("redlib.perennialte.ch"), -domain("redlib.tux.pizza"), -domain("redlib.vimmer.dev"), -domain("libreddit.privacydev.net"), -domain("lr.n8pjl.ca"), -domain("reddit.owo.si"), -domain("redlib.ducks.party"), -domain("red.ngn.tf"), -domain("redlib.dnfetheus.xyz"), -domain("redlib.cow.rip"), -domain("libreddit.eu.org"), -domain("r.darrennathanael.com"), -domain("redlib.kittywi.re"), -domain("redlib.privacyredirect.com") { - .light, - .gruvboxlight { - #catppuccin(@lightFlavor, @accentColor); - } - - .dark, - .black, - .doomone, - .gruvboxdark, - .dracula, - .gold, - .laserwave, - .nord, - .rosebox, - .violet, - :root { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --accent: @accent-color !important; - --green: @green !important; - --text: @text !important; - --foreground: @crust !important; - --background: @base !important; - --outside: @mantle !important; - --post: @mantle !important; - --panel-border: none !important; - --highlighted: @surface0 !important; - --visited: @overlay0 !important; - --shadow: 0 5px 15px 0 transparent !important; - - --nsfw: @peach !important; - --admin: @maroon !important; - - /* thumbnail titles */ - .post_thumbnail span { - background-color: @base; - color: @text; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/libreddit/catppuccin.user.less b/styles/libreddit/catppuccin.user.less new file mode 100644 index 0000000000..9400034e0d --- /dev/null +++ b/styles/libreddit/catppuccin.user.less @@ -0,0 +1,145 @@ +/* ==UserStyle== +@name Libreddit/Redlib Catppuccin +@namespace github.com/catppuccin/userstyles/styles/libreddit +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/libreddit +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/libreddit/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alibreddit +@description Soothing pastel theme for Libreddit and Redlib +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("libredd.it"), + domain("libreddit.spike.codes"), + domain("libreddit.dothq.co"), + domain("libreddit.kavin.rocks"), + domain("reddit.invak.id"), + domain("reddit.phii.me"), + domain("lr.riverside.rocks"), + domain("libreddit.strongthany.cc"), + domain("libreddit.database.red"), + domain("libreddit.privacy.com.de"), + domain("libreddit.domain.glass"), + domain("libreddit.sugoma.tk"), + domain("libreddit.jamiethalacker.dev"), + domain("reddit.artemislena.eu"), + domain("r.nf"), + domain("libreddit.some-things.org"), + domain("reddit.stuehieyr.com"), + domain("lr.mint.lgbt"), + domain("libreddit.igna.rocks"), + domain("libreddit.autarkic.org"), + domain("libreddit.flux.industries"), + domain("libreddit.drivet.xyz"), + domain("lr.oversold.host"), + domain("libreddit.de"), + domain("libreddit.pussthecat.org"), + domain("libreddit.mutahar.rocks"), + domain("libreddit.northboot.xyz"), + domain("leddit.xyz"), + domain("de.leddit.xyz"), + domain("lr.cowfee.moe"), + domain("libreddit.hu"), + domain("libreddit.totaldarkness.net"), + domain("libreddit.esmailelbob.xyz"), + domain("lr.vern.cc"), + domain("libreddit.nl"), + domain("lr.stilic.ml"), + domain("reddi.tk"), + domain("libreddit.bus-hit.me"), + domain("libreddit.datatunnel.xyz"), + domain("libreddit.crewz.me"), + domain("r.walkx.org"), + domain("libreddit.kylrth.com"), + domain("libreddit.yonalee.eu"), + domain("libreddit.winscloud.net"), + domain("libreddit.tiekoetter.com"), + domain("reddit.rtrace.io"), + domain("libreddit.lunar.icu"), + domain("libreddit.privacydev.net"), + domain("libreddit.notyourcomputer.net"), + domain("r.ahwx.org"), + domain("bob.fr.to"), + domain("reddit.beparanoid.de"), + domain("libreddit.dcs0.hu"), + domain("reddit.dr460nf1r3.org"), + domain("rd.jae.su"), + domain("libreddit.mha.fi"), + domain("libreddit.foss.wtf"), + domain("libreddit.encrypted-data.xyz"), + domain("libreddit.eu.org"), + domain("l.opnxng.com"), + domain("safereddit.com"), + domain("libreddit.projectsegfau.lt"), + domain("libreddit.bus-hit.me"), + domain("reddit.invak.id"), + domain("redlib.catsarch.com"), + domain("reddit.idevicehacked.com"), + domain("redlib.freedit.eu"), + domain("redlib.perennialte.ch"), + domain("redlib.tux.pizza"), + domain("redlib.vimmer.dev"), + domain("libreddit.privacydev.net"), + domain("lr.n8pjl.ca"), + domain("reddit.owo.si"), + domain("redlib.ducks.party"), + domain("red.ngn.tf"), + domain("redlib.dnfetheus.xyz"), + domain("redlib.cow.rip"), + domain("libreddit.eu.org"), + domain("r.darrennathanael.com"), + domain("redlib.kittywi.re"), + domain("redlib.privacyredirect.com") { + .light, + .gruvboxlight { + #catppuccin(@lightFlavor); + } + + .dark, + .black, + .doomone, + .gruvboxdark, + .dracula, + .gold, + .laserwave, + .nord, + .rosebox, + .violet, + :root { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --accent: @accent !important; + --green: @green !important; + --text: @text !important; + --foreground: @crust !important; + --background: @base !important; + --outside: @mantle !important; + --post: @mantle !important; + --panel-border: none !important; + --highlighted: @surface0 !important; + --visited: @overlay0 !important; + --shadow: 0 5px 15px 0 transparent !important; + + --nsfw: @peach !important; + --admin: @maroon !important; + + /* thumbnail titles */ + .post_thumbnail span { + background-color: @base; + color: @text; + } + } +} diff --git a/styles/libreddit/preview.webp b/styles/libreddit/preview.webp deleted file mode 100644 index f391cf03aa..0000000000 --- a/styles/libreddit/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:fa77b5084d8c2872f5b9ddfbfc7d71c67341d38b24204218be50040afc2b78c0 -size 192158 diff --git a/styles/lichess/README.md b/styles/lichess/README.md index 1fdbb3abf3..e8d15b1c01 100644 --- a/styles/lichess/README.md +++ b/styles/lichess/README.md @@ -4,25 +4,25 @@

Logo
- Catppuccin for Lichess + Catppuccin for Lichess

- -

- -

- +

## Usage -Switch to a default Lichess light/dark theme via **Username** > **Background** for the best experience! +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + +> [!NOTE] +> Switch to a default Lichess light/dark theme via **Username** > **Background** for the best experience! -## ๐Ÿ’ Current Maintainer -- [coopw](https://github.com/coopw1) +## ๐Ÿ’ Current Maintainers +- [coopw1](https://github.com/coopw1) +- [zenoix](https://github.com/zenoix)   diff --git a/styles/lichess/catppuccin.user.css b/styles/lichess/catppuccin.user.less similarity index 62% rename from styles/lichess/catppuccin.user.css rename to styles/lichess/catppuccin.user.less index 6aca721972..581db63cbd 100644 --- a/styles/lichess/catppuccin.user.css +++ b/styles/lichess/catppuccin.user.less @@ -2,8 +2,8 @@ @name Lichess Catppuccin @namespace github.com/catppuccin/userstyles/styles/lichess @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/lichess -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/lichess/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/lichess/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alichess @description Soothing pastel theme for Lichess @author Catppuccin @@ -13,68 +13,39 @@ @var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] @var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] + +@var select lastMoveColor "Last Move" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red*", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +@var select checkColor "Check Indicator" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red*", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] @var checkbox stylePieces "Style Pieces" 1 +@var checkbox styleBoard "Style Board" 1 ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + @-moz-document domain("lichess.org") { :root:has(body[data-theme="light"]) { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } :root:has(body[data-theme="dark"]) { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } :root:has(body[data-theme="system"]) { @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + @lastMove: @catppuccin[@@flavor][@@lastMoveColor]; + @check: @catppuccin[@@flavor][@@checkColor]; - html, + &, body { background: @base linear-gradient(to bottom, @crust, @base 116px) no-repeat; @@ -83,7 +54,7 @@ /* Button */ .site-title a { - color: @accent-color; + color: @accent; } .site-title span { color: @text; @@ -94,7 +65,7 @@ background-color: fade(@overlay0, 50%); } .hooks__list tr.join:hover td { - background-color: fade(@accent-color, 50%); + background-color: fade(@accent, 50%); } /* Topbar */ @@ -125,7 +96,7 @@ #topnav.hover section:hover > a, #topnav section:active > a, #topnav div { - border-left-color: @accent-color; + border-left-color: @accent; } signal > i { background-color: @green; @@ -209,7 +180,7 @@ a:hover, a:active, a:focus { - color: @accent-color; + color: @accent; } /* Homepage cards */ @@ -221,7 +192,7 @@ background: fade(@crust, 20%); border-color: @surface0; &:hover { - background-color: fade(@accent-color, 20%); + background-color: fade(@accent, 20%); } } .hook__filters { @@ -279,13 +250,87 @@ } /* Chess Game */ - .brown .is2d cg-board { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; + @light-cell: if(@flavor = latte, @surface0, @accent); + @dark-cell: if(@flavor = latte, @accent, @surface0); + & when (@styleBoard = 1) { + /* Board */ + .is2d cg-board::before { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + /* File and Rank Coords */ + .orientation-white .files coord:nth-child(2n+1), + .orientation-white .ranks coord:nth-child(2n), + .orientation-black .files coord:nth-child(2n), + .orientation-black .ranks coord:nth-child(2n+1) { + color: @light-cell; + } + .orientation-white .files coord:nth-child(2n), + .orientation-white .ranks coord:nth-child(2n+1), + .orientation-black .files coord:nth-child(2n+1), + .orientation-black .ranks coord:nth-child(2n) { + color: @dark-cell; + } + + /* Squares */ + square { + &.move-dest { + background: radial-gradient( + @overlay1 19%, + rgba(0, 0, 0, 0) 20% + ); + } + + &.selected { + background: fade(@accent, 50%); + } + + &.last-move { + background-color: fade(@lastMove, 75%); + } + + &.check { + background: radial-gradient( + ellipse at center, + @check 0%, + @check 25%, + fade(@check, 0%) 89%, + fade(@check, 0%) 100% + ); + } + + /* Capture indicator */ + &.oc.move-dest { + background: radial-gradient( + transparent 0%, + transparent 79%, + fade(@overlay1, 50%) 80% + ); + } + } + + /* Analysis Arrows */ + svg.cg-shapes g { + &[cgHash*="green"] { + filter: @green-filter; + } + &[cgHash*="paleBlue"] { + filter: @sky-filter; + } + &[cgHash*="red"] { + filter: @red-filter; + } + } } & when (@stylePieces = 1) { + @w-piece-fill: if(@flavor = latte, @mantle, @text); + @b-piece-fill: if(@flavor = latte, @text, @mantle); + @w-piece-stroke: if(@flavor = latte, @text, @mantle); + @b-piece-stroke: if(@flavor = latte, @mantle, @text); + .is2d .pawn { #piece(@f, @s) { @svg: escape( @@ -294,10 +339,10 @@ background-image: url("data:image/svg+xml,@{svg}") !important; } &.black { - #piece(@base, @text); + #piece(@b-piece-fill, @b-piece-stroke); } &.white { - #piece(@text, @base); + #piece(@w-piece-fill, @w-piece-stroke); } } .is2d .bishop { @@ -308,24 +353,24 @@ background-image: url("data:image/svg+xml,@{svg}") !important; } &.black { - #piece(@base, @text); + #piece(@b-piece-fill, @b-piece-stroke); } &.white { - #piece(@text, @base); + #piece(@w-piece-fill, @w-piece-stroke); } } .is2d .knight { #piece(@f, @s) { @svg: escape( - '' + '' ); background-image: url("data:image/svg+xml,@{svg}") !important; } &.black { - #piece(@base, @text); + #piece(@b-piece-fill, @b-piece-stroke); } &.white { - #piece(@text, @base); + #piece(@w-piece-fill, @w-piece-stroke); } } .is2d .rook { @@ -336,66 +381,42 @@ background-image: url("data:image/svg+xml,@{svg}") !important; } &.black { - #piece(@base, @text); + #piece(@b-piece-fill, @b-piece-stroke); } &.white { - #piece(@text, @base); + #piece(@w-piece-fill, @w-piece-stroke); } } .is2d .king { #piece(@f, @s) { @svg: escape( - '' + '' ); background-image: url("data:image/svg+xml,@{svg}") !important; } &.black { - #piece(@base, @text); + #piece(@b-piece-fill, @b-piece-stroke); } &.white { - #piece(@text, @base); + #piece(@w-piece-fill, @w-piece-stroke); } } .is2d .queen { - &.black { + #piece(@f, @s) { @svg: escape( - '' + '' ); background-image: url("data:image/svg+xml,@{svg}") !important; } + &.black { + #piece(@b-piece-fill, @b-piece-stroke); + } &.white { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; + #piece(@w-piece-fill, @w-piece-stroke); } } } - .orientation-white .files coord:nth-child(2n + 1), - .orientation-white .ranks coord:nth-child(2n), - .orientation-black .files coord:nth-child(2n), - .orientation-black .ranks coord:nth-child(2n + 1) { - color: @base; - } - .orientation-white .files coord:nth-child(2n), - .orientation-white .ranks coord:nth-child(2n + 1), - .orientation-black .files coord:nth-child(2n + 1), - .orientation-black .ranks coord:nth-child(2n) { - color: @crust; - } - square.move-dest { - background: radial-gradient( - fade(@accent-color, 50%) 19%, - rgba(0, 0, 0, 0) 20% - ); - } - square.selected { - background: fade(@accent-color, 50%); - } - square.last-move { - background: fade(@accent-color, 40%); - } .rclock .time { background: @mantle; color: @text; @@ -404,7 +425,7 @@ background: #384722; /* putting it back to default so that the time on the clock is readable */ } .rclock .bar { - background: @accent-color; + background: @accent; } /* Game Cards */ @@ -513,13 +534,24 @@ background: @mantle; } .ceval .settings-gear.active { - background-color: @accent-color; + background-color: @accent; } #ceval-settings { - border-top-color: @accent-color; + border-top-color: @accent; } .mchat__tab:hover { - background: fade(@accent-color, 50%); + background: fade(@accent, 50%); + } + .ceval .bar span { + background: @green; + + &.threat { + background: @red; + } + } + .show-threat.active, + .show-threat:hover:not(.hidden) { + color: @red; } /* Openings */ .opening__config, @@ -530,13 +562,13 @@ outline-color: @base; } .opening__next:hover { - outline-color: @accent-color; + outline-color: @accent; } .opening__next__popularity span { - background: @accent-color; + background: @accent; } .opening__next__title { - color: @accent-color; + color: @accent; } /* Puzzles */ @@ -589,13 +621,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/lichess/preview.webp b/styles/lichess/preview.webp deleted file mode 100644 index 563f56841a..0000000000 --- a/styles/lichess/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:f49cecaee30d7678ebbaa4057c5b4cb20e1a0a8c721e459328300e57c75ca0b6 -size 261496 diff --git a/styles/lingva/README.md b/styles/lingva/README.md index 142d7ee065..6497383184 100644 --- a/styles/lingva/README.md +++ b/styles/lingva/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/lingva/catppuccin.user.css b/styles/lingva/catppuccin.user.css deleted file mode 100644 index 84f035034c..0000000000 --- a/styles/lingva/catppuccin.user.css +++ /dev/null @@ -1,147 +0,0 @@ -/* ==UserStyle== -@name Lingva Catppuccin -@namespace github.com/catppuccin/userstyles/styles/lingva -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/lingva -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/lingva/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alingva -@description Soothing pastel theme for Lingva -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('lingva.ml'), -domain('translate.plausibility.cloud'), -domain('lingva.lunar.icu'), -domain('translate.projectsegfau.lt'), -domain('lingva.garudalinux.org') { - .chakra-ui-light { - #catppuccin(@lightFlavor, @accentColor); - } - .chakra-ui-dark { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - body { - background: @base; - color: @text; - } - - header { - background-color: @accent-color; - - .chakra-button { - color: darken(@accent-color, 50%); - background: lighten(@accent-color, 5%); - &:hover { - background: darken(@accent-color, 5%); - } - } - } - - footer { - background-color: @accent-color; - color: darken(@accent-color, 50%); - } - - #__next > div { - background: @base; - } - - main { - background: @base; - color: @text; - - select { - border-color: @accent-color; - color: @text; - } - .chakra-select__icon { - color: @text; - } - .chakra-button { - color: @accent-color; - border-color: @accent-color; - - &:hover:not(:disabled) { - background-color: rgba(@accent-color, 0.12); - } - - // Auto translate button (clicked) (Dark and Light classes) - &.css-1huvcr7, - &.css-q22xb2 { - background: @accent-color; - color: @crust; - } - } - .chakra-stack { - border-color: @accent-color; - } - - textarea { - color: @text; - } - - .chakra-text { - color: @subtext1; - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/lingva/catppuccin.user.less b/styles/lingva/catppuccin.user.less new file mode 100644 index 0000000000..5b101d12cd --- /dev/null +++ b/styles/lingva/catppuccin.user.less @@ -0,0 +1,101 @@ +/* ==UserStyle== +@name Lingva Catppuccin +@namespace github.com/catppuccin/userstyles/styles/lingva +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/lingva +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/lingva/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alingva +@description Soothing pastel theme for Lingva +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("lingva.ml"), + domain("translate.plausibility.cloud"), + domain("lingva.lunar.icu"), + domain("translate.projectsegfau.lt"), + domain("lingva.garudalinux.org") { + .chakra-ui-light { + #catppuccin(@lightFlavor); + } + .chakra-ui-dark { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + background: @base; + color: @text; + } + + header { + background-color: @accent; + + .chakra-button { + color: darken(@accent, 50%); + background: lighten(@accent, 5%); + &:hover { + background: darken(@accent, 5%); + } + } + } + + footer { + background-color: @accent; + color: darken(@accent, 50%); + } + + #__next > div { + background: @base; + } + + main { + background: @base; + color: @text; + + select { + border-color: @accent; + color: @text; + } + .chakra-select__icon { + color: @text; + } + .chakra-button { + color: @accent; + border-color: @accent; + + &:hover:not(:disabled) { + background-color: fade(@accent, 12%); + } + + // Auto translate button (clicked) (Dark and Light classes) + &.css-1huvcr7, + &.css-q22xb2 { + background: @accent; + color: @crust; + } + } + .chakra-stack { + border-color: @accent; + } + + textarea { + color: @text; + } + + .chakra-text { + color: @subtext1; + } + } + } +} diff --git a/styles/lingva/preview.webp b/styles/lingva/preview.webp deleted file mode 100644 index 6d90ee8695..0000000000 --- a/styles/lingva/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:34da9ffb8983d8dfed11a507454b7d39a4564f749834069a47478b3e97d978f4 -size 26584 diff --git a/styles/linkedin/README.md b/styles/linkedin/README.md index b2beab8aaa..f6ed5635bd 100644 --- a/styles/linkedin/README.md +++ b/styles/linkedin/README.md @@ -10,18 +10,19 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer -- [Isabel](https://github.com/isabelroses) +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find! +## ๐Ÿ’– Past Maintainer +- [isabelroses](https://github.com/isabelroses)   diff --git a/styles/linkedin/catppuccin.user.css b/styles/linkedin/catppuccin.user.css deleted file mode 100644 index 7f477ed376..0000000000 --- a/styles/linkedin/catppuccin.user.css +++ /dev/null @@ -1,536 +0,0 @@ -/* ==UserStyle== -@name LinkedIn Catppuccin -@namespace github.com/catppuccin/userstyles/styles/linkedin -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/linkedin -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/linkedin/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alinkedin -@description Soothing pastel theme for LinkedIn -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('www.linkedin.com') { - :root:not(.theme--dark, .theme--mercado-dark) { - #catppuccin(@lightFlavor, @accentColor); - } - :root.theme--dark, - :root.theme--mercado-dark { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --black: @crust; - --black-a90: @crust; - --black-a75: @crust; - --black-a60: fadeout(@crust, 40); - --black-a45: @crust; - --black-a30: @crust; - --black-a15: @crust; - --black-a12: @crust; - --black-a08: @crust; - --black-a04: @crust; - --black-a100: @crust; - - --white: @text; - --white-a06: @surface0; - --white-a12: @surface0; - --white-a18: @surface0; - --white-a25: @surface0; - --white-a30: @text; - --white-a40: @text; - --white-a45: @text; - --white-a55: @text; - --white-a60: @subtext0; - --white-a70: @text; - --white-a75: @text; - --white-a85: @text; - --white-a90: @text; - --white-a100: @text; - - --blue-10: @blue; - --blue-20: @blue; - --blue-30: @blue; - --blue-40: @blue; - --blue-50: @blue; - --blue-60: @blue; - --blue-70: @blue; - --blue-80: @blue; - --blue-90: @blue; - --blue-100: @blue; - --blue-50-a20: fadeout(@blue, 80); - --blue-50-a25: fadeout(@blue, 75); - --blue-50-a30: fadeout(@blue, 70); - --blue-50-a40: fadeout(@blue, 60); - --blue-60-a10: fadeout(@blue, 90); - --blue-60-a15: fadeout(@blue, 15); - --blue-60-a20: fadeout(@blue, 80); - --blue-60-a25: fadeout(@blue, 75); - --blue-60-a30: fadeout(@blue, 70); - --blue-60-a35: fadeout(@blue, 65); - --blue-60-a40: fadeout(@blue, 60); - --blue-60-a45: fadeout(@blue, 55); - --blue-70-a30: fadeout(@sapphire, 70); - --blue-70-a40: fadeout(@sapphire, 60); - --blue-70-a50: fadeout(@sapphire, 50); - - --cool-gray-10: @mantle; - --cool-gray-20: @surface0; - --cool-gray-30: @mantle; - --cool-gray-40: @mantle; - --cool-gray-50: @mantle; - --cool-gray-60: @mantle; - --cool-gray-70: @mantle; - --cool-gray-80: @surface0; - --cool-gray-85: @mantle; - --cool-gray-90: @mantle; - --cool-gray-100: @mantle; - --cool-gray-60-a10: fadeout(@mantle, 90); - --cool-gray-60-a15: fadeout(@mantle, 85); - --cool-gray-60-a20: fadeout(@mantle, 80); - --cool-gray-60-a25: fadeout(@mantle, 75); - --cool-gray-60-a30: fadeout(@mantle, 70); - --cool-gray-60-a35: fadeout(@mantle, 65); - - --warm-gray-10: @overlay1; - --warm-gray-20: @overlay1; - --warm-gray-30: @overlay1; - --warm-gray-40: @overlay1; - --warm-gray-50: @overlay1; - --warm-gray-60: @overlay1; - --warm-gray-70: @overlay1; - --warm-gray-80: @overlay1; - --warm-gray-90: @overlay1; - --warm-gray-100: @overlay1; - --warm-gray-60-a10: fadeout(@overlay1, 90); - --warm-gray-60-a15: fadeout(@overlay1, 85); - --warm-gray-60-a20: fadeout(@overlay1, 80); - --warm-gray-60-a25: fadeout(@overlay1, 75); - --warm-gray-60-a30: fadeout(@overlay1, 70); - --warm-gray-60-a35: fadeout(@overlay1, 65); - - --warm-red-10: @maroon; - --warm-red-20: @maroon; - --warm-red-30: @maroon; - --warm-red-40: @maroon; - --warm-red-50: @maroon; - --warm-red-60: @maroon; - --warm-red-70: @maroon; - --warm-red-80: @maroon; - --warm-red-90: @maroon; - --warm-red-100: @maroon; - --warm-red-60-a10: fadeout(@maroon, 90); - --warm-red-60-a15: fadeout(@maroon, 85); - --warm-red-60-a20: fadeout(@maroon, 80); - --warm-red-60-a25: fadeout(@maroon, 75); - --warm-red-60-a30: fadeout(@maroon, 70); - --warm-red-60-a35: fadeout(@maroon, 65); - - --teal-10: @teal; - --teal-20: @teal; - --teal-30: @teal; - --teal-40: @teal; - --teal-50: @teal; - --teal-60: @teal; - --teal-70: @teal; - --teal-80: @teal; - --teal-90: @teal; - --teal-100: @teal; - --teal-50-a30: fadein(@teal, 70); - --teal-60-a10: fadeout(@teal, 90); - --teal-60-a15: fadeout(@teal, 85); - --teal-60-a20: fadeout(@teal, 80); - --teal-60-a25: fadeout(@teal, 75); - --teal-60-a30: fadeout(@teal, 70); - --teal-60-a35: fadeout(@teal, 65); - - --purple-10: @lavender; - --purple-20: @lavender; - --purple-30: @lavender; - --purple-40: @lavender; - --purple-50: @lavender; - --purple-60: @lavender; - --purple-70: @lavender; - --purple-80: @lavender; - --purple-90: @lavender; - --purple-100: @lavender; - --purple-40-a15: fadeout(@lavender, 85); - --purple-60-a10: fadeout(@lavender, 90); - --purple-60-a15: fadeout(@lavender, 85); - --purple-60-a20: fadeout(@lavender, 80); - --purple-60-a25: fadeout(@lavender, 75); - --purple-60-a30: fadeout(@lavender, 70); - --purple-60-a35: fadeout(@lavender, 65); - --purple-70-a15: fadeout(@lavender, 85); - - --system-red-10: @red; - --system-red-20: @red; - --system-red-30: @red; - --system-red-40: @red; - --system-red-50: @red; - --system-red-60: @red; - --system-red-70: @red; - --system-red-80: @red; - --system-red-90: @red; - --system-red-100: @red; - --system-red-60-a10: fadeout(@red, 90); - --system-red-60-a15: fadeout(@red, 85); - --system-red-60-a20: fadeout(@red, 80); - --system-red-60-a25: fadeout(@red, 75); - --system-red-60-a30: fadeout(@red, 70); - --system-red-60-a35: fadeout(@red, 65); - - --system-green-10: darken(@green, 20); - --system-green-20: darken(@green, 20); - --system-green-30: darken(@green, 20); - --system-green-40: darken(@green, 20); - --system-green-50: darken(@green, 20); - --system-green-60: darken(@green, 20); - --system-green-70: darken(@green, 20); - --system-green-80: darken(@green, 20); - --system-green-90: darken(@green, 20); - --system-green-100: darken(@green, 20); - --system-green-60-a10: fadeout(darken(@green, 20), 90); - --system-green-60-a15: fadeout(darken(@green, 20), 85); - --system-green-60-a20: fadeout(darken(@green, 20), 80); - --system-green-60-a25: fadeout(darken(@green, 20), 75); - --system-green-60-a30: fadeout(darken(@green, 20), 70); - --system-green-60-a35: fadeout(darken(@green, 20), 65); - - --pink-10: @pink; - --pink-20: @pink; - --pink-30: @pink; - --pink-40: @pink; - --pink-50: @pink; - --pink-60: @pink; - --pink-70: @pink; - --pink-80: @pink; - --pink-90: @pink; - --pink-100: @pink; - --pink-60-a10: fadeout(@pink, 90); - --pink-60-a15: fadeout(@pink, 85); - --pink-60-a20: fadeout(@pink, 80); - --pink-60-a25: fadeout(@pink, 75); - --pink-60-a30: fadeout(@pink, 70); - --pink-60-a35: fadeout(@pink, 65); - - --amber-10: @yellow; - --amber-20: @yellow; - --amber-30: @yellow; - --amber-40: @yellow; - --amber-50: @yellow; - --amber-60: @yellow; - --amber-70: @yellow; - --amber-80: @yellow; - --amber-90: @yellow; - --amber-100: @yellow; - --amber-30-a50: fadein(@yellow, 50); - --amber-60-a10: fadeout(@yellow, 90); - --amber-60-a15: fadeout(@yellow, 85); - --amber-60-a20: fadeout(@yellow, 80); - --amber-60-a25: fadeout(@yellow, 75); - --amber-60-a30: fadeout(@yellow, 70); - --amber-60-a35: fadeout(@yellow, 65); - - --copper-10: @rosewater; - --copper-20: @rosewater; - --copper-30: @rosewater; - --copper-40: @rosewater; - --copper-50: @rosewater; - --copper-60: @rosewater; - --copper-70: @rosewater; - --copper-80: @rosewater; - --copper-90: @rosewater; - --copper-100: @rosewater; - --copper-60-a10: fadeout(@rosewater, 90); - --copper-60-a15: fadeout(@rosewater, 85); - --copper-60-a20: fadeout(@rosewater, 80); - --copper-60-a25: fadeout(@rosewater, 75); - --copper-60-a30: fadeout(@rosewater, 70); - --copper-60-a35: fadeout(@rosewater, 65); - - --green-10: @green; - --green-20: @green; - --green-30: @green; - --green-40: @green; - --green-50: @green; - --green-60: @green; - --green-70: @green; - --green-80: @green; - --green-90: @green; - --green-100: @green; - --green-60-a10: fadeout(@green, 90); - --green-60-a15: fadeout(@green, 85); - --green-60-a20: fadeout(@green, 80); - --green-60-a25: fadeout(@green, 75); - --green-60-a30: fadeout(@green, 70); - --green-60-a35: fadeout(@green, 65); - - --sage-10: darken(@green, 40); - --sage-20: darken(@green, 40); - --sage-30: darken(@green, 40); - --sage-40: darken(@green, 40); - --sage-50: darken(@green, 40); - --sage-60: darken(@green, 40); - --sage-70: darken(@green, 40); - --sage-80: darken(@green, 40); - --sage-90: darken(@green, 40); - --sage-100: darken(@green, 40); - --sage-60-a10: fadeout(darken(@green, 40), 90); - --sage-60-a15: fadeout(darken(@green, 40), 85); - --sage-60-a20: fadeout(darken(@green, 40), 80); - --sage-60-a25: fadeout(darken(@green, 40), 75); - --sage-60-a30: fadeout(darken(@green, 40), 70); - --sage-60-a35: fadeout(darken(@green, 40), 65); - - --lime-10: lighten(@green, 20); - --lime-20: lighten(@green, 20); - --lime-30: lighten(@green, 20); - --lime-40: lighten(@green, 20); - --lime-50: lighten(@green, 20); - --lime-60: lighten(@green, 20); - --lime-70: lighten(@green, 20); - --lime-80: lighten(@green, 20); - --lime-90: lighten(@green, 20); - --lime-100: lighten(@green, 20); - --lime-60-a10: fadeout(lighten(@green, 20), 90); - --lime-60-a15: fadeout(lighten(@green, 20), 85); - --lime-60-a20: fadeout(lighten(@green, 20), 80); - --lime-60-a25: fadeout(lighten(@green, 20), 75); - --lime-60-a30: fadeout(lighten(@green, 20), 70); - --lime-60-a35: fadeout(lighten(@green, 20), 65); - - --camo-10: @accent-color; - --camo-20: @accent-color; - --camo-30: @accent-color; - --camo-40: @accent-color; - --camo-50: @accent-color; - --camo-60: @accent-color; - --camo-70: @accent-color; - --camo-80: @accent-color; - --camo-90: @accent-color; - --camo-100: @accent-color; - --camo-60-a10: fadeout(@accent-color, 90); - --camo-60-a15: fadeout(@accent-color, 85); - --camo-60-a20: fadeout(@accent-color, 80); - --camo-60-a25: fadeout(@accent-color, 75); - --camo-60-a30: fadeout(@accent-color, 70); - --camo-60-a35: fadeout(@accent-color, 65); - - --smoke-10: @surface1; - --smoke-20: @surface1; - --smoke-30: @surface1; - --smoke-40: @surface1; - --smoke-50: @surface1; - --smoke-60: @surface1; - --smoke-70: @surface1; - --smoke-80: @surface1; - --smoke-90: @surface1; - --smoke-100: @surface1; - --smoke-60-a10: fadeout(@surface1, 90); - --smoke-60-a15: fadeout(@surface1, 85); - --smoke-60-a20: fadeout(@surface1, 80); - --smoke-60-a25: fadeout(@surface1, 75); - --smoke-60-a30: fadeout(@surface1, 70); - --smoke-60-a35: fadeout(@surface1, 65); - - --lavender-10: @lavender; - --lavender-20: @lavender; - --lavender-30: @lavender; - --lavender-40: @lavender; - --lavender-50: @lavender; - --lavender-60: @lavender; - --lavender-70: @lavender; - --lavender-80: @lavender; - --lavender-90: @lavender; - --lavender-100: @lavender; - --lavender-60-a10: fadeout(@lavender, 90); - --lavender-60-a15: fadeout(@lavender, 85); - --lavender-60-a20: fadeout(@lavender, 80); - --lavender-60-a25: fadeout(@lavender, 75); - --lavender-60-a30: fadeout(@lavender, 70); - --lavender-60-a35: fadeout(@lavender, 65); - - --mauve-10: @mauve; - --mauve-20: @mauve; - --mauve-30: @mauve; - --mauve-40: @mauve; - --mauve-50: @mauve; - --mauve-60: @mauve; - --mauve-70: @mauve; - --mauve-80: @mauve; - --mauve-90: @mauve; - --mauve-100: @mauve; - --mauve-60-a10: fadeout(@mauve, 90); - --mauve-60-a15: fadeout(@mauve, 85); - --mauve-60-a20: fadeout(@mauve, 80); - --mauve-60-a25: fadeout(@mauve, 75); - --mauve-60-a30: fadeout(@mauve, 70); - --mauve-60-a35: fadeout(@mauve, 65); - --mauve-80-a50: fadeout(@mauve, 50); - - --system-gray-10: @surface0; - --system-gray-20: @surface0; - --system-gray-30: @surface0; - --system-gray-40: @surface0; - --system-gray-50: @surface0; - --system-gray-60: @surface0; - --system-gray-70: @surface0; - --system-gray-80: @surface0; - --system-gray-90: @surface0; - --system-gray-100: @surface0; - --system-gray-60-a10: fadeout(@surface0, 90); - --system-gray-60-a15: fadeout(@surface0, 85); - --system-gray-60-a20: fadeout(@surface0, 80); - --system-gray-60-a25: fadeout(@surface0, 75); - --system-gray-60-a30: fadeout(@surface0, 70); - --system-gray-60-a35: fadeout(@surface0, 65); - --system-gray-60-a40: fadeout(@surface0, 60); - --system-gray-60-a45: fadeout(@surface0, 55); - - --system-orange-10: @peach; - --system-orange-20: @peach; - --system-orange-30: @peach; - --system-orange-40: @peach; - --system-orange-50: @peach; - --system-orange-60: @peach; - --system-orange-70: @peach; - --system-orange-80: @peach; - --system-orange-90: @peach; - --system-orange-100: @peach; - --system-orange-60-a10: fadeout(@peach, 90); - --system-orange-60-a15: fadeout(@peach, 85); - --system-orange-60-a20: fadeout(@peach, 80); - --system-orange-60-a25: fadeout(@peach, 75); - --system-orange-60-a30: fadeout(@peach, 70); - --system-orange-60-a35: fadeout(@peach, 65); - - /* quality of life changes */ - --color-border-low-emphasis: @surface0; - - /* Codeblock fixes */ - pre { - --color-text-on-dark: @text; - --color-background-container-dark-tint: @crust; - } - - /* more accent */ - --voyager-color-background-badge-notification: @accent-color; - --color-signal-positive: @accent-color; - --color-checked: @accent-color; - --color-checked-hover: @accent-color; - --color-checked-active: @accent-color; - - & when not (@lookup =latte) { - --color-text-on-dark: @crust; - --color-element: @crust; - } - - & when (@lookup =latte) { - --black: @text; - --black-a90: @text; - --black-a75: @text; - --black-a45: @text; - --black-a30: @text; - --black-a60: @subtext0; - --black-a15: @text; - --black-a04: @text; - --black-a100: @text; - - --color-background-scrim: fadeout(@crust, 60); - - --white: @mantle; - --white-a06: @surface0; - --white-a12: @surface0; - --white-a18: @surface0; - --white-a25: @surface0; - --white-a30: @mantle; - --white-a40: @mantle; - --white-a45: @mantle; - --white-a55: @mantle; - --white-a60: @subtext0; - --white-a70: @mantle; - --white-a75: @mantle; - --white-a85: @mantle; - --white-a90: @mantle; - --white-a100: @mantle; - - --warm-gray-10: @base; - --warm-gray-20: @base; - --warm-gray-30: @base; - --warm-gray-40: @base; - --warm-gray-50: @base; - --warm-gray-60: @base; - --warm-gray-70: @base; - --warm-gray-80: @base; - --warm-gray-90: @base; - --warm-gray-100: @base; - --warm-gray-60-a10: fadeout(@base, 90); - --warm-gray-60-a15: fadeout(@base, 85); - --warm-gray-60-a20: fadeout(@base, 80); - --warm-gray-60-a25: fadeout(@base, 75); - --warm-gray-60-a30: fadeout(@base, 70); - --warm-gray-60-a35: fadeout(@base, 65); - } - - .share-promoted-detour-button-legacy { - background-color: @accent-color !important; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/linkedin/catppuccin.user.less b/styles/linkedin/catppuccin.user.less new file mode 100644 index 0000000000..d9092f48b1 --- /dev/null +++ b/styles/linkedin/catppuccin.user.less @@ -0,0 +1,499 @@ +/* ==UserStyle== +@name LinkedIn Catppuccin +@namespace github.com/catppuccin/userstyles/styles/linkedin +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/linkedin +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/linkedin/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alinkedin +@description Soothing pastel theme for LinkedIn +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("www.linkedin.com") { + :root:not(.theme--dark, .theme--mercado-dark) { + #catppuccin(@lightFlavor); + } + :root.theme--dark, + :root.theme--mercado-dark { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --black: @crust; + --black-a90: @crust; + --black-a75: @crust; + --black-a60: fade(@crust, 60%); + --black-a45: @crust; + --black-a30: @crust; + --black-a15: @crust; + --black-a12: @crust; + --black-a08: @crust; + --black-a04: @crust; + --black-a100: @crust; + + --white: @text; + --white-a06: @surface0; + --white-a12: @surface0; + --white-a18: @surface0; + --white-a25: @surface0; + --white-a30: @text; + --white-a40: @text; + --white-a45: @text; + --white-a55: @text; + --white-a60: @subtext0; + --white-a70: @text; + --white-a75: @text; + --white-a85: @text; + --white-a90: @text; + --white-a100: @text; + + --blue-10: @blue; + --blue-20: @blue; + --blue-30: @blue; + --blue-40: @blue; + --blue-50: @blue; + --blue-60: @blue; + --blue-70: @blue; + --blue-80: @blue; + --blue-90: @blue; + --blue-100: @blue; + --blue-50-a20: fade(@blue, 20%); + --blue-50-a25: fade(@blue, 25%); + --blue-50-a30: fade(@blue, 30%); + --blue-50-a40: fade(@blue, 40%); + --blue-60-a10: fade(@blue, 10%); + --blue-60-a15: fade(@blue, 85%); + --blue-60-a20: fade(@blue, 20%); + --blue-60-a25: fade(@blue, 25%); + --blue-60-a30: fade(@blue, 30%); + --blue-60-a35: fade(@blue, 35%); + --blue-60-a40: fade(@blue, 40%); + --blue-60-a45: fade(@blue, 45%); + --blue-70-a30: fade(@sapphire, 30%); + --blue-70-a40: fade(@sapphire, 40%); + --blue-70-a50: fade(@sapphire, 50%); + + --cool-gray-10: @mantle; + --cool-gray-20: @surface0; + --cool-gray-30: @mantle; + --cool-gray-40: @mantle; + --cool-gray-50: @mantle; + --cool-gray-60: @mantle; + --cool-gray-70: @mantle; + --cool-gray-80: @surface0; + --cool-gray-85: @mantle; + --cool-gray-90: @mantle; + --cool-gray-100: @mantle; + --cool-gray-60-a10: fade(@mantle, 10%); + --cool-gray-60-a15: fade(@mantle, 15%); + --cool-gray-60-a20: fade(@mantle, 20%); + --cool-gray-60-a25: fade(@mantle, 25%); + --cool-gray-60-a30: fade(@mantle, 30%); + --cool-gray-60-a35: fade(@mantle, 35%); + + --warm-gray-10: @overlay1; + --warm-gray-20: @overlay1; + --warm-gray-30: @overlay1; + --warm-gray-40: @overlay1; + --warm-gray-50: @overlay1; + --warm-gray-60: @overlay1; + --warm-gray-70: @overlay1; + --warm-gray-80: @overlay1; + --warm-gray-90: @overlay1; + --warm-gray-100: @overlay1; + --warm-gray-60-a10: fade(@overlay1, 10%); + --warm-gray-60-a15: fade(@overlay1, 15%); + --warm-gray-60-a20: fade(@overlay1, 20%); + --warm-gray-60-a25: fade(@overlay1, 25%); + --warm-gray-60-a30: fade(@overlay1, 30%); + --warm-gray-60-a35: fade(@overlay1, 35%); + + --warm-red-10: @maroon; + --warm-red-20: @maroon; + --warm-red-30: @maroon; + --warm-red-40: @maroon; + --warm-red-50: @maroon; + --warm-red-60: @maroon; + --warm-red-70: @maroon; + --warm-red-80: @maroon; + --warm-red-90: @maroon; + --warm-red-100: @maroon; + --warm-red-60-a10: fade(@maroon, 10%); + --warm-red-60-a15: fade(@maroon, 15%); + --warm-red-60-a20: fade(@maroon, 20%); + --warm-red-60-a25: fade(@maroon, 25%); + --warm-red-60-a30: fade(@maroon, 30%); + --warm-red-60-a35: fade(@maroon, 35%); + + --teal-10: @teal; + --teal-20: @teal; + --teal-30: @teal; + --teal-40: @teal; + --teal-50: @teal; + --teal-60: @teal; + --teal-70: @teal; + --teal-80: @teal; + --teal-90: @teal; + --teal-100: @teal; + --teal-50-a30: fade(@teal, 30%); + --teal-60-a10: fade(@teal, 10%); + --teal-60-a15: fade(@teal, 15%); + --teal-60-a20: fade(@teal, 20%); + --teal-60-a25: fade(@teal, 25%); + --teal-60-a30: fade(@teal, 30%); + --teal-60-a35: fade(@teal, 35%); + + --purple-10: @lavender; + --purple-20: @lavender; + --purple-30: @lavender; + --purple-40: @lavender; + --purple-50: @lavender; + --purple-60: @lavender; + --purple-70: @lavender; + --purple-80: @lavender; + --purple-90: @lavender; + --purple-100: @lavender; + --purple-40-a15: fade(@lavender, 15%); + --purple-60-a10: fade(@lavender, 10%); + --purple-60-a15: fade(@lavender, 15%); + --purple-60-a20: fade(@lavender, 20%); + --purple-60-a25: fade(@lavender, 25%); + --purple-60-a30: fade(@lavender, 30%); + --purple-60-a35: fade(@lavender, 35%); + --purple-70-a15: fade(@lavender, 15%); + + --system-red-10: @red; + --system-red-20: @red; + --system-red-30: @red; + --system-red-40: @red; + --system-red-50: @red; + --system-red-60: @red; + --system-red-70: @red; + --system-red-80: @red; + --system-red-90: @red; + --system-red-100: @red; + --system-red-60-a10: fade(@red, 10%); + --system-red-60-a15: fade(@red, 15%); + --system-red-60-a20: fade(@red, 20%); + --system-red-60-a25: fade(@red, 25%); + --system-red-60-a30: fade(@red, 30%); + --system-red-60-a35: fade(@red, 35%); + + --system-green-10: darken(@green, 20%); + --system-green-20: darken(@green, 20%); + --system-green-30: darken(@green, 20%); + --system-green-40: darken(@green, 20%); + --system-green-50: darken(@green, 20%); + --system-green-60: darken(@green, 20%); + --system-green-70: darken(@green, 20%); + --system-green-80: darken(@green, 20%); + --system-green-90: darken(@green, 20%); + --system-green-100: darken(@green, 20%); + --system-green-60-a10: fade(darken(@green, 20%), 10%); + --system-green-60-a15: fade(darken(@green, 20%), 15%); + --system-green-60-a20: fade(darken(@green, 20%), 20%); + --system-green-60-a25: fade(darken(@green, 20%), 25%); + --system-green-60-a30: fade(darken(@green, 20%), 30%); + --system-green-60-a35: fade(darken(@green, 20%), 35%); + + --pink-10: @pink; + --pink-20: @pink; + --pink-30: @pink; + --pink-40: @pink; + --pink-50: @pink; + --pink-60: @pink; + --pink-70: @pink; + --pink-80: @pink; + --pink-90: @pink; + --pink-100: @pink; + --pink-60-a10: fade(@pink, 10%); + --pink-60-a15: fade(@pink, 15%); + --pink-60-a20: fade(@pink, 20%); + --pink-60-a25: fade(@pink, 25%); + --pink-60-a30: fade(@pink, 30%); + --pink-60-a35: fade(@pink, 35%); + + --amber-10: @yellow; + --amber-20: @yellow; + --amber-30: @yellow; + --amber-40: @yellow; + --amber-50: @yellow; + --amber-60: @yellow; + --amber-70: @yellow; + --amber-80: @yellow; + --amber-90: @yellow; + --amber-100: @yellow; + --amber-30-a50: fade(@yellow, 50%); + --amber-60-a10: fade(@yellow, 10%); + --amber-60-a15: fade(@yellow, 15%); + --amber-60-a20: fade(@yellow, 20%); + --amber-60-a25: fade(@yellow, 25%); + --amber-60-a30: fade(@yellow, 30%); + --amber-60-a35: fade(@yellow, 35%); + + --copper-10: @rosewater; + --copper-20: @rosewater; + --copper-30: @rosewater; + --copper-40: @rosewater; + --copper-50: @rosewater; + --copper-60: @rosewater; + --copper-70: @rosewater; + --copper-80: @rosewater; + --copper-90: @rosewater; + --copper-100: @rosewater; + --copper-60-a10: fade(@rosewater, 10%); + --copper-60-a15: fade(@rosewater, 15%); + --copper-60-a20: fade(@rosewater, 20%); + --copper-60-a25: fade(@rosewater, 25%); + --copper-60-a30: fade(@rosewater, 30%); + --copper-60-a35: fade(@rosewater, 35%); + + --green-10: @green; + --green-20: @green; + --green-30: @green; + --green-40: @green; + --green-50: @green; + --green-60: @green; + --green-70: @green; + --green-80: @green; + --green-90: @green; + --green-100: @green; + --green-60-a10: fade(@green, 10%); + --green-60-a15: fade(@green, 15%); + --green-60-a20: fade(@green, 20%); + --green-60-a25: fade(@green, 25%); + --green-60-a30: fade(@green, 30%); + --green-60-a35: fade(@green, 35%); + + --sage-10: darken(@green, 40%); + --sage-20: darken(@green, 40%); + --sage-30: darken(@green, 40%); + --sage-40: darken(@green, 40%); + --sage-50: darken(@green, 40%); + --sage-60: darken(@green, 40%); + --sage-70: darken(@green, 40%); + --sage-80: darken(@green, 40%); + --sage-90: darken(@green, 40%); + --sage-100: darken(@green, 40%); + --sage-60-a10: fade(darken(@green, 40%), 10%); + --sage-60-a15: fade(darken(@green, 40%), 15%); + --sage-60-a20: fade(darken(@green, 40%), 20%); + --sage-60-a25: fade(darken(@green, 40%), 25%); + --sage-60-a30: fade(darken(@green, 40%), 30%); + --sage-60-a35: fade(darken(@green, 40%), 35%); + + --lime-10: lighten(@green, 20%); + --lime-20: lighten(@green, 20%); + --lime-30: lighten(@green, 20%); + --lime-40: lighten(@green, 20%); + --lime-50: lighten(@green, 20%); + --lime-60: lighten(@green, 20%); + --lime-70: lighten(@green, 20%); + --lime-80: lighten(@green, 20%); + --lime-90: lighten(@green, 20%); + --lime-100: lighten(@green, 20%); + --lime-60-a10: fade(lighten(@green, 20%), 10%); + --lime-60-a15: fade(lighten(@green, 20%), 15%); + --lime-60-a20: fade(lighten(@green, 20%), 20%); + --lime-60-a25: fade(lighten(@green, 20%), 25%); + --lime-60-a30: fade(lighten(@green, 20%), 30%); + --lime-60-a35: fade(lighten(@green, 20%), 35%); + + --camo-10: @accent; + --camo-20: @accent; + --camo-30: @accent; + --camo-40: @accent; + --camo-50: @accent; + --camo-60: @accent; + --camo-70: @accent; + --camo-80: @accent; + --camo-90: @accent; + --camo-100: @accent; + --camo-60-a10: fade(@accent, 10%); + --camo-60-a15: fade(@accent, 15%); + --camo-60-a20: fade(@accent, 20%); + --camo-60-a25: fade(@accent, 25%); + --camo-60-a30: fade(@accent, 30%); + --camo-60-a35: fade(@accent, 35%); + + --smoke-10: @surface1; + --smoke-20: @surface1; + --smoke-30: @surface1; + --smoke-40: @surface1; + --smoke-50: @surface1; + --smoke-60: @surface1; + --smoke-70: @surface1; + --smoke-80: @surface1; + --smoke-90: @surface1; + --smoke-100: @surface1; + --smoke-60-a10: fade(@surface1, 10%); + --smoke-60-a15: fade(@surface1, 15%); + --smoke-60-a20: fade(@surface1, 20%); + --smoke-60-a25: fade(@surface1, 25%); + --smoke-60-a30: fade(@surface1, 30%); + --smoke-60-a35: fade(@surface1, 35%); + + --lavender-10: @lavender; + --lavender-20: @lavender; + --lavender-30: @lavender; + --lavender-40: @lavender; + --lavender-50: @lavender; + --lavender-60: @lavender; + --lavender-70: @lavender; + --lavender-80: @lavender; + --lavender-90: @lavender; + --lavender-100: @lavender; + --lavender-60-a10: fade(@lavender, 10%); + --lavender-60-a15: fade(@lavender, 15%); + --lavender-60-a20: fade(@lavender, 20%); + --lavender-60-a25: fade(@lavender, 25%); + --lavender-60-a30: fade(@lavender, 30%); + --lavender-60-a35: fade(@lavender, 35%); + + --mauve-10: @mauve; + --mauve-20: @mauve; + --mauve-30: @mauve; + --mauve-40: @mauve; + --mauve-50: @mauve; + --mauve-60: @mauve; + --mauve-70: @mauve; + --mauve-80: @mauve; + --mauve-90: @mauve; + --mauve-100: @mauve; + --mauve-60-a10: fade(@mauve, 10%); + --mauve-60-a15: fade(@mauve, 15%); + --mauve-60-a20: fade(@mauve, 20%); + --mauve-60-a25: fade(@mauve, 25%); + --mauve-60-a30: fade(@mauve, 30%); + --mauve-60-a35: fade(@mauve, 35%); + --mauve-80-a50: fade(@mauve, 50%); + + --system-gray-10: @surface0; + --system-gray-20: @surface0; + --system-gray-30: @surface0; + --system-gray-40: @surface0; + --system-gray-50: @surface0; + --system-gray-60: @surface0; + --system-gray-70: @surface0; + --system-gray-80: @surface0; + --system-gray-90: @surface0; + --system-gray-100: @surface0; + --system-gray-60-a10: fade(@surface0, 10%); + --system-gray-60-a15: fade(@surface0, 15%); + --system-gray-60-a20: fade(@surface0, 20%); + --system-gray-60-a25: fade(@surface0, 25%); + --system-gray-60-a30: fade(@surface0, 30%); + --system-gray-60-a35: fade(@surface0, 35%); + --system-gray-60-a40: fade(@surface0, 40%); + --system-gray-60-a45: fade(@surface0, 45%); + + --system-orange-10: @peach; + --system-orange-20: @peach; + --system-orange-30: @peach; + --system-orange-40: @peach; + --system-orange-50: @peach; + --system-orange-60: @peach; + --system-orange-70: @peach; + --system-orange-80: @peach; + --system-orange-90: @peach; + --system-orange-100: @peach; + --system-orange-60-a10: fade(@peach, 10%); + --system-orange-60-a15: fade(@peach, 15%); + --system-orange-60-a20: fade(@peach, 20%); + --system-orange-60-a25: fade(@peach, 25%); + --system-orange-60-a30: fade(@peach, 30%); + --system-orange-60-a35: fade(@peach, 35%); + + /* quality of life changes */ + --color-border-low-emphasis: @surface0; + + /* Codeblock fixes */ + pre { + --color-text-on-dark: @text; + --color-background-container-dark-tint: @crust; + } + + /* more accent */ + --voyager-color-background-badge-notification: @accent; + --color-signal-positive: @accent; + --color-checked: @accent; + --color-checked-hover: @accent; + --color-checked-active: @accent; + + /* fix for hover buttons */ + --artdeco-button-secondary-default-hover-background-color: fade( + @blue, + 20% + ); + + /* text on dark */ + --color-text-on-dark: @text; + + & when not(@flavor = latte) { + --color-element: @crust; + } + + & when (@flavor = latte) { + --black: @text; + --black-a90: @text; + --black-a75: @text; + --black-a45: @text; + --black-a30: @text; + --black-a60: @subtext0; + --black-a15: @text; + --black-a04: @text; + --black-a100: @text; + + --color-scrim: fade(@crust, 40%); + --color-icon-on-dark: @text; + + --white: @mantle; + --white-a06: @surface0; + --white-a12: @surface0; + --white-a18: @surface0; + --white-a25: @surface0; + --white-a30: @mantle; + --white-a40: @mantle; + --white-a45: @mantle; + --white-a55: @mantle; + --white-a60: @subtext0; + --white-a70: @mantle; + --white-a75: @mantle; + --white-a85: @mantle; + --white-a90: @mantle; + --white-a100: @mantle; + + --warm-gray-10: @base; + --warm-gray-20: @base; + --warm-gray-30: @base; + --warm-gray-40: @base; + --warm-gray-50: @base; + --warm-gray-60: @base; + --warm-gray-70: @base; + --warm-gray-80: @base; + --warm-gray-90: @base; + --warm-gray-100: @base; + --warm-gray-60-a10: fade(@base, 10%); + --warm-gray-60-a15: fade(@base, 15%); + --warm-gray-60-a20: fade(@base, 20%); + --warm-gray-60-a25: fade(@base, 25%); + --warm-gray-60-a30: fade(@base, 30%); + --warm-gray-60-a35: fade(@base, 35%); + } + + .share-promoted-detour-button-legacy { + background-color: @accent !important; + } + } +} diff --git a/styles/linkedin/preview.webp b/styles/linkedin/preview.webp deleted file mode 100644 index a8ef6b89e5..0000000000 --- a/styles/linkedin/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:58d2653809087ac7f40f2a306ca50e5256b3030f8f07f7e50b1e5a812252e23b -size 439942 diff --git a/styles/listenbrainz/README.md b/styles/listenbrainz/README.md index 1dc8d7614e..861cf38b41 100644 --- a/styles/listenbrainz/README.md +++ b/styles/listenbrainz/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/listenbrainz/catppuccin.user.css b/styles/listenbrainz/catppuccin.user.less similarity index 74% rename from styles/listenbrainz/catppuccin.user.css rename to styles/listenbrainz/catppuccin.user.less index e7f7a4fc75..1e78ed86a6 100644 --- a/styles/listenbrainz/catppuccin.user.css +++ b/styles/listenbrainz/catppuccin.user.less @@ -2,8 +2,8 @@ @name ListenBrainz Catppuccin @namespace github.com/catppuccin/userstyles/styles/listenbrainz @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/listenbrainz -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/listenbrainz/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/listenbrainz/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alistenbrainz @description Soothing pastel theme for ListenBrainz @author Catppuccin @@ -15,59 +15,21 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('listenbrainz.org') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("listenbrainz.org") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); // We can't control which theme is passed to Toastify's props from CSS, but // we can replace the default theme with whatever colours we want. @@ -84,9 +46,9 @@ nav[role="navigation"] { .navbar-header .navbar-toggle { - border-color: @accent-color; + border-color: @accent; .icon-bar { - background-color: @accent-color; + background-color: @accent; } } @@ -199,7 +161,7 @@ .toggle-checkbox:checked + .toggle-switch { background-color: @surface1; &::before { - background-color: @accent-color; + background-color: @accent; } } @@ -211,7 +173,7 @@ } } - &.table-striped > tbody > tr:nth-of-type(2n + 1) { + &.table-striped > tbody > tr:nth-of-type(2n+1) { background-color: @surface0; } } @@ -244,18 +206,18 @@ .lb-follow-button.block, .pill.secondary.active { color: @crust; - background-color: @accent-color; + background-color: @accent; border-color: transparent; &:hover { color: @crust; - background-color: darken(@accent-color, 5%); + background-color: darken(@accent, 5%); } } .open > .dropdown-toggle.btn-info { color: @crust; - background-color: darken(@accent-color, 10%); + background-color: darken(@accent, 10%); } .secondary-nav > ol.breadcrumb { @@ -353,7 +315,7 @@ &.listen-card { .listen-thumbnail > div { - color: @accent-color; + color: @accent; background-color: @surface1; border-top-left-radius: 7px; border-bottom-left-radius: 7px; @@ -369,7 +331,7 @@ color: @text; &:hover, &.playing { - color: @accent-color; + color: @accent; } } @@ -427,7 +389,7 @@ color: @text !important; } &:hover { - background-color: fade(@accent-color, 30%) !important; + background-color: fade(@accent, 30%) !important; } } } @@ -502,9 +464,9 @@ .react-calendar__tile--hasActive, .react-calendar__tile--active { color: @text; - background-color: fade(@accent-color, 40%); + background-color: fade(@accent, 40%); &:enabled:hover { - background-color: fade(@accent-color, 50%); + background-color: fade(@accent, 50%); } } } @@ -593,10 +555,10 @@ background-color: @surface1; } .rc-slider-handle { - background-color: @accent-color; + background-color: @accent; &.rc-slider-handle-dragging { - background-color: @accent-color; - border-color: @accent-color; + background-color: @accent; + border-color: @accent; } } .rc-slider-mark-text { @@ -613,12 +575,12 @@ #homepage-container { @homepage-bg: linear-gradient(288deg, @peach 16.96%, @mauve 98.91%); @flipped-blue: if( - @lookup = latte, + @flavor = latte, @catppuccin[@mocha][@blue], @catppuccin[@latte][@blue] ); @flipped-sky: if( - @lookup = latte, + @flavor = latte, @catppuccin[@mocha][@sky], @catppuccin[@latte][@sky] ); @@ -675,10 +637,10 @@ .homepage-info { color: @text; .create-account-button { - background-color: @accent-color; + background-color: @accent; color: @crust; &:hover { - background-color: darken(@accent-color, 5%); + background-color: darken(@accent, 5%); } } } @@ -691,7 +653,7 @@ .progress { background-color: @surface1; > .progress-bar { - background-color: @accent-color; + background-color: @accent; } } @@ -701,14 +663,14 @@ .controls > .btn-link, .actions > a { - color: @accent-color; + color: @accent; } .actions { .heart-actions(); .fa-ellipsis-vertical { - stroke: @accent-color; + stroke: @accent; } } @@ -730,13 +692,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/listenbrainz/preview.webp b/styles/listenbrainz/preview.webp deleted file mode 100644 index b85471c6d6..0000000000 --- a/styles/listenbrainz/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:11c008863f24029c98482f4e034cda0189786c004d1633b775f2ebe039bb0afa -size 464762 diff --git a/styles/lobste.rs/README.md b/styles/lobste.rs/README.md new file mode 100644 index 0000000000..06369d1b28 --- /dev/null +++ b/styles/lobste.rs/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Lobsters + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [steinuil](https://github.com/steinuil) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/lobste.rs/catppuccin.user.less b/styles/lobste.rs/catppuccin.user.less new file mode 100644 index 0000000000..d9dd96875c --- /dev/null +++ b/styles/lobste.rs/catppuccin.user.less @@ -0,0 +1,112 @@ +/* ==UserStyle== +@name Lobsters Catppuccin +@namespace github.com/catppuccin/userstyles/styles/lobste.rs +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/lobste.rs +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/lobste.rs/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Alobste.rs +@description Soothing pastel theme for Lobsters +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("lobste.rs") { + html:has(head > link[rel="stylesheet"][href^="/assets/system-"]) { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + html:has(head > link[rel="stylesheet"][href^="/assets/light-"]) { + #catppuccin(@lightFlavor); + } + + html:has(head > link[rel="stylesheet"][href^="/assets/dark-"]) { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --color-bg: @base; + + --color-fg: @text; + --color-fg-shape: @surface2; + + --color-tag-bg: fade(@yellow, 20%); + --color-tag-border: fade(@yellow, 20%); + + --color-lobsters-tag-special-bg: fade(@red, 30%); + --color-lobsters-tag-special-border: fade(@red, 30%); + + --color-tag-media-bg: fade(@blue, 20%); + --color-tag-media-border: fade(@blue, 30%); + + --color-tag-meta-bg: @surface0; + --color-tag-meta-border: @surface2; + + --color-bg-target: fade(@accent, 20%); + + --color-fg-affirmative: @green; + --color-fg-accent: @accent; + --color-fg-author: @blue; + + --color-fg-contrast-7-5: @blue; + + --color-fg-link: @blue; + --color-fg-link-visited: @lavender; + + --color-fg-contrast-4-5: @subtext0; + --color-fg-contrast-5: @subtext1; + --color-fg-contrast-6: @subtext1; + --color-fg-contrast-10: @text; + --color-fg-contrast-13: @text; + + --color-box-bg: @mantle; + --color-button-bg: @mantle; + --color-button-bg-shaded: @surface0; + --color-box-border: @surface0; + --color-box-border-focus: @accent; + --color-box-bg-shaded: @mantle; + + --color-mobile-story-liner-bg: @base; + --color-mobile-story-comments-bubble-fill: @surface1; + + --color-mobile-story-comments-bubble-fill-zero: @surface0; + + --color-table-header-bg: @surface0; + --color-table-header-border: @surface1; + --color-table-row-bg-even: @mantle; + --color-table-row-bg-odd: @crust; + --color-table-row-border: @base; + + --color-flash-bg-success: fade(@green, 30%); + --color-fg-negative: @red; + + hr { + color: @surface2; + } + + #logo { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + background-color: transparent !important; + &::after { + background: none; + } + } + } +} diff --git a/styles/mastodon/README.md b/styles/mastodon/README.md index b357fe2447..b85c75f385 100644 --- a/styles/mastodon/README.md +++ b/styles/mastodon/README.md @@ -10,24 +10,20 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ™‹ FAQ -- Q: **The theme does not look the same as the preview?**\ - A: Your Mastodon instance may be using its own custom CSS, which is changing the look of the theme. -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## ๐Ÿ’ Current Maintainer +- [comfysage](https://github.com/comfysage) ## ๐Ÿ’– Past Maintainers -- [Lemon](https://github.com/unseen-ninja) -- [Isabel](https://github.com/isabelroses) +- [unseen-ninja](https://github.com/unseen-ninja) +- [isabelroses](https://github.com/isabelroses)   diff --git a/styles/mastodon/catppuccin.user.css b/styles/mastodon/catppuccin.user.css deleted file mode 100644 index afbeb74323..0000000000 --- a/styles/mastodon/catppuccin.user.css +++ /dev/null @@ -1,736 +0,0 @@ -/* ==UserStyle== -@name Mastodon Catppuccin -@namespace github.com/catppuccin/userstyles/styles/mastodon -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/mastodon -@version 1.3.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/mastodon/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Amastodon -@description Soothing pastel theme for Mastodon -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("mastodon.social"), -domain("mstdn.social"), -domain("fosstodon.org"), -domain("piaille.fr"), -domain("meow.lgbt"), -domain("tech.lgbt"), -domain("wetdry.world"), -domain("toot.wales") { - .theme-mastodon-light, - .skin-modern-light, - .skin-mastodon-light { - #catppuccin(@lightFlavor, @accentColor); - } - - .theme-contrast, - .skin-modern-dark, - .skin-contrast { - #catppuccin(@darkFlavor, @accentColor); - } - - @media (prefers-color-scheme: light) { - .theme-default, - .skin-default, - .skin-system { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - .theme-default, - .skin-default, - .skin-system { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --background-color: @base; - --background-color-alt: @base; - - --dropdown-border-color: @surface1; - --dropdown-background-color: @surface0; - --modal-background-color: @mantle; - --modal-border-color: @crust; - - &, - .column-header__wrapper, - .column > *:not(.loading-indicator), - body.flavour-glitch.skin-default .column-header__wrapper { - --background-border-color: @surface0 !important; - } - - &, - .tabs-bar__wrapper, - .admin-wrapper .sidebar-wrapper__inner, - .ui__header { - background: @crust; - color: @text; - } - - .navigation-panel, - .column-link { - background: transparent; - } - - .account__header__bio .account__header__fields dt { - background: transparent; - } - - .search-popout, - .search-popout em, - .dismissable-banner__message, - .dismissable-banner__message h1, - .account__header__bio .account__header__fields dt, - .account__section-headline a.active, - .account__section-headline button.active, - .notification__filter-bar a.active, - .notification__filter-bar button.active, - .account__header__bio .account__header__content, - .navigation-bar, - .column-link__badge, - .display-name__html, - .column-subheading, - .account__display-name strong, - .status__display-name strong, - .notification__message, - .public-layout .public-account-bio .account__header__content, - .reply-indicator__content, - .status__content, - .status__content__text, - .card__bar .display-name strong { - color: @text; - } - - .search-popout span, - .link-footer p, - .link-footer p a { - color: @subtext1; - } - - .account__header__tabs__name h1 small, - .account__header__bio .account__header__fields dd, - .display-name__account, - .status__relative-time, - .empty-column-indicator, - .follow_requests-unlocked_explanation, - .account .account__display-name, - .label_input .search__input, - .search__input:focus, - .account__header__fields dt { - color: @subtext0; - } - - .compose-panel hr, - .navigation-panel hr { - border-top-color: @surface2; - } - - .mention, - .icon-button.inverted, - .icon-button.inverted:focus, - .icon-button.inverted:hover .account__header__tabs__name h1, - .account__header__content a, - .account__header__bio .account__header__fields a, - .empty-column-indicator a, - .follow_requests-unlocked_explanation a, - .column-back-button, - .text-icon-button, - .icon-button.star-icon.active, - .public-layout .public-account-bio .account__header__fields a, - .column-header__back-button, - .navigation-bar strong, - .reply-indicator__content a.unhandled-link, - .status__content a.unhandled-link, - .announcements__item__content a.unhandled-link, - .reactions-bar__item.active .reactions-bar__item__count, - .column-header.active .column-header__icon { - color: @accent-color; - } - - .icon-button.active.inverted { - color: @mantle; - } - - .display-name strong { - color: @text !important; - } - - .boost-modal__action-bar { - span { - color: @subtext1; - } - background: @mantle; - } - - .emoji-mart-anchor-selected, - .reply-indicator__content a { - color: @accent-color !important; - } - - .confirmation-modal { - background-color: @base; - color: @text; - } - .confirmation-modal__action-bar { - background-color: @mantle; - } - - .privacy-dropdown__option { - background: @surface0; - - .privacy-dropdown__option__content, - strong, - i { - color: @text; - } - - &:hover, - &.active { - background: @accent-color !important; - - .privacy-dropdown__option__content, - strong, - i { - color: @crust; - } - } - } - - .privacy-dropdown.active .privacy-dropdown__value { - background: @accent-color !important; - } - - .privacy-dropdown.active .privacy-dropdown__value > button, - .privacy-dropdown__value-icon.active > i { - color: @crust !important; - } - - .emoji-mart-search > input { - color: @text !important; - } - - .emoji-mart-search, - .language-dropdown__dropdown__results { - background: @surface0; - } - - .language-dropdown__dropdown { - background: @surface1 !important; - } - - .language-dropdown__dropdown__results__item { - > span { - color: @text; - } - - &:hover, - &.active { - background: @accent-color; - - > span { - color: @crust; - } - } - } - - .conversation__unread, - .emoji-mart-anchor-bar, - .compose-form__actions .icon-button.active, - .react-toggle--checked .react-toggle-track, - .react-toggle--checked:hover .react-toggle-track, - .pillbar-button:not([disabled]).active, - .pillbar-button:not([disabled]).active:focus, - .pillbar-button:not([disabled]).active:hover, - .radio-button__input.checked { - background-color: @accent-color; - } - - .reactions-bar__item.active { - background-color: rgba(@accent-color, 0.25); - } - - .trends__item__sparkline path:last-child { - stroke: @accent-color !important; - } - .trends__item__sparkline path:first-child { - fill: rgba(@accent-color, 0.25) !important; - } - - .icon-button, - .notification__message .fa { - color: @surface2; - } - - .icon-button:active, - .icon-button:focus, - .icon-button:hover, - .text-icon-button:active, - .text-icon-button:focus, - .text-icon-button:hover, - .public-layout .public-account-bio .account__header__fields a:hover { - color: @accent-color; - } - - .account__domain-pill { - color: @accent-color; - background: fadeout(@accent-color, 80); - } - - .column-back-button, - .drawer__header, - .account__section-headline button, - .account__header, - .search__input, - .search__input:focus, - .column-link__badge, - .column-subheading, - .public-layout .header, - .public-layout .public-account-header__bar::before, - .account__header__fields, - .account__header__fields - dd:not(.account__header__bio .account__header__fields dd), - .admin-wrapper .sidebar ul .simple-navigation-active-leaf .selected, - .explore__search-header, - .column-inline-form, - .follow_requests-unlocked_explanation, - .conversation--unread, - .announcements, - .status-card__image { - background: @surface0 !important; - } - - .account__section-headline { - background: @mantle; - } - - .focusable:focus { - background: unset; - } - - .admin-wrapper .sidebar ul a:hover, - .admin-wrapper .sidebar ul .simple-navigation-active-leaf a:hover, - .detailed-status, - .detailed-status__action-bar { - background: @surface0; - } - - .dismissable-banner { - background: @base; - } - - .column-header__wrapper.active { - box-shadow: 0 1px 0 rgba(@accent-color, 0.3); - } - .column-header__wrapper.active::before { - background: radial-gradient( - ellipse, - rgba(@accent-color, 0.23) 0, - rgba(99, 100, 255, 0) 60% - ); - } - - .account__header__bio .account__header__fields dl, - .account__header__bio .account__header__fields, - .boost-modal__container, - .empty-column-indicator, - .column > .scrollable, - .nothing-here, - .public-layout .public-account-bio, - .hero-widget__text, - &.admin, - .admin-wrapper .sidebar ul a.selected, - .admin-wrapper .sidebar ul ul { - background: @base; - } - - .dropdown-button { - border-color: @accent-color; - color: @accent-color; - } - - .public-layout .public-account-header__tabs__tabs .counter::after, - .public-layout .public-account-header__tabs__tabs .counter.active::after, - .react-toggle--checked .react-toggle-thumb, - .radio-button__input.checked, - .account__action-bar__tab.active { - border-color: @accent-color; - } - - .account, - .load-gap { - border-color: @mantle; - } - - .account__section-headline a.active::after { - border-color: transparent transparent @base; - } - - .account__section-headline a.active::before, - .account__section-headline button.active::after, - .account__section-headline button.active::before { - border-color: transparent transparent @mantle; - } - - .poll__chart { - background: @overlay0; - &.leading { - background: @accent-color; - } - } - - .search-popout, - .drawer__header a:hover, - .column-header__button:hover, - .account__section-headline button:hover, - .account__section-headline a:hover { - background: @surface2; - } - - .prose a, - .column-link .active, - .compose-form__poll__select__value, - .column-link--transparent.active, - .column-link--transparent:focus, - .column-link:focus, - .column-link--transparent:hover, - .column-link:hover { - color: @accent-color; - } - - .status.collapsed .status__content::after { - background: linear-gradient(fadeout(@base, 100), @base); - } - - .button.button-tertiary:focus, - .button.button-tertiary:hover, - .button.button-tertiary:active { - color: @base; - } - - .button.button-tertiary { - border-color: @accent-color; - } - - .button, - .button.button-tertiary, - .button.logo-button, - .icon-with-badge__badge { - background: @accent-color; - color: @base; - } - - .button.logo-button svg { - fill: currentcolor; - } - - .public-layout .header .nav-button { - background-color: @surface1; - } - - .public-layout .header .nav-button:hover { - background-color: @surface2; - } - - .button.button-secondary { - background-color: transparent; - color: @text; - border-color: @accent-color; - } - .button.button-secondary:active, - .button.button-secondary:focus, - .button.button-secondary:hover { - border-color: @accent-color; - color: @base; - transition: 0.2s; - } - - .button:active, - .button:focus, - .button:hover, - .button.button-tertiary:active, - .button.button-tertiary:focus, - .button.button-tertiary:hover, - .button.logo-button:active, - .button.logo-button:focus, - .button.logo-button:hover, - .announcements__item__unread { - background: @accent-color; - } - - select { - background-color: @mantle; - color: @text; - } - - .mute-modal__cancel-button { - background-color: @base; - color: @text; - &:hover { - background-color: @surface0; - } - } - - .drawer__inner, - .drawer__inner__mastodon, - .compose-form__highlightable, - .column-header, - .boost-modal, - .mute-modal, - .privacy-dropdown__dropdown, - .explore__search-header .search__input { - background-color: @base; - } - - .mute-modal__action-bar { - background-color: @mantle; - } - - .mute-modal__container { - background-color: @base; - color: @text; - } - - .compose-form .autosuggest-textarea__textarea { - color: @text !important; - background-color: @surface1 !important; - } - - .compose-form .compose-form__modifiers, - .compose-form .compose-form__autosuggest-wrapper, - .autosuggest-textarea__suggestions, - .compose-form .spoiler-input__input { - background: @surface1 !important; - color: @text !important; - } - - .compose-form .compose-form__buttons-wrapper { - background: @surface0; - } - - .load-more:hover { - background-color: @mantle; - } - - .character-counter { - color: @subtext0; - } - - .public-layout .header, - .hero-widget, - .public-layout .public-account-header, - .public-layout .public-account-bio, - .nothing-here { - box-shadow: none; - } - - .dropdown-menu__item--dangerous a { - color: @red; - } - - .search__popout, - .dropdown-menu__arrow::before, - .dropdown-menu__item button, - .dropdown-menu__container__list, - .dropdown-menu.bottom { - background: @surface0; - color: @text; - } - - .dropdown-menu__item a:hover, - .dropdown-menu__item button:hover { - background: @surface1; - } - - .input-copy, - .simple_form input[type="text"], - .simple_form textarea, - .simple_form .block-button, - .notification__filter-bar button, - .simple_form .button, - .simple_form button { - background: @mantle; - color: @text; - } - - .simple_form .block-button:hover, - .simple_form .button:hover, - .notification__filter-bar button:hover, - .simple_form button:hover { - background: @surface0; - } - - .simple_form .input.with_label .label_input > label, - .simple_form select, - .accounts-table__count, - .simple_form textarea { - color: @text; - } - - .simple_form textarea, - .simple_form input[type="password"], - .simple_form input[type="number"], - .simple_form input[type="text"] { - border-color: @crust; - } - - .simple_form input[type="email"]:required:valid { - border-color: @green; - } - - .simple_form input[type="password"], - .simple_form input[type="number"], - .simple_form input[type="email"]:required:valid, - .simple_form - input[type="password"]:required:invalid:not(:placeholder-shown) { - color: @text; - background: @mantle; - } - - .simple_form - input[type="password"]:required:invalid:not(:placeholder-shown) { - border-color: @red; - } - - .simple_form select { - @svg: escape( - '' - ); - background: @mantle url("data:image/svg+xml,@{svg}") no-repeat right 8px - center/auto 16px; - border-color: @crust; - } - - .poll__option input[type="text"]:focus, - .simple_form input[type="datetime-local"]:active, - .simple_form input[type="datetime-local"]:focus, - .simple_form input[type="email"]:active, - .simple_form input[type="email"]:focus, - .simple_form input[type="number"]:active, - .simple_form input[type="number"]:focus, - .simple_form input[type="password"]:active, - .simple_form input[type="password"]:focus, - .simple_form input[type="text"]:active, - .simple_form input[type="text"]:focus, - .simple_form input[type="url"]:active, - .simple_form input[type="url"]:focus, - .simple_form textarea:active, - .simple_form textarea:focus { - border-color: @accent-color !important; - background: @mantle !important; - color: @text !important; - } - - .table > thead > tr > th, - .setting-text:active, - .setting-text:focus { - border-color: @accent-color !important; - } - - .batch-table__toolbar, - .table > thead > tr > th { - background: @surface0 !important; - color: @text !important; - } - - .simple_form input[type="datetime-local"]:hover, - .simple_form input[type="email"]:hover, - .simple_form input[type="number"]:hover, - .simple_form input[type="password"]:hover, - .simple_form input[type="text"]:hover, - .simple_form input[type="url"]:hover, - .simple_form textarea:hover { - background: @mantle !important; - border-color: @accent-color !important; - transition: 0.4s; - } - - .batch-table__row { - background: @surface1; - } - - .batch-table__row:hover, - .batch-table__row:nth-child(2n):hover { - background: @surface2; - } - - .batch-table__row:nth-child(2n), - .table > tbody > tr > td { - background: @surface0; - } - - .table > thead > tr > th { - border-bottom-color: @surface0; - } - - .positive-hint { - color: @green !important; - } - - .card__bar { - background: @surface0; - } - - .reply-indicator { - background: @surface1; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/mastodon/catppuccin.user.less b/styles/mastodon/catppuccin.user.less new file mode 100644 index 0000000000..de44ff13be --- /dev/null +++ b/styles/mastodon/catppuccin.user.less @@ -0,0 +1,121 @@ +/* ==UserStyle== +@name Mastodon Catppuccin +@namespace github.com/catppuccin/userstyles/styles/mastodon +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/mastodon +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/mastodon/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Amastodon +@description Soothing pastel theme for Mastodon +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("mastodon.social"), domain("fosstodon.org") { + [data-color-scheme="light"] { + #catppuccin(@lightFlavor); + } + [data-color-scheme="dark"] { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --color-bg-primary: @base; + --color-bg-secondary: @surface0; + --color-bg-tertiary: @surface1; + --color-bg-inverted: @text; + + --color-text-primary: @text; + --color-text-secondary: @subtext1; + --color-text-tertiary: @subtext0; + --color-text-inverted: @base; + + /* Brand */ + --color-bg-brand-base: @accent; + --color-bg-brand-base-hover: darken(@accent, 5%); + --color-bg-brand-soft: fade(@accent, 40%); + --color-bg-brand-softest: fade(@accent, 15%); + + --color-text-brand: @accent; + --color-text-on-brand-base: @base; + --color-text-brand-on-inverted: @accent; + + /* States */ + + // Error + --color-bg-error-base: @red; + --color-bg-error-base-hover: darken(@red, 5%); + --color-bg-error-soft: fade(@red, 40%); + --color-bg-error-softest: fade(@red, 15%); + --color-text-error: @red; + --color-text-on-error-base: @base; + + // Warning + --color-bg-warning-base: @yellow; + --color-bg-warning-soft: fade(@yellow, 40%); + --color-bg-warning-softest: fade(@yellow, 15%); + --color-text-warning: @yellow; + --color-text-on-warning-base: @base; + + // Success + --color-bg-success-base: @green; + --color-bg-success-soft: fade(@green, 40%); + --color-bg-success-softest: fade(@green, 15%); + --color-text-success: @green; + --color-text-on-success-base: @base; + + // Disabled + --color-bg-disabled: @overlay1; + --color-text-disabled: @overlay1; + --color-text-on-disabled: @subtext0; + + /* Borders */ + --color-border-primary: @surface2; + --color-border-brand: @accent; + --color-border-brand-soft: fade(@accent, 50%); + --color-border-error: @red; + --color-border-error-soft: fade(@red, 50%); + --color-border-warning-soft: fade(@yellow, 50%); + --color-border-success-soft: fade(@green, 50%); + + /* Other */ + --color-shadow-primary: fade(@mantle, 30%); + --color-bg-overlay-base: fade(@text, 60%); + --color-bg-overlay-highlight: fade(@text, 5%); + + /* Images (alt text, hide/spoilers) */ + --color-bg-media-base: @crust; + --color-text-on-media: @text; + --color-border-media: @surface1; + + /* Actions (bookmarking, favoriting) */ + --color-text-bookmark-highlight: @teal; + --color-text-favourite-highlight: @yellow; + + .logo { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + /* Verified badge icon (e.g. profile fields) */ + svg.icon-verified { + path[fill="url(#VerifiedGradient)"] { + fill: @green !important; + } + path[stroke="#fff"] { + stroke: @base !important; + } + } + } +} diff --git a/styles/mastodon/preview.webp b/styles/mastodon/preview.webp deleted file mode 100644 index e0794f786e..0000000000 --- a/styles/mastodon/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:694daa0160b9eb3f3cff089c66bf809825700cae59bf2fb6082d808f532259cb -size 485508 diff --git a/styles/mdbook/README.md b/styles/mdbook/README.md index a031edc214..4344a0db2f 100644 --- a/styles/mdbook/README.md +++ b/styles/mdbook/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/mdbook/catppuccin.user.css b/styles/mdbook/catppuccin.user.css deleted file mode 100644 index cf8cc5d3bd..0000000000 --- a/styles/mdbook/catppuccin.user.css +++ /dev/null @@ -1,169 +0,0 @@ -/* ==UserStyle== -@name mdBook Catppuccin -@namespace github.com/catppuccin/userstyles/styles/mdbook -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/mdbook -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/mdbook/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Amdbook -@description Soothing pastel theme for mdBook -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document url-prefix('https://rust-lang.github.io/mdBook/'), domain('doc.rust-lang.org'), domain('rust-book.cs.brown.edu') -{ - @import url("https://unpkg.com/@catppuccin/highlightjs@0.2.2/css/catppuccin.variables.css"); - - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - --ctp-rosewater: #rgbify(@rosewater) []; - --ctp-flamingo: #rgbify(@flamingo) []; - --ctp-pink: #rgbify(@pink) []; - --ctp-mauve: #rgbify(@mauve) []; - --ctp-red: #rgbify(@red) []; - --ctp-maroon: #rgbify(@maroon) []; - --ctp-peach: #rgbify(@peach) []; - --ctp-yellow: #rgbify(@yellow) []; - --ctp-green: #rgbify(@green) []; - --ctp-teal: #rgbify(@teal) []; - --ctp-sky: #rgbify(@sky) []; - --ctp-sapphire: #rgbify(@sapphire) []; - --ctp-blue: #rgbify(@blue) []; - --ctp-lavender: #rgbify(@lavender) []; - --ctp-text: #rgbify(@text) []; - --ctp-subtext1: #rgbify(@subtext1) []; - --ctp-subtext0: #rgbify(@subtext0) []; - --ctp-overlay2: #rgbify(@overlay2) []; - --ctp-overlay1: #rgbify(@overlay1) []; - --ctp-overlay0: #rgbify(@overlay0) []; - --ctp-surface2: #rgbify(@surface2) []; - --ctp-surface1: #rgbify(@surface1) []; - --ctp-surface0: #rgbify(@surface0) []; - --ctp-base: #rgbify(@base) []; - --ctp-mantle: #rgbify(@mantle) []; - --ctp-crust: #rgbify(@crust) []; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --bg: @base; - --fg: @text; - --sidebar-bg: @mantle; - --sidebar-fg: @text; - --sidebar-non-existant: @overlay0; - --sidebar-active: @blue; - --sidebar-spacer: @overlay0; - --scrollbar: @overlay0; - --icons: @overlay0; - --icons-hover: @overlay1; - --links: @blue; - --inline-code-color: @peach; - --theme-popup-bg: @mantle; - --theme-popup-border: @overlay0; - --theme-hover: @overlay0; - --quote-bg: @mantle; - --quote-border: @crust; - --table-border-color: @crust; - --table-header-bg: @mantle; - --table-alternate-bg: @mantle; - --searchbar-border-color: @crust; - --searchbar-bg: @mantle; - --searchbar-fg: @text; - --searchbar-shadow-color: @crust; - --searchresults-header-fg: @text; - --searchresults-border-color: @crust; - --searchresults-li-bg: @base; - --search-mark-bg: @peach; - --warning-border: @peach; - - code.hljs { - color: @text; - background: @mantle; - } - blockquote blockquote { - border-top-color: @surface2; - border-bottom-color: @surface2; - } - hr { - color: @surface2; - } - del { - color: @overlay2; - } - .ace_gutter { - color: @overlay1; - background: @mantle; - } - .ace_gutter-active-line.ace_gutter-cell { - color: @pink; - background: @mantle; - } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/mdbook/catppuccin.user.less b/styles/mdbook/catppuccin.user.less new file mode 100644 index 0000000000..8441192ed1 --- /dev/null +++ b/styles/mdbook/catppuccin.user.less @@ -0,0 +1,108 @@ +/* ==UserStyle== +@name mdBook Catppuccin +@namespace github.com/catppuccin/userstyles/styles/mdbook +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/mdbook +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/mdbook/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Amdbook +@description Soothing pastel theme for mdBook +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("rust-lang.github.io"), + domain("doc.rust-lang.org"), + domain("rust-book.cs.brown.edu"), + domain("rustc-dev-guide.rust-lang.org"), + domain("forge.rust-lang.org"), + domain("lang-team.rust-lang.org"), + domain("doc.redox-os.org"), + url-prefix("https://lukaswirth.dev/tlborm/") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.css"); + + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --bg: @base; + --fg: @text; + --sidebar-bg: @mantle; + --sidebar-fg: @text; + --sidebar-non-existant: @overlay0; + --sidebar-active: @blue; + --sidebar-spacer: @overlay0; + --scrollbar: @overlay0; + --icons: @overlay0; + --icons-hover: @overlay2; + --links: @blue; + --inline-code-color: @text; + --theme-popup-bg: @mantle; + --theme-popup-border: @overlay0; + --theme-hover: @overlay0; + --quote-bg: @mantle; + --quote-border: @crust; + --table-border-color: @surface0; + --table-header-bg: mix(@accent, @base, 30%); + --table-alternate-bg: @mantle; + --searchbar-border-color: @surface0; + --searchbar-bg: @mantle; + --searchbar-fg: @text; + --searchbar-shadow-color: @crust; + --searchresults-header-fg: @text; + --searchresults-border-color: @surface2; + --searchresults-li-bg: @base; + --sidebar-header-border-color: @lavender; + --search-mark-bg: @peach; + --warning-border: @peach; + --copy-button-filter: @subtext0-filter; + --copy-button-filter-hover: @blue-filter; + --blockquote-note-color: @blue; + --blockquote-tip-color: @green; + --blockquote-important-color: @mauve; + --blockquote-warning-color: @yellow; + --blockquote-caution-color: @red; + /* https://github.com/cognitive-engineering-lab/mdbook-quiz */ + --mdbook-incorrect: @red; + --mdbook-correct: @green; + + code.hljs { + color: @text; + background: @mantle; + } + blockquote blockquote { + border-top-color: @surface2; + border-bottom-color: @surface2; + } + hr { + color: @surface2; + } + del { + color: @overlay2; + } + .ace_gutter { + color: @overlay1; + background: @mantle; + } + .ace_gutter-active-line.ace_gutter-cell { + color: @pink; + background: @mantle; + } + } +} diff --git a/styles/mdbook/preview.webp b/styles/mdbook/preview.webp deleted file mode 100644 index 3266d26328..0000000000 --- a/styles/mdbook/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d71e4166b06fb217e84dfdd4196c0834e4ee21aad2bcc17d36cb59abe7b5de0f -size 165684 diff --git a/styles/mdn/README.md b/styles/mdn/README.md index f033cf0bb0..b4fa3e6a4e 100644 --- a/styles/mdn/README.md +++ b/styles/mdn/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [soya_daizu](https://github.com/soya-daizu) +- [soya-daizu](https://github.com/soya-daizu)   diff --git a/styles/mdn/catppuccin.user.css b/styles/mdn/catppuccin.user.css deleted file mode 100644 index bc38b1e381..0000000000 --- a/styles/mdn/catppuccin.user.css +++ /dev/null @@ -1,262 +0,0 @@ -/* ==UserStyle== -@name MDN Catppuccin -@namespace github.com/catppuccin/userstyles/styles/mdn -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/mdn -@version 0.1.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/mdn/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Amdn -@description Soothing pastel theme for MDN -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -#catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --text-primary: @text; - --text-secondary: @subtext0; - --text-active: @overlay1; - --text-inactive: fadeout(@subtext0, 40%); - --text-link: @accent-color; - --text-visited: lighten(saturate(@accent-color, -20%), -20%); - --text-invert: @base; - --background-primary: @base; - --background-secondary: @crust; - --background-tertiary: @mantle; - --background-toc-active: @crust; - --background-mark-yellow: fadeout(@yellow, 60%); - --background-mark-green: fadeout(@green, 60%); - --background-information: fadeout(@blue, 90%); - --background-warning: fadeout(@maroon, 90%); - --background-critical: fadeout(@red, 90%); - --background-success: fadeout(@green, 90%); - --border-primary: @surface2; - --border-secondary: @surface1; - --button-primary-default: @text; - --button-primary-hover: @subtext0; - --button-primary-active: @overlay0; - --button-primary-inactive: @text; - --button-secondary-default: @surface2; - --button-secondary-hover: @surface1; - --button-secondary-active: @overlay0; - --button-secondary-inactive: @surface2; - --button-secondary-border-focus: @blue; - --button-secondary-border-red: @red; - --button-secondary-border-red-focus: @maroon; - --icon-primary: @text; - --icon-secondary: @subtext0; - --icon-information: @blue; - --icon-warning: @peach; - --icon-critical: @maroon; - --icon-success: @green; - --accent-primary: @accent-color; - --accent-primary-engage: fadeout(@accent-color, 90%); - --accent-secondary: @accent-color; - --accent-tertiary: fadeout(saturate(@accent-color, 10%), 90%); - --shadow-01: 0 1px 2px fadeout(@text, 80%); - --shadow-02: 0 1px 6px fadeout(@text, 80%); - --focus-01: 0 0 0 3px fadeout(@text, 50%); - --field-focus-border: @text; - --code-token-tag: @mauve; - --code-token-punctuation: @overlay2; - --code-token-attribute-name: @blue; - --code-token-attribute-value: @peach; - --code-token-comment: @overlay0; - --code-token-default: @text; - --code-token-selector: @lavender; - --code-token-class-selector: @yellow; - --code-token-pseudo-class: @pink; - --code-token-variable-2: @rosewater; - --code-token-at-rule: @flamingo; - --code-token-meta: @overlay1; - --code-background-inline: @mantle; - --code-background-block: @mantle; - --notecard-link-color: @subtext1; - --scrollbar-bg: transparent; - --scrollbar-color: hsla(0, 0%, 100%, 0.25); - --category-color: @sky; - --category-color-background: fadeout(@sky, 60%); - --code-color: lighten(@sky, 10%); - --mark-color: darken(@sky, 30%); - --plus-accent-color: @maroon; - --html-accent-color: @red; - --css-accent-color: @sapphire; - --js-accent-color: @yellow; - --http-accent-color: @green; - --apis-accent-color: @mauve; - --learn-accent-color: @pink; - --plus-code-color: saturate(@maroon, 10%); - --html-code-color: saturate(@red, 10%); - --css-code-color: saturate(@sapphire, 10%); - --js-code-color: saturate(@yellow, 10%); - --http-code-color: saturate(@green, 10%); - --apis-code-color: saturate(@mauve, 10%); - --learn-code-color: saturate(@pink, 10%); - --plus-mark-color: darken(@maroon, 30%); - --html-mark-color: darken(@red, 30%); - --css-mark-color: darken(@sapphire, 30%); - --js-mark-color: darken(@yellow, 30%); - --http-mark-color: darken(@green, 30%); - --apis-mark-color: darken(@mauve, 30%); - --learn-mark-color: darken(@pink, 30%); - --plus-accent-background-color: fadeout(@maroon, 70%); - --html-accent-background-color: fadeout(@red, 70%); - --css-accent-background-color: fadeout(@sapphire, 70%); - --js-accent-background-color: fadeout(@yellow, 70%); - --http-accent-background-color: fadeout(@green, 70%); - --apis-accent-background-color: fadeout(@mauve, 70%); - --learn-accent-background-color: fadeout(@pink, 70%); - --plus-accent-engage: fadeout(@maroon, 30%); - --html-accent-engage: fadeout(@red, 30%); - --css-accent-engage: fadeout(@sapphire, 30%); - --js-accent-engage: fadeout(@yellow, 30%); - --http-accent-engage: fadeout(@green, 30%); - --apis-accent-engage: fadeout(@mauve, 30%); - --learn-accent-engage: fadeout(@pink, 30%); - --modal-backdrop-color: fadeout(@mantle, 30%); - --selection-background-color: fadeout(@surface2, 40%); - --text-primary-red: @red; - --text-primary-green: @green; - --text-primary-blue: @blue; - --text-primary-yellow: @yellow; - --collections-link: @flamingo; - --collections-header: darken(@red, 30%); - --collections-mandala: darken(@red, 20%); - --collections-icon: darken(@red, 10%); - --updates-link: @sky; - --updates-header: @crust; - --updates-mandala: lighten(@sky, 10%); - --updates-icon: @sky; - --ai-help-link: @green; - --ai-help-header: @crust; - --ai-help-mandala: lighten(@green, 10%); - --ai-help-icon: @green; - --form-limit-color: @overlay0; - --form-limit-color-emphasis: @overlay1; - --form-invalid-color: @red; - --form-invalid-focus-color: @flamingo; - --form-invalid-focus-effect-color: fadeout(@flamingo, 80%); - --baseline-high-bg: hsl( - hue(@green), - saturation(@green), - lightness(@surface0) - ); - --baseline-high-engine-bg: hsl( - hue(@green), - saturation(@green), - lightness(@base) - ); - --baseline-high-check: @green; - --baseline-low-bg: hsl(hue(@blue), saturation(@blue), lightness(@surface0)); - --baseline-low-engine-bg: hsl( - hue(@blue), - saturation(@blue), - lightness(@base) - ); - --baseline-low-check: @blue; - --baseline-low-pill-bg: @sapphire; - --baseline-low-pill-color: @base; - --baseline-limited-bg: @surface0; - --baseline-limited-engine-bg: @base; - --baseline-limited-check: @green; - --baseline-limited-cross: @peach; -} - -@-moz-document domain("developer.mozilla.org") { - .light { - #catppuccin(@lightFlavor, @accentColor); - } - - .dark { - #catppuccin(@darkFlavor, @accentColor); - } - - /* stylelint-disable selector-not-notation */ - @media (prefers-color-scheme: light) { - :root:not(.light):not(.dark) { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - :root:not(.light):not(.dark) { - #catppuccin(@darkFlavor, @accentColor); - } - } - /* stylelint-enable selector-not-notation */ -} - -@-moz-document domain("interactive-examples.mdn.mozilla.net") { - .theme-light { - #catppuccin(@lightFlavor, @accentColor); - } - .theme-dark { - #catppuccin(@darkFlavor, @accentColor); - } - - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/mdn/catppuccin.user.less b/styles/mdn/catppuccin.user.less new file mode 100644 index 0000000000..5f305c499d --- /dev/null +++ b/styles/mdn/catppuccin.user.less @@ -0,0 +1,151 @@ +/* ==UserStyle== +@name MDN Catppuccin +@namespace github.com/catppuccin/userstyles/styles/mdn +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/mdn +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/mdn/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Amdn +@description Soothing pastel theme for MDN +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +#catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --color-text-primary: @text; + --color-text-secondary: @subtext0; + --color-background-page: @base; + --color-background-primary: @mantle; + --color-background-secondary: @surface0; + --color-link-normal: @blue; + --color-link-visited: @mauve; + --color-border-primary: @surface1; + --color-border-secondary: @overlay2; // used for icons + --color-border-active: @accent; + --color-area-background: fade(@accent, 25%); + --color-area-highlight-border: @accent; + --color-area-link: @accent; + --color-background-red: fade(@red, 25%); + --color-background-orange: fade(@peach, 25%); + --color-background-yellow: fade(@yellow, 25%); + --color-background-green: fade(@green, 25%); + --color-background-blue: fade(@blue, 25%); + --color-background-purple: fade(@mauve, 25%); + --color-white: @text; + --color-white-alpha-25: fade(@text, 25%); + --color-white-alpha-75: fade(@text, 75%); + --color-black: @crust; + --color-black-alpha-25: fade(@crust, 25%); + --color-black-alpha-75: fade(@crust, 75%); + + --color-gray-90: hsl(hue(@base), saturation(@base), 90%); + --color-gray-80: hsl(hue(@base), saturation(@base), 80%); + --color-gray-60: hsl(hue(@base), saturation(@base), 60%); + --color-gray-40: hsl(hue(@base), saturation(@base), 40%); + --color-gray-20: hsl(hue(@base), saturation(@base), 20%); + --color-gray-10: hsl(hue(@base), saturation(@base), 10%); + --color-gray-05: hsl(hue(@base), saturation(@base), 5%); + #__color-scale(@id, @color) { + --color-@{id}-90: hsl(hue(@color), saturation(@color), 90%); + --color-@{id}-80: hsl(hue(@color), saturation(@color), 80%); + --color-@{id}-50: hsl(hue(@color), saturation(@color), 50%); + --color-@{id}-20: hsl(hue(@color), saturation(@color), 20%); + --color-@{id}-10: hsl(hue(@color), saturation(@color), 10%); + } + #__color-scale(red, @red); + #__color-scale(orange, @peach); + #__color-scale(yellow, @yellow); + #__color-scale(green, @green); + #__color-scale(blue, @blue); + #__color-scale(purple, @mauve); + + .baseline-indicator { + --baseline-bg: @surface0; + --baseline-engine-bg: @base; + --baseline-check: @green; + --baseline-cross: @peach; + + @darker: fade(@peach, 20%); + @svg: escape( + '' + ); + --baseline-img: url("data:image/svg+xml,@{svg}"); + + &.high { + --baseline-bg: fade(@green, 20%); + --baseline-engine-bg: fade(@green, 20%); + --baseline-check: @green; + + @darker: fade(@green, 20%); + @svg: escape( + '' + ); + --baseline-img: url("data:image/svg+xml,@{svg}"); + } + + &.low { + --baseline-bg: fade(@blue, 20%); + --baseline-engine-bg: fade(@blue, 20%); + --baseline-check: @blue; + --baseline-pill-bg: @blue; + --baseline-pill-color: @base; + + @darker: fade(@blue, 20%); + @svg: escape( + '' + ); + --baseline-img: url("data:image/svg+xml,@{svg}"); + } + } +} + +@-moz-document domain("developer.mozilla.org") { + @import url("https://prismjs.catppuccin.com/variables.important.css"); + + .light { + #catppuccin(@lightFlavor); + } + + .dark { + #catppuccin(@darkFlavor); + } + + /* stylelint-disable selector-not-notation */ + :root:not(.light):not(.dark) { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + /* stylelint-enable selector-not-notation */ +} + +@-moz-document domain("interactive-examples.mdn.mozilla.net") { + .theme-light { + #catppuccin(@lightFlavor); + } + .theme-dark { + #catppuccin(@darkFlavor); + } + + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } +} diff --git a/styles/mdn/preview.webp b/styles/mdn/preview.webp deleted file mode 100644 index 87a4500453..0000000000 --- a/styles/mdn/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:f864c0c759e65e46e1aeed6fa5e941019886292b5ed004997a4754ce99014222 -size 61668 diff --git a/styles/microsoft-word/README.md b/styles/microsoft-word/README.md index 37b1429bee..923e100fac 100644 --- a/styles/microsoft-word/README.md +++ b/styles/microsoft-word/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer -- [GitMuslim](https://github.com/GitMuslim) +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find!   diff --git a/styles/microsoft-word/catppuccin.user.css b/styles/microsoft-word/catppuccin.user.less similarity index 69% rename from styles/microsoft-word/catppuccin.user.css rename to styles/microsoft-word/catppuccin.user.less index 164f04b8ec..abc42f7e5b 100644 --- a/styles/microsoft-word/catppuccin.user.css +++ b/styles/microsoft-word/catppuccin.user.less @@ -2,8 +2,8 @@ @name Microsoft Word Catppuccin @namespace github.com/catppuccin/userstyles/styles/microsoft-word @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/microsoft-word -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/microsoft-word/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/microsoft-word/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Amicrosoft-word @description Soothing pastel theme for Microsoft Word @author Catppuccin @@ -13,56 +13,28 @@ @var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] @var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] + +@var checkbox applyToDocument "Apply Theme to Document" 0 ==/UserStyle== */ -@-moz-document domain('live.com') { - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("live.com") { + #catppuccin(@lightFlavor); + + .UxDarkMode { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); .fui-FluentProvider2, .fui-FluentProvider86, .fui-FluentProvider102 { --colorNeutralStroke1: @surface1; - --colorBrandForeground1: @accent-color; + --colorBrandForeground1: @accent; --colorNeutralForeground1: @text; --colorNeutralBackground1: @surface0; --colorNeutralForeground2: @text; @@ -116,7 +88,7 @@ } #ShareMenu { - background-color: @accent-color; + background-color: @accent; color: @base; } @@ -172,9 +144,16 @@ background-color: @mantle !important; } - .Page { - background-color: @base !important; - border-color: @surface1 !important; + & when (@applyToDocument = 1) { + .Page { + background-color: @base !important; + border-color: @surface1 !important; + } + span.NormalTextRun, + .FileMenuButtonPrimaryText, + [class="NewDocumentTemplateLabel"] { + color: @text !important; + } } .Paragraph, @@ -216,7 +195,7 @@ > div:nth-child(2) > div:nth-child(1) { > div:nth-child(1) > span:nth-child(1) { - background: @accent-color !important; + background: @accent !important; } } div:nth-child(1) { @@ -252,7 +231,7 @@ > div:nth-child(2) { background-color: @surface2 !important; > div:nth-child(1) { - background: @accent-color; + background: @accent; } } } @@ -262,7 +241,7 @@ color: @text; } > span:nth-child(2) { - color: @accent-color; + color: @accent; } > span:nth-child(3) { color: @text; @@ -282,20 +261,20 @@ } } > a:nth-child(2) { - color: @accent-color; + color: @accent; } } #allAppsLink { - color: @accent-color; + color: @accent; } #ProgressCardScore { > div:nth-child(1) { - color: @accent-color; + color: @accent; } > div:nth-child(2) { - color: @accent-color; + color: @accent; } } @@ -374,12 +353,6 @@ color: @subtext0 !important; } - span.NormalTextRun, - .FileMenuButtonPrimaryText, - [class="NewDocumentTemplateLabel"] { - color: @text !important; - } - svg { path.OfficeIconColors_m22 { fill: @text; @@ -388,7 +361,7 @@ path.OfficeIconColors_m25, path.OfficeIconColors_m26, path.OfficeIconColors_m2262 { - fill: @accent-color; + fill: @accent; } path.OfficeIconColors_m27 { fill: @green; @@ -423,19 +396,4 @@ } } } - - .UxDarkMode { - #catppuccin(@darkFlavor, @accentColor); - } - #catppuccin(@lightFlavor, @accentColor); } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/microsoft-word/preview.webp b/styles/microsoft-word/preview.webp deleted file mode 100644 index ba728a1f63..0000000000 --- a/styles/microsoft-word/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:8eeb87979f8ddc8a69bc1d31da5b57262ea065760e9d9798abf350bc5180d568 -size 44740 diff --git a/styles/migadu-webmail/README.md b/styles/migadu-webmail/README.md index 94785d592b..616d47d557 100644 --- a/styles/migadu-webmail/README.md +++ b/styles/migadu-webmail/README.md @@ -4,24 +4,21 @@

Logo
- Catppuccin for Migadu Webmail + Catppuccin for Migadu Webmail

- -

- -

- +

## Usage -> [!NOTE] -> Set Migadu Webmail's built-in theme to 'Migadu' for the optimal experience. +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). +> [!NOTE] +> Set Migadu Webmail's built-in theme to 'Migadu' for the optimal experience. ## ๐Ÿ’ Current Maintainer - [uncenter](https://github.com/uncenter) diff --git a/styles/migadu-webmail/catppuccin.user.css b/styles/migadu-webmail/catppuccin.user.less similarity index 71% rename from styles/migadu-webmail/catppuccin.user.css rename to styles/migadu-webmail/catppuccin.user.less index 0eed76af81..56bcb6affc 100644 --- a/styles/migadu-webmail/catppuccin.user.css +++ b/styles/migadu-webmail/catppuccin.user.less @@ -2,8 +2,8 @@ @name Migadu Webmail Catppuccin @namespace github.com/catppuccin/userstyles/styles/migadu-webmail @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/migadu-webmail -@version 0.0.10 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/migadu-webmail/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/migadu-webmail/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Amigadu-webmail @description Soothing pastel theme for Migadu Webmail @author Catppuccin @@ -17,62 +17,24 @@ @var checkbox hideProfilePictures "Hide Profile Pictures" 0 ==/UserStyle== */ -@-moz-document domain('webmail.migadu.com') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("webmail.migadu.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); @orange: mix(@peach, @yellow); - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - --main-color: @text; --main-bg-color: @base; --border-color: @surface0; @@ -80,7 +42,7 @@ --dropdown-menu-bg-color: @base; --dropdown-menu-hover-bg-color: @surface1; --dropdown-menu-hover-color: @text; - --dropdown-menu-disable-color: @overlay0; + --dropdown-menu-disabled-color: @subtext0; --dropdown-menu-border-clr: @surface0; --folders-color: @text; --folders-disabled-color: @surface2; @@ -428,19 +390,20 @@ .messageListItem { &.focused { border-left-color: @surface2; + background-color: @surface0; } &.checked { - border-left-color: lighten(@accent-color, 10%); + border-left-color: lighten(@accent, 10%); } &.checked.focused, &.selected { - border-left-color: @accent-color; + border-left-color: @accent; } &.selected { - background-color: fade(@accent-color, 30%); + background-color: fade(@accent, 30%); } } @@ -483,13 +446,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/migadu-webmail/preview.webp b/styles/migadu-webmail/preview.webp deleted file mode 100644 index 5a9c1666ce..0000000000 --- a/styles/migadu-webmail/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:844c808f9d5962b8b57d3fa490665b1283cab37ea7f7969c9b0362afad64b831 -size 228386 diff --git a/styles/minesweeper/README.md b/styles/minesweeper/README.md index f0f048ef90..990e51679c 100644 --- a/styles/minesweeper/README.md +++ b/styles/minesweeper/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer -- [GitMuslim](https://github.com/GitMuslim) +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find!   diff --git a/styles/minesweeper/catppuccin.user.css b/styles/minesweeper/catppuccin.user.less similarity index 82% rename from styles/minesweeper/catppuccin.user.css rename to styles/minesweeper/catppuccin.user.less index 0edc68ba3a..0b61e89f39 100644 --- a/styles/minesweeper/catppuccin.user.css +++ b/styles/minesweeper/catppuccin.user.less @@ -2,8 +2,8 @@ @name Minesweeper Online Catppuccin @namespace github.com/catppuccin/userstyles/styles/minesweeper @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/minesweeper -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/minesweeper/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/minesweeper/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aminesweeper @description Soothing pastel theme for Minesweeper Online @author Catppuccin @@ -15,59 +15,21 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('minesweeper.online') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("minesweeper.online") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); --b0: @crust; --b1: @base; @@ -137,13 +99,13 @@ a.homepage-level.active, a.homepage-level:focus, a.homepage-level:hover { - border-color: @accent-color; + border-color: @accent; } a, a:hover, .text-primary { - color: @accent-color; + color: @accent; } .text-success, @@ -291,8 +253,8 @@ .btn-primary:hover, .btn-primary:active:hover, .btn-primary:active { - border-color: @accent-color; - background-color: @accent-color; + border-color: @accent; + background-color: @accent; color: @mantle; } @@ -388,7 +350,7 @@ .pagination > li > span { background-color: @mantle; border-color: @surface0 !important; - color: @accent-color; + color: @accent; } .pagination > .disabled > a { @@ -399,7 +361,7 @@ .pagination > li > a:hover { background-color: @base; - color: @accent-color; + color: @accent; } .pagination-sm > li:first-child > a, @@ -411,7 +373,7 @@ .pagination > .active > a, .pagination > .active > a:hover { - background-color: @accent-color; + background-color: @accent; color: @mantle; } @@ -500,13 +462,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/minesweeper/preview.webp b/styles/minesweeper/preview.webp deleted file mode 100644 index 8b46937c43..0000000000 --- a/styles/minesweeper/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:534b2439619cfc0bef3eacaa32f191c2a60ed03370c0cc895aab7c43f063c4d2 -size 154088 diff --git a/styles/modrinth/README.md b/styles/modrinth/README.md index 45c7bfb9de..2966ae1911 100644 --- a/styles/modrinth/README.md +++ b/styles/modrinth/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/modrinth/catppuccin.user.css b/styles/modrinth/catppuccin.user.css deleted file mode 100644 index 5798cdbf52..0000000000 --- a/styles/modrinth/catppuccin.user.css +++ /dev/null @@ -1,179 +0,0 @@ -/* ==UserStyle== -@name Modrinth Catppuccin -@namespace github.com/catppuccin/userstyles/styles/modrinth -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/modrinth -@version 1.2.8 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/modrinth/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Amodrinth -@description Soothing pastel theme for Modrinth -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("modrinth.com") { - .light-mode { - #catppuccin(@lightFlavor, @accentColor); - } - - .dark-mode, - .oled-mode { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @shadow: if(@lookup = latte, #dbdfef, #010409); - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - * { - --text-color: @text; - --color-base: @text; - --color-bg: @crust; - --color-ad-raised: @surface2; - --color-ad: @surface1; - --color-ad-highlight: @teal; - --color-brand: @accent-color; - --color-brand-green: @green; - --color-button-bg-active: @overlay0; - --color-button-bg-hover: @surface1; - --color-button-bg: @surface0; - --color-button-text-hover: @text; - --color-button-text: @subtext1; - --color-button-text-active: @text; - --color-divider: @surface0; - --color-heading: @text; - --color-icon: @text; - --color-link-active: @teal; - --color-link-hover: @sky; - --color-link: @sapphire; - --color-raised-bg: @base; - --color-blue: @sapphire; - --color-special-blue: @sapphire; - --color-orange: @peach; - --color-special-orange: @peach; - --color-purple: @mauve; - --color-special-purple: @mauve; - --color-red: @red; - --color-gray: @subtext0; - --color-special-gray: @subtext0; - --color-green: @green; - --color-text: @subtext1; - --color-text-dark: @text; - --color-text-inactive: @overlay1; - --color-brand-highlight: @surface0; - --color-brand-inverted: @shadow; - --color-table-alternate-row: @crust; - --color-table-border: @overlay0; - --color-contrast: @text; - --color-accent-contrast: @mantle; - --color-brand-shadow: @accent-color; - --color-warning-banner-side: @red; - --color-warning-banner-bg: fade(@red, 10%); - --color-warning-banner-text: @text; - --landing-green-label: @accent-color; - --landing-green-label-bg: fade(@accent-color, 10%); - --landing-blue-label: @blue; - --landing-blue-label-bg: fade(@blue, 10%); - --color-platform-fabric: @pink; - --color-platform-quilt: @mauve; - --color-platform-forge: @blue; - --color-platform-neoforge: @peach; - --color-platform-liteloader: @sky; - --color-platform-bukkit: @peach; - --color-platform-bungeecord: @yellow; - --color-platform-folia: @green; - --color-platform-paper: @red; - --color-platform-purpur: @lavender; - --color-platform-spigot: @yellow; - --color-platform-velocity: @teal; - --color-platform-waterfall: @blue; - --color-platform-sponge: @yellow; - --color-button-border: fade(@crust, 20%); - } - // homepage - .blob-demonstration, - .blob-demonstration::after { - background: linear-gradient( - 0deg, - fade(@accent-color, 20%), - fade(@base, 10%) - ) !important; - } - .logo-banner path { - fill: @accent-color !important; - } - .logo-banner > svg > g > rect { - display: none; - } - - [tabindex="0"]:focus-visible, - a:focus-visible, - button:focus-visible { - outline-color: @accent-color; - } - - .BDVE3s9MFQttmbMUeYup-2 a b, - .BDVE3s9MFQttmbMUeYup-2 a strong { - color: @accent-color; - } - - // dropdown icon - .multiselect__select::before { - border-color: @text transparent transparent; - color: @text; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/modrinth/catppuccin.user.less b/styles/modrinth/catppuccin.user.less new file mode 100644 index 0000000000..acd34a1ff0 --- /dev/null +++ b/styles/modrinth/catppuccin.user.less @@ -0,0 +1,200 @@ +/* ==UserStyle== +@name Modrinth Catppuccin +@namespace github.com/catppuccin/userstyles/styles/modrinth +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/modrinth +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/modrinth/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Amodrinth +@description Soothing pastel theme for Modrinth +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("modrinth.com") { + .light, + .light-mode, + .light-properties, + html { + #catppuccin(@lightFlavor); + } + + .dark, + .dark-mode, + .oled-mode, + :root[data-theme="dark"] { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + // TODO: Use Catppuccin palette colors? `fade()`-ed? + @shadow: if(@flavor = latte, #dbdfef, #010409); + + #css-variables() !important; + + // homepage + .blob-demonstration, + .blob-demonstration::after { + background: linear-gradient( + 0deg, + fade(@accent, 20%), + fade(@base, 10%) + ) !important; + } + .logo-banner path { + fill: @accent !important; + } + .logo-banner > svg > g > rect { + display: none; + } + + [tabindex="0"]:focus-visible, + a:focus-visible, + button:focus-visible { + outline-color: @accent; + } + + .BDVE3s9MFQttmbMUeYup-2 a b, + .BDVE3s9MFQttmbMUeYup-2 a strong { + color: @accent; + } + + // dropdown icon + .multiselect__select::before { + border-color: @text transparent transparent; + color: @text; + } + // header button hover + .btn-wrapper:hover { + a, + button { + --tw-brightness: none !important; + } + } + .nuxt-loading-indicator { + background: @accent !important; + } + + #css-variables() { + --text-color: @text; + --color-base: @text; + --color-bg: @crust; + --color-secondary: @subtext0; + --color-ad-raised: @surface2; + --color-ad: @surface1; + --color-ad-highlight: @teal; + --color-brand: @accent; + --color-brand-green: @green; + --color-button-bg-active: @overlay0; + --color-button-bg-selected: fade(@accent, 25%); + --color-button-bg-hover: @surface1; + --color-button-bg: @surface0; + --color-button-text-hover: @text; + --color-button-text: @subtext1; + --color-button-text-active: @text; + --color-button-text-selected: @accent; + --color-divider: @surface0; + --color-divider-dark: @surface2; + --color-heading: @text; + --color-icon: @text; + --color-link-active: @sapphire; + --color-link-hover: @sky; + --color-link: @blue; + --color-raised-bg: @base; + --color-blue: @sapphire; + --color-special-blue: @sapphire; + --color-orange: @peach; + --color-special-orange: @peach; + --color-purple: @mauve; + --color-special-purple: @mauve; + --color-red: @red; + --color-gray: @subtext0; + --color-special-gray: @subtext0; + --color-green: @green; + --color-text: @subtext1; + --color-text-dark: @text; + --color-text-inactive: @overlay1; + --color-brand-highlight: fade(@accent, 25%); + --color-brand-inverted: @shadow; + --color-table-alternate-row: @crust; + --color-table-border: @overlay0; + --color-contrast: @text; + --color-accent-contrast: @mantle; + --color-red-highlight: fade(@red, 25%); + --color-orange-highlight: fade(@peach, 25%); + --color-green-highlight: fade(@accent, 25%); + --color-blue-highlight: fade(@blue, 25%); + --color-purple-highlight: fade(@mauve, 25%); + --color-gray-highlight: fade(@text, 25%); + --color-red-bg: fade(@red, 20%); + --color-orange-bg: fade(@peach, 25%); + --color-green-bg: fade(@accent, 25%); + --color-blue-bg: fade(@blue, 25%); + --color-purple-bg: fade(@mauve, 25%); + --color-brand-shadow: @accent; + --color-warning-banner-side: @red; + --color-warning-banner-bg: fade(@red, 25%); + --color-warning-banner-text: @text; + --color-platform-fabric: @rosewater; + --color-platform-quilt: @mauve; + --color-platform-forge: @lavender; + --color-platform-neoforge: @peach; + --color-platform-liteloader: @sky; + --color-platform-bukkit: @peach; + --color-platform-bungeecord: @yellow; + --color-platform-folia: @green; + --color-platform-paper: @red; + --color-platform-purpur: @mauve; + --color-platform-spigot: @yellow; + --color-platform-velocity: @teal; + --color-platform-waterfall: @blue; + --color-platform-sponge: @yellow; + --color-platform-ornithe: @teal; + --color-platform-bta-babric: @green; + --color-platform-legacy-fabric: @lavender; + --color-platform-nilloader: @pink; + --color-button-border: fade(@crust, 20%); + --color-tooltip-bg: @surface1; + --color-tooltip-text: @subtext1; + --landing-green-label: @accent; + --landing-green-label-bg: fade(@accent, 10%); + --landing-blue-label: @blue; + --landing-color-heading: @text; + --landing-color-subheading: @subtext0; + --landing-border-color: @overlay0; + --landing-blue-label-bg: fade(@blue, 10%); + --landing-border-gradient: linear-gradient( + to bottom right, + @overlay0, + @surface2 + ); + --brand-gradient-strong-bg: linear-gradient( + 270deg, + fade(@accent, 5%) 10%, + fade(@accent, 15%) + ); + --brand-gradient-border: fade(@accent, 10%); + + --surface-1: @crust; + --surface-1-5: mix(@crust, @mantle, 50%); + --surface-2: @mantle; + --surface-2-5: mix(@mantle, @base, 50%); + --surface-3: @base; + --surface-4: @surface0; + --surface-5: @surface2; + + --color-text-primary: @text; + --color-text-default: @subtext1; + --color-text-tertiary: @subtext0; + } + } +} diff --git a/styles/modrinth/preview.webp b/styles/modrinth/preview.webp deleted file mode 100644 index 9257541ca0..0000000000 --- a/styles/modrinth/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:090036bcb9228979d29b51cb1f3b1f9a189515e4fe07ae607977f2a614e4ab48 -size 199984 diff --git a/styles/namemc/README.md b/styles/namemc/README.md index 1162248a16..abd238c17f 100644 --- a/styles/namemc/README.md +++ b/styles/namemc/README.md @@ -4,23 +4,22 @@

Logo
- Catppuccin for NameMC + Catppuccin for NameMC

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Natalie Raine](https://github.com/Nyatalieeee) +- [Meowcelinee](https://github.com/Meowcelinee)   diff --git a/styles/namemc/catppuccin.user.css b/styles/namemc/catppuccin.user.less similarity index 66% rename from styles/namemc/catppuccin.user.css rename to styles/namemc/catppuccin.user.less index 3c1eff6d77..0d845d672b 100644 --- a/styles/namemc/catppuccin.user.css +++ b/styles/namemc/catppuccin.user.less @@ -2,8 +2,8 @@ @name NameMC Catppuccin @namespace github.com/catppuccin/userstyles/styles/namemc @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/namemc -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/namemc/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/namemc/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anamemc @description Soothing pastel theme for NameMC @author Catppuccin @@ -15,55 +15,19 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('namemc.com') { +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("namemc.com") { :root[data-bs-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } :root[data-bs-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); #bsButton(@col, @bgCol) { --bs-btn-color: @col; @@ -95,16 +59,12 @@ --bs-btn-active-color: @hover; } - #rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); - } - --bs-body-color: @text; - --bs-body-color-rgb: #rgbify(@text) []; + --bs-body-color-rgb: #lib.rgbify(@text)[]; --bs-body-bg: @base; - --bs-body-bg-rgb: #rgbify(@base) []; + --bs-body-bg-rgb: #lib.rgbify(@base)[]; --bs-emphasis-color: @text; - --bs-emphasis-color-rgb: #rgbify(@text) []; + --bs-emphasis-color-rgb: #lib.rgbify(@text)[]; --bs-blue: @blue; --bs-indigo: @mauve; --bs-purple: @mauve; @@ -116,29 +76,29 @@ --bs-teal: @teal; --bs-cyan: @sapphire; --bs-secondary-color: @subtext0; - --bs-secondary-color-rgb: #rgbify(@subtext0) []; + --bs-secondary-color-rgb: #lib.rgbify(@subtext0)[]; --bs-tertiary-color: @subtext1; - --bs-tertiary-color-rgb: #rgbify(@subtext1) []; + --bs-tertiary-color-rgb: #lib.rgbify(@subtext1)[]; --bs-tertiary-bg: @base; - --bs-tertiary-bg-rgb: #rgbify(@base) []; + --bs-tertiary-bg-rgb: #lib.rgbify(@base)[]; --bs-secondary-text-emphasis: @subtext0; --bs-success-text-emphasis: @green; - --bs-primary: @accent-color; - --bs-primary-rgb: #rgbify(@accent-color) []; + --bs-primary: @accent; + --bs-primary-rgb: #lib.rgbify(@accent)[]; --bs-secondary: @subtext0; - --bs-secondary-rgb: #rgbify(@subtext0) []; + --bs-secondary-rgb: #lib.rgbify(@subtext0)[]; --bs-success: @green; - --bs-success-rgb: #rgbify(@green) []; + --bs-success-rgb: #lib.rgbify(@green)[]; --bs-info: @sky; - --bs-info-rgb: #rgbify(@sky) []; + --bs-info-rgb: #lib.rgbify(@sky)[]; --bs-warning: @yellow; - --bs-warning-rgb: #rgbify(@yellow) []; + --bs-warning-rgb: #lib.rgbify(@yellow)[]; --bs-danger: @red; - --bs-danger-rgb: #rgbify(@red) []; + --bs-danger-rgb: #lib.rgbify(@red)[]; --bs-light: @base; - --bs-light-rgb: #rgbify(@base) []; + --bs-light-rgb: #lib.rgbify(@base)[]; --bs-dark: @text; - --bs-dark-rgb: #rgbify(@text) []; + --bs-dark-rgb: #lib.rgbify(@text)[]; --bs-dark-text-emphasis: @text; --bs-primary-bg-subtle: @crust; --bs-secondary-bg-subtle: @mantle; @@ -150,18 +110,18 @@ --bs-info-border-subtle: @sky; --bs-warning-border-subtle: @yellow; --bs-danger-border-subtle: @red; - --bs-link-color: @accent-color; - --bs-link-color-rgb: #rgbify(@accent-color) []; - --bs-code-color: @accent-color; + --bs-link-color: @accent; + --bs-link-color-rgb: #lib.rgbify(@accent)[]; + --bs-code-color: @accent; --bs-highlight-bg: @base; --bs-form-valid-color: @green; - --bs-focus-ring-color: @accent-color; + --bs-focus-ring-color: @accent; --bs-form-valid-border-color: @green; --bs-form-invalid-color: @red; --bs-form-invalid-border-color: @red; .btn-primary { - #bsButton(@crust, @accent-color); + #bsButton(@crust, @accent); } .btn-secondary { #bsButton(@text, @overlay0); @@ -186,7 +146,7 @@ } .btn-outline-primary { - #bsButtonOutline(@accent-color, @text); + #bsButtonOutline(@accent, @text); } .btn-outline-secondary { #bsButtonOutline(@overlay0, @text); @@ -217,7 +177,7 @@ .btn-link { --bs-btn-disabled-color: @overlay0; --bs-btn-disabled-border-color: transparent; - --bs-btn-focus-shadow-rgb: #rgbify(@blue) []; + --bs-btn-focus-shadow-rgb: #lib.rgbify(@blue)[]; } /* i hate that this is necessary */ @@ -233,7 +193,7 @@ background-color: @surface0 !important; &:focus { - border-color: @accent-color; + border-color: @accent; box-shadow: none; } } @@ -272,12 +232,12 @@ color: @text; &:hover { - color: @accent-color !important; + color: @accent !important; } } strong a { - color: @accent-color !important; + color: @accent !important; } } @@ -297,7 +257,7 @@ color: @text !important; } .nav-link.active { - background-color: @accent-color !important; + background-color: @accent !important; color: @crust !important; } } @@ -308,26 +268,26 @@ color: @text; &.active { - background-color: @accent-color !important; + background-color: @accent !important; } &:focus, &:hover { box-shadow: none !important; - color: @accent-color !important; + color: @accent !important; } } .page-item.active .page-link { - background-color: @accent-color !important; - border-color: @accent-color !important; + background-color: @accent !important; + border-color: @accent !important; color: @crust !important; } /* single skin page */ a.badge, span.badge { - background-color: @accent-color !important; + background-color: @accent !important; color: @crust !important; } @@ -357,8 +317,8 @@ color: @subtext1 !important; &:focus { - border-color: @accent-color !important; - box-shadow: 0 0 0 0.25rem fade(@accent-color, 25%); + border-color: @accent !important; + box-shadow: 0 0 0 0.25rem fade(@accent, 25%); } } @@ -415,7 +375,7 @@ } .card.mb-3 .card-header a { - color: @accent-color !important; + color: @accent !important; } .skin-button-selected { @@ -435,7 +395,7 @@ background-color: @base !important; &:focus { - border-color: @accent-color !important; + border-color: @accent !important; box-shadow: none !important; } } @@ -480,11 +440,11 @@ } } - & when (@lookup = latte) { + & when (@flavor = latte) { --bs-black: @text; - --bs-black-rgb: #rgbify(@text) []; + --bs-black-rgb: #lib.rgbify(@text)[]; --bs-white: @crust; - --bs-white-rgb: #rgbify(@crust) []; + --bs-white-rgb: #lib.rgbify(@crust)[]; --bs-gray: @subtext0; --bs-gray-dark: @text; --bs-gray-100: @base; @@ -497,7 +457,7 @@ --bs-gray-800: @subtext1; --bs-gray-900: @text; --bs-secondary-bg: @mantle; - --bs-secondary-bg-rgb: #rgbify(@mantle) []; + --bs-secondary-bg-rgb: #lib.rgbify(@mantle)[]; --bs-primary-text-emphasis: @text; --bs-info-text-emphasis: @text; --bs-warning-text-emphasis: @text; @@ -509,8 +469,8 @@ --bs-primary-border-subtle: @surface2; --bs-light-border-subtle: @mantle; --bs-dark-border-subtle: @surface2; - --bs-link-hover-color: @accent-color; - --bs-link-hover-color-rgb: #rgbify(@accent-color) []; + --bs-link-hover-color: @accent; + --bs-link-hover-color-rgb: #lib.rgbify(@accent)[]; --bs-border-color: @crust; .mc-black { @@ -528,13 +488,13 @@ } } - & when not (@lookup = latte) { + & when not(@flavor = latte) { --bs-black: @crust; --bs-white: @text; --bs-gray: @overlay2; --bs-gray-dark: @surface2; --bs-secondary-bg: @surface0; - --bs-secondary-bg-rgb: #rgbify(@surface0) []; + --bs-secondary-bg-rgb: #lib.rgbify(@surface0)[]; --bs-primary-text-emphasis: @sapphire; --bs-info-text-emphasis: @sky; --bs-warning-text-emphasis: @yellow; @@ -547,7 +507,7 @@ --bs-light-border-subtle: @surface1; --bs-dark-border-subtle: @surface0; --bs-link-hover-color: @text; - --bs-link-hover-color-rgb: #rgbify(@text) []; + --bs-link-hover-color-rgb: #lib.rgbify(@text)[]; --bs-border-color: @surface1; .mc-black { @@ -566,13 +526,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/namemc/preview.webp b/styles/namemc/preview.webp deleted file mode 100644 index 0d0938d8b6..0000000000 --- a/styles/namemc/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:de54d48818b80a899d313f6663c33aabc6632271df6041f2817c038512f70ccb -size 391456 diff --git a/styles/neovim.io/README.md b/styles/neovim.io/README.md new file mode 100644 index 0000000000..c3352193b9 --- /dev/null +++ b/styles/neovim.io/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for neovim.io + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [comfysage](https://github.com/comfysage) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/neovim.io/catppuccin.user.less b/styles/neovim.io/catppuccin.user.less new file mode 100644 index 0000000000..770b1d278c --- /dev/null +++ b/styles/neovim.io/catppuccin.user.less @@ -0,0 +1,114 @@ +/* ==UserStyle== +@name neovim.io Catppuccin +@namespace github.com/catppuccin/userstyles/styles/neovim.io +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/neovim.io +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/neovim.io/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aneovim.io +@description Soothing pastel theme for neovim.io +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("neovim.io") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); + + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --fg-color: @text; + --inverse-fg-color: @surface0; + --bg-color: @base; + --accent-bg-color: @mantle; + --link-color: @blue; + --accent-color: @accent; + --border-color: @accent; + --code-color: @accent; + + a:not([class]) { + text-decoration-color: var(--link-color); + + &:hover, + &:focus { + color: var(--link-color); + } + } + + a[aria-label="logo"] svg[aria-label="Neovim"] { + path[fill="url(#a)"] { + fill: @blue; + } + + path[fill="url(#b)"], + path[fill="url(#c)"] { + fill: @green; + } + + g[fill="#444"] path { + fill: @blue; + } + } + + --bs-btn-active-color: @base; + + .btn { + color: @base; + background: linear-gradient( + @accent 0% 95%, + darken(@accent, 10%) 95% 100% + ); + + &:hover, + &:focus { + box-shadow: 0 0 10px @accent; + outline-color: @text; + } + } + + // docs + --tag-color: @accent; + + code, + code.hljs, + pre, + samp { + background-color: @mantle !important; + color: @text; + } + + .generator-stats { + color: @subtext0; + } + + --docsearch-container-background: fade(@base, 30%); + --docsearch-modal-background: @mantle; + --docsearch-highlight-color: @accent; + --docsearch-logo-color: @accent; + + .DocSearch-Logo { + .cls-1, + .cls-2 { + fill: var(--docsearch-logo-color); + } + } + } +} diff --git a/styles/nitter/README.md b/styles/nitter/README.md index 85e872a36a..31a4dd46ec 100644 --- a/styles/nitter/README.md +++ b/styles/nitter/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/nitter/catppuccin.user.css b/styles/nitter/catppuccin.user.css deleted file mode 100644 index f6f7616bde..0000000000 --- a/styles/nitter/catppuccin.user.css +++ /dev/null @@ -1,123 +0,0 @@ -/* ==UserStyle== -@name Nitter Catppuccin -@namespace github.com/catppuccin/userstyles/styles/nitter -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/nitter -@version 2.0.6 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/nitter/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anitter -@description Soothing pastel theme for Nitter -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("nitter.net"), domain("nitter.unixfox.eu"), domain("nitter.42l.fr"), domain("nitter.fdn.fr"), domain("nitter.1d4.us"), domain("nitter.kavin.rocks"), domain("nitter.namazso.eu"), domain("nitter.hu"), domain("bird.trom.tf"), domain("nitter.it"), domain("twitter.censors.us"), domain("nitter.grimneko.de"), domain("n.hyperborea.cloud"), domain("nitter.ca"), domain("twitter.076.ne.jp"), domain("nitter.mstdn.social"), domain("nitter.fly.dev"), domain("nitter.weiler.rocks"), domain("nitter.sethforprivacy.com"), domain("nttr.stream"), domain("nitter.tiekoetter.com"), domain("nitter.spaceint.fr"), domain("nitter.privacy.com.denitter.mastodon.pro"), domain("nitter.notraxx.chnitter.poast.org"), domain("nitter.bird.froth.zone"), domain("nitter.dcs0.hu"), domain("twitter.beparanoid.de"), domain("n.ramle.be"), domain("nitter.cz"), domain("nitter.privacydev.net"), domain("tweet.lambda.dance"), domain("nitter.kylrth.com"), domain("nitter.oishi-ra.men"), domain("nitter.foss.wtf"), domain("nitter.priv.pw"), domain("t.com.sb") { - @media (prefers-color-scheme: light) { - body { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - body { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --bg_color: @mantle; - --fg_color: @text; - --fg_faded: @subtext1; - --fg_dark: @accent-color; - --fg_nav: @accent-color; - --bg_panel: @crust; - --bg_elements: @base; - --bg_overlays: @base; - --bg_hover: @crust; - --grey: @subtext1; - --dark_grey: @overlay0; - --darker_grey: @base; - --darkest_grey: @mantle; - --border_grey: @base; - --accent: @accent-color; - --accent_light: lighten(@accent-color, 10%); - --accent_dark: darken(@accent-color, 10%); - --accent_border: darken(@accent-color, 10%); - --play_button: @accent-color; - --play_button_hover: @accent-color; - --more_replies_dots: darken(@accent-color, 10%); - --error_red: @red; - --verified_blue: @blue; - --icon_text: @text; - --tab: @text; - --tab_selected: @accent-color; - --profile_stat: @text; - background-color: var(--bg_color); - color: var(--fg_color); - line-height: 1.3; - margin: 0; - - /* Fix Poll Leader color */ - .poll-meter.leader { - color: var(--bg_color); - } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color) green(@color) blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/nitter/catppuccin.user.less b/styles/nitter/catppuccin.user.less new file mode 100644 index 0000000000..3043945e4c --- /dev/null +++ b/styles/nitter/catppuccin.user.less @@ -0,0 +1,153 @@ +/* ==UserStyle== +@name Nitter Catppuccin +@namespace github.com/catppuccin/userstyles/styles/nitter +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/nitter +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/nitter/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anitter +@description Soothing pastel theme for Nitter +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("nitter.net"), + domain("nitter.unixfox.eu"), + domain("nitter.42l.fr"), + domain("nitter.fdn.fr"), + domain("nitter.1d4.us"), + domain("nitter.kavin.rocks"), + domain("nitter.namazso.eu"), + domain("nitter.hu"), + domain("bird.trom.tf"), + domain("nitter.it"), + domain("twitter.censors.us"), + domain("nitter.grimneko.de"), + domain("n.hyperborea.cloud"), + domain("nitter.ca"), + domain("twitter.076.ne.jp"), + domain("nitter.mstdn.social"), + domain("nitter.fly.dev"), + domain("nitter.weiler.rocks"), + domain("nitter.sethforprivacy.com"), + domain("nttr.stream"), + domain("nitter.tiekoetter.com"), + domain("nitter.spaceint.fr"), + domain("nitter.privacy.com.denitter.mastodon.pro"), + domain("nitter.notraxx.chnitter.poast.org"), + domain("nitter.bird.froth.zone"), + domain("nitter.dcs0.hu"), + domain("twitter.beparanoid.de"), + domain("n.ramle.be"), + domain("nitter.cz"), + domain("nitter.privacydev.net"), + domain("tweet.lambda.dance"), + domain("nitter.kylrth.com"), + domain("nitter.oishi-ra.men"), + domain("nitter.foss.wtf"), + domain("nitter.priv.pw"), + domain("t.com.sb"), + domain("xcancel.com"), + domain("nitter.poast.org") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + --bg_color: @mantle; + --fg_color: @text; + --fg_faded: @subtext1; + --fg_dark: @accent; + --fg_nav: @accent; + --bg_panel: @crust; + --bg_elements: @base; + --bg_overlays: @base; + --bg_hover: @crust; + --grey: @subtext1; + --dark_grey: @overlay0; + --darker_grey: @base; + --darkest_grey: @mantle; + --border_grey: @base; + --accent: @accent; + --accent_light: lighten(@accent, 10%); + --accent_dark: darken(@accent, 10%); + --accent_border: darken(@accent, 10%); + --play_button: @accent; + --play_button_hover: @accent; + --more_replies_dots: darken(@accent, 10%); + --error_red: @red; + --verified_blue: @blue; + --icon_text: @text; + --tab: @text; + --tab_selected: @accent; + --profile_stat: @text; + --verified_government: @subtext0; + --verified_business: @yellow; + background-color: var(--bg_color); + color: var(--fg_color); + line-height: 1.3; + margin: 0; + } + + /* logo */ + img.site-logo { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + /* Fix Poll Leader color */ + .poll-meter.leader { + color: var(--bg_color); + } + + /* xcancel "verifying your request" */ + [style="background-color:#1f1f1f;color:#1f1f1f;font-family:Arial,Helvetica,sans-serif;font-size:100%;"] { + background: @base !important; + h1, + h2, + p, + #status { + color: @accent !important; + } + [style="width:auto;margin:16px auto;border:1px solid #FF6C60;background-color:#1f1f1f;border-radius:3px 3px 3px 3px;padding:10px;"] { + background: @base !important; + border-color: @accent !important; + } + } + + /* error text color contrast */ + .error-panel { + color: @crust; + a { + color: @crust; + text-decoration: underline; + } + } + + /* twitter blue verification checkmark contrast */ + .verified-icon.blue { + color: @crust; + } + } +} + +#rgbify(@color) { + @rgb: red(@color) green(@color) blue(@color); +} diff --git a/styles/nitter/preview.webp b/styles/nitter/preview.webp deleted file mode 100644 index a1ae416ce4..0000000000 --- a/styles/nitter/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:2973a27b2884745b5e7a9a3d329c411cf7ae9d0f04a040342a31e4025b2ec772 -size 303876 diff --git a/styles/nixos-manual/README.md b/styles/nixos-manual/README.md new file mode 100644 index 0000000000..78f5cf3a9d --- /dev/null +++ b/styles/nixos-manual/README.md @@ -0,0 +1,38 @@ + + + +

+ Logo
+ + Catppuccin for NixOS Manual, Nixpkgs Manual + +

+ +

+ + +

+ +## Usage + +> [!IMPORTANT] +> This userstyle also applies to [Nixpkgs Manual](https://nixos.org/manual/nixpkgs). + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [husjon](https://github.com/husjon) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/nixos-manual/catppuccin.user.less b/styles/nixos-manual/catppuccin.user.less new file mode 100644 index 0000000000..9e5ce7d9c6 --- /dev/null +++ b/styles/nixos-manual/catppuccin.user.less @@ -0,0 +1,75 @@ +/* ==UserStyle== +@name NixOS Manual/Nixpkgs Manual Catppuccin +@namespace github.com/catppuccin/userstyles/styles/nixos-manual +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/nixos-manual +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/nixos-manual/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anixos-manual +@description Soothing pastel theme for NixOS Manual and Nixpkgs Manual +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document url-prefix("https://nixos.org/manual/"), + url-prefix("https://nix-darwin.github.io/nix-darwin/manual/") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); + + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --background: @base; + --main-text-color: @text; + --link-color: @accent; + --heading-color: @accent; + --small-heading-color: fade(@accent, 85%); + --note-text-color: @blue; + --note-background: @base; + --warning-text-color: @red; + --warning-background: @base; + --codeblock-background: @surface0; + --codeblock-text-color: @text; + + div.book .programlisting, + div.appendix .programlisting { + background-color: @surface0 !important; + } + + hr, + div.toc { + border-top-color: transparent; + border-bottom-color: @overlay1 !important; + } + + // Version selector + div[style^="background: #333333;color: #FFFFFF;"] { + background-color: @crust !important; + + &, + dt { + color: @text !important; + } + + a { + color: @accent !important; + } + } + } +} diff --git a/styles/nixos-search/README.md b/styles/nixos-search/README.md index d451623b35..a387d6108b 100644 --- a/styles/nixos-search/README.md +++ b/styles/nixos-search/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Sydney Newmark](https://github.com/cecelot) +- [sydrinea](https://github.com/sydrinea)   diff --git a/styles/nixos-search/catppuccin.user.css b/styles/nixos-search/catppuccin.user.css deleted file mode 100644 index b1288d8062..0000000000 --- a/styles/nixos-search/catppuccin.user.css +++ /dev/null @@ -1,123 +0,0 @@ -/* ==UserStyle== -@name NixOS Search Catppuccin -@namespace github.com/catppuccin/userstyles/styles/nixos-search -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/nixos-search -@version 0.4.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/nixos-search/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anixos-search -@description Soothing pastel theme for NixOS Search -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("search.nixos.org") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --background-color: @base; - --badge-background: @accent-color; - --button-active-background: @surface1; - --button-active-hover-background: @surface2; - --button-background: @surface0; - --button-hover-background: @surface2; - --color-active-hover-tab: @surface1; - --color-active-tab: @surface0; - --color-hover-tab: @surface1; - --headerbar-background-color: @mantle; - --hover-background: @surface0; - --link-color: @accent-color; - --info-label-background: @accent-color; - --dark-blue: @accent-color; - --light-blue: @accent-color; // used by focus outline - --line-color: @surface0; - --search-result-short-details-color: @subtext1; - --search-result-divider-line-color: @surface0; - --search-result-title-color: @accent-color; - --search-sidebar-link-color: @text; - --search-sidebar-selected-link-background: @accent-color; - --search-sidebar-selected-link-color: @crust; - --terminal-background: @surface0; - --terminal-color: @red; - --text-color: @text; - --text-color-light: @text; - --text-color-warning: @yellow; - - // hardcoded to #fff - .label, - .badge { - color: @crust; - } - - // hardcoded to #005580 - a:hover, - a:focus { - color: @text; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/nixos-search/catppuccin.user.less b/styles/nixos-search/catppuccin.user.less new file mode 100644 index 0000000000..3b9d56777b --- /dev/null +++ b/styles/nixos-search/catppuccin.user.less @@ -0,0 +1,79 @@ +/* ==UserStyle== +@name NixOS Search Catppuccin +@namespace github.com/catppuccin/userstyles/styles/nixos-search +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/nixos-search +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/nixos-search/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anixos-search +@description Soothing pastel theme for NixOS Search +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("search.nixos.org") { + :root:not([data-theme]) { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + :root[data-theme="dark"] { + #catppuccin(@darkFlavor); + } + + :root[data-theme="light"] { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --background-color: @base; + --badge-background: @surface2; + --button-active-background: @surface1; + --button-active-hover-background: @surface2; + --button-background: @surface0; + --button-hover-background: @surface2; + --color-active-hover-tab: @surface1; + --color-active-tab: @surface0; + --color-hover-tab: @surface1; + --headerbar-background-color: @mantle; + --hover-background: @surface0; + --link-color: @accent; + --info-label-background: @accent; + --dark-blue: @accent; + --light-blue: @accent; // used by focus outline + --line-color: @surface0; + --search-result-short-details-color: @subtext1; + --search-result-divider-line-color: @surface0; + --search-result-title-color: @accent; + --search-sidebar-link-color: @text; + --search-sidebar-selected-link-background: @accent; + --search-sidebar-selected-link-color: @crust; + --terminal-background: @surface0; + --terminal-color: @text; + --text-color: @text; + --text-color-light: @text; + --text-color-warning: @yellow; + + .badge { + color: @text; + } + /* Experimental Flakes label */ + .label { + color: @base; + text-shadow: none; + } + } +} diff --git a/styles/nixos-search/preview.webp b/styles/nixos-search/preview.webp deleted file mode 100644 index 9a195b0a62..0000000000 --- a/styles/nixos-search/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:402ceb2bf5ca2f3334348de25900f931b9c1211e0ed409cb99bcd91b70187818 -size 94340 diff --git a/styles/nixos.wiki/catppuccin.user.css b/styles/nixos.wiki/catppuccin.user.css deleted file mode 100644 index 4ef7b894ef..0000000000 --- a/styles/nixos.wiki/catppuccin.user.css +++ /dev/null @@ -1,377 +0,0 @@ -/* ==UserStyle== -@name NixOS Wiki Catppuccin -@namespace github.com/catppuccin/userstyles/styles/nixos.wiki -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/nixos.wiki -@version 0.0.7 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/nixos.wiki/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anixos.wiki -@description Soothing pastel theme for NixOS Wiki -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('nixos.wiki') { - @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); - - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - --ctp-rosewater: @rosewater; - --ctp-flamingo: @flamingo; - --ctp-pink: @pink; - --ctp-mauve: @mauve; - --ctp-red: @red; - --ctp-maroon: @maroon; - --ctp-peach: @peach; - --ctp-yellow: @yellow; - --ctp-green: @green; - --ctp-teal: @teal; - --ctp-sky: @sky; - --ctp-sapphire: @sapphire; - --ctp-blue: @blue; - --ctp-lavender: @lavender; - --ctp-text: @text; - --ctp-subtext1: @subtext1; - --ctp-subtext0: @subtext0; - --ctp-overlay2: @overlay2; - --ctp-overlay1: @overlay1; - --ctp-overlay0: @overlay0; - --ctp-surface2: @surface2; - --ctp-surface1: @surface1; - --ctp-surface0: @surface0; - --ctp-base: @base; - --ctp-mantle: @mantle; - --ctp-crust: @crust; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - &[data-darkreader-scheme="dark"] body::before { - content: "Please turn off DarkReader for this domain when Catppuccin for NixOS Wiki is active."; - background: @red; - box-shadow: - 0 4px 16px fade(@crust, 10%), - 0 8px 32px fade(@crust, 5%); - color: @crust; - position: fixed; - top: 0; - right: 0; - z-index: 99999; - max-width: 24rem; - padding: 0.75rem; - margin: 0.5rem; - border-radius: 5px; - } - - body { - background-color: @base; - } - hr { - border-color: @surface2; - } - .navbar-default { - color: @text; - background-color: @mantle !important; - background-image: none !important; - border-color: transparent !important; - - .navbar-brand { - color: @blue; - &:hover { - color: @sky; - } - } - - li { - a { - color: @text !important; - &:hover { - color: @subtext0 !important; - } - } - &.nav.open > a, - ul { - background-color: @surface0 !important; - background-image: none !important; - a:hover { - background-color: fade(@surface1, 50%) !important; - background-image: none !important; - } - } - } - .active > a { - color: @crust !important; - &:hover { - color: @base !important; - } - background: @blue !important; - } - } - - .search-query.form-control { - color: @text; - background-color: @surface0; - border-color: @surface0; - } - - * { - color: @text; - } - - a { - color: @blue; - &:hover { - color: @sky; - } - &.new { - color: @red; - &:hover { - color: @maroon; - } - } - } - - .panel { - background-color: @mantle; - border-color: @mantle; - .panel-heading { - color: @text; - background-color: @surface0 !important; - border-bottom-color: @surface2; - img { - & when not (@lookup = latte) { - filter: invert(100%); - } - } - } - } - - .btn-primary { - color: @crust; - background-color: @blue !important; - background-image: none !important; - border-color: @crust !important; - &:hover { - color: @crust !important; - background-color: @sky !important; - background-image: none !important; - } - } - - table { - &, - * { - color: @text; - border-color: @overlay0 !important; - background-color: @mantle; - } - th { - &, - * { - background-color: @surface0 !important; - } - } - } - - blockquote, - cite { - border-left-color: @pink !important; - } - - cite a { - color: @pink; - &:hover { - color: @rosewater; - } - } - - pre, - code { - box-shadow: none !important; - background-color: @mantle; - border-color: @crust; - } - pre { - color: @text; - } - code { - color: @rosewater; - } - - *[style*="background-color: #C1E5FF"] { - color: @text !important; - background-color: fade(@blue, 15%) !important; - border-color: @blue !important; - } - - *[style*="background-color: #FFD0B7"] { - color: @text !important; - background-color: fade(@peach, 15%) !important; - border-color: @peach !important; - } - - *[style*="background: #F6F6F6"] { - color: @text !important; - background-color: fade(@overlay0, 15%) !important; - border-color: @overlay0 !important; - } - - .suggestions { - .suggestions-result { - background-color: @mantle; - &:hover { - background-color: mix(@base, @mantle, 50%); - } - color: @text; - .highlight { - color: @accent-color; - } - } - .suggestions-results { - border-color: @surface0 !important; - } - .suggestions-special { - border-color: @surface0 !important; - background-color: @mantle; - &:hover { - background-color: mix(@accent-color, @mantle, 15%); - } - .special-label { - color: @subtext0; - } - .special-query { - color: @text; - } - } - } - - .toc { - li.active > a { - border-left-color: @accent-color !important; - } - ul.nav a:hover { - background: @accent-color !important; - &, - * { - color: @crust !important; - } - } - } - - .page-header { - border-bottom-color: @overlay2; - } - - #catlinks { - background-color: @mantle; - border-color: @mantle; - } - - #footer { - background-color: @mantle; - } - - .mw-search-profile-tabs { - background-color: @base !important; - border-color: @base !important; - } - - .search-types .current a { - color: @text; - } - - .oo-ui-inputWidget-input { - background-color: @overlay2 !important; - color: @base; - } - - .oo-ui-buttonElement-button { - background-color: @mantle !important; - color: @base !important; - border-color: @mantle !important; - } - - .oo-ui-labelElement-label { - background-color: @mantle !important; - color: @text !important; - } - - .oo-ui-floatableElement-floatable, - .oo-ui-widget:hover { - background-color: @mantle !important; - color: @text !important; - } - - & when (@lookup = latte) { - .oo-ui-inputWidget-input { - background-color: @base !important; - color: @text; - } - .oo-ui-buttonElement-button { - background-color: @mantle !important; - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/nixos.wiki/preview.webp b/styles/nixos.wiki/preview.webp deleted file mode 100644 index 05484d82f8..0000000000 --- a/styles/nixos.wiki/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:037b5d96126d98430235a9581e49e2c6da4ec4a09dbd8364d24f94d4b9ae19be -size 244556 diff --git a/styles/npm/README.md b/styles/npm/README.md index b19020faf6..7eaa3d4603 100644 --- a/styles/npm/README.md +++ b/styles/npm/README.md @@ -4,19 +4,18 @@

Logo
- Catppuccin for npm + Catppuccin for npm

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/npm/catppuccin.user.css b/styles/npm/catppuccin.user.less similarity index 74% rename from styles/npm/catppuccin.user.css rename to styles/npm/catppuccin.user.less index 4645883d2c..8612cf0b5b 100644 --- a/styles/npm/catppuccin.user.css +++ b/styles/npm/catppuccin.user.less @@ -2,8 +2,8 @@ @name npm Catppuccin @namespace github.com/catppuccin/userstyles/styles/npm @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/npm -@version 0.0.9 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/npm/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/npm/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anpm @description Soothing pastel theme for npm @author Catppuccin @@ -15,85 +15,60 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + @-moz-document domain("www.npmjs.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @red-filter: @catppuccin[@@lookup][@red_filter]; - - color-scheme: if(@lookup = latte, light, dark); - accent-color: @accent-color; - - ::selection { - background-color: fade(@accent-color, 30%); - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); input, textarea { background-color: transparent; &:focus { - box-shadow: 0 0 0 2px @accent-color; - } - - &::placeholder { - color: @subtext0 !important; + box-shadow: 0 0 0 2px @accent; } } + // TODO: Should accent-color be set in defaults? + accent-color: @accent; + @npmGradient: linear-gradient(139deg, @peach, @maroon, @red, @pink); --color-fg-default: @text; --color-fg-muted: @subtext1; --color-fg-subtle: @subtext0; --color-fg-on-emphasis: @base; - --color-fg-brand: @red; + --color-fg-brand: @accent; --color-fg-accent: @blue; --color-fg-success: @green; --color-fg-attention: @yellow; --color-fg-danger: @red; --color-border-strong: @surface0; + --header-color: @text; + /* Used on deprecation confirmation page */ + --wombat-red: @maroon; + --wombat-red-hover: @red; + + --search-fg-muted: @subtext1; + --search-border: @surface0; + --search-bg-subtle: @surface0; + &, main { background-color: @base !important; + color: @text; } /* Primary background */ @@ -103,19 +78,16 @@ } /* Background layer background */ + .bg-black-05, ._7eb68a55, .e9998f88 { background-color: @mantle; } /* Primary text */ - ._99e3854f, .black, .black-90, .black-80, - ._0b9b6c57, - ._1b8c0a9f, - p, a { color: @text; } @@ -123,12 +95,10 @@ /* Secondary text */ .black-70, .black-60, - .cd2827bb a { + .dim:focus, + .dim:hover { color: @subtext0; } - ._66c2abad { - color: @overlay0; - } /* Inverse text */ .white { @@ -145,7 +115,7 @@ /* Top loading bar */ div.fixed.top-0.left-0.z-999 { - background-color: @red; + background-color: @accent; } /* Magnifying glass icon (search box, discover packages) */ @@ -166,7 +136,7 @@ /* --- HEADER --- */ [data-test-id="notification-banner"] { background-color: if( - @lookup = latte, + @flavor = latte, desaturate(lighten(@green, 30%), 5%), desaturate(darken(@green, 5%), 5%) ); @@ -174,7 +144,7 @@ #notification, button[aria-label="Close notification"] { - color: if(@lookup = latte, @text, @base); + color: if(@flavor = latte, @text, @base); } } header { @@ -197,19 +167,22 @@ /* Search box */ form#search { + /* Search button */ button[type="submit"] { background-color: @subtext1; } + /* Search input wrapper */ > div { - border-color: @crust; + border-color: @surface0; &:focus-within { border-color: @subtext1; } - > div { - background-color: @crust; + /* Search input */ + div:has(input[type="search"]) { + background-color: @mantle; input[type="search"] { color: @text; @@ -224,10 +197,17 @@ } } - /* Floating live results */ - ul li { - border-bottom-color: @surface0; - color: @text; + /* Search results (floating box) */ + div.list { + background-color: @base; + + ul[aria-label="Search results"] li { + border-bottom-color: @surface0; + + &:hover { + background-color: @surface1; + } + } } } } @@ -260,6 +240,10 @@ /* Username */ h2 { border-bottom-color: @surface1; + + span { + color: @text; + } } /* Navigation options */ @@ -272,9 +256,9 @@ /* Red "Add Organization" button */ &[href="/org/create"] { border-color: @surface0; - color: @red; + color: @accent; svg { - fill: @red; + fill: @accent; } } } @@ -285,7 +269,8 @@ /* --- HOME PAGE --- */ ._8c1ee087 { - background-image: linear-gradient( + background-image: + linear-gradient( 270deg, fade(@red, 16%) 0%, fade(@red, 56%) 18.45%, @@ -312,7 +297,7 @@ /* Popular libraries section */ #popular-libraries-header + hr { - border-color: @red; + border-color: @accent; } ul[aria-labelledby="popular-libraries-header"] { li a { @@ -329,27 +314,27 @@ color: @text; border-color: @surface0; } - &:nth-of-type(6n + 1):hover a { + &:nth-of-type(6n+1):hover a { color: @mauve; border-bottom-color: @mauve; } - &:nth-of-type(6n + 2):hover a { + &:nth-of-type(6n+2):hover a { color: @green; border-bottom-color: @green; } - &:nth-of-type(6n + 3):hover a { + &:nth-of-type(6n+3):hover a { color: @sky; border-bottom-color: @sky; } - &:nth-of-type(6n + 4):hover a { + &:nth-of-type(6n+4):hover a { color: @red; border-bottom-color: @red; } - &:nth-of-type(6n + 5):hover a { + &:nth-of-type(6n+5):hover a { color: @yellow; border-bottom-color: @yellow; } - &:nth-of-type(6n + 6):hover a { + &:nth-of-type(6n+6):hover a { color: @pink; border-bottom-color: @pink; } @@ -362,11 +347,24 @@ /* Recently updated packages section */ #recently-updated-packages-header + hr { - border-color: @red; + border-color: @accent; } /* --- PACKAGE PAGES --- */ + /* Deprecation warning */ + .bg-washed-red { + background-color: fade(@red, 30%); + + code { + background-color: @mantle; + color: @text; + } + } + .red { + color: @red !important; + } + /* "public" text */ ._813b53b2 { color: @green; @@ -378,86 +376,60 @@ ); content: url("data:image/svg+xml,@{svg}"); } - + /* DefinitelyTyped logo */ + img[alt="DefinitelyTyped icon, indicating that this package has TypeScript declarations provided by the separate @types/bootstrap package"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } /* Navigation tabs */ - ul[aria-owns*="package-tab-"] { - li { - &:has(#package-tab-readme) { - border-color: @yellow; + #package-tab(@color) { + border-color: @color; - &:has(> a[aria-selected="false"]):hover { - background-color: fade(@yellow, 20%); - } + &:has(> a[aria-selected="false"]):hover, + &:has(> a[aria-selected="true"]) { + background-color: fade(@color, 20%); + } - a { - color: @yellow; - } + a { + color: @color; + } + } + ul[aria-owns*="package-tab-"] { + li { + &:has(#package-tab-readme), + &:has(#package-tab-members) { + #package-tab(@yellow); } &:has(#package-tab-code), - &:has(#package-tab-admin) { - border-color: @red; - - &:has(> a[aria-selected="false"]):hover { - background-color: fade(@red, 20%); - } - - a { - color: @red; - } + &:has(#package-tab-admin), + &:has(#package-tab-packages) { + #package-tab(@red); } &:has(#package-tab-dependents), - &:has(#package-tab-packages) { - border-color: @mauve; - - &:has(> a[aria-selected="false"]):hover { - background-color: fade(@mauve, 20%); - } - - a { - color: @mauve; - } + &:has(#package-tab-billing) { + #package-tab(@mauve); } &:has(#package-tab-dependencies) { - border-color: @pink; - - &:has(> a[aria-selected="false"]):hover { - background-color: fade(@pink, 20%); - } - - a { - color: @pink; - } + #package-tab(@pink); } &:has(#package-tab-versions) { - border-color: @sapphire; - - &:has(> a[aria-selected="false"]):hover { - background-color: fade(@sapphire, 20%); - } - - a { - color: @sapphire; - } + #package-tab(@sapphire); } - &:has(#package-tab-orgs) { - border-color: @green; - - &:has(> a[aria-selected="false"]):hover { - background-color: fade(@green, 20%); - } - - a { - color: @green; - } + &:has(#package-tab-orgs), + &:has(#package-tab-teams) { + #package-tab(@green); } } } /* Sidebar icons */ - ._5cfc0900 svg, - .b5be2af6 svg, - button[aria-label="Copy install command line"] svg, - [aria-labelledby="repository repository-link"] svg g { + svg:has(+ p > [aria-label="Copy install command line"]), + button[aria-label="Copy install command line"] svg path, + [aria-labelledby="repository repository-link"] svg g, + [aria-labelledby="homePage homePage-link"] svg path, + [aria-label="Showing weekly downloads"] svg { fill: @text; } /* Copy install command box */ @@ -466,11 +438,11 @@ } /* Weekly downloads chart */ div:has(> svg > [class^="sparkline--"]) { - border-bottom-color: fade(@accent-color, 20%); + border-bottom-color: fade(@accent, 20%); svg { - stroke: @accent-color; - fill: fade(@accent-color, 20%); + stroke: @accent; + fill: fade(@accent, 20%); } } @@ -565,8 +537,8 @@ /* File paths/link */ button, - /* Loading spinner */ - svg:has(> circle) { + /* Loading spinner */ + svg:has(> circle) { color: @text !important; } @@ -609,9 +581,8 @@ .hljs-subst, .hljs-built_in { - color: var( - --color-prettylights-syntax-storage-modifier-import - ) !important; + color: var(--color-prettylights-syntax-storage-modifier-import) + !important; } } } @@ -627,7 +598,7 @@ #tabpanel-dependencies, #tabpanel-dependents { ul a { - color: @red; + color: @accent; &:hover { color: @text; @@ -639,7 +610,7 @@ #tabpanel-readme #readme { color: @text; a { - color: @red; + color: @accent; } h1, h2, @@ -722,7 +693,7 @@ color: @text; + ul a { - color: @red; + color: @accent; &:hover { color: @text; @@ -730,11 +701,16 @@ } } /* Share provenance feedback link */ - #user-content-provenance a[href=" https://github.com/npm/feedback"] - { + #user-content-provenance a[href=" https://github.com/npm/feedback"] { color: @text; } + /* Settings */ + div[role="listitem"], + div[role="radiogroup"] { + background: @base; + } + /* --- PROFILE PAGES --- */ .eaac77a6 { @@ -784,9 +760,13 @@ } /* Email and password settings */ - p:has(+ div > a[href^="/settings/"][href$="/email"] + a[href^="/settings/"][href$="/password"]), - /* Delete account */ - p:has(+ a[href^="/settings/"][href$="/delete-account"]) { + p:has( + + div + > a[href^="/settings/"][href$="/email"] + + a[href^="/settings/"][href$="/password"] + ), + /* Delete account */ + p:has(+ a[href^="/settings/"][href$="/delete-account"]) { color: @text; } @@ -811,8 +791,8 @@ } } ._305a9f55 ._038c0473 { - border-color: @accent-color; - background-color: fade(@accent-color, 20%); + border-color: @accent; + background-color: fade(@accent, 20%); } button[aria-label^="Delete token ending in"] { ._305a9f55 ._038c0473 & { @@ -877,16 +857,14 @@ .e99f3f5d { color: @green; } - img[src="https://static-production.npmjs.com/28dd82ec6e5fe3cfbb4d2c4ec492076b.svg"] - { + img[src="https://static-production.npmjs.com/28dd82ec6e5fe3cfbb4d2c4ec492076b.svg"] { @svg: escape( '' ); content: url("data:image/svg+xml,@{svg}"); } /* Step 2: invite members */ - img[src="https://static-production.npmjs.com/d6654c911c7cf2159948148754c95bb6.svg"] - { + img[src="https://static-production.npmjs.com/d6654c911c7cf2159948148754c95bb6.svg"] { @svg: escape( '' ); @@ -905,7 +883,7 @@ .bg-washed-green { background-color: fade( lighten(@teal, 10%), - if(@lookup = latte, 50%, 100%) + if(@flavor = latte, 50%, 100%) ); } .b--light-green { @@ -923,7 +901,7 @@ } .npm-red { - color: @red; + color: @accent; } .a11y-light-gray, @@ -954,7 +932,9 @@ } .npm-rainbow-circle { - background-image: linear-gradient(@crust, @crust), @npmGradient; + background-image: + linear-gradient(@crust, @crust), + @npmGradient; } .npm-btn-red { @@ -992,7 +972,7 @@ /* Danger */ &._4a3f8f21 { - & when (@lookup = latte) { + & when (@flavor = latte) { background-color: lighten(@red, 30%); &:hover { @@ -1000,7 +980,7 @@ } } - & when not (@lookup = latte) { + & when not(@flavor = latte) { background-color: @red; color: @surface1; @@ -1012,7 +992,7 @@ /* Success */ &.c37751f6 { - & when (@lookup = latte) { + & when (@flavor = latte) { background-color: lighten(@green, 30%); &:hover { @@ -1020,7 +1000,7 @@ } } - & when not (@lookup = latte) { + & when not(@flavor = latte) { background-color: @green; color: @surface1; @@ -1079,36 +1059,6 @@ } /* --- SEARCH RESULTS --- */ - - [aria-labelledby="search_ranking_radiogroup_label"] { - > div:focus-within { - outline-style: none; - } - - label { - color: @subtext0; - - &[for="search_ranking_optimal"] { - border-bottom-color: @surface1; - } - - &[for="search_ranking_popularity"] { - border-bottom-color: @sky; - } - - &[for="search_ranking_quality"] { - border-bottom-color: @mauve; - } - - &[for="search_ranking_maintenance"] { - border-bottom-color: @red; - } - } - } - /* Results header, results count, pagination buttons */ - .a9b7335e { - background-color: @mantle; - } nav[aria-label="Pagination Navigation"] { div > a { background-color: @base; @@ -1121,46 +1071,24 @@ } #pkg-list-exact-match { color: @base; - & when (@lookup = latte) { - background-color: lighten(@mauve, 20%); - } - & when not (@lookup = latte) { - background-color: @mauve; - } + background-color: @accent; } - div:has(#search_ranking_radiogroup_label) { - a[href^="/search?q=keywords"] { - background-color: @mantle; - &:hover { - background-color: @crust; - } - } - } /* Username links */ a[aria-label^="publisher"]:hover { - color: @red; - } - /* PQM text */ - ._89d0b3e5 { - color: @text; - } - /* PQM bars */ - ._464c07bf { - background-color: @sky; - } - ._625ca439 { - background-color: @mauve; - } - ._9a8a65f4 { - background-color: @red; + color: @accent; } /* --- FOOTER --- */ footer { - a[href="https://github.com/npm"] svg - { + h3 { + color: @text; + } + ul a:hover { + color: @accent; + } + a[href="https://github.com/npm"] svg { > polygon { fill: @base; } @@ -1169,8 +1097,7 @@ fill: @text; } } - a[href="https://github.com"] svg - { + a[href="https://github.com"] svg { fill: @text; } &::after { @@ -1178,7 +1105,7 @@ } } - --color-prettylights-syntax-comment: @overlay1; + --color-prettylights-syntax-comment: @overlay2; --color-prettylights-syntax-constant: @teal; --color-prettylights-syntax-entity: @blue; --color-prettylights-syntax-storage-modifier-import: @peach; @@ -1187,31 +1114,21 @@ --color-prettylights-syntax-string: @green; --color-prettylights-syntax-variable: @peach; --color-prettylights-syntax-invalid-illegal-text: @red; - --color-prettylights-syntax-invalid-illegal-bg: fadeout(@red, 85%); + --color-prettylights-syntax-invalid-illegal-bg: fade(@red, 15%); --color-prettylights-syntax-markup-heading: @teal; --color-prettylights-syntax-markup-italic: @yellow; --color-prettylights-syntax-markup-bold: @yellow; --color-prettylights-syntax-markup-deleted-text: @text; - --color-prettylights-syntax-markup-deleted-bg: fadeout(@red, 60%); + --color-prettylights-syntax-markup-deleted-bg: fade(@red, 40%); --color-prettylights-syntax-markup-inserted-text: @text; - --color-prettylights-syntax-markup-inserted-bg: fadeout(@green, 60%); + --color-prettylights-syntax-markup-inserted-bg: fade(@green, 40%); --color-prettylights-syntax-markup-changed-text: @text; - --color-prettylights-syntax-markup-changed-bg: fadeout(@yellow, 60%); + --color-prettylights-syntax-markup-changed-bg: fade(@yellow, 40%); --color-prettylights-syntax-markup-ignored-text: @text; /* stylelint-disable declaration-block-single-line-max-declarations */ - /* prettier-ignore */ + /* deno-fmt-ignore */ div.highlight pre {.pl-mb,.pl-mdr,.pl-c{color:var(--color-prettylights-syntax-comment)}.pl-c1,.pl-s .pl-v{color:var(--color-prettylights-syntax-constant)}.pl-e,.pl-en{color:var(--color-prettylights-syntax-entity)}.pl-s .pl-s1,.pl-smi{color:var(--color-prettylights-syntax-storage-modifier-import)}.pl-ent{color:var(--color-prettylights-syntax-entity-tag)}.pl-k{color:var(--color-prettylights-syntax-keyword)}.pl-pds,.pl-s,.pl-s .pl-pse .pl-s1,.pl-sr,.pl-sr .pl-cce,.pl-sr .pl-sra,.pl-sr .pl-sre{color:var(--color-prettylights-syntax-string)}.pl-smw,.pl-v{color:var(--color-prettylights-syntax-variable)}.pl-bu{color:var(--color-prettylights-syntax-brackethighlighter-unmatched)}.pl-ii{color:var(--color-prettylights-syntax-invalid-illegal-text);background-color:var(--color-prettylights-syntax-invalid-illegal-bg)}.pl-c2{color:var(--color-prettylights-syntax-carriage-return-text);background-color:var(--color-prettylights-syntax-carriage-return-bg)}.pl-sr .pl-cce{color:var(--color-prettylights-syntax-string-regexp)}.pl-ml{color:var(--color-prettylights-syntax-markup-list)}.pl-mh,.pl-mh .pl-en,.pl-ms{color:var(--color-prettylights-syntax-markup-heading)}.pl-mi{color:var(--color-prettylights-syntax-markup-italic)}.pl-mb{color:var(--color-prettylights-syntax-markup-bold)}.pl-md{color:var(--color-prettylights-syntax-markup-deleted-text);background-color:var(--color-prettylights-syntax-markup-deleted-bg)}.pl-mi1{color:var(--color-prettylights-syntax-markup-inserted-text);background-color:var(--color-prettylights-syntax-markup-inserted-bg)}.pl-mc{color:var(--color-prettylights-syntax-markup-changed-text);background-color:var(--color-prettylights-syntax-markup-changed-bg)}.pl-mi2{color:var(--color-prettylights-syntax-markup-ignored-text);background-color:var(--color-prettylights-syntax-markup-ignored-bg)}.pl-mdr{color:var(--color-prettylights-syntax-meta-diff-range)}.pl-ba{color:var(--color-prettylights-syntax-brackethighlighter-angle)}.pl-sg{color:var(--color-prettylights-syntax-sublimelinter-gutter-mark)}.pl-corl{text-decoration:underline;color:var(--color-prettylights-syntax-constant-other-reference-link)}} /* stylelint-enable declaration-block-single-line-max-declarations */ } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @red_filter: brightness(0) saturate(100%) invert(13%) sepia(93%) saturate(6590%) hue-rotate(343deg) brightness(85%) contrast(92%); @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @red_filter: brightness(0) saturate(100%) invert(79%) sepia(26%) saturate(3775%) hue-rotate(304deg) brightness(96%) contrast(88%); @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @red_filter: brightness(0) saturate(100%) invert(62%) sepia(22%) saturate(880%) hue-rotate(302deg) brightness(98%) contrast(90%); @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @red_filter: brightness(0) saturate(100%) invert(87%) sepia(37%) saturate(4988%) hue-rotate(296deg) brightness(105%) contrast(91%); @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/npm/preview.webp b/styles/npm/preview.webp deleted file mode 100644 index 2ee0244eee..0000000000 --- a/styles/npm/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ef0a911b87845bb6d6eee7a3e156586edb9ab54542f82af549ecf2ecd1619058 -size 135490 diff --git a/styles/npmx/README.md b/styles/npmx/README.md new file mode 100644 index 0000000000..b7018c3831 --- /dev/null +++ b/styles/npmx/README.md @@ -0,0 +1,37 @@ + + + +

+ Logo
+ + Catppuccin for npmx + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + +> [!NOTE] +> npmx-specific accent color appearance options at https://npmx.dev/settings are overriden by this userstyle. + +## ๐Ÿ’ Current Maintainer +- [42willow](https://github.com/42willow) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/npmx/catppuccin.user.less b/styles/npmx/catppuccin.user.less new file mode 100644 index 0000000000..721fa7efa7 --- /dev/null +++ b/styles/npmx/catppuccin.user.less @@ -0,0 +1,73 @@ +/* ==UserStyle== +@name npmx Catppuccin +@namespace github.com/catppuccin/userstyles/styles/npmx +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/npmx +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/npmx/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Anpmx +@description Soothing pastel theme for npmx +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("npmx.dev") { + :root[data-theme="dark"][data-bg-theme] { + #catppuccin(@darkFlavor); + } + :root[data-theme="light"][data-bg-theme] { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --bg: @base; + --bg-subtle: @mantle; + --bg-muted: @crust; + --bg-elevated: @surface0; + + --fg: @text; + --fg-subtle: @overlay1; + --fg-muted: @subtext0; + --fg-elevated: @subtext0; + + --accent: @accent; + --accent-muted: @accent; + + --border: @surface1; + --border-subtle: @surface0; + --border-hover: @overlay0; + + --swatch-sky: @sky; + --swatch-coral: @peach; + --swatch-amber: @yellow; + --swatch-emerald: @green; + --swatch-violet: @mauve; + --swatch-magenta: @pink; + --swatch-neutral: @text; + + --badge-orange: @peach; + --badge-yellow: @yellow; + --badge-green: @green; + --badge-cyan: @teal; + --badge-blue: @blue; + --badge-indigo: @lavender; + --badge-purple: @mauve; + --badge-pink: @pink; + + --colors-red-500: @red; + --colors-emerald-500: @green; + --colors-yellow-600: @yellow; + --colors-amber-500: @peach; + --colors-emerald-400: @green; + --colors-orange-500: @peach; + } +} diff --git a/styles/ollama/README.md b/styles/ollama/README.md index ff2dd386f9..e875eed46e 100644 --- a/styles/ollama/README.md +++ b/styles/ollama/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/ollama/catppuccin.user.css b/styles/ollama/catppuccin.user.css deleted file mode 100644 index e2ca46e7b0..0000000000 --- a/styles/ollama/catppuccin.user.css +++ /dev/null @@ -1,291 +0,0 @@ -/* ==UserStyle== -@name Ollama Catppuccin -@namespace github.com/catppuccin/userstyles/styles/ollama -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/ollama -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/ollama/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aollama -@description Soothing pastel theme for Ollama -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('ollama.com') { - @import url("https://unpkg.com/@catppuccin/highlightjs@0.2.2/css/catppuccin.variables.css"); - - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - @text-filter: @catppuccin[@@lookup][@text-filter]; - - --ctp-rosewater: #rgbify(@rosewater) []; - --ctp-flamingo: #rgbify(@flamingo) []; - --ctp-pink: #rgbify(@pink) []; - --ctp-mauve: #rgbify(@mauve) []; - --ctp-red: #rgbify(@red) []; - --ctp-maroon: #rgbify(@maroon) []; - --ctp-peach: #rgbify(@peach) []; - --ctp-yellow: #rgbify(@yellow) []; - --ctp-green: #rgbify(@green) []; - --ctp-teal: #rgbify(@teal) []; - --ctp-sky: #rgbify(@sky) []; - --ctp-sapphire: #rgbify(@sapphire) []; - --ctp-blue: #rgbify(@blue) []; - --ctp-lavender: #rgbify(@lavender) []; - --ctp-text: #rgbify(@text) []; - --ctp-subtext1: #rgbify(@subtext1) []; - --ctp-subtext0: #rgbify(@subtext0) []; - --ctp-overlay2: #rgbify(@overlay2) []; - --ctp-overlay1: #rgbify(@overlay1) []; - --ctp-overlay0: #rgbify(@overlay0) []; - --ctp-surface2: #rgbify(@surface2) []; - --ctp-surface1: #rgbify(@surface1) []; - --ctp-surface0: #rgbify(@surface0) []; - --ctp-base: #rgbify(@base) []; - --ctp-mantle: #rgbify(@mantle) []; - --ctp-crust: #rgbify(@crust) []; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - background-color: @base; - color: @text; - - /* Llama logos */ - img[src="/public/ollama.png"], - img[src="/public/shades.png"], - img[src="/public/glasses.png"] { - filter: @text-filter; - } - - code, - pre { - background-color: @mantle; - color: @text !important; - } - - input { - background-color: @mantle; - } - - main, - section, - strong, - h3, - ul, - button, - li, - li::marker { - color: @text; - } - blockquote { - color: @subtext0; - } - - a[class~=""] { - color: @blue; - } - - #query, - #filter, - #search { - background-color: @mantle; - color: @text; - } - #readme, - #display, - #file-explorer { - color: @text; - } - - .command { - color: @text; - } - .truncate { - color: @text; - } - - /* Tailwind */ - - * { - border-color: @surface1; - } - - .prose { - --tw-prose-headings: @text; - --tw-prose-links: @accent-color; - } - - .text-white, - .text-black { - color: @text; - } - .text-gray-900 { - color: @subtext1; - } - .text-green-500, - .text-emerald-500, - .text-green-700 { - color: @green; - } - .text-yellow-900 { - color: @yellow; - } - .text-neutral-300, - .text-neutral-400, - .text-neutral-500 { - color: @subtext0; - } - .text-neutral-700, - .text-neutral-800, - .text-neutral-900 { - color: @subtext1 !important; - } - .text-red-500 { - color: @red; - } - .text-blue-500, - .text-blue-600 { - color: @accent-color; - } - /* Models page, color for non-weight pills/tags. Background color is solid from `.bg-indigo-50`. */ - .text-indigo-600 { - color: @crust; - } - - .bg-neutral-100 pre, - .bg-neutral-100 .command { - background-color: unset !important; - } - .bg-white { - background-color: @mantle; - } - .bg-black, - .hover\:bg-black:hover { - background-color: @surface0 !important; - } - .bg-neutral-50 { - background-color: @surface0; - } - .bg-neutral-100, - .hover\:bg-neutral-100:hover { - background-color: @surface2 !important; - } - .bg-neutral-700, - .bg-neutral-800 { - background-color: @surface1; - } - .bg-green-50 { - background-color: fade(@green, 10%); - } - .bg-yellow-50 { - background-color: fade(@yellow, 10%); - } - .bg-indigo-50 { - background-color: @accent-color; - } - .bg-\[\#ddf4ff\] { - background-color: fade(@accent-color, 10%); - } - - .border { - border-color: @accent-color; - } - .border-neutral-200, - .border-neutral-300, - .divide-gray-200 > :not([hidden]) ~ :not([hidden]), - .divide-neutral-200 > :not([hidden]) ~ :not([hidden]) { - border-color: @surface1; - } - .focus\:border-blue-400:focus { - border-color: @accent-color; - } - .focus\:border-red-400:focus { - border-color: @red; - } - - .ring-neutral-300 { - --tw-ring-color: @surface1 !important; - } - .ring-green-600\/20 { - --tw-ring-color: @green; - } - .ring-yellow-600\/20 { - --tw-ring-color: @yellow; - } - select:focus, - .ring-blue-300, - .focus\:ring-blue-300:focus { - --tw-ring-color: rgba(#rgbify(@accent-color) [], var(--tw-ring-opacity)); - } - .focus\:ring-red-300:focus { - --tw-ring-color: rgba(#rgbify(@red) [], var(--tw-ring-opacity)); - } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @text-filter: brightness(0) saturate(100%) invert(32%) sepia(14%) saturate(808%) hue-rotate(196deg) brightness(92%) contrast(95%); @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @text-filter: brightness(0) saturate(100%) invert(82%) sepia(17%) saturate(401%) hue-rotate(191deg) brightness(97%) contrast(98%); @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @text-filter: brightness(0) saturate(100%) invert(72%) sepia(78%) saturate(147%) hue-rotate(195deg) brightness(103%) contrast(92%); @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @text-filter: brightness(0) saturate(100%) invert(94%) sepia(11%) saturate(2056%) hue-rotate(182deg) brightness(96%) contrast(99%); @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/ollama/catppuccin.user.less b/styles/ollama/catppuccin.user.less new file mode 100644 index 0000000000..a8aff3d63b --- /dev/null +++ b/styles/ollama/catppuccin.user.less @@ -0,0 +1,211 @@ +/* ==UserStyle== +@name Ollama Catppuccin +@namespace github.com/catppuccin/userstyles/styles/ollama +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/ollama +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/ollama/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aollama +@description Soothing pastel theme for Ollama +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("ollama.com") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.css"); + + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + background-color: @base; + color: @text; + + /* Llama logos */ + img[src="/public/ollama.png"], + img[src="/public/shades.png"], + img[src="/public/glasses.png"] { + filter: @text-filter; + } + + code, + pre { + background-color: @mantle; + color: @text !important; + } + + input { + background-color: @mantle; + } + + main, + section, + strong, + h3, + ul, + button, + li, + li::marker { + color: @text; + } + blockquote { + color: @subtext0; + } + + a[class~=""] { + color: @blue; + } + + #query, + #filter, + #search { + background-color: @mantle; + color: @text; + } + #readme, + #display, + #file-explorer { + color: @text; + } + + .command { + color: @text; + } + .truncate { + color: @text; + } + + /* Tailwind */ + + * { + border-color: @surface1; + } + + .prose { + --tw-prose-headings: @text; + --tw-prose-links: @accent; + } + + .text-white, + .text-black { + color: @text; + } + .text-gray-900 { + color: @subtext1; + } + .text-green-500, + .text-emerald-500, + .text-green-700 { + color: @green; + } + .text-yellow-900 { + color: @yellow; + } + .text-neutral-300, + .text-neutral-400, + .text-neutral-500 { + color: @subtext0; + } + .text-neutral-700, + .text-neutral-800, + .text-neutral-900 { + color: @subtext1 !important; + } + .text-red-500 { + color: @red; + } + .text-blue-500, + .text-blue-600 { + color: @accent; + } + /* Models page, color for non-weight pills/tags. Background color is solid from `.bg-indigo-50`. */ + .text-indigo-600 { + color: @crust; + } + + .bg-neutral-100 pre, + .bg-neutral-100 .command { + background-color: unset !important; + } + .bg-white { + background-color: @mantle; + } + .bg-black, + .hover\:bg-black:hover { + background-color: @surface0 !important; + } + .bg-neutral-50 { + background-color: @surface0; + } + .bg-neutral-100, + .hover\:bg-neutral-100:hover { + background-color: @surface2 !important; + } + .bg-neutral-700, + .bg-neutral-800 { + background-color: @surface1; + } + .bg-green-50 { + background-color: fade(@green, 10%); + } + .bg-yellow-50 { + background-color: fade(@yellow, 10%); + } + .bg-indigo-50 { + background-color: @accent; + } + .bg-\[\#ddf4ff\] { + background-color: fade(@accent, 10%); + } + + .border { + border-color: @accent; + } + .border-neutral-200, + .border-neutral-300, + .divide-gray-200 > :not([hidden]) ~ :not([hidden]), + .divide-neutral-200 > :not([hidden]) ~ :not([hidden]) { + border-color: @surface1; + } + .focus\:border-blue-400:focus { + border-color: @accent; + } + .focus\:border-red-400:focus { + border-color: @red; + } + + .ring-neutral-300 { + --tw-ring-color: @surface1 !important; + } + .ring-green-600\/20 { + --tw-ring-color: @green; + } + .ring-yellow-600\/20 { + --tw-ring-color: @yellow; + } + select:focus, + .ring-blue-300, + .focus\:ring-blue-300:focus { + --tw-ring-color: rgba(#lib.rgbify(@accent)[], var(--tw-ring-opacity)); + } + .focus\:ring-red-300:focus { + --tw-ring-color: rgba(#lib.rgbify(@red)[], var(--tw-ring-opacity)); + } + } +} diff --git a/styles/ollama/preview.webp b/styles/ollama/preview.webp deleted file mode 100644 index 41014467d8..0000000000 --- a/styles/ollama/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:8e2e6451dad5a5645d590e65ba83e558baefaf301dbdce4d39377b9b224ff109 -size 115904 diff --git a/styles/openmediavault/README.md b/styles/openmediavault/README.md index 2dc5fd0bbe..ea0ae16dba 100644 --- a/styles/openmediavault/README.md +++ b/styles/openmediavault/README.md @@ -4,23 +4,22 @@

Logo
- Catppuccin for openmediavault + Catppuccin for openmediavault

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Gandalf the Blue](https://github.com/Gandalf-the-Blue) +- [Gandalf-the-Blue](https://github.com/Gandalf-the-Blue)   diff --git a/styles/openmediavault/catppuccin.user.css b/styles/openmediavault/catppuccin.user.less similarity index 56% rename from styles/openmediavault/catppuccin.user.css rename to styles/openmediavault/catppuccin.user.less index 8da8d7e79f..bb59a253f2 100644 --- a/styles/openmediavault/catppuccin.user.css +++ b/styles/openmediavault/catppuccin.user.less @@ -2,8 +2,8 @@ @name openmediavault Catppuccin @namespace github.com/catppuccin/userstyles/styles/openmediavault @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/openmediavault -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/openmediavault/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/openmediavault/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aopenmediavault @description Soothing pastel theme for openmediavault @author Catppuccin @@ -15,70 +15,36 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain("openmediavault.example.com") { - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); +@-moz-document domain("openmediavault.example.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); .omv-dark-theme { --mat-color-text: @text; --mat-color-secondary-text: @subtext0; --mat-color-disabled-text: @red; --mat-color-hint-text: @blue; - --mat-background-color-hover: @accent-color; - --mat-background-color-selected-button: @accent-color; + --mat-background-color-hover: @accent; + --mat-background-color-selected-button: @accent; --mat-background-color-card: @crust; --mat-background-color-background: @crust; - --mat-primary-color-text: @accent-color; + --mat-primary-color-text: @accent; --mat-background-color-body: @base; } .omv-dark-theme .mat-toolbar.mat-primary { - background: @accent-color; + background: @accent; color: @text; } .omv-dark-theme .mat-drawer-container { @@ -109,7 +75,7 @@ } .omv-dark-theme .mat-form-field-appearance-legacy .mat-form-field-label, .omv-dark-theme .mat-form-field-appearance-legacy .mat-hint { - color: @accent-color; + color: @accent; } .omv-dark-theme .mat-toolbar { background: @crust; @@ -134,15 +100,15 @@ .omv-scrollable-xy, .omv-scrollable-y { - scrollbar-color: @accent-color transparent; - --scrollbar-thumb-color: @accent-color !important; - --scrollbar-thumb-hover-color: @accent-color; + scrollbar-color: @accent transparent; + --scrollbar-thumb-color: @accent !important; + --scrollbar-thumb-hover-color: @accent; } .omv-dark-theme .mat-button, .omv-dark-theme .mat-icon-button, .omv-dark-theme .mat-stroked-button { - color: @accent-color; + color: @accent; background: inherit; } @@ -150,29 +116,29 @@ .omv-dark-theme .mat-pseudo-checkbox-indeterminate, .omv-dark-theme .mat-accent .mat-pseudo-checkbox-checked, .omv-dark-theme .mat-accent .mat-pseudo-checkbox-indeterminate { - background: @accent-color; + background: @accent; } .omv-dark-theme .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background, .omv-dark-theme .mat-checkbox-checked.mat-accent .mat-checkbox-background { - background-color: @accent-color; + background-color: @accent; } .omv-dark-theme .mat-slide-toggle.mat-checked .mat-slide-toggle-thumb { - background-color: @accent-color; + background-color: @accent; } .omv-dark-theme .mat-slide-toggle.mat-checked .mat-slide-toggle-bar { - background-color: @accent-color; + background-color: @accent; } .omv-dark-theme .mat-badge-accent .mat-badge-content { background: @crust; - color: @accent-color; + color: @accent; } .omv-dark-theme .mat-select-panel { - scrollbar-color: @accent-color transparent; - --scrollbar-thumb-color: @accent-color !important; - --scrollbar-thumb-hover-color: @accent-color !important; + scrollbar-color: @accent transparent; + --scrollbar-thumb-color: @accent !important; + --scrollbar-thumb-hover-color: @accent !important; background: @crust; } @@ -183,7 +149,7 @@ .omv-dark-theme .mat-primary .mat-option.mat-selected:not(.mat-option-disabled) { - color: @accent-color; + color: @accent; } .ngx-datatable.single-selection .datatable-body-row.active, @@ -198,7 +164,7 @@ .ngx-datatable.multi-click-selection .datatable-body-row.active .datatable-row-group { - color: @accent-color; + color: @accent; background-color: @crust; } @@ -259,13 +225,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/openmediavault/preview.webp b/styles/openmediavault/preview.webp deleted file mode 100644 index 5608c12e02..0000000000 --- a/styles/openmediavault/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d607128ff966ed7685b4f7c2c1be2d27dd36b26cc2f9c2820e1a0c35635d02ec -size 133004 diff --git a/styles/paste.rs/README.md b/styles/paste.rs/README.md index 654996f5ca..2ad2ab3639 100644 --- a/styles/paste.rs/README.md +++ b/styles/paste.rs/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/paste.rs/catppuccin.user.css b/styles/paste.rs/catppuccin.user.css deleted file mode 100644 index 6eeaf1fc34..0000000000 --- a/styles/paste.rs/catppuccin.user.css +++ /dev/null @@ -1,217 +0,0 @@ -/* ==UserStyle== -@name paste.rs Catppuccin -@namespace github.com/catppuccin/userstyles/styles/paste.rs -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/paste.rs -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/paste.rs/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apaste.rs -@description Soothing pastel theme for paste.rs -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("paste.rs") { - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - body { - background-color: @base; - color: @text; - } - a { - color: @accent-color; - } - - /* Web UI */ - textarea, - select, - input[type="submit"] { - background-color: @base; - color: @text; - border-color: @overlay0; - border-radius: 4px; - } - textarea:focus, - select:focus, - input[type="submit"]:focus { - border-color: @accent-color; - outline-color: @overlay0; - } - input[type="submit"]:hover { - background-color: @mantle; - } - - td.linenos > pre { - background-color: @base !important; - span { - /* Line Numbers */ - color: @overlay0 !important; - } - } - - article.markdown-body { - color: @text; - - h6 { - color: @text; - } - - a { - color: @accent-color; - } - - img { - background: none; - } - - pre { - background: @surface0; - } - - h1, - h2, - h3, - h4, - h5, - h6 { - border-color: @surface0; - } - - blockquote { - border-color: @surface1; - - p { - color: @text; - } - } - - table { - border-color: @surface0 !important; - tr, - th, - td { - border-color: @surface1; - background: none !important; - } - } - } - - /* Syntax-highlighted code */ - td.code > pre { - background-color: @base !important; - - /* General Text, Braces, Delimiters, Parameters, Classes, Metadata */ - span[style="color:#000000;"] { - color: @text !important; - } - - /* Keywords, Operators */ - span[style="color:#d73a49;"] { - color: @mauve !important; - } - - /* Strings */ - span[style="color:#032f62;"] { - color: @green !important; - } - - /* Escape Sequences */ - span[style="color:#183691;"] { - color: @pink !important; - } - - /* Comments */ - span[style="color:#969896;"] { - color: @overlay0 !important; - } - - /* Constants, Numbers */ - span[style="color:#005cc5;"] { - color: @peach !important; - } - - /* Methods, Functions */ - span[style="color:#6f42c1;"], - span[style="color:#22863a;"] { - color: @blue !important; - } - - /* Builtins */ - span[style="color:#0086b3;"] { - color: @red !important; - } - - /* Metadata */ - span[style="color:#795da3;"] { - color: @yellow !important; - } - - /* Errors */ - span[style="background-color:#b31d28;color:#fafbfc;"] { - color: @text !important; - background: fade(@red, 60%) !important; - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/paste.rs/catppuccin.user.less b/styles/paste.rs/catppuccin.user.less new file mode 100644 index 0000000000..0e1ca5323c --- /dev/null +++ b/styles/paste.rs/catppuccin.user.less @@ -0,0 +1,171 @@ +/* ==UserStyle== +@name paste.rs Catppuccin +@namespace github.com/catppuccin/userstyles/styles/paste.rs +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/paste.rs +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/paste.rs/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apaste.rs +@description Soothing pastel theme for paste.rs +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("paste.rs") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + background-color: @base; + color: @text; + } + + a { + color: @accent; + } + + /* Web UI */ + textarea, + select, + input[type="submit"] { + background-color: @base; + color: @text; + border-color: @overlay0; + border-radius: 4px; + } + textarea:focus, + select:focus, + input[type="submit"]:focus { + border-color: @accent; + outline-color: @overlay0; + } + input[type="submit"]:hover { + background-color: @mantle; + } + + main { + color: @text; + border-color: @surface0; + } + + .code.gutter { + background-color: @base !important; + span { + /* Line Numbers */ + color: @overlay0 !important; + } + } + + article.markdown-body { + color: @text; + + h6 { + color: @text; + } + + a { + color: @accent; + } + + img { + background: none; + } + + pre { + background: @surface0; + } + + h1, + h2, + h3, + h4, + h5, + h6 { + border-color: @surface0; + } + + blockquote { + border-color: @surface1; + + p { + color: @text; + } + } + + table { + border-color: @surface0 !important; + tr, + th, + td { + border-color: @surface1; + background: none !important; + } + } + } + + /* Syntax-highlighted code */ + .code.text > pre { + background-color: @base !important; + background-image: none; + + span { + color: red !important; + } + + /* General Text, Braces, Delimiters, Parameters, Classes, Metadata */ + span[style*="color:#323232"] { + color: @text !important; + } + + /* Keywords, Operators */ + span[style*="color:#a71d5d"] { + color: @mauve !important; + } + + /* Strings */ + span[style*="color:#183691"], + span[style*="color:#ed6a43"] { + color: @green !important; + } + + /* Comments */ + span[style*="color:#969896"] { + color: @overlay2 !important; + } + + /* Constants, Numbers */ + span[style*="color:#0086b3"] { + color: @peach !important; + } + + /* Methods, Functions */ + span[style*="color:#795da3"], + span[style*="color:#62a35c"], + span[style*="color:#63a35c"] { + color: @blue !important; + } + + /* Errors */ + span[style*="background-color:#f5f5f5"][style*="color:#b52a1d"] { + color: @text !important; + background: fade(@red, 60%) !important; + } + } + } +} diff --git a/styles/paste.rs/preview.webp b/styles/paste.rs/preview.webp deleted file mode 100644 index 59ec69531a..0000000000 --- a/styles/paste.rs/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:0fbb761df28cf156b2cfbc4eaee09558034120a48833677f7368d00fae78ce88 -size 84062 diff --git a/styles/perplexity/README.md b/styles/perplexity/README.md index d4af36aea3..486d85f57e 100644 --- a/styles/perplexity/README.md +++ b/styles/perplexity/README.md @@ -10,20 +10,19 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer - [Tnixc](https://github.com/Tnixc) ## ๐Ÿ’– Past Maintainer -- [Isabel](https://github.com/isabelroses) +- [isabelroses](https://github.com/isabelroses)   diff --git a/styles/perplexity/catppuccin.user.css b/styles/perplexity/catppuccin.user.less similarity index 61% rename from styles/perplexity/catppuccin.user.css rename to styles/perplexity/catppuccin.user.less index 1e02982a52..7ee8add2a8 100644 --- a/styles/perplexity/catppuccin.user.css +++ b/styles/perplexity/catppuccin.user.less @@ -2,8 +2,8 @@ @name Perplexity Catppuccin @namespace github.com/catppuccin/userstyles/styles/perplexity @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/perplexity -@version 0.1.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/perplexity/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/perplexity/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aperplexity @description Soothing pastel theme for Perplexity @author Catppuccin @@ -15,55 +15,26 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('perplexity.ai') { +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("perplexity.ai") { :root:not([data-color-scheme="dark"]) { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } :root, :root:not([data-color-scheme="light"]) { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } + background-color: fade(@accent, 30%) + !important; // TODO: Has !important unlike the defaults. Add !important to defaults? + color: @text + !important; // TODO: Another case of setting the text color in the selection. } body { @@ -76,6 +47,9 @@ .bg-alert { background-color: @peach !important; } + .bg-text-100 { + background-color: @text !important; + } .bg-backdrop-lightbox\/95 { background-color: @crust !important; @@ -85,16 +59,20 @@ background-color: @mantle !important; } - .bg-background { + .bg-background, .bg-background-50 { background-color: @base !important; } - .bg-background-300 { - background-color: @crust !important; + .bg-background-100 { + background-color: @base !important; + } + + .bg-background-300, .bg-background-200 { + background-color: @mantle !important; } .bg-background-super-alt { - background-color: @accent-color !important; + background-color: @accent !important; } .bg-backgroundDark { @@ -131,9 +109,9 @@ .bg-offsetPlusDark, .dark\:\!bg-offsetPlusDark:where( - [data-color-scheme="dark"] .dark\:\!bg-offsetPlusDark, - [data-color-scheme="dark"] .dark\:\!bg-offsetPlusDark * - ) { + [data-color-scheme="dark"] .dark\:\!bg-offsetPlusDark, + [data-color-scheme="dark"] .dark\:\!bg-offsetPlusDark * + ) { background-color: @mantle !important; } @@ -144,15 +122,15 @@ .bg-superDark, .bg-superDark\/100, .bg-super\/100 { - background-color: @accent-color !important; + background-color: @accent !important; } .bg-super\/10, .bg-superDark\/10 { - background-color: fade(@accent-color, 10%) !important; + background-color: fade(@accent, 10%) !important; } .bg-textMain { - background-color: @overlay0 !important; + background-color: @crust !important; } .bg-textMainDark, @@ -196,7 +174,7 @@ .text-superAlt, .text-superDark, .text-superDuper { - color: @accent-color !important; + color: @accent !important; } .text-textMain { @@ -239,7 +217,7 @@ .stroke-super, .stroke-superAlt, .stroke-superDark { - stroke: @accent-color !important; + stroke: @accent !important; } .stroke-textMain { @@ -262,7 +240,7 @@ .fill-super, .fill-superAlt, .fill-superDark { - fill: @accent-color !important; + fill: @accent !important; } .fill-textMain, @@ -285,9 +263,9 @@ border-color: @mantle !important; } .dark\:border-borderMainDark:where( - [data-color-scheme="dark"] .dark\:border-borderMainDark, - [data-color-scheme="dark"] .dark\:border-borderMainDark * - ), + [data-color-scheme="dark"] .dark\:border-borderMainDark, + [data-color-scheme="dark"] .dark\:border-borderMainDark * + ), .border-borderMain { border-color: @surface1 !important; } @@ -309,7 +287,7 @@ .border-super, .border-super\/10, .border-super\/100 { - border-color: @accent-color !important; + border-color: @accent !important; } .border-textMain\/0 { @@ -328,14 +306,19 @@ border-bottom-color: @subtext0 !important; } .group:hover [class*="group-hover:text-superDark"] { - color: @accent-color !important; + color: @accent !important; } [class*="hover:!bg-superAlt/20"]:hover { - background-color: @accent-color !important; + background-color: @accent !important; + } + + [class*="data-[focused=self]:bg-background-200"]:focus, + [class*="hover:bg-background-200"]:hover { + background-color: @crust !important; } - [class*="hover:bg-offset"]:hover { + [class*=":hover:bg-offset"]:hover, [class*="hover:bg-offset"]:hover { background-color: @surface0 !important; } @@ -344,12 +327,12 @@ } [class*="hover:bg-super"]:hover { - background-color: @accent-color !important; + background-color: @accent !important; } [class*="hover:text-super"]:hover, [class*="hover:text-superAlt"]:hover { - color: @accent-color !important; + color: @accent !important; } [class*="hover:text-textMain"]:hover { @@ -364,10 +347,14 @@ color: @text !important; } + [data-focused="self"] { + background-color: @surface1 !important; + } + .dark\:divide-borderMainDark\/50:where( - [data-color-scheme="dark"] .dark\:divide-borderMainDark\/50, - [data-color-scheme="dark"] .dark\:divide-borderMainDark\/50 * - ) + [data-color-scheme="dark"] .dark\:divide-borderMainDark\/50, + [data-color-scheme="dark"] .dark\:divide-borderMainDark\/50 * + ) > :not([hidden]) ~ :not([hidden]), .divide-borderMain\/50 > :not([hidden]) ~ :not([hidden]) { @@ -383,7 +370,11 @@ } .focus\:text-super:focus { - color: @accent-color !important; + color: @accent !important; + } + + .focus-visible\:bg-offsetPlus:focus-visible { + background-color: @crust !important; } *[class*="ring"] { @@ -391,15 +382,31 @@ --tw-ring-offset-color: @mantle !important; } + .caret-superDuper { + caret-color: @accent !important; + } + .data-\[state\=checked\]\:bg-super[data-state="checked"] { + background-color: @accent !important; + } + /* Additional fixes: */ + .scrollbar-thumb-idle { + --scrollbar-thumb: @surface1 !important; + } + + /* gradient on super long prompt */ + div[style="background: linear-gradient(transparent, currentcolor);"] { + background: linear-gradient(transparent, @base) !important; + } + /* citations */ .citation:hover * { color: @crust !important; } /* switch knob in settings */ .data-\[state\=checked\]\:before\:\!bg-super[data-state="checked"]::before { - background-color: @accent-color !important; + background-color: @accent !important; } /* switch in main input */ #copilot-toggle > div::before { @@ -431,19 +438,13 @@ .research-goal-timeline { background-color: @surface1; } + + .\!bg-transparent { + background: transparent !important; + } } } #rgbify(@color) { - @rgb-raw: red(@color) green(@color) blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; + @rgb: red(@color) green(@color) blue(@color); } - -// vim:ft=less diff --git a/styles/perplexity/preview.webp b/styles/perplexity/preview.webp deleted file mode 100644 index dbe43d10fb..0000000000 --- a/styles/perplexity/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6c942e8746a5c0a8de98cba30369c50e0c3792b4eb4752f46c909ccd755d18be -size 269650 diff --git a/styles/phanpy/README.md b/styles/phanpy/README.md index 693765436c..37f382ba58 100644 --- a/styles/phanpy/README.md +++ b/styles/phanpy/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/phanpy/catppuccin.user.css b/styles/phanpy/catppuccin.user.css deleted file mode 100644 index cb7715268e..0000000000 --- a/styles/phanpy/catppuccin.user.css +++ /dev/null @@ -1,134 +0,0 @@ -/* ==UserStyle== -@name Phanpy Catppuccin -@namespace github.com/catppuccin/userstyles/styles/phanpy -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/phanpy -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/phanpy/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aphanpy -@description Soothing pastel theme for Phanpy -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('phanpy.social') { - :root:not(:has(.is-light)) { - #catppuccin(@darkFlavor, @accentColor); - } - :root.is-light { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --text-color: @text; - --text-insignificant-color: @subtext0; - --link-color: @accent-color; - --link-text-color: @accent-color; - --link-faded-color: @accent-color; - --link-light-color: @accent-color; - --button-bg-blur-color: @accent-color; - --button-bg-color: @accent-color; - --button-text-color: @base; - --bg-faded-color: @base; - --bg-faded-blur-color: @mantle; - --bg-blur-color: @mantle; - --close-button-bg-color: @mantle; - --close-button-color: @subtext0; - --bg-color: @base; - --link-bg-hover-color: @mantle; - --divider-color: @surface0; - --outline-color: @surface0; - --outline-hover-color: @surface2; - --reblog-faded-color: fade(@mauve, 20%); - --reblog-color: @mauve; - --reply-to-faded-color: fade(@yellow, 20%); - --reply-to-text-color: @yellow; - --reply-to-color: @yellow; - --favourite-color: @red; - --green-color: @green; - --red-color: @red; - --comment-line-color: @surface1; - --media-bg-color: @base; - --media-fg-color: @text; - --media-outline-color: @text; - - .szh-menu__item--disabled { - color: @subtext0; - } - - .button.plain2 { - background-color: @mantle; - } - - .replies-parent-link { - background-color: @surface0 !important; - } - - .account-container { - --original-color: @blue; - - .profile-field, - .stats, - .posting-stats-button { - background-color: @mantle; - -webkit-filter: none; - filter: none; - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/phanpy/catppuccin.user.less b/styles/phanpy/catppuccin.user.less new file mode 100644 index 0000000000..fec686467e --- /dev/null +++ b/styles/phanpy/catppuccin.user.less @@ -0,0 +1,88 @@ +/* ==UserStyle== +@name Phanpy Catppuccin +@namespace github.com/catppuccin/userstyles/styles/phanpy +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/phanpy +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/phanpy/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aphanpy +@description Soothing pastel theme for Phanpy +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("phanpy.social") { + :root:not(:has(.is-light)) { + #catppuccin(@darkFlavor); + } + :root.is-light { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --text-color: @text; + --text-insignificant-color: @subtext0; + --link-color: @accent; + --link-text-color: @accent; + --link-faded-color: @accent; + --link-light-color: @accent; + --button-bg-blur-color: @accent; + --button-bg-color: @accent; + --button-text-color: @base; + --bg-faded-color: @base; + --bg-faded-blur-color: @mantle; + --bg-blur-color: @mantle; + --close-button-bg-color: @mantle; + --close-button-color: @subtext0; + --bg-color: @base; + --link-bg-hover-color: @mantle; + --divider-color: @surface0; + --outline-color: @surface0; + --outline-hover-color: @surface2; + --reblog-faded-color: fade(@mauve, 20%); + --reblog-color: @mauve; + --reply-to-faded-color: fade(@yellow, 20%); + --reply-to-text-color: @yellow; + --reply-to-color: @yellow; + --favourite-color: @red; + --green-color: @green; + --red-color: @red; + --comment-line-color: @surface1; + --media-bg-color: @base; + --media-fg-color: @text; + --media-outline-color: @text; + + .szh-menu__item--disabled { + color: @subtext0; + } + + .button.plain2 { + background-color: @mantle; + } + + .replies-parent-link { + background-color: @surface0 !important; + } + + .account-container { + --original-color: @blue; + + .profile-field, + .stats, + .posting-stats-button { + background-color: @mantle; + -webkit-filter: none; + filter: none; + } + } + } +} diff --git a/styles/phanpy/preview.webp b/styles/phanpy/preview.webp deleted file mode 100644 index 4ba94c5c76..0000000000 --- a/styles/phanpy/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:9cdde84a6f2f0fd2918df126cd193fe6a62278147a0e1c3fd325af83de411974 -size 651110 diff --git a/styles/picrew/README.md b/styles/picrew/README.md index 75fc7176b1..1ed85c45d8 100644 --- a/styles/picrew/README.md +++ b/styles/picrew/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Natalie Raine](https://github.com/Nyatalieeee) +- [Meowcelinee](https://github.com/Meowcelinee)   diff --git a/styles/picrew/catppuccin.user.css b/styles/picrew/catppuccin.user.less similarity index 81% rename from styles/picrew/catppuccin.user.css rename to styles/picrew/catppuccin.user.less index 48969c0e54..9e07443ef4 100644 --- a/styles/picrew/catppuccin.user.css +++ b/styles/picrew/catppuccin.user.less @@ -2,8 +2,8 @@ @name Picrew Catppuccin @namespace github.com/catppuccin/userstyles/styles/picrew @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/picrew -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/picrew/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/picrew/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apicrew @description Soothing pastel theme for Picrew @author Catppuccin @@ -15,48 +15,21 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('picrew.me') { - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); +@-moz-document domain("picrew.me") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); body { background-color: @base !important; @@ -119,20 +92,23 @@ background: @overlay1 !important; &.is-active { - background: @accent-color !important; + background: @accent !important; } } #home { background: @base !important; color: @text !important; } + .smallNewsBox span { + color: @accent !important; + } /* "Information" page (main page) */ .page-info { background-color: @mantle !important; } .sp_title a, .page-info a { - color: @accent-color !important; + color: @accent !important; } .rankA::before { color: @text !important; @@ -141,22 +117,46 @@ .header_bg[data-v-2537399f] { background: linear-gradient(90deg, @surface0, @base); } + /* MOBILE ONLY: ad for downloading the app */ + .sitetop-appDL { + background: @mantle !important; + + .sitetop-appDL_Header .sitetop-appDL_Title .fa { + color: @accent !important; + } + } + /* "Featured Tags" section - directly above Discovery */ + .sitetop-tags { + background: @mantle !important; + + .sitetop-tags_Header .sitetop-tags_Title .fa { + color: @accent !important; + } + .recommended-tag-list .recommended-tag-list-item a { + border-color: @accent !important; + + /* tag icon before tag name */ + &::before { + color: @accent !important; + } + } + } /* "Discovery" section (image is lightbulb) */ .sitetop-Discovery { background: @mantle !important; .sitetop-Discovery_Header { .sitetop-Discovery_Title .fa { - color: @accent-color !important; + color: @accent !important; } .sitetop-DiscoveryList_More a { - background-color: @accent-color !important; + background-color: @accent !important; color: @base !important; } .sitetop-Discovery_More { - color: @accent-color !important; + color: @accent !important; } } } @@ -165,7 +165,7 @@ } /* "Hot Now" section (image is a graph) */ .sitetop-Hot_Title .fa { - color: @accent-color !important; + color: @accent !important; } .sitetop-Hot_CountrySwitch { background-color: @base !important; @@ -175,12 +175,12 @@ } .sitetop-Hot_CountrySwitch_all span::after { - color: @accent-color !important; + color: @accent !important; } input:last-of-type + label span { filter: brightness(-20%) !important; - color: @accent-color !important; + color: @accent !important; } } /* "Updated Image Makers (image (.fa) is bullhorn) */ @@ -188,7 +188,7 @@ background: @mantle !important; } .sitetop-ImagemakerList_Title .fa { - color: @accent-color !important; + color: @accent !important; } .c_btn { background: @surface1 !important; @@ -201,7 +201,7 @@ border-color: @surface2 !important; } &:focus { - box-shadow: 0 0 0 1px @accent-color !important; + box-shadow: 0 0 0 1px @accent !important; } } .sitetop-info { @@ -231,12 +231,12 @@ color: @text !important; } .st-Terms { - border-color: @accent-color !important; + border-color: @accent !important; border-radius: 2px !important; } .st-Terms_Wrapper .st-Terms a, .st-Terms_Wrapper .st-Terms .st-Terms_Body strong { - color: @accent-color !important; + color: @accent !important; } .c_select select { background: @mantle !important; @@ -265,17 +265,17 @@ } .popup { background-color: @base !important; - border-color: @accent-color !important; + border-color: @accent !important; } .popup-header { background-color: @mantle !important; } .popup-body .content a { - color: @accent-color !important; + color: @accent !important; } .bellicon { - color: @accent-color !important; - border-color: @accent-color !important; + color: @accent !important; + border-color: @accent !important; } .close-btn { border-color: @overlay0 !important; @@ -317,10 +317,10 @@ .login-container { .login-form-container { .c_text_right a { - color: @accent-color !important; + color: @accent !important; } .login-form input:focus { - box-shadow: 0 0 0 1px @accent-color !important; + box-shadow: 0 0 0 1px @accent !important; } } hr.sw_hr01 { @@ -343,6 +343,10 @@ /* search page */ .search-Form > fieldset { background: @base !important; + + .search-Form_Keyword .search-Form_KeywordInput:focus { + box-shadow: 0 0 0 1px @accent !important; + } } .search-Form_Keyword { .search-iconBox { @@ -399,7 +403,7 @@ background-color: @base !important; .radioBox_label::before { - background: @accent-color !important; + background: @accent !important; } .radioBox_label::after { border-color: @overlay1 !important; @@ -419,15 +423,45 @@ background: @base !important; } .c_pagination_num.is_current span { - background: @accent-color !important; + background: @accent !important; color: @base !important; } + /* image makers from a specific creator (search) */ + .creator-Header div .creator-Header_Name { + color: @accent !important; + } + .creator-ImagemakerList_Result { + background-color: @mantle !important; + .squareSize a { + .creator-ImagemakerList_UseRange { + li { + div { + background: @mantle !important; + border-color: @surface0 !important; + color: @subtext0 !important; + &::before { + color: @green !important; + } + } + } + } + .imagesizeBox { + background: @surface0 !important; + .imagemaker_size { + background: @surface1 !important; + .creator-ImagemakerList_Creator { + color: @subtext0 !important; + } + } + } + } + } /* creator registration page */ .creator-content .email-register-container .email-register-form input:not([type="checkbox"], [type="radio"]):focus { - box-shadow: 0 0 0 1px @accent-color !important; + box-shadow: 0 0 0 1px @accent !important; } .creator-content .email-register-container @@ -481,16 +515,16 @@ .creator-content { .success { background: @surface0 !important; - border-color: @accent-color !important; + border-color: @accent !important; &::after { - border-left-color: @accent-color !important; - border-bottom-color: @accent-color !important; + border-left-color: @accent !important; + border-bottom-color: @accent !important; } } /* "Terms of Use" and "Privacy Policy" links */ .email-register-container .email-register-form fieldset a { - color: @accent-color !important; + color: @accent !important; } } /* creator page */ @@ -553,7 +587,7 @@ border-top-color: @surface2 !important; } .small > a { - color: @accent-color !important; + color: @accent !important; } /* "Creator Informations" pages (creator/info page) */ .card-header { @@ -604,7 +638,7 @@ color: @text !important; &:focus { - border-color: @accent-color !important; + border-color: @accent !important; } } .tc_canvas-square, @@ -613,8 +647,8 @@ } /* image maker "type" (creator) */ .tc_imagemaker_register_type li :checked + label { - border-color: @accent-color !important; - box-shadow: 0 0 0 2px @accent-color !important; + border-color: @accent !important; + box-shadow: 0 0 0 2px @accent !important; color: @surface1 !important; } .tc_imagemaker_register_type @@ -622,8 +656,8 @@ :checked + label .tc_imagemaker_register_type_name { - background-color: @accent-color !important; - border-bottom-color: @accent-color !important; + background-color: @accent !important; + border-bottom-color: @accent !important; color: @surface1 !important; } .tc_imagemaker_register_type li label { @@ -650,8 +684,8 @@ } .btn-primary, .btn-primary:hover { - background-color: @accent-color !important; - border-color: @accent-color !important; + background-color: @accent !important; + border-color: @accent !important; color: @surface1 !important; } /* image maker list (creator) */ @@ -685,7 +719,7 @@ } } .btn-info:focus { - box-shadow: 0 0 0 0.1rem @accent-color !important; + box-shadow: 0 0 0 0.1rem @accent !important; } .badge-default, .tc_badge_default { @@ -700,12 +734,12 @@ color: @text !important; } .btn-warning { - background-color: @accent-color !important; - border-color: @accent-color !important; + background-color: @accent !important; + border-color: @accent !important; color: @base !important; &:focus { - box-shadow: 0 0 0 0.1rem @accent-color !important; + box-shadow: 0 0 0 0.1rem @accent !important; } } .tc_im_parts_eye .tc_im_parts_eye_icon { @@ -737,11 +771,11 @@ } .tc_parts_ctrl_setting .widget.white-bg.disabled { background-color: @surface0 !important; - border-color: @surface2 !important ; + border-color: @surface2 !important; color: @subtext0 !important; } .tc_c_textmenu li a { - color: @accent-color !important; + color: @accent !important; } .btn:disabled, .btn:disabled:hover { @@ -763,10 +797,10 @@ /* "bulk upload" (creator) */ .tc_bulkupload_type_select .tc_bulkupload_type_tab label { background-color: @surface0 !important; - border-color: @accent-color !important; + border-color: @accent !important; } .tc_bulkupload_color_select li input[type="radio"]:checked + label { - box-shadow: inset 0 0 0 2px @accent-color; + box-shadow: inset 0 0 0 2px @accent; } .tc_color_chip, .tc_bulkupload_option h4 { @@ -787,18 +821,16 @@ color: @subtext1 !important; } .tc_radio_switch label:first-child input[type="radio"] + span { - background-color: @accent-color !important; + background-color: @accent !important; color: @base !important; &::before { - box-shadow: - inset 0 0 0 1px @accent-color, - -2px 0 1px @crust !important; + box-shadow: inset 0 0 0 1px @accent, -2px 0 1px @crust !important; } } /* image maker "rules" (creator) */ .text-info { - color: @accent-color !important; + color: @accent !important; } /* image maker "color palette" (creator) */ .tc_colorgp_detail_parts_deselect li { @@ -845,8 +877,8 @@ color: @text !important; } .page-item.active .page-link { - background: @accent-color !important; - border-color: @accent-color !important; + background: @accent !important; + border-color: @accent !important; color: @surface0 !important; } .tc_items_itemlist.is_style_detail @@ -884,8 +916,8 @@ border-color: @subtext0 !important; } input[type="radio"]:checked + .tc_radio_label { - border-color: @accent-color !important; - color: @accent-color !important; + border-color: @accent !important; + color: @accent !important; } } /* image maker publication (creator) */ @@ -899,7 +931,7 @@ color: @red !important; } .text-navy { - color: @accent-color !important; + color: @accent !important; } /* discovery page */ .discovery_header .discovery_description { @@ -916,9 +948,37 @@ .play-Imagemaker.is_info_show .imagemaker_info_bg { background: @mantle !important; } + /* "Scope of Use" modal */ + .play-Container .vm--container .vm--modal .content-wrapper { + background: @surface0 !important; + + a { + color: @accent !important; + } + table, td { + border-color: @surface0 !important; + } + .useable::before { + color: @accent !important; + } + } + /* "how to use bookmark" modal (not signed in) */ + .simplebar-wrapper + .simplebar-mask + .simplebar-offset + .simplebar-content-wrapper { + background: @surface0 !important; + + header button.close-dialog { + color: @text !important; + } + } .imagemaker_info_wrapper { .imagemaker_info_header { background-color: @mantle !important; + .imagemaker_info_use_range li a { + color: @accent !important; + } } .imagemaker_info_footer { background-color: @mantle !important; @@ -932,16 +992,16 @@ } /* "play" button (outer image maker) */ .imagemaker_info_btn_start { - background: @accent-color !important; - border-color: @accent-color !important; - box-shadow: 0 4px 0 @accent-color !important; + background: @accent !important; + border-color: @accent !important; + box-shadow: 0 4px 0 @accent !important; color: @base !important; } .imagemaker_info_creator a { - color: @accent-color !important; + color: @accent !important; } .imagemaker_info_description a { - color: @accent-color !important; + color: @accent !important; } /* tags (outer image maker) */ .imagemaker_info_use_range li.is_can > div { @@ -952,6 +1012,9 @@ .imagemaker_info_tag a { border-color: @surface2 !important; color: @subtext0 !important; + &::before { + color: @accent !important; + } } .imagemaker_info_use_range li > div { background: @surface0 !important; @@ -960,11 +1023,11 @@ } /* tag icon (outer image maker) */ .imagemaker_info_use_range li.is_can > div::before { - color: @accent-color !important; + color: @accent !important; } } .is_info_show .imagemaker_info_show_btn { - background: @accent-color !important; + background: @accent !important; color: @overlay0 !important; } /* outer bookmark button (outer image maker) */ @@ -994,27 +1057,48 @@ background-color: @surface0 !important; &::before { - box-shadow: inset 0 -5px 0 -1px @accent-color !important; + box-shadow: inset 0 -5px 0 -1px @accent !important; } } li.selected::after { - box-shadow: inset 0 0 0 3px @accent-color !important; + box-shadow: inset 0 0 0 3px @accent !important; } /* switch to outer image maker (inner image maker) */ .imagemaker_info_show_btn { - background-color: @accent-color !important; - border-color: @accent-color !important; + background-color: @accent !important; + border-color: @accent !important; color: @overlay0 !important; } /* bookmark button (inner image maker) */ .play-Imagemaker .bookmark { - background-color: @accent-color !important; - border-color: @accent-color !important; + background-color: @accent !important; + border-color: @accent !important; } .imagemaker_ctrl_btns .btn_show_itemlist.selected { - background-color: @accent-color !important; + background-color: @accent !important; color: @overlay0 !important; } + /* randomize image (inner image maker) */ + .play-Container + .play-Imagemaker + .imagemaker_control_wrapper + .imagemaker_control_popup { + background: @mantle !important; + } + .is_menu_show .imagemaker_menu_btn { + color: @subtext0 !important; + } + .imagemaker_control_panel_wrapper .imagemaker_random_menu { + background: @surface0 !important; + } + .imagemaker_btn_random { + background: @accent !important; + color: @crust !important; + } + .imagemaker_btn_allreset { + background: @surface2 !important; + color: @text !important; + } /* move image element (background) (inner image maker) */ .imagemaker_controller { background-color: @mantle !important; @@ -1023,7 +1107,7 @@ .ctrlbtn-rotate_left, .ctrlbtn-rotate_right { background: @surface0 !important; - color: @accent-color !important; + color: @accent !important; } /* move image element (buttons) (inner image maker) */ .control_position_wrapper .ctrlbtn_position_inner::before, @@ -1034,7 +1118,7 @@ .ctrlbtn-move_down, .ctrlbtn-move_right, .ctrlbtn-move_left { - color: @accent-color !important; + color: @accent !important; } .imagemaker_controller_reset, .imagemaker_controller_reset:hover { @@ -1044,9 +1128,33 @@ /* "Done" button (inner image maker) */ .imagemaker_complete_btn, .imagemaker_complete_btn:hover { - background: @accent-color !important; + background: @accent !important; color: @surface0 !important; } + /* image randomizer complete modal (image complete) */ + .randommaker_result_modal_wrapper { + .randommaker_result_modal { + background-color: @surface0 !important; + border-color: @accent !important; + } + .randommaker_result_message { + background: @yellow !important; + color: @crust !important; + } + .randommaker_result_btns { + .randommaker_again_btn { + background: @yellow !important; + border-color: @yellow !important; + color: @crust !important; + } + .randommaker_complete_btn { + background: @green !important; + border-color: @green !important; + box-shadow: 0 4px 0 @green !important; + color: @crust !important; + } + } + } /* load screen after clicking "Done" (image complete) */ .save_anime { background-color: @base !important; @@ -1058,9 +1166,9 @@ /* download button (image complete) */ .complete-Download_Btn, .complete-Download_Btn:hover { - background: @accent-color !important; - border-color: @accent-color !important; - box-shadow: 0 4px 0 @accent-color !important; + background: @accent !important; + border-color: @accent !important; + box-shadow: 0 4px 0 @accent !important; color: @surface1 !important; } /* "add to bookmarks" area (image complete) */ @@ -1113,17 +1221,21 @@ /* "Search by tag" (image complete) */ .st-Related_Tags .st-Related_Tag a { background: @surface0 !important; - border-color: @accent-color !important; + border-color: @accent !important; color: @text !important; + + &::before { + color: @accent !important; + } } /* "Copied to clipboard" popup (image complete) */ .toasted.sw-Toast.bubble { - background-color: @accent-color !important; + background-color: @accent !important; color: @surface0 !important; } /* fix for bookmark icon (bookmarks page) */ .bookmark-inner h2 .fa { - color: @accent-color !important; + color: @accent !important; } /* support.picrew.me page */ .site-branding { @@ -1144,7 +1256,7 @@ color: @text !important; } .bogo-language-name a { - color: @accent-color !important; + color: @accent !important; } .main-navigation { background-color: @mantle !important; @@ -1155,16 +1267,16 @@ } a:hover, ul > :hover > a { - color: @accent-color !important; + color: @accent !important; } /* "what is picrew?" page (support) */ li.current_page_item > a::before, li.current-menu-item > a::before { - border-bottom-color: @accent-color !important; + border-bottom-color: @accent !important; } .nav-menu > li > a::after, .menu > li > a::after { - color: @accent-color !important; + color: @accent !important; } } .picrew_front-page-content-area.content-area @@ -1173,19 +1285,19 @@ background-color: @mantle !important; } .widget_linkblock { - border-color: @accent-color !important; - box-shadow: 0 0 0 0 @accent-color inset !important; + border-color: @accent !important; + box-shadow: 0 0 0 0 @accent inset !important; color: @text !important; .widget_linkblock_title { - color: @accent-color !important; + color: @accent !important; } .widget_linkblock_text { color: @subtext1 !important; } &:hover { - border-color: @accent-color !important; - box-shadow: 0 0 0 4px @accent-color inset !important; + border-color: @accent !important; + box-shadow: 0 0 0 4px @accent inset !important; color: @text !important; } } @@ -1208,7 +1320,7 @@ } .widget-title, a:hover { - color: @accent-color !important; + color: @accent !important; } } /* aaaaaaaaaaaaaa */ @@ -1218,7 +1330,7 @@ color: @text !important; &:focus { - border-color: @accent-color !important; + border-color: @accent !important; } } #searchsubmit > button, @@ -1245,12 +1357,12 @@ color: @text !important; &::after { - background: @accent-color !important; + background: @accent !important; } } .entry-content h2 { background: @surface0 !important; - border-bottom-color: @accent-color !important; + border-bottom-color: @accent !important; color: @text !important; } .content-wrapper.full-width .hentry::after { @@ -1262,7 +1374,7 @@ border-color: @surface2 !important; a { - color: @accent-color !important; + color: @accent !important; } p.toc_title { color: @text !important; @@ -1275,7 +1387,7 @@ } h3 { border-bottom-color: @surface2 !important; - border-left-color: @accent-color !important; + border-left-color: @accent !important; color: @text !important; } h4 { @@ -1283,7 +1395,7 @@ } h4::before, a { - color: @accent-color !important; + color: @accent !important; } } /* "Create your image maker" page (support) */ @@ -1294,7 +1406,7 @@ border-top-color: @overlay2 !important; > a { - color: @accent-color !important; + color: @accent !important; } } /* "list of creator functions" page (support) */ @@ -1306,7 +1418,7 @@ } .blog { .entry-title a { - color: @accent-color !important; + color: @accent !important; } .entry-body { color: @subtext1 !important; @@ -1314,17 +1426,17 @@ } .wp-pagenavi { span.current { - background: @accent-color !important; - border-color: @accent-color !important; + background: @accent !important; + border-color: @accent !important; color: @surface1 !important; } a { background-color: @base !important; - border-color: @accent-color !important; + border-color: @accent !important; color: @text !important; &:hover { - background-color: @accent-color !important; + background-color: @accent !important; color: @surface1 !important; } } @@ -1335,31 +1447,11 @@ color: @text !important; } .entry-title a { - color: @accent-color !important; + color: @accent !important; } .entry-body { color: @text !important; } } } - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; } - -// vim:ft=less diff --git a/styles/picrew/preview.webp b/styles/picrew/preview.webp deleted file mode 100644 index 01b21a6a48..0000000000 --- a/styles/picrew/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:33dc365a0217624d2feece15a5410c2961adf50d907dcce6a1b82054577dbcd9 -size 722728 diff --git a/styles/pinterest/README.md b/styles/pinterest/README.md index 2354fcd8d7..4465d1fa48 100644 --- a/styles/pinterest/README.md +++ b/styles/pinterest/README.md @@ -10,20 +10,19 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## ๐Ÿ’ Current Maintainer +- [nuexq](https://github.com/nuexq) ## ๐Ÿ’– Past Maintainer -- [Sena](https://github.com/jn-sena) +- [jn-sena](https://github.com/jn-sena)   diff --git a/styles/pinterest/catppuccin.user.css b/styles/pinterest/catppuccin.user.css deleted file mode 100644 index c2835673a8..0000000000 --- a/styles/pinterest/catppuccin.user.css +++ /dev/null @@ -1,785 +0,0 @@ -/* ==UserStyle== -@name Pinterest Catppuccin -@namespace github.com/catppuccin/userstyles/styles/pinterest -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/pinterest -@version 1.1.6 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/pinterest/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apinterest -@description Soothing pastel theme for Pinterest -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document regexp("^https?:\\/\\/(www|[a-z]{2}).pinterest.(com(.(au|mx))?|co(.(uk|kr))?|at|ca|ch|cl|de|dk|es|fr|ie|it|jp|nz|ph|pt|ru|se)\\/.*") { - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - :root { - --color-text-light: if((@lookup = latte), @mantle, @text); - --color-text-dark: if((@lookup = latte), @text, @mantle); - --color-text-default: @text; - --color-text-inverse: @mantle; - --color-text-subtle: @subtext0; - --color-text-error: @accent-color; - --color-text-shopping: @accent-color; - --color-text-link: @accent-color; - - --color-text-icon-light: if((@lookup = latte), @mantle, @subtext1); - --color-text-icon-dark: if((@lookup = latte), @subtext1, @mantle); - --color-text-icon-default: @subtext0; - --color-icon-subtle: @subtext1; - --color-text-icon-inverse: @mantle; - --color-text-icon-subtle: @subtext0; - --color-text-icon-error: @accent-color; - --color-text-icon-brand-primary: @accent-color; - - --color-background-light: if((@lookup = latte), @mantle, @subtext1); - --color-background-dark: if((@lookup = latte), @text, @mantle); - --color-background-default: @base; - --color-background-inverse-base: @subtext1; - --color-background-primary-base: @accent-color; - --color-background-secondary-base: @mantle; - --color-background-secondary-active: @mantle; - --color-background-selected-base: @subtext1; - --color-background-box-default: @mantle; - --color-background-box-selected: @accent-color; - --color-background-box-primary: @accent-color; - --color-background-box-secondary: @surface1; - --color-background-overlay: @surface0; - --color-background-popover-primary: @mantle; - --color-background-popover-secondary: @overlay2; - --color-background-tag-primary-hover: @surface2; - --color-background-box-light: @mantle; - --color-background-button-secondary-default: @surface0; - --color-background-button-secondary-hover: @surface1; - --color-background-button-secondary-active: @surface2; - --color-background-tag-primary-default: @surface1; - --color-background-button-disabled-default: darken(@mantle, 2%); - --color-background-formfield-primary: @surface0; - --color-border-container: @surface1; - --color-border-default: @mantle; - --color-border-popover-primary: @surface0; - --color-border-popover-secondary: @text; - --color-text-success: @green; - --color-text-warning: @yellow; - --color-icon-success: @green; - --color-icon-warning: @yellow; - --color-icon-error: @red; - --color-icon-info: @blue; - --color-icon-recommendation: @mauve; - --color-icon-brand-primary: @accent-color; - --color-icon-inverse: @crust; - --color-background-brand: @accent-color; - --color-background-box-brand: @accent-color; - --color-background-button-primary-default: @accent-color; - --color-background-badge-warning: @yellow; - --color-background-badge-success: @green; - --color-background-education: @blue; - --color-background-primary-strong: @accent-color; - --color-background-shopping: @blue; - - --g-colorTransparentWhite: fadeout(@base, 30%); - --g-colorTransparentDarkGray: fadeout(@mantle, 20%); - --g-colorGray0: @mantle; - --g-colorGray0Hovered: darken(@mantle, 2.5%); - --g-colorGray0Active: darken(@mantle, 5%); - --g-colorGray50: @mantle; - --g-colorGray100: @mantle; - --g-colorGray100Hovered: darken(@surface0, 2.5%); - --g-colorGray100Active: darken(@surface0, 5%); - --g-colorGray200: @subtext0; - --g-colorGray300: @subtext1; - --g-colorRed100: @accent-color; - --g-colorRed100Hovered: darken(@accent-color, 7.5%); - --g-colorRed100Active: darken(@accent-color, 10%); - --g-color-focus: fadeout(@accent-color, 50%); - --color-gray-roboflow-400: @crust; - --color-gray-roboflow-200: @mantle; - - --g-blue: @accent-color; - --color-background-info-base: @blue; - --color-background-error-base: @red; - --color-background-warning-base: @peach; - --color-background-success-base: @green; - } - - body { - background-color: @base; - color: @text; - } - - /* the void (parts not loaded yet) */ - html { - background: @base !important; - } - - .EmojiPickerReact { - --epr-bg-color: @base; - --epr-text-color: @text; - --epr-picker-border-color: @base; - --epr-category-label-bg-color: @base; - --epr-search-input-bg-color: @mantle; - --epr-skin-tone-picker-menu-color: @mantle; - --epr-category-icon-active-color: @accent-color; - --epr-highlight-color: @accent-color; - --epr-hover-bg-color: @surface0; - --epr-focus-bg-color: @surface0; - } - - .C1J, - .LI1.iyn[focus-within], - .iyn:focus, - ._gestalt .react-datepicker__month-select:focus, - ._gestalt .react-datepicker__year-select:focus { - box-shadow: 0 0 0 4px var(--g-color-focus); - } - - .NUb { - color: var(--color-text-inverse); - } - - div[data-test-id="gestalt-avatar-svg"] { - box-shadow: 0 0 0 1px @crust !important; - - text { - fill: @subtext1 !important; - } - } - - svg circle[fill="white"] ~ path[fill="#e60023"] { - fill: @accent-color !important; - } - - div#mweb-unauth-container, - div#mainContainer { - background-color: @base !important; - } - - // "Accounts and more options" popup - div#HeaderAccountOptionsFlyout { - background-color: @mantle; - border-color: transparent; - // external link icons - .Hn_.Uvi.gUZ { - color: var(--color-text-icon-light); - } - } - - // Pin hover icons (and other icons) - .Uvi.gUZ.U9O.kVc { - color: @text; - } - - /* Header & Search */ - - div[data-test-id="header-Header"] div.P_h span.xnr { - color: @text !important; - } - - // search - div[data-test-id="dynamic-search-placeholder"] > div.Lfz.MIw.zI7.iyn.Hsu { - &.ojN, - &.QLY { - display: none; - } - } - - // make top bar match - div[data-test-id="header-background"] { - background-color: @base; - } - - div[data-test-id="one-bar-pill"] { - div { - color: var(--color-text-dark) !important; - } - - .PLa { - color: var(--color-text-icon-light) !important; - } - - .R19 { - color: var(--color-text-icon-dark) !important; - } - } - - div#searchBoxContainer { - // search bar - div.Jea.fev.zI7.iyn.Hsu { - background-color: @mantle !important; - } - - div[style="padding: 0px 0px 0px 16px; height: 100%; border-radius: 24px; box-shadow: rgba(0, 132, 255, 0.5) 0px 0px 0px 4px;"], - div[style="padding: 0px 4px 0px 16px; height: 100%; border-radius: 24px; box-shadow: rgba(0, 132, 255, 0.5) 0px 0px 0px 4px;"] { - box-shadow: 0 0 0 4px var(--g-color-focus) !important; - } - - input { - color: @subtext1 !important; - } - - div.MMh._Y5.feh.s7I.zI7.iyn.Hsu { - background-color: @subtext1 !important; - } - } - - // make selected search suggestions darker - div[aria-selected="true"][data-test-id="search-suggestion"] { - .C9q.Jea.KS5.Lfz.TMJ.XiG.Zr3.zI7.iyn.Hsu { - background-color: @surface0; - } - } - - /* Home */ - - div.moreIdeasBoardRepCarousel - div[data-carousel-indicator="carousel-card"] - div.Jea.XiG.hA-.ho-.zI7.iyn.Hsu { - background-color: @mantle !important; - } - - div.moreIdeasBoardRepCarousel & ~ div.MIw.QLY.zI7.iyn.Hsu { - background: none !important; - } - - // remove bar - .fZz.imm.zI7.iyn.Hsu { - background-color: @base; - } - - // "created" and "saved" button backgrounds - .DUt.XiG._wN.hA-.wYR.zI7.iyn.Hsu { - background-color: transparent !important; - } - - /* Pins */ - - div[data-test-id="PinBetterSaveDropdown"], - div[data-test-id="boardSelectionDropdown"] { - .xnr { - color: var(--color-text-light); - } - - .PLa { - color: var(--color-text-icon-light); - } - } - - div[data-test-id="pinrep-source-link"] { - background-color: @base !important; - - a div { - color: @text !important; - } - } - - div[data-test-id="savedInfo"] a { - background-color: transparent !important; - - div { - color: var(--color-text-light) !important; - } - } - - div[data-test-id="PinTypeIdentifier"] { - background-color: @base !important; - color: @text !important; - } - - div[data-test-id="persistent-one-click-save"] { - div[style="background-color: rgba(255, 255, 255, 0.85);"] { - background-color: @mantle !important; - } - - a { - background-color: transparent !important; - } - } - - div[style="padding-bottom: 100%; box-shadow: rgb(255, 255, 255) 0px 0px 0px 1px;"] { - box-shadow: 0 0 0 1px @crust !important; - } - - div[data-test-id="toast"] span div { - color: @mantle !important; - } - - // board name to save to preview / dropdown - .tBJ.dyH.iFc.sAJ.B1n.zDA.IZT.H2s.CKL { - color: var(--color-text-light) !important; - } - - // back of send and ... buttons on pins - .x8f.INd._O1.KS5.mQ8.NSs { - background-color: @crust !important; - } - - // Save button background - .akY.KI_.Hsu.USg.CCY.S9z.z_v.BG7.LDc.xD4.fZz.hUC.adn.Rk4.d24._O1.KS5.mQ8.Tbt.L4E.jKZ { - background-color: @accent-color !important; - //color: @text !important; - } - - // Save button text - .tBJ.dyH.iFc.sAJ.B1n.tg7.IZT.H2s { - color: var(--color-text-light) !important; - } - - // Saved button background - .akY.KI_.Hsu.USg.CCY.S9z.z_v.BG7.LDc.xD4.fZz.hUC.kJo.gSJ.d24._O1.KS5.mQ8.Tbt.L4E.jKZ { - background-color: @surface2 !important; - border-color: transparent; - } - - // board picker flyout button - button[aria-label="save button"] { - .RCK.Hsu.USg.adn.CCY.NTm.KhY.S9z.Vxj.aZc.Zr3.hA-.Il7.hNT.BG7.hDj._O1.KS5.mQ8.Tbt.L4E { - background-color: @accent-color; - color: @accent-color; - } - } - - // "Saved to __" popup text - .tBJ.dyH.iFc.j1A.X8m.zDA.swG { - color: var(--color-text-light) !important; - } - - /* Pin page */ - - // comment bar - div[data-test-id="inline-comment-composer-container"] { - border-color: transparent !important; - background: transparent !important; - } - div.public-DraftEditorPlaceholder-root { - color: @subtext1!important; - } - .LJB.Pw5.XgI.fev.ujU.wsz.zI7.iyn.Hsu { - border-color: @surface0 !important; - } - - div[data-test-id="more-description-container"], - div[data-test-id="less-description-container"] { - background-color: @base !important; - } - - div[data-test-id="truncated-text"] { - div[data-test-id="more-button"] { - background: linear-gradient( - 90deg, - transparent 0%, - @base 15% - ) !important; - } - - div[style="background: rgb(255, 255, 255);"] { - background-color: @base !important; - } - } - - div[data-test-id="flashlight-button"], - div[data-test-id="flashlight"], - div[data-test-id="shop-button"] { - background-color: fadeout(@base, 20%) !important; - } - - div[data-test-id="flashlight-dot-style"] { - background-color: var(--color-text-light); - } - - div[data-test-id="visual-search-cropper"] { - path.v2cropperHandle { - fill: var(--color-text-light) !important; - } - - use.v2cropSection { - stroke: var(--color-text-light) !important; - } - } - - textarea#pinNoteText { - background-color: transparent; - color: @subtext1; - caret-color: @text; - } - - div[data-test-id="react-button"] { - .Jea.KS5.mQ8.zI7.iyn.Hsu { - //background-color: @accent-color; - color: @accent-color; - } - } - - // remove "More to explore" bar - div[data-test-id="related-modules-header"] { - .Jea.KS5.LCN.X6t.hUC.imm.jzS.mQ8.zI7.iyn.Hsu { - background-color: transparent; - } - } - - /* Video and story pins */ - - div[data-test-id="visual-content-container"] video ~ div { - svg { - color: var(--color-text-icon-light) !important; - } - - div[role="progressbar"] > div { - background-color: var(--color-text-icon-light) !important; - } - } - - div[data-test-id="closeup-data-loaded"] div.Jea.Rym.zI7.iyn.Hsu { - svg, - span { - color: var(--color-text-icon-light) !important; - } - } - - /* Profile */ - - div[data-test-id="profile-board-card"] div, - div#profileBoardsFeed div[data-test-id="board-card"] div, - div[style="border: 1px solid white; border-radius: 16px;"] { - border-color: @crust !important; - } - - div.SaveButton__background--enabled { - background-color: @accent-color !important; - color: @mantle !important; - } - - div[data-test-id="savedInfo"] a h3 { - color: var(--color-text-light) !important; - } - - a[aria-label="More ideas"] { - .TzN { - background-color: @surface0; - } - } - - a[aria-label="Organize"] { - .TzN { - background-color: @surface0; - } - } - - /* Settings */ - - input[type="checkbox"] ~ div { - border-color: @crust !important; - } - - div.tBJ.dyH.iFc.sAJ.xnr.tg7.IZT.swG { - color: var(--color-text-light) !important; - } - - /* Share */ - - div[data-test-id="lego-share-social-bar-auth"] button, - div[data-test-id="copy-link-share-icon-auth"] div.zI7.iyn.Hsu { - background-color: transparent !important; - } - - div[data-test-id="email-share-button-auth"] svg { - rect { - fill: @mantle !important; - } - - path { - fill: @subtext1 !important; - } - } - - div[data-test-id="sharesheet-contact-item-sent-icon"] svg { - color: @text; - } - - div[data-test-id="sharesheet-contact-item-button"] - div[style="background-color: rgb(239, 239, 239); padding-bottom: 100%;"] { - background-color: @mantle !important; - } - - /* Messages */ - - textarea#messageDraft { - background-color: transparent; - color: @subtext1; - caret-color: @text !important; - } - - div[data-test-id="add-pin-to-conversation"] { - div[style="border: 1px solid rgb(218, 218, 218); box-shadow: rgba(0, 132, 255, 0) 0px 0px 0px 4px; padding: 4px 15px; min-height: 48px; width: 100%;"] { - border-color: @mantle !important; - } - - div[style="border: 1px solid transparent; box-shadow: rgba(0, 132, 255, 0.5) 0px 0px 0px 4px; padding: 4px 15px; min-height: 48px; width: 100%;"] { - box-shadow: 0 0 0 4px var(--g-color-focus) !important; - } - } - - /* Create */ - - div[style="background-color: rgba(255, 255, 255, 0.8); margin: 24px 0px 0px; z-index: 1;"] { - background-color: fadeout(@base, 20%) !important; - } - - input#scrape-view-website-link { - background-color: @base !important; - } - - div[data-test-id="image-from-search-container"] { - --color-text-icon-inverse: @subtext1; - } - - div[data-test-id="storyboard-draft-placeholder-rep"] div.ho-.zI7.iyn.Hsu { - background-color: @mantle !important; - background-image: linear-gradient( - to right, - @mantle 0%, - @crust 20%, - @mantle 40%, - @mantle 100% - ) !important; - } - - div[data-test-id="drafts-container"] { - --color-text-dark: var(--color-text-default); - - div[style="border-color: rgb(17, 17, 17);"] { - border-color: @crust !important; - } - } - - div[data-test-id="drag-behavior-container"] svg { - color: @subtext1; - } - - div[data-test-id="storyboard-pin-card-item"] { - border-color: @crust !important; - } - - button[data-test-id="board-dropdown-select-button"] { - background-color: @base !important; - - span { - color: @subtext1 !important; - } - } - - div[data-test-id="storyboard-interest-tags"] - div[style="background-color: rgb(17, 17, 17);"] { - background-color: @subtext1 !important; - } - - div[data-test-id="editor-canvas-container"] div { - border-color: @accent-color !important; - } - - input[data-test-id="storyboard-editor-details-text-size"] { - background-color: @mantle !important; - color: @text !important; - border-color: @crust !important; - } - - div[data-test-id="storyboard-editor-details-text-color-picker"] { - input { - color: @text !important; - background-color: transparent !important; - } - - .LJB { - border-color: @crust !important; - } - - div[style="height: 40px; box-shadow: rgb(239, 239, 239) 0px 0px 0px 2px inset;"] { - box-shadow: 0 0 0 2px @crust inset !important; - } - } - - div[role="tablist"] button[aria-selected="true"] { - background-color: @crust !important; - } - - input[type="text"], - input[type="search"] { - color: @text; - } - - /* Login */ - - div[data-test-id="signup-default-modal"], - div[data-test-id="login-modal-default"], - div[data-test-id="login-modal-mfa"] { - background-color: @base !important; - - h1 { - color: @text !important; - } - - p { - color: @subtext0 !important; - } - - button[data-test-id="login-signup-toggle"] { - color: @accent-color !important; - } - - button.red.active { - background-color: @accent-color !important; - color: @crust !important; - } - - button.red.active:hover, - button.red.active:focus { - background-color: darken(@accent-color, 2.5%) !important; - } - - span[data-test-id="terms-of-service"], - div[style="margin-top: 15px; color: rgb(51, 51, 51);"] { - color: @subtext1 !important; - - a { - color: @accent-color !important; - } - } - } - - /* Not logged in */ - - div[style="height: 200px; background: linear-gradient(rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 70%);"] { - background: linear-gradient( - fadeout(@base, 100%) 0%, - @base 70% - ) !important; - } - - div#mweb-unauth-container div.HFo.Jea.KS5._he.zI7.iyn.Hsu, - div[data-test-id="header"] - div[style="background-color: rgba(255, 255, 255, 0.95); height: 100%; width: 100%;"] { - background-color: @base !important; - } - - span[data-test-id="terms-of-service"] a { - color: @accent-color !important; - } - - div[data-test-id="breadcrumbs-list"] div.MIw.Rym.zI7.iyn.Hsu, - div[data-test-id="vase-carousel"] div[data-test-id="left-scroll-arrow"] { - background-image: linear-gradient( - to left, - fadeout(@base, 100%), - @base - ) !important; - } - - div[data-test-id="breadcrumbs-list"] div.MIw.p6V.zI7.iyn.Hsu, - div[data-test-id="vase-carousel"] div[data-test-id="right-scroll-arrow"] { - background-image: linear-gradient( - to right, - fadeout(@base, 100%), - @base - ) !important; - } - - div[data-test-id="standard-save-button"] { - span { - color: @mantle !important; - } - // save button hover - .vfW { - background: darken(@accent-color, 10%) !important; - } - } - - /* Other */ - - div[data-test-id="public-beta-page"] { - --color-text-light: @text; - --color-background-recommendation-weak: @crust; - } - - div[data-layout-shift-boundary-id="PageContainer"] { - --color-text-inverse: var(--color-text-light); - } - - // pin side buttons background - .XiG.hUC.wYR.zI7.iyn.Hsu { - background: @base !important; - } - // pin external link on hover - .Jea.KS5.MIw.RDc.Rym.b8T.ho-.ojN.rDA.zI7.iyn.Hsu { - background: @surface0 !important; - } - // pin body shadow - [data-test-id="closeup-body-landscape"] { - .Mhr.l7T.zI7.iyn.Hsu { - box-shadow: 0 1px 20px 0 fade(@text, 10%) !important; - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/pinterest/catppuccin.user.less b/styles/pinterest/catppuccin.user.less new file mode 100644 index 0000000000..895b331087 --- /dev/null +++ b/styles/pinterest/catppuccin.user.less @@ -0,0 +1,275 @@ +/* ==UserStyle== +@name Pinterest Catppuccin +@namespace github.com/catppuccin/userstyles/styles/pinterest +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/pinterest +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/pinterest/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apinterest +@description Soothing pastel theme for Pinterest +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document regexp( + "^https?:\\/\\/(www|[a-z]{2}).pinterest.(com(.(au|mx))?|co(.(uk|kr))?|at|ca|ch|cl|de|dk|es|fr|ie|it|jp|nz|ph|pt|ru|se)\\/.*" + ) { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + &, + body { + color: @text; + background: @base; + } + + --sema-color-background-default: @base; + --sema-color-background-secondary: @surface0; + --sema-color-hover-background-secondary: @surface1; + --sema-color-background-tertiary: @overlay0; // send message to conversation button + --sema-color-hover-background-tertiary: @overlay2; + --sema-color-text-default: @text; + --sema-color-text-subtle: @subtext1; + --sema-color-text-link: @accent; // links / messages username + --sema-color-text-dark: @text; // commenter username / bar pills text + --sema-color-text-light: if( + @flavor = latte, + @base, + @text + ); // Explore suggested articles link + --sema-color-icon-primary: @accent; // logo + --sema-color-icon-inverse: @mantle; + --sema-color-border-decorative: @surface2; + --sema-color-border-interactive: @overlay0; // form inputs + --sema-color-hover-border-interactive: @overlay1; + --sema-color-border-focus-outer-default: @accent; + --sema-color-border-focus-inner-default: @base; + --sema-color-border-disabled: @surface1; + --sema-color-icon-disabled: @subtext0; // board actions in organize mode + + /* Pins */ + --sema-color-background-primary: @accent; + --sema-color-hover-background-primary: darken(@accent, 5%); + --sema-color-background-wash-light: @base; + --sema-color-pressed-background-primary: darken(@accent, 5%); + --comp-button-color-background-primary-selected: @surface1; // select dropdown + --comp-button-color-background-tertiary-semi-transparent-default: fade( + @base, + 50% + ); // pin action + --comp-button-color-hover-background-tertiary-semi-transparent-default: fade( + @base, + 50% + ); + + [data-test-id="more-description-container"] { + background-color: @base !important; + [style*="background: linear-gradient"] { + background: linear-gradient(90deg, transparent 0%, @base 100%) + !important; + } + } + [data-test-id="closeup-metadata-details-divider"] { + border-top-color: var(--sema-color-border-decorative) !important; + } + [data-test-id="PinBetterSaveDropdown"] { + --sema-color-text-inverse: @text; + --sema-color-icon-inverse: @text; + } + + --sema-color-text-error: @red; + --sema-color-background-error-default: @maroon; + --sema-color-icon-error: @red; + --sema-color-border-error: @red; + + /* Boards */ + --sema-color-background-checked: @accent; // "Secret" toggle + --sema-color-hover-background-checked: darken(@accent, 5%); + --sema-color-pressed-background-checked: darken(@accent, 10%); + --comp-switch-color-background-container-enabled-off: @surface2; + --comp-switch-color-hover-background-container-enabled-off: @overlay0; + --comp-button-color-hover-background-secondary-default: @surface1; // "Cancel" button hover + + [data-test-id="profile-board-card"] [style*="border-color: white;"] { + // pin preview collage images + border-color: @base !important; + } + + --sema-color-border-inverse: @base; // around profile pictures under previews + --sema-color-pressed-background-default: @surface2; // "Edit" icon / edit modal "X" icon buttons + --comp-button-color-pressed-background-secondary-default: @surface2; // active "View profile" button + --sema-color-pressed-background-elevation: @surface2; // plus action + + // "select and reorder" / organize + [data-test-id="pinRepSelectionBorder"] { + &[style*="border-color: rgb(255, 255, 255);"] { + border-color: @base !important; + } + &[style*="box-shadow: rgb(255, 255, 255) 0px 0px 0px 3px inset;"] { + box-shadow: @accent 0 0 0 3px inset !important; + } + } + + /* Sidebar */ + --sema-color-icon-default: @text; + --sema-color-hover-background-default: @surface0; + --base-color-grayscale-100: @surface0; // border + [aria-label="You have new Updates"] { + --sema-color-text-light: @base; // notification badge + } + // Explore + [data-test-id="topic-rep-title"] { + --sema-color-text-inverse: @text; // Explore categories + } + --sema-color-background-elevation: @mantle; + --sema-color-hover-background-elevation: @base; + // Create + --sema-color-icon-dark: @text; + [data-test-id="drag-behavior-container"] { + --sema-color-text-default: if( + @flavor = latte, + @text, + @surface2 + ); // drag container error + } + // Tooltips + --sema-color-background-inverse: @text; + --sema-color-text-inverse: @base; + + /* Search */ + --sema-color-icon-subtle: @overlay2; + + #searchBoxContainer > div { + background-color: @mantle !important; + + > div[style*="box-shadow:"] { + // on focus + box-shadow: fade(@accent, 50%) 0 0 0 4px !important; + } + + // divider + [style*="background:#d8d8d8;"], + [style*="background: rgb(216, 216, 216);"] { + background: @surface1 !important; + } + + input { + color: @subtext1 !important; + } + } + + [id^="SuggestionGroup-Option"][aria-selected="true"] > a > div { + background-color: @surface1; + } + + /* Home */ + [data-test-id="homefeed-feed"] + div:has( + > [data-root-margin="more-ideas-tabs"] + )[style*="background-color: rgb(255, 255, 255);"] { + background-color: @base !important; + } + + --sema-color-background-selected: @accent; // active tab underline + --sema-color-hover-background-selected: darken(@accent, 5%); + --sema-color-pressed-background-selected: darken(@accent, 10%); + + // share modal + [data-test-id="lego-share-social-bar-auth"] button { + background-color: @base !important; + } + + /* Settings */ + --sema-color-text-disabled: @overlay2; // disabled "Reset"/"Save" buttons + + /* Messages */ + textarea#messageDraft { + background-color: transparent !important; + color: @subtext1; + caret-color: @text !important; + } + + div[data-test-id="add-pin-to-conversation"] { + div[style="border: 1px solid rgb(218, 218, 218); box-shadow: rgba(0, 132, 255, 0) 0px 0px 0px 4px; min-height: 48px; width: 100%;"] { + border-color: @mantle !important; + } + + div[style="border: 1px solid transparent; box-shadow: rgba(0, 132, 255, 0.5) 0px 0px 0px 4px; min-height: 48px; width: 100%;"] { + box-shadow: fade(@accent, 50%) 0 0 0 4px !important; + } + } + + /* Loading */ + .mainContainer + > div[style*="background-color: rgba(255, 255, 255, 0.5); height: 100%; width: 100%; z-index: 1;"] { + background-color: @base !important; + } + + /* Emoji Picker */ + .EmojiPickerReact { + --epr-bg-color: @base; + --epr-text-color: @text; + --epr-picker-border-color: @base; + --epr-category-label-bg-color: @base; + --epr-search-input-bg-color: @mantle; + --epr-skin-tone-picker-menu-color: @mantle; + --epr-category-icon-active-color: @accent; + --epr-highlight-color: @accent; + --epr-hover-bg-color: @surface0; + --epr-focus-bg-color: @surface0; + } + + /* suggestion bar */ + --sema-color-pressed-background-secondary: @surface2; + [data-test-id="one-bar-pill"] { + --sema-color-text-dark: if(@flavor = latte, @text, @base); + } + [data-test-id="one-bar-navigation-arrows"] { + &[style*="to left"]:not([style*="to right"]) { + background: linear-gradient(to left, @base, transparent 40px) + !important; + } + &[style*="to right"]:not([style*="to left"]) { + background: linear-gradient(to right, @base, transparent 40px) + !important; + } + &[style*="to left"][style*="to right"] { + background: + linear-gradient(to left, @base, transparent 40px), + linear-gradient(to right, @base, transparent 40px) !important; + } + } + [data-test-id="multi-select-filter-fade-bottom-edge"] { + background: linear-gradient(0deg, @base 0%, transparent 100%) !important; + } + + /* Toasts */ + --comp-toast-color-background-default: @overlay2; + + /* SaveButton */ + [data-test-id="SaveButton"] > [class^="SaveButton"] { + // Your saved ideas pins "Save" button + background-color: var(--sema-color-background-primary); + &:hover { + background-color: var(--sema-color-hover-background-primary); + } + } + } +} diff --git a/styles/pinterest/preview.webp b/styles/pinterest/preview.webp deleted file mode 100644 index 0ce2a8d5e5..0000000000 --- a/styles/pinterest/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6cf40c53dbf0111adaad7f35fc7e5152135d55e5fdead4dfd2dc0c6da7a97812 -size 572986 diff --git a/styles/planet-minecraft/README.md b/styles/planet-minecraft/README.md index 0fc04123c6..c44ac5bc36 100644 --- a/styles/planet-minecraft/README.md +++ b/styles/planet-minecraft/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Amelia Rose](https://github.com/Nyameliaaaa) +- [Nyameliaaaa](https://github.com/Nyameliaaaa)   diff --git a/styles/planet-minecraft/catppuccin.user.css b/styles/planet-minecraft/catppuccin.user.less similarity index 62% rename from styles/planet-minecraft/catppuccin.user.css rename to styles/planet-minecraft/catppuccin.user.less index 7cbf0df7b3..4b251da78f 100644 --- a/styles/planet-minecraft/catppuccin.user.css +++ b/styles/planet-minecraft/catppuccin.user.less @@ -2,8 +2,8 @@ @name Planet Minecraft Catppuccin @namespace github.com/catppuccin/userstyles/styles/planet-minecraft @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/planet-minecraft -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/planet-minecraft/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/planet-minecraft/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aplanet-minecraft @description Soothing pastel theme for Planet Minecraft @author Catppuccin @@ -15,56 +15,19 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + @-moz-document domain("planetminecraft.com") { [data-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - [data-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); --body-bg: @crust; --header-bg: @base; @@ -73,10 +36,10 @@ --menu-bg: @surface0; --menu-color: @subtext1; --menu-selected-bg: @surface1; - --menu-selected-color: @accent-color; + --menu-selected-color: @accent; --footer-bg: @mantle; --bg-navbar: @mantle; - --tab-selected: @accent-color; + --tab-selected: @accent; --input-bg: @surface0; --dark-mid-bg: @base; --title-color: @text; @@ -84,13 +47,13 @@ --text-color-medium: @subtext0; --text-color-light: @subtext1; --border-color: @base; - --footer-a-color: @accent-color; - --nav-hover: @accent-color; + --footer-a-color: @accent; + --nav-hover: @accent; --stat-color: @red; - --a-color: @accent-color; - --a-hover: @accent-color; - --a-selected: fade(@accent-color, 80%); - --tab-hover: fade(@accent-color, 80%); + --a-color: @accent; + --a-hover: @accent; + --a-selected: fade(@accent, 80%); + --tab-hover: fade(@accent, 80%); --tab-color: @subtext0; --nav-color: @text; --widget-wrap-bg: @mantle; @@ -107,23 +70,23 @@ --notice-bg: @overlay0; --notice-color: @text; --menu-disabled-color: @crust; - --control-bg: @accent-color; - --a-visited: @accent-color; + --control-bg: @accent; + --a-visited: @accent; --nav-bar-border: none; --feed-alt-bg: @surface1; - --nav-selected: @accent-color; + --nav-selected: @accent; .tab_options > ul > li.currentpage, .tab_options > ul > li.ui-state-active, .tab_options > ul > li:hover { - border-bottom-color: @accent-color; + border-bottom-color: @accent; } .site_btn_secondary { color: @subtext1; background: @surface1; &:hover { - color: @accent-color; + color: @accent; background: fade(@surface1, 80%); } } @@ -136,14 +99,14 @@ .vert_menu > ul > li:only-child > a.current_select, .vert_menu > ul > li > a.current_select { color: @base; - background: @accent-color; + background: @accent; &:not(:disabled, [data-disabled="disabled"]):hover { - background: fade(@accent-color, 80%); + background: fade(@accent, 80%); } } #profile-bar #profile-actions .togglable.selected { - background: @accent-color; + background: @accent; color: @base; } @@ -152,7 +115,7 @@ } /* because the icons on the display mode buttons are white, we cant have white base here, so we improvise for latte */ - & when (@lookup = latte) { + & when (@flavor = latte) { #display_modes a { background: @text !important; box-shadow: none !important; @@ -184,7 +147,7 @@ } color: @text !important; - background: @accent-color !important; + background: @accent !important; } .content-actions li .material-icons { @@ -192,7 +155,7 @@ } } - & when not (@lookup = latte) { + & when not(@flavor = latte) { #display_modes a { background: @base !important; box-shadow: none !important; @@ -201,7 +164,7 @@ #display_modes a.selected, #display_modes a:hover { - background: @accent-color; + background: @accent; } .navigation-wrap .navmenu a { @@ -310,7 +273,7 @@ } #popular-reel .caption { - & when (@lookup = latte) { + & when (@flavor = latte) { background: fade(@text, 50%) !important; .pop-title { @@ -324,7 +287,7 @@ } } - & when not (@lookup = latte) { + & when not(@flavor = latte) { background: fade(@base, 50%) !important; .pop-title { @@ -353,9 +316,9 @@ .content-actions li .link:hover, .content-actions li a:hover { .material-icons { - color: @accent-color !important; + color: @accent !important; } - color: @accent-color !important; + color: @accent !important; background: @surface1 !important; } @@ -374,17 +337,7 @@ input:focus, select:focus, textarea:focus { - border-color: @accent-color; + border-color: @accent; } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/planet-minecraft/preview.webp b/styles/planet-minecraft/preview.webp deleted file mode 100644 index e3a6af5c31..0000000000 --- a/styles/planet-minecraft/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:08d8e3590149e8449d943c71cb085d7b54e3324640909b5c2f7b2d17c0eba719 -size 496642 diff --git a/styles/poe/README.md b/styles/poe/README.md new file mode 100644 index 0000000000..b50cfb329d --- /dev/null +++ b/styles/poe/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Poe + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [TheAnonymousCrusher](https://github.com/TheAnonymousCrusher) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/poe/catppuccin.user.less b/styles/poe/catppuccin.user.less new file mode 100644 index 0000000000..9264714345 --- /dev/null +++ b/styles/poe/catppuccin.user.less @@ -0,0 +1,122 @@ +/* ==UserStyle== +@name Poe Catppuccin +@namespace github.com/catppuccin/userstyles/styles/poe +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/poe +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/poe/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apoe +@description Soothing pastel theme for Poe +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +// Using `url-prefix `instead of `domain` prevents a broken theme on the Help Center (https://help.poe.com/). +@-moz-document url-prefix("https://poe.com") { + :root:not(.dark, .light) { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + :root { + &.dark { + #catppuccin(@darkFlavor); + } + &.light { + #catppuccin(@lightFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --pdl-bg-base: @mantle; + --pdl-bg-faint: @base; + --pdl-bg-muted: @surface0; + --pdl-bg-subtle: @surface1; + --pdl-bg-emphasis: @surface2; + + --pdl-fg-base: @text; + --pdl-fg-muted: @subtext1; + --pdl-fg-subtle: @subtext0; + + --pdl-bg-reverse: @text; + --pdl-fg-reverse: @base; + + --pdl-border-base: @surface1; + --pdl-border-emphasis: @overlay0; + + --pdl-accent-base: @accent; + --pdl-accent-on-accent: @base; + --pdl-fg-white: @base; + + --code-block-bg: @base; + + --pdl-error-base: @red; + + --pdl-success-base: @green; + --pdl-success-muted: fade(@green, 60%); + --pdl-success-on-success: @base; + + // Settings + --pdl-action-default-bg: @mantle; + --pdl-action-disabled-bg: @surface0; + --pdl-action-default-border: @surface2; + --pdl-action-hover-border: @overlay0; + --pdl-action-hover-border-accent: @accent; + --pdl-action-default-fg: @text; + --pdl-action-disabled-fg: @overlay2; + --violet-9: @accent; + --violet-10: @accent; + --violet-11: @accent; + --ruby-10: @red; // danger button text + --ruby-11: @red; // danger button hover text + + textarea { + color: @text; + } + + [class^="Tooltip_root"] { + --pdl-tooltip-bg: @surface0; + --pdl-tooltip-color: @text; + } + + // API + ul[data-pdl-sidebar-menu] { + li[data-pdl-sidebar-menu-item] { + --item-active-bg-color: @surface0; + --item-hover-bg-color: @surface1; + } + } + + // Login + --fade-bottom-gradual: linear-gradient( + to bottom, + transparent 0%, + fade(@crust, 50%) 60%, + @mantle 90%, + @mantle 100% + ); + --fg-base--ignore-light-mode: @text; + + // Logo (Login, Chat) + img[src^="https://psc2.cf2.poecdn.net/assets/_next/static/media/poeFullMultibot"], + img[src^="https://psc2.cf2.poecdn.net/assets/_next/static/media/poeFullWhiteMultibot"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } +} diff --git a/styles/porkbun/README.md b/styles/porkbun/README.md index af29f6b533..cd963eb75e 100644 --- a/styles/porkbun/README.md +++ b/styles/porkbun/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/porkbun/catppuccin.user.css b/styles/porkbun/catppuccin.user.less similarity index 55% rename from styles/porkbun/catppuccin.user.css rename to styles/porkbun/catppuccin.user.less index beddee6cd3..65de0823f0 100644 --- a/styles/porkbun/catppuccin.user.css +++ b/styles/porkbun/catppuccin.user.less @@ -2,8 +2,8 @@ @name Porkbun Catppuccin @namespace github.com/catppuccin/userstyles/styles/porkbun @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/porkbun -@version 0.0.5 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/porkbun/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/porkbun/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aporkbun @description Soothing pastel theme for Porkbun @author Catppuccin @@ -15,59 +15,21 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('porkbun.com') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("porkbun.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); &, body { @@ -79,11 +41,11 @@ --porkbun_danger: @red; --porkbun_warning: @yellow; --porkbun_success: @green; - --porkbun_pink_hover: darken(@accent-color, 5%); - --porkbun_pink: @accent-color; + --porkbun_pink_hover: darken(@accent, 5%); + --porkbun_pink: @accent; --porkbun_gold: @yellow; - --porkbun_pink_light: lighten(@accent-color, 5%); - --porkbun_pink_medium: @accent-color; + --porkbun_pink_light: lighten(@accent, 5%); + --porkbun_pink_medium: @accent; --porkbun_dark_gray: @text; --porkbun_light_gray: @surface0; --porkbun_medium_gray: @overlay1; @@ -149,10 +111,10 @@ background-color: transparent; .hsds-beacon button { - background-color: @accent-color; + background-color: @accent; [class*="FabButtoncss__FabBackgroundUI"] > svg { - fill: @accent-color; + fill: @accent; } > span { @@ -178,12 +140,12 @@ } .btn-primary { - background-color: @accent-color; - border-color: @accent-color; + background-color: @accent; + border-color: @accent; color: @crust; &:hover { - background-color: darken(@accent-color, 5%); + background-color: darken(@accent, 5%); } } @@ -250,7 +212,7 @@ border-color: @surface0; &:focus { - box-shadow: 0 0 8px fade(@accent-color, 50%); + box-shadow: 0 0 8px fade(@accent, 50%); } } @@ -306,7 +268,7 @@ #headerBrandLogo, #footerLogo { @svg: escape( - '' + '' ); content: url("data:image/svg+xml,@{svg}"); } @@ -390,13 +352,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/porkbun/preview.webp b/styles/porkbun/preview.webp deleted file mode 100644 index 1c147df05b..0000000000 --- a/styles/porkbun/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:b45a89d3fd467d6320b49d11dcbd035637ad542364862ac5beacb7989e2efedc -size 90800 diff --git a/styles/pronouns.cc/README.md b/styles/pronouns.cc/README.md new file mode 100644 index 0000000000..c684be57a8 --- /dev/null +++ b/styles/pronouns.cc/README.md @@ -0,0 +1,37 @@ + + + +

+ Logo
+ + Catppuccin for pronouns.cc + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [comfysage](https://github.com/comfysage) + +## ๐Ÿ’– Past Maintainer +- [NeonGamerBot-QK](https://github.com/NeonGamerBot-QK) + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/pronouns.cc/catppuccin.user.less b/styles/pronouns.cc/catppuccin.user.less new file mode 100644 index 0000000000..12cd181a74 --- /dev/null +++ b/styles/pronouns.cc/catppuccin.user.less @@ -0,0 +1,230 @@ +/* ==UserStyle== +@name pronouns.cc Catppuccin +@namespace github.com/catppuccin/userstyles/styles/pronouns.cc +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/pronouns.cc +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/pronouns.cc/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apronouns.cc +@description Soothing pastel theme for pronouns.cc +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("pronouns.cc") { + :root[data-bs-theme="dark"] { + #catppuccin(@darkFlavor); + .bg-dark { + --bs-bg-opacity: 1; + background-color: rgba( + var(--bs-lightt-rgb), + var(--bs-bg-opacity) + ) !important; + } + } + :root[data-bs-theme="light"] { + #catppuccin(@lightFlavor); + .bg-light { + --bs-bg-opacity: 1; + background-color: rgba( + var(--bs-darkk-rgb), + var(--bs-bg-opacity) + ) !important; + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + .form-floating input::placeholder { + color: transparent !important; + } + .form-control:focus { + border-color: @accent; + box-shadow: 0 0 0 0.25rem fade(@accent, 25%); + } + --bs-border-color: @surface1; + --bs-border-color-translucent: @surface0; + .modal { + --bs-modal-bg: @crust; + --bs-modal-border-color: var(--bs-border-color-translucent); + --bs-modal-header-border-color: var(--bs-border-color); + --bs-modal-footer-border-color: var(--bs-border-color); + } + .dropdown-menu { + --bs-dropdown-link-active-color: @crust; + --bs-dropdown-link-active-bg: @accent; + } + .toast { + --bs-toast-color: @text; + background-color: darken(@surface0, 5%); + } + .toast-header { + color: @text; + background-color: @surface0; + } + .toast-body { + color: @text; + } + --bs-badge-color: @text; + --bs-body-color: @text; + --bs-body-color-rgb: #lib.rgbify(@text)[]; + --bs-body-bg: @crust; + --bs-darkk-rgb: #lib.rgbify(@base); + --bs-lightt-rgb: #lib.rgbify(@base); + --bs-emphasis-color: @accent; + --bs-emphasis-color-rgb: #lib.rgbify(@accent)[]; + --bs-secondary-color: @subtext0; + --bs-secondary-color-rgb: @subtext0; + --bs-secondary-bg: @base; + --bs-secondary-bg-rgb: #lib.rgbify(@base)[]; + --bs-tertiary-color: @subtext1; + --bs-tertiary-color-rgb: @subtext1; + --bs-tertiary-bg: @surface0; + --bs-tertiary-bg-rgb: #lib.rgbify(@surface0)[]; + --bs-primary-text-emphasis: @accent; + --bs-secondary-text-emphasis: @subtext1; + --bs-success-text-emphasis: @green; + --bs-info-text-emphasis: @teal; + --bs-warning-text-emphasis: @yellow; + --bs-danger-text-emphasis: @red; + --bs-light-text-emphasis: @subtext0; + --bs-primary-bg-subtle: @mantle; + --bs-secondary-bg-subtle: @base; + --bs-primary-border-subtle: @blue; + --bs-secondary-border-subtle: @overlay0; + --bs-success-border-subtle: @green; + --bs-info-border-subtle: @teal; + --bs-warning-border-subtle: @yellow; + --bs-danger-border-subtle: @red; + --bs-light-border-subtle: @overlay1; + --bs-dark-border-subtle: @surface1; + --bs-heading-color: inherit; + --bs-link-color: @accent; + --bs-link-color-rgb: #lib.rgbify(@accent)[]; + --bs-link-hover-color: @accent; + --bs-link-hover-color-rgb: #lib.rgbify(@accent)[]; + + --bs-code-color: @pink; + --bs-highlight-color: @rosewater; + .list-group { + --bs-list-group-color: var(--bs-body-color); + --bs-list-group-bg: var(--bs-body-bg); + --bs-list-group-action-color: var(--bs-secondary-color); + --bs-list-group-action-hover-color: var(--bs-emphasis-color); + --bs-list-group-action-hover-bg: var(--bs-tertiary-bg); + --bs-list-group-action-active-color: var(--bs-body-color); + --bs-list-group-action-active-bg: var(--bs-secondary-bg); + --bs-list-group-disabled-color: var(--bs-secondary-color); + --bs-list-group-disabled-bg: var(--bs-body-bg); + --bs-list-group-active-color: @base; + --bs-list-group-active-bg: @accent; + --bs-list-group-active-border-color: @accent; + border-radius: var(--bs-list-group-border-radius); + } + // navbar + .navbar { + --bs-navbar-color: @subtext0; + --bs-navbar-hover-color: @subtext0; + --bs-navbar-disabled-color: @subtext1; + --bs-navbar-active-color: @text !important; + --bs-navbar-brand-color: @text !important; + --bs-navbar-brand-hover-color: @text !important; + --bs-navbar-toggler-border-color: @surface0; + } + #colorizedButton( + @color, + @bg, + @border: @bg, + @hv-color: @color, + @hv-bg: darken(@bg, 5%), + @hv-border: @hv-bg, + ) { + --bs-btn-color: @color; + --bs-btn-bg: @bg; + --bs-btn-border-color: @border; + + --bs-btn-hover-color: @hv-color; + --bs-btn-hover-bg: @hv-bg; + --bs-btn-hover-border-color: @hv-border; + + --bs-btn-active-color: @hv-color; + --bs-btn-active-bg: @hv-bg; + --bs-btn-active-border-color: @hv-border; + + --bs-btn-focus-shadow-rgb: #lib.rgbify(@bg)[]; + --bs-btn-disabled-color: @color; + --bs-btn-disabled-bg: @bg; + --bs-btn-disabled-border-color: @border; + } + #coloredButton(@color) { + #colorizedButton( + @crust, + @color, + @color, + @hv-color: @crust, + lighten(@color, 10%), + ); + } + //buttons + .btn-primary { + #colorizedButton( + @base, + @accent, + @hv-bg: lighten(@accent, 10%), + ); + } + .btn-secondary { + #colorizedButton(@text, @surface0, @hv-bg: @surface1); + } + .btn-outline-secondary { + #colorizedButton(@surface1, transparent, @surface1, @subtext0, @surface1); + } + .btn-success { + #coloredButton(@green); + } + .btn-info { + #coloredButton(@teal); + } + .btn-warning { + #coloredButton(@yellow); + } + .btn-danger { + #coloredButton(@red); + } + .form-control { + &::-webkit-file-upload-button, + &::file-selector-button { + background-color: @base; + } + &:hover:not(:disabled, [readonly]) { + &::-webkit-file-upload-button, + &::file-selector-button { + background-color: @surface0; + } + } + } + .btn-close-white, + .btn-close { + --bs-btn-close-color: @surface0; + @svg: escape( + '' + ); + --bs-btn-close-bg: url("data:image/svg+xml,@{svg}"); + --bs-btn-close-opacity: 1; + } + .navbar-toggler-icon { + @svg: escape( + '' + ); + --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,@{svg}"); + } + } +} diff --git a/styles/pronouns.page/README.md b/styles/pronouns.page/README.md index 4eff7855c4..febd9e2fd9 100644 --- a/styles/pronouns.page/README.md +++ b/styles/pronouns.page/README.md @@ -4,19 +4,18 @@

Logo
- Catppuccin for Pronouns.page + Catppuccin for Pronouns.page

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/pronouns.page/catppuccin.user.css b/styles/pronouns.page/catppuccin.user.less similarity index 56% rename from styles/pronouns.page/catppuccin.user.css rename to styles/pronouns.page/catppuccin.user.less index 6c7322be06..6e2bcddaa3 100644 --- a/styles/pronouns.page/catppuccin.user.css +++ b/styles/pronouns.page/catppuccin.user.less @@ -2,8 +2,8 @@ @name Pronouns.page Catppuccin @namespace github.com/catppuccin/userstyles/styles/pronouns.page @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/pronouns.page -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/pronouns.page/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/pronouns.page/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apronouns.page @description Soothing pastel theme for Pronouns.page @author Catppuccin @@ -15,72 +15,45 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('pronouns.page') { +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("pronouns.page"), + domain("pronomen.net"), + domain("pronombr.es"), + domain("pronomejo.net"), + domain("fornovn.fo"), + domain("pronoms.fr"), + domain("pronom.it"), + domain("zaimki.pl") { body:not([data-theme="dark"]) { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } body[data-theme="dark"], body[data-theme="dark"]:not(.reduced-colours) { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); - background-color: @base !important; + background: @base; color: @text !important; --bs-body-color: @text; --bs-body-bg: @base; - --bs-white-rgb: #rgbify(@crust) []; - --bs-primary-rgb: #rgbify(@accent-color) []; - --bs-secondary-rgb: #rgbify(@overlay0) []; + --bs-white-rgb: #lib.rgbify(@crust)[]; + --bs-primary-rgb: #lib.rgbify(@accent)[]; + --bs-secondary-rgb: #lib.rgbify(@overlay0)[]; --bs-secondary-color: @subtext0; --bs-tertiary-bg: @crust; --bs-success-text-emphasis: @green; + --bs-success-rgb: #lib.rgbify(@green)[]; --bs-info-text-emphasis: @sapphire; --bs-warning-text-emphasis: @yellow; --bs-danger-text-emphasis: @red; + --bs-danger-rgb: #lib.rgbify(@red)[]; --bs-light-text-emphasis: @text; --bs-dark-text-emphasis: @subtext1; --bs-heading-color: @text; @@ -93,19 +66,19 @@ .btn-primary { color: @crust; - --bs-btn-bg: @accent-color; + --bs-btn-bg: @accent; } .btn-primary, .btn-outline-primary { - --bs-btn-hover-bg: @accent-color; - --bs-btn-border-color: @accent-color; - --bs-btn-hover-border-color: @accent-color; - --bs-btn-active-bg: @accent-color; - --bs-btn-active-border-color: @accent-color; - --bs-btn-disabled-color: @accent-color; - --bs-btn-disabled-bg: darken(@accent-color, 5%); - --bs-btn-disabled-border-color: @accent-color; + --bs-btn-hover-bg: @accent; + --bs-btn-border-color: @accent; + --bs-btn-hover-border-color: @accent; + --bs-btn-active-bg: @accent; + --bs-btn-active-border-color: @accent; + --bs-btn-disabled-color: @accent; + --bs-btn-disabled-bg: darken(@accent, 5%); + --bs-btn-disabled-border-color: @accent; } .btn-outline-primary { @@ -209,14 +182,14 @@ } .btn-square { - background-color: @accent-color !important; + background-color: @accent !important; } /* Inputs */ .form-check-input:checked { - background-color: @accent-color !important; - border-color: @accent-color !important; + background-color: @accent !important; + border-color: @accent !important; } .form-control { @@ -225,7 +198,7 @@ border-color: @surface0; &:focus { - box-shadow: 0 0 0 0.25rem fade(@accent-color, 50%); + box-shadow: 0 0 0 0.25rem fade(@accent, 50%); } } @@ -244,40 +217,24 @@ } } - .vdp-datepicker__calendar { - background-color: @crust; - border-color: @surface0; - - .disabled { - color: @subtext0; - } - - .prev::after { - border-right-color: @text; - } - .next::after { - border-left-color: @text; - } - - header span:not(.disabled):hover { - background-color: @text; - color: @crust; - - &.prev::after { - border-right-color: @crust; - } - &.next::after { - border-left-color: @crust; - } - } - - .cell.selected { - background-color: @accent-color; + /* Date/calendar input */ + .dp__theme_dark, .dp__theme_light { + --dp-primary-color: @accent; + --dp-text-color: @text; + --dp-hover-text-color: @text; + --dp-background-color: @surface0; + --dp-hover-color: @surface1; + --dp-disabled-color: @surface2; + --dp-icon-color: @subtext0; + --dp-hover-icon-color: @subtext1; + --dp-secondary-color: @subtext0; + + .dp__overlay_cell_active, + .dp__active_date, + .dp__range_end, + .dp__range_start { color: @crust; } - .cell:not(.blank, .disabled):hover { - border-color: @accent-color; - } } /* Header */ @@ -286,7 +243,7 @@ color: @text !important; &:hover { - color: @accent-color !important; + color: @accent !important; } } @@ -294,12 +251,12 @@ border-color: @surface0; &:hover { - border-bottom-color: @accent-color !important; + border-bottom-color: @accent !important; } &.btn.active, &.btn:hover { - border-bottom-color: @accent-color !important; + border-bottom-color: @accent !important; } } @@ -309,8 +266,8 @@ &:hover, &.active { - color: lighten(@accent-color, 5%) !important; - border-inline-start-color: @accent-color !important; + color: lighten(@accent, 5%) !important; + border-inline-start-color: @accent !important; } } @@ -340,7 +297,7 @@ /* Calendar */ .list-group-flare > :first-child { - border-top-color: @accent-color !important; + border-top-color: @accent !important; } .list-group-item { color: @text !important; @@ -348,10 +305,10 @@ border-color: @surface0 !important; } .calendar > .day.day-event { - border-color: @accent-color; + border-color: @accent; &:hover { - background-color: darken(@accent-color, 10%) !important; + background-color: darken(@accent, 10%) !important; .day-number { color: @crust; @@ -360,7 +317,7 @@ } &.day-event-1 { - background-color: @accent-color; + background-color: @accent; color: @crust; } } @@ -373,8 +330,8 @@ } .page-item.active .page-link { color: @crust; - background-color: @accent-color; - border-color: @accent-color; + background-color: @accent; + border-color: @accent; } .page-item.disabled .page-link { color: @text; @@ -406,8 +363,8 @@ .colour-default { color: @text !important; } - .colour-pink { - color: @accent-color !important; + .colour-pink, .text-primary { + color: @accent !important; } .colour-orange { color: @peach !important; @@ -430,7 +387,7 @@ } .nav-pills { - --bs-nav-pills-link-active-bg: @accent-color; + --bs-nav-pills-link-active-bg: @accent; --bs-nav-pills-link-active-color: @crust; } @@ -443,22 +400,22 @@ } a { - color: @accent-color; + color: @accent; - &:hover { - color: lighten(@accent-color, 5%); + &:not(.nav-link.active):hover { + color: lighten(@accent, 5%); } } code { color: @crust; - background-color: @accent-color; + background-color: @accent; border-color: transparent; } /* Share QR code */ [fill="#ff95bb"] { - fill: @accent-color; + fill: @accent; } mark, @@ -468,17 +425,3 @@ } } } - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/pronouns.page/preview.webp b/styles/pronouns.page/preview.webp deleted file mode 100644 index e22bf7fdbd..0000000000 --- a/styles/pronouns.page/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:0ffcecd79b864a506bd6b1b4b9929f1976ff5f0bf2e2343dbe649a860d6e670a -size 91268 diff --git a/styles/proton/README.md b/styles/proton/README.md index b183c1c5a3..d790706efb 100644 --- a/styles/proton/README.md +++ b/styles/proton/README.md @@ -4,27 +4,24 @@

Logo
- Catppuccin for Proton + Catppuccin for Proton

- -

- -

- +

## Usage -> [!NOTE] -> Set Proton Mail's built-in theme to 'Snow' if you're using Latte or 'Carbon' if you're using the others. +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). +> [!NOTE] +> Set Proton Mail's built-in theme to 'Snow' if you're using Latte or 'Carbon' if you're using the others. ## ๐Ÿ’ Current Maintainer -- [soya_daizu](https://github.com/soya-daizu) +- [soya-daizu](https://github.com/soya-daizu)   diff --git a/styles/proton/catppuccin.user.css b/styles/proton/catppuccin.user.css deleted file mode 100644 index cbbafdfce7..0000000000 --- a/styles/proton/catppuccin.user.css +++ /dev/null @@ -1,288 +0,0 @@ -/* ==UserStyle== -@name Proton Catppuccin -@namespace github.com/catppuccin/userstyles/styles/proton -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/proton -@version 0.1.9 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/proton/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aproton -@description Soothing pastel theme for Proton -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document regexp("https://(account|mail|drive|calendar).proton.me/.*$") -{ - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - svg.logo { - @accentH: hue(@accent-color); - @protonH: hue(#6d4aff); - - .replaceColor(@org, @property) { - &[@{property}="@{org}"] { - @hDiff: @protonH - hue(@org); - @{property}: hsl( - @accentH - @hDiff, - saturation(@org) - 30%, - lightness(@org) - ); - } - } - - /* prettier-ignore */ - > path { - .replaceColor(#B8D7FF, fill); - .replaceColor(#8F69FF, fill); - .replaceColor(#6D4AFF, fill); - .replaceColor(#FFBB93, fill); - } - - /* prettier-ignore */ - > defs stop { - .replaceColor(#E3D9FF, stop-color); - .replaceColor(#7341FF, stop-color); - .replaceColor(#6D4AFF, stop-color); - .replaceColor(#AA8EFF, stop-color); - .replaceColor(#06B8FF, stop-color); - .replaceColor(#BFE8FF, stop-color); - .replaceColor(#BFABFF, stop-color); - .replaceColor(#FF50C3, stop-color); - .replaceColor(#B487FF, stop-color); - .replaceColor(#FFC8FF, stop-color); - .replaceColor(#8EFFEE, stop-color); - .replaceColor(#C9C7FF, stop-color); - .replaceColor(#00F0C3, stop-color); - .replaceColor(#FFD580, stop-color); - .replaceColor(#F6C592, stop-color); - .replaceColor(#EBB6A2, stop-color); - .replaceColor(#DFA5AF, stop-color); - .replaceColor(#D397BE, stop-color); - .replaceColor(#C486CB, stop-color); - .replaceColor(#B578D9, stop-color); - .replaceColor(#A166E5, stop-color); - .replaceColor(#8B57F2, stop-color); - .replaceColor(#704CFF, stop-color); - .replaceColor(#B39FFB, stop-color); - .replaceColor(#FFE8DB, stop-color); - .replaceColor(#957AFD, stop-color); - .replaceColor(#FFC6C6, stop-color); - .replaceColor(#FA528E, stop-color); - .replaceColor(#FF8065, stop-color); - .replaceColor(#FFA51F, stop-color); - } - } - - &, - .ui-prominent, - .ui-standard { - #lightenOrDarken(@color, @value) { - @result: if( - @lookup=latte, - lighten(@color, @value), - darken(@color, @value) - ); - } - - #darkenOrLighten(@color, @value) { - @result: if( - @lookup=latte, - darken(@color, @value), - lighten(@color, @value) - ); - } - - --primary-minor-2: #lightenOrDarken(@accent-color, 60%) [ @result]; - --primary-minor-1: #lightenOrDarken(@accent-color, 50%) [ @result]; - --primary: @accent-color; - --primary-major-1: #darkenOrLighten(@accent-color, 4%) [ @result]; - --primary-major-2: #darkenOrLighten(@accent-color, 8%) [ @result]; - --primary-major-3: #darkenOrLighten(@accent-color, 12%) [ @result]; - --primary-contrast: @mantle; - --signal-danger-minor-2: #lightenOrDarken(@maroon, 40%) [ @result]; - --signal-danger-minor-1: #lightenOrDarken(@maroon, 30%) [ @result]; - --signal-danger: @maroon; - --signal-danger-major-1: #darkenOrLighten(@maroon, 4%) [ @result]; - --signal-danger-major-2: #darkenOrLighten(@maroon, 8%) [ @result]; - --signal-danger-major-3: #darkenOrLighten(@maroon, 12%) [ @result]; - --signal-danger-contrast: @mantle; - --signal-warning-minor-2: #lightenOrDarken(@peach, 40%) [ @result]; - --signal-warning-minor-1: #lightenOrDarken(@peach, 30%) [ @result]; - --signal-warning: @peach; - --signal-warning-major-1: #darkenOrLighten(@peach, 4%) [ @result]; - --signal-warning-major-2: #darkenOrLighten(@peach, 8%) [ @result]; - --signal-warning-major-3: #darkenOrLighten(@peach, 12%) [ @result]; - --signal-warning-contrast: @mantle; - --signal-success-minor-2: #lightenOrDarken(@green, 40%) [ @result]; - --signal-success-minor-1: #lightenOrDarken(@green, 30%) [ @result]; - --signal-success: @green; - --signal-success-major-1: #darkenOrLighten(@green, 4%) [ @result]; - --signal-success-major-2: #darkenOrLighten(@green, 8%) [ @result]; - --signal-success-major-3: #darkenOrLighten(@green, 12%) [ @result]; - --signal-success-contrast: @mantle; - --signal-info-minor-2: #lightenOrDarken(@blue, 40%) [ @result]; - --signal-info-minor-1: #lightenOrDarken(@blue, 30%) [ @result]; - --signal-info: @blue; - --signal-info-major-1: #darkenOrLighten(@blue, 4%) [ @result]; - --signal-info-major-2: #darkenOrLighten(@blue, 8%) [ @result]; - --signal-info-major-3: #darkenOrLighten(@blue, 12%) [ @result]; - --signal-info-contrast: @mantle; - --interaction-norm-minor-2: #lightenOrDarken(@accent-color, 40%) [ - @result]; - --interaction-norm-minor-1: #lightenOrDarken(@accent-color, 30%) [ - @result]; - --interaction-norm: @accent-color; - --interaction-norm-major-1: #darkenOrLighten(@accent-color, 4%) [ @result]; - --interaction-norm-major-2: #darkenOrLighten(@accent-color, 8%) [ @result]; - --interaction-norm-major-3: #darkenOrLighten(@accent-color, 12%) [ - @result]; - --interaction-norm-contrast: @mantle; - --interaction-weak-minor-2: #lightenOrDarken(@surface0, 20%) [ @result]; - --interaction-weak-minor-1: #lightenOrDarken(@surface0, 10%) [ @result]; - --interaction-weak: @surface0; - --interaction-weak-major-1: #darkenOrLighten(@surface0, 4%) [ @result]; - --interaction-weak-major-2: #darkenOrLighten(@surface0, 8%) [ @result]; - --interaction-weak-major-3: #darkenOrLighten(@surface0, 12%) [ @result]; - --interaction-weak-contrast: @text; - --text-norm: @text; - --text-weak: @subtext0; - --text-hint: @subtext1; - --text-disabled: @overlay1; - --text-invert: @crust; - --field-norm: @overlay2; - --field-hover: @overlay1; - --field-disabled: @overlay0; - --field-focus: @accent-color; - --field-highlight: fadeout(@accent-color, 30%); - --focus-outline: @accent-color; - --focus-ring: fadeout(@accent-color, 60%); - --border-norm: @overlay0; - --border-weak: @overlay1; - --background-norm: @base; - --background-weak: @mantle; - --background-strong: @crust; - --background-invert: @text; - --interaction-default: transparent; - --interaction-default-hover: fadeout(@overlay1, 80%); - --interaction-default-active: fadeout(@overlay1, 60%); - --shadow-primary-color: red(@accent-color) green(@accent-color) - blue(@accent-color); - --shadow-norm-opacity: 0.5; - --shadow-raised-opacity: 1; - --shadow-lifted-opacity: 0.75; - --backdrop-norm: fadeout(@crust, 50%); - --optional-scrollbar-thumb-color: @surface0; - --optional-scrollbar-thumb-hover-color: @surface2; - --optional-link-norm: var(--interaction-norm-major-1); - --optional-link-hover: var(--interaction-norm-major-2); - --optional-link-active: var(--interaction-norm-major-3); - --optional-background-elevated: @surface0; - --optional-background-lowered: var(--background-norm); - --optional-email-item-unread-background-color: var(--background-weak); - --optional-email-item-read-background-color: var(--background-norm); - --optional-email-item-read-text-color: var(--text-weak); - --optional-mini-calendar-today-color: @text; - --optional-logo-text-proton-color: @text; - --optional-logo-text-product-color: @text; - --favorite-icon-color: @peach; - } - - .ui-prominent { - --background-norm: @mantle; - --background-weak: @base; - --background-strong: @crust; - } - - .button-promotion { - --upgrade-color-stop-1: @red; - --upgrade-color-stop-2: @blue; - } - - .item-container-row:not(.item-is-selected):hover, - .item-container:not(.item-is-selected):hover { - box-shadow: none; - background-color: var(--navigation-current-item-background-color); - color: var(--email-item-unread-text-color); - } - - .message-content:not(.plain) .message-iframe iframe { - color-scheme: light; - } - - @media (min-width: 28.135em) { - .sign-layout-bg { - background: linear-gradient( - 68.66deg, - desaturate(@mantle, 5%) 1.3%, - desaturate(@base, 5%) 50% - ); - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/proton/catppuccin.user.less b/styles/proton/catppuccin.user.less new file mode 100644 index 0000000000..4a4b419865 --- /dev/null +++ b/styles/proton/catppuccin.user.less @@ -0,0 +1,316 @@ +/* ==UserStyle== +@name Proton Catppuccin +@namespace github.com/catppuccin/userstyles/styles/proton +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/proton +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/proton/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aproton +@description Soothing pastel theme for Proton +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document regexp( + "https://(account|mail|drive|calendar|lumo).proton.me/.*$" + ) { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + svg.logo { + @accentH: hue(@accent); + @protonH: hue(#6d4aff); + + .replaceColor(@org, @property) { + &[@{property}="@{org}"] { + @hDiff: @protonH - hue(@org); + @{property}: hsl( + @accentH - @hDiff, + saturation(@org) - 30%, + lightness(@org) + ); + } + } + + /* deno-fmt-ignore */ + path { + .replaceColor(#B8D7FF, fill); + .replaceColor(#8F69FF, fill); + .replaceColor(#6D4AFF, fill); + .replaceColor(#FFBB93, fill); + .replaceColor(#85D4F5, fill); + .replaceColor(#D6F1FC, fill); + } + + /* deno-fmt-ignore */ + defs stop { + .replaceColor(#E3D9FF, stop-color); + .replaceColor(#7341FF, stop-color); + .replaceColor(#6D4AFF, stop-color); + .replaceColor(#AA8EFF, stop-color); + .replaceColor(#06B8FF, stop-color); + .replaceColor(#BFE8FF, stop-color); + .replaceColor(#BFABFF, stop-color); + .replaceColor(#FF50C3, stop-color); + .replaceColor(#B487FF, stop-color); + .replaceColor(#FFC8FF, stop-color); + .replaceColor(#8EFFEE, stop-color); + .replaceColor(#C9C7FF, stop-color); + .replaceColor(#00F0C3, stop-color); + .replaceColor(#FFD580, stop-color); + .replaceColor(#F6C592, stop-color); + .replaceColor(#EBB6A2, stop-color); + .replaceColor(#DFA5AF, stop-color); + .replaceColor(#D397BE, stop-color); + .replaceColor(#C486CB, stop-color); + .replaceColor(#B578D9, stop-color); + .replaceColor(#A166E5, stop-color); + .replaceColor(#8B57F2, stop-color); + .replaceColor(#704CFF, stop-color); + .replaceColor(#B39FFB, stop-color); + .replaceColor(#FFE8DB, stop-color); + .replaceColor(#957AFD, stop-color); + .replaceColor(#FFC6C6, stop-color); + .replaceColor(#FA528E, stop-color); + .replaceColor(#FF8065, stop-color); + .replaceColor(#FFA51F, stop-color); + .replaceColor(#34B8EE, stop-color); + } + } + + &, + .ui-prominent, + .ui-standard { + #lightenOrDarken(@color, @value) { + @result: if( + @flavor = latte, + lighten(@color, @value), + darken(@color, @value) + ); + } + + #darkenOrLighten(@color, @value) { + @result: if( + @flavor = latte, + darken(@color, @value), + lighten(@color, @value) + ); + } + + --primary-minor-2: #lightenOrDarken(@accent, 60%)[]; + --primary-minor-1: #lightenOrDarken(@accent, 50%)[]; + --primary: @accent; + --primary-major-1: #darkenOrLighten(@accent, 4%)[]; + --primary-major-2: #darkenOrLighten(@accent, 8%)[]; + --primary-major-3: #darkenOrLighten(@accent, 12%)[]; + --primary-contrast: @mantle; + --signal-danger-minor-2: #lightenOrDarken(@maroon, 40%)[]; + --signal-danger-minor-1: #lightenOrDarken(@maroon, 30%)[]; + --signal-danger: @maroon; + --signal-danger-major-1: #darkenOrLighten(@maroon, 4%)[]; + --signal-danger-major-2: #darkenOrLighten(@maroon, 8%)[]; + --signal-danger-major-3: #darkenOrLighten(@maroon, 12%)[]; + --signal-danger-contrast: @mantle; + --signal-warning-minor-2: #lightenOrDarken(@peach, 40%)[]; + --signal-warning-minor-1: #lightenOrDarken(@peach, 30%)[]; + --signal-warning: @peach; + --signal-warning-major-1: #darkenOrLighten(@peach, 4%)[]; + --signal-warning-major-2: #darkenOrLighten(@peach, 8%)[]; + --signal-warning-major-3: #darkenOrLighten(@peach, 12%)[]; + --signal-warning-contrast: @mantle; + --signal-success-minor-2: #lightenOrDarken(@green, 40%)[]; + --signal-success-minor-1: #lightenOrDarken(@green, 30%)[]; + --signal-success: @green; + --signal-success-major-1: #darkenOrLighten(@green, 4%)[]; + --signal-success-major-2: #darkenOrLighten(@green, 8%)[]; + --signal-success-major-3: #darkenOrLighten(@green, 12%)[]; + --signal-success-contrast: @mantle; + --signal-info-minor-2: #lightenOrDarken(@blue, 40%)[]; + --signal-info-minor-1: #lightenOrDarken(@blue, 30%)[]; + --signal-info: @blue; + --signal-info-major-1: #darkenOrLighten(@blue, 4%)[]; + --signal-info-major-2: #darkenOrLighten(@blue, 8%)[]; + --signal-info-major-3: #darkenOrLighten(@blue, 12%)[]; + --signal-info-contrast: @mantle; + --interaction-norm-minor-2: #lightenOrDarken(@accent, 40%)[]; + --interaction-norm-minor-1: #lightenOrDarken(@accent, 30%)[]; + --interaction-norm: @accent; + --interaction-norm-major-1: #darkenOrLighten(@accent, 4%)[]; + --interaction-norm-major-2: #darkenOrLighten(@accent, 8%)[]; + --interaction-norm-major-3: #darkenOrLighten(@accent, 12%)[]; + --interaction-norm-contrast: @mantle; + --interaction-weak-minor-2: #lightenOrDarken(@surface0, 20%)[]; + --interaction-weak-minor-1: #lightenOrDarken(@surface0, 10%)[]; + --interaction-weak: @surface0; + --interaction-weak-major-1: #darkenOrLighten(@surface0, 4%)[]; + --interaction-weak-major-2: #darkenOrLighten(@surface0, 8%)[]; + --interaction-weak-major-3: #darkenOrLighten(@surface0, 12%)[]; + --interaction-weak-contrast: @text; + --text-norm: @text; + --text-weak: @subtext0; + --text-hint: @subtext1; + --text-disabled: @overlay1; + --text-invert: @crust; + --text-markdown: @text; + --field-norm: @overlay2; + --field-hover: @overlay1; + --field-disabled: @overlay0; + --field-focus: @accent; + --field-highlight: fade(@accent, 70%); + --focus-outline: @accent; + --focus-ring: fade(@accent, 40%); + --link-norm: @blue; + --link-hover: @lavender; + --link-active: @sky; + --markdown-pre-background: @mantle; + --border-norm: @overlay0; + --border-weak: @surface1; + --background-norm: @base; + --background-weak: @mantle; + --background-strong: @crust; + --background-invert: @text; + --interaction-default: transparent; + --interaction-default-hover: fade(@overlay1, 20%); + --interaction-default-active: fade(@overlay1, 40%); + --shadow-primary-color: red(@accent) green(@accent) blue(@accent); + --shadow-norm-opacity: 0.5; + --shadow-raised-opacity: 1; + --shadow-lifted-opacity: 0.75; + --backdrop-norm: fade(@crust, 50%); + --optional-scrollbar-thumb-color: @surface0; + --optional-scrollbar-thumb-hover-color: @surface2; + --optional-link-norm: var(--interaction-norm-major-1); + --optional-link-hover: var(--interaction-norm-major-2); + --optional-link-active: var(--interaction-norm-major-3); + --optional-background-elevated: @surface0; + --optional-background-lowered: var(--background-norm); + --optional-email-item-unread-background-color: var(--background-weak); + --optional-email-item-read-background-color: var(--background-norm); + --optional-email-item-read-text-color: var(--text-weak); + --optional-mini-calendar-today-color: @text; + --optional-logo-text-proton-color: @text; + --optional-logo-text-product-color: @text; + --favorite-icon-color: @peach; + } + + .ui-prominent { + --background-norm: @mantle; + --background-weak: @base; + --background-strong: @crust; + } + + .button-promotion { + --upgrade-color-stop-1: @red; + --upgrade-color-stop-2: @blue; + } + + .item-container-row:not(.item-is-selected):hover, + .item-container:not(.item-is-selected):hover { + box-shadow: none; + background-color: var(--navigation-current-item-background-color); + color: var(--email-item-unread-text-color); + } + + .message-content:not(.plain) .message-iframe iframe { + color-scheme: light; + } + + @media (min-width: 28.135em) { + .sign-layout-bg { + background: linear-gradient( + 68.66deg, + desaturate(@mantle, 5%) 1.3%, + desaturate(@base, 5%) 50% + ); + } + } + + /* Proton Lumo */ + + header { + a[aria-label="Go to Lumo homepage"] img { + filter: @accent-filter; + } + } + + .whats-new-section { + background: @accent; + } + + .new-label { + background-color: @accent; + color: @crust; + } + + .lumo-sidebar { + background: @mantle; + a.lumo-plus-button svg path { + fill: @accent; + } + } + + .lumo-input-container.ghost-mode { + background-color: @crust; + --ghost-text: @text; + --ghost-text-weak: @subtext0; + .lumo-input { + background-color: @mantle; + } + } + + div[style*="background: rgb(40, 44, 52);"], + div[style*="background: rgb(250, 250, 250);"] { + background: @mantle !important; + + span { + color: @text !important; + } + + span.token[style*="color: rgb(92, 99, 112);"], + span.token[style*="color: rgb(160, 161, 167);"] { + color: @overlay2 !important; + } + + span.token[style*="color: rgb(97, 175, 239);"], + span.token[style*="color: rgb(64, 120, 242);"] { + color: @blue !important; + } + + span.token[style*="color: rgb(152, 195, 121);"], + span.token[style*="color: rgb(80, 161, 79);"] { + color: @green !important; + } + + span.token[style*="color: rgb(209, 154, 102);"], + span.token[style*="color: rgb(183, 107, 1);"] { + color: @peach !important; + } + + span.token[style*="color: rgb(198, 120, 221);"], + span.token[style*="color: rgb(166, 38, 164);"] { + color: @mauve !important; + } + + span.token[style*="color: rgb(224, 108, 117);"], + span.token[style*="color: rgb(228, 86, 73);"] { + color: @red !important; + } + } + } +} diff --git a/styles/proton/preview.webp b/styles/proton/preview.webp deleted file mode 100644 index 2c648c3f3e..0000000000 --- a/styles/proton/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:395d9b953e34e4f27451a3b7c33d4b1a4fcf3a5a0150f991bfb17134386be8d0 -size 34274 diff --git a/styles/pypi/README.md b/styles/pypi/README.md index 0b5e785d54..cc6b10919b 100644 --- a/styles/pypi/README.md +++ b/styles/pypi/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/pypi/catppuccin.user.css b/styles/pypi/catppuccin.user.less similarity index 71% rename from styles/pypi/catppuccin.user.css rename to styles/pypi/catppuccin.user.less index e3ece63c43..ced6ff7bcc 100644 --- a/styles/pypi/catppuccin.user.css +++ b/styles/pypi/catppuccin.user.less @@ -2,8 +2,8 @@ @name PyPI Catppuccin @namespace github.com/catppuccin/userstyles/styles/pypi @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/pypi -@version 0.0.7 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/pypi/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/pypi/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apypi @description Soothing pastel theme for PyPI @author Catppuccin @@ -15,89 +15,27 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('pypi.org') { +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("pypi.org") { @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - --ctp-rosewater: @rosewater; - --ctp-flamingo: @flamingo; - --ctp-pink: @pink; - --ctp-mauve: @mauve; - --ctp-red: @red; - --ctp-maroon: @maroon; - --ctp-peach: @peach; - --ctp-yellow: @yellow; - --ctp-green: @green; - --ctp-teal: @teal; - --ctp-sky: @sky; - --ctp-sapphire: @sapphire; - --ctp-blue: @blue; - --ctp-lavender: @lavender; - --ctp-text: @text; - --ctp-subtext1: @subtext1; - --ctp-subtext0: @subtext0; - --ctp-overlay2: @overlay2; - --ctp-overlay1: @overlay1; - --ctp-overlay0: @overlay0; - --ctp-surface2: @surface2; - --ctp-surface1: @surface1; - --ctp-surface0: @surface0; - --ctp-base: @base; - --ctp-mantle: @mantle; - --ctp-crust: @crust; - - color-scheme: if(@lookup = latte, light, dark); + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); ::selection { - background-color: fade(@accent-color, 30%); - color: unset; - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } + color: unset; // TODO: Basically another case of setting the text color in the selection, but unsetting it here. } body { @@ -115,8 +53,8 @@ &:active, &:focus, &:hover { - border-color: @accent-color !important; - box-shadow: inset 0 0 0 1px @accent-color !important; + border-color: @accent !important; + box-shadow: inset 0 0 0 1px @accent !important; } } @@ -139,6 +77,24 @@ color: @subtext0 !important; } + .project-description table { + tr { + background-color: @base !important; + } + + tr:nth-child(odd) { + background-color: @mantle !important; + } + + &, tr, th, td { + border-color: @surface0 !important; + } + } + + .verified .check { + color: @green; + } + .banner, .footer { background-color: @mantle !important; @@ -146,7 +102,7 @@ } .accordion__link { - color: @accent-color !important; + color: @accent !important; } .password-strength { @@ -155,7 +111,7 @@ .accordion__link:active, .accordion__link:focus { - outline-color: @accent-color !important; + outline-color: @accent !important; outline-style: solid; } @@ -178,7 +134,7 @@ .footer__menu li a { &:active, &:focus { - outline-color: @accent-color !important; + outline-color: @accent !important; } } @@ -189,23 +145,23 @@ a:not(.site-header__logo, .button, .dropdown__link, .badge, .release__card), a:hover:not( - .site-header__logo, - .button, - .dropdown__link, - .badge, - .release__card - ), + .site-header__logo, + .button, + .dropdown__link, + .badge, + .release__card + ), .footer__menu li a, .footer__text a, .language-switcher ul button { - color: @accent-color !important; + color: @accent !important; } .footer__text a, .language-switcher ul button { &:active, &:focus { - outline-color: @accent-color !important; + outline-color: @accent !important; } } @@ -246,7 +202,7 @@ } .dropdown__content { - border-color: @accent-color !important; + border-color: @accent !important; box-shadow: none !important; } @@ -273,15 +229,15 @@ .horizontal-menu__link:active, .horizontal-menu__link:focus { - outline-color: @accent-color !important; + outline-color: @accent !important; } .horizontal-menu--light .horizontal-menu__link { - color: @accent-color !important; + color: @accent !important; } .horizontal-menu--light .horizontal-menu__link:hover { - text-decoration-color: @accent-color !important; + text-decoration-color: @accent !important; } .sponsors, @@ -326,10 +282,10 @@ .button--primary:active, .button--primary:focus, .button--primary:hover { - background-color: @accent-color !important; - border-color: @accent-color !important; + background-color: @accent !important; + border-color: @accent !important; color: @base !important; - outline-color: @accent-color !important; + outline-color: @accent !important; } .danger { @@ -337,8 +293,8 @@ } .notification-bar { - background-color: @accent-color !important; - border-bottom-color: @accent-color !important; + background-color: @accent !important; + border-bottom-color: @accent !important; color: @base !important; } @@ -387,11 +343,11 @@ } .callout-block { - border-color: @accent-color !important; + border-color: @accent !important; } .callout-block::before { - background-color: @accent-color !important; + background-color: @accent !important; } .callout-block--danger { @@ -429,12 +385,12 @@ } .faq-group h3::before { - color: @accent-color !important; + color: @accent !important; } .badge { - background-color: @accent-color !important; - border-color: @accent-color !important; + background-color: @accent !important; + border-color: @accent !important; color: @base !important; } @@ -445,7 +401,7 @@ .badge:active, .badge:focus { border-color: @base !important; - outline-color: @accent-color !important; + outline-color: @accent !important; } .badge--success { @@ -476,24 +432,24 @@ .table--collaborators .table__user-text > * { background-image: linear-gradient( 90deg, - @accent-color, - @accent-color + @accent, + @accent ) !important; - color: @accent-color !important; + color: @accent !important; } .table--collaborators .table__user-text > :hover { background-image: linear-gradient( 90deg, - @accent-color, - @accent-color + @accent, + @accent ) !important; - color: @accent-color !important; + color: @accent !important; } .table--collaborators .table__user-text > :active, .table--collaborators .table__user-text > :focus { - outline-color: @accent-color !important; + outline-color: @accent !important; } @media (max-width: 600px) { @@ -569,7 +525,7 @@ .sponsor-grid__sponsor--invitation, .sponsor-grid__sponsor--invitation:hover { - border-color: @accent-color !important; + border-color: @accent !important; } .sponsor-grid__sponsor-activity { @@ -577,16 +533,16 @@ } .sponsor-package { - border-color: @accent-color !important; + border-color: @accent !important; } .sponsor-package__header { - background-color: @accent-color !important; + background-color: @accent !important; color: @base !important; } .sponsor-package__icon { - background-color: @accent-color !important; + background-color: @accent !important; } .mobile-search { @@ -730,13 +686,13 @@ } .vertical-tabs__tab:hover { - color: @accent-color !important; + color: @accent !important; } .vertical-tabs__tab:active, .vertical-tabs__tab:focus { box-shadow: 0 0 0 2px @crust !important; - outline-color: @accent-color !important; + outline-color: @accent !important; } @media (max-width: 800px) { @@ -749,35 +705,38 @@ .vertical-tabs__tab--is-active, .vertical-tabs__tab--is-active:hover { background: @crust !important; - color: @accent-color !important; + color: @accent !important; } .vertical-tabs__content:focus { - outline-color: @accent-color !important; + outline-color: @accent !important; } - .verified small { - color: @subtext0 !important; + .verified, + .unverified { + small { + color: @subtext0 !important; + } } .sidebar-section .sidebar-section__user-gravatar:active, .sidebar-section .sidebar-section__user-gravatar:focus { - outline-color: @accent-color !important; + outline-color: @accent !important; } .sidebar-section__user-gravatar-text, .sidebar-section__user-gravatar-text:hover { background-image: linear-gradient( 90deg, - @accent-color, - @accent-color + @accent, + @accent ) !important; - color: @accent-color !important; + color: @accent !important; } .sidebar-section__user-gravatar-text:active, .sidebar-section__user-gravatar-text:focus { - outline-color: @accent-color !important; + outline-color: @accent !important; } .sidebar-section { @@ -829,7 +788,7 @@ .viewport-section--ee .viewport-section__heading { background-color: @base !important; - color: @accent-color !important; + color: @accent !important; } .viewport-section--ee @@ -905,7 +864,7 @@ } .filter-badge { - background-color: @accent-color; + background-color: @accent; &, .filter-badge__remove-button, @@ -914,13 +873,13 @@ } .filter-badge__remove-button { border-left-color: if( - @lookup = latte, - lighten(@accent-color, 10%), - darken(@accent-color, 5%) + @flavor = latte, + lighten(@accent, 10%), + darken(@accent, 5%) ); &:hover { - background-color: darken(@accent-color, 10%); + background-color: darken(@accent, 10%); } } } @@ -938,7 +897,7 @@ .site-header__logo img { @svg: escape( - '' + '' ); content: url("data:image/svg+xml,@{svg}"); } @@ -960,20 +919,10 @@ .release__node[src*="blue"] { @svg: escape( - '' + '' ); content: url("data:image/svg+xml,@{svg}"); background-color: @mantle !important; } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/pypi/preview.webp b/styles/pypi/preview.webp deleted file mode 100644 index 80acc1fbea..0000000000 --- a/styles/pypi/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:c06c06657f844e019c061a06defa8bbbc3e37e23508b4df92df4cb5284ad63a6 -size 342686 diff --git a/styles/pythonanywhere/README.md b/styles/pythonanywhere/README.md new file mode 100644 index 0000000000..f8cf6c4b42 --- /dev/null +++ b/styles/pythonanywhere/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for PythonAnywhere + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [trinkey](https://github.com/trinkey) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/pythonanywhere/catppuccin.user.less b/styles/pythonanywhere/catppuccin.user.less new file mode 100644 index 0000000000..9f61e007df --- /dev/null +++ b/styles/pythonanywhere/catppuccin.user.less @@ -0,0 +1,1417 @@ +/* ==UserStyle== +@name PythonAnywhere Catppuccin +@namespace github.com/catppuccin/userstyles/styles/pythonanywhere +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/pythonanywhere +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/pythonanywhere/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apythonanywhere +@description Soothing pastel theme for PythonAnywhere +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("www.pythonanywhere.com"), + domain("eu.pythonanywhere.com"), + domain("blog.pythonanywhere.com") { + @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); + + @import (css) + url("https://chroma.catppuccin.com/@{lightFlavor}-chroma-style.css") + (prefers-color-scheme: light); + @import (css) + url("https://chroma.catppuccin.com/@{darkFlavor}-chroma-style.css") + (prefers-color-scheme: dark); + + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.css-variables(); + + color-scheme: if(@flavor = latte, light, dark); + + ::selection { + background-color: fade(@accent, 30%); + } + + input, + textarea { + &::placeholder { + color: @subtext0; // TODO: For some reason this (explicitly?) doesn't set !important like our template defaults do/did. + } + } + + /* Ace file editor */ + .ace_editor { + background-color: @crust; + color: @text; + + .ace_gutter, + .ace_gutter-cell { + background: @mantle; + color: @overlay1; + } + .ace_print-margin { + background: @mantle; + } + + .ace_marker-layer { + .ace_active-line { + background-color: fade(@yellow, 20%); + } + .highlight-line-error { + background-color: fade(@red, 20%); + } + .ace_bracket { + border-color: @overlay1; + } + } + + .ace_doctype { + color: @mauve; + } + .ace_cursor, + .ace_xml.ace_text { + color: @text; + } + + .ace_heading { + &.ace_1, + &.ace_1 + .ace_heading { + color: @red; + } + &.ace_2, + &.ace_2 + .ace_heading { + color: @peach; + } + &.ace_3, + &.ace_3 + .ace_heading { + color: @yellow; + } + &.ace_4, + &.ace_4 + .ace_heading { + color: @green; + } + &.ace_5, + &.ace_5 + .ace_heading { + color: @blue; + } + &.ace_6, + &.ace_6 + .ace_heading { + color: @mauve; + } + } + + .ace_list { + color: @text; + &.ace_markup { + color: @sky; + } + } + + .ace_marker-layer .ace_selection { + background: fade(@accent, 30%); + } + .ace_fold { + background-color: @surface0; + border-color: @surface1; + } + .ace_constant.ace_language, + .ace_keyword, + .ace_meta { + color: @mauve; + } + .ace_xml, + .ace_support.ace_class, + .ace_support.ace_type { + color: @yellow; + } + .ace_line .ace_identifier:not(:first-of-type), + .ace_entity.ace_name.ace_function, + .ace_constant { + color: @blue; + } + .ace_paren, + .ace_variable.ace_language { + color: @red; + } + .ace_constant.ace_numeric { + color: @peach; + } + .ace_entity.ace_other.ace_attribute-name, + .ace_support.ace_constant, + .ace_support.ace_function { + color: @teal; + } + .ace_entity.ace_name.ace_tag, + .ace_variable { + color: @blue; + } + .ace_storage { + color: @peach; + } + .ace_string { + color: @green; + } + .ace_comment { + color: @overlay2; + } + .ace_indent-guide { + @svg: escape( + '' + ); + + background-image: url("data:image/svg+xml;utf8,@{svg}"); + } + } + + .ace_tooltip { + background-color: @crust; + color: @text; + border-color: @surface0; + } + + #ace_settingsmenu { + background-color: @mantle; + box-shadow: none; + color: @subtext0; + } + + #kbshortcutmenu { + background-color: @mantle; + box-shadow: none; + + .ace_optionsMenuEntry { + &:hover, + &:focus { + background-color: @base; + } + } + + &, + .ace_optionsMenuCommand { + color: @subtext0; + } + + .ace_optionsMenuKey { + color: @accent; + } + } + + /* Console */ + + x-screen { + background-color: @base !important; + color: @text !important; + } + + .cursor-node { + border-color: @accent !important; + &[focus="true"] { + background-color: @accent !important; + } + } + + /* $ prompt character */ + [style*="color: rgb(0, 186, 19);"] { + color: @green !important; + } + + /* ANSI colors */ + x-row span { + /* Black & Bright Black */ + &[style^="color: rgb(0, 0, 0);"] { + color: if(@flavor = latte, @subtext1, @surface1) !important; + } + &[style*="background-color: rgb(0, 0, 0);"] { + background-color: if(@flavor = latte, @subtext1, @surface1) !important; + } + + &[style^="color: rgb(85, 87, 83);"] { + color: if(@flavor = latte, @subtext1, @surface2) !important; + } + &[style*="background-color: rgb(85, 87, 83);"] { + background-color: if(@flavor = latte, @subtext1, @surface2) !important; + } + + /* Red and Bright Red */ + &[style^="color: rgb(204, 0, 0);"], + &[style^="color: rgb(239, 41, 41);"] { + color: @red !important; + } + &[style*="background-color: rgb(204, 0, 0);"], + &[style*="background-color: rgb(239, 41, 41);"] { + background-color: @red !important; + } + /* Dim Red */ + &[style^="color: rgb(136, 0, 0);"] { + color: fade(@red, 80%) !important; + } + + /* Green and Bright Green */ + &[style^="color: rgb(78, 154, 6);"], + &[style^="color: rgb(0, 186, 19);"] { + color: @green !important; + } + &[style*="background-color: rgb(78, 154, 6);"], + &[style*="background-color: rgb(0, 186, 19);"] { + background-color: @green !important; + } + /* Dim Green */ + &[style^="color: rgb(52, 103, 4);"] { + color: fade(@green, 80%) !important; + } + + /* Yellow and Bright Yellow */ + &[style^="color: rgb(196, 160, 0);"], + &[style^="color: rgb(252, 233, 79);"] { + color: @yellow !important; + } + &[style*="background-color: rgb(196, 160, 0);"], + &[style*="background-color: rgb(252, 233, 79);"] { + background-color: @yellow !important; + } + /* Dim Yellow */ + &[style^="color: rgb(131, 107, 0);"] { + color: fade(@yellow, 80%) !important; + } + + /* Blue and Bright Blue */ + &[style^="color: rgb(52, 101, 164);"], + &[style^="color: rgb(114, 159, 207);"] { + color: @blue !important; + } + &[style*="background-color: rgb(52, 101, 164);"], + &[style*="background-color: rgb(114, 159, 207);"] { + background-color: @blue !important; + } + /* Dim Blue */ + &[style^="color: rgb(35, 67, 109);"] { + color: fade(@blue, 80%) !important; + } + + /* Pink and Bright Pink */ + &[style^="color: rgb(117, 80, 123);"], + &[style^="color: rgb(242, 0, 203);"] { + color: @pink !important; + } + &[style*="background-color: rgb(117, 80, 123);"], + &[style*="background-color: rgb(242, 0, 203);"] { + background-color: @pink !important; + } + /* Dim Pink */ + &[style^="color: rgb(78, 53, 82);"] { + color: fade(@pink, 80%) !important; + } + + /* Teal and Bright Teal */ + &[style^="color: rgb(6, 152, 154);"], + &[style^="color: rgb(0, 181, 189);"] { + color: @teal !important; + } + &[style*="background-color: rgb(6, 152, 154);"], + &[style*="background-color: rgb(0, 181, 189);"] { + background-color: @teal !important; + } + /* Dim Teal */ + &[style^="color: rgb(4, 101, 103);"] { + color: fade(@teal, 80%) !important; + } + + /* White */ + &[style^="color: rgb(211, 215, 207);"] { + color: if(@flavor = latte, @surface2, @subtext1) !important; + } + &[style*="background-color: rgb(211, 215, 207);"] { + background-color: if(@flavor = latte, @surface2, @subtext1) !important; + } + /* Bright White */ + &[style^="color: rgb(238, 238, 236);"] { + color: if(@flavor = latte, @surface1, @subtext0) !important; + } + &[style*="background-color: rgb(238, 238, 236);"] { + background-color: if(@flavor = latte, @surface1, @subtext0) !important; + } + /* Dim White */ + &[style^="color: rgb(141, 143, 138);"] { + color: fade(if(@flavor = latte, @surface2, @subtext1), 80%) !important; + } + } + + #terminal div { + &[style*="color: rgb(16, 16, 16);"] { + color: @text !important; + } + + &[style*="background-color: rgb(240, 240, 240);"] { + background-color: @crust !important; + } + } + + body, + .dark { + background-color: @base; + color: @text; + } + + a { + &, + &:hover, + &:focus { + color: @accent; + } + } + + hr, + pre { + border-color: @surface0; + } + + small, + .small { + color: @subtext0; + } + + input, + button:not(.close, [class*="btn"], [data-toggle="dropdown"]) { + background-color: @crust; + border-color: @surface0; + + &:hover, + &:focus { + background-color: @mantle; + } + + i.glyphicon { + pointer-events: none; + } + } + + blockquote { + border-color: @surface0; + + footer, + small, + .small { + color: @subtext0; + } + } + + .footer p { + color: @text; + } + + .gsc-modal-background-image { + background-color: @base; + } + + .gsc-results-wrapper-overlay { + background-color: @mantle; + color: @subtext0; + } + + input.gsc-input, + .gsc-input-box, + .gsc-input-box-hover, + .gsc-input-box-focus { + border-color: @surface0; + } + + .gsc-completion-container { + background-color: @crust; + border-color: @surface0; + } + + .gsc-completion-selected { + background-color: @mantle; + } + + input.gsc-input { + background-color: @mantle; + } + + .gsc-input-box, + .gsc-results { + background-color: @mantle; + } + + .gsc-option-menu-item-highlighted { + background-color: @base; + color: @text; + } + + .gsc-selected-option-container { + background-color: @crust; + color: @text; + border-color: @surface0; + } + + .gsc-webResult.gsc-result { + border-color: @surface0; + background-color: @mantle; + } + + .gsc-search-button-v2 { + &, + &:hover, + &:focus { + border-color: @surface0; + background-color: @crust; + color: @text; + } + svg { + fill: @text; + } + } + + .gsc-result-info, + .gsc-orderby-label, + .gsc-option-menu-item { + color: @subtext0; + } + + .gcsc-find-more-on-google { + color: @accent; + } + + .gcsc-find-more-on-google-magnifier { + fill: @accent; + } + + .gsc-results .gsc-cursor-box .gsc-cursor-page { + color: @text; + background-color: unset; + } + + .gsc-control-cse .gsc-option-menu { + background-color: @crust; + } + + .gs-webResult div.gs-visibleUrl { + color: @subtext0; + } + + .gs-webResult.gs-result a.gs-title { + &, + &:hover, + &:focus, + b { + color: @accent; + } + } + + .gs-webResult .gs-snippet { + color: @text; + } + + .badge { + background-color: @crust; + + &:hover, + &:focus { + background-color: @mantle; + } + } + + .dashboard-panel__headline a { + text-decoration-color: @accent; + } + + .dashboard-columns { + border-top-color: @surface0; + + &::before { + background-color: @surface0; + } + + .row > div { + border-color: @surface0; + } + } + + .pagination > li { + > span, + > a { + background-color: @crust; + border-color: @surface0; + color: @text; + + &:hover, + &:focus { + background-color: @mantle; + } + } + } + + textarea { + background-color: @crust; + outline-color: @surface0; + border-color: none; + outline-style: solid; + + &:focus { + outline-color: @accent; + } + } + + .jumbotron { + background-color: @mantle; + } + + .jumbotron > hr { + border-top-color: @mantle; + } + + .top-nav { + background: @crust; + + li a, + li button.btn-link { + color: @text; + } + + button:focus, + a:focus, + li a:focus { + background-color: @crust; + } + } + + .err { + border-color: @red; + } + + .btn-success, + .open > .dropdown-toggle.btn-success { + &, + &:focus, + &.focus, + &:active, + &.active, + &:hover { + color: @mantle; + background-color: @green; + border-color: @surface0; + } + } + + .btn-success .badge { + color: @green; + background-color: @crust; + } + + tr.hoverable:hover { + background-color: @mantle; + } + + td { + &.file_size, + &.file_timestamp { + color: @subtext0; + } + } + + span[style="color: blue;"] { + color: @text !important; + } + + [style="color: #888"], + [style="color: #444"] { + color: @text !important; + } + + .btn-info, + .btn-primary, + .open > .dropdown-toggle.btn-info, + .open > .dropdown-toggle.btn-primary { + &, + &:focus, + &.focus, + &:active, + &.active, + &:hover { + color: @base; + background-color: @accent; + border-color: @surface0; + } + } + + .label-primary { + background-color: @accent; + color: @crust; + } + + .label-info { + background-color: @accent; + color: @crust; + } + + .label-danger { + background-color: @red; + color: @crust; + } + + .btn-danger { + background-color: @red; + border-color: @red; + color: @crust; + + &:hover, + &:focus { + background-color: darken(@red, 5%); + color: @mantle; + } + } + + .btn-warning { + background-color: @yellow; + border-color: @yellow; + color: @mantle; + + &:hover, + &:focus { + background-color: darken(@yellow, 5%); + color: @mantle; + } + } + + .edit_value { + color: @accent; + } + + .btn-info .badge, + .btn-primary .badge { + color: @accent; + background-color: @crust; + } + + .alert-success, + .alert-info, + .alert-warning, + .alert-danger { + border-color: @surface0; + + &, + small { + color: @base; + } + + button { + background-color: unset; + } + + hr { + border-top-color: @surface0; + } + + a { + color: @base; + text-decoration: underline; + } + + .close { + &, + &:hover, + &:focus { + color: @crust; + } + } + } + + .alert-success { + background-color: @green; + } + + .alert-info { + background-color: @accent; + } + + .alert-warning { + background-color: @yellow; + } + + .alert-danger { + background-color: @red; + } + + .close { + opacity: 100%; + text-shadow: none; + + &, + &:hover, + &:focus { + color: @text; + background: none; + } + } + + .form-control { + color: @text; + background-color: @crust; + border-color: @surface0; + box-shadow: inset 0 1px 1px @surface0; + + &:focus { + border-color: @surface0; + box-shadow: inset 0 1px 1px @surface0; + } + + &[disabled], + &[readonly] { + background-color: @mantle; + } + } + + .help-block { + color: @text; + } + + .pricing_table ul { + background-color: @base; + } + + .pricing_table ul li { + background: @mantle; + } + + .pricing_table ul li:first-child, + .account_type_header { + color: @text; + } + + .sub_and_dark_blue, + .scheduled_task:not(.enabled) { + color: @subtext0; + } + + #id_initializing_mysql_spinner { + background-color: @crust !important; + color: @text; + } + + .directory_listing_table i.pale { + color: @subtext0; + opacity: 100%; + } + + .pricing_table ul.Free li { + background-color: @mantle; + } + + .col-md-12 { + div[style*="background-color"] { + background-color: @mantle !important; + } + + h1[style*="color"] { + color: @text !important; + } + } + + .table { + background-color: @base; + + th, + td { + border-top-color: @surface0; + } + + > thead th { + border-bottom-color: @surface0; + } + + .success, + .info, + .warning, + .danger { + background-color: @base; + + &, + td, + th { + &, + &:hover { + background-color: @base; + } + } + } + + td.active, + th.active, + &.active td, + &.active th { + background-color: @mantle; + } + } + + .table-bordered { + border-color: @surface0; + + th, + td { + border-color: @surface0; + } + } + + .table-striped > tbody > tr:nth-of-type(odd), + .table-hover > tbody > tr:hover { + background-color: @mantle; + } + + .highlighted_feature_text { + color: @green; + } + + .text-muted { + color: @subtext0; + } + + .modal-header { + border-bottom-color: @surface0; + } + + .modal-content { + background-color: @base; + border-color: @surface0; + box-shadow: 0 3px 9px @crust; + } + + .modal-backdrop { + background-color: @crust; + } + + .directories_listing_group h4, + .page-header, + .gsc-above-wrapper-area, + .nav-tabs, + .property_group_header { + border-bottom-color: @surface0; + } + + .nav-tabs a { + &:hover, + &:focus { + border-color: @surface0 !important; + } + } + + .popover { + background-color: @mantle; + border-color: @surface0; + box-shadow: none; + + &.top > .arrow { + &, + &::after { + border-top-color: @mantle; + } + } + + &.right > .arrow { + &, + &::after { + border-right-color: @mantle; + } + } + + &.left > .arrow { + &, + &::after { + border-left-color: @mantle; + } + } + + &.bottom > .arrow { + &, + &::after { + border-bottom-color: @mantle; + } + } + } + + .popover-title { + background-color: @mantle; + border-bottom-color: @surface0; + } + + .modal-footer { + border-top-color: @surface0; + } + + .unsorted { + color: @subtext0; + } + + .sorted-up, + .sorted-down { + color: @accent; + } + + .ui-widget-content { + border-color: @surface0; + background: @mantle; + color: @text; + } + + .ui-state-default { + border-color: @surface0; + background: @surface1; + color: @text; + } + + .bootstrap-switch { + border-color: @surface0; + + &.bootstrap-switch-focused { + border-color: @surface0; + box-shadow: none; + } + + .bootstrap-switch-label { + color: @text; + background-color: @surface0; + } + + .bootstrap-switch-handle-off, + .bootstrap-switch-handle-on { + color: @text; + background-color: @crust; + + &.bootstrap-switch-success, + &.bootstrap-switch-warning, + &.bootstrap-switch-danger, + &.bootstrap-switch-primary { + color: @base; + } + + &.bootstrap-switch-success { + background-color: @green; + } + + &.bootstrap-switch-warning { + background-color: @yellow; + } + + &.bootstrap-switch-danger { + background-color: @red; + } + + &.bootstrap-switch-primary { + background-color: @accent; + } + } + } + + .tooltip-inner { + color: @text; + background-color: @crust; + } + + .tooltip { + &.right .tooltip-arrow { + border-right-color: @crust; + } + + &.left .tooltip-arrow { + border-left-color: @crust; + } + + &.top, + &.top-left, + &.top-right { + .tooltip-arrow { + border-top-color: @crust; + } + } + + &.bottom, + &.bottom-left, + &.bottom-right { + .tooltip-arrow { + border-bottom-color: @crust; + } + } + } + + .has-error { + .help-block, + .control-label, + .radio, + .checkbox, + .radio-inline, + .checkbox-inline, + label { + color: @red; + } + } + + .success-stories-container { + background-color: @mantle; + color: @text; + + h3 { + color: @text; + } + } + + .gsc-control-cse { + border-color: @surface0; + background-color: @base; + } + + .post_metadata { + color: @subtext0; + } + + .ui-widget-header { + background-color: @base; + border-color: @surface0; + color: @text; + } + + .fullscreen-main-navbar { + background-color: @mantle; + } + + .dropdown-menu { + background-color: @mantle; + border-color: @surface0; + box-shadow: none; + + > li > a { + color: @text; + + &:hover, + &:focus { + background-color: @base; + } + } + } + + .fullscreen-main-navbar button.btn-link { + &:hover, + &:focus { + background-color: @base; + } + } + + .navbar-default .btn-link { + &, + &:hover, + &:focus { + color: @text; + } + } + + .btn.btn-default { + border-color: @accent; + color: @accent; + background-color: @base; + + &:hover, + &:focus { + background-color: @surface0; + } + } + + .well { + background-color: @mantle; + border-color: @surface0; + } + + .icon-bar { + background-color: @text; + } + + .nav-tabs > li, + .nav-pills > li { + > a { + border-color: @surface0; + + &, + &:hover, + &:focus { + color: @accent; + } + } + + &.active > a { + &, + &:focus { + background-color: @mantle; + } + + &:hover, + &:focus { + background-color: @crust; + } + } + + &:not(.active) > a { + &:hover, + &:focus { + background-color: @mantle; + } + } + } + + .ui-state-highlight { + border-color: @accent; + background: @accent; + color: @base; + } + + .primary-navbar { + a, + form, + .active { + background-color: @base; + } + + form .btn-link { + color: @accent; + } + + .active a { + color: @text; + } + } + + .post, + .topic { + background-color: @mantle; + border-color: @surface0; + } + + .editable-click { + &, + &:hover, + &:focus { + border-bottom-color: @subtext0; + } + } + + [style*="background: whitesmoke;"] { + background-color: @mantle !important; + } + + @media (min-width: 768px) { + .modal-content { + box-shadow: 0 5px 15px @crust; + } + } + + @media screen and (max-width: 767px) { + .table-responsive { + border-color: @surface0; + } + } + + #id_main_screenshot { + box-shadow: 12px 12px 29px @surface1; + } + + #id_hosting_details, + #id_education_details { + &, + h1, + h2, + h3 { + background-color: @mantle; + color: @text; + } + + .btn { + color: @crust !important; + } + + a { + color: @accent; + } + } + + #id_develop_anywhere_details { + background-color: @base; + } + + #id_support_details { + background-color: @base; + + a { + color: @accent !important; + } + } + + #id_company_info_strip { + color: @text; + } + + .console_table .info_tooltip { + color: @accent; + } + + #id_console_name { + color: @text; + } + + .beginner_pane, + .pricing_pane { + background-color: @mantle; + } + + #id_error_message, + #id_login_error { + color: @red; + } + + .post_preview { + background-color: @base; + + h3 { + color: @text; + } + } + + .teacher-navbar { + background-color: @mantle; + color: @text; + } + + .nav > li > a:focus { + background: none; + } + + /* blog */ + + .site-header { + background-color: @crust; + } + + h1, + h2, + h3, + h4, + code { + color: @text !important; + } + + button code { + background: none !important; + color: inherit !important; + } + + p, + .tipue_search_content_text, + .tipue_search_content_bold, + #tipue_search_error, + #tipue_search_results_count, + .post-meta { + color: @subtext0; + } + + .navbar-default .navbar-toggle { + &:hover, + &:focus { + background-color: @mantle; + } + } + + button:not(.btn-link, .btn, [data-toggle="dropdown"]), + .pagination a, + #tipue_search_foot_boxes li.current, + #tipue_search_foot_boxes li a { + background-color: @accent; + color: @crust; + border-color: @accent; + } + + button:disabled, + .pagination .disabled { + background-color: darken(@accent, 5%); + border-color: darken(@accent, 5%); + } + + #tipue_search_input, + form.navbar-search { + background-color: @mantle; + color: @text; + } + + svg { + fill: @subtext0; + } + + .fa-at, + .fa-twitter, + .fa-rss { + filter: @text-filter; + } + + .hide_search_icon path { + stroke: @subtext0; + } + + footer, + footer .wrap { + background-color: @crust; + color: @text; + border-color: @crust; + } + + .pagination a, + #tipue_search_foot_boxes li.current, + #tipue_search_foot_boxes li a { + background-color: @accent; + color: @crust; + border-color: @accent; + } + + img[src*="ssl.gstatic.com/ui/v1/disclosure/small-grey-disclosure-arrow-down.png"], + img[src*="/static/anywhere/images/staff.png"], + img[src*="/static/glyphicons/glyphicons_"], + img[src="/static/anywhere/images/PA-logo-snake-only.svg"], + .testimonial-content, + .quickstart_logo:not([src$="/django-logo-negative-small.png"]), + .ui-icon { + filter: @text-filter; + } + + img[src*="/static/anywhere/images/cross.png"] { + filter: @red-filter; + } + + img[src*="/static/anywhere/images/tick.png"] { + filter: @green-filter; + } + + .quickstart_logo[src$="/django-logo-negative-small.png"] { + // Original image has background - can't filter + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + img[src$="/images/PA-logo.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml;utf8,@{svg}"); + } + } +} diff --git a/styles/quizlet/README.md b/styles/quizlet/README.md index 07939ea8f2..ab7e71de12 100644 --- a/styles/quizlet/README.md +++ b/styles/quizlet/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/quizlet/catppuccin.user.css b/styles/quizlet/catppuccin.user.less similarity index 91% rename from styles/quizlet/catppuccin.user.css rename to styles/quizlet/catppuccin.user.less index 5500e903ac..68fe2e38de 100644 --- a/styles/quizlet/catppuccin.user.css +++ b/styles/quizlet/catppuccin.user.less @@ -2,8 +2,8 @@ @name Quizlet Catppuccin @namespace github.com/catppuccin/userstyles/styles/quizlet @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/quizlet -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/quizlet/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/quizlet/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aquizlet @description Soothing pastel theme for Quizlet @author Catppuccin @@ -15,55 +15,21 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + @-moz-document domain("quizlet.com") { - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); :root body { color: @text; @@ -170,8 +136,9 @@ } .neeykg0 { - filter: brightness(0) saturate(100%) invert(14%) sepia(10%) - saturate(1367%) hue-rotate(192deg) brightness(95%) contrast(95%); + filter: brightness(0) saturate(100%) invert(14%) sepia(10%) saturate( + 1367% + ) hue-rotate(192deg) brightness(95%) contrast(95%); } .CourseOverviewPreviewCard-recommendationLink:hover { @@ -2350,13 +2317,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/quizlet/preview.webp b/styles/quizlet/preview.webp deleted file mode 100644 index bd4a653392..0000000000 --- a/styles/quizlet/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:216b310aade3eaf15813f7e21954f0001ed4e48d1342e82a3c28c5f65606f0d3 -size 264918 diff --git a/styles/raindrop/README.md b/styles/raindrop/README.md index 5d09de81d4..7eba8354db 100644 --- a/styles/raindrop/README.md +++ b/styles/raindrop/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/raindrop/catppuccin.user.css b/styles/raindrop/catppuccin.user.css deleted file mode 100644 index 8fbd92086c..0000000000 --- a/styles/raindrop/catppuccin.user.css +++ /dev/null @@ -1,167 +0,0 @@ -/* ==UserStyle== -@name Raindrop Catppuccin -@namespace github.com/catppuccin/userstyles/styles/raindrop -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/raindrop -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/raindrop/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Araindrop -@description Soothing pastel theme for Raindrop -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('app.raindrop.io') { - [data-theme="night"] { - #catppuccin(@darkFlavor, @accentColor) !important; - } - [data-theme="day"], - [data-theme="sunset"] { - #catppuccin(@lightFlavor, @accentColor); - } - - // theme selector previews - [class^="theme-"] { - &[data-index="0"], - &[data-index="2"] > [class^="main-"], - &[data-index="3"] { - #catppuccin(@lightFlavor, @accentColor) !important; - } - &[data-index="1"], - &[data-index="2"] > [class^="sidebar-"] { - #catppuccin(@darkFlavor, @accentColor) !important; - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - &, - [data-theme] { - --background-color: @base; - --disable-background-color: @crust; - --disable-text-color: @overlay1; - --accent-color: @accent-color; - --alternative-background-color: @mantle; - --sidebar-background-color: @mantle; - --hover-background-color: fade(@overlay0, 20%); - --active-background-color: @surface1; - --primary-text-color: @text; - --secondary-text-color: @subtext0; - --shadow-color: fade(@text, 10%); - --shadow-light-color: fade(@text, 10%); - --danger-color: @red; - --important-color: @red; - --success-color: @green; - --highlights-color: @mauve; - --reminder-color: @peach; - --note-color: @yellow; - --article-color: @peach; - --audio-color: @mauve; - --document-color: @subtext0; - --book-color: @rosewater; - --image-color: @green; - --video-color: @blue; - --broken-color: @maroon; - --duplicate-color: @sapphire; - --tag-color: @subtext0; - --filter-color: @subtext0; - - [data-variant="active"] { - background: fade(@accent-color, 10%) !important; - } - // bookmark edit page header - [class^="header-"][data-fancy="true"] { - background: linear-gradient( - to bottom, - var(--background-color) 30%, - fade(@base, 60%) 100% - ); - } - // bookmark edit page cover selector - [class^="cover-"] > [class^="more-"] { - background: fade(@accent-color, 85%); - } - // add bookmark button text color - [title="Add Bookmark"] { - color: @base; - } - // disabled add bookmark button - [class^="button-"][data-variant="primary"][disabled] { - filter: none; - opacity: 100%; - background: @overlay0; - color: @crust; - } - // dropping bookmark to collection color overlay - [class*="isDropping-"] { - background-color: fade(@accent-color, 10%); - } - // sidebar background color - .svSidebar { - background: var(--sidebar-background-color); - } - color: @text; - } - // google login button - [href^="https://api.raindrop.io/v1/auth/google"] > span - { - color: @text; - } - - // todo: recolor "Colors circle" icons using custom images (like the chess.com theme) - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/raindrop/catppuccin.user.less b/styles/raindrop/catppuccin.user.less new file mode 100644 index 0000000000..9e83b1eecf --- /dev/null +++ b/styles/raindrop/catppuccin.user.less @@ -0,0 +1,120 @@ +/* ==UserStyle== +@name Raindrop Catppuccin +@namespace github.com/catppuccin/userstyles/styles/raindrop +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/raindrop +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/raindrop/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Araindrop +@description Soothing pastel theme for Raindrop +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("app.raindrop.io") { + [data-theme="night"] { + #catppuccin(@darkFlavor) !important; + } + [data-theme="day"], + [data-theme="sunset"] { + #catppuccin(@lightFlavor); + } + + // theme selector previews + [class^="theme-"] { + &[data-index="0"], + &[data-index="2"] > [class^="main-"], + &[data-index="3"] { + #catppuccin(@lightFlavor) !important; + } + &[data-index="1"], + &[data-index="2"] > [class^="sidebar-"] { + #catppuccin(@darkFlavor) !important; + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + &, + [data-theme] { + --background-color: @base; + --disable-background-color: @crust; + --disable-text-color: @overlay1; + --accent-color: @accent; + --alternative-background-color: @mantle; + --sidebar-background-color: @mantle; + --hover-background-color: fade(@overlay0, 20%); + --active-background-color: @surface1; + --primary-text-color: @text; + --secondary-text-color: @subtext0; + --shadow-color: fade(@text, 10%); + --shadow-light-color: fade(@text, 10%); + --danger-color: @red; + --important-color: @red; + --success-color: @green; + --highlights-color: @mauve; + --reminder-color: @peach; + --note-color: @yellow; + --article-color: @peach; + --audio-color: @mauve; + --document-color: @subtext0; + --book-color: @rosewater; + --image-color: @green; + --video-color: @blue; + --broken-color: @maroon; + --duplicate-color: @sapphire; + --tag-color: @subtext0; + --filter-color: @subtext0; + + [data-variant="active"] { + background: fade(@accent, 10%) !important; + } + // bookmark edit page header + [class^="header-"][data-fancy="true"] { + background: linear-gradient( + to bottom, + var(--background-color) 30%, + fade(@base, 60%) 100% + ); + } + // bookmark edit page cover selector + [class^="cover-"] > [class^="more-"] { + background: fade(@accent, 85%); + } + // add bookmark button text color + [title="Add Bookmark"] { + color: @base; + } + // disabled add bookmark button + [class^="button-"][data-variant="primary"][disabled] { + filter: none; + opacity: 100%; + background: @overlay0; + color: @crust; + } + // dropping bookmark to collection color overlay + [class*="isDropping-"] { + background-color: fade(@accent, 10%); + } + // sidebar background color + .svSidebar { + background: var(--sidebar-background-color); + } + color: @text; + } + // google login button + [href^="https://api.raindrop.io/v1/auth/google"] > span { + color: @text; + } + + // todo: recolor "Colors circle" icons using custom images (like the chess.com theme) + } +} diff --git a/styles/raindrop/preview.webp b/styles/raindrop/preview.webp deleted file mode 100644 index f38be25470..0000000000 --- a/styles/raindrop/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:95ebed062c225c877249c2cedb28568e0a7ea09fe2f04e2ad52000378f26ddbc -size 183736 diff --git a/styles/react.dev/README.md b/styles/react.dev/README.md new file mode 100644 index 0000000000..20d679287f --- /dev/null +++ b/styles/react.dev/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for React.dev + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [RaiderHCPlay](https://github.com/RaiderHCPlay) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/react.dev/catppuccin.user.less b/styles/react.dev/catppuccin.user.less new file mode 100644 index 0000000000..4c016b875f --- /dev/null +++ b/styles/react.dev/catppuccin.user.less @@ -0,0 +1,425 @@ +/* ==UserStyle== +@name React.dev Catppuccin +@namespace github.com/catppuccin/userstyles/styles/react.dev +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/react.dev +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/react.dev/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Areact.dev +@description Soothing pastel theme for React.dev +@author Catppuccin +@license MIT +@preprocessor less + +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("react.dev") { + html.dark { + #catppuccin(@darkFlavor); + } + html { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + //svg styling + + svg { + color: @accent !important; + } + + //text styling + + .text-primary { + color: @text; + } + + .dark\:text-primary-dark { + color: @text; + } + + .dark\:text-white { + color: @text; + } + + .text-secondary { + color: @text; + } + + .text-gray-30 { + color: @subtext1; + } + + .text-red-50, + .text-red-30 { + color: @red !important; + } + + .text-gray-50 { + color: @subtext0; + } + + // color divs text + + #color-and-svg(@color) { + color: @color !important; + svg { + color: @color !important; + } + } + .text-red-50, .text-red-40 { + #color-and-svg(@red); + } + .text-purple-50, .text-purple-30, .text-purple-60 { + #color-and-svg(@mauve); + } + .text-blue-50, .text-blue-40, .text-blue-60 { + #color-and-svg(@blue); + } + .text-yellow-40, .text-yellow-50, .text-yellow-60 { + #color-and-svg(@yellow); + } + + .text-green-60, .text-green-40 { + color: @green !important; + } + + .text-tertiary, + .text-tertiary-dark { + color: @subtext0; + } + + .text-link, + .text-link-dark { + color: @accent; + } + + //hover styling + + .hover\:text-link:hover, .text-link:hover, .text-link-dark:hover { + color: @accent; + } + + .hover\:bg-gray-80:hover, + .hover\:bg-gray-5:hover { + background-color: @mantle; + } + + .hover\:bg-card:hover { + background-color: @crust; + } + + //code stylizing + + a > code { + color: @accent !important; + } + + .console-block code { + background-color: @surface1 !important; + color: @red !important; + } + + .sp-wrapper { + --sp-colors-accent: @accent; + --sp-colors-clickable: @flamingo; + --sp-colors-disabled: @text; + --sp-colors-error: @red; + --sp-colors-error-surface: @maroon; + --sp-colors-surface1: @surface0; + --sp-colors-surface2: @surface1; + --sp-syntax-color-plain: @text; + --sp-syntax-color-comment: @overlay2; + --sp-syntax-color-keyword: @mauve; + --sp-syntax-color-tag: @blue; + --sp-syntax-color-punctuation: @overlay2; + --sp-syntax-color-definition: @yellow; + --sp-syntax-color-property: @blue; + --sp-syntax-color-static: @peach; + --sp-syntax-color-string: @green; + } + + //border styling + + .border-blue-40 { + border-color: @blue; + } + + .border-b-4 { + border-color: @text; + } + + .border-yellow-40 { + border-color: @yellow; + } + + .border-purple-40 { + border-color: @lavender; + } + + .border-purple-10 { + border-color: @mauve; + } + + .dark\:border-purple-30, .border-purple-30 { + border-color: @mauve; + } + + .border-green-40 { + border-color: @green; + } + + .hover\:border-gray-10:hover { + border-color: @accent; + } + + .border-gray-300, .bg-gray-90 { + border-color: @overlay2; + } + + .border-gray-20 { + border-color: @overlay1; + } + + .border-link:hover { + border-color: @accent; + } + + .dark\:border-link-dark { + border-color: @accent; + } + + //backgrounds styling + + .bg-card-dark, + .bg-card { + background-color: @surface0; + } + + .bg-highlight { + background-color: @surface0; + } + + .bg-highlight-dark { + background-color: @surface0; + } + + .bg-github-highlight { + background-color: @surface0; + } + + .bg-link { + color: @surface0; + background-color: @accent; + } + + .bg-gradient-left, + .bg-gradient-left-dark { + background-image: conic-gradient( + from 90deg at -10% 100%, + @mantle 0deg, + @base 90deg, + @crust 1turn + ); + } + + .bg-gray-3, + .bg-gray-5 { + background-color: @crust; + } + + .bg-gray-40\/5, + .bg-gray-60\/5 { + background-color: @overlay1; + } + + .bg-gray-40\/10, + .bg-gray-60\/10 { + background-color: @overlay0; + } + .bg-gray-30, + .bg-gray-300, + .bg-gray-70, + .bg-gray-700 { + background-color: @surface0; + } + + .bg-gray-80, + .bg-gray-200, + .bg-gray-95 { + background-color: @mantle; + } + + .bg-black { + background-color: @base; + } + + #color-fragment-style(@divColor) { + background-color: fade(@divColor, 40%); + color: @text; + + p { + color: @text; + } + + button { + color: @base !important; + background-color: @divColor !important; + + svg { + color: @base !important; + } + } + + .text-primary { + color: @text; + } + + .text-link { + color: @accent; + } + + .bg-highlight { + color: @accent; + } + + .bg-link { + background-color: @accent; + color: @text; + } + } + + .bg-green-5, .bg-green-60, .bg-green-40 { + #color-fragment-style(@green); + } + + .bg-red-5, .bg-red-60 { + #color-fragment-style(@red); + } + + .bg-yellow-5, .bg-yellow-60, .bg-yellow-40 { + #color-fragment-style(@peach); + } + + .bg-purple-5, .bg-purple-60, .bg-purple-40 { + #color-fragment-style(@mauve); + } + + .bg-blue-10, .bg-blue-60, .bg-blue-40 { + #color-fragment-style(@blue); + } + + .bg-red-30 { + background-color: fade(@red, 10%); + } + + .bg-gradient-right, + .bg-gradient-right-dark { + background-image: conic-gradient( + from -90deg at 110% 100%, + @crust 0deg, + @base 90deg, + @mantle 1turn + ); + } + + .bg-white, + .bg-wash { + background-color: @base !important; + } + + .bg-secondary-button { + background-color: @surface1; + } + + // outline styling + + .outline-link { + outline-color: @accent; + } + + .focus\:outline-link:focus { + outline-color: @accent; + } + + // docsearch styling + + --docsearch-modal-background: @base !important; + --docsearch-hit-background: @mantle !important; + --docsearch-highlight-color: @accent !important; + --docsearch-primary-color: @accent !important; + --docsearch-container-background: rgba(127, 132, 156, 0.8) !important; + --docsearch-text-color: @text !important; + --docsearch-logo-color: @blue !important; + --docsearch-muted-color: @subtext0 !important; + --docsearch-searchbox-background: @accent !important; + --docsearch-searchbox-focus-background: @accent !important; + --docsearch-hit-color: @crust !important; + --docsearch-hit-active-color: @base !important; + --docsearch-footer-background: @overlay0 !important; + --docsearch-key-gradient: linear-gradient( + -225deg, + @base, + @crust + ) !important; + + .DocSearch-Form { + background-color: @mantle; + input { + color: @text; + } + :focus-visible { + outline-color: 2px solid @accent !important; + } + } + + .DocSearch-Hit { + .DocSearch-Hit-title { + color: @text; + } + + svg { + color: currentcolor !important; + } + + .DocSearch-Hit-Tree { + color: @base !important; + } + + &[aria-selected="false"] { + mark { + color: @accent !important; + } + .DocSearch-Hit-Tree { + color: @subtext0 !important; + } + } + } + + .DocSearch-Hit-source { + color: @text; + } + + .DocSearch-Cancel { + color: @accent; + } + + .DocSearch-Footer { + background-color: @base; + + [aria-label="Algolia"] { + .cls-1, + .cls-2 { + fill: @accent !important; + } + } + } + } +} diff --git a/styles/reddit/README.md b/styles/reddit/README.md index 1744e3f9e7..2e475169d1 100644 --- a/styles/reddit/README.md +++ b/styles/reddit/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## โค๏ธโ€๐Ÿฉน Unmaintained +This userstyle currently lacks maintainers, and may not work correctly. Please feel free to contribute for any issues you find! ## ๐Ÿ’– Past Maintainers - [jayylmao](https://github.com/jayylmao) diff --git a/styles/reddit/catppuccin.user.css b/styles/reddit/catppuccin.user.css deleted file mode 100644 index c1e93516e4..0000000000 --- a/styles/reddit/catppuccin.user.css +++ /dev/null @@ -1,1147 +0,0 @@ -/* ==UserStyle== -@name Reddit Catppuccin -@namespace github.com/catppuccin/userstyles/styles/reddit -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/reddit -@version 2.0.11 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/reddit/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Areddit -@description Soothing pastel theme for Reddit -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("reddit.com") { - :root:not(.theme-dark) .theme-rpl, - :root:not(.theme-dark).theme-rpl, - :root:not(.theme-dark) .theme-beta, - :root:not(.theme-dark).theme-beta, - .theme-light { - #catppuccin(@lightFlavor, @accentColor); - } - - :root:not(.theme-light) .theme-rpl, - :root:not(.theme-light).theme-rpl, - :root:not(.theme-light) .theme-beta, - :root:not(.theme-light).theme-beta, - .theme-dark { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - /* BETA */ - --color-pizzaRed: @red !important; - --color-global-brand-orangered: @peach !important; - --color-global-focus: @surface1 !important; - --color-interactive-content-disabled: @subtext0 !important; - --color-interactive-background-disabled: fade(@surface2, 70%) !important; - --color-interactive-pressed: @surface2 !important; - --color-neutral-content: @text !important; - --color-neutral-content-disabled: @subtext0 !important; - --color-neutral-content-weak: @subtext0 !important; - --color-neutral-content-strong: @text !important; - --color-global-white: @crust !important; - --color-neutral-background: @base !important; - --color-neutral-background-selected: @surface0 !important; - --color-neutral-background-weak: @mantle !important; - --color-neutral-background-medium: @base !important; - --color-neutral-background-strong: @crust !important; - --color-neutral-background-hover: @surface0 !important; - --color-neutral-border: @surface0 !important; - --color-neutral-border-medium: @surface0 !important; - --color-neutral-border-weak: @surface0 !important; - --color-neutral-border-strong: @surface2 !important; - --color-primary: @accent-color !important; - --color-primary-hover: lighten(@accent-color, 10) !important; - --color-primary-visited: @lavender !important; - --color-primary-background: @accent-color !important; - --color-primary-background-hover: darken(@accent-color, 5%) !important; - --color-primary-background-selected: darken(@accent-color, 5%) !important; - --color-primary-onBackground: @base !important; - --color-primary-onBackground-selected: @crust !important; - --color-secondary: @subtext0 !important; - --color-secondary-hover: @subtext1 !important; - --color-secondary-weak: @subtext0 !important; - --color-secondary-onBackground: @text !important; - --color-secondary-background: @mantle !important; - --color-secondary-background-hover: @surface1 !important; - --color-secondary-background-selected: @surface1 !important; - --color-secondary-plain: @subtext0 !important; - --color-secondary-plain-hover: @subtext1 !important; - --color-danger-background: @red !important; - --color-danger-background-disabled: fadeout(@red, 80) !important; - --color-danger-background-hover: fadeout(@red, 2) !important; - --color-danger-onBackground: @text !important; - --color-danger-content: @red !important; - --color-danger-content-default: @crust; - --color-danger-content-hover: darken(@red, 2) !important; - --color-success-content: @green !important; - --color-success-hover: darken(@green, 2) !important; - --color-success-onBackground: @crust; - --color-success-background: @green !important; - --color-success-background-hover: darken(@green, 2) !important; - --color-warning-content: @yellow !important; - --color-warning-content-hover: darken(@yellow, 2) !important; - --color-warning-onBackground: @base !important; - --color-warning-background: @yellow !important; - --color-warning-background-hover: darken(@yellow, 2) !important; - --color-upvote-content: @accent-color !important; - --color-upvote-disabled: @subtext0 !important; - --color-upvote-onBackground: @text !important; - --color-upvote-background: @base !important; - --color-upvote-background-hover: darken(@accent-color, 5%) !important; - --color-upvote-background-disabled: @base !important; - --color-downvote-content: @text !important; - --color-downvote-content-weak: @text !important; - --color-downvote-disabled: @subtext0 !important; - --color-downvote-onBackground: @text !important; - --color-downvote-background: @base !important; - --color-downvote-background-hover: darken(@blue, 5%) !important; - --color-downvote-background-disabled: @mantle !important; - --color-tone-1: @text !important; - --color-tone-2: @subtext0 !important; - --color-tone-3: @overlay2 !important; - --color-tone-4: @surface0 !important; - --color-tone-5: @surface1 !important; - --color-tone-6: @surface2 !important; - --color-tone-7: @base !important; - --color-avatar-gradient: @accent-color !important; - --color-transparent-background-hover: fadeout(@surface0, 70) !important; - --color-opacity-50: fadeout(@base, 50) !important; - --color-online: @accent-color !important; - --color-favorite: @accent-color !important; - --color-brand-background: @accent-color !important; - --color-brand-background-hover: darken(@accent-color, 5%) !important; - --color-global-orangered: @accent-color !important; - --color-action-upvote: @accent-color !important; - --color-action-downvote: @blue; - - --shreddit-color-wordmark: @accent-color; - #reddit-logo { - circle[fill="#FF4500"] { - fill: @accent-color !important; - } - path[fill="#FFF"] { - fill: @crust !important; - } - } - - /* normal stuff */ - - &, - div[class^="subredditvars"] { - --color-online: @green !important; - --newCommunityTheme-actionIcon: @subtext0 !important; - --newCommunityTheme-actionIconAlpha20: fadeout(@crust, 20) !important; - --newCommunityTheme-actionIconAlpha50: fadeout(@crust, 20) !important; - --newCommunityTheme-actionIconShaded80: @subtext0 !important; - --newCommunityTheme-actionIconTinted80: @subtext1 !important; - --newCommunityTheme-active: @accent-color !important; - --newCommunityTheme-activeAlpha10: fadeout(@crust, 20) !important; - --newCommunityTheme-activeAlpha20: fadeout(@crust, 20) !important; - --newCommunityTheme-activeAlpha50: fadeout(@crust, 20) !important; - --newCommunityTheme-activeLight60: @accent-color !important; - --newCommunityTheme-activeShaded80: @accent-color !important; - --newCommunityTheme-activeShaded90: @accent-color !important; - --newCommunityTheme-activeTinted05: @text !important; - --newCommunityTheme-banner-backgroundColor: @accent-color !important; - --newCommunityTheme-banner-iconColor: @accent-color !important; - --newCommunityTheme-body: @mantle !important; - --newCommunityTheme-bodyAlpha50: @surface0 !important; - --newCommunityTheme-bodyAlpha70: @surface1 !important; - --newCommunityTheme-bodyAlpha80: @surface2 !important; - --newCommunityTheme-bodyFade: @subtext0 !important; - --newCommunityTheme-bodyShaded80: @mantle !important; - --newCommunityTheme-bodyText: @text !important; - --newCommunityTheme-bodyTextAlpha03: @mantle !important; - --newCommunityTheme-bodyTextAlpha20: @surface1 !important; - --newCommunityTheme-bodyTextShaded20: @surface0 !important; - --newCommunityTheme-bodyTextTinted20: @subtext0 !important; - --newCommunityTheme-bodyTinted50: @overlay1 !important; - --newCommunityTheme-bodyTinted80: @overlay0 !important; - --newCommunityTheme-button: @text !important; - --newCommunityTheme-buttonAlpha05: fadeout(@crust, 20) !important; - --newCommunityTheme-buttonAlpha10: fadeout(@crust, 20) !important; - --newCommunityTheme-buttonAlpha20: fadeout(@crust, 20) !important; - --newCommunityTheme-buttonAlpha40: @subtext0 !important; - --newCommunityTheme-buttonAlpha50: @subtext1 !important; - --newCommunityTheme-buttonAlpha80: @subtext1 !important; - --newCommunityTheme-buttonShaded80: @overlay0 !important; - --newCommunityTheme-buttonTinted20: @accent-color !important; - --newCommunityTheme-buttonTinted50: @accent-color !important; - --newCommunityTheme-buttonTinted80: @accent-color !important; - --newCommunityTheme-canvas: @crust !important; - --newCommunityTheme-checkbox: @text !important; - --newCommunityTheme-errorText: @red !important; - --newCommunityTheme-field: @surface0 !important; - --newCommunityTheme-fieldFade: fadeout(@surface1, 30) !important; - --newCommunityTheme-flair: @accent-color !important; - --newCommunityTheme-highlight: @base !important; - --newCommunityTheme-inactive: @subtext0 !important; - --newCommunityTheme-lightText: @text !important; - --newCommunityTheme-lightTextAlpha75: @subtext1 !important; - --newCommunityTheme-line: fadeout(@surface1, 30) !important; - --newCommunityTheme-lineShaded80: fadeout(@surface1, 30) !important; - --newCommunityTheme-lineShaded90: fadeout(@surface1, 30) !important; - --newCommunityTheme-lineShadedNinety: fadeout(@surface1, 30) !important; - --newCommunityTheme-linkText: @accent-color !important; - --newCommunityTheme-linkTextAlpha80: @accent-color !important; - --newCommunityTheme-linkTextShaded80: @accent-color !important; - --newCommunityTheme-linkTextTinted80: @accent-color !important; - --newCommunityTheme-linkTextWithBody: @accent-color !important; - --newCommunityTheme-menu: @mantle !important; - --newCommunityTheme-menuActiveText: @text !important; - --newCommunityTheme-menuButtonBackground-active: @base !important; - --newCommunityTheme-menuButtonBackground-focus: @base !important; - --newCommunityTheme-menuButtonBackground-hover: @base !important; - --newCommunityTheme-menuInactiveText: @text !important; - --newCommunityTheme-metaText: @subtext0 !important; - --newCommunityTheme-metaTextAlpha50: @subtext0 !important; - --newCommunityTheme-metaTextShaded80: @subtext0 !important; - --newCommunityTheme-monospaceColor: @accent-color !important; - --newCommunityTheme-navBar-activeLink: @text !important; - --newCommunityTheme-navBar-activeSubmenuCaret: @text !important; - --newCommunityTheme-navBar-activeSubmenuLink: @text !important; - --newCommunityTheme-navBar-backgroundColor: @mantle !important; - --newCommunityTheme-navBar-hoverLink: @text !important; - --newCommunityTheme-navBar-inactiveLink: @text !important; - --newCommunityTheme-navBar-inactiveSubmenuCaret: @text !important; - --newCommunityTheme-navBar-inactiveSubmenuLink: @text !important; - --newCommunityTheme-navBar-submenuBackgroundColor: @mantle !important; - --newCommunityTheme-navIcon: @text !important; - - /* upvote/downvote focus */ - --newCommunityTheme-navIconFaded10: fadeout(@crust, 20) !important; - - --newCommunityTheme-nsfw: @red !important; - --newCommunityTheme-nsfwBlocking-bgcolor: @crust !important; - --newCommunityTheme-nsfwBlocking-color: @text !important; - --newCommunityTheme-nsfwBlocking-contentTitleBgColor: @base !important; - --newCommunityTheme-nsfwBlocking-mainCtaBgColor: @mantle !important; - --newCommunityTheme-pageHeader: @surface2 !important; - --newCommunityTheme-placeholder: @surface0 !important; - --newCommunityTheme-post: @mantle !important; - --newCommunityTheme-postError: @red !important; - --newCommunityTheme-postFlairText: @crust !important; - --newCommunityTheme-postIcon: @accent-color !important; - --newCommunityTheme-postLine: fadeout(@surface1, 30) !important; - --newCommunityTheme-postLineShaded80: fadeout(@surface1, 30) !important; - --newCommunityTheme-postLineShaded90: fadeout(@surface1, 30) !important; - --newCommunityTheme-postTinted20: @base !important; - --newCommunityTheme-postTransparent20: @base !important; - --newCommunityTheme-primaryButtonShadedEighty: @overlay1 !important; - --newCommunityTheme-primaryButtonTintedEighty: @overlay1 !important; - --newCommunityTheme-primaryButtonTintedFifty: @overlay0 !important; - --newCommunityTheme-primaryButtonTintedSixty: @overlay0 !important; - --newCommunityTheme-quarantine: @yellow !important; - --newCommunityTheme-report: @surface1 !important; - --newCommunityTheme-search-syntaxHighlightBackgroundColor: @accent-color !important; - --newCommunityTheme-search-syntaxHighlightColor: @base !important; - --newCommunityTheme-titleText: @text !important; - --newCommunityTheme-upsell-appleIcon: @subtext1 !important; - --newCommunityTheme-upsell-ssoButtonBorderColor: fadeout( - @surface1, - 30 - ) !important; - --newCommunityTheme-upsell-ssoButtonTextColor: @text !important; - --newCommunityTheme-voteText-base: @subtext0 !important; - --newCommunityTheme-voteText-downvote: @blue !important; - --newCommunityTheme-voteText-downvoteShaded80: @blue !important; - --newCommunityTheme-voteText-downvoteTinted80: @blue !important; - --newCommunityTheme-voteText-upvote: @red !important; - --newCommunityTheme-voteText-upvoteShaded80: @red !important; - --newCommunityTheme-voteText-upvoteTinted80: @red !important; - --newCommunityTheme-widgetColors-appleIcon: @overlay0 !important; - --newCommunityTheme-widgetColors-lineColor: fadeout( - @surface1, - 30 - ) !important; - - /* sidebar widgets */ - --newCommunityTheme-widgetColors-sidebarWidgetBackgroundColor: @mantle !important; - --newCommunityTheme-widgetColors-sidebarWidgetBorderColor: fadeout( - @surface1, - 30 - ) !important; - --newCommunityTheme-widgetColors-sidebarWidgetHeaderColor: @crust !important; - --newCommunityTheme-widgetColors-sidebarWidgetHeaderColorAlpha60: @mantle !important; - --newCommunityTheme-widgetColors-sidebarWidgetTextColor: @text !important; - --newCommunityTheme-widgetColors-sidebarWidgetTextColorShaded80: @subtext1 !important; - --newCommunityTheme-widgetColors-sidebarWidgetTitleColor: @text !important; - - --newRedditTheme-actionIcon: @subtext0 !important; - --newRedditTheme-actionIconAlpha20: fadeout(@crust, 20) !important; - --newRedditTheme-actionIconAlpha50: fadeout(@crust, 20) !important; - --newRedditTheme-actionIconShaded80: @subtext0 !important; - --newRedditTheme-actionIconTinted80: @subtext1 !important; - --newRedditTheme-active: @accent-color !important; - --newRedditTheme-activeAlpha10: fadeout(@crust, 20) !important; - --newRedditTheme-activeAlpha20: fadeout(@crust, 20) !important; - --newRedditTheme-activeAlpha50: fadeout(@crust, 20) !important; - --newRedditTheme-activeLight60: @accent-color !important; - --newRedditTheme-activeShaded80: @accent-color !important; - --newRedditTheme-activeShaded90: @accent-color !important; - --newRedditTheme-activeTinted05: @text !important; - --newRedditTheme-banner-backgroundColor: @accent-color !important; - --newRedditTheme-banner-iconColor: @accent-color !important; - --newRedditTheme-body: @mantle !important; - --newRedditTheme-bodyAlpha50: @surface0 !important; - --newRedditTheme-bodyAlpha70: @surface1 !important; - --newRedditTheme-bodyAlpha80: @surface2 !important; - --newRedditTheme-bodyFade: fadeout(@crust, 20) !important; - --newRedditTheme-bodyShaded80: @mantle !important; - --newRedditTheme-bodyText: @text !important; - --newRedditTheme-bodyTextAlpha03: fadeout(@crust, 20) !important; - --newRedditTheme-bodyTextAlpha20: @surface1 !important; - --newRedditTheme-bodyTextShaded20: @surface0 !important; - --newRedditTheme-bodyTextTinted20: @subtext1 !important; - --newRedditTheme-bodyTinted50: @overlay0 !important; - --newRedditTheme-bodyTinted80: @overlay1 !important; - --newRedditTheme-button: @text !important; - --newRedditTheme-buttonAlpha05: fadeout(@crust, 20) !important; - --newRedditTheme-buttonAlpha10: fadeout(@crust, 20) !important; - --newRedditTheme-buttonAlpha20: fadeout(@crust, 20) !important; - --newRedditTheme-buttonAlpha40: @subtext0 !important; - --newRedditTheme-buttonAlpha50: @subtext1 !important; - --newRedditTheme-buttonAlpha80: @subtext1 !important; - --newRedditTheme-buttonShaded80: @overlay0 !important; - --newRedditTheme-buttonTinted20: @accent-color !important; - --newRedditTheme-buttonTinted50: @accent-color !important; - --newRedditTheme-buttonTinted80: @accent-color !important; - --newRedditTheme-canvas: @crust !important; - --newRedditTheme-checkbox: @text !important; - --newRedditTheme-errorText: @red !important; - --newRedditTheme-field: @base !important; - --newRedditTheme-fieldFade: @mantle !important; - --newRedditTheme-flair: @accent-color !important; - - /* controls menu, link, and other similar highlights. very important */ - --newRedditTheme-highlight: @base !important; - - --newRedditTheme-inactive: @surface0 !important; - --newRedditTheme-lightText: @text !important; - --newRedditTheme-lightTextAlpha75: @subtext1 !important; - --newRedditTheme-line: fadeout(@surface1, 30) !important; - --newRedditTheme-lineShaded80: fadeout(@surface1, 30) !important; - --newRedditTheme-lineShaded90: fadeout(@surface1, 30) !important; - --newRedditTheme-lineShadedNinety: fadeout(@surface1, 30) !important; - - /* links */ - --newRedditTheme-linkText: @accent-color !important; - --newRedditTheme-linkTextAlpha80: @accent-color !important; - --newRedditTheme-linkTextShaded80: @accent-color !important; - --newRedditTheme-linkTextTinted80: @accent-color !important; - --newRedditTheme-linkTextWithBody: @accent-color !important; - - /* menus */ - --newRedditTheme-menu: @mantle !important; - --newRedditTheme-menuActiveText: @text !important; - --newRedditTheme-menuButtonBackground-active: @accent-color !important; - --newRedditTheme-menuButtonBackground-focus: @base !important; - --newRedditTheme-menuButtonBackground-hover: @base !important; - --newRedditTheme-menuInactiveText: @text !important; - - --newRedditTheme-metaText: @subtext0 !important; - --newRedditTheme-metaTextAlpha50: fadeout(@crust, 20) !important; - --newRedditTheme-metaTextShaded80: @subtext1 !important; - --newRedditTheme-monospaceColor: @accent-color !important; - --newRedditTheme-navBar-activeLink: @text !important; - --newRedditTheme-navBar-activeSubmenuCaret: @text !important; - --newRedditTheme-navBar-activeSubmenuLink: @text !important; - --newRedditTheme-navBar-backgroundColor: @mantle !important; - --newRedditTheme-navBar-hoverLink: @text !important; - --newRedditTheme-navBar-inactiveLink: @text !important; - --newRedditTheme-navBar-inactiveSubmenuCaret: @text !important; - --newRedditTheme-navBar-inactiveSubmenuLink: @text !important; - --newRedditTheme-navBar-submenuBackgroundColor: @mantle !important; - --newRedditTheme-navIcon: @text !important; - --newRedditTheme-navIconFaded10: fadeout(@crust, 20) !important; - --newRedditTheme-nsfw: @red !important; - --newRedditTheme-nsfwBlocking-bgcolor: @crust !important; - --newRedditTheme-nsfwBlocking-color: @text !important; - --newRedditTheme-nsfwBlocking-contentTitleBgColor: @base !important; - --newRedditTheme-nsfwBlocking-mainCtaBgColor: @mantle !important; - --newRedditTheme-pageHeader: @surface0 !important; - --newRedditTheme-placeholder: @surface1 !important; - --newRedditTheme-post: @mantle !important; - --newRedditTheme-postError: @red !important; - --newRedditTheme-postFlairText: @text !important; - --newRedditTheme-postIcon: @accent-color !important; - --newRedditTheme-postLine: fadeout(@surface1, 30) !important; - --newRedditTheme-postLineShaded80: fadeout(@surface1, 30) !important; - --newRedditTheme-postLineShaded90: fadeout(@surface1, 30) !important; - --newRedditTheme-postTinted20: @base !important; - --newRedditTheme-postTransparent20: fadeout(@crust, 20) !important; - --newRedditTheme-primaryButtonShadedEighty: @surface1 !important; - --newRedditTheme-primaryButtonTintedEighty: @surface2 !important; - --newRedditTheme-primaryButtonTintedFifty: @surface1 !important; - --newRedditTheme-primaryButtonTintedSixty: @surface1 !important; - --newRedditTheme-quarantine: @yellow !important; - --newRedditTheme-report: @base !important; - --newRedditTheme-search-syntaxHighlightBackgroundColor: @accent-color !important; - --newRedditTheme-search-syntaxHighlightColor: @base !important; - --newRedditTheme-titleText: @text !important; - --newRedditTheme-upsell-appleIcon: @overlay0 !important; - --newRedditTheme-upsell-ssoButtonBorderColor: @text !important; - --newRedditTheme-upsell-ssoButtonTextColor: @text !important; - --newRedditTheme-voteText-base: @subtext1 !important; - --newRedditTheme-voteText-downvote: @blue !important; - --newRedditTheme-voteText-downvoteShaded80: @blue !important; - --newRedditTheme-voteText-downvoteTinted80: @blue !important; - --newRedditTheme-voteText-upvote: @red !important; - --newRedditTheme-voteText-upvoteShaded80: @red !important; - --newRedditTheme-voteText-upvoteTinted80: @red !important; - --newRedditTheme-widgetColors-appleIcon: @overlay0 !important; - --newRedditTheme-widgetColors-lineColor: fadeout( - @surface1, - 30 - ) !important; - --newRedditTheme-widgetColors-sidebarWidgetBackgroundColor: @mantle !important; - --newRedditTheme-widgetColors-sidebarWidgetBorderColor: fadeout( - @surface1, - 30 - ) !important; - --newRedditTheme-widgetColors-sidebarWidgetHeaderColor: @crust !important; - --newRedditTheme-widgetColors-sidebarWidgetHeaderColorAlpha60: fadeout( - @crust, - 20 - ) !important; - --newRedditTheme-widgetColors-sidebarWidgetTextColor: @text !important; - --newRedditTheme-widgetColors-sidebarWidgetTextColorShaded80: @subtext1 !important; - --newRedditTheme-widgetColors-sidebarWidgetTitleColor: @text !important; - --tw-bg-opacity: @crust !important; - --vds-video-bg-color: @crust !important; - } - - /* reddit chat variables */ - :root { - --activity-button-chatFilterColor: @surface0 !important; - --activity-button-newChatFilter-activeBg: @accent-color !important; - --activity-button-newChatFilter-activeText: @base !important; - --activity-button-newChatFilter-defaultBorder: @surface1 !important; - --activity-button-newChatFilter-defaultText: @text !important; - --activity-button-primary: @accent-color !important; - --activity-button-secondary: @text !important; - --activity-buttonPrimary-color: @accent-color !important; - --activity-buttonSecondary-active: @accent-color !important; - --activity-checkbox-checked: @accent-color !important; - --activity-checkbox-checkmark: @text !important; - --activity-checkbox-unchecked: @base !important; - --activity-checkbox-uncheckedBorder: @surface1 !important; - --activity-icon-active: @accent-color !important; - --activity-icon-contrast: @surface1 !important; - --activity-icon-default: @subtext0 !important; - --activity-icon-disable: @surface2 !important; - --activity-icon-hover: @surface2 !important; - --activity-icon-nsfw-bg: @base !important; - --activity-icon-nsfw-text: @text !important; - --activity-icon-subIcon-backgroundColor: @text !important; - --activity-icon-toaster: @crust !important; - --activity-input-background: fadeout(@crust, 20) !important; - --activity-input-border: @surface1 !important; - --activity-input-channelRename: @subtext0 !important; - --activity-input-color: @subtext1 !important; - --activity-input-error: @red !important; - --activity-input-focusBg: @green !important; - --activity-input-focusColor: @text !important; - --activity-input-ownerBg: @surface0 !important; - --activity-link-hoverText: @red !important; - --activity-link-staticText: @accent-color !important; - --activity-link-staticUnderline: @accent-color !important; - --activity-minimizedPortal-backgroundColor-unreadFinal: @mantle !important; - --activity-minimizedPortal-backgroundColor-unreadInitial: @accent-color !important; - --activity-minimizedPortal-color-unreadFinal: @text !important; - --activity-minimizedPortal-color-unreadInitial: @text !important; - --activity-send-disable: @surface0 !important; - --activity-send-hover: @accent-color !important; - --activity-text-active: @accent-color !important; - --activity-text-fade: @subtext0 !important; - --activity-text-highlight: @text !important; - --activity-text-light: @subtext0 !important; - --activity-text-meta: @subtext0 !important; - --activity-text-regular: @text !important; - --activity-text-success: @green !important; - --activity-text-tutorial: @rosewater !important; - --activity-text-warning: @red !important; - --addReaction-backgroundColor: @surface0 !important; - --addReaction-iconFill: @surface1 !important; - --boxShadow: fadeout(@crust, 20) !important; - --bubble-border: fadeout(@surface1, 30) !important; - --bubble-channelsFilter-background: @crust !important; - --bubble-channelsFilter-selected: @overlay0 !important; - --bubble-color: @text !important; - --bubble-link-color: @accent-color !important; - --bubbleActions-hover: @surface0 !important; - --editName: @surface1 !important; - --layout-body: @mantle !important; - --layout-colsBorder: fadeout(@surface1, 30) !important; - --layout-controlsBorder: fadeout(@surface1, 30) !important; - --layout-dropdown-border: fadeout(@surface1, 30) !important; - --layout-header-counterBg: @red !important; - --layout-header-counterText: @text !important; - --layout-overlayBackground: fadeout(@crust, 20) !important; - --layout-overlayReportFlow: fadeout(@crust, 20) !important; - --layout-scrollbar: @text !important; - --layout-scrollbarHover: @accent-color !important; - --layout-timeStamp-tooltip-background: @surface0 !important; - --message-list-item-button: @surface1 !important; - --message-list-item-onlineIndicator: @green !important; - --message-list-item-ownerBg: @surface1 !important; - --message-list-item-richItem: @overlay0 !important; - --message-list-item-richItemBorder: fadeout(@surface1, 30) !important; - --message-list-item-white: @text !important; - --modal-buttonsBackground: @text !important; - --modal-primaryButtonWarning: @red !important; - --modal-secondaryButton: @text !important; - --newChat-inviteLink-borderColor: fadeout(@surface1, 30) !important; - --overlay-backgroundColor: @mantle !important; - --overlay-headerColor: @text !important; - --overlay-inputBackground: @crust !important; - --overlay-searchBarBackground: @mantle !important; - --prompt-tooltip-background: @accent-color !important; - --searchBar-backgroundColor: @mantle !important; - --settings-color: @subtext0 !important; - --settings-dropdownItemHoverBackground: @crust !important; - --settings-panelBackground: @crust !important; - --settings-panelItemHoverBackground: @surface0 !important; - --settings-panelItemSelectedBackground: @surface1 !important; - --sidebar-background: fadeout(@surface1, 30) !important; - --sidebar-basic-background-active: @accent-color !important; - --sidebar-basic-background-hover: @mantle !important; - --sidebar-footer-background: @crust !important; - --sidebar-item-active: @surface1 !important; - --sidebar-item-hover: @surface0 !important; - --sidebar-item-selected: @surface2 !important; - --sidebar-item-text-active: @text !important; - --sidebar-subreddit-background-active: @accent-color !important; - --sidebar-subreddit-background-hover: @surface1 !important; - --sidebar-text-divider: @surface1 !important; - --skeleton-field: @surface2 !important; - --skeleton-inactive: @surface0 !important; - --subreddit-iconBg: @accent-color !important; - --toast-error: @red !important; - --toast-pending: @crust !important; - --toast-success: @green !important; - --uploads-progress-background: @subtext0 !important; - --uploads-progress-bar: @accent-color !important; - --videoModal-button-background: @text !important; - --videoModal-button-color: @mantle !important; - } - - /* site background */ - div.ListingLayout-backgroundContainer::before { - background: @base !important; - } - - /* PROFILE MENU */ - - /* karma count */ - span#email-collection-tooltip-id > :nth-child(2) > :nth-child(2) > span { - color: @subtext0 !important; - } - - /* profile button karma icon */ - i.icon-karma_fill { - color: @red !important; - } - - /* menu headers */ - div[role="menu"] > div > div > span > span { - color: @subtext0 !important; - } - - /* switches, should also apply sitewide */ - button[role="switch"][aria-checked="false"] { - background: @surface0 !important; - } - - button[role="switch"] > div { - background: @text !important; - } - - /* online status */ - ._2dn5Ncenn0BSD4tCSmxQhA { - fill: @green !important; - } - - ._3SlBAJb2MbUHwgBZFH8eL7 { - fill: @base !important; - } - - /* PROFILE PAGE */ - - /* create avatar button */ - button._3F1tNW0P4Ff182mO_CefIg { - background: linear-gradient(90deg, @red, @peach) !important; - color: @base !important; - } - - button._3F1tNW0P4Ff182mO_CefIg > i { - color: @base !important; - } - - /* cake day and followers icon */ - i.icon-cake_fill, - i.icon-user_fill { - color: @accent-color !important; - } - - /* add social links button readability tweak */ - div._3hew1NnzwygOKDNQDKp6R4, - div._3hew1NnzwygOKDNQDKp6R4 > i, - li._3hew1NnzwygOKDNQDKp6R4 { - color: @base !important; - } - - /* profile moderation and user settings page */ - div._1VP69d9lk-Wk9zokOaylL { - --background: @base !important; - --canvas: @base !important; - } - - /* Beta Badge */ - span._2KFJx8Dhh1o1u0Xb8e7NuD { - color: @accent-color !important; - } - - /* Delete Account */ - button.EBd2MhBQlQeZ13YeP0K8a { - color: @accent-color !important; - } - - /* Delete Account Icon */ - svg._1Fa4RPHlhrfUZuNaXK2-eP > path { - fill: @accent-color !important; - } - - /* blocked, muted input */ - input._1Vnaj3fBuYrmHKEPQD_zWW { - background-color: @base !important; - } - - /* fixes profile posts not being themed */ - div.scrollerItem > div, - div[data-testid="post-container"], - div[style="background:#1A1A1B"], - div._2otRz3OtuWajw1RleFDJ5P { - background: @mantle !important; - } - - /* NFT AVATAR VIEWER */ - - /* modal background */ - div._productDetails_7kbcu_53 { - background: @mantle !important; - color: @text !important; - } - - /* Tag Color */ - .RESUserTagImage::after { - color: @accent-color; - } - - /* mint status */ - div._mintStatus_7kbcu_264 { - color: @accent-color !important; - } - - /* carousel background */ - div._carousel_7kbcu_45 { - background: linear-gradient(243.37deg, @base 16.42%, @blue 100%); - } - - /* nft card back */ - div._card_1ooes_1 { - background: @blue !important; - } - - ol._container_1t62i_1 { - border-color: @base !important; - } - - ol._container_1t62i_1 > li { - border-color: @base !important; - } - - ol._container_1t62i_1 > li > div { - color: @base !important; - } - - div.MuiMobileStepper-dot { - background: @surface0 !important; - } - - div.MuiMobileStepper-dotActive { - background: @accent-color !important; - } - - div._scrollContainer_7kbcu_104 > div > h3, - div._cardAuthor_7kbcu_79 { - color: @subtext0 !important; - } - - div._container_oikih_1 { - background: @crust !important; - border-color: @surface1 !important; - } - - /* external links */ - a._pill_7kbcu_280 { - background: @crust !important; - color: @text !important; - } - - /* shop for avatars button */ - button._shopForMoreButton_7kbcu_125 { - background: linear-gradient(90deg, @red, @peach) !important; - color: @base !important; - } - - /* AVATAR CREATOR */ - div._wrapper_1upjl_7 { - background: @base !important; - color: @text !important; - } - - /* SITE HEADER */ - - /* reddit logo */ - a[aria-label="Home"] > svg > g > circle { - fill: @accent-color !important; - } - - a[aria-label="Home"] > svg:first-child > g > path { - fill: @base !important; - } - - a[aria-label="Home"] > svg:nth-child(2) > g > path { - fill: @text !important; - } - - /* Post title from notification */ - h1._eYtD2XCVieq6emjKBH3m { - color: @text !important; - } - - /* notification icon */ - button[aria-label="Open notifications inbox"] > div > span { - background: @accent-color !important; - color: @mantle !important; - } - - /* advertise button */ - #change-username-tooltip-id > span._2I12Htze2UzJmmfnrgYJOn > a { - background: @surface0 !important; - color: @text !important; - } - - #change-username-tooltip-id > span._2I12Htze2UzJmmfnrgYJOn > a > i { - color: @text !important; - } - - /* reddit now notification */ - a[href="/now"] > div { - background: @accent-color !important; - } - - /* search scope pill text */ - div[data-testid="search-scope-pill-text"] { - color: @text !important; - } - - /* search popup title */ - div[class*="_2SdHzo12ISmrC8H86TgSCp"][class*="_1QVrieUoti9cxiQSRw314E"][class*="uWdXen_41bh0iwLrgzFkc"] { - --posttitletextcolor: @text !important; - } - - /* safe search toggle */ - button#safe-search-toggle[aria-checked="true"] { - background: @accent-color !important; - } - - /* NAVIGATION SIDEBAR */ - - /* close icon */ - i.icon-close { - color: @subtext0 !important; - } - - /* item color */ - a[role="menuitem"] { - color: @text !important; - } - - /* navigation sidebar header color */ - div[role="menu"] > div[role="heading"] { - color: @subtext0 !important; - } - - a[role="menuitem"]:hover { - background: @surface0 !important; - } - - /* favorites */ - i.icon-star_fill { - color: @accent-color !important; - } - - i.icon-star { - color: @subtext0 !important; - } - - /* RIGHT FRONTPAGE SIDEBAR */ - - /* reddit premium icon */ - i.icon-premium_fill { - color: @accent-color !important; - } - - /* reddit premium try now button */ - button._10BQ7pjWbeYP63SAPNS8Ts.q_unSaY23rpdd3lDvGZ- { - background: @accent-color !important; - color: @base !important; - } - - /* recent posts thumbnail borders */ - div._3fWuhJ6bVet7XJT5A0mZM2 > div > div > div { - border-color: @subtext0 !important; - } - - /* POSTS */ - - /* post background for card style */ - div[data-adclicklocation="background"] { - background: @base !important; - } - - /* post options (save, comment, etc.) */ - div._3-miAEojrCvx_4FQ8x3P-s, - i.icon-comment, - i.icon-share, - i.icon-save, - i.icon-expand, - i.icon-collapse, - i.icon-text_post, - i.icon-image_post, - i.icon-media_gallery, - i.icon-video_post, - i.icon-gif_post, - i.icon-embed, - i.icon-external_link, - i.icon-poll_post { - color: @subtext0 !important; - } - - /* post title color */ - div[data-adclicklocation="title"] > div > a > div > h3, - div[data-adclicklocation="title"] - > div:first-child - > div:first-child - > h1:first-child { - color: @text !important; - } - - /* - * post op color and - * post date color - */ - div[data-adclicklocation="top_bar"] > span, - a[data-testid="post_author_link"] { - color: @subtext0 !important; - } - - /* nsfw flair */ - span._1wzhGvvafQFOWAyA157okr { - border-color: @red !important; - color: @red !important; - } - - /* pinned post icon */ - i.icon-pin_fill { - color: @green !important; - } - - /* give award icon */ - i.icon-award { - color: @subtext0 !important; - } - - /* locked post icon */ - i.icon-archived_fill, - i.icon-lock_fill { - color: @yellow !important; - } - - /* post button divider */ - div[data-click-id="body"] > div:nth-child(3) > div:nth-child(3) { - border-color: @surface1 !important; - } - - /* UPVOTES/DOWNVOTES */ - - /* upvote/downvote background */ - div.Post, - div[data-click-id="media"] { - background: @mantle !important; - fill: @mantle !important; - } - - /* inactive vote text color */ - div[id^="vote-arrows"] > div { - color: @subtext0 !important; - } - - /* active upvote color */ - i.icon-upvote_fill { - color: @red !important; - } - - button[aria-label="upvote"][aria-pressed="false"] > span:hover > i { - color: @red !important; - } - - /* active upvote text color */ - button[aria-label="upvote"][aria-pressed="true"] ~ div { - color: @red !important; - } - - /* hover background for both upvotes and downvotes */ - button[aria-label="upvote"][aria-label="downvote"] > span:hover { - background: @surface0 !important; - } - - /* active downvote color */ - .icon-downvote_fill { - color: @blue !important; - } - - /* active downvote text color */ - button[aria-label="downvote"][aria-pressed="true"] ~ div { - color: @blue !important; - } - - button[aria-label="downvote"][aria-pressed="false"] > span:hover > i { - color: @blue !important; - } - - /* REPORT MODAL */ - - a.o1ov2mzLxTFAFP-O4Uv8I { - color: @accent-color !important; - } - - button._1lDGFVGU9k2mi-4kjU95Rp { - color: @base !important; - } - - /* SUBREDDIT PAGES */ - a[role="button"][target="_blank"] { - background: @text !important; - color: @base !important; - } - - /* radio buttons (flair selector, etc.) */ - div[role="radio"]:hover, - div[role="radio"]:focus { - background: @accent-color !important; - } - - div[role="radio"] > svg, - div[role="radio"] > svg:active { - fill: @text !important; - } - - /* checkboxes */ - button[role="checkbox"] { - fill: @accent-color !important; - } - - /* SUBREDDIT RIGHT SIDEBAR (some styles carry over from the homepage right sidebar section) */ - - /* header background */ - ._ZhON3a3vplThB8NFwuJn { - background: @crust !important; - color: @text !important; - } - - /* subreddit image background */ - img[alt="Subreddit Icon"][role="presentation"] { - background: @accent-color !important; - } - - /* border between uela */ - ._1KrMye71CT332tKKKUWAj6:not(:last-of-type) { - border-bottom-color: @surface0; - } - - /* follower color */ - .bg-neutral-background { - color: @text !important; - } - - /* default subreddit icon */ - i.icon-community_fill { - color: @accent-color !important; - } - - /* online users */ - div._21RLQh5PvUhC6vOKoFeHUP::before { - color: @green !important; - } - - /* POST VIEWER */ - - /* spoiler tags */ - ._2v4IIjPhKL0PDaWaWtjJ1E { - background: @surface0 !important; - } - - /* mod comment tag */ - span[id^="CommentTopMeta--Mod"] { - color: @green !important; - } - - /* op comment tag */ - span[id^="CommentTopMeta--OP"] { - color: @blue !important; - } - - /* post overlay if you have "open in new tab" disabled */ - div#overlayScrollContainer > div { - background: @crust !important; - } - - /* fixes comment section background not working when "open in new tab is disabled" */ - div._2M2wOqmeoPVvcSsJ6Po9-V._3287nL7j7epK9JmDC3N1VR { - background: @mantle !important; - } - - /* shade applied to background when clicking on a post with "open in new tab" disabled */ - div._2DJXORCrmcNpPTSq0LqL6i, - div._1DK52RbaamLOWw5UPaht_S { - background: fadeout(@crust, 20) !important; - } - - /* gold award gradient */ - div.TmlaIdEplCzZ0F1aRGYQh[role="presentation"] { - background: linear-gradient( - 188deg, - #f9e2af1f 1.7%, - #f9e2af00 46%, - rgba(0, 0, 0, 0) - ) !important; - } - - /* image gallery next/previous buttons */ - a[title="Next"] > i, - a[title="Previous"] > i { - background: @surface0 !important; - } - - /* image gallery image count */ - div._61i6grM3um1yuw4GrN97P { - background: fadeout(@crust, 20) !important; - color: @text !important; - } - - /* comment search bar */ - input#comment_search-bar { - background: @base !important; - } - - /* tab bar below banner */ - ._1gVVmSnHZpkUgVShsn7-ua { - background: @mantle !important; - } - - /* MULTIREDDITS/CUSTOM FEEDS */ - - /* delete custom feed button */ - .bX6SqXfzfxpv4GQbuIYVZ { - color: @red !important; - } - - /* TOOLTIPS */ - div.HQ2VJViRjokXpRbJzPvvc { - background: @mantle !important; - color: @text !important; - } - - div.HQ2VJViRjokXpRbJzPvvc::after { - border-top-color: @mantle !important; - } - - /* Recap Reddit Logo */ - .snoo-cls-1, - .snoo-cls-2, - .snoo-cls-3, - .snoo-cls-6, - .snoo-cls-8, - .snoo-cls-9 { - fill: @base; - } - - .snoo-cls-4, - .snoo-cls-5, - .snoo-cls-7, - .snoo-cls-10, - .snoo-cls-11 { - fill: @accent-color; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/reddit/catppuccin.user.less b/styles/reddit/catppuccin.user.less new file mode 100644 index 0000000000..ce88940e32 --- /dev/null +++ b/styles/reddit/catppuccin.user.less @@ -0,0 +1,168 @@ +/* ==UserStyle== +@name Reddit Catppuccin +@namespace github.com/catppuccin/userstyles/styles/reddit +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/reddit +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/reddit/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Areddit +@description Soothing pastel theme for Reddit +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("reddit.com") { + :root:not(.theme-dark) .theme-rpl, + :root:not(.theme-dark).theme-rpl, + :root:not(.theme-dark) .theme-beta, + :root:not(.theme-dark).theme-beta, + .theme-light { + #catppuccin(@lightFlavor); + } + + :root:not(.theme-light) .theme-rpl, + :root:not(.theme-light).theme-rpl, + :root:not(.theme-light) .theme-beta, + :root:not(.theme-light).theme-beta, + .theme-dark { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --color-pizzaRed: @red !important; + --color-global-brand-orangered: @accent !important; + --color-global-focus: @surface1 !important; + --color-interactive-content-disabled: @subtext0 !important; + --color-interactive-background-disabled: fade(@surface2, 70%) !important; + --color-interactive-pressed: @surface2 !important; + --color-neutral-content: @text !important; + --color-neutral-content-disabled: @subtext0 !important; + --color-neutral-content-weak: @subtext0 !important; + --color-neutral-content-strong: @text !important; + --color-global-white: @crust !important; + --color-neutral-background: @base !important; + --color-neutral-background-selected: @surface0 !important; + --color-neutral-background-weak: @mantle !important; + --color-neutral-background-medium: @base !important; + --color-neutral-background-strong: @crust !important; + --color-neutral-background-hover: @surface0 !important; + --color-neutral-border: @surface0 !important; + --color-neutral-border-medium: @surface0 !important; + --color-neutral-border-weak: @surface0 !important; + --color-neutral-border-strong: @surface2 !important; + --color-primary: @accent !important; + --color-primary-hover: lighten(@accent, 10%) !important; + --color-primary-visited: @lavender !important; + --color-primary-background: @accent !important; + --color-primary-background-hover: darken(@accent, 5%) !important; + --color-primary-background-selected: darken(@accent, 5%) !important; + --color-primary-onBackground: @base !important; + --color-primary-onBackground-selected: @crust !important; + --color-secondary: @subtext0 !important; + --color-secondary-hover: @subtext1 !important; + --color-secondary-weak: @subtext0 !important; + --color-secondary-onBackground: @text !important; + --color-secondary-background: @mantle !important; + --color-secondary-background-hover: @surface1 !important; + --color-secondary-background-selected: @surface1 !important; + --color-secondary-plain: @subtext0 !important; + --color-secondary-plain-hover: @subtext1 !important; + --color-secondary-plain-weak: @subtext0 !important; + --color-danger-background: @red !important; + --color-danger-background-disabled: fade(@red, 20%) !important; + --color-danger-background-hover: fade(@red, 98%) !important; + --color-danger-onBackground: @text !important; + --color-danger-content: @red !important; + --color-danger-content-default: @crust; + --color-danger-content-hover: darken(@red, 2%) !important; + --color-success-content: @green !important; + --color-success-hover: darken(@green, 2%) !important; + --color-success-onBackground: @crust; + --color-success-background: @green !important; + --color-success-background-hover: darken(@green, 2%) !important; + --color-warning-content: @yellow !important; + --color-warning-content-hover: darken(@yellow, 2%) !important; + --color-warning-onBackground: @base !important; + --color-warning-background: @yellow !important; + --color-warning-background-hover: darken(@yellow, 2%) !important; + --color-upvote-content: @accent !important; + --color-upvote-disabled: @subtext0 !important; + --color-upvote-onBackground: @text !important; + --color-upvote-background: @base !important; + --color-upvote-background-hover: darken(@accent, 5%) !important; + --color-upvote-background-disabled: @base !important; + --color-downvote-content: @text !important; + --color-downvote-content-weak: @text !important; + --color-downvote-disabled: @subtext0 !important; + --color-downvote-onBackground: @text !important; + --color-downvote-background: @base !important; + --color-downvote-background-hover: darken(@blue, 5%) !important; + --color-downvote-background-disabled: @mantle !important; + --color-tone-1: @text !important; + --color-tone-2: @subtext0 !important; + --color-tone-3: @overlay2 !important; + --color-tone-4: @surface0 !important; + --color-tone-5: @surface1 !important; + --color-tone-6: @surface2 !important; + --color-tone-7: @base !important; + --color-avatar-gradient: @accent !important; + --color-transparent-background-hover: fade(@surface0, 30%) !important; + --color-opacity-50: fade(@base, 50%) !important; + --color-online: @accent !important; + --color-favorite: @accent !important; + --color-brand-background: @accent !important; + --color-brand-background-hover: darken(@accent, 5%) !important; + --color-brand-onBackground: @crust !important; + --color-global-orangered: @accent !important; + --color-action-upvote: @accent !important; + --color-action-downvote: @blue; + --color-banner-error-text: @base !important; + + --shreddit-color-wordmark: @accent; + #reddit-logo { + circle[fill="#FF4500"] { + fill: @accent !important; + } + path[fill="#FFF"] { + fill: @crust !important; + } + } + + /* Trending news carousel on https://www.reddit.com/r/popular/. */ + shreddit-gallery-carousel { + // Headline + .text-primary-onBackground { + color: @text; + } + + // r/... *and more* + .text-coolgray-350 { + color: @subtext1; + } + } + + /* Community themes - post header/metadata background and text. */ + #pdp-credit-bar { + --color-neutral-background: @base; + --color-neutral-content: @text; + --color-neutral-content-weak: @subtext0; + --color-primary-hover: lighten(@accent, 10%); + } + + reddit-header-large reddit-search-large::before, + reddit-header-large reddit-search-large::after { + background: + linear-gradient(@base, @base) padding-box, + linear-gradient(90deg, @accent, @accent) border-box; + } + } +} diff --git a/styles/reddit/preview.webp b/styles/reddit/preview.webp deleted file mode 100644 index 9636f0b282..0000000000 --- a/styles/reddit/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:585afc42f5d4cfedbb4099561dd94236c9bbb0f74109840979d96771e2b49246 -size 106238 diff --git a/styles/regex101/README.md b/styles/regex101/README.md new file mode 100644 index 0000000000..a49f53e219 --- /dev/null +++ b/styles/regex101/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for regex101 + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [uncenter](https://github.com/uncenter) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/regex101/catppuccin.user.less b/styles/regex101/catppuccin.user.less new file mode 100644 index 0000000000..2588787202 --- /dev/null +++ b/styles/regex101/catppuccin.user.less @@ -0,0 +1,164 @@ +/* ==UserStyle== +@name regex101 Catppuccin +@namespace github.com/catppuccin/userstyles/styles/regex101 +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/regex101 +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/regex101/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aregex101 +@description Soothing pastel theme for regex101 +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("regex101.com") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); + + :root { + &[data-theme="dark"] { + #catppuccin(@darkFlavor); + } + &[data-theme="light"] { + #catppuccin(@lightFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --primary-color: @crust; + --primary-contrast-color: @accent; + + --app-color: @text; + --app-color-metadata: @subtext0; + --app-contrast-color: @subtext1; + + --link-color: @accent; + + --highlight-bg: @green; + --spinner-bg: @overlay0; + --bg-0: @mantle; + --bg-1: @base; + --content-bg: @surface0; + + --content-border-color: @surface1; + --sub-content-bg: @surface1; + + --info-color: @subtext0; + --success-color: @green; + --warning-color: @yellow; + --danger-color: @red; + + --misc-button-icon-color: @subtext1; + --misc-button-bg: @surface0; + --misc-button-hover-bg: @surface1; + --misc-button-active-bg: @surface2; + --misc-button-active-color: @base; + --misc-button-highlight-bg: fade(@green, 40%); + + --editor-active-bg: @overlay2; + --library-active-bg: @yellow; + --account-active-bg: @green; + --quiz-active-bg: @teal; + --settings-active-bg: @pink; + + #hsl-variables(--button-bg, @surface0); + #hsl-variables(--button-ok-bg, @mantle); + #hsl-variables(--button-danger-bg, fade(@red, 30%)); + + --button-hover-l: lightness(@surface1); + --backdrop-bg: fade(@overlay0, 30%); + + --input-bg: @base; + --input-disabled-bg: @mantle; + --input-border-color: @surface0; + --input-focused-border-color: @surface0; + + --label-color: @subtext1; + --tooltip-color: @crust; + --tooltip-bg: @subtext0; + --version-btn-bg: fade(@green, 30%); + --match-indicator-no-match: fade(@blue, 30%); + --match-indicator-match-bg: fade(@green, 30%); + --match-indicator-error-bg: fade(@red, 30%); + + --debugger-backtrack-bg: fade(@red, 30%); + --debugger-regex-bg: fade(@green, 30%); + --debugger-slider-bg: @surface2; + + --header-discord-color: @lavender; + --header-twitter-color: @text; + --header-donate-color: @yellow; + --header-contact-color: @green; + --header-feedback-color: @maroon; + --header-wiki-color: @teal; + --header-whatsnew-color: @yellow; + --header-sponsor-color: @pink; + --header-paypal-color: @blue; + --header-info-color: @sky; + --header-social-color: @green; + --header-stripe-color: @blue; + + --starred-library-entry-bg: fade(@yellow, 10%); + --cm-whitespace-color: @overlay1; + --cm-selected-bg: fade(@accent, 30%); + --cm-inactive-selected-bg: fade(@accent, 30%); + + @match-group-colors: @blue, @green, @yellow, @mauve, @pink, @red, @green; + each( + @match-group-colors, + { + @i: @index - 1; + --match-group-@{i}: @value; + --match-group-@{i}-alt: darken(@value, 10%); + } + ); + + --match-highlight-color: fade(@yellow, 90%); + + --explanation-keyword-color: @green; + --explanation-token-bg: fade(@yellow, 80%); + --explanation-token-color: @base; + --explanation-plain-text-bg: fade(@surface2, 80%); + --explanation-flag-color: @mauve; + + --token-quote-color: @mauve; + --token-quote-bg: none; + --token-escaped-string-color: var(--app-color); + --token-escaped-string-bg: fade(@overlay1, 30%); + #accent-token(meta, @blue); + #accent-token(char-class, @rosewater); + #accent-token(char-class-meta, @flamingo); + #accent-token(subpattern-reference, @mauve); + #accent-token(group-0, @green); + #accent-token(group-1, @yellow); + #accent-token(group-2, @peach); + #accent-token(group-3, @maroon); + #accent-token(comment, transparent); + #accent-token(error, @red); + + #accent-token(@id, @color) { + --token-@{id}-bg: @color; + --token-@{id}-color: @base; + } + + #hsl-variables(@variable, @color) { + @{variable}-h: hue(@color); + @{variable}-s: saturation(@color); + @{variable}-l: lightness(@color); + } + + // Canvas is pulling Catppuccin colours from CSS variables, just needs fading for contrast + canvas { + filter: opacity(0.3); + } + } +} diff --git a/styles/rentry.co/README.md b/styles/rentry.co/README.md new file mode 100644 index 0000000000..45f4c14516 --- /dev/null +++ b/styles/rentry.co/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Rentry.co + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [thismoon](https://github.com/thismoon) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/rentry.co/catppuccin.user.less b/styles/rentry.co/catppuccin.user.less new file mode 100644 index 0000000000..4b56d8c391 --- /dev/null +++ b/styles/rentry.co/catppuccin.user.less @@ -0,0 +1,389 @@ +/* ==UserStyle== +@name Rentry.co Catppuccin +@namespace github.com/catppuccin/userstyles/styles/rentry.co +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/rentry.co +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/rentry.co/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Arentry.co +@description Soothing pastel theme for Rentry.co +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("rentry.org"), domain("rentry.co") { + @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); + + .dark-mode { + #catppuccin(@darkFlavor); + #darkModeBtn::before { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } + :root:not(.dark-mode) { + #catppuccin(@lightFlavor); + #darkModeBtn::before { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + body { + background: @crust; + color: @text; + } + /* Editor and preview */ + .cm-s-default, + .markdownx-preview, + .entry-text, + .tab-content { + background: @base !important; + color: @text !important; + } + + /* Tab navigation */ + .nav-link { + background: @mantle; + color: @overlay0 !important; + + &.active { + background: @base !important; + color: @text !important; + } + } + .form-control, + textarea { + background: @base !important; + color: @text !important; + } + .input-success { + box-shadow: inset 4px 0 @green !important; + } + .input-error { + &, + + .CodeMirror-wrap { + box-shadow: @red 4px 0 inset !important; + } + } + .input-warning { + box-shadow: @yellow 4px 0 inset !important; + } + .btn { + background: @base !important; + color: @text !important; + &:hover { + background: @surface0 !important; + color: @text !important; + } + } + .btn-success { + &, + &.btn, + &:hover { + color: @green !important; + } + &#submitButton { + background: @base !important; + &:hover { + background: @surface0 !important; + } + } + } + .btn-danger { + &, + &.btn, + &:hover { + color: @red !important; + } + } + .clipboard { + color: @text; + background: none; + } + #progressBar { + background-color: @blue !important; + } + .full-contrast:not(.active) path { + fill: @overlay2 !important; + } + .full-contrast.active path { + fill: @peach !important; + } + .edit-code { + background: @mantle; + color: @text !important; + } + .cb-tooltiptext { + color: @text !important; + background: @surface0 !important; + } + .cb-tooltiptext-bottom::after { + border-color: transparent transparent @surface0; + } + .headerlink { + color: @overlay1 !important; + } + #submitButton { + background: @mantle !important; + } + // claim-guide page + .color-change { + &[style="color:grey"] { + color: @overlay2 !important; + } + &[style="color:#039205"] { + color: @green !important; + } + } + // delete modal + .modal-content { + background: @crust; + color: @text; + } + .modal-body { + color: @overlay2; + } + .modal-header { + color: @text !important; + } + .modal-header, + .modal-footer { + border-color: @surface1 !important; + } + #deleteButton { + color: @red !important; + } + // footer + a { + color: @blue; + + &:hover { + color: @sky !important; + } + } + .text-muted { + color: @overlay2 !important; + } + .text-primary { + color: @blue !important; + } + .text-success { + color: @green !important; + } + .text-warning, + .text-warning-darker { + color: @yellow !important; + } + .text-danger { + color: @red !important; + } + // editor + .CodeMirror-line::selection, + .CodeMirror-line > span::selection, + .CodeMirror-line > span > span::selection { + background-color: fade(@overlay2, 25%); + } + .cm-s-default { + .cm-formatting-admonition { + color: @yellow; + } + .cm-mark { + color: @yellow; + } + .cm-link { + color: @lavender; + } + .cm-url { + color: @blue; + } + .cm-formatting-toc { + color: @mauve; + } + .cm-variable-2 { + color: @green; + } + .cm-keyword { + color: @pink; + } + .cm-meta { + color: @subtext0; + } + .cm-comment { + color: @pink; + } + .cm-hr { + color: @surface2; + } + .cm-tag { + color: @blue; + } + .cm-header { + color: @text; + } + .cm-quote { + color: @green; + border-color: @green; + } + } + blockquote { + color: @green; + border-color: @green; + } + mark { + background: fade(@yellow, 25%); + color: @text; + } + .spoiler { + color: @text; + background: @text; + } + .spoiler:hover { + background: none; + } + code { + color: @red !important; + background: fade(@red, 10%) !important; + } + hr { + border-top-color: @surface1 !important; + } + .admonition { + &.info, + &.hint, + &.tip { + color: @blue; + background: fade(@blue, 25%); + > .admonition-title::before { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } + &.note, + &.important { + color: @green; + background-color: fade(@green, 25%); + &, + .admonition.greentext { + > .admonition-title::before { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } + } + &.greentext { + color: @green; + background-color: fade(@yellow, 25%); + } + &.warning, + &.caution, + &.attention { + color: @yellow; + background-color: fade(@yellow, 25%); + > .admonition-title::before { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } + &.danger, + &.error { + color: @red; + background-color: fade(@red, 25%); + > .admonition-title::before { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } + .admonition-title::before, + &.warning > .admonition-title::before, + &.danger > .admonition-title::before { + filter: none !important; + } + } + // code + .highlighttable { + border-left-color: @surface0 !important; + } + .linenodiv > pre > .normal > a:not(:hover), + .linenodiv > pre > a:not(:hover) { + color: @overlay2 !important; + } + .entry-text pre, + .markdownx-preview pre, + code { + color: @red !important; + } + .highlight { + pre { + color: @text !important; + } + border-color: @surface0 !important; + } + /* tables */ + // help tab/page table + .mtable > tbody > tr:nth-child(even) { + background-color: @mantle !important; + } + // markdown tables + .ntable th { + background-color: @surface1 !important; + border-color: @surface2 !important; + color: @text; + } + .ntable tr:nth-child(even) { + background-color: @surface0 !important; + } + } +} + +@-moz-document regexp("https?://rentry\\.(co|org)/.+/(raw|exists)"), + url-prefix("https://rentry.co/static/"), + domain("export3.rentry.co") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + + // TODO: Can we use defaults? Currently doesn't have input/textarea placeholder styling. + color-scheme: if(@flavor = latte, light, dark); + + ::selection { + background-color: fade(@accent, 30%); + } + + body { + color: @text !important; + background: @base !important; + } + } +} diff --git a/styles/scalar/README.md b/styles/scalar/README.md new file mode 100644 index 0000000000..7af3057250 --- /dev/null +++ b/styles/scalar/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Scalar + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [incognitotgt](https://github.com/incognitotgt) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/scalar/catppuccin.user.less b/styles/scalar/catppuccin.user.less new file mode 100644 index 0000000000..967643af30 --- /dev/null +++ b/styles/scalar/catppuccin.user.less @@ -0,0 +1,85 @@ +/* ==UserStyle== +@name Scalar Catppuccin +@namespace github.com/catppuccin/userstyles/styles/scalar +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/scalar +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/scalar/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ascalar +@description Soothing pastel theme for Scalar +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("scalar.com") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); + code.hljs { + background: none !important; + } + + .light-mode { + #catppuccin(@lightFlavor); + } + + .dark-mode { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --scalar-color-1: @text; + --scalar-color-2: @subtext1; + --scalar-color-3: @subtext0; + --scalar-color-accent: @accent; + --scalar-background-1: @base; + --scalar-background-2: @surface0; + --scalar-background-3: @surface1; + --scalar-background-accent: fade(@accent, 12%); + --scalar-border-color: @surface1; + --scalar-color-green: @green; + --scalar-color-red: @red; + --scalar-color-yellow: @yellow; + --scalar-color-blue: @blue; + --scalar-color-orange: @peach; + --scalar-color-purple: @mauve; + --scalar-selection-1: fade(@accent, 30%); + --scalar-button-1: @accent; + --scalar-button-1-hover: darken(@accent, 5%); + --scalar-button-1-color: @base; + + background-color: @base; + + .sidebar { + --scalar-sidebar-background-1: @mantle; + --scalar-sidebar-item-hover-background: @surface0; + --scalar-sidebar-item-active-background: fade(@accent, 10%); + --scalar-sidebar-color-active: @accent; + } + + .scalar-code-block, .t-editor__code { + background-color: @mantle; + } + + .brightness-lifted { + filter: none; // remove elevated filter on dropdown modal backgrounds + } + + .text-white { + color: @base; // danger (delete) button text + } + + // https://scalar.com/ + .logo { + filter: @text-filter; + } + } +} diff --git a/styles/searchix/README.md b/styles/searchix/README.md new file mode 100644 index 0000000000..cfbe22219f --- /dev/null +++ b/styles/searchix/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Searchix + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [koibtw](https://github.com/koibtw) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/searchix/catppuccin.user.less b/styles/searchix/catppuccin.user.less new file mode 100644 index 0000000000..10978d9674 --- /dev/null +++ b/styles/searchix/catppuccin.user.less @@ -0,0 +1,50 @@ +/* ==UserStyle== +@name Searchix Catppuccin +@namespace github.com/catppuccin/userstyles/styles/searchix +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/searchix +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/searchix/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Asearchix +@description Soothing pastel theme for Searchix +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("searchix.ovh") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --bg: @base; + --accent-bg: @mantle; + --text: @text; + --text-light: @subtext0; + --accent: @accent; + --accent-hover: @accent; + --accent-error: fade(@red, 20%); + --border: @overlay0; + --code: @lavender; + --preformatted: @text; + --disabled: @crust; + + dialog { + color: var(--text); + } + } +} diff --git a/styles/searxng/README.md b/styles/searxng/README.md index 8e68504bf3..f57051ef06 100644 --- a/styles/searxng/README.md +++ b/styles/searxng/README.md @@ -10,18 +10,17 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainers -- [Sekki](https://github.com/Sekki21956) -- [Ryan Cao](https://github.com/ryanccn) +- [Sekki21956](https://github.com/Sekki21956) +- [ryanccn](https://github.com/ryanccn)   diff --git a/styles/searxng/catppuccin.user.css b/styles/searxng/catppuccin.user.less similarity index 52% rename from styles/searxng/catppuccin.user.css rename to styles/searxng/catppuccin.user.less index ba1ab91ecd..be7f01fb17 100644 --- a/styles/searxng/catppuccin.user.css +++ b/styles/searxng/catppuccin.user.less @@ -2,8 +2,8 @@ @name SearXNG Catppuccin @namespace github.com/catppuccin/userstyles/styles/searxng @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/searxng -@version 0.3.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/searxng/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/searxng/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Asearxng @description Soothing pastel theme for SearXNG @author Catppuccin @@ -17,75 +17,35 @@ @var checkbox additions "Additional Tweaks" 0 ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + /* Domains picked from https://searx.space/. */ -@-moz-document domain("https://search.bus-hit.me/"), domain("https://search.inetol.net/") -{ - @media (prefers-color-scheme: light) { - :root.theme-auto { - #catppuccin(@lightFlavor, @accentColor); +@-moz-document domain("search.bus-hit.me"), domain("search.inetol.net") { + :root.theme-auto { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - - @media (prefers-color-scheme: dark) { - :root.theme-auto { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } :root.theme-dark { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } :root.theme-light { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); --color-base-font: @text; --color-base-background: @base; --color-base-background-mobile: @base; - --color-url-font: @accent-color; - --color-url-visited-font: @accent-color; + --color-url-font: @blue; + --color-url-visited-font: @lavender; --color-header-background: @mantle; --color-header-border: @mantle; --color-footer-background: @mantle; @@ -96,15 +56,15 @@ --color-backtotop-font: @subtext1; --color-backtotop-border: @surface0; --color-backtotop-background: @surface0; - --color-btn-background: @accent-color; + --color-btn-background: @accent; --color-btn-font: @base; - --color-show-btn-background: @accent-color; + --color-show-btn-background: @accent; --color-show-btn-font: @base; --color-search-border: @surface0; --color-search-shadow: 0 2px 8px @crust; --color-search-background: @surface0; --color-search-font: @text; - --color-search-background-hover: @accent-color; + --color-search-background-hover: @accent; --color-error: @red; --color-error-background: @surface0; --color-warning: @yellow; @@ -112,7 +72,7 @@ --color-success: @green; --color-success-background: @surface0; --color-categories-item-selected-font: @text; - --color-categories-item-border-selected: @accent-color; + --color-categories-item-border-selected: @accent; --color-autocomplete-font: @subtext1; --color-autocomplete-border: @surface0; --color-autocomplete-shadow: 0 2px 8px @crust; @@ -124,11 +84,11 @@ --color-result-border: @base; --color-result-url-font: @subtext1; --color-result-vim-selected: @surface0; - --color-result-vim-arrow: @accent-color; + --color-result-vim-arrow: @accent; --color-result-description-highlight-font: @text; - --color-result-link-font: @accent-color; - --color-result-link-font-highlight: @accent-color; - --color-result-link-visited-font: @accent-color; + --color-result-link-font: @blue; + --color-result-link-font-highlight: @blue; + --color-result-link-visited-font: @lavender; --color-result-publishdate-font: @surface2; --color-result-engines-font: @surface2; --color-result-search-url-border: @surface2; @@ -137,7 +97,7 @@ --color-result-detail-label-font: @subtext0; --color-result-detail-background: @base; --color-result-detail-hr: @base; - --color-result-detail-link: @accent-color; + --color-result-detail-link: @blue; --color-result-detail-loader-border: rgba(255, 255, 255, 0.2); --color-result-detail-loader-borderleft: @crust; --color-result-image-span-font: @text; @@ -166,7 +126,7 @@ --color-toolkit-checkbox-onoff-off-mark-color: @mantle; --color-toolkit-checkbox-label-background: @base; --color-toolkit-checkbox-label-border: @mantle; - --color-toolkit-checkbox-input-border: @accent-color; + --color-toolkit-checkbox-input-border: @accent; --color-toolkit-engine-tooltip-border: @surface0; --color-toolkit-engine-tooltip-background: @surface0; --color-toolkit-loader-border: rgba(255, 255, 255, 0.2); @@ -175,13 +135,17 @@ --color-doc-code-background: @mantle; #search_logo svg :not([fill="none"]) { - fill: @accent-color; + fill: @accent; } #search_logo svg :not([stroke="none"]) { - stroke: @accent-color; + stroke: @accent; + } + + .index .title { + filter: @accent-filter; } - & when(@additions) { + & when (@additions = 1) { article.result { background-color: var(--color-result-background); border-radius: 0.75em; @@ -194,13 +158,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/searxng/preview.webp b/styles/searxng/preview.webp deleted file mode 100644 index 04b3afeac1..0000000000 --- a/styles/searxng/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6aec05055ae2eba05f78a53e08c35d37d9c7af5f0cfb5f29e7a69aa4bb847949 -size 68342 diff --git a/styles/seventv/README.md b/styles/seventv/README.md new file mode 100644 index 0000000000..3593a6cd13 --- /dev/null +++ b/styles/seventv/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for 7TV + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [mxgic1337](https://github.com/mxgic1337) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/seventv/catppuccin.user.less b/styles/seventv/catppuccin.user.less new file mode 100644 index 0000000000..aa3b274061 --- /dev/null +++ b/styles/seventv/catppuccin.user.less @@ -0,0 +1,514 @@ +/* ==UserStyle== +@name 7TV Catppuccin +@namespace github.com/catppuccin/userstyles/styles/seventv +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/seventv +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/seventv/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aseventv +@description Soothing pastel theme for 7TV +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("7tv.app") { + .light-theme { + #catppuccin(@lightFlavor); + } + .dark-theme { + #catppuccin(@darkFlavor); + } + + .system-theme { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + background-color: @base; + + --secondary: @surface0; + --secondary-text: @text; + --secondary-hover: @surface0; + --secondary-active: @surface0; + --secondary-disabled: @crust; + --secondary-border: transparent; + --primary: @accent; + --primary-text: @crust; + --primary-hover: darken(@accent, 5%); + --primary-active: darken(@accent, 5%); + --primary-disabled: @subtext0; + --primary-border: transparent; + --bg-dark: @crust; + --bg-medium: @mantle; + --bg-light: @base; + --text: @text; + --text-light: @subtext0; + --layout-border: transparent; + --border-active: @base; + --store: @mauve; + --preview: @mantle; + --danger: @peach; + --approve: @green; + --rename: @sapphire; + --staff: @red; + --staff-bg: fade(@red, 20%); + --admin-merge: @mauve; + --admin-unlist: @peach; + + .flag { + &[style*="#57ab5a"] { + color: @green !important; + background-color: fade(@green, 20%) !important; + } + /* Emote is in selected emote set */ + &[style*="#529bf5"] { + color: @accent !important; + background-color: fade(@accent, 20%) !important; + } + /* Emote is unlisted */ + &[style*="#eb3d26"] { + color: @red !important; + &[style*="background-color"] { + background-color: fade(@red, 20%) !important; + } + } + /* Emote is trending */ + &[style*="#e0823d"] { + color: @peach !important; + &[style*="background-color"] { + background-color: fade(@peach, 20%) !important; + } + } + /* Emote is overlaying */ + &[style*="#fc8dc7"] { + color: @pink !important; + &[style*="background-color"] { + background-color: fade(@pink, 20%) !important; + } + } + /* Personal emote set */ + &[style*="#b083f0"] { + color: @mauve !important; + } + } + + .badge { + color: @base; + } + + .emote, + .emote-set { + /* Emote is in selected emote set */ + &[style*="--highlight-active: #529bf5"] { + --highlight: fade(@accent, 80%) !important; + --highlight-active: @accent !important; + &.emote-set .name { + color: @accent !important; + } + } + + /* Emote is unlisted */ + &[style*="--highlight-active: #eb3d26"] { + --highlight: fade(@red, 80%) !important; + --highlight-active: @red !important; + } + + /* Emote is trending */ + &[style*="--highlight-active: #e0823d"] { + --highlight: fade(@peach, 80%) !important; + --highlight-active: @peach !important; + } + + /* Emote is overlaying */ + &[style*="--highlight-active: #fc8dc7"] { + --highlight: fade(@pink, 80%) !important; + --highlight-active: @pink !important; + } + + /* Emote set is a personal emote set */ + &.emote-set[style*="--highlight-active: #b083f0"] { + --highlight: fade(@mauve, 80%) !important; + --highlight-active: @mauve !important; + &.emote-set .name { + color: @mauve !important; + } + } + + /* Emote set is a special emote set */ + &.emote-set[style*="--highlight-active: #fcc200"] { + --highlight: fade(@yellow, 80%) !important; + --highlight-active: @yellow !important; + &.emote-set .name, + &.emote-set .flag { + color: @yellow !important; + } + } + } + + img.image, + .profile-picture, + .profile-name .name, + .user, + .user-link, + .username .name, + .role > span, + .side-bar .name, + .roles > span { + /* Admin */ + &[style*="255, 70, 70"] { + &, + span, + img { + color: @red !important; + border-color: @red !important; + } + } + + /* Moderator */ + &[style*="50, 168, 82"] { + &, + span, + img { + color: @green !important; + border-color: @green !important; + } + } + + &[style*="23, 235, 182"], + &[style*="177, 235, 52"], + &[style*="68, 194, 135"] { + &, + span { + color: @teal !important; + border-color: @teal !important; + } + } + /* Event coordinator */ + &[style*="182, 56, 181"] { + &, + span, + img { + color: @pink !important; + border-color: @pink !important; + } + } + + /* Verified */ + &[style*="145, 70, 255"] { + &, + span, + img { + color: @mauve !important; + border-color: @mauve !important; + } + } + /* Subscriber */ + &[style*="255, 170, 0"] { + &, + span, + img { + color: @yellow !important; + border-color: @yellow !important; + } + } + } + + .hero { + svg { + color: @text !important; + } + + color: @text; + .for-all { + -webkit-text-stroke-color: @text !important; + } + + &::before { + background: + radial-gradient( + 180% 80% at 0% 100%, + @text 0%, + @blue 25%, + fade(@mauve, 90%) 56%, + fade(@mauve, 50%) 79%, + transparent 100% + ), + @crust; + } + } + + /* Sub progress bar */ + + .progress-circle { + #progress { + stroke: @accent; + } + } + + .subgrid .badge { + color: @subtext0 !important; + } + + /* Subscribe gradients */ + .gradient { + color: @text !important; + + &.g1 { + background: + radial-gradient( + 150% 180% at 50% 180%, + @peach, + @yellow 1%, + @yellow 25%, + @mantle 75% + ), + var(--secondary) !important; + } + + &.g2 { + background: + radial-gradient( + 150% 180% at 50% 180%, + @text, + @red 1%, + @red 25%, + @mantle 75% + ), + var(--secondary) !important; + } + + &.g3 { + background: + radial-gradient( + 150% 180% at 50% 180%, + @peach, + @pink 1%, + @mauve 25%, + @mantle 75% + ), + var(--secondary) !important; + } + + &.g5 { + background: + radial-gradient( + 150% 180% at 50% 180%, + @peach, + @sapphire 1%, + @sapphire 25%, + @mantle 75% + ), + var(--secondary) !important; + } + } + + /* Home page glow */ + .weird-smiley::before, + .feature .background { + background-image: radial-gradient( + circle at bottom, + fade(@mauve, 20%), + fade(@sapphire, 20%) + ) !important; + } + + .banner { + color: @base; + + &[style="--gradient-color: #9227cf"] { + --gradient-color: @mauve !important; + } + &[style="--gradient-color: #27cfb1"] { + --gradient-color: @teal !important; + } + &[style="--gradient-color: #ff11bc"] { + --gradient-color: @red !important; + } + + &::before { + background: + radial-gradient( + 100% 100% at 50% 0%, + @text 0%, + var(--gradient-color) 33%, + @mauve 64%, + fade(@mauve, 50%) 80%, + @mantle 100% + ), + var(--bg-medium) !important; + } + } + + /* Sub badge progress bar */ + + progress[value].bar { + &::-webkit-progress-bar, + &::-moz-progress-bar { + background: @accent !important; + } + } + } +} +@-moz-document domain("twitch.tv") { + .tw-root--theme-dark { + #catppuccin(@darkFlavor); + } + .tw-root--theme-light { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + + --seventv-text-color-normal: @text; + --seventv-text-color-secondary: @subtext0; + + --seventv-border-transparent-1: @surface0; + --seventv-background-shade-1: @base; + --seventv-background-shade-2: @mantle; + --seventv-background-shade-3: @crust; + --seventv-background-transparent-1: @base; + --seventv-background-transparent-2: @mantle; + --seventv-background-transparent-3: @mantle; + --seventv-highlight-neutral-1: @surface0; + --seventv-input-background: @mantle; + --seventv-input-border: @surface0; + --seventv-subscriber-color: @yellow; + + --seventv-highlight-color: @accent; + --seventv-highlight-dim-color: fade(@accent, 20%); + + --seventv-primary: @accent; + --seventv-accent: @green; + --seventv-warning: @peach; + --seventv-muted: @subtext0; + + .seventv-transparent { + --seventv-border-transparent-1: fade(@surface0, 77%); + --seventv-background-transparent-1: fade(@base, 77%); + --seventv-background-transparent-2: fade(@mantle, 59%); + --seventv-background-transparent-3: fade(@mantle, 71%); + } + + .seventv-announce-message-container { + .announce-header { + background-color: @crust; + } + .announce-message { + background-color: @base; + } + } + + .grabbable-inner, .grabbable-outer { + --color-border-input: @subtext0; + } + + .seventv-user-message { + /* First time chatter */ + &[style*="--seventv-highlight-color: #c832c8"] { + --seventv-highlight-color: @mauve !important; + --seventv-highlight-dim-color: fade(@mauve, 10%) !important; + } + /* Mention */ + &[style*="--seventv-highlight-color: #e13232"] { + --seventv-highlight-color: @red !important; + --seventv-highlight-dim-color: fade(@red, 10%) !important; + } + /* Blocked */ + &[style*="--seventv-highlight-color: #9488855A"] { + --seventv-highlight-color: @surface0 !important; + } + /* Raider */ + &[style*="--seventv-highlight-color: #6dd126"] { + --seventv-highlight-color: @green !important; + --seventv-highlight-dim-color: fade(@green, 10%) !important; + } + /* Returning chatter */ + &[style*="--seventv-highlight-color: #3296e6"] { + --seventv-highlight-color: @blue !important; + --seventv-highlight-dim-color: fade(@blue, 10%) !important; + } + } + + .seventv-chat-message-container:hover .seventv-chat-message-background { + background-color: @surface0; + } + + .seventv-sub-message-container, .seventv-reward-message-container { + background-color: @base; + } + + .seventv-settings-category { + .seventv-settings-category-dropdown .seventv-settings-subcategory { + &:hover { + background-color: @base !important; + } + &.intersect { + background-color: @surface0 !important; + } + } + + .settings-category-header { + &:hover, &:focus-within { + background-color: @base; + } + } + } + + .seventv-settings-category[in-view="true"] > .settings-category-header { + background-color: @surface0; + } + + .paint-tool-home { + h6[style="color: red;"] { + color: @peach !important; + } + } + + section[timeline-id="LIVE"] { + label, div[selector="date-boundary"] { + color: @red; + border-color: @red; + } + } + + .seventv-emote-container[zero-width="true"] { + border-color: @yellow; + } + + .scope-labels { + .label-global { + color: @green; + } + .label-sub-feature { + color: @yellow; + } + } + + [style*="rgb(255, 255, 255)"] .seventv-chat-user-username span { + color: @text !important; + } + + .seventv-chat-mod-buttons { + color: @subtext0; + + svg:hover { + color: @text; + } + } + } +} diff --git a/styles/shinigami-eyes/README.md b/styles/shinigami-eyes/README.md index 818d5dab77..297366887b 100644 --- a/styles/shinigami-eyes/README.md +++ b/styles/shinigami-eyes/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [jh-devv](https://github.com/jh-devv) +- [sofiedotcafe](https://github.com/sofiedotcafe)   diff --git a/styles/shinigami-eyes/catppuccin.user.css b/styles/shinigami-eyes/catppuccin.user.less similarity index 50% rename from styles/shinigami-eyes/catppuccin.user.css rename to styles/shinigami-eyes/catppuccin.user.less index d9b38d88cd..f4b56d79f4 100644 --- a/styles/shinigami-eyes/catppuccin.user.css +++ b/styles/shinigami-eyes/catppuccin.user.less @@ -2,8 +2,8 @@ @name Shinigami Eyes Catppuccin @namespace github.com/catppuccin/userstyles/styles/shinigami-eyes @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/shinigami-eyes -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/shinigami-eyes/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/shinigami-eyes/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ashinigami-eyes @description Soothing pastel theme for Shinigami Eyes @author Catppuccin @@ -15,6 +15,8 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + /* These are the domains for the sites that Shinigami Eyes works with. The list can be found at https://github.com/shinigami-eyes/shinigami-eyes/blob/b66e9ad41fa4daef31886b139d8af6f852efcaaa/extension/manifest.json#L15-L96. @@ -93,45 +95,17 @@ The list can be found at https://github.com/shinigami-eyes/shinigami-eyes/blob/b domain("google.no"), domain("google.pt"), domain("google.se") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + #catppuccin(@flavor) { + #lib.palette(); body { --ShinigamiEyesTFriendly: @green !important; @@ -149,13 +123,3 @@ The list can be found at https://github.com/shinigami-eyes/shinigami-eyes/blob/b } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/shinigami-eyes/preview.webp b/styles/shinigami-eyes/preview.webp deleted file mode 100644 index 29ae6a314d..0000000000 --- a/styles/shinigami-eyes/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:e56b660a8b4de5267ff907fce695b94ced66d46d1321a39466a2e3e70e4a3d70 -size 91364 diff --git a/styles/snapchat-web/README.md b/styles/snapchat-web/README.md index b1cf65d737..507e72b4c2 100644 --- a/styles/snapchat-web/README.md +++ b/styles/snapchat-web/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [Meow](https://github.com/itzTheMeow) +- [itzTheMeow](https://github.com/itzTheMeow)   diff --git a/styles/snapchat-web/catppuccin.user.css b/styles/snapchat-web/catppuccin.user.css deleted file mode 100644 index 004d292217..0000000000 --- a/styles/snapchat-web/catppuccin.user.css +++ /dev/null @@ -1,173 +0,0 @@ -/* ==UserStyle== -@name Snapchat Web Catppuccin -@namespace github.com/catppuccin/userstyles/styles/snapchat-web -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/snapchat-web -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/snapchat-web/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Asnapchat-web -@description Soothing pastel theme for Snapchat Web -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('web.snapchat.com') { - :root[theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); - } - :root[theme="light"] { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - /* Snapchat applies the variables (overrides?) to specific elements so we need to apply to every element (with high specificity) to override those. */ - &, - body > main#root * { - --sigMain: @base; - --sigSurface: @mantle; - --sigSurfaceRGB: red(@mantle) green(@mantle) blue(@mantle); - --sigAboveSurface: @crust; - --sigSurfaceDown: @base; - --sigSubscreen: @crust; - --sigTextField: @crust; - --sigDivider: @surface0; - --sigDividerLight: @surface0; - --sigColorBackgroundBorder: @surface0; - --sigBackgroundPrimary: @base; - --sigBackgroundSecondary: @mantle; - --sigBackgroundSecondaryHover: darken(@mantle, 5%); - --sigBackgroundTertiary: @crust; - --sigBackgroundMessageHover: @surface1; - --sigBackgroundMessageSaved: @surface0; - --sigBackgroundMessageSavedHover: @surface2; - --sigOverlay: fade(@overlay0, 0.4); - --sigOverlayHover: fade(@overlay0, 0.35); - --sigBrandSecondary: @accent-color; - - --sigTextPrimary: @text; - --sigButtonOnPrimary: @crust; - --sigTextSecondary: @subtext0; - --sigButtonOnSecondary: @subtext0; - --sigTextTertiary: @subtext1; - --sigButtonOnTertiary: @subtext1; - --sigTextNegative: @red; - --sigButtonOnSuccess: @base; - --sigButtonOnError: @base; - --sigButtonOnNegative: @base; - --sigButtonOnChatSurfaceCalling: @base; - --sigTextPlayer: @crust; - --sigButtonGreyHover: darken(@surface0, 5%); - --sigButtonGreyActive: darken(@surface0, 8%); - - --sigButtonPrimary: @accent-color; - --sigButtonPrimaryHover: darken(@accent-color, 5%); - --sigButtonPrimaryActive: darken(@accent-color, 8%); - --sigButtonSecondary: @surface0; - --sigButtonSecondaryHover: @surface1; - --sigButtonSecondaryActive: @surface2; - --sigButtonNegative: @red; - --sigButtonError: @red; - --sigButtonErrorHover: darken(@red, 5%); - --sigButtonSuccess: @green; - --sigButtonSuccessHover: darken(@green, 5%); - --sigIconCalling: @green; - --sigIconCallingHover: darken(@green, 5%); - --sigChatSurfaceCalling: @green; - --sigChatSurfaceCallingDisabled: darken(@green, 20%); - --sigChatSurfaceCallingHover: darken(@green, 5%); - - --sigChat: @blue; - --sigChatIcon: @blue; - --sigSnapWithoutSound: @red; - --sigSnapWithSound: @mauve; - } - - // new chat button - button[title="New Chat"], - // checkbox to choose camera - [id*="downshift-"] a, - // checkbox in new chat popup - [aria-label="Unselect chosen user"] { - path[fill="#fff"] { - fill: @crust; - } - // replaces blue fill - path[fill="#51B7FF"] { - fill: @accent-color; - } - } - - // new group button - form > div > div > div[role="searchbox"] button { - color: @crust; - path { - fill: @crust; - } - } - - // story reply text - li button[type="button"].replyText { - background-color: rgba(30, 30, 30, 0.8); - } - - // buttons when in call - [data-projection-id] button { - --sigColorAlwaysWhite: @surface0; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/snapchat-web/catppuccin.user.less b/styles/snapchat-web/catppuccin.user.less new file mode 100644 index 0000000000..51973eb5c5 --- /dev/null +++ b/styles/snapchat-web/catppuccin.user.less @@ -0,0 +1,133 @@ +/* ==UserStyle== +@name Snapchat Web Catppuccin +@namespace github.com/catppuccin/userstyles/styles/snapchat-web +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/snapchat-web +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/snapchat-web/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Asnapchat-web +@description Soothing pastel theme for Snapchat Web +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document url-prefix("https://www.snapchat.com/web") { + :root[theme="dark"] { + #catppuccin(@darkFlavor); + } + :root[theme="light"] { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + /* Snapchat applies the variables (overrides?) to specific elements so we need to apply to every element (with high specificity) to override those. */ + &, + body > main#root * { + --sigMain: @base; + --sigSurface: @mantle; + --sigSurfaceRGB: red(@mantle), green(@mantle), blue(@mantle); + --sigAboveSurface: @crust; + --sigSurfaceDown: @base; + --sigSubscreen: @crust; + --sigTextField: @crust; + --sigDivider: @surface0; + --sigDividerLight: @surface0; + --sigColorBackgroundBorder: @surface0; + --sigBackgroundPrimary: @base; + --sigBackgroundSecondary: @mantle; + --sigBackgroundSecondaryHover: darken(@mantle, 5%); + --sigBackgroundTertiary: @crust; + --sigBackgroundMessageHover: @surface1; + --sigBackgroundMessageSaved: @surface0; + --sigBackgroundMessageSavedHover: @surface2; + --sigOverlay: fade(@surface1, 40%); + --sigOverlayHover: fade(@surface1, 35%); + --sigBrandSecondary: @accent; + --sigObject: rgba(255, 255, 255, 0.05); + + --sigTextPrimary: @text; + --sigButtonOnPrimary: @crust; + --sigTextSecondary: @subtext0; + --sigButtonOnSecondary: @subtext0; + --sigTextTertiary: @subtext1; + --sigButtonOnTertiary: @subtext1; + --sigTextNegative: @red; + --sigButtonOnSuccess: @base; + --sigButtonOnError: @base; + --sigButtonOnNegative: @base; + --sigButtonOnChatSurfaceCalling: @base; + --sigTextPlayer: @crust; + --sigButtonGreyHover: darken(@surface0, 5%); + --sigButtonGreyActive: darken(@surface0, 8%); + + --sigButtonPrimary: @accent; + --sigButtonPrimaryHover: darken(@accent, 5%); + --sigButtonPrimaryActive: darken(@accent, 8%); + --sigButtonSecondary: @surface0; + --sigButtonSecondaryHover: @surface1; + --sigButtonSecondaryActive: @surface2; + --sigButtonNegative: @red; + --sigButtonError: @red; + --sigButtonErrorHover: darken(@red, 5%); + --sigButtonSuccess: @green; + --sigButtonSuccessHover: darken(@green, 5%); + --sigIconCalling: @green; + --sigIconCallingHover: darken(@green, 5%); + --sigChatSurfaceCalling: @green; + --sigChatSurfaceCallingDisabled: darken(@green, 20%); + --sigChatSurfaceCallingHover: darken(@green, 5%); + + --sigChat: @blue; + --sigChatIcon: @blue; + --sigSnapWithoutSound: @red; + --sigSnapWithSound: @mauve; + } + + // new chat button + button[title="New Chat"], + // checkbox to choose camera + [id*="downshift-"] a, + // checkbox in new chat popup + [aria-label="Unselect chosen user"] { + path[fill="#fff"] { + fill: @crust; + } + // replaces blue fill + path[fill="#51B7FF"] { + fill: @accent; + } + } + + // new group button + form > div > div > div[role="searchbox"] button { + color: @crust; + path { + fill: @crust; + } + } + + // story reply text + li button[type="button"].replyText { + background-color: rgba(30, 30, 30, 0.8); + } + + // buttons when in call + [data-projection-id] button { + --sigColorAlwaysWhite: @surface0; + } + + // replay button on stories + img[role="presentation"][src^="blob:"] + div > svg > path[fill="#fff"] { + fill: @text; + } + } +} diff --git a/styles/snapchat-web/preview.webp b/styles/snapchat-web/preview.webp deleted file mode 100644 index ea3d733005..0000000000 --- a/styles/snapchat-web/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ef02978328a00292f95ecf9933b519d920f940b0c8df9eba9ae3f59a6b03c6c4 -size 115714 diff --git a/styles/spotify-web/README.md b/styles/spotify-web/README.md index cbe2a06c1b..c10f8a8441 100644 --- a/styles/spotify-web/README.md +++ b/styles/spotify-web/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/spotify-web/catppuccin.user.css b/styles/spotify-web/catppuccin.user.less similarity index 74% rename from styles/spotify-web/catppuccin.user.css rename to styles/spotify-web/catppuccin.user.less index fc0ad996f9..dc40f0edf3 100644 --- a/styles/spotify-web/catppuccin.user.css +++ b/styles/spotify-web/catppuccin.user.less @@ -2,8 +2,8 @@ @name Spotify Web Catppuccin @namespace github.com/catppuccin/userstyles/styles/spotify-web @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/spotify-web -@version 0.0.3 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/spotify-web/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/spotify-web/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aspotify-web @description Soothing pastel theme for Spotify Web @author Catppuccin @@ -14,55 +14,21 @@ @var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('open.spotify.com') { - @media (prefers-color-scheme: light) { - #catppuccin(@lightFlavor, @accentColor); - } - @media (prefers-color-scheme: dark) { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - color-scheme: if(@lookup =latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; +@-moz-document domain("open.spotify.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); .encore-dark-theme, .encore-dark-theme .encore-base-set, @@ -83,14 +49,14 @@ --background-unsafe-for-small-text-press: @base; --text-base: @text; --text-subdued: @subtext1; - --text-bright-accent: @accent-color; + --text-bright-accent: @accent; --text-negative: @red; --text-warning: @yellow; - --text-positive: @accent-color; + --text-positive: @accent; --text-announcement: @sapphire; --essential-base: @text; --essential-subdued: @subtext1; - --essential-bright-accent: @accent-color; + --essential-bright-accent: @accent; --essential-negative: @red; --essential-warning: @yellow; --essential-positive: @green; @@ -104,19 +70,19 @@ --background-press: @surface1; } .encore-dark-theme .encore-bright-accent-set { - --background-base: @accent-color; - --background-highlight: @accent-color; - --background-press: @accent-color; - --background-elevated-base: @accent-color; - --background-elevated-highlight: @accent-color; - --background-elevated-press: @accent-color; - --background-tinted-base: @accent-color; - --background-tinted-highlight: @accent-color; - --background-tinted-press: @accent-color; - --background-unsafe-for-small-text-base: @accent-color; - --background-unsafe-for-small-text-highlight: @accent-color; - --background-unsafe-for-small-text-press: @accent-color; - --decorative-subdued: darken(@accent-color, 10%); + --background-base: @accent; + --background-highlight: @accent; + --background-press: @accent; + --background-elevated-base: @accent; + --background-elevated-highlight: @accent; + --background-elevated-press: @accent; + --background-tinted-base: @accent; + --background-tinted-highlight: @accent; + --background-tinted-press: @accent; + --background-unsafe-for-small-text-base: @accent; + --background-unsafe-for-small-text-highlight: @accent; + --background-unsafe-for-small-text-press: @accent; + --decorative-subdued: darken(@accent, 10%); } .encore-dark-theme .encore-over-media-set { --background-base: @mantle; @@ -132,7 +98,7 @@ --background-tinted-highlight: @mantle; --background-tinted-press: @mantle; } - & when (@lookup =latte) { + & when (@flavor = latte) { .T1xI1RTSFU7Wu94UuvE6 * { background: @surface0 !important; } @@ -191,7 +157,7 @@ } .mjZrvVI3CxfHJXu7y0Lg, .coBkWVskipFo8KxLKief .T1xI1RTSFU7Wu94UuvE6 { - background-color: @accent-color !important; + background-color: @accent !important; } .ListRowTitle__LineClamp-sc-1xe2if1-0.lmgIvZ *, .EaTxqhHk6J4ecKHwpY5m *, @@ -354,13 +320,13 @@ background-color: @crust; } .S4OmZ_IZexmZ5dasPqW5 { - background-color: @accent-color !important; + background-color: @accent !important; } .T1xI1RTSFU7Wu94UuvE6[style*="background-color:"] { - background-color: @accent-color !important; + background-color: @accent !important; } .fIvMht6B9HdROywMNJZ4.hIFR8WDm_54EEIa1gwpC { - background-color: @accent-color !important; + background-color: @accent !important; } // Explicit icon .kpGMQq1KFz620g_BD_dS { @@ -436,7 +402,7 @@ color: @text !important; } #onetrust-pc-sdk .ot-accordion-layout.ot-cat-item { - border-color: @accent-color !important; + border-color: @accent !important; border-radius: 8px; } #onetrust-consent-sdk @@ -450,8 +416,8 @@ [aria-expanded], .ot-link-btn ) { - background-color: @accent-color !important; - border-color: @accent-color !important; + background-color: @accent !important; + border-color: @accent !important; } // Vendors List #onetrust-consent-sdk #onetrust-pc-sdk .ot-sel-all-hdr span { @@ -459,21 +425,21 @@ } #onetrust-pc-sdk input[type="text"] { background-color: @mantle !important; - border-color: @accent-color !important; + border-color: @accent !important; } #onetrust-pc-sdk .ot-pc-header, #onetrust-pc-sdk ul li { - border-bottom-color: @accent-color !important; - border-top-color: @accent-color !important; + border-bottom-color: @accent !important; + border-top-color: @accent !important; } #ot-ven-lst { - border-top-color: @accent-color !important; + border-top-color: @accent !important; } .ot-pc-footer { - border-top-color: @accent-color !important; + border-top-color: @accent !important; } #onetrust-pc-sdk li > button { - border-top-color: @accent-color !important; + border-top-color: @accent !important; } #onetrust-consent-sdk #onetrust-pc-sdk #ot-sel-blk { background-color: @base !important; @@ -512,19 +478,19 @@ .TywOcKZEqNynWecCiATc { --bg-color: @surface1; --fg-color: @text; - --is-active-fg-color: @accent-color; + --is-active-fg-color: @accent; } a { - color: @accent-color; + color: @accent; } .Ng3dPPA2_1CFYkzPukjM { background: @blue; } .KAZD28usA1vPz5GVpm63.EHxL6K_6WWDlTCZP6x5w::after { - background-color: @accent-color; + background-color: @accent; } .tippy-box[data-theme~="activation"] { - background-color: @accent-color; + background-color: @accent; color: @crust; .c0KyMkxeMCWQGE7cR8s_ *, .TextForLabel-sc-1jqya9m-0.kIsEKW { @@ -544,7 +510,7 @@ background: @surface0; } input:checked ~ .Js64TOfWtHksI6TQ6knT { - background: @accent-color !important; + background: @accent !important; } .bXJ77rNIJ18Y0GfegQdr + label > :first-child { background: @text !important; @@ -579,7 +545,7 @@ .OF_3F0SQCsBtL1jSTlTA::after, .tP0mccyU1WAa7I9PevC1 svg, .tP0mccyU1WAa7I9PevC1::after { - color: @accent-color !important; + color: @accent !important; } // Full Screen Song Window .npv-up-next { @@ -611,13 +577,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/spotify-web/preview.webp b/styles/spotify-web/preview.webp deleted file mode 100644 index cb6129501f..0000000000 --- a/styles/spotify-web/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:4f882e1fb4dc7f315b98cc5cf524a9c27ddd3d5191609674fd3c72ceac4ef323 -size 334504 diff --git a/styles/stack-overflow/README.md b/styles/stack-overflow/README.md index 00603a6716..6ca4770d56 100644 --- a/styles/stack-overflow/README.md +++ b/styles/stack-overflow/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/stack-overflow/catppuccin.user.css b/styles/stack-overflow/catppuccin.user.less similarity index 55% rename from styles/stack-overflow/catppuccin.user.css rename to styles/stack-overflow/catppuccin.user.less index 1e771f3949..5c2860a54e 100644 --- a/styles/stack-overflow/catppuccin.user.css +++ b/styles/stack-overflow/catppuccin.user.less @@ -2,8 +2,8 @@ @name Stack Overflow Catppuccin @namespace github.com/catppuccin/userstyles/styles/stack-overflow @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/stack-overflow -@version 0.1.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/stack-overflow/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/stack-overflow/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astack-overflow @description Soothing pastel theme for Stack Overflow @author Catppuccin @@ -15,9 +15,16 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('stackoverflow.com'), domain('stackexchange.com'), domain('serverfault.com'), -domain('superuser.com'), domain('mathoverflow.net'), domain('askubuntu.com'), domain('stackapps.com') { - @import url("https://unpkg.com/@catppuccin/highlightjs@0.2.2/css/catppuccin.variables.important.css"); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("stackoverflow.com"), + domain("stackexchange.com"), + domain("serverfault.com"), + domain("superuser.com"), + domain("mathoverflow.net"), + domain("askubuntu.com"), + domain("stackapps.com") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); code.hljs { background: none !important; } @@ -25,95 +32,29 @@ domain('superuser.com'), domain('mathoverflow.net'), domain('askubuntu.com'), do body:not(.theme-highcontrast, .theme-dark).unified-theme { &, .themed { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } } body:not(.theme-highcontrast).unified-theme.theme-dark { &, .themed { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } } - @media (prefers-color-scheme: light) { - body:not(.theme-highcontrast).unified-theme.theme-system { - #catppuccin(@lightFlavor, @accentColor); + body:not(.theme-highcontrast).unified-theme.theme-system { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - body:not(.theme-highcontrast).unified-theme.theme-system { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - --ctp-rosewater: #rgbify(@rosewater) []; - --ctp-flamingo: #rgbify(@flamingo) []; - --ctp-pink: #rgbify(@pink) []; - --ctp-mauve: #rgbify(@mauve) []; - --ctp-red: #rgbify(@red) []; - --ctp-maroon: #rgbify(@maroon) []; - --ctp-peach: #rgbify(@peach) []; - --ctp-yellow: #rgbify(@yellow) []; - --ctp-green: #rgbify(@green) []; - --ctp-teal: #rgbify(@teal) []; - --ctp-sky: #rgbify(@sky) []; - --ctp-sapphire: #rgbify(@sapphire) []; - --ctp-blue: #rgbify(@blue) []; - --ctp-lavender: #rgbify(@lavender) []; - --ctp-text: #rgbify(@text) []; - --ctp-subtext1: #rgbify(@subtext1) []; - --ctp-subtext0: #rgbify(@subtext0) []; - --ctp-overlay2: #rgbify(@overlay2) []; - --ctp-overlay1: #rgbify(@overlay1) []; - --ctp-overlay0: #rgbify(@overlay0) []; - --ctp-surface2: #rgbify(@surface2) []; - --ctp-surface1: #rgbify(@surface1) []; - --ctp-surface0: #rgbify(@surface0) []; - --ctp-base: #rgbify(@base) []; - --ctp-mantle: #rgbify(@mantle) []; - --ctp-crust: #rgbify(@crust) []; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); &, * { @@ -127,41 +68,45 @@ domain('superuser.com'), domain('mathoverflow.net'), domain('askubuntu.com'), do --theme-topbar-item-color: @text; --theme-topbar-item-color-hover: @text; --theme-topbar-item-background-hover: @surface0; - --theme-button-primary-background-color: @accent-color; - --theme-button-primary-hover-background-color: darken(@accent-color, 5%); + --theme-button-primary-background-color: @accent; + --theme-button-primary-hover-background-color: darken(@accent, 5%); --theme-button-primary-active-background-color: @text; - --theme-link-color: @accent-color; - --theme-link-color-hover: darken(@accent-color, 5%); + --theme-link-color: @blue; + --theme-link-color-hover: @sky; + --theme-link-color-visited: @lavender; --theme-footer-title-color: @text; --theme-footer-text-color: @subtext0; --theme-footer-link-color: @subtext0; --theme-footer-link-color-hover: @subtext1; --theme-footer-background-color: @mantle; - --theme-header-background-color: @mantle; - --theme-tag-background-color: @accent-color; - --theme-tag-border-color: @accent-color; + --theme-header-background-color: transparent; + --theme-tag-background-color: @accent; + --theme-tag-border-color: @accent; --theme-tag-color: @mantle; - --theme-tag-hover-background-color: darken(@accent-color, 5%); - --theme-tag-hover-border-color: darken(@accent-color, 5%); + --theme-tag-hover-background-color: darken(@accent, 5%); + --theme-tag-hover-border-color: darken(@accent, 5%); --theme-tag-hover-color: @mantle; - --theme-post-title-color: @accent-color; - --theme-post-title-color-hover: darken(@accent-color, 5%); + --theme-post-title-color: @text; + --theme-post-title-color-hover: @subtext1; + --theme-post-title-color-visited: @lavender; --highlight-bg: @mantle; - --theme-primary: @accent-color; - --theme-primary-100: fade(@accent-color, 20%); - --theme-primary-200: fade(@accent-color, 30%); - --theme-primary-500: fade(@accent-color, 90%); - --theme-primary-600: @accent-color; - - --translucent-secondary: fade(@accent-color, 10%); - --theme-secondary-100: fade(@accent-color, 20%); - --theme-secondary-200: fade(@accent-color, 30%); - --theme-secondary-300: fade(@accent-color, 40%); - --theme-secondary-400: fade(@accent-color, 50%); - --theme-secondary-500: fade(@accent-color, 60%); - --theme-secondary-600: fade(@accent-color, 70%); + --theme-primary: @accent; + --theme-primary-100: fade(@accent, 20%); + --theme-primary-200: fade(@accent, 30%); + --theme-primary-300: fade(@accent, 40%); + --theme-primary-400: @accent; + --theme-primary-500: fade(@accent, 90%); + --theme-primary-600: @accent; + + --translucent-secondary: fade(@accent, 10%); + --theme-secondary-100: fade(@accent, 20%); + --theme-secondary-200: fade(@accent, 30%); + --theme-secondary-300: fade(@accent, 40%); + --theme-secondary-400: fade(@accent, 50%); + --theme-secondary-500: fade(@accent, 60%); + --theme-secondary-600: fade(@accent, 70%); --white: @mantle; --black: @text; @@ -200,6 +145,7 @@ domain('superuser.com'), domain('mathoverflow.net'), domain('askubuntu.com'), do --yellow-100: fade(@yellow, 20%); --yellow-200: fade(@yellow, 30%); + --yellow-300: @yellow; --yellow-400: fade(@yellow, 70%); --yellow-500: fade(@yellow, 90%); @@ -289,9 +235,7 @@ domain('superuser.com'), domain('mathoverflow.net'), domain('askubuntu.com'), do .s-prose kbd { border-top-color: transparent; - box-shadow: - 0 1px 1px @crust, - inset 0 1px 0 0 @overlay2; + box-shadow: 0 1px 1px @crust, inset 0 1px 0 0 @overlay2; } .s-pagination .s-pagination--item { @@ -306,7 +250,7 @@ domain('superuser.com'), domain('mathoverflow.net'), domain('askubuntu.com'), do .s-notice { &, .s-notice--btn { - color: @mantle !important; + color: @text !important; } } @@ -326,14 +270,14 @@ domain('superuser.com'), domain('mathoverflow.net'), domain('askubuntu.com'), do #onetrust-accept-btn-handler, #onetrust-reject-all-handler { - background-color: @accent-color; + background-color: @accent; color: @crust; } #onetrust-button-group button#onetrust-pc-btn-handler { background-color: @crust !important; - border-color: @accent-color !important; - color: @accent-color !important; + border-color: @accent !important; + color: @accent !important; } #onetrust-policy-title, @@ -395,17 +339,17 @@ domain('superuser.com'), domain('mathoverflow.net'), domain('askubuntu.com'), do } button:not( - #clear-filters-handler, - .ot-close-icon, - #filter-btn-handler, - .ot-remove-objection-handler, - .ot-obj-leg-btn-handler, - [aria-expanded], - .ot-link-btn - ), + #clear-filters-handler, + .ot-close-icon, + #filter-btn-handler, + .ot-remove-objection-handler, + .ot-obj-leg-btn-handler, + [aria-expanded], + .ot-link-btn + ), .ot-leg-btn-container .ot-active-leg-btn { - background-color: @accent-color !important; - border-color: @accent-color; + background-color: @accent !important; + border-color: @accent; color: @mantle; } } @@ -459,29 +403,51 @@ domain('superuser.com'), domain('mathoverflow.net'), domain('askubuntu.com'), do } [alt="Ask Ubuntu"] { @svg: escape( - '' + '' ); content: url("data:image/svg+xml,@{svg}"); } + &:has([alt="Ask Ubuntu"]) { + background-image: none; + + .site-header { + background: @accent; + } + } + [alt="Stack Apps"] { @svg: escape( '' ); content: url("data:image/svg+xml,@{svg}"); } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} + [alt="Unix & Linux"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &:has([alt="Unix & Linux"]) { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + [alt="Cryptography"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &:has([alt="Cryptography"]) { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; + .site-header { + background-image: none; + } + } + } } - -// vim:ft=less diff --git a/styles/stack-overflow/preview.webp b/styles/stack-overflow/preview.webp deleted file mode 100644 index 26618c4233..0000000000 --- a/styles/stack-overflow/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:6021f336ac2efaaa14738aaca4908a7902125f7cd37aae09d7f927acb2282194 -size 233104 diff --git a/styles/startpage/README.md b/styles/startpage/README.md index 8c728b0205..45a7c9ff24 100644 --- a/styles/startpage/README.md +++ b/styles/startpage/README.md @@ -10,20 +10,19 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## ๐Ÿ’ Current Maintainer +- [WalkQuackBack](https://github.com/WalkQuackBack) ## ๐Ÿ’– Past Maintainer -- [Bart Libert](https://github.com/bartlibert) +- [bartlibert](https://github.com/bartlibert)   diff --git a/styles/startpage/catppuccin.user.css b/styles/startpage/catppuccin.user.css deleted file mode 100644 index 211edcccac..0000000000 --- a/styles/startpage/catppuccin.user.css +++ /dev/null @@ -1,189 +0,0 @@ -/* ==UserStyle== -@name Startpage Catppuccin -@namespace github.com/catppuccin/userstyles/styles/startpage -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/startpage -@version 0.2.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/startpage/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astartpage -@description Soothing pastel theme for Startpage -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("startpage.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - &, - body { - --sx-accent: @accent-color; - --sx-background: @base; - --sx-border: @surface0; - --sx-tabLinkHover: @teal; - --sx-foreground: @text; - --sx-foregroundAlt: @subtext1; - --sx-foregroundEmphasis: lighten(@text, 10%); - --sx-popupBackground: @surface0; - --sx-popupForeground: @text; - --sx-popupForegroundEm: @text; - --sx-popupUrl: @blue; - --sx-buttonHighlight: @accent-color; - --sx-loadingBars: @mantle; - --sx-darkIcons: @crust; - --sx-arrowButtonBackground: @text; - --sx-arrowButtonForeground: @text; - } - - .css-nguon6 button { - color: @accent-color; - border-color: @accent-color; - } - - .css-fg9wif, - .header, - .wp-qi-sb__result, - .linkHover, - .footer__container { - background: @mantle !important; - } - - body { - color: @text; - } - - body, - .layout-web, - .layout-web__body, - .ex-qi-kp:not(.ex-qi-kp--light, .ex-qi-kp--night, .ex-qi-kp--air) - .sx-kp-infobox-wrap - .sx-infobox - tr:not(.sx-heading-row) - > *, - .w-gl { - background: @base !important; - } - - .wp-qi-sb__result { - border-color: @mantle !important; - } - - .wp-qi-sb__top-square-img { - border-bottom-color: @mantle !important; - } - - /* fonts */ - .w-gl__result-title, - .inline-nav-menu__link, - .wp-qi-sb__title { - color: @text !important; - } - - .w-gl__result, - .search-filter-time__dropdown, - .search-filter-region__dropdown, - .search-filter-family__field-label, - .wp-qi-sb__extract { - color: @subtext1 !important; - } - - .w-gl__result-url { - color: @accent-color !important; - } - - .wp-qi-sb__expand-text, - .inline-nav-menu__link__active, - .inline-nav-menu__link:hover { - color: @green !important; - } - - .inline-nav-menu__link__active, - .inline-nav-menu__link__post-link:hover { - border-bottom-color: @green !important; - } - - .pagination .num--active { - background: @flamingo !important; - border-color: @flamingo !important; - } - - .pagination__num:hover, - .pagination__next-prev-button:hover { - background: @blue !important; - border-color: @blue !important; - } - - header { - background-color: @mantle !important; - } - - .w-gl__result-title:visited { - color: @lavender !important; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/startpage/catppuccin.user.less b/styles/startpage/catppuccin.user.less new file mode 100644 index 0000000000..30f819541c --- /dev/null +++ b/styles/startpage/catppuccin.user.less @@ -0,0 +1,140 @@ +/* ==UserStyle== +@name Startpage Catppuccin +@namespace github.com/catppuccin/userstyles/styles/startpage +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/startpage +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/startpage/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astartpage +@description Soothing pastel theme for Startpage +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("startpage.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + &, + body { + --sx-accent: @accent; + --sx-background: @base; + --sx-border: @surface0; + --sx-tabLinkHover: @teal; + --sx-foreground: @text; + --sx-foregroundAlt: @subtext1; + --sx-foregroundEmphasis: lighten(@text, 10%); + --sx-popupBackground: @surface0; + --sx-popupForeground: @text; + --sx-popupForegroundEm: @text; + --sx-popupUrl: @blue; + --sx-buttonHighlight: @accent; + --sx-loadingBars: @mantle; + --sx-darkIcons: @crust; + --sx-arrowButtonBackground: @text; + --sx-arrowButtonForeground: @text; + } + + .css-nguon6 button { + color: @accent; + border-color: @accent; + } + + .css-fg9wif, + .header, + .wp-qi-sb__result, + .linkHover, + .footer__container { + background: @mantle !important; + } + + body { + color: @text; + } + + body, + .layout-web, + .layout-web__body, + .ex-qi-kp:not(.ex-qi-kp--light, .ex-qi-kp--night, .ex-qi-kp--air) + .sx-kp-infobox-wrap + .sx-infobox + tr:not(.sx-heading-row) + > *, + .w-gl { + background: @base !important; + } + + .wp-qi-sb__result { + border-color: @mantle !important; + } + + .wp-qi-sb__top-square-img { + border-bottom-color: @mantle !important; + } + + /* fonts */ + .w-gl__result-title, + .inline-nav-menu__link, + .wp-qi-sb__title { + color: @text !important; + } + + .w-gl__result, + .search-filter-time__dropdown, + .search-filter-region__dropdown, + .search-filter-family__field-label, + .wp-qi-sb__extract { + color: @subtext1 !important; + } + + .w-gl__result-url { + color: @accent !important; + } + + .wp-qi-sb__expand-text, + .inline-nav-menu__link__active, + .inline-nav-menu__link:hover { + color: @green !important; + } + + .inline-nav-menu__link__active, + .inline-nav-menu__link__post-link:hover { + border-bottom-color: @green !important; + } + + .pagination .num--active { + background: @flamingo !important; + border-color: @flamingo !important; + } + + .pagination__num:hover, + .pagination__next-prev-button:hover { + background: @blue !important; + border-color: @blue !important; + } + + header { + background-color: @mantle !important; + } + + .w-gl__result-title:visited { + color: @lavender !important; + } + } +} diff --git a/styles/startpage/preview.webp b/styles/startpage/preview.webp deleted file mode 100644 index 8bb2e351bd..0000000000 --- a/styles/startpage/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:e7263e6b53b0417e15fe2a1f0a1a41c218260f4b467bdfec3d8d23801669eeb1 -size 90494 diff --git a/styles/status.cafe/README.md b/styles/status.cafe/README.md new file mode 100644 index 0000000000..9409bdaa0f --- /dev/null +++ b/styles/status.cafe/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for status.cafe + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [bunfluff](https://github.com/bunfluff) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/status.cafe/catppuccin.user.less b/styles/status.cafe/catppuccin.user.less new file mode 100644 index 0000000000..d4f3d7772e --- /dev/null +++ b/styles/status.cafe/catppuccin.user.less @@ -0,0 +1,128 @@ +/* ==UserStyle== +@name status.cafe Catppuccin +@namespace github.com/catppuccin/userstyles/styles/status.cafe +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/status.cafe +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/status.cafe/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astatus.cafe +@description Soothing pastel theme for status.cafe +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document regexp("https://status\\.cafe/(?!users).*"), + domain("forum.status.cafe") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + background-color: @base; + + body { + background-color: @base; + color: @text; + } + + textarea { + background-color: @mantle; + color: @text; + border-color: @surface1; + border-style: solid; + border-width: 1px; + border-radius: 2px; + padding: 3px; + } + + input { + background-color: @mantle; + color: @text; + border-color: @surface1; + border-style: solid; + border-width: 1px; + border-radius: 4px; + padding: 2px 5px; + :hover { + background-color: darken(@mantle, 2%); + } + + :active { + background-color: @crust; + border-color: @surface0; + } + } + + textarea:hover, + input:hover { + border-color: darken(@surface1, 5%); + } + + .flash { + background-color: @green; + } + + a:not(.flash a) { + color: @accent; + } + + a:visited:not(.flash a) { + color: darken(@accent, 5%); + } + + table, + th, + td { + border-color: @surface1 !important; + } + + thead { + background-color: @surface1; + color: @text; + } + + .forum { + background-color: @yellow; + a { + color: darken(@blue, 10%) !important; + } + } + + tbody, + .topic > tbody > tr:nth-child(2n) { + background-color: @mantle; + } + + hr { + background-color: @surface1; + } + + .signature { + border-top-color: @surface0; + } + + & when (@flavor = latte) { + a:visited:not(.flash a) { + color: darken(@accent, 10%); + } + input:active { + background-color: @surface0; + border-color: @surface2; + } + } + } +} diff --git a/styles/stylus/README.md b/styles/stylus/README.md index fedd028db6..779e7ea7cb 100644 --- a/styles/stylus/README.md +++ b/styles/stylus/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [GitMuslim](https://github.com/GitMuslim) +- [uncenter](https://github.com/uncenter)   diff --git a/styles/stylus/catppuccin.user.css b/styles/stylus/catppuccin.user.css deleted file mode 100644 index d909bc4b9a..0000000000 --- a/styles/stylus/catppuccin.user.css +++ /dev/null @@ -1,313 +0,0 @@ -/* ==UserStyle== -@name Stylus Catppuccin -@namespace github.com/catppuccin/userstyles/styles/stylus -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/stylus -@version 1.2.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/stylus/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astylus -@description Soothing pastel theme for Stylus -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document url-prefix("moz-extension://"), url-prefix(chrome-extension://) -{ - :root { - &[data-ui-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); - } - &[data-ui-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --bg: @base; - --fg: @text; - --c30: @subtext1; - --c40: @overlay0; - --c45: @surface2; - --c50: @subtext0; - --c60: @subtext0; - --c65: @surface2; - --c75: @overlay1; - --c80: @surface1; - --c85: @surface0; - --c90: @base; - --c95: @mantle; - --c97: @mantle; - --c98: @base; - --c99: @base; - --c100: @base; - --red1: @red; - --accent-1: @accent-color; - --accent-2: @accent-color; - --accent-3: fade(@accent-color, 25%); - - .slider { - --color-on: fade(@accent-color, 25%); - --color-off: @surface2; - } - - :focus { - --focus-color1: @accent-color !important; - --focus-color2: fade(@accent-color, 25%) !important; - } - - .active #filters-stats, - .dirty #save-button, - .dirty #save-button + button { - background-color: @accent-color; - border-color: @accent-color; - color: @base; - } - #header-resizer { - color: @surface1; - } - #message-box-title::before { - @fade_color: fade(@accent-color, 67%); - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - [src="moz-extension://8fc71d5e-96b2-44a4-8d6f-ead6ff4d3c56/images/icon/16.png"], img[src="/images/icon/128.png"] - { - @fade_color: fade(@accent-color, 67%); - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - #message-box.danger { - #message-box-title { - background-color: @red; - color: @base; - - &::before { - @fade_color: fade(@red, 67%); - @svg: escape( - '' - ); - background: url("data:image/svg+xml,@{svg}") !important; - } - } - - #message-box-close-icon i { - color: var(--c40); - &:hover { - color: var(--bg); - } - } - } - - #filters label:hover, - #filters .filter-selection:hover { - background-color: @surface0; - } - .oldUI .disabled h2::after, - .entry.usercss .style-name-link::after { - background-color: fade(@accent-color, 25%); - } - - /* Syntax highlighting */ - .CodeMirror-activeline-background { - background: @mantle; - } - .CodeMirror-linenumber { - color: @subtext0; - } - div.CodeMirror span.CodeMirror-matchingbracket { - color: @green; - } - .cm-s-default { - .cm-string { - color: @peach; - } - .cm-qualifier { - color: @peach; - } - .cm-variable-2 { - color: @sapphire; - } - .cm-keyword { - color: @mauve; - } - .cm-atom, - .cm-number { - color: @green; - } - .cm-def { - color: @sapphire; - } - .cm-tag { - color: @sapphire; - } - .cm-builtin { - color: @subtext1; - } - .cm-variable-3 { - color: @subtext1; - } - .cm-comment { - color: @subtext0; - } - .cm-operator { - color: @yellow; - } - .cm-variable { - color: @text; - } - } - button:disabled, - select:disabled, - option:disabled, - select[disabled] > option { - color: @subtext0; - } - .applies-to input, - .applies-to select { - background: @base; - border-color: @surface0; - color: @subtext0; - } - button { - color: @text !important; - background: @mantle !important; - border-color: @surface0; - &:hover { - border-color: @text; - } - } - #save-button[disabled] { - background: @surface0 !important; - } - #message-box-title { - color: @text; - } - .svg-icon { - fill: @overlay0; - - &:hover { - fill: @overlay1; - } - } - .onoffswitch input:checked + span { - background-color: fade(@accent-color, 25%); - - &::before { - background-color: @accent-color; - } - } - #options-title { - color: @base; - } - h2 { - color: @accent-color !important; - } - .installed .configure-usercss { - i { - color: @accent-color; - } - - svg, - &:hover svg { - fill: @accent-color !important; - } - } - #live-reload-install-hint { - color: @teal; - } - #menu.delete { - header { - background: fade(@red, 25%); - } - - > div, - &[data-cmd="delete"] { - border-color: @red; - } - } - .entry.odd { - background-color: fade(@surface0, 25%); - } - .updater-icons > :not(.check-update)::after { - border-color: @yellow; - background: @base; - } - .split-btn-menu { - border-color: @accent-color; - - > :hover { - background: fade(@accent-color, 25%); - } - } - #help-popup .title { - background: @mantle; - } - #toc li:hover { - background: fade(@accent-color, 20%); - } - input:invalid { - background: fade(@red, 10%); - color: @red; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/stylus/catppuccin.user.less b/styles/stylus/catppuccin.user.less new file mode 100644 index 0000000000..7325ece2c5 --- /dev/null +++ b/styles/stylus/catppuccin.user.less @@ -0,0 +1,272 @@ +/* ==UserStyle== +@name Stylus Catppuccin +@namespace github.com/catppuccin/userstyles/styles/stylus +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/stylus +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/stylus/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Astylus +@description Soothing pastel theme for Stylus +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document url-prefix("moz-extension://"), + url-prefix("chrome-extension://") { + :root { + &[data-ui-theme="light"] { + #catppuccin(@lightFlavor); + } + &[data-ui-theme="dark"] { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --bg: @base; + --fg: @text; + --c30: @subtext1; + --c40: @overlay0; + --c45: @surface2; + --c50: @subtext0; + --c60: @subtext0; + --c65: @surface2; + --c75: @overlay1; + --c80: @surface1; + --c85: @surface0; + --c90: @base; + --c95: @mantle; + --c97: @mantle; + --c98: @base; + --c99: @base; + --c100: @base; + --red1: @red; + --accent-1: @accent; + --accent-2: @accent; + --accent-3: fade(@accent, 25%); + + .slider { + --color-on: fade(@accent, 25%); + --color-off: @surface2; + } + + :focus { + --focus-color1: @accent !important; + --focus-color2: fade(@accent, 25%) !important; + } + + .active #filters-stats, + .dirty #save-button, + .dirty #save-button + button { + background-color: @accent; + border-color: @accent; + color: @base; + } + #header-resizer { + color: @surface1; + } + #message-box-title::before { + @fade_color: fade(@accent, 67%); + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + [src="moz-extension://8fc71d5e-96b2-44a4-8d6f-ead6ff4d3c56/images/icon/16.png"], + img[src="/images/icon/128.png"] { + @fade_color: fade(@accent, 67%); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + #message-box.danger { + #message-box-title { + background-color: @red; + color: @base; + + &::before { + @fade_color: fade(@red, 67%); + @svg: escape( + '' + ); + background: url("data:image/svg+xml,@{svg}") !important; + } + } + + #message-box-close-icon i { + color: var(--c40); + &:hover { + color: var(--bg); + } + } + } + + #filters label:hover, + #filters .filter-selection:hover { + background-color: @surface0; + } + .oldUI .disabled h2::after, + .entry.usercss .style-name-link::after { + background-color: fade(@accent, 25%); + } + + /* Syntax highlighting */ + .CodeMirror-activeline-background { + background: @mantle; + } + .CodeMirror-linenumber { + color: @subtext0; + } + div.CodeMirror span.CodeMirror-matchingbracket { + color: @green; + } + .cm-s-default { + .cm-string { + color: @green; + } + .cm-qualifier { + color: @yellow; + } + .cm-variable-2 { + color: @mauve; + } + .cm-keyword { + color: @mauve; + } + .cm-atom { + color: @red; + } + .cm-number { + color: @peach; + } + .cm-def { + color: @mauve; + } + .cm-tag { + color: @blue; + } + .cm-builtin { + color: @red; + } + .cm-variable-3 { + color: @teal; + } + .cm-comment { + color: @overlay2; + } + .cm-operator { + color: @yellow; + } + .cm-variable { + color: @blue; + } + .cm-property { + color: @blue; + } + } + button:disabled, + select:disabled, + option:disabled, + select[disabled] > option { + color: @subtext0; + } + .applies-to input, + .applies-to select { + background: @base; + border-color: @surface0; + color: @subtext0; + } + button { + color: @text !important; + background: @mantle !important; + border-color: @surface0; + &:hover { + border-color: @text; + } + } + #save-button[disabled] { + background: @surface0 !important; + } + #message-box-title { + color: @text; + } + .svg-icon { + fill: @overlay0; + + &:hover { + fill: @overlay1; + } + } + .onoffswitch input:checked + span { + background-color: fade(@accent, 25%); + + &::before { + background-color: @accent; + } + } + #options-title { + color: @base; + } + h2 { + color: @accent !important; + } + .installed .configure-usercss { + i { + color: @accent; + } + + svg, + &:hover svg { + fill: @accent !important; + } + } + #live-reload-install-hint { + color: @teal; + } + #menu.delete { + header { + background: fade(@red, 25%); + } + + > div, + [data-cmd="delete"] { + border-color: @red; + } + } + .entry.odd { + background-color: fade(@surface0, 25%); + } + .updater-icons > :not(.check-update)::after { + border-color: @yellow; + background: @base; + } + .split-btn-menu { + border-color: @accent; + + > :hover { + background: fade(@accent, 25%); + } + } + #help-popup .title { + background: @mantle; + } + #toc li:hover { + background: fade(@accent, 20%); + } + input:invalid { + background: fade(@red, 10%); + color: @red; + } + } +} diff --git a/styles/stylus/preview.webp b/styles/stylus/preview.webp deleted file mode 100644 index a7cd135e49..0000000000 --- a/styles/stylus/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ecf52462aa06d9d4d10c1bb2df40dd729b3dc540dcc907528f309285004e8b7e -size 34868 diff --git a/styles/substack/README.md b/styles/substack/README.md index d21901d48c..5c6ddd9f96 100644 --- a/styles/substack/README.md +++ b/styles/substack/README.md @@ -10,20 +10,19 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿšง Looking for Maintainers ๐Ÿšง -- If you are interested in maintaining this userstyle, please raise a **Pull Request** and add yourself into the `current-maintainers` array in the `userstyles.yml` file. +## ๐Ÿ’ Current Maintainer +- [uncenter](https://github.com/uncenter) ## ๐Ÿ’– Past Maintainer -- [winston](https://github.com/nekowinston) +- [nekowinston](https://github.com/nekowinston)   diff --git a/styles/substack/catppuccin.user.css b/styles/substack/catppuccin.user.css deleted file mode 100644 index af90adc8f2..0000000000 --- a/styles/substack/catppuccin.user.css +++ /dev/null @@ -1,197 +0,0 @@ -/* ==UserStyle== -@name Substack Catppuccin -@namespace github.com/catppuccin/userstyles/styles/substack -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/substack -@version 0.1.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/substack/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Asubstack -@description Soothing pastel theme for Substack -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("substack.com") { - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - background-color: @base !important; - - &, - .dark-mode { - --color-primary: @text; - --color-secondary: @subtext0; - --color-bg-primary: @base; - --color-bg-primary-rgb: #rgbify(@base) []; - --web_bg_color: @base; - --color-bg-primary-hover: mix(@surface0, @base, 50%); - --color-bg-secondary: @mantle; - --color-bg-tertiary: @crust; - --color-dark-bg-tertiary: @crust; - --color-dark-primary: @text; - --color-bg-elevated: @surface0; - --color-bg-elevated-hover: mix(@surface1, @surface0, 50%); - --color-accent-themed: @accent-color; - --color-bg-secondary-opacity: @surface0; - --color-bg-secondary-themed: @surface0; - --color-accent-inverse-themed: @crust; - --color-light-bg-primary: @crust; - --color-accent-primary: @accent-color; - --color-accent-substack: @accent-color; - --color-accent-blue: @blue; - --color-accent-red: @red; - --color-accent-purple: @mauve; - --color-accent-facebook: @blue; - --color-accent-error: @red; - --color-detail: @surface1; - --color-dark-bg-primary: @mantle; - - // subdomains - --print_on_web_bg_color: @text; - --color-secondary-themed: @subtext0; - --print_secondary_on_web_bg_color: @subtext0; - --background_pop: @peach; - --print_pop: @peach; - --print_on_pop: @crust; - --print_secondary: @subtext0; - --color-tertiary: @crust; - --background_contrast_1: @crust; - --background_contrast_2: mix(@crust, @mantle, 50%); - --background_contrast_3: @mantle; - --background_contrast_4: mix(@mantle, @base, 33%); - --background_contrast_5: mix(@mantle, @base, 66%); - --color_theme_bg_contrast_1: unset; - --color_theme_bg_contrast_2: mix(@surface0, @surface1, 50%); - --color_theme_bg_contrast_3: @surface1; - --color_theme_bg_contrast_4: mix(@surface1, @surface2, 50%); - --color_theme_bg_contrast_5: @surface2; - --input_background: @surface0; - - // used for podcast play controls - --color_theme_bg_pop_rgb: #rgbify(@accent-color) []; - --color_theme_print_on_pop: @crust; - } - - // brand colors in SVGs - // Substack orange - *[stroke="#ff6719"], - *[stroke="#FF6719"] { - stroke: @peach !important; - } - *[fill="#ff6719"], - *[fill="#FF6719"] { - fill: @peach !important; - } - - .footer-wrap .footer .footer-substack-cta { - background-color: @base; - } - - .reader-nav-top.pinned { - background-color: rgba(#rgbify(@base) [], 85%); - backdrop-filter: var(--glass); - } - - // toggle switches - .tailwind-preflight button span { - background-color: @base !important; - } - - // restack quote popup - div[class*="frontend-components-selection_popover-module"] { - * { - color: @text !important; - background: @base !important; - border-color: @surface0 !important; - stroke: @text !important; - } - } - - // top navbar user button - .button.user-indicator { - background: var(--color-bg-secondary-themed) !important; - } - - // comment boxes - .comment-input-wrap form.comment-input .comment-input-right textarea { - overflow-y: auto !important; - } - - ::-webkit-scrollbar { - background: @mantle; - width: 0.25rem; - } - ::-webkit-scrollbar-thumb { - background: @accent-color; - border-radius: 9999px; - } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/substack/catppuccin.user.less b/styles/substack/catppuccin.user.less new file mode 100644 index 0000000000..50578776b7 --- /dev/null +++ b/styles/substack/catppuccin.user.less @@ -0,0 +1,261 @@ +/* ==UserStyle== +@name Substack Catppuccin +@namespace github.com/catppuccin/userstyles/styles/substack +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/substack +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/substack/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Asubstack +@description Soothing pastel theme for Substack +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("substack.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + color: @text; + background-color: @base !important; + + &, + .dark-mode, + .dark-theme, + [class*="_pubTheme_"] { + --color-bg-primary: @base; + --color-bg-primary-rgb: #lib.rgbify(@base)[]; + --color-bg-primary-raw: #lib.rgbify(@base)[]; + --color-bg-primary-hover: @surface0; + --color-bg-secondary: @surface0; + --color-bg-tertiary: @surface1; + --color-bg-elevated-primary: @mantle; + --color-bg-elevated-secondary: @crust; + --color-fg-primary: @text; + --color-fg-secondary: @subtext1; + --color-fg-tertiary: @subtext0; + --color-utility-detail: @surface1; + --color-utility-white: @text; + --color-detail-themed: @surface1; + --color-accent-themed: @accent; + + --color-accent-fg-red: @red; + --color-accent-bg-red: fade(@red, 20%); + --color-semantic-error-bg-primary: @red; + --color-semantic-error-utility-contrast: @crust; + + --color-accent-fg-orange: @accent; + --color-accent-bg-orange: fade(@accent, 20%); + + --color-accent-fg-green: @green; + --color-accent-bg-green: fade(@green, 20%); + + --color-accent-fg-cyan: @blue; + --color-accent-bg-cyan: fade(@blue, 20%); + + /* Buttons */ + --color-button-primary-bg: @accent; + --color-button-primary-bg-hover: darken(@accent, 5%); + --color-button-primary-fg: @crust; + + --color-button-secondary-bg: @surface0; + --color-button-secondary-bg-hover: @surface1; + --color-button-secondary-fg: @text; + + --color-button-tertiary-bg-hover: @surface1; + --color-button-tertiary-fg: @text; + + --color-button-mono-bg: @text; + --color-button-mono-bg-hover: @subtext1; + --color-button-mono-fg: @crust; + + --color-button-disabled-fg: @subtext0; + + /* Tooltips & Toasts */ + --color-bg-tooltip: @mantle; + --material-thick: @mantle; + + --print_pop: @accent; + --print_secondary: @subtext1; + --background_pop: @accent; + --print_on_pop: @crust; + --color_theme_bg_pop: @accent; + --color_theme_bg_pop_darken: darken(@accent, 5%); + --color_theme_print_on_pop: @crust; + --border_subtle: @surface1; + --background_contrast_1: @mantle; + --background_contrast_2: @surface2; + --color_theme_bg_contrast_1: @surface1; + --color_theme_bg_contrast_2: @overlay0; + --color_theme_bg_contrast_4: @subtext0; + + --color-chat-other-fg-secondary: @subtext1; + + --color-semantic-select-fg-primary: @accent; + --color-semantic-select-utility-detail: fade(@accent, 20%); + --color-semantic-highlight-fg-primary: @accent; + + /* Weird variables issue fixes */ + --color-light-bg-primary: @mantle; /* Was text, changing to mantle for (select text) -> Share -> Download button color. Might break things */ + --color-light-bg-secondary: @surface0; /* substack.com homepage sections */ + --color-dark-bg-primary: @mantle; + --color-dark-bg-secondary: @base; + --color-dark-bg-tertiary: @surface0; + + /* Publications with different variables */ + --color-primary-themed: @text; + --color-secondary-themed: @subtext1; + + --color-bg-secondary-themed: @surface0; + + --web_bg_color: @mantle; + --print_on_web_bg_color: @text; + --print_secondary_on_web_bg_color: @subtext1; + + /* Share button */ + --material-dark-regular: @mantle; + /* Copy (heading link) to clipboard notification */ + --material-dark-thick: @crust; + /* Button hover, faded to 0.1 */ + --color-primitive-white-rgb: #lib.rgbify(@text)[]; + + /* Various full screen modals for singing up, subscribing etc */ + --cover_print_primary: @text; + --cover_print_secondary: @subtext1; + --cover_print_tertiary: @subtext0; + --cover_bg_color: @base; + --cover_input_background: @mantle; + } + + /* Substack logos */ + [fill="#ff6719" i] { + fill: @accent !important; + } + /* Inverted logo colors */ + [fill="#FFFFFF" i] { + fill: @crust !important; + } + + /* Footer */ + .footer-wrap { + &, + .footer { + background-color: @mantle; + } + + .home-footer { + &, + a, + .footer-info .footer-info-col h3 { + color: @text; + } + } + } + .subscribe-footer .button.primary { + border-color: @crust; + } + + /* Signup, onboarding, and profile */ + + .homepage-nav .homepage-nav-bar .homepage-nav-wrap.grey { + background-color: @base; + } + .signup-page { + background-color: @base; + + .signup-box-wrap .error { + color: @red; + } + } + + .onboarding-profile-page { + .accept-tos * { + color: @subtext1; + } + + .skip-button { + color: @text; + } + } + + .profile-page .set-up-profile-button { + color: @crust; + } + .edit-profile-page .publication-section .all-toggle { + color: @subtext1; + } + + /* Misc inputs */ + button[role="switch"], + input[type="radio"] + span { + --color-utility-white: @surface0; + } + + input[type="text"], + input[type="date"], + select { + background-color: @mantle; + color: @text; + } + + .themed-select > div { + background-color: @mantle; + border-color: @surface0; + + * { + color: @text; + } + } + + [aria-label="File Picker"] { + background-color: @base; + } + + /* Dashboard */ + + /* Icons */ + [stroke="#888888"], + [stroke="#555555"] { + stroke: @subtext1 !important; + } + + /* Import posts */ + .signup-page > .container .signup-box { + background-color: @base; + } + + /* Stats */ + .subscriber-stats-page { + .heading .options .header-option .header-button { + background-color: @surface0; + } + + table { + td, + th { + background-color: @base; + } + } + } + + /* Editor */ + .tw-bg-pub-accent { + background-color: @accent !important; + } + } +} diff --git a/styles/substack/preview.webp b/styles/substack/preview.webp deleted file mode 100644 index 6c4cafae26..0000000000 --- a/styles/substack/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:938ff1118859e61e4034c4a3dd753d0a52d12b5e627ffa6caf0d1695c3c64837 -size 447708 diff --git a/styles/syncthing/README.md b/styles/syncthing/README.md index 903c8eb9e6..998738807d 100644 --- a/styles/syncthing/README.md +++ b/styles/syncthing/README.md @@ -10,18 +10,15 @@

- -

- -

- +

## Usage -> [!NOTE] -> This theme is designed to be used with the default WebGUI and default theme provided by Syncthing. This does not theme syncthing.net. +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). +> [!NOTE] +> This theme is designed to be used with the default WebGUI and default theme provided by Syncthing. This does not theme syncthing.net. ## ๐Ÿ’ Current Maintainer - [BlankParticle](https://github.com/BlankParticle) diff --git a/styles/syncthing/catppuccin.user.css b/styles/syncthing/catppuccin.user.less similarity index 58% rename from styles/syncthing/catppuccin.user.css rename to styles/syncthing/catppuccin.user.less index 2c0db42509..6b9af92986 100644 --- a/styles/syncthing/catppuccin.user.css +++ b/styles/syncthing/catppuccin.user.less @@ -2,8 +2,8 @@ @name Syncthing Catppuccin @namespace github.com/catppuccin/userstyles/styles/syncthing @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/syncthing -@version 0.1.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/syncthing/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/syncthing/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Asyncthing @description Soothing pastel theme for Syncthing @author Catppuccin @@ -17,73 +17,34 @@ @var text urls "URL(s) for Syncthing" "127\.0\.0\.1\:8384,0\.0\.0\.0\:8384,localhost\:8384" ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + /* `replace( ," ", "", "g")` is here to remove extra spaces (if any) */ -@-moz-document regexp(replace(replace(%("https?://(%s)/.*", @urls), ",", "|", "g"), " ", "", "g")) -{ - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@-moz-document regexp( + replace(replace(%("https?://(%s)/.*", @urls), ",", "|", "g"), " ", "", "g") + ) { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } .light-theme { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - .dark-theme { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); body { color: @text !important; @@ -91,12 +52,12 @@ } a { - color: @accent-color; + color: @accent; } .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a { - color: @accent-color !important; + color: @accent !important; } /* navbar */ @@ -143,7 +104,7 @@ .dropdown-menu > .active > a { color: @base !important; - background-color: @accent-color !important; + background-color: @accent !important; } /* main panel */ @@ -158,7 +119,7 @@ .panel-default > .panel-heading { color: @text !important; border-color: @surface0 !important; - background-color: @base !important; + background-color: @surface0 !important; } .panel-footer { @@ -197,14 +158,14 @@ } .btn-primary { - background-color: @accent-color !important; + background-color: @accent !important; color: @base; } .btn-primary:hover, .btn-primary:focus, .btn-primary.focus { - background-color: fade(@accent-color, 90%) !important; + background-color: fade(@accent, 90%) !important; } .btn-warning { @@ -293,7 +254,7 @@ /* progress bars */ .progress-bar { - background-color: @accent-color !important; + background-color: @accent !important; } .progress-bar-success { @@ -314,7 +275,7 @@ /* text */ .text-primary { - color: @accent-color !important; + color: @accent !important; } .text-success { @@ -334,13 +295,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/syncthing/preview.webp b/styles/syncthing/preview.webp deleted file mode 100644 index de143392e7..0000000000 --- a/styles/syncthing/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:e937c2654b8a8408b9659bff3a0577712a014adfb015d893b808850076765be0 -size 79300 diff --git a/styles/tabnews/README.md b/styles/tabnews/README.md index bcf8f1b067..20839faf74 100644 --- a/styles/tabnews/README.md +++ b/styles/tabnews/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/tabnews/catppuccin.user.css b/styles/tabnews/catppuccin.user.less similarity index 56% rename from styles/tabnews/catppuccin.user.css rename to styles/tabnews/catppuccin.user.less index ca1633e24e..a111407ea7 100644 --- a/styles/tabnews/catppuccin.user.css +++ b/styles/tabnews/catppuccin.user.less @@ -2,8 +2,8 @@ @name TabNews Catppuccin @namespace github.com/catppuccin/userstyles/styles/tabnews @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/tabnews -@version 0.0.4 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/tabnews/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/tabnews/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atabnews @description Soothing pastel theme for TabNews @author Catppuccin @@ -15,75 +15,39 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('tabnews.com.br') { +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("tabnews.com.br") { :root:has(div[data-color-mode="dark"]) { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } :root:has(div[data-color-mode="light"]) { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); --bgColor-default: @base; --bgColor-emphasis: @crust; --fgColor-default: @text; --bgColor-neutral-emphasis: @subtext0; - --bgColor-accent-emphasis: @accent-color; - --fgColor-accent: @accent-color; + --bgColor-accent-emphasis: @accent; + --fgColor-accent: @accent; --fgColor-onEmphasis: @text; - --color-accent-fg: @accent-color; + --color-accent-fg: @accent; --fgColor-muted: @overlay0; --borderColor-default: @surface0; --button-default-bgColor-rest: @base; --button-default-bgColor-hover: @crust; --button-default-fgColor-rest: @text; --button-default-fgColor-hover: @text; - --button-primary-bgColor-rest: @accent-color; - --button-primary-bgColor-disabled: fadeout(@accent-color, 15%); + --button-primary-bgColor-rest: @accent; + --button-primary-bgColor-disabled: fade(@accent, 85%); --button-primary-fgColor-disabled: @text; --button-primary-fgColor-rest: @surface0; - --button-primary-bgColor-hover: darken(@accent-color, 5%); + --button-primary-bgColor-hover: darken(@accent, 5%); --button-primary-fgColor-hover: @surface0; --button-default-bgColor-active: @base; --controlKnob-bgColor-rest: @crust; @@ -120,7 +84,7 @@ --color-prettylights-syntax-markup-list: @text; #nprogress .bar { - background: @accent-color; + background: @accent; } /* Style the button to change theme when light theme is on */ @@ -145,7 +109,7 @@ } path.recharts-rectangle { - fill: @accent-color; + fill: @accent; } path.recharts-rectangle.recharts-tooltip-cursor { @@ -157,7 +121,7 @@ } li.recharts-tooltip-item { - color: @accent-color !important; + color: @accent !important; } div[overflow="hidden"] { @@ -215,7 +179,7 @@ .gsc-refinementhInactive { color: @text; background: @base; - border-color: @accent-color; + border-color: @accent; } .gsc-option-menu-container { @@ -250,7 +214,7 @@ border-color: transparent; background: @base; .gsc-url-top > * { - color: @accent-color; + color: @accent; } } @@ -268,13 +232,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/tabnews/preview.webp b/styles/tabnews/preview.webp deleted file mode 100644 index 46e524e0a9..0000000000 --- a/styles/tabnews/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:a6512681e0a42d9250c64a7a257a26f67086e0bab168e9ccdf74a0f42919df24 -size 452574 diff --git a/styles/tldraw/README.md b/styles/tldraw/README.md index be2dec59cc..477381ff86 100644 --- a/styles/tldraw/README.md +++ b/styles/tldraw/README.md @@ -10,24 +10,23 @@

- -

- -

- +

## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + > [!NOTE] > This theme only changes how the colors appear on the tldraw canvas. Exported graphics **will not be Catppuccin-themed**. +## ๐Ÿ’ Current Maintainer +- [NekoDrone](https://github.com/NekoDrone) - -## ๐Ÿ’ Current Maintainers +## ๐Ÿ’– Past Maintainers - [GenShibe](https://github.com/GenShibe) - [uncenter](https://github.com/uncenter) -  

diff --git a/styles/tldraw/catppuccin.user.css b/styles/tldraw/catppuccin.user.css deleted file mode 100644 index c07c4d735d..0000000000 --- a/styles/tldraw/catppuccin.user.css +++ /dev/null @@ -1,432 +0,0 @@ -/* ==UserStyle== -@name tldraw Catppuccin -@namespace github.com/catppuccin/userstyles/styles/tldraw -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/tldraw -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/tldraw/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atldraw -@description Soothing pastel theme for tldraw -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('tldraw.com') { - .tl-theme__dark { - #catppuccin(@darkFlavor, @accentColor); - } - .tl-theme__light { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --color-accent: @accent-color !important; - --color-background: @base !important; - --color-brush-fill: @surface0 !important; - --color-brush-stroke: @surface2 !important; - --color-grid: @overlay0 !important; - --color-low: @surface0 !important; - --color-low-border: @overlay2 !important; - --color-culled: @subtext1 !important; - --color-muted-none: fade(@surface0, 70%); - --color-muted-0: @surface0; - --color-muted-1: @surface1; - --color-muted-2: @surface2 !important; - --color-hint: @surface2 !important; - --color-overlay: fade(@base, 50%) !important; - --color-divider: @surface1 !important; - --color-panel-contrast: @surface2 !important; - --color-panel-overlay: fade(@overlay0, 80%); - --color-panel: @surface0 !important; - --color-focus: @sky !important; - --color-selected: @accent-color !important; - --color-selected-contrast: @crust !important; - --color-selection-fill: fade(@blue, 50%); - --color-selection-stroke: @sapphire !important; - --color-text-0: @text !important; - --color-text-1: @text !important; - --color-text-3: @subtext1 !important; - --color-text-shadow: @subtext0 !important; - --color-primary: @blue !important; - --color-warn: @maroon !important; - --color-text: @text !important; - --color-laser: @red !important; - - --shadow-1-1: fade(@crust, 16%); - --shadow-1-2: fade(@crust, 22%); - --shadow-2-1: fade(@crust, 66%); - --shadow-2-2: fade(@crust, 33%); - --shadow-3-1: fade(@crust, 50%); - - --shadow-1: 0px 1px 2px var(--shadow-1-1), 0px 1px 3px var(--shadow-1-2); - --shadow-2: 0px 1px 3px var(--shadow-2-1), 0px 2px 6px var(--shadow-2-2), - inset 0px 0px 0px 1px var(--color-panel-contrast); - --shadow-3: 0px 1px 3px var(--shadow-3-1), 0px 2px 12px var(--shadow-3-1), - inset 0px 0px 0px 1px var(--color-panel-contrast); - - .tlui-menu__submenu__trigger[data-state="open"]:not(:hover)::after { - border-radius: var(--radius-1); - background: linear-gradient( - 90deg, - @surface0 0%, - var(--color-muted-2) 100% - ); - } - .tlui-menu-zone *[data-state="open"]::after { - background: linear-gradient( - 180deg, - @surface0 0%, - var(--color-muted-2) 100% - ); - } - .tlui-people-menu__avatar { - background-color: @green !important; - } - - --color-black: @text; - --color-gray: if(@lookup = latte, @subtext0, @subtext0); - --color-red: @red; - --color-light-red: lighten(@red, 5%); - --color-orange: @peach; - --color-yellow: @yellow; - --color-green: darken(@green, 5%); - --color-light-green: lighten(@green, 5%); - --color-blue: @blue; - --color-light-blue: @sky; - --color-violet: darken(@mauve, 10%); - --color-light-violet: @mauve; - - [title="Color โ€” Black"] { - color: var(--color-black) !important; - } - [title="Color โ€” Grey"] { - color: var(--color-gray) !important; - } - [title="Color โ€” Red"] { - color: var(--color-red) !important; - } - [title="Color โ€” Light red"] { - color: var(--color-light-red) !important; - } - [title="Color โ€” Orange"] { - color: var(--color-orange) !important; - } - [title="Color โ€” Yellow"] { - color: var(--color-yellow) !important; - } - [title="Color โ€” Green"] { - color: var(--color-green) !important; - } - [title="Color โ€” Light green"] { - color: var(--color-light-green) !important; - } - [title="Color โ€” Blue"] { - color: var(--color-blue) !important; - } - [title="Color โ€” Light blue"] { - color: var(--color-light-blue) !important; - } - [title="Color โ€” Violet"] { - color: var(--color-violet) !important; - } - [title="Color โ€” Light violet"] { - color: var(--color-light-violet) !important; - } - .tl-svg-container { - [fill="#e1e1e1"], - [fill="#1d1d1d"], - [fill="#494949"], - [fill="#989898"] { - fill: var(--color-black) !important; - } - [fill="#010403"] { - fill: @crust !important; - } - [fill="#9398b0"], - [fill="#adb5bd"], - [fill="#bcc3c9"], - [fill="#7c8187"] { - fill: var(--color-gray) !important; - } - [fill="#e03131"], - [fill="#e55959"], - [fill="#8f3734"] { - fill: var(--color-red) !important; - } - [fill="#ff8787"], - [fill="#fe9e9e"], - [fill="#a56767"] { - fill: var(--color-light-red) !important; - } - [fill="#f76707"], - [fill="#f78438"], - [fill="#9f552d"] { - fill: var(--color-orange) !important; - } - [fill="#ffc034"], - [fill="#ffc078"], - [fill="#fecb92"] { - fill: var(--color-yellow) !important; - } - [fill="#099268"], - [fill="#39a785"], - [fill="#366a53"] { - fill: var(--color-green) !important; - } - [fill="#40c057"], - [fill="#65cb78"], - [fill="#4e874e"] { - fill: var(--color-light-green) !important; - } - [fill="#4263eb"], - [fill="#6681ee"], - [fill="#3a4b9e"] { - fill: var(--color-blue) !important; - } - [fill="#4dabf7"], - [fill="#6fbbf8"], - [fill="#4d7aa9"] { - fill: var(--color-light-blue) !important; - } - [fill="#ae3ec9"], - [fill="#bd63d3"], - [fill="#763a8b"] { - fill: var(--color-violet) !important; - } - [fill="#e599f7"], - [fill="#e9acf8"], - [fill="#9770a9"] { - fill: var(--color-light-violet) !important; - } - [stroke="#e1e1e1"], - [stroke="#1d1d1d"] { - stroke: var(--color-black) !important; - } - [stroke="#9398b0"], - [stroke="#adb5bd"] { - stroke: var(--color-gray) !important; - } - [stroke="#e03131"] { - stroke: var(--color-red) !important; - } - [stroke="#ff8787"] { - stroke: var(--color-light-red) !important; - } - [stroke="#f76707"] { - stroke: var(--color-orange) !important; - } - [stroke="#ffc034"], - [stroke="#ffc078"] { - stroke: var(--color-yellow) !important; - } - [stroke="#099268"] { - stroke: var(--color-green) !important; - } - [stroke="#40c057"] { - stroke: var(--color-light-green) !important; - } - [stroke="#4263eb"] { - stroke: var(--color-blue) !important; - } - [stroke="#4dabf7"] { - stroke: var(--color-light-blue) !important; - } - [stroke="#ae3ec9"] { - stroke: var(--color-violet) !important; - } - [stroke="#e599f7"] { - stroke: var(--color-light-violet) !important; - } - [stroke="color(display-p3 0.8078 0.7225 0.0312)"], - [stroke="color(display-p3 0.972 0.8705 0.05)"] { - stroke: var(--color-yellow) !important; - } - [stroke="color(display-p3 0.6299 0.7012 0.7856)"], - [stroke="color(display-p3 0.8163 0.9023 0.9416)"] { - stroke: var(--color-text-3) !important; - } - [stroke="color(display-p3 0.7024 0.0403 0.753)"], - [stroke="color(display-p3 0.9676 0.5652 0.9999)"] { - stroke: var(--color-light-violet) !important; - } - [stroke="color(display-p3 0.5651 0.0079 0.8986)"], - [stroke="color(display-p3 0.7469 0.5089 0.9995)"] { - stroke: var(--color-violet) !important; - } - [stroke="color(display-p3 0.0032 0.4655 0.7991)"], - [stroke="color(display-p3 0.308 0.6632 0.9996)"] { - stroke: var(--color-blue) !important; - } - [stroke="color(display-p3 0.0023 0.7259 0.7735)"], - [stroke="color(display-p3 0.1512 0.9414 0.9996)"] { - stroke: var(--color-light-blue) !important; - } - [stroke="color(display-p3 0.7699 0.4937 0.0085)"], - [stroke="color(display-p3 0.9988 0.6905 0.266)"] { - stroke: var(--color-orange) !important; - } - [stroke="color(display-p3 0.0085 0.582 0.4604)"], - [stroke="color(display-p3 0.2536 0.984 0.7981)"] { - stroke: var(--color-green) !important; - } - [stroke="color(display-p3 0.2711 0.6172 0.0195)"], - [stroke="color(display-p3 0.563 0.9495 0.3857)"] { - stroke: var(--color-light-green) !important; - } - [stroke="color(display-p3 0.7849 0.0585 0.3589)"], - [stroke="color(display-p3 0.9988 0.5301 0.6397)"] { - stroke: var(--color-light-red) !important; - } - [stroke="color(display-p3 0.7978 0.0509 0.2035)"], - [stroke="color(display-p3 0.9992 0.4376 0.45)"] { - stroke: var(--color-red) !important; - } - } - - [data-testid="mobile-styles.button"] { - &[style*="color: rgb(229, 153, 247);"] { - color: var(--color-light-violet) !important; - } - &[style*="color: rgb(147, 152, 176);"], - &[style*="color: rgb(173, 181, 189);"] { - color: var(--color-gray) !important; - } - &[style*="color: rgb(224, 49, 49);"] { - color: var(--color-red) !important; - } - &[style*="color: rgb(247, 103, 7);"] { - color: var(--color-orange) !important; - } - &[style*="color: rgb(255, 192, 52);"], - &[style*="color: rgb(255, 192, 120);"] { - color: var(--color-yellow) !important; - } - &[style*="color: rgb(9, 146, 104);"] { - color: var(--color-green) !important; - } - &[style*="color: rgb(64, 192, 87);"] { - color: var(--color-light-green) !important; - } - &[style*="color: rgb(66, 99, 235);"] { - color: var(--color-blue) !important; - } - &[style*="color: rgb(77, 171, 247);"] { - color: var(--color-light-blue) !important; - } - &[style*="color: rgb(174, 62, 201);"] { - color: var(--color-violet) !important; - } - &[style*="color: rgb(255, 135, 135);"] { - color: var(--color-light-red) !important; - } - } - - div:has(.tl-text.tl-text-content) { - &[style*="color: rgb(225, 225, 225);"], - &[style*="color: rgb(29, 29, 29);"] { - color: var(--color-black) !important; - } - &[style*="color: rgb(147, 152, 176);"], - &[style*="color: rgb(173, 181, 189);"] { - color: var(--color-gray) !important; - background-color: var(--color-gray) !important; - } - &[style*="color: rgb(224, 49, 49);"] { - color: var(--color-red) !important; - background-color: var(--color-red) !important; - } - &[style*="color: rgb(255, 135, 135);"] { - color: var(--color-light-red) !important; - background-color: var(--color-light-red) !important; - } - &[style*="color: rgb(247, 103, 7);"] { - color: var(--color-orange) !important; - background-color: var(--color-orange) !important; - } - &[style*="color: rgb(255, 192, 52);"], - &[style*="color: rgb(255, 192, 120);"] { - color: var(--color-yellow) !important; - background-color: var(--color-yellow) !important; - } - &[style*="color: rgb(9, 146, 104);"] { - color: var(--color-green) !important; - background-color: var(--color-green) !important; - } - &[style*="color: rgb(64, 192, 87);"] { - color: var(--color-light-green) !important; - background-color: var(--color-light-green) !important; - } - &[style*="color: rgb(66, 99, 235);"] { - color: var(--color-blue) !important; - background-color: var(--color-blue) !important; - } - &[style*="color: rgb(77, 171, 247);"] { - color: var(--color-light-blue) !important; - background-color: var(--color-light-blue) !important; - } - &[style*="color: rgb(174, 62, 201);"] { - color: var(--color-violet) !important; - background-color: var(--color-violet) !important; - } - &[style*="color: rgb(229, 153, 247);"] { - color: var(--color-light-violet) !important; - background-color: var(--color-light-violet) !important; - } - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/tldraw/catppuccin.user.less b/styles/tldraw/catppuccin.user.less new file mode 100644 index 0000000000..1237701c33 --- /dev/null +++ b/styles/tldraw/catppuccin.user.less @@ -0,0 +1,477 @@ +/* ==UserStyle== +@name tldraw Catppuccin +@namespace github.com/catppuccin/userstyles/styles/tldraw +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/tldraw +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/tldraw/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atldraw +@description Soothing pastel theme for tldraw +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("tldraw.com") { + .tl-theme__dark { + #catppuccin(@darkFlavor); + } + + .tl-theme__light { + #catppuccin(@lightFlavor); + } + + :root:has(.tl-container.tl-theme__dark) .cl-modalContent { + #catppuccin(@darkFlavor); + } + + :root:has(.tl-container.tl-theme__light) .cl-modalContent { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --tl-color-background: @mantle; + --tl-color-low: @base; + --tl-color-low-border: @base; + --tl-color-panel: @surface0; + --tl-color-panel-contrast: @surface1; + --tl-color-primary: @accent; + --tl-color-success: @green; + --tl-color-info: @sky; + --tl-color-warning: @peach; + --tl-color-danger: @maroon; + --tl-color-laser: @red; + --tl-color-selected: @accent; + --tl-color-text: @text; + --tl-color-text-1: @text; + --tl-color-text-2: @subtext1; + --tl-color-text-3: @subtext0; + --tl-color-selected-contrast: @crust; + --tl-color-snap: @red; + --tl-color-selection-stroke: @accent; + --tl-color-divider: @surface1; + --tl-color-grid: @overlay1; + --tla-color-primary: @accent; + --tla-color-primary-hover: fade(@accent, 80%); + --tla-color-sidebar: @surface0; + --tla-color-cta: @accent; + --tla-color-cta-hover: fade(@accent, 80%); + --tla-color-text-1: @text; + --tla-color-text-2: @subtext1; + --tla-color-text-3: @subtext0; + --tla-color-contrast: @crust; + + @violet: darken(@mauve, 20%); + @dark-green: darken(@green, 15%); + @dark-red: darken(@red, 10%); + + button.tla-primary-button > span.i18n-msg { + color: var(--tla-color-contrast); + } + + /* colours on canvas */ + div.tl-shape { + svg.tl-svg-container { + /* pencil draw shape fills */ + path[fill="#f2f2f2"], + path[fill="#1d1d1d"] { + fill: @text; + } + + path[fill="#9398b0"], + path[fill="#9fa8b2"] { + fill: @overlay2; + } + + path[fill="#e599f7"], + path[fill="#e085f4"] { + fill: @mauve; + } + + path[fill="#ae3ec9"] { + fill: @violet; + } + + path[fill="#4f72fc"], + path[fill="#4465e9"] { + fill: @blue; + } + + path[fill="#4dabf7"], + path[fill="#4ba1f1"] { + fill: @sky; + } + + path[fill="#ffc034"], + path[fill="#f1ac4b"] { + fill: @yellow; + } + + path[fill="#f76707"], + path[fill="#e16919"] { + fill: @peach; + } + + path[fill="#099268"] { + fill: @dark-green; + } + + path[fill="#40c057"], + path[fill="#4cb05e"] { + fill: @green; + } + + path[fill="#ff8787"], + path[fill="#f87777"] { + fill: @red; + } + + path[fill="#e03131"] { + fill: @dark-red; + } + + /* shape outlines (path), arrow strokes (g) */ + path[stroke="#f2f2f2"], + path[stroke="#1d1d1d"], + g[stroke="#f2f2f2"], + g[stroke="#1d1d1d"] { + stroke: @text; + } + + path[stroke="#9398b0"], + path[stroke="#9fa8b2"], + g[stroke="#9398b0"], + g[stroke="#9fa8b2"] { + stroke: @overlay2; + } + + path[stroke="#e599f7"], + path[stroke="#e085f4"], + g[stroke="#e599f7"], + g[stroke="#e085f4"] { + stroke: @mauve; + } + + path[stroke="#ae3ec9"], + g[stroke="#ae3ec9"] { + stroke: @violet; + } + + path[stroke="#4f72fc"], + path[stroke="#4465e9"], + g[stroke="#4f72fc"], + g[stroke="#4465e9"] { + stroke: @blue; + } + + path[stroke="#4dabf7"], + path[stroke="#4ba1f1"], + g[stroke="#4dabf7"], + g[stroke="#4ba1f1"] { + stroke: @sky; + } + + path[stroke="#ffc034"], + path[stroke="#f1ac4b"], + g[stroke="#ffc034"], + g[stroke="#f1ac4b"] { + stroke: @yellow; + } + + path[stroke="#f76707"], + path[stroke="#e16919"], + g[stroke="#f76707"], + g[stroke="#e16919"] { + stroke: @peach; + } + + path[stroke="#099268"], + g[stroke="#099268"] { + stroke: @dark-green; + } + + path[stroke="#40c057"], + path[stroke="#4cb05e"], + g[stroke="#40c057"], + g[stroke="#4cb05e"] { + stroke: @green; + } + + path[stroke="#ff8787"], + path[stroke="#f87777"], + g[stroke="#ff8787"], + g[stroke="#f87777"] { + stroke: @red; + } + + path[stroke="#e03131"], + g[stroke="#e03131"] { + stroke: @dark-red; + } + + /* shape fill - solid */ + path[fill="#2c3036"], + path[fill="#e8e8e8"] { + fill: fade(@text, 20%); + } + + path[fill="#33373c"], + path[fill="#eceef0"] { + fill: fade(@overlay2, 20%); + } + + path[fill="#383442"], + path[fill="#f5eafa"] { + fill: fade(@mauve, 20%); + } + + path[fill="#342938"], + path[fill="#ecdcf2"] { + fill: fade(@violet, 20%); + } + + path[fill="#262d40"], + path[fill="#dce1f8"] { + fill: fade(@blue, 20%); + } + + path[fill="#2a3642"], + path[fill="#ddedfa"] { + fill: fade(@sky, 20%); + } + + path[fill="#3b352b"], + path[fill="#f9f0e6"] { + fill: fade(@yellow, 20%); + } + + path[fill="#3b2e27"], + path[fill="#f8e2d4"] { + fill: fade(@peach, 20%); + } + + path[fill="#253231"], + path[fill="#d3e9e3"] { + fill: fade(@dark-green, 20%); + } + + path[fill="#2a3830"], + path[fill="#dbf0e0"] { + fill: fade(@green, 20%); + } + + path[fill="#3c2b2b"], + path[fill="#f4dadb"] { + fill: fade(@red, 20%); + } + + path[fill="#382726"] { + fill: fade(@dark-red, 20%); + } + } + + /* sticky notes */ + div.tl-note__container { + &[style*="background-color: rgb(44, 44, 44);"] { + background-color: @surface0 !important; + } + + &[style*="background-color: rgb(86, 89, 95);"], + &[style*="background-color: rgb(192, 202, 211)"] { + background-color: @overlay2 !important; + } + + &[style*="background-color: rgb(118, 47, 142);"], + &[style*="background-color: rgb(223, 176, 249)"] { + background-color: fade(@mauve, 40%) !important; + } + + &[style*="background-color: rgb(95, 28, 112);"], + &[style*="background-color: rgb(219, 145, 253)"] { + background-color: fade(@violet, 40%) !important; + } + + &[style*="background-color: rgb(42, 63, 152);"], + &[style*="background-color: rgb(138, 163, 255)"] { + background-color: fade(@blue, 40%) !important; + } + + &[style*="background-color: rgb(31, 84, 149);"], + &[style*="background-color: rgb(155, 196, 253)"] { + background-color: fade(@sky, 40%) !important; + } + + /* in light mode, the 'white' coloured sticky note is yellow, so we override it here */ + &[style*="background-color: rgb(138, 94, 28);"], + &[style*="background-color: rgb(254, 212, 154)"], + &[style*="background-color: rgb(252, 225, 156)"] { + background-color: fade(@yellow, 40%) !important; + } + + &[style*="background-color: rgb(124, 57, 5);"], + &[style*="background-color: rgb(250, 164, 117)"] { + background-color: fade(@peach, 40%) !important; + } + + &[style*="background-color: rgb(1, 68, 41);"], + &[style*="background-color: rgb(111, 200, 150)"] { + background-color: fade(@dark-green, 60%) !important; + } + + &[style*="background-color: rgb(33, 88, 29);"], + &[style*="background-color: rgb(152, 208, 138)"] { + background-color: fade(@green, 40%) !important; + } + + &[style*="background-color: rgb(122, 51, 51);"], + &[style*="background-color: rgb(247, 165, 161)"] { + background-color: fade(@red, 40%) !important; + } + + &[style*="background-color: rgb(126, 32, 31);"], + &[style*="background-color: rgb(252, 130, 130)"] { + background-color: fade(@dark-red, 40%) !important; + } + } + } + + /* canvas text */ + div.tl-text-content__wrapper { + &[style*="color: rgb(242, 242, 242)"], + &[style*="color: rgb(29, 29, 29)"] { + color: @text !important; + } + + &[style*="color: rgb(147, 152, 176)"], + &[style*="color: rgb(159, 168, 178)"] { + color: @overlay2 !important; + } + + &[style*="color: rgb(229, 153, 247)"], + &[style*="color: rgb(224, 133, 244)"] { + color: @mauve !important; + } + + &[style*="color: rgb(174, 62, 201)"] { + color: @violet !important; + } + + &[style*="color: rgb(79, 114, 252)"], + &[style*="color: rgb(68, 101, 233)"] { + color: @blue !important; + } + + &[style*="color: rgb(77, 171, 247)"], + &[style*="color: rgb(75, 161, 241)"] { + color: @sky !important; + } + + &[style*="color: rgb(255, 192, 52)"], + &[style*="color: rgb(241, 172, 75)"] { + color: @yellow !important; + } + + &[style*="color: rgb(247, 103, 7)"], + &[style*="color: rgb(225, 105, 25)"] { + color: @peach !important; + } + + &[style*="color: rgb(9, 146, 104)"] { + color: @dark-green !important; + } + + &[style*="color: rgb(64, 192, 87)"], + &[style*="color: rgb(76, 176, 94)"] { + color: @green !important; + } + + &[style*="color: rgb(255, 135, 135)"], + &[style*="color: rgb(248, 119, 119)"] { + color: @red !important; + } + + &[style*="color: rgb(224, 49, 49)"] { + color: @dark-red !important; + } + } + + /* colour selection button fills */ + + [data-id="black"] { + color: @text !important; + } + + [data-id="grey"] { + color: @overlay2 !important; + } + + [data-id="light-violet"] { + color: @mauve !important; + } + + [data-id="violet"] { + color: @violet !important; + } + + [data-id="blue"] { + color: @blue !important; + } + + [data-id="light-blue"] { + color: @sky !important; + } + + [data-id="yellow"] { + color: @yellow !important; + } + + [data-id="orange"] { + color: @peach !important; + } + + [data-id="green"] { + color: @dark-green !important; + } + + [data-id="light-green"] { + color: @green !important; + } + + [data-id="light-red"] { + color: @red !important; + } + + [data-id="red"] { + color: @dark-red !important; + } + + /* clerk components */ + --clerk-color-background: @mantle; + --clerk-color-primary: @text; + --clerk-color-primary-foreground: @crust; + --clerk-color-foreground: @subtext1; + --clerk-color-neutral: @text; + --clerk-color-input: @base; + --clerk-color-input-foreground: @text; + --clerk-color-border: @text; + + .cl-socialButtonsBlockButton:hover { + background-color: @surface0; + } + + .cl-logoImage { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } +} diff --git a/styles/tldraw/preview.webp b/styles/tldraw/preview.webp deleted file mode 100644 index 5411c55913..0000000000 --- a/styles/tldraw/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:59693077f30fe4c46cfebebda7af1bf77a6c2a427f782632620280b52e8ce63d -size 73878 diff --git a/styles/trinket/README.md b/styles/trinket/README.md index a1873a0748..a42c25b7f6 100644 --- a/styles/trinket/README.md +++ b/styles/trinket/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/trinket/catppuccin.user.css b/styles/trinket/catppuccin.user.less similarity index 77% rename from styles/trinket/catppuccin.user.css rename to styles/trinket/catppuccin.user.less index 2c4f43aacf..a453a260af 100644 --- a/styles/trinket/catppuccin.user.css +++ b/styles/trinket/catppuccin.user.less @@ -2,8 +2,8 @@ @name Trinket Catppuccin @namespace github.com/catppuccin/userstyles/styles/trinket @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/trinket -@version 0.0.5 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/trinket/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/trinket/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atrinket @description Soothing pastel theme for Trinket @author Catppuccin @@ -15,75 +15,24 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('trinket.io') { - @import url("https://unpkg.com/@catppuccin/highlightjs@0.2.2/css/catppuccin.variables.important.css"); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@-moz-document domain("trinket.io") { + @import url("https://unpkg.com/@catppuccin/highlightjs@1.0.0/css/catppuccin-variables.important.css"); + + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - --ctp-rosewater: #rgbify(@rosewater) []; - --ctp-flamingo: #rgbify(@flamingo) []; - --ctp-pink: #rgbify(@pink) []; - --ctp-mauve: #rgbify(@mauve) []; - --ctp-red: #rgbify(@red) []; - --ctp-maroon: #rgbify(@maroon) []; - --ctp-peach: #rgbify(@peach) []; - --ctp-yellow: #rgbify(@yellow) []; - --ctp-green: #rgbify(@green) []; - --ctp-teal: #rgbify(@teal) []; - --ctp-sky: #rgbify(@sky) []; - --ctp-sapphire: #rgbify(@sapphire) []; - --ctp-blue: #rgbify(@blue) []; - --ctp-lavender: #rgbify(@lavender) []; - --ctp-text: #rgbify(@text) []; - --ctp-subtext1: #rgbify(@subtext1) []; - --ctp-subtext0: #rgbify(@subtext0) []; - --ctp-overlay2: #rgbify(@overlay2) []; - --ctp-overlay1: #rgbify(@overlay1) []; - --ctp-overlay0: #rgbify(@overlay0) []; - --ctp-surface2: #rgbify(@surface2) []; - --ctp-surface1: #rgbify(@surface1) []; - --ctp-surface0: #rgbify(@surface0) []; - --ctp-base: #rgbify(@base) []; - --ctp-mantle: #rgbify(@mantle) []; - --ctp-crust: #rgbify(@crust) []; + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); .ace_editor { background-color: @crust; @@ -91,7 +40,7 @@ .ace_gutter { background: @mantle; - color: @subtext0; + color: @overlay1; } .ace_print-margin { background: @mantle; @@ -113,7 +62,7 @@ color: @text; } .ace_marker-layer .ace_selection { - background: fade(@accent-color, 30%); + background: fade(@accent, 30%); } .ace_fold { background-color: @surface0; @@ -152,7 +101,7 @@ color: @green; } .ace_comment { - color: @surface2; + color: @overlay2; } .ace_indent-guide { @@ -170,12 +119,6 @@ color: @subtext0; } - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - body { background-color: @base !important; color: @text !important; @@ -191,11 +134,11 @@ } a { - color: @accent-color; - text-decoration-color: @accent-color; + color: @accent; + text-decoration-color: @accent; &:hover { - color: @accent-color; + color: @accent; } } @@ -253,10 +196,6 @@ background-color: @crust !important; color: @text !important; border-color: @surface0 !important; - - &::placeholder { - color: @subtext0 !important; - } } textarea.lined { @@ -273,7 +212,7 @@ } #page.hfeed a:hover { - border-bottom-color: @accent-color !important; + border-bottom-color: @accent !important; } .author-section { @@ -283,13 +222,13 @@ .code-editor .expander { background-image: linear-gradient( to right, - fade(@mantle, 0), + fade(@mantle, 0%), @mantle 50% ) !important; } .sidebar-content a:hover { - color: @accent-color !important; + color: @accent !important; } .progress { @@ -299,7 +238,7 @@ } .sidebar { - box-shadow: 1px 0 15px fade(@crust, 0.5) !important; + box-shadow: 1px 0 15px fade(@crust, 50%) !important; background-color: @base !important; } @@ -339,7 +278,7 @@ color: @subtext0 !important; &a:hover { - color: @accent-color !important; + color: @accent !important; } } @@ -352,7 +291,7 @@ } span.beta { - color: @accent-color !important; + color: @accent !important; } .resources a { @@ -391,14 +330,14 @@ .classroom-label, .classroom-name, i.trinket-key.logo { - background-color: @accent-color !important; + background-color: @accent !important; color: @base !important; } .code-plan-colors-inverted, .connect-plan-colors-inverted, .classroom-plan-colors-inverted { - color: @accent-color; + color: @accent; } .nav-wrapper, @@ -424,7 +363,7 @@ .editable-click:hover, a.editable-click:hover { - color: @accent-color !important; + color: @accent !important; } .outline-list-item.lesson { @@ -440,7 +379,7 @@ } .intercom-lightweight-app-launcher { - background-color: @accent-color !important; + background-color: @accent !important; } .edit-material-title:hover { @@ -526,10 +465,7 @@ } .top-bar.expanded .toggle-topbar a span::after { - box-shadow: - 0 0 0 1px @text, - 0 7px 0 1px @text, - 0 14px 0 1px @text; + box-shadow: 0 0 0 1px @text, 0 7px 0 1px @text, 0 14px 0 1px @text; } .button.dropdown-blue::after { @@ -682,7 +618,7 @@ } input:checked + label { - background-color: @accent-color !important; + background-color: @accent !important; &::after { background-color: @base !important; @@ -719,14 +655,12 @@ } .exit-off-canvas { - box-shadow: - -4px 0 4px @surface0, - 4px 0 4px @surface0 !important; - background-color: fade(@base, 0.5) !important; + box-shadow: -4px 0 4px @surface0, 4px 0 4px @surface0 !important; + background-color: fade(@base, 50%) !important; } #trinket-gallery #trinketDetails .spotlight { - background-color: fade(@base, 0.5) !important; + background-color: fade(@base, 50%) !important; } .right-off-canvas-menu, @@ -774,7 +708,7 @@ } a { - color: @accent-color !important; + color: @accent !important; &.active { color: @text !important; @@ -845,7 +779,7 @@ } .label:not(.last-saved) { - background-color: @accent-color !important; + background-color: @accent !important; color: @base !important; } @@ -892,7 +826,7 @@ } .blue-highlight:not(.disabled) { - background-color: @accent-color !important; + background-color: @accent !important; &, i.fa, @@ -950,7 +884,7 @@ } .trinket-stat .badge { - background-color: @accent-color !important; + background-color: @accent !important; background-image: none !important; color: @base !important; } @@ -967,7 +901,7 @@ border-bottom-color: @subtext0 !important; &:hover { - color: @accent-color !important; + color: @accent !important; } } @@ -991,7 +925,7 @@ } .draft-circle { - background-color: @accent-color !important; + background-color: @accent !important; } .MathJax_Preview { @@ -1063,7 +997,7 @@ } #outline-expander { - background-color: @accent-color !important; + background-color: @accent !important; color: @base !important; } @@ -1071,7 +1005,7 @@ background-color: @surface0 !important; .percentage { - background-color: @accent-color !important; + background-color: @accent !important; } } @@ -1100,11 +1034,11 @@ background-color: @mantle !important; img { - box-shadow: 0 0 0 10px @accent-color !important; + box-shadow: 0 0 0 10px @accent !important; } a.social { - background-color: @accent-color !important; + background-color: @accent !important; i::before { color: @base !important; @@ -1182,14 +1116,14 @@ } #content-overlay { - background-color: rgba(@base, 0.2) !important; + background-color: fade(@base, 20%) !important; } #books-index .book-img { outline-color: @surface0 !important; &:hover { - outline-color: @accent-color !important; + outline-color: @accent !important; } } @@ -1251,18 +1185,18 @@ @keyframes bluePulseButton { 0% { - box-shadow: 0 0 0 0 fade(@accent-color, 0.4); - background-color: @accent-color; + box-shadow: 0 0 0 0 fade(@accent, 40%); + background-color: @accent; } 70% { - box-shadow: 0 0 0 10px fade(@accent-color, 0); - background-color: @accent-color; + box-shadow: 0 0 0 10px fade(@accent, 0%); + background-color: @accent; } 100% { box-shadow: none; - background-color: @accent-color; + background-color: @accent; } } @@ -1312,24 +1246,10 @@ #trinkets-list.list-view > li .snapshot .title::before, .trinkets-list.list-view > li .snapshot .title::before { @svg: escape( - '' + '' ); background-image: url("data:image/svg+xml;utf8,@{svg}"); } } } - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/trinket/preview.webp b/styles/trinket/preview.webp deleted file mode 100644 index 8eb77d032b..0000000000 --- a/styles/trinket/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:cb0185d45816677dff151452d76afa9121f31f87c5034753ae884e82aa715c87 -size 397752 diff --git a/styles/tuta/README.md b/styles/tuta/README.md index 176971c7ab..6de75c225a 100644 --- a/styles/tuta/README.md +++ b/styles/tuta/README.md @@ -4,27 +4,24 @@

Logo
- Catppuccin for Tuta + Catppuccin for Tuta

- -

- -

- +

## Usage -> [!NOTE] -> Set Tuta's built-in theme to either **light** if you're using Latte or **dark** if you're using the others. +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). +> [!NOTE] +> Set Tuta's built-in theme to either **light** if you're using Latte or **dark** if you're using the others. ## ๐Ÿ’ Current Maintainer -- [Ryan Cao](https://github.com/ryanccn) +- [ryanccn](https://github.com/ryanccn)   diff --git a/styles/tuta/catppuccin.user.css b/styles/tuta/catppuccin.user.css deleted file mode 100644 index 44fb348507..0000000000 --- a/styles/tuta/catppuccin.user.css +++ /dev/null @@ -1,218 +0,0 @@ -/* ==UserStyle== -@name Tuta Catppuccin -@namespace github.com/catppuccin/userstyles/styles/tuta -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/tuta -@version 0.0.9 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/tuta/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atuta -@description Soothing pastel theme for Tuta -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("app.tuta.com"), domain("mail.tutanota.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - body, - drawer-menu, - .list-bg { - background-color: @mantle !important; - color: @text; - } - - .list-row { - background-color: @base; - } - .odd-row { - background-color: @surface0; - } - - .header-nav { - background-color: @base; - } - - .elevated-bg, - .folder-column, - div[aria-modal] { - background-color: @base !important; - } - - .ionicon { - fill: @text !important; - } - - .h2 { - color: @subtext1 !important; - } - - .bottom-nav { - background: @mantle !important; - color: @text !important; - } - - .dropdown-button, - .dropdown-button div { - color: @text !important; - } - .dropdown-button:hover { - background-color: @surface1 !important; - } - - /* logo */ - path[style*="fill: #00d2a7;"] { - fill: @accent-color !important; - } - - path[style*="fill: #c5c7c7;"] { - fill: @text !important; - } - - .row-selected { - border-color: @accent-color !important; - color: @accent-color !important; - } - .row-selected > .nav-button { - color: @accent-color !important; - } - .row-selected > .nav-button > .icon { - fill: @accent-color !important; - } - - .secondary { - color: @accent-color !important; - } - - .nav-button, - .sidebar-section.mb { - color: @subtext0 !important; - } - .icon.icon-large, - .nav-button .icon { - fill: @subtext0 !important; - } - - .bubble { - background-color: @base; - color: @text; - } - - :where(.mouse-nav) .state-bg:hover, - :where(.keyboard-nav) .state-bg:hover, - [style*="background: rgba(139, 139, 139, 0.22)"] { - background-color: @surface0 !important; - } - - .nav-bg, - .content-bg, - [style*="background-color: rgb(35, 35, 35)"] { - background-color: @base !important; - } - [style*="background-color: rgb(17, 17, 17);"] { - background-color: @mantle !important; - } - [style*="background-color: rgba(139, 139, 139, 0.22);"] { - background-color: @surface0 !important; - } - [style*="background-color: rgba(139, 139, 139, 0.38);"] { - background-color: @surface1 !important; - } - - [style*="color: rgb(221, 221, 221);"] { - color: @text !important; - } - - [style*="color: rgb(174, 174, 174);"] { - color: @subtext1 !important; - } - - .teamLabel { - background-color: @accent-color; - color: @mantle; - } - - [style*="border: 2px solid rgb(0, 210, 167);"] { - border-color: @accent-color !important; - } - [style*="color: rgb(0, 210, 167);"] { - color: @accent-color !important; - } - - button.expander { - color: @subtext0 !important; - } - - .logo-height > svg:nth-child(1) > path:nth-child(2) { - fill: @accent-color !important; - } - - ::-webkit-scrollbar-thumb { - background-color: @surface1; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/tuta/catppuccin.user.less b/styles/tuta/catppuccin.user.less new file mode 100644 index 0000000000..3f3decb23f --- /dev/null +++ b/styles/tuta/catppuccin.user.less @@ -0,0 +1,178 @@ +/* ==UserStyle== +@name Tuta Catppuccin +@namespace github.com/catppuccin/userstyles/styles/tuta +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/tuta +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/tuta/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atuta +@description Soothing pastel theme for Tuta +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("app.tuta.com"), domain("mail.tutanota.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body, + drawer-menu, + .list-bg { + background-color: @mantle !important; + color: @text; + } + + .list-row { + background-color: @base; + } + .odd-row { + background-color: @surface0; + } + + .header-nav { + background-color: @base; + } + + .elevated-bg, + .folder-column, + div[aria-modal] { + background-color: @base !important; + } + + .icon { + &[style*="fill: rgb(78, 78, 78);"] { + fill: @text !important; + } + + &[style*="fill: rgb(174, 174, 174);"] { + fill: @subtext0 !important; + } + + &[style*="fill: rgb(255, 83, 83);"] { + fill: @accent !important; + } + } + + .h2 { + color: @subtext1 !important; + } + + .bottom-nav { + background: @mantle !important; + color: @text !important; + } + + .dropdown-button, + .dropdown-button div { + color: @text !important; + } + .dropdown-button:hover { + background-color: @surface1 !important; + } + + /* logo */ + path[style*="fill: #00d2a7;"] { + fill: @accent !important; + } + + path[style*="fill: #c5c7c7;"] { + fill: @text !important; + } + + .row-selected { + border-color: @accent !important; + color: @accent !important; + } + .row-selected > .nav-button { + color: @accent !important; + + > .icon { + fill: @accent !important; + } + } + + .secondary { + color: @accent !important; + } + + .nav-button, + .sidebar-section.mb { + color: @subtext0 !important; + } + + .bubble { + background-color: @base; + color: @text; + } + + :where(.mouse-nav) .state-bg:hover, + :where(.keyboard-nav) .state-bg:hover, + [style*="background: rgba(139, 139, 139, 0.22)"] { + background-color: @surface0 !important; + } + + .nav-bg, + .content-bg, + [style*="background-color: rgb(35, 35, 35)"] { + background-color: @base !important; + } + [style*="background-color: rgb(17, 17, 17);"] { + background-color: @mantle !important; + } + [style*="background-color: rgba(139, 139, 139, 0.22);"] { + background-color: @surface0 !important; + } + [style*="background-color: rgba(139, 139, 139, 0.38);"] { + background-color: @surface1 !important; + } + + [style*="color: rgb(221, 221, 221);"] { + color: @text !important; + } + + [style*="color: rgb(174, 174, 174);"] { + color: @subtext1 !important; + } + + .teamLabel { + background-color: @accent; + color: @mantle; + } + + [style*="border: 2px solid rgb(255, 83, 83);"] { + border-color: @accent !important; + } + [style*="color: rgb(255, 83, 83);"], + .content-accent-fg { + color: @accent !important; + } + + button.expander { + color: @subtext0 !important; + } + + .logo-height > svg:nth-child(1) > path:nth-child(2) { + fill: @accent !important; + } + + ::-webkit-scrollbar-thumb { + background-color: @surface1; + } + } +} diff --git a/styles/tuta/preview.webp b/styles/tuta/preview.webp deleted file mode 100644 index d3ceae99f4..0000000000 --- a/styles/tuta/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:d4fc2f1952d08cd35e1ada72645acf554f9805c8dda19a5e230dc2d750fba543 -size 54500 diff --git a/styles/twitch/README.md b/styles/twitch/README.md index ed1ec38499..2a99a1ffa4 100644 --- a/styles/twitch/README.md +++ b/styles/twitch/README.md @@ -10,18 +10,17 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainers -- [GitMuslim](https://github.com/GitMuslim) - [uncenter](https://github.com/uncenter) +- [mxgic1337](https://github.com/mxgic1337)   diff --git a/styles/twitch/catppuccin.user.css b/styles/twitch/catppuccin.user.css deleted file mode 100644 index 9442bee414..0000000000 --- a/styles/twitch/catppuccin.user.css +++ /dev/null @@ -1,685 +0,0 @@ -/* ==UserStyle== -@name Twitch Catppuccin -@namespace github.com/catppuccin/userstyles/styles/twitch -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/twitch -@version 1.3.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/twitch/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atwitch -@description Soothing pastel theme for Twitch -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("twitch.tv") { - .tw-root--theme-dark { - #catppuccin(@darkFlavor, @accentColor); - } - .tw-root--theme-light { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - body { - background-color: @base; - } - - &, - .tw-dialog-layer { - --color-background-input-focus: @crust; - --color-background-interactable-hover: @surface0; - --color-background-interactable-alpha-hover: @surface0; - --color-background-button-text-default: null !important; - --color-background-pill-subtle: @subtext0; - --color-text-input-placeholder: @text; - --color-border-input: @base; - --color-text-button-primary: @crust; - --color-text-overlay: @base; - --color-text-base: @subtext1; - --color-text-alt: @text; - --color-text-alt-2: @text; - --color-text-interactable-selected: @crust; - --color-background-alt-2: @crust; - --color-text-tag: @text; - --color-background-button-secondary-default: @crust; - --color-background-button-secondary-hover: @surface0; - --color-background-tag-default: @mantle; - --color-background-tag-hover: @crust; - --color-background-float: @mantle; - --color-background-body: @base; - --color-background-base: @mantle; - --color-background-alt: @mantle; - --color-background-input: @crust; - --color-brand-muted-cupcake: @pink; - --color-brand-muted-mint: @green; - --color-brand-muted-sky: @sky; - --color-brand-muted-blush: @peach; - --color-brand-muted-canary: @peach; - --color-brand-muted-lavender: @lavender; - --color-brand-muted-mustard: @yellow; - --color-brand-muted-emerald: @green; - --color-brand-muted-coral: @peach; - --color-brand-muted-ocean: @blue; - --color-brand-accent-grape: @mauve; - --color-brand-accent-dragonfruit: @flamingo; - --color-brand-accent-carrot: @peach; - --color-brand-accent-sun: @peach; - --color-brand-accent-lime: @green; - --color-brand-accent-turquoise: @sky; - --color-brand-accent-eggplant: @mauve; - --color-brand-accent-wine: @flamingo; - --color-brand-accent-slime: @green; - --color-brand-accent-seafoam: @green; - --color-brand-accent-cherry: @red; - --color-brand-accent-marine: @blue; - --color-brand-accent-seaweed: @teal; - --color-brand-accent-fiji: @green; - --color-brand-accent-blueberry: @blue; - --color-brand-accent-arctic: @sky; - --color-brand-accent-highlighter: @yellow; - --color-brand-accent-flamingo: @flamingo; - --color-brand-accent-ruby: @red; - --color-brand-accent-punch: @flamingo; - --color-brand-accent-creamsicle: @yellow; - --color-red: @maroon; - --color-red-darker: @red; - --color-orange: @peach; - --color-yellow: @yellow; - --color-green: @green; - --color-green-darker: @green; - --color-blue: @blue; - --color-prime-blue: @blue; - --color-magenta: @flamingo; - --color-error: @red; - --color-warn: @yellow; - --color-success: @green; - --color-white: @text; - --color-black: @crust; - --color-info: @blue; - --color-twitch-purple: @accent-color; - --color-twitch-purple-4: @accent-color; - --color-twitch-purple-5: @accent-color; - --color-twitch-purple-6: @accent-color; - --color-twitch-purple-7: @accent-color; - --color-twitch-purple-8: @accent-color; - --color-twitch-purple-9: @accent-color; - --color-twitch-purple-10: @accent-color; - --color-twitch-purple-11: @accent-color; - --color-twitch-purple-12: @accent-color; - --color-orange-7: @yellow; - --color-orange-8: @yellow; - --color-orange-9: @yellow; - --color-orange-10: @yellow; - --color-orange-11: @yellow; - --color-orange-12: @yellow; - --color-orange-13: @yellow; - --color-yellow-6: @peach; - --color-yellow-7: @peach; - --color-yellow-8: @peach; - --color-yellow-9: @peach; - --color-yellow-10: @peach; - --color-yellow-11: @peach; - --color-yellow-12: @peach; - --color-yellow-13: @peach; - --color-yellow-14: @peach; - --color-yellow-15: @peach; - --color-green-5: @green; - --color-green-6: @green; - --color-green-7: @green; - --color-green-8: @green; - --color-green-9: @green; - --color-green-10: @green; - --color-green-11: @green; - --color-green-12: @green; - --color-green-13: @green; - --color-green-14: @green; - --color-green-15: @teal; - --color-cyan-9: @sapphire; - --color-cyan-10: @sapphire; - --color-cyan-11: @sapphire; - --color-cyan-12: @sapphire; - --color-cyan-13: @sapphire; - --color-cyan-14: @sapphire; - --color-cyan-15: @sky; - --color-blue-4: @blue; - --color-blue-5: @blue; - --color-blue-6: @blue; - --color-blue-7: @blue; - --color-blue-8: @blue; - --color-blue-9: @blue; - --color-blue-10: @sky; - --color-blue-11: @sky; - --color-magenta-5: @flamingo; - --color-magenta-6: @flamingo; - --color-magenta-7: @flamingo; - --color-magenta-8: @flamingo; - --color-magenta-9: @flamingo; - --color-magenta-10: @flamingo; - --color-magenta-11: @pink; - --color-magenta-12: @pink; - --color-red-4: @accent-color; - --color-red-5: @accent-color; - --color-red-6: @accent-color; - --color-red-7: @accent-color; - --color-red-8: @accent-color; - --color-red-9: @accent-color; - --color-red-10: @accent-color; - --color-red-11: @peach; - --color-red-12: @peach; - --color-twitter: @blue; - --color-facebook: @blue; - --color-reddit: @peach; - --color-snapchat: @yellow; - --color-instagram: @blue; - --color-youtube: @red; - --color-paypal: @blue; - --color-paypal-blue: @blue; - --color-paypal-yellow: @yellow; - --color-venmo: @blue; - --color-vk: @blue; - --color-amazon: @yellow; - --color-background-button-text-hover: @surface0; - --color-text-accessible-red: @accent-color; - --color-border-input-checkbox: @subtext0; - --color-border-input-checkbox-hover: @text; - --color-text-label: @text; - --color-border-input-hover: @surface0; - --color-opac-b-14: @crust; - --color-text-button-overlay: @text !important; - --color-background-range-overlay-fill: @text !important; - --color-text-button-overlay-hover: @text !important; - --color-text-tooltip: @base !important; - --color-background-tooltip: @text !important; - --color-hinted-grey-2: @surface0; - --color-hinted-grey-15: @text; - --color-background-overlay-alt: @mantle; - --color-background-button-overlay-primary-hover: @subtext1; - --color-background-button-overlay-text-hover: @crust; - --color-border-overlay: @surface0; - --color-background-button-disabled: @surface0; - --color-text-button-disabled: @subtext0; - } - - &, - [class*="ScTokenOverrideCSSVars"] { - --color-text-link: @blue; - --color-text-link-active: @sky; - --color-text-link-focus: @sky; - --color-text-link-hover: @sky; - --color-text-link-visited: @lavender; - } - - &, - [class*="ScAccentRegionCssVars"] { - --color-accent: @accent-color; - } - /* Hardcoded accent color */ - [style="color: rgb(160, 84, 255);"] { - color: @accent-color !important; - } - - /* Full screened video player title & description */ - - p[data-test-selector="stream-info-card-component__subtitle"], - p[data-test-selector="stream-info-card-component__description"] { - color: @text !important; - } - - /* `Pinned message` popup */ - - div.pinned-chat__pinned-by svg { - color: @text; - } - - p.pinned-chat__message { - span { - color: @text !important; - } - - a { - color: @accent-color; - } - } - - /* `Intended for certain audiences` label */ - - div[data-a-target="content-classification-warning-disclosure-overlay"] p { - color: @text; - } - - /* `Hype Train` popup */ - - div.hype-train-progress-bar-info-view__level-container p, - div.hype-train-approaching-view__leftSide p, - div.hype-train-expanded-layout p, - div.hype-train-expanded-layout svg { - color: @text; - } - - path[d="m18 17 4-4V2H6v15h4v4l4-4h4zM12 6h2v6h-2V6zm7 0h-2v6h2V6z"] { - fill: @mantle; - } - - /* `Is video buffering?` warning */ - - div.low-latency-notification p { - color: @text; - } - - /* `Includes paid promotion` label */ - - div.disclosure-card p, - div.disclosure-card svg { - color: @text; - } - - /* Raiding popup */ - - div[data-test-selector="raid-banner"] { - color: @text; - } - - /* `Predict with Channel Points` popup */ - - div[data-test-selector="expanded-content"] p, - p[data-test-selector="community-prediction-highlight-header__top-predictors"], - p[data-test-selector="community-prediction-highlight-body__outcome-title"] { - color: @text; - } - - /* TODO: ensure that the poll does not default to this */ - div[data-test-selector="header-content"] p { - color: @text !important; - } - - div.channel-points-icon svg, - div[data-test-selector="header-content"] span, - div[data-test-selector="community-prediction-highlight-body__outcome-points"] - span { - color: @accent-color; - } - - button[data-test-selector="community-prediction-highlight-header__how-to-play"], - button[data-test-selector="community-prediction-highlight-header__terms-and-conditions"], - button[data-test-selector="community-prediction-highlight-header__send-feedback"], - button[data-test-selector="community-prediction-highlight-header__dismiss-message"] { - color: @text; - } - - /* ??? */ - - div.happening-now-disable-prompt p { - color: @text !important; - } - - /* Gifting sub popup */ - - div.mystery-gift-chat-banner { - span { - color: @accent-color; - } - - p { - color: @text; - } - } - - /* VOD metadata */ - - div.tw-media-card-stat { - color: @text; - } - - /* DMCA warning */ - - div.muted-segments-alert__content p { - color: @text; - } - - /* VOD time labels */ - - div.vod-seekbar-time-labels p { - color: @text !important; - } - - /* VOD timestamp */ - - div.vod-seekbar-preview-overlay__wrapper p { - color: @text !important; - } - - /* Seekbar segment */ - - div[data-test-selector="seekbar-interaction-area__interactionArea"] - span[data-test-selector="seekbar-segment__segment"] { - background: @accent-color !important; - } - - /* Seekbar DMCA muted segment */ - - div[data-test-selector="seekbar-interaction-area__interactionArea"] - span[data-test-selector="seekbar-segment__segment"][style*="background-color: rgba(212, 73, 73, 0.5);"] { - background: @red !important; - } - - /* Seekbar buffered segment */ - - div[data-test-selector="seekbar-interaction-area__interactionArea"] - span[data-test-selector="seekbar-segment__segment"][style*="background-color: rgba(255, 255, 255, 0.85);"] { - background: @overlay2 !important; - } - - /* Recent VOD title */ - - div.player-overlay-background h4 { - color: @subtext0 !important; - } - - a.offline-recommendations-video-card p { - color: @text; - } - - /* Offline screen follow panel */ - - div[data-test-selector="follow-panel-overlay"] p { - color: @text !important; - } - - div[data-test-selector="follow-panel-overlay"] button div { - color: @crust !important; - } - - /* Front page warning sign */ - - div.content-overlay-gate__content[data-a-target="player-overlay-content-gate"] - div.content-overlay-icon - svg { - color: @red; - } - - /* Front page age warning */ - - div.content-overlay-gate__content[data-a-target="player-overlay-content-gate"] - p.content-overlay-gate__allow-pointers { - color: @red !important; - } - - /* Front page age selector */ - - div[data-a-target="player-overlay-age-gate-form"] select { - color: @text; - } - - /* Following usercard */ - - div[data-a-target="user-card-modal"] p { - color: @text !important; - } - - /* PiP username */ - - div.mini-overlay__title span { - color: @text; - } - - /* Viewercard username */ - - div.viewer-card-header__display-name h4 { - color: @accent-color !important; - } - - /* Viewercard metadata */ - - div.viewer-card-header__display-name svg:not(button svg) { - color: @subtext1; - } - - div.viewer-card-header__display-name p { - color: @text !important; - } - - /* Extension name */ - - div[aria-describedby="popover-extensions-body"] h6 { - color: @text; - } - - /* Extension description */ - - div.extensions-popover-view-layout__body p { - color: @text; - } - - /* Extension service buttons */ - - div.extensions-popover-view-layout__body svg { - color: @subtext0; - } - - div.extensions-popover-view-layout__body div { - color: @text; - } - - /* Extension overlay */ - - .extension-view__iframe { - color-scheme: light; - } - - .carousel-metadata { - background: @crust; - } - .carousel-metadata--fadeout { - background: @crust; - } - .chat-line__timestamp { - color: @subtext0; - } - .chat-line__message-body--highlighted { - background-color: @accent-color; - color: @crust; - border-color: @accent-color; - } - .chat-scrollable-area__message-container { - background-color: @mantle; - } - .side-nav-card__link:hover { - background: @surface0 !important; - } - .footer { - background: @crust; - } - .whispers-list-item--selected, - .whispers-list-item:hover { - background-color: @surface0; - } - .thread-header__title-bar-container--focused { - background-color: @mantle; - } - .thread-header__title-bar-container { - background: @mantle; - } - .thread-header__click-area:focus .thread-header__title-bar-container { - background-color: @mantle; - } - .navigation-link { - color: @text; - - &:hover, - .active { - color: @accent-color; - } - } - .navigation-link__active-indicator { - background-color: @accent-color !important; - } - .chat-room { - background: @mantle; - } - div.pinned-chat__highlight-card div.highlight { - background: @mantle; - } - - h4, - h5 { - color: @text; - } - - .server-message-alert { - border-color: @red !important; - border-left-color: @red !important; - } - - .server-message-alert__icon { - color: @red !important; - } - - /* Predictions */ - .fixed-prediction-button { - color: @mantle !important; - - .channel-points-icon svg { - color: @mantle !important; - } - - &.fixed-prediction-button--disabled { - color: @text !important; - - .channel-points-icon svg { - color: @text !important; - } - } - } - [style*="rgb(255, 255, 255)"] { - color: @base !important; - } - [style="color: rgb(56, 122, 255);"] { - color: @blue !important; - } - [style="color: rgb(245, 0, 155);"] { - color: @pink !important; - } - .fixed-prediction-button--blue, - [style*="background-color: rgb(56, 122, 255);"], - [style*="background: rgb(56, 122, 255);"] { - background-color: @blue !important; - } - .fixed-prediction-button--pink, - [style*="background-color: rgb(245, 0, 155);"], - [style*="background: rgb(245, 0, 155);"] { - background-color: @pink !important; - } - - input[disabled] { - background-color: @surface0; - } - .chat-wysiwyg-input__placeholder { - color: @subtext0; - } - - button[aria-label="Play"], - button[aria-label="Pause"] { - + div svg { - color: @subtext0; - } - } - - [data-a-target="video-ad-label"], - [data-a-target="video-ad-countdown"] { - color: @text !important; - } - - /* Verified badge checkmark */ - path[fill="#fff"] { - fill: @crust !important; - } - - /* Override for logo icon */ - .tw-animated-glitch-logo { - --color-white: @crust; - } - - /* Modals */ - .modal__content { - color: @text; - } - } -} - -@-moz-document domain("dashboard.twitch.tv") { - .tw-root--theme-dark { - #catppuccin(@darkFlavor); - } - .tw-root--theme-light { - #catppuccin(@lightFlavor); - } - - #catppuccin(@lookup) { - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - .simplebar-content { - background-color: @mantle; - } - .scrollable-area--suppress-scroll-x > .simplebar-scroll-content, - .scrollable-area--suppress-scroll-x - > .simplebar-scroll-content - > .simplebar-content { - background-color: @base; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/twitch/catppuccin.user.less b/styles/twitch/catppuccin.user.less new file mode 100644 index 0000000000..e0000fc3b1 --- /dev/null +++ b/styles/twitch/catppuccin.user.less @@ -0,0 +1,1821 @@ +/* ==UserStyle== +@name Twitch Catppuccin +@namespace github.com/catppuccin/userstyles/styles/twitch +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/twitch +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/twitch/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atwitch +@description Soothing pastel theme for Twitch +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("twitch.tv") { + @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); + + .tw-root--theme-dark { + #catppuccin(@darkFlavor); + } + .tw-root--theme-light { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + body { + background-color: @base; + } + + &, + .tw-dialog-layer, + [class*="ScLayoutCssVars-sc-"], + .tw-tooltip-layer { + --color-background-input-focus: @crust; + --color-background-interactable-hover: fade(@surface0, 48%); + --color-background-interactable-alpha-hover: @surface0; + --color-background-interactable-active: @surface1; + --color-background-button-secondary-active: @surface1; + --color-background-button-text-default: null !important; + --color-background-pill-subtle: @subtext0; + --color-background-placeholder: @surface0; + --color-background-selectable: @surface0; + --color-text-input-placeholder: @text; + --color-border-input: @base; + --color-border-tab: @surface0; + --color-text-button-primary: @crust; + --color-text-overlay: @base; + --color-text-overlay-alt: @subtext0; + --color-text-overlay-link-hover: @subtext0; + --color-text-base: @subtext1; + --color-text-alt: @text; + --color-text-alt-2: @subtext0; + --color-text-interactable-selected: @crust; + --color-text-interactable-inverted: @base; + --color-background-alt-2: @crust; + --color-text-tag: @subtext0; + --color-background-button-secondary-default: @crust; + --color-background-button-primary-hover: darken(@accent, 5%); + --color-background-button-secondary-hover: @surface0; + --color-background-button-overlay-secondary-default: fade(@text, 13%); + --color-background-tag-default: @surface0; + --color-background-tag-hover: @surface1; + --color-background-float: @mantle; + --color-background-body: @base; + --color-background-base: @mantle; + --color-background-alt: @mantle; + --color-background-input: @crust; + --color-brand-muted-cupcake: @pink; + --color-brand-muted-mint: @green; + --color-brand-muted-sky: @sky; + --color-brand-muted-blush: @peach; + --color-brand-muted-canary: @peach; + --color-brand-muted-lavender: @lavender; + --color-brand-muted-mustard: @yellow; + --color-brand-muted-emerald: @green; + --color-brand-muted-coral: @peach; + --color-brand-muted-ocean: @blue; + --color-brand-accent-grape: @mauve; + --color-brand-accent-dragonfruit: @flamingo; + --color-brand-accent-carrot: @peach; + --color-brand-accent-sun: @peach; + --color-brand-accent-lime: @green; + --color-brand-accent-turquoise: @sky; + --color-brand-accent-eggplant: @mauve; + --color-brand-accent-wine: @flamingo; + --color-brand-accent-slime: @green; + --color-brand-accent-seafoam: @green; + --color-brand-accent-cherry: @red; + --color-brand-accent-marine: @blue; + --color-brand-accent-seaweed: @teal; + --color-brand-accent-fiji: @green; + --color-brand-accent-blueberry: @blue; + --color-brand-accent-arctic: @sky; + --color-brand-accent-highlighter: @yellow; + --color-brand-accent-flamingo: @flamingo; + --color-brand-accent-ruby: @red; + --color-brand-accent-punch: @flamingo; + --color-brand-accent-creamsicle: @yellow; + --color-red: @maroon; + --color-red-darker: @red; + --color-orange: @peach; + --color-yellow: @yellow; + --color-green: @green; + --color-green-darker: @green; + --color-blue: @blue; + --color-prime-blue: @blue; + --color-magenta: @flamingo; + --color-error: @red; + --color-warn: @yellow; + --color-success: @green; + --color-white: @text; + --color-black: @crust; + --color-info: @blue; + --color-twitch-purple: @accent; + --color-twitch-purple-4: @accent; + --color-twitch-purple-5: @accent; + --color-twitch-purple-6: @accent; + --color-twitch-purple-7: @accent; + --color-twitch-purple-8: @accent; + --color-twitch-purple-9: @accent; + --color-twitch-purple-10: @accent; + --color-twitch-purple-11: @accent; + --color-twitch-purple-12: @accent; + --color-orange-7: @yellow; + --color-orange-8: @yellow; + --color-orange-9: @yellow; + --color-orange-10: @yellow; + --color-orange-11: @yellow; + --color-orange-12: @yellow; + --color-orange-13: @yellow; + --color-yellow-6: @peach; + --color-yellow-7: @peach; + --color-yellow-8: @peach; + --color-yellow-9: @peach; + --color-yellow-10: @peach; + --color-yellow-11: @peach; + --color-yellow-12: @peach; + --color-yellow-13: @peach; + --color-yellow-14: @peach; + --color-yellow-15: @peach; + --color-green-5: @green; + --color-green-6: @green; + --color-green-7: @green; + --color-green-8: @green; + --color-green-9: @green; + --color-green-10: @green; + --color-green-11: @green; + --color-green-12: @green; + --color-green-13: @green; + --color-green-14: @green; + --color-green-15: @teal; + --color-cyan-9: @sapphire; + --color-cyan-10: @sapphire; + --color-cyan-11: @sapphire; + --color-cyan-12: @sapphire; + --color-cyan-13: @sapphire; + --color-cyan-14: @sapphire; + --color-cyan-15: @sky; + --color-blue-4: @blue; + --color-blue-5: @blue; + --color-blue-6: @blue; + --color-blue-7: @blue; + --color-blue-8: @blue; + --color-blue-9: @blue; + --color-blue-10: @sky; + --color-blue-11: @sky; + --color-blue-12: @sky; + --color-blue-14: @sky; + --color-magenta-5: @flamingo; + --color-magenta-6: @flamingo; + --color-magenta-7: @flamingo; + --color-magenta-8: @flamingo; + --color-magenta-9: @flamingo; + --color-magenta-10: @flamingo; + --color-magenta-11: @pink; + --color-magenta-12: @pink; + --color-magenta-14: @pink; + --color-red-4: @accent; + --color-red-5: @accent; + --color-red-6: @accent; + --color-red-7: @accent; + --color-red-8: @accent; + --color-red-9: @accent; + --color-red-10: @red; + --color-red-11: @peach; + --color-red-12: @peach; + --color-red-14: @peach; + --color-twitter: @blue; + --color-facebook: @blue; + --color-reddit: @peach; + --color-snapchat: @yellow; + --color-instagram: @blue; + --color-youtube: @red; + --color-paypal: @blue; + --color-paypal-blue: @blue; + --color-paypal-yellow: @yellow; + --color-venmo: @blue; + --color-vk: @blue; + --color-amazon: @yellow; + --color-background-button-text-hover: @surface0; + --color-text-accessible-red: @accent; + --color-border-input-checkbox: @subtext0; + --color-border-input-checkbox-hover: @text; + --color-text-label: @text; + --color-border-input-hover: @surface0; + --color-opac-b-14: @crust; + --color-text-button-overlay: @text !important; + --color-background-progress: @surface0; + --color-background-range-overlay-fill: @text !important; + --color-text-button-overlay-hover: @text !important; + --color-text-tooltip: @base !important; + --color-background-tooltip: @text !important; + --color-hinted-grey-2: @surface0; + --color-hinted-grey-5: @surface0; + --color-hinted-grey-8: @subtext0; + --color-hinted-grey-12: @subtext0; + --color-hinted-grey-15: @text; + --color-background-overlay-alt: fade(@mantle, 60%); + --color-background-button-overlay-primary-hover: @subtext1; + --color-background-button-overlay-text-hover: @crust; + --color-border-overlay: @surface0; + --color-border-base: @surface0; + --color-background-button-disabled: @surface0; + --color-text-button-disabled: @subtext0; + --color-background-toggle-handle: @text; + --color-border-toggle: @text; + --color-border-toggle-hover: @text; + --color-background-toggle-checked: @mantle; + --color-background-input-checkbox-checked-background: @crust; + --color-border-balloon-overlay: @surface0; + --color-opac-gd-1: fade(@surface0, 35%); + --color-text-number-badge: @base; + + & when (@flavor = latte) { + --color-white: @base; + --color-black: @text; + --color-hinted-grey-12: @mantle; + --color-text-pill: @base; + --color-text-overlay-link-hover: @surface0; + --color-background-overlay-alt: fade(@text, 60%); + --color-text-button-destructive: @base; + --color-text-button-overlay: @base !important; + } + } + + --color-text-link: @accent; + --color-text-link-active: darken(@accent, 5%); + --color-text-link-focus: darken(@accent, 5%); + --color-text-link-hover: darken(@accent, 5%); + --color-text-link-visited: @accent; + + &, + [class*="ScAccentRegionCssVars"] { + --color-accent: @accent; + } + /* Hardcoded accent color */ + [style="color: rgb(160, 84, 255);"] { + color: @accent !important; + } + + /* `Pinned message` popup */ + + div.pinned-chat__pinned-by svg { + color: @text; + } + + p.pinned-chat__message { + span { + color: @text !important; + } + + a { + color: @accent; + } + } + + /* `Intended for certain audiences` label */ + + div[data-a-target="content-classification-warning-disclosure-overlay"] p { + color: @text !important; + } + + /* `Hype Train` popup */ + + div.hype-train-progress-bar-info-view__level-container p, + div.hype-train-approaching-view__leftSide p, + div.hype-train-expanded-layout p, + div.hype-train-expanded-layout svg { + color: @text; + } + + path[d="m18 17 4-4V2H6v15h4v4l4-4h4zM12 6h2v6h-2V6zm7 0h-2v6h2V6z"] { + fill: @mantle; + } + + /* `Is video buffering?` warning */ + + div.low-latency-notification { + p { + color: @text; + } + border-color: @accent; + } + + /* `Includes paid promotion` label */ + + div.disclosure-card { + p, + svg, + a { + color: @text; + } + background: fade(@mantle, 80%); + } + + /* Raiding popup */ + + div[data-test-selector="raid-banner"] { + color: @text; + } + + /* `Predict with Channel Points` popup */ + + div[data-test-selector="expanded-content"] p, + p[data-test-selector="community-prediction-highlight-header__top-predictors"], + p[data-test-selector="community-prediction-highlight-body__outcome-title"] { + color: @text; + } + + /* TODO: ensure that the poll does not default to this */ + div[data-test-selector="header-content"] p { + color: @text !important; + } + + div.channel-points-icon svg, + div[data-test-selector="header-content"] span, + div[data-test-selector="community-prediction-highlight-body__outcome-points"] + span { + color: @accent; + } + + button[data-test-selector="community-prediction-highlight-header__how-to-play"], + button[data-test-selector="community-prediction-highlight-header__terms-and-conditions"], + button[data-test-selector="community-prediction-highlight-header__send-feedback"], + button[data-test-selector="community-prediction-highlight-header__dismiss-message"] { + color: @text; + } + + /* ??? */ + + div.happening-now-disable-prompt p { + color: @text !important; + } + + /* Gifting sub popup */ + + div.mystery-gift-chat-banner { + span { + color: @accent; + } + + p { + color: @text; + } + } + + /* VOD metadata */ + + div.tw-media-card-stat when not(@flavor = latte) { + --color-text-overlay: @text; + } + + /* Seekbar segment */ + + div[data-test-selector="seekbar-interaction-area__interactionArea"] + span[data-test-selector="seekbar-segment__segment"] { + background: @accent !important; + } + + /* Seekbar DMCA muted segment */ + + div[data-test-selector="seekbar-interaction-area__interactionArea"] + span[data-test-selector="seekbar-segment__segment"][style*="background-color: rgba(212, 73, 73, 0.5);"] { + background: @red !important; + } + + /* Seekbar buffered segment */ + + div[data-test-selector="seekbar-interaction-area__interactionArea"] + span[data-test-selector="seekbar-segment__segment"][style*="background-color: rgba(255, 255, 255, 0.85);"] { + background: @overlay2 !important; + } + + /* Recent VOD title */ + + div.player-overlay-background h4 { + color: @subtext0 !important; + } + + a.offline-recommendations-video-card p { + color: @text; + } + + /* Offline screen follow panel */ + + div[data-test-selector="follow-panel-overlay"] p { + color: @text !important; + } + + div[data-test-selector="follow-panel-overlay"] button div { + color: @crust !important; + } + + /* Front page warning sign */ + + div.content-overlay-gate__content[data-a-target="player-overlay-content-gate"] + div.content-overlay-icon + svg { + color: @red; + } + + /* Front page age warning */ + + div.content-overlay-gate__content[data-a-target="player-overlay-content-gate"] + p.content-overlay-gate__allow-pointers { + color: @red !important; + } + + /* Front page age selector */ + + div[data-a-target="player-overlay-age-gate-form"] select { + color: @text; + } + + /* Followers list usercard */ + + div[data-a-target="user-card-modal"] p when not(@flavor = latte) { + --color-text-overlay: @text; + } + + /* Usercard mod log tabs */ + + .viewer-card-mod-drawer-tab--active { + box-shadow: 0 calc(var(--border-width-default) * -3) 0 @accent inset + !important; + } + + /* Usercard header */ + + .viewer-card-header__overlay { + background-color: fade(@mantle, 60%) !important; + } + + /* PiP username */ + + div.mini-overlay__title span { + color: @text; + } + + /* Viewercard username */ + + div.viewer-card-header__display-name h4 { + color: @accent !important; + } + + /* Viewercard metadata */ + + div.viewer-card-header__display-name svg:not(button svg) { + color: @subtext1; + } + + div.viewer-card-header__display-name p { + color: @text !important; + } + + /* Extension name */ + + div[aria-describedby="popover-extensions-body"] h6 { + color: @text; + } + + /* Extension description */ + + div.extensions-popover-view-layout__body p { + color: @text; + } + + /* Extension service buttons */ + + div.extensions-popover-view-layout__body svg { + color: @subtext0; + } + + div.extensions-popover-view-layout__body div { + color: @text; + } + + /* Extension overlay */ + + .extension-view__iframe { + color-scheme: light; + } + + .carousel-metadata { + background: @crust; + } + .carousel-metadata--fadeout { + background: @crust; + } + .chat-line__timestamp { + color: @subtext0; + } + .chat-line__message-body--highlighted { + background-color: @accent; + color: @crust; + border-color: @accent; + } + .chat-scrollable-area__message-container { + background-color: @mantle; + } + .side-nav-card__link:hover, + .side-nav-card__link:focus { + background: @surface0 !important; + } + .footer { + background: @crust; + } + .whispers-list-item--selected, + .whispers-list-item:hover { + background-color: @surface0; + } + .thread-header__title-bar-container--focused { + background-color: @mantle; + } + .thread-header__title-bar-container { + background: @mantle; + } + .thread-header__click-area:focus .thread-header__title-bar-container { + background-color: @mantle; + } + .navigation-link { + color: @text; + + &:hover, + .active { + color: @accent; + } + } + .navigation-link__active-indicator { + background-color: @accent !important; + } + .chat-room { + background: @mantle; + } + div.pinned-chat__highlight-card div.highlight { + background: @mantle; + } + + .server-message-alert { + border-color: @red !important; + border-left-color: @red !important; + } + + .server-message-alert__icon { + color: @red !important; + } + + /* Predictions */ + .fixed-prediction-button { + color: @mantle !important; + + .channel-points-icon svg { + color: @mantle !important; + } + + &.fixed-prediction-button--disabled { + color: @text !important; + + .channel-points-icon svg { + color: @text !important; + } + } + } + [style*="rgb(255, 255, 255)"] { + color: @base !important; + .channel-root, + .channel-info-content, + .chat-author__display-name, + .chatter-name, + &[data-a-target="chat-message-username"], + &.message-author__display-name { + color: @text !important; + } + } + + .chatter-name [style*="rgb(255, 255, 255)"] { + color: @text !important; + } + + [style="color: rgb(56, 122, 255);"] { + color: @blue !important; + } + [style="color: rgb(245, 0, 155);"] { + color: @pink !important; + } + + /* FrankerFaceZ uptime timer */ + .ffz-il-tooltip__container { + p, + figure.ffz-i-flag { + color: @text; + } + } + + [data-a-target="preview-card-image-link"] when (@flavor = latte) { + .tw-media-card-stat, + p, + figure.ffz-i-flag { + color: @base; + } + } + + /* VOD chapters */ + .preview-card-game-balloon__content .tw-interactable:hover { + p, + figure { + color: @text !important; + } + .media-row__image-play-overlay { + background-color: fade(@base, 80%) !important; + } + } + + .fixed-prediction-button--blue, + [style*="background-color: rgb(56, 122, 255);"], + [style*="background: rgb(56, 122, 255);"] { + background-color: @blue !important; + } + .fixed-prediction-button--pink, + [style*="background-color: rgb(245, 0, 155);"], + [style*="background: rgb(245, 0, 155);"] { + background-color: @pink !important; + } + + input[disabled] { + background-color: @surface0; + } + .chat-wysiwyg-input__placeholder { + color: @subtext0; + } + + button[aria-label="Play"], + button[aria-label="Pause"] { + + div svg { + color: @subtext0; + } + } + + [data-a-target="video-ad-label"], + [data-a-target="video-ad-countdown"] { + color: @text !important; + } + + /* Override for logo icon */ + .tw-animated-glitch-logo { + --color-white: @crust; + } + + /* Modals */ + .modal__content { + color: @text; + } + + /* Leaderboard highlighted username */ + .bits-leaderboard-expanded-top-three-entry__marquee-username, + .channel-leaderboard-header-runner-up-entry__username, + .bits-leaderboard-expanded-top-three-entry__username { + div { + color: @base !important; + } + } + + .channel-leaderboard-header-rotating__expand-grabber { + background: @surface0 !important; + } + + /* Privacy center */ + + .privacy-center-root__number-item { + background: @accent; + color: @base; + } + + .privacy-center-accordion { + border-color: @accent; + } + + .privacy-center-home-tabs { + color: @base !important; + &[aria-selected="true"], + &:hover { + color: @surface1 !important; + } + } + + .home-page__title-container, + .tw-responsive-wrapper { + svg path { + &[fill="#fff"], + &[fill="#FFF"] { + fill: transparent !important; + } + } + } + + .home-page__title { + color: @base !important; + } + + .tw-balloon { + .tw-callout-message__title { + color: var(--color-text-variable) !important; + } + + .tw-callout__close div.tw-svg { + fill: var(--color-text-variable) !important; + } + } + + /* Home page tips and analytics */ + + .analytics-tip-card { + color: @base !important; + + button { + color: @base !important; + } + } + + [class*="analyticsTargetProgressCard--"], .analytics-highlights-card { + .creator-home-card__icon + :not(.creator-home-card__icon-background--undefined) + ~ .creator-home-card__icon-svg { + color: @base !important; + } + } + + .creator-home-welcome-title__overlay-text, + .analytics-highlights-chart-tooltip__label--dark { + color: @base !important; + } + + .creator-home-focus-position { + background: linear-gradient(@accent, @base); + } + + /* Shield mode tray */ + + .shield-mode-icon svg path { + fill: @peach; + } + + .tray-highlight, + .chat-input-highlight, + .shield-mode-shortcut__btn { + border-color: @peach !important; + } + + /* Shield mode mod view button */ + + .shield-mode-shortcut__inner, + .shield-mode-view-toggle--active { + color: @base; + background: @peach; + } + + /* Channel points reward cost */ + + .reward-icon__cost { + color: @text !important; + background: fade(@mantle, 60%) !important; + + & when (@flavor = latte) { + color: @base !important; + background: fade(@text, 60%) !important; + } + } + + /* Directory banner */ + + .directory-header-new__banner-cover { + background: + linear-gradient(0deg, @base, fade(@mantle, 25%)), + linear-gradient(90deg, @base, fade(@mantle, 25%)); + } + + .home-video when not(@flavor = latte) { + --color-text-overlay: @text; + } + + /* Cookies and Advertising Choices */ + + .top-bar--pointer-enabled .consent-banner__content--gdpr-v2, + .consent-banner { + a, + button, + p { + color: @base !important; + } + + button:not([data-a-target="consent-banner-accept"]) { + background-color: fade(@base, 10%); + } + } + + /* Mod view changelog shadow */ + + .mod-view-whats-new-list--more-posts-to-see::after { + background-image: linear-gradient(transparent, @mantle); + } + + /* Unban requests */ + + .unban-requests-tabs__load-previous { + background-image: linear-gradient(@mantle, fade(@mantle, 0%)); + } + + .unban-requests-action-button__selected { + color: @base !important; + background: @accent; + } + + .unban-requests-tabs__load-previous > div { + background: @surface0; + } + + /* Timestamps, mod actions and deleted messages */ + + .targeted-mod-action, + .message__timestamp, + .vcml-message__timestamp, + .chat-line__message--deleted { + color: @subtext0; + } + + /* Suspicious user banner in usercard */ + + .low-trust-user-banner div { + color: @text !important; + } + + /* Emote preview */ + + .chat-input__preview__text { + color: @base !important; + } + + /* Twitch logo in onboarding screen */ + + .onboarding-modal-splash-screen__container { + svg path[fill="#fff"] { + fill: transparent !important; + } + } + + /* Stream category subtitle in onboarding screen */ + + .onboarding-modal-main-list-live-channels-live-channel-card__sub-title { + color: @subtext0 !important; + } + + /* Subscriptions */ + + .tier-display { + color: @mauve; + } + + .tier-display__prime { + color: @blue; + } + + .sub-badge-progress p, + .sub-badge-progress__all-badges--text, + .expired-sub-message { + color: @subtext0 !important; + } + + .sunlight-modal__content { + color: @text !important; + } + + .tw-loading-spinner { + color: @text; + } + + .video-player__container, .clips-root__main { + & when not(@flavor = latte) { + --color-text-overlay: @text; + } + } + + .vertical-selector a:hover { + background: darken(@accent, 5%); + } + + /* Chat popouts */ + + div[data-test-selector="chat-private-callout-queue__callout-container"] { + .tw-callout__close > button { + color: @base !important; + } + div[data-a-target="tw-progress-bar-animation"] { + background: @base; + } + div.tw-progress-bar { + background: fade(@base, 10%); + } + button .tw-svg, svg { + fill: @base; + } + } + + /* SUBtember subscribe button */ + + .gift-subtember-button { + background: @teal; + } + + .player-controls when (@flavor = latte) { + --color-text-button-overlay: @base !important; + --color-background-range-overlay-fill: @base !important; + --color-text-button-overlay-hover: @mantle !important; + } + + /* Clips watch live prompt */ + + .watch-live-prompt { + h5 { + color: @text !important; + } + h6 { + color: @subtext0 !important; + } + } + + .clips-top-nav-user { + .clips-top-nav-user__username, + .tw-svg { + color: @text !important; + } + } + + /* AutoMod caught message */ + + .chat-line__message--alert { + border-color: @red !important; + background-color: @base !important; + } + + .text-fragment--moderated-highlight { + color: @text !important; + background-color: fade(@red, 30%) !important; + } + + /* Activity feed icons */ + + .activity-feed-v2-event--follow { + color: @pink; + } + + .activity-feed-v2-event--subscription { + color: @blue; + } + + .activity-feed-v2-event--reward-request, + .activity-feed-v2-event--raiding { + color: @yellow; + } + + .activity-feed-v2-event--multi-stage { + color: @teal; + } + + .activity-feed-v2-event--creator-goal { + color: @green; + } + + /* Chat message highlights */ + + div[style*="border"] { + /* Suspicious user */ + &[style*="rgb(255, 130, 128)"] { + border-color: @red !important; + } + + /* First message */ + &[style*="rgb(255, 117, 230)"] { + border-color: @pink !important; + } + + /* Returning chatter */ + &[style*="rgb(0, 163, 163)"] { + border-color: @teal !important; + } + + /* Raider */ + &[style*="rgb(245, 245, 0)"] { + border-color: @yellow !important; + } + + /* Mention */ + &[style*="rgb(173, 173, 184)"] { + border-color: @text !important; + } + + /* Moderator */ + &[style*="rgb(0, 168, 101)"] { + border-color: @green !important; + } + + /* VIP */ + &[style*="rgb(219, 0, 179)"] { + border-color: @mauve !important; + } + + /* Subscriber */ + &[style*="rgb(82, 139, 255)"] { + border-color: @blue !important; + } + } + + /* "Account suspended or deactivated" status banner */ + + .viewer-card-header__account-status-banner { + color: @text; + background-color: @mantle !important; + } + + /* Chat mentions */ + + .mention-fragment { + color: @text; + background-color: @surface0; + + &.mention-fragment--recipient { + color: @base; + background-color: @text; + } + } + + /* Clips sharing buttons */ + + .converter(@bg, @fg: @base) { + color: @fg !important; + background-color: @bg; + + &:not([disabled]):hover { + background-color: darken(@bg, 5%); + } + } + + .converter-youtube-button button { + .converter(@red); + } + + .converter-instagram-button button { + .converter(@mauve); + } + + .share-tiktok-button { + background-image: linear-gradient(135deg, @sky, @red); + + button { + color: @text !important; + background-color: @mantle; + + &:not([disabled]):hover { + background-color: @surface0; + } + } + } + + .clips-root__main .seekbar-bar { + background-color: @surface0 !important; + } + + /* Clips editor timeline */ + + .draggable-slider__overlay--purple { + border-color: @accent; + background-color: fade(@accent, 30%); + } + + .draggable-slider-handle--purple { + background-color: @accent; + --color-white: @base; + } + + .clip-editor-timeline-background { + background-color: @base; + } + + .clip-editor-slider-popover { + color: @base; + background-color: @text; + } + + /* Pinned message shadow */ + .pinned-chat__scrollable-area__gradient { + background-image: linear-gradient(180deg, transparent 60%, @mantle); + } + + /* What's new mod view icon */ + .whats-new-button--has-new-posts { + color: @green; + } + + /* Guest star thumbnail border */ + .guest-star-live-card-border { + background-image: linear-gradient(180deg, @mauve 0, @teal 61.98%, @blue); + } + + /* Guest Star circle buttons */ + + .guest-star-circle-button:not( + .guest-star-circle-button--inverted, + .guest-star-circle-button--alert + ), + .guest-star-circle-button__dropdown:not( + .guest-star-circle-button__dropdown--inverted, + .guest-star-circle-button__dropdown--alert + ) { + background-color: @mantle; + &:hover { + background-color: var(--color-hinted-grey-5); + } + + & when (@flavor = latte) { + --color-hinted-grey-5: @subtext0; + color: @base; + background-color: @text; + &:hover { + background-color: var(--color-hinted-grey-5); + } + } + } + + .guest-star-circle-button--inverted, + .guest-star-circle-button__dropdown--inverted { + color: @base; + border-color: @base; + & when (@flavor = latte) { + color: @text; + border-color: @text; + } + } + + /* End Stream Together button */ + .guest-star-circle-button--alert { + color: @base; + } + + /* Guest Star What's new icon */ + .notification-icon--green svg { + fill: @green; + } + + .video-player__overlay when (@flavor = latte) { + --color-text-pill: @base; + } + + /* Polls */ + .community-highlight-stack__card { + .container--default { + background-color: @base; + } + + .container--winner p { + color: @base !important; + } + + .choice-progress__fill--default { + background-color: @surface0; + } + + .top-poll-community-points-contributor { + color: @green; + } + } + + /* Channel points rewards - Learn more */ + [class*="rewardsLearnMoreHeadersDark"], + [class*="rewardsLearnMoreExpandedView"] { + background-color: @base; + } + + .footer__link, .footer__link:hover { + color: @text; + } + + .footer__glitch + path[d="m18 17 4-4V2H6v15h4v4l4-4h4zM12 6h2v6h-2V6zm7 0h-2v6h2V6z"] { + fill: @text; + } + + .bits-leaderboard-expanded__collapse { + svg { + fill: @surface0; + } + } + + .tw-channel-status-text-indicator { + color: @base; + } + + .player-captions-container { + .player-captions-container__caption-line[style*="; color: rgb(255, 255, 255)"] { + color: if(@flavor = latte, @base, @text) !important; + } + } + + article { + .tw-callout-message { + color: @base; + } + .tw-callout__close svg { + fill: @base !important; + } + div.tw-root--theme-dark, div.tw-root--theme-light { + .tw-callout-message { + color: @subtext0; + } + + .tw-callout__close svg { + fill: @text !important; + } + } + } + + .vod-seekbar-preview-overlay__wrapper [class^="CoreText-sc-"] { + color: @text !important; + } + + #chapter-select-popover-body .media-row { + --color-text-overlay: @text; + --color-background-interactable-selected: @surface0; + .media-row__image-wrapper figure { + color: @text; + } + } + } +} + +@-moz-document domain("dashboard.twitch.tv") { + .tw-root--theme-dark { + #catppuccin(@darkFlavor); + } + .tw-root--theme-light { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + + .edit-video-properties-modal__content { + --color-background-float: @base; + } + + .simplebar-content { + background-color: @mantle; + } + + .scrollable-area--suppress-scroll-x > .simplebar-scroll-content, + .scrollable-area--suppress-scroll-x + > .simplebar-scroll-content + > .simplebar-content { + background-color: @base; + } + + .sunlight-page .simplebar-scroll-content .simplebar-content { + background-color: @base; + } + .info_box_row { + background: @crust; + } + .info_box_row_label { + color: @text; + } + .video-card-thumbnail__video-state-overlay { + color: @text !important; + background: fade(@mantle, 80%) !important; + } + + /* Twitch alerts */ + + .alerts-home-main-wrapper { + color: @text !important; + } + + .alerts-home-scrollable-area, + .alert-boxes-section-border-container { + color: @text !important; + .simplebar-content { + background: @mantle !important; + } + .alert-set-card { + background: @crust !important; + } + } + + /* Analytics */ + + .top-stats-tab--active { + color: @accent !important; + box-shadow: 0 calc(var(--border-width-default) * -3) 0 @accent inset; + .top-stats-tab__title { + color: @accent !important; + } + } + + .top-stats-tab:hover { + box-shadow: inset 0 -2px 0 @accent, 0 4px 6px -4px @accent; + background: @base !important; + } + + /* Stream Manager */ + + .stream-manager--page-view { + .mosaic-tile .simplebar-content, + .stream-manager-edit-mode-item, + .stream-manager-edit-mode-stat-item { + background: @mantle !important; + } + } + + /* Autohost / managed channels list */ + + .dashboard-centered-page { + --color-background-alt: @base; + .simplebar-scroll-content, + .simplebar-content { + background: transparent !important; + } + + .autohost-list-item--hovered { + color: @text; + background: @base; + + button svg path { + fill: @text !important; + } + } + } + + /* Research */ + + .time-to-stream-tab--active { + box-shadow: 0 calc(var(--border-width-default) * -3) 0 @accent inset; + } + + /* Collection thumbnails */ + + .collection-preview-image__wrapper { + color: @text !important; + background: linear-gradient( + 90deg, + fade(@mantle, 0%), + fade(@mantle, 100%) 75% + ); + } + + /* AutoMod shadow */ + + .automod-level-controls__categories--bottom::after { + background-image: linear-gradient(fade(@mantle, 0%), @mantle); + } + + /* Tables */ + + .tw-table, + .tw-table-heading { + border-color: @surface0; + background: @crust; + } + + /* Achievements & activity page */ + + .ach-sb, + .activity-page__scrollable .simplebar-content { + background: @mantle !important; + } + + /* Clips player background */ + + .clips-player-container { + background: @crust; + } + + .clmgr-table__row { + &:hover { + background: @surface0 !important; + } + } + + /* Announcements button */ + + .announcements-icon--green svg { + fill: @green !important; + } + + /* Achievements */ + + .ach-q-item { + &.ach-q-item--expanded { + box-shadow: 0 0 0 1px @accent; + } + + [data-test-selector="is-affiliate-banner"] { + span, + a { + color: @base !important; + } + } + + .quest-progress-bars__incomplete { + background-color: @surface0 !important; + } + } + + [data-target="video-card"] { + background: @mantle !important; + } + + /* Stream Manager quick actions */ + + .quick-action, + .quick-actions-store-card-layout--top { + color: @base; + + &.quick-action--purple, + &.quick-actions-store-card-layout--purple { + background-color: @mauve; + } + + &.quick-action--blue, + &.quick-actions-store-card-layout--blue { + background-color: @blue; + } + + &.quick-action--magenta, + &.quick-actions-store-card-layout--magenta { + background-color: @pink; + } + + &.quick-action--green, + &.quick-actions-store-card-layout--green { + background-color: @green; + } + + &.quick-action--red, + &.quick-actions-store-card-layout--red { + background-color: @red; + } + + &.quick-action-layout--disabled { + color: @subtext0; + background-color: @surface0; + } + } + + /* Stream Manager statistics */ + .sunlight-tile { + background-color: @crust; + } + + .creator-home-card__icon-background--yellow { + background-color: @yellow; + } + + .stream-manager--page-view .mosaic-window-body, + .sunlight-expanded-nav-drop-down-menu-layout__scrollable-area, + .sunlight-collapsed-nav-drop-down-menu__scrollable-area { + background-color: @mantle; + } + + [class*="progressContainer--"] { + background-color: @surface0; + } + } +} + +@-moz-document domain("dev.twitch.tv"), + url-prefix("https://discuss.dev.twitch.com/embed/topics") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.css-variables(); + + &, + body { + color: @text !important; + background: @base; + --primary-medium: @text; + --primary-low: @surface0; + scrollbar-color: @surface0 @mantle; + } + + a.btn, + button.btn { + border-color: @accent; + background: @accent !important; + color: @base !important; + } + + a.btn:hover, + button.btn:hover { + background: fade(@accent, 80%) !important; + } + + /* Recent announcements */ + .topics-list .topic-list-item .main-link a { + color: @accent; + } + + .topic-created-at, + .topic-last-posted-at, + .topic-like-count, + .topic-post-count { + color: @subtext0 !important; + } + + /* Header */ + .nav__container, + .dev-top-nav { + background: @crust !important; + + .tw-link, + .dev-top-nav__nav-items-container { + color: @text !important; + background: @crust !important; + } + .online { + border-color: @crust !important; + } + a.btn.light { + background: fade(@accent, 10%) !important; + color: @text !important; + } + .nav__links a { + color: @text; + + &:hover { + color: @subtext0; + } + &.active { + color: @accent; + border-color: @accent; + } + } + .nav__logo svg path { + fill: @text; + } + } + + /* Footers */ + .footer, + .dev-footer, + .subscribe-footer { + h5, + p, + a, + div { + color: @text !important; + } + a:hover { + color: @accent !important; + } + + svg path { + fill: @text !important; + } + + background: @crust; + } + + .bright-cta { + * { + color: @mantle !important; + } + background: @accent; + } + .content-alternate-2 { + background: @base; + } + + .sandbox-tab { + color: @text !important; + } + + .why-twitch ul li { + background: @base; + border-color: @surface0 !important; + } + + .sandbox-tab.active { + color: @accent !important; + border-color: @accent !important; + } + + .hero, + .extension-cta, + .subscribe-footer { + background: @mantle; + } + + thead tr th { + border-color: @surface0; + background: @mantle; + } + + tbody tr td { + border-color: @surface0; + } + + tbody tr:nth-child(odd) { + background: @base !important; + } + tbody tr:nth-child(even) { + background: @mantle !important; + } + + h1, + h2, + h3, + h4, + h5, + h6, + hr { + color: @text !important; + border-color: @surface0 !important; + } + + .right-code { + p { + color: @subtext0; + } + background-color: @base !important; + } + + blockquote { + border-color: @accent; + background: @mantle; + } + + .content, + .main, + .topics-list, + .doc-content { + background: @base; + border-color: @base !important; + a { + color: @accent; + } + border-bottom-color: @surface0 !important; + border-image: none; + -webkit-border-image: none; + } + + code { + border-color: @accent !important; + background: fade(@accent, 5%) !important; + color: @text !important; + } + + /* Code */ + .right-code pre, + pre.highlight, + pre { + border-color: @mantle !important; + background: @mantle !important; + code { + background: transparent !important; + color: @text !important; + } + } + + /* Pills */ + .pill-new { + color: @base !important; + background: @accent !important; + } + .pill-beta { + color: @base !important; + background: @yellow !important; + } + + /* Navbar */ + .sidebar { + background: @mantle !important; + dl { + border-color: @base !important; + } + dt a, + dl dd a { + color: @text !important; + } + dl dd a.active-highlight { + color: @accent !important; + } + dl dd a.active-highlight::before { + border-left-color: @accent !important; + } + dt a:hover { + background: @base !important; + } + + /* Search */ + + input { + color: @text; + &::placeholder { + color: @subtext0; + } + &:focus { + background: @crust !important; + box-shadow: 0 0 3px 1px fade(@accent, 70%); + color: @text; + } + } + + .search-icon svg path { + fill: @text !important; + } + + .algolia-autocomplete { + .algolia-docsearch-suggestion--category-header { + color: @text !important; + background: @mantle !important; + border-color: @base !important; + } + + .algolia-docsearch-suggestion--highlight { + background: @accent !important; + color: @base !important; + } + + .algolia-docsearch-suggestion--content { + background: @mantle !important; + } + + .algolia-docsearch-suggestion--title { + color: @text !important; + } + + .algolia-docsearch-suggestion--text { + color: @subtext0 !important; + } + + .ds-suggestion.ds-cursor .algolia-docsearch-suggestion--content { + .algolia-docsearch-suggestion--title, + .algolia-docsearch-suggestion--text { + background: @crust !important; + .algolia-docsearch-suggestion--highlight { + background: @base !important; + } + } + } + } + } + + ul.grid li.story { + h4 a, + a.btn { + color: @text !important; + } + a { + color: @accent !important; + } + .story__links a { + color: @base !important; + } + + border-color: @surface0; + } + + .submission .relative .outer { + svg path { + fill: @text; + } + button { + border-color: @accent !important; + } + + .tag button { + background: @accent !important; + border-color: @accent !important; + } + + .author { + color: @subtext0 !important; + } + background: @mantle; + } + } +} diff --git a/styles/twitch/preview.webp b/styles/twitch/preview.webp deleted file mode 100644 index e68f580bbc..0000000000 --- a/styles/twitch/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ba636a83160c6446f2cc4d7b4e3717086315319a8beee463660143d6c5b85efe -size 1207444 diff --git a/styles/twitter/README.md b/styles/twitter/README.md index 05a4e709ed..4606797193 100644 --- a/styles/twitter/README.md +++ b/styles/twitter/README.md @@ -10,21 +10,18 @@

- -

- -

- +

## Usage -> [!NOTE] -> Set Twitter's built-in theme to **Lights out** with the blue accent. Also requires the [:has()](https://developer.mozilla.org/en-US/docs/Web/CSS/:has) selector. +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). +> [!NOTE] +> Set Twitter's built-in theme to **Lights out** with the blue accent. ## ๐Ÿ’ Current Maintainer -- [Ren](https://github.com/watatomo) +- [watatomo](https://github.com/watatomo)   diff --git a/styles/twitter/catppuccin.user.css b/styles/twitter/catppuccin.user.less similarity index 59% rename from styles/twitter/catppuccin.user.css rename to styles/twitter/catppuccin.user.less index 8b932b7baf..e95c8783cf 100644 --- a/styles/twitter/catppuccin.user.css +++ b/styles/twitter/catppuccin.user.less @@ -2,8 +2,8 @@ @name Twitter Catppuccin @namespace github.com/catppuccin/userstyles/styles/twitter @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/twitter -@version 1.0.7 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/twitter/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/twitter/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Atwitter @description Soothing pastel theme for Twitter @author Catppuccin @@ -18,66 +18,28 @@ @var checkbox darkenShadows "Darken Shadows on Dark Themes" 1 ==/UserStyle== */ -@-moz-document domain("twitter.com"), -domain("x.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("twitter.com"), domain("x.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); body.LightsOut { --border-color: @surface0; --color: @overlay1; --color-emphasis: @text; --hover-bg-color: @surface0; + --cpft-text-primary: @text; // shadows .r-qo02w8, @@ -92,7 +54,7 @@ domain("x.com") { box-shadow: @default-shadow; & when (@darkenShadows = 1) { - box-shadow: if(@lookup=latte, @default-shadow, @black-shadow); + box-shadow: if(@flavor = latte, @default-shadow, @black-shadow); } } @@ -103,7 +65,7 @@ domain("x.com") { filter: @default-shadow; & when (@darkenShadows = 1) { - filter: if(@lookup=latte, @default-shadow, @black-shadow); + filter: if(@flavor = latte, @default-shadow, @black-shadow); } } @@ -118,7 +80,7 @@ domain("x.com") { box-shadow: @default-shadow; & when (@darkenShadows = 1) { - box-shadow: if(@lookup=latte, @default-shadow, @black-shadow); + box-shadow: if(@flavor = latte, @default-shadow, @black-shadow); } } } @@ -135,7 +97,7 @@ domain("x.com") { } [style*="scrollbar-color: rgb(62, 65, 68) rgb(22, 24, 28)"] { - scrollbar-color: @accent-color transparent !important; + scrollbar-color: @accent transparent !important; scrollbar-width: thin; } @@ -177,12 +139,12 @@ domain("x.com") { // white text, seems to appear on accent colors .r-jwli3a { - color: if(@lookup=latte, #fff, @crust); + color: if(@flavor = latte, #fff, @crust); // cw svg &:has( - path[d="M3.693 21.707l-1.414-1.414 2.429-2.429c-2.479-2.421-3.606-5.376-3.658-5.513l-.131-.352.131-.352c.133-.353 3.331-8.648 10.937-8.648 2.062 0 3.989.621 5.737 1.85l2.556-2.557 1.414 1.414L3.693 21.707zm-.622-9.706c.356.797 1.354 2.794 3.051 4.449l2.417-2.418c-.361-.609-.553-1.306-.553-2.032 0-2.206 1.794-4 4-4 .727 0 1.424.192 2.033.554l2.263-2.264C14.953 5.434 13.512 5 11.986 5c-5.416 0-8.258 5.535-8.915 7.001zM11.986 10c-1.103 0-2 .897-2 2 0 .178.023.352.067.519l2.451-2.451c-.167-.044-.341-.067-.519-.067zm10.951 1.647l.131.352-.131.352c-.133.353-3.331 8.648-10.937 8.648-.709 0-1.367-.092-2-.223v-2.047c.624.169 1.288.27 2 .27 5.415 0 8.257-5.533 8.915-7-.252-.562-.829-1.724-1.746-2.941l1.438-1.438c1.53 1.971 2.268 3.862 2.33 4.027z"] - ) { + path[d="M3.693 21.707l-1.414-1.414 2.429-2.429c-2.479-2.421-3.606-5.376-3.658-5.513l-.131-.352.131-.352c.133-.353 3.331-8.648 10.937-8.648 2.062 0 3.989.621 5.737 1.85l2.556-2.557 1.414 1.414L3.693 21.707zm-.622-9.706c.356.797 1.354 2.794 3.051 4.449l2.417-2.418c-.361-.609-.553-1.306-.553-2.032 0-2.206 1.794-4 4-4 .727 0 1.424.192 2.033.554l2.263-2.264C14.953 5.434 13.512 5 11.986 5c-5.416 0-8.258 5.535-8.915 7.001zM11.986 10c-1.103 0-2 .897-2 2 0 .178.023.352.067.519l2.451-2.451c-.167-.044-.341-.067-.519-.067zm10.951 1.647l.131.352-.131.352c-.133.353-3.331 8.648-10.937 8.648-.709 0-1.367-.092-2-.223v-2.047c.624.169 1.288.27 2 .27 5.415 0 8.257-5.533 8.915-7-.252-.562-.829-1.724-1.746-2.941l1.438-1.438c1.53 1.971 2.268 3.862 2.33 4.027z"] + ) { color: @text; } } @@ -229,12 +191,12 @@ domain("x.com") { // active border for dms .r-1pbtemp { - border-right-color: @accent-color; + border-right-color: @accent; } // accent color borders .r-vhj8yc { - border-color: @accent-color; + border-color: @accent; } // magnifying glass in search bar @@ -253,37 +215,37 @@ domain("x.com") { // bg color accent .r-l5o3uw { - background-color: @accent-color; + background-color: @accent; .r-jwli3a { - color: if(@lookup=latte, #fff, @crust); + color: if(@flavor = latte, #fff, @crust); } } // accent element when hovered .r-1vtznih { - background-color: darken(@accent-color, 10%); + background-color: darken(@accent, 10%); .r-jwli3a { - color: if(@lookup=latte, #fff, @crust); + color: if(@flavor = latte, #fff, @crust); } } .r-1peqgm7 { - background-color: fade(@accent-color, 10%); + background-color: fade(@accent, 10%); } // accent element when active .r-yuvema { - background-color: darken(@accent-color, 15%); + background-color: darken(@accent, 15%); .r-jwli3a { - color: if(@lookup=latte, #fff, @crust); + color: if(@flavor = latte, #fff, @crust); } } .r-r18ze4 { - background-color: fade(@accent-color, 20%); + background-color: fade(@accent, 20%); } // white elements when hovered @@ -308,12 +270,12 @@ domain("x.com") { // polls .r-eok2q2 { - background-color: fade(@accent-color, 60%); + background-color: fade(@accent, 60%); } // box shadow around active poll input box .r-9cip40 { - box-shadow: @accent-color 0 0 0 1px; + box-shadow: @accent 0 0 0 1px; } // spaces @@ -390,12 +352,12 @@ domain("x.com") { } .r-11mg6pl { - border-color: if(@lookup=latte, #fff, @crust); // white border + border-color: if(@flavor = latte, #fff, @crust); // white border } // mask over layer .r-11z020y { - background-color: fade(desaturate(darken(@accent-color, 10%), 50%), 12%); + background-color: fade(desaturate(darken(@accent, 10%), 50%), 12%); } // likes @@ -424,7 +386,7 @@ domain("x.com") { // bell svg on notifications page .r-1cvl2hr { - color: @accent-color; + color: @accent; } // retweet svg on notifications page @@ -486,8 +448,7 @@ domain("x.com") { // hard-coded shit // ugly-ass twitter blue/premium bg. why. - [style*="https://abs.twimg.com/responsive-web/client-web/background-premiumplus-web"] - { + [style*="https://abs.twimg.com/responsive-web/client-web/background-premiumplus-web"] { background-image: none !important; background-color: @surface0; } @@ -498,7 +459,7 @@ domain("x.com") { [stroke="#1D9BF0" i], [style*="stroke: rgb(29, 155, 240)"] { - stroke: @accent-color !important; + stroke: @accent !important; } [stroke="#FFD400" i] { @@ -511,7 +472,8 @@ domain("x.com") { // "we received your report" svg [fill="#1DA1F2" i] { - fill: if(@lookup=latte, darken(@sky, 15%), darken(@sky, 30%)) !important; + fill: if(@flavor = latte, darken(@sky, 15%), darken(@sky, 30%)) + !important; } [fill="#78C6EE" i] { @@ -549,97 +511,97 @@ domain("x.com") { } [style*="border-color: rgb(103, 7, 15)"] { - border-color: fadeout(@red, 50%) !important; + border-color: fade(@red, 50%) !important; } [style*="border-color: rgb(29, 155, 240)"] { - border-color: @accent-color !important; + border-color: @accent !important; } [style*="color: rgb(231, 233, 234)"]:not( - [style*="background-color: rgb(231, 233, 234)"] - ), + [style*="background-color: rgb(231, 233, 234)"] + ), [style*="color: rgb(239, 243, 244)"]:not( - [style*="background-color: rgb(239, 243, 244)"] - ), + [style*="background-color: rgb(239, 243, 244)"] + ), [style*="color: rgb(255, 255, 255)"]:not( - [style*="background-color: rgb(255, 255, 255)"] - ) { + [style*="background-color: rgb(255, 255, 255)"] + ) { color: @text !important; } [style*="color: rgb(231, 233, 234)"]:not( - [style*="background-color: rgb(231, 233, 234)"] - ) + [style*="background-color: rgb(231, 233, 234)"] + ) input::placeholder { color: @subtext1 !important; } // faded text [style*="color: rgb(113, 118, 123)"]:not( - [style*="background-color: rgb(113, 118, 123)"] - ), + [style*="background-color: rgb(113, 118, 123)"] + ), [style*="color: rgb(182, 185, 188)"]:not( - [style*="background-color: rgb(182, 185, 188)"] - ) { + [style*="background-color: rgb(182, 185, 188)"] + ) { color: @overlay1 !important; } // retweets color [style*="color: rgb(0, 186, 124)"]:not( - [style*="background-color: rgb(0, 186, 124)"] - ) { + [style*="background-color: rgb(0, 186, 124)"] + ) { color: @green !important; } // likes/unfollow color [style*="color: rgb(249, 24, 128)"]:not( - [style*="background-color: rgb(249, 24, 128)"] - ), + [style*="background-color: rgb(249, 24, 128)"] + ), [style*="color: rgb(244, 33, 46)"]:not( - [style*="background-color: rgb(244, 33, 46)"] - ) { + [style*="background-color: rgb(244, 33, 46)"] + ) { color: @red !important; } [style*="color: rgb(250, 68, 152)"]:not( - [style*="background-color: rgb(250, 68, 152)"] - ) { + [style*="background-color: rgb(250, 68, 152)"] + ) { color: @pink !important; } [style*="color: rgb(255, 212, 0)"]:not( - [style*="background-color: rgb(255, 212, 0)"] - ) { + [style*="background-color: rgb(255, 212, 0)"] + ) { color: @yellow !important; } [style*="color: rgb(120, 86, 255)"]:not( - [style*="background-color: rgb(120, 86, 255)"] - ) { + [style*="background-color: rgb(120, 86, 255)"] + ) { color: @mauve !important; } [style*="color: rgb(255, 122, 0)"]:not( - [style*="background-color: rgb(255, 122, 0)"] - ) { + [style*="background-color: rgb(255, 122, 0)"] + ) { color: @peach !important; } // accent color (blue) [style*="color: rgb(29, 155, 240)"]:not( - [style*="background-color: rgb(29, 155, 240)"] - ) { - color: @accent-color !important; + [style*="background-color: rgb(29, 155, 240)"] + ) { + color: @accent !important; } // background colors [style*="background-color: rgb(142, 205, 248)"] { - background-color: lighten(@accent-color, 10%) !important; + background-color: lighten(@accent, 10%) !important; } [style*="background-color: rgb(2, 17, 61)"] { - background-color: fade(@accent-color, 15%) !important; + background-color: fade(@accent, 15%) !important; } [style*="background-color: rgba(255, 255, 255, 0.25)"] { @@ -650,19 +612,18 @@ domain("x.com") { background-color: @overlay0 !important; // for toggle circle - + [style*="background-color: rgb(250, 250, 250)"] - when - not - (@lookup = latte) { + + [style*="background-color: rgb(250, 250, 250)"] when not( + @flavor = latte + ) { background-color: @text !important; } } [style*="background-color: rgb(29, 155, 240)"] { - background-color: @accent-color !important; + background-color: @accent !important; [style*="color: rgb(255, 255, 255)"] { - color: if(@lookup=latte, #fff, @crust) !important; + color: if(@flavor = latte, #fff, @crust) !important; } } @@ -670,7 +631,7 @@ domain("x.com") { background-color: @text !important; [style*="color: rgb(15, 20, 25)"] { - color: if(@lookup=latte, #fff, @crust) !important; + color: if(@flavor = latte, #fff, @crust) !important; } } @@ -678,7 +639,7 @@ domain("x.com") { background-color: @red !important; [style*="color: rgb(255, 255, 255)"] { - color: if(@lookup=latte, #fff, @crust) !important; + color: if(@flavor = latte, #fff, @crust) !important; } } @@ -705,33 +666,33 @@ domain("x.com") { .r-3gvs5h, [style="background-image: linear-gradient(61.63deg, rgb(45, 66, 255) -15.05%, rgb(156, 99, 250) 104.96%);"] { [style*="color: rgb(255, 255, 255)"]:not( - [style*="background-color: rgb(255, 255, 255)"] - ), + [style*="background-color: rgb(255, 255, 255)"] + ), &[style*="color: rgb(255, 255, 255)"]:not( - [style*="background-color: rgb(255, 255, 255)"] - ), + [style*="background-color: rgb(255, 255, 255)"] + ), [style*="color: rgb(231, 233, 234)"]:not( - [style*="background-color: rgb(231, 233, 234)"] - ), + [style*="background-color: rgb(231, 233, 234)"] + ), &[style*="color: rgb(231, 233, 234)"]:not( - [style*="background-color: rgb(231, 233, 234)"] - ), + [style*="background-color: rgb(231, 233, 234)"] + ), [color="white"] { - color: if(@lookup=latte, #fff, @crust) !important; + color: if(@flavor = latte, #fff, @crust) !important; } } [data-testid="videoComponent"]:not(.r-4nw3r4), .r-loe9s5, .r-drfeu3:has( - [style="background-color: rgba(255, 255, 255, 0.25); border-color: rgba(0, 0, 0, 0); backdrop-filter: blur(4px);"] - ) { + [style="background-color: rgba(255, 255, 255, 0.25); border-color: rgba(0, 0, 0, 0); backdrop-filter: blur(4px);"] + ) { [style*="color: rgb(255, 255, 255)"]:not( - [style*="background-color: rgb(255, 255, 255)"] - ), + [style*="background-color: rgb(255, 255, 255)"] + ), &[style*="color: rgb(255, 255, 255)"]:not( - [style*="background-color: rgb(255, 255, 255)"] - ), + [style*="background-color: rgb(255, 255, 255)"] + ), .r-jwli3a { color: #fff !important; } @@ -739,7 +700,7 @@ domain("x.com") { // dms have to be here bc of the above .r-eff69c { - background-color: darken(@accent-color, 5%); + background-color: darken(@accent, 5%); [style*="color: rgb(255, 255, 255)"] { color: @crust !important; @@ -749,7 +710,7 @@ domain("x.com") { // follow button [data-testid$="-follow"] { [style*="color: rgb(15, 20, 25)"] { - color: if(@lookup=latte, #fff, @crust) !important; + color: if(@flavor = latte, #fff, @crust) !important; } } @@ -761,7 +722,7 @@ domain("x.com") { // options & when (@colorizeLogo = 1) { path[d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"] { - fill: @accent-color !important; + fill: @accent !important; } } @@ -771,47 +732,18 @@ domain("x.com") { } } -@-moz-document domain("api.twitter.com"), -domain("api.x.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@-moz-document domain("api.twitter.com"), domain("api.x.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + #catppuccin(@flavor) { + #lib.palette(); html { background: @mantle; @@ -873,12 +805,12 @@ domain("api.x.com") { .button.selected, .follow-button .unfollow .button { - background-color: @accent-color; - color: if(@lookup=latte, #fff, @crust); - border-color: darken(@accent-color, 10%); + background-color: @accent; + color: if(@flavor = latte, #fff, @crust); + border-color: darken(@accent, 10%); &:hover { - background-color: darken(@accent-color, 10%); + background-color: darken(@accent, 10%); } .app-info, @@ -893,47 +825,18 @@ domain("api.x.com") { } } -@-moz-document domain("twitter.com"), -domain("x.com") { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@-moz-document domain("twitter.com"), domain("x.com") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + #catppuccin(@flavor) { + #lib.palette(); #session a, #session input, @@ -949,8 +852,8 @@ domain("x.com") { button:hover, input:focus, input:hover { - color: if(@lookup=latte, #fff, @crust); - background-color: @accent-color; + color: if(@flavor = latte, #fff, @crust); + background-color: @accent; } } @@ -985,14 +888,14 @@ domain("x.com") { } .submit-btn { - background-color: @accent-color; - color: if(@lookup=latte, #fff, @crust); - border-color: darken(@accent-color, 10%); + background-color: @accent; + color: if(@flavor = latte, #fff, @crust); + border-color: darken(@accent, 10%); } .submit-btn:hover, .redirect-btn:hover { - background-color: darken(@accent-color, 10%); + background-color: darken(@accent, 10%); } .block-btn { @@ -1003,8 +906,8 @@ domain("x.com") { .mute-btn, .unfollow-btn, .email-report-btn { - color: @accent-color; - border-color: @accent-color; + color: @accent; + border-color: @accent; } .list-btn { @@ -1030,13 +933,3 @@ domain("x.com") { } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/twitter/preview.webp b/styles/twitter/preview.webp deleted file mode 100644 index f2c0cafabf..0000000000 --- a/styles/twitter/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:ac820aa5ac9c3a339c58d9f2aa258544e590a508753d0f48ec66a0c3b50d66f0 -size 302926 diff --git a/styles/vercel/README.md b/styles/vercel/README.md index 46265fea92..0282ccf986 100644 --- a/styles/vercel/README.md +++ b/styles/vercel/README.md @@ -10,21 +10,19 @@

- -

- -

- +

## Usage -> [!NOTE] -> This theme also applies to the [Next.js](https://nextjs.org/) website. +> [!IMPORTANT] +> This userstyle also applies to [Next.js](https://nextjs.org). + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainers -- [Ryan Cao](https://github.com/ryanccn) +- [ryanccn](https://github.com/ryanccn) - [Dandraghas](https://github.com/Dandraghas) diff --git a/styles/vercel/catppuccin.user.css b/styles/vercel/catppuccin.user.less similarity index 53% rename from styles/vercel/catppuccin.user.css rename to styles/vercel/catppuccin.user.less index 5feac3a6fe..3536fdc1f7 100644 --- a/styles/vercel/catppuccin.user.css +++ b/styles/vercel/catppuccin.user.less @@ -2,8 +2,8 @@ @name Vercel/Next.js Catppuccin @namespace github.com/catppuccin/userstyles/styles/vercel @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/vercel -@version 0.1.0 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/vercel/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/vercel/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Avercel @description Soothing pastel theme for Vercel and Next.js @author Catppuccin @@ -15,55 +15,22 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + @-moz-document domain("vercel.com"), domain("nextjs.org") { + @import url("https://prismjs.catppuccin.com/variables.important.css"); + :root.dark-theme { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } :root.light-theme { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); --geist-foreground: @text; --geist-background: @mantle; @@ -77,9 +44,9 @@ --accents-7: @overlay2; --accents-8: @subtext0; - --geist-link-color: @accent-color; + --geist-link-color: @accent; --geist-selection: @subtext0; - --geist-success: @accent-color; + --geist-success: @accent; --geist-error: @red; --geist-cyan: @teal; @@ -94,9 +61,9 @@ --ds-gray-700: @subtext1; --ds-gray-800: @subtext1; --ds-gray-900: @subtext0; - --ds-gray-900-value: #rgbify(@subtext0) []; + --ds-gray-900-value: #lib.rgbify(@subtext0)[]; --ds-gray-1000: @text; - --ds-gray-1000-value: #rgbify(@text) []; + --ds-gray-1000-value: #lib.rgbify(@text)[]; --ds-gray-alpha-100: fade(@text, 6%); --ds-gray-alpha-200: fade(@text, 9%); --ds-gray-alpha-400: @surface0; @@ -108,11 +75,11 @@ --ds-red-800: @red; --ds-red-900: lighten(@red, 5%); - --ds-blue-200: fade(@accent-color, 30%); - --ds-blue-300: fade(@accent-color, 40%); - --ds-blue-400: fade(@accent-color, 50%); - --ds-blue-700: @accent-color; - --ds-blue-900: @accent-color; + --ds-blue-200: fade(@accent, 30%); + --ds-blue-300: fade(@accent, 40%); + --ds-blue-400: fade(@accent, 50%); + --ds-blue-700: @accent; + --ds-blue-900: @accent; --tw-gradient-top: transparent; @@ -126,7 +93,7 @@ } .styled-scrollbar { - scrollbar-color: @accent-color transparent; + scrollbar-color: @accent transparent; } .dark\:from-black, @@ -156,55 +123,29 @@ @-moz-document domain("nextjs.org") { :root.dark-theme { - #catppuccin(@darkFlavor, @accentColor); + #catppuccin(@darkFlavor); } :root.light-theme { - #catppuccin(@lightFlavor, @accentColor); + #catppuccin(@lightFlavor); } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; + #catppuccin(@flavor) { + #lib.palette(); article { :not(h1, h2, h3, h4) > a { - color: @accent-color; + color: @accent; } a:hover { - color: darken(@accent-color, 5%); + color: darken(@accent, 5%); } } nav { /* Vertical line to the left of links */ a > div.bg-blue-600 { - background-color: @accent-color; + background-color: @accent; } } @@ -226,7 +167,7 @@ --shiki-token-constant: @peach; --shiki-token-string: @green; --shiki-token-string-expression: @green; - --shiki-token-comment: @overlay0; + --shiki-token-comment: @overlay2; --shiki-token-keyword: @mauve; --shiki-token-parameter: @maroon; --shiki-token-function: @blue; @@ -260,7 +201,7 @@ } td a { - color: @accent-color; + color: @accent; } .animated-optimizations_window__CjM85 { @@ -317,17 +258,3 @@ } } } - -#rgbify(@color) { - @rgb-raw: red(@color), green(@color), blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/vercel/preview.webp b/styles/vercel/preview.webp deleted file mode 100644 index aed9bfee3f..0000000000 --- a/styles/vercel/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:58cd88d32833de621e80c66ade95877b3cf9f2adfe6dfeaf3f50b00fd8343d63 -size 67146 diff --git a/styles/vikunja/README.md b/styles/vikunja/README.md index f8b91efbdc..2df937fbf4 100644 --- a/styles/vikunja/README.md +++ b/styles/vikunja/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/vikunja/catppuccin.user.css b/styles/vikunja/catppuccin.user.less similarity index 59% rename from styles/vikunja/catppuccin.user.css rename to styles/vikunja/catppuccin.user.less index a40c930922..bb3d71e27f 100644 --- a/styles/vikunja/catppuccin.user.css +++ b/styles/vikunja/catppuccin.user.less @@ -2,8 +2,8 @@ @name Vikunja Catppuccin @namespace github.com/catppuccin/userstyles/styles/vikunja @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/vikunja -@version 0.0.2 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/vikunja/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/vikunja/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Avikunja @description Soothing pastel theme for Vikunja @author Catppuccin @@ -15,35 +15,19 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('try.vikunja.io') { - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("try.vikunja.io") { + :root.dark { + #catppuccin(@darkFlavor); + } + :root.light { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); #hslbreakdown(@color, @item) { --@{item}-h: hue(@color) !important; @@ -54,20 +38,8 @@ --@{item}-invert-l: lightness(@color) !important; } - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - #hslbreakdown(@accent-color, primary); + #hslbreakdown(@accent, primary); + --grey-100-hsl: hue(@mantle) saturation(@mantle) lightness(@mantle); --site-background: @mantle; --content-heading-color: @text; --card-header-color: @text; @@ -75,7 +47,7 @@ --body-color: @text; --label-color: @text; --strong-color: @text; - --primary: @accent-color; + --primary: @accent; --primary-invert: @base; --switch-view-color: @base; --input-background-color: @base; @@ -83,7 +55,7 @@ --table-row-hover-background-color: @mantle; --table-head-cell-color: @text; --input-border-color: @overlay0; - --link-hover: @accent-color; + --link-hover: @accent; --white: @base; --grey: @overlay0; --card-content-background-color: @base; @@ -93,6 +65,9 @@ --text: @text; --text-strong: @text; --button-text-hover-background-color: @base; + --table-striped-row-even-background-color: @mantle; + --code-background: @mantle; + --code: @text; body, div#app, @@ -104,7 +79,7 @@ svg.llama-cool > circle, svg.logo > path[fill="#196aff"] { - fill: @accent-color; + fill: @accent; } svg.logo, @@ -115,6 +90,11 @@ color: @text !important; } + p.nothing, + .has-text-grey-light { + color: @subtext0 !important; + } + h1.title.task-id, div.detail-title, div.detail-title span { @@ -140,6 +120,10 @@ } } + .has-text-danger { + --has-text-hover-color: @red; + } + button.is-success { color: @green; @@ -157,11 +141,15 @@ color: @base; &:hover { - background: @accent-color; + background: @accent; } &:active { - background: darken(@accent-color, 10%); + background: darken(@accent, 10%); + } + + span.icon { + color: @base !important; } } @@ -191,7 +179,7 @@ color: @text; } li > a.router-link-active { - color: @accent-color; + color: @accent; } li:hover { background: @mantle; @@ -213,17 +201,44 @@ div.tiptap__editor { a { - color: @accent-color; + color: @accent; + } + pre, + code { + background: @surface0; + color: @text; } } + blockquote, + hr { + background: @surface0; + } + + emoji-picker { + --background: @surface0; + --border-color: @overlay0; + --button-hover-background: @overlay0; + --input-border-color: @overlay0; + scrollbar-color: @overlay0 @surface0 !important; + } + + .reaction-button.current-user-has-reacted { + border-color: @accent; + background: fade(@accent, 30%); + } + p.created { color: @overlay0; } .progress-bar { --progress-bar-background-color: @crust; - --progress-value-background-color: @accent-color; + --progress-value-background-color: @accent; + } + + .loader-container.is-loading::after { + --loader-border-color: @accent; } /* Gantt */ @@ -252,7 +267,7 @@ .g-gantt-bar-handle-left, .g-gantt-bar-handle-right { - background: darken(@accent-color, 10%); + background: darken(@accent, 10%); } } } @@ -268,7 +283,6 @@ div.task-item > .task { background: @mantle; - span.icon, span.priority-label { background: @surface0; } @@ -323,21 +337,4 @@ border-left-color: darken(@green, 5%); } } - - :root.dark { - #catppuccin(@darkFlavor, @accentColor); - } - :root.light { - #catppuccin(@lightFlavor, @accentColor); - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; } - -// vim:ft=less diff --git a/styles/vikunja/preview.webp b/styles/vikunja/preview.webp deleted file mode 100644 index b508b3c385..0000000000 --- a/styles/vikunja/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:1433187180b72dd7d3b1c6af0cfdada40543b7b73dab5172b34536898274faea -size 72478 diff --git a/styles/web.dev/README.md b/styles/web.dev/README.md index 735e9f38fc..fd74de0e0b 100644 --- a/styles/web.dev/README.md +++ b/styles/web.dev/README.md @@ -4,19 +4,18 @@

Logo
- Catppuccin for web.dev + Catppuccin for web.dev

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/web.dev/catppuccin.user.css b/styles/web.dev/catppuccin.user.less similarity index 67% rename from styles/web.dev/catppuccin.user.css rename to styles/web.dev/catppuccin.user.less index 975d630d9b..75a399112e 100644 --- a/styles/web.dev/catppuccin.user.css +++ b/styles/web.dev/catppuccin.user.less @@ -2,8 +2,8 @@ @name web.dev Catppuccin @namespace github.com/catppuccin/userstyles/styles/web.dev @homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/web.dev -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/web.dev/catppuccin.user.css +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/web.dev/catppuccin.user.less @supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aweb.dev @description Soothing pastel theme for web.dev @author Catppuccin @@ -15,62 +15,25 @@ @var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] ==/UserStyle== */ -@-moz-document domain('web.dev') { - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +// Exclude https://pagespeed.web.dev/, which is (currently) poorly themed. +@-moz-document url-prefix("https://web.dev") { + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); } } - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); :focus-visible { - outline-color: @accent-color; + outline-color: @accent; } --webdev-background-gray: @surface0; @@ -78,9 +41,9 @@ --webdev-background-oficial-gray: @surface0; --webdev-background-white: @base; --webdev-google-colors-blue-50: @base; - --webdev-google-colors-blue-600: @accent-color; - --webdev-google-colors-blue-800: @accent-color; - --webdev-primary: @accent-color; + --webdev-google-colors-blue-600: @accent; + --webdev-google-colors-blue-800: @accent; + --webdev-primary: @accent; --webdev-text-text-1: @text; --webdev-text-text-2: @subtext1; --webdev-text-text-3: @subtext0; @@ -93,17 +56,17 @@ --devsite-primary-border: 1px solid @surface0; --devsite-secondary-border: 1px solid @surface2; - --devsite-contrast-link-color: @accent-color; + --devsite-contrast-link-color: @accent; --devsite-header-link-color-active: @text; --devsite-button-disabled-background: @surface0; --devsite-button-disabled-color: @subtext0; - --devsite-button-primary-background-active: @accent-color; + --devsite-button-primary-background-active: @accent; --devsite-button-primary-color-active: @crust; --devsite-button-primary-border-hover: 2px solid transparent; --devsite-input-background: @surface0; - --devsite-input-background-focus: fade(@accent-color, 30%); + --devsite-input-background-focus: fade(@accent, 30%); devsite-multiple-choice { .devsite-multiple-choice-question { @@ -144,7 +107,7 @@ --devsite-code-buttons-hover: @subtext1; --devsite-var-color: @mauve; - --devsite-code-comments-color: @surface2; + --devsite-code-comments-color: @overlay2; --devsite-code-keywords-color: @mauve; --devsite-code-numbers-color: @peach; --devsite-code-strings-color: @green; @@ -192,13 +155,3 @@ } } } - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/web.dev/preview.webp b/styles/web.dev/preview.webp deleted file mode 100644 index 844c151d04..0000000000 --- a/styles/web.dev/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:2d26570728b1d8df600fe9b94b1e998e62988aadba0614bf7c81ec4d178041fa -size 205520 diff --git a/styles/whatsapp-web/README.md b/styles/whatsapp-web/README.md index 918be02b8d..782d68ba93 100644 --- a/styles/whatsapp-web/README.md +++ b/styles/whatsapp-web/README.md @@ -10,17 +10,17 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ’ Current Maintainer +## ๐Ÿ’ Current Maintainers - [FrancoRav](https://github.com/FrancoRav) +- [WalkQuackBack](https://github.com/WalkQuackBack)   diff --git a/styles/whatsapp-web/catppuccin.user.css b/styles/whatsapp-web/catppuccin.user.css deleted file mode 100644 index a20b0bd5e5..0000000000 --- a/styles/whatsapp-web/catppuccin.user.css +++ /dev/null @@ -1,687 +0,0 @@ -/* ==UserStyle== -@name WhatsApp Web Catppuccin -@namespace github.com/catppuccin/userstyles/styles/whatsapp-web -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/whatsapp-web -@version 0.0.9 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/whatsapp-web/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awhatsapp-web -@description Soothing pastel theme for WhatsApp Web -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] - -@var checkbox lighterMessages "Lighter incoming messages" 0 -==/UserStyle== */ - -@-moz-document domain("web.whatsapp.com") { - body { - #catppuccin(@lightFlavor, @accentColor); - } - - body.dark { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - .landing-wrapper-before { - background-color: @accent-color !important; - } - - /* STATUS PAGE */ - --status-background: @base !important; - .bfsx6evv { - background-color: @mantle !important; - } - - --modal-backdrop-solid: @base !important; - - /* join group pop up */ - --modal-background: @base !important; - - /* startup progress */ - --progress-primary: @accent-color !important; - --progress-background: @surface1 !important; - --startup-background: @base !important; - --startup-background-rgb: #rgbify(@base) []; - /* home page, no chat selected */ - --intro-background: @base !important; - --intro-border: @accent-color !important; - /* general background */ - --app-background: @base !important; - - /* CHAT LIST */ - /* nav bar background */ - --navbar-background: @mantle !important; - /* filters container background */ - --filters-container-background: @base !important; - /* filters item background */ - --filters-item-background: @surface0 !important; - /* filters item color */ - --filters-item-color: @subtext0 !important; - /* filters item background hover */ - --filters-item-background-hover: @surface1 !important; - /* filters item active background */ - --filters-item-active-background: fadeout(@accent-color, 70%) !important; - /* filters item active color */ - --filters-item-active-color: @accent-color !important; - /* chat list background */ - --background-default: @base !important; - /* chat list header */ - --panel-header-background: @mantle !important; - /* icons */ - --panel-header-icon: @text !important; - /* other warnings (notifications) */ - --butterbar-default-background: @mantle !important; - --butterbar-notification-icon: @sky !important; - /* loading messages warning */ - --butterbar-green-nux-background: @mantle !important; - /* update available warning */ - --butterbar-update-background: @mantle !important; - --butterbar-update-icon: @accent-color !important; - /* chat list search bar */ - --search-container-background: @base !important; - --search-input-container-background: @base !important; - --search-input-background: @surface0 !important; - --search-input-container-background-active: @mantle !important; - --icon-search-back: @accent-color !important; - /* archive icon */ - --icon-bright-highlight: @accent-color !important; - /* archived unread marker */ - --unread-marker-background: @accent-color !important; - --unread-timestamp: @accent-color !important; - /* archived chats header */ - --archived-chat-persistent-header-background: @crust !important; - /* unread voice message */ - --ptt-green: @green !important; - /* read voice message */ - --ptt-blue: @blue !important; - /* pinned chat icon */ - --icon-pinned: @accent-color !important; - /* last message in selected chat */ - --secondary-stronger: @subtext1 !important; - /* background for active and hover chats in chat list */ - --background-default-active: @surface1 !important; - --background-default-hover: @surface0 !important; - /* unread chats filter */ - --icon-high-emphasis: @green !important; - .p7idzaix { - color: @crust !important; - } - /* voice message playing */ - --ptt-ooc-background: @mantle !important; - - /* CONVERSATION */ - /* chat background */ - --conversation-panel-background: @mantle !important; - /* MESSAGES */ - /* background for incoming and outgoing messages */ - & when (@lighterMessages=1) { - --incoming-background: @surface1 !important; - --incoming-background-deeper: @surface2 !important; - /* arrow icon in messages */ - --incoming-background-rgb: #rgbify(@surface1) []; - } - & when (@lighterMessages=0) { - --incoming-background: @base !important; - --incoming-background-deeper: @surface0 !important; - /* arrow icon in messages */ - --incoming-background-rgb: #rgbify(@base) []; - } - --outgoing-background: @surface0 !important; - /* read double tick */ - --icon-ack: @blue !important; - /* received double tick */ - --bubble-meta-icon: @subtext0 !important; - /* message timestamp */ - --bubble-meta: @text !important; - --message-primary: @text !important; - /* POLL */ - /* creation */ - --poll-modal-background-color: @base !important; - --poll-modal-footer-background-color: @surface0 !important; - /* votes */ - --poll-bar-fill-receiver: @green !important; - --poll-bar-fill-sender: @green !important; - --checkbox-mark: @crust !important; - - /* audio duration */ - --audio-progress-metadata: @subtext0 !important; - /* system messages (unread or day messages in chats) */ - --system-message-text: @text !important; - --system-message-background: @crust !important; - /* unread system message background */ - --unread-background: @crust !important; - --unread-bar-background: @surface1 !important; - /* meta data for documents */ - --document-meta: @subtext1 !important; - /* mentions, links and link previews */ - --mention-at-symbol: @sapphire !important; - --link: @sapphire !important; - --link-preview: @text !important; - --link-preview-lighter: @subtext1 !important; - --link-preview-light: @subtext0 !important; - --outgoing-background-rgb: #rgbify(@surface0) []; - /* QUOTED MESSAGES */ - /* quoted messages */ - --quoted-message-text: @text !important; - /* background for quoted incoming and outgoing messages */ - --outgoing-background-deeper: @surface1 !important; - - /* SEARCH IN CHAT HIGHLIGHT */ - --highlight: @teal !important; - - /* quote colors */ - .bg-color-1 { - background-color: @green !important; - } - .color-1 { - color: @green !important; - } - .bg-color-2 { - background-color: @blue !important; - } - .color-2 { - color: @blue !important; - } - .bg-color-3 { - background-color: @pink !important; - } - .color-3 { - color: @pink !important; - } - .bg-color-4 { - background-color: @sapphire !important; - } - .color-4 { - color: @sapphire !important; - } - .bg-color-5 { - background-color: @peach !important; - } - .color-5 { - color: @peach !important; - } - .bg-color-6 { - background-color: @sky !important; - } - .color-6 { - color: @sky !important; - } - .bg-color-7 { - background-color: @yellow !important; - } - .color-7 { - color: @yellow !important; - } - .bg-color-8 { - background-color: @teal !important; - } - .color-8 { - color: @teal !important; - } - .bg-color-9 { - background-color: @lavender !important; - } - .color-9 { - color: @lavender !important; - } - .bg-color-10 { - background-color: @red!important; - } - .color-10 { - color: @red!important; - } - .bg-color-11 { - background-color: @mauve !important; - } - .color-11 { - color: @mauve !important; - } - .bg-color-12 { - background-color: @flamingo !important; - } - .color-12 { - color: @flamingo !important; - } - .bg-color-13 { - background-color: @rosewater !important; - } - .color-13 { - color: @rosewater !important; - } - .bg-color-14 { - background-color: @pink !important; - } - .color-14 { - color: @pink !important; - } - .bg-color-15 { - background-color: @maroon !important; - } - .color-15 { - color: @maroon !important; - } - .bg-color-16 { - background-color: @teal !important; - } - .color-16 { - color: @teal !important; - } - /* general text */ - --primary: @text !important; - --primary-strong: @text !important; - --primary-stronger: @text !important; - --primary-strongest: @text !important; - --secondary: @subtext0 !important; - --secondary-strongest-rgb: #rgbify(@text) []; - --inline-code-text: @blue !important; - /* chat list typing message */ - --typing: @green !important; - /* background for video player and image viewer */ - --media-viewer-background: @mantle !important; - /* not loaded media */ - --media-gallery-thumb-background: @crust !important; - - /* Group info/Contact info */ - --photopicker-overlay-background: fadeout(@mantle, 0.8) !important; - --photopicker-overlay-background-rgb: #rgbify(@base) []; - --media-viewer-background-rgb: #rgbify(@base) []; - --drawer-background-deep: @crust !important; - /* group info read more */ - --input-button-more: @sapphire !important; - /* Group info thumbnails border */ - --chat-info-drawer-thumb-background: @surface2 !important; - /* Group admin badge background */ - --chat-marker-background: @mantle !important; - --chat-marker-border: @mantle !important; - /* Group admin badge foreground */ - --chat-marker: @subtext0 !important; - /* Media gallery */ - --drawer-gallery-background: @crust !important; - /* mute toggle */ - --switch-button-checked-color: @accent-color !important; - --switch-track-checked-color: @surface2 !important; - --switch-track-color: @surface2 !important; - --switch-button-color: @overlay1 !important; - - /* danger, block, exit and report buttons */ - --danger: @red!important; - - /* group added by someone not in contacts */ - --button-plain-background: @surface0 !important; - --button-plain-background-hover: @surface1 !important; - - /* EMOJI AND STICKERS */ - --panel-input-background: @surface0 !important; - --sticker-button-background: @surface1 !important; - --active-tab-marker: @accent-color !important; - - /* REACTIONS */ - --reactions-panel-background-color: @surface0 !important; - --reactions-tray-background: @surface0 !important; - --reactions-details-background: @surface0 !important; - --svg-gray-button: @surface0 !important; - - /* Forward message popup */ - --panel-background-colored-deeper: @crust !important; - --modal-backdrop: fadeout(@mantle, 0.8) !important; - - /* Forward media caption */ - --forward-caption-preview-background: @mantle !important; - --forward-caption-preview-content: @crust !important; - - /* MEDIA EDITOR */ - /* background for media editor */ - --panel-background-deeper: @mantle !important; - /* message box for media editor */ - --media-editor-image-caption-input-background: @surface0 !important; - /* selected picture in media editor */ - --media-editor-thumb-border-active: @accent-color !important; - /* send button in media editor */ - --button-round-background: @accent-color !important; - - /* COMPOSE BAR */ - /* type a message bar and background */ - --compose-input-background: @surface0 !important; - --compose-input-border: @surface1 !important; - --compose-panel-background: @mantle !important; - --rich-text-panel-background: @mantle !important; - /* select messages fixes */ - --panel-background: @mantle !important; - --panel-background-rgb: #rgbify(@mantle) []; - --checkbox-background: @accent-color !important; - /* quoted message in compose */ - --popup-panel-background: @surface0 !important; - /* use Surface 0 for contrast, other colors don't pass AAA */ - /* mention list item background */ - --compose-panel-background-hover: @surface1 !important; - /* compose bar icons */ - --icon: @accent-color !important; - /* ATTACH ICONS */ - /* poll icon */ - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(6) - > button - > span - > svg - > circle { - fill: @green !important; - } - /* image icon */ - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(1) - > button - > span - > svg - > g:nth-child(1) - > g - > path:nth-child(2) { - fill: @pink !important; - } - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(1) - > button - > span - > svg - > g:nth-child(1) - > g - > path:nth-child(1) { - fill: @pink !important; - filter: brightness(85%) !important; - } - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(1) - > button - > span - > svg - > g:nth-child(1) - > g - > rect { - fill: @pink !important; - filter: brightness(70%) !important; - } - /* sticker icon */ - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(2) - > button - > span - > svg - > g - > circle { - fill: @blue !important; - filter: brightness(85%) !important; - } - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(2) - > button - > span - > svg - > g - > path:nth-child(2) { - fill: @blue !important; - } - /* camera icon */ - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(3) - > button - > span - > svg - > g:nth-child(1) - > g - > path:nth-child(1) { - fill: @red!important; - filter: brightness(85%) !important; - } - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(3) - > button - > span - > svg - > g:nth-child(1) - > g - > path:nth-child(2) { - fill: @red!important; - } - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(3) - > button - > span - > svg - > g:nth-child(1) - > g - > rect { - fill: @red!important; - filter: brightness(85%) !important; - } - /* document icon */ - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(4) - > button - > span - > svg - > g:nth-child(1) - > g - > path:nth-child(1) { - fill: @mauve !important; - filter: brightness(85%) !important; - } - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(4) - > button - > span - > svg - > g:nth-child(1) - > g - > path:nth-child(2) { - fill: @mauve !important; - } - /* contact icon */ - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(5) - > button - > span - > svg - > g:nth-child(1) - > g - > g - > path:nth-child(1) { - fill: @sky !important; - filter: brightness(85%) !important; - } - div._1OT67 - > div - > span - > div - > div - > ul - > li:nth-child(5) - > button - > span - > svg - > g:nth-child(1) - > g - > g - > path:nth-child(2) { - fill: @sky !important; - } - /* VOICE MESSAGE SENDING */ - --ptt-draft-button-send: @accent-color !important; - --ptt-draft-waveform-background: @base !important; - --ptt-draft-button-stop: @red !important; - --ptt-draft-button-stop-hover: @maroon !important; - - /* GENERAL OPTIONS */ - /* dropdown menus */ - --dropdown-background: @surface0 !important; - --dropdown-background-hover: @surface1 !important; - - /* OTHER SECTIONS */ - /* profile background */ - --drawer-background: @base !important; - /* communities, new chat, other panes */ - --panel-background-colored: @mantle !important; - --drawer-section-background: @base !important; - /* new chat icons */ - --round-icon-background: @green !important; - --inverse: @text !important; - /* title and icon for drawers */ - --drawer-header-title: @text !important; - /* buttons such as create community */ - --button-primary-background: @accent-color !important; - --button-primary-background-hover: fadeout(@accent-color, 0.8) !important; - /* keyboard shortcuts background */ - --panel-background-lighter: @mantle !important; - /* active input in modals and drawers */ - --input-border-active: @accent-color !important; - - /* Start page drawing */ - #app - > div - > div - > div._2Ts6i._2xAQV - > div - > div - > div.WM0_u - > span - > svg - > path:nth-child(1) { - fill: @surface2 !important; - } - - /* Status unread dot */ - #df9d3429-f0ef-48b5-b5eb-f9d27b2deba6 > path:nth-child(2) { - fill: @accent-color !important; - } - - #side - > div._3gYev - > div - > div - > button - > div._3xdht._1ZD3q - > span - > svg - > path { - fill: @accent-color !important; - } - } -} - -#rgbify(@color) { - @rgb-raw: red(@color) green(@color) blue(@color); -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/whatsapp-web/catppuccin.user.less b/styles/whatsapp-web/catppuccin.user.less new file mode 100644 index 0000000000..41a4ac5297 --- /dev/null +++ b/styles/whatsapp-web/catppuccin.user.less @@ -0,0 +1,261 @@ +/* ==UserStyle== +@name WhatsApp Web Catppuccin +@namespace github.com/catppuccin/userstyles/styles/whatsapp-web +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/whatsapp-web +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/whatsapp-web/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awhatsapp-web +@description Soothing pastel theme for WhatsApp Web +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] + +@var checkbox lighterMessages "Elevated incoming messages" 0 +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("web.whatsapp.com") { + /* Note: Some variables appear to be applied on :root, + but without using :has there doesn't seem to be a good + way to target the root whenever a certain theme is applied. + */ + + :root:has(> :not(.dark)), + :root .color-refresh, + .color-refresh, + /* Layer under mount */ + .app-wrapper-web.app-wrapper-web, + .app-wrapper-web.app-wrapper-web:root { + #catppuccin(@lightFlavor); + } + + :root:has(> .dark), + .dark.color-refresh, + .color-refresh.dark, + /* Layer under mount */ + .dark .app-wrapper-web.app-wrapper-web, + .dark .app-wrapper-web.app-wrapper-web:root { + #catppuccin(@darkFlavor); + } + + #initialLoad(@styles) { + #RGB(splashscreen-startup-background, @styles[@crust]) !important; + #RGB(splashscreen-startup-icon, @styles[@surface0]) !important; + + #RGB(splashscreen-primary-title, @styles[@text]) !important; + + #RGB(splashscreen-progress-primary, @styles[@@accentColor]) !important; + #RGB(splashscreen-progress-background, @styles[@surface1]) !important; + + #RGB(splashscreen-secondary-lighter, @styles[@overlay2]) !important; + + #RGB(startup-icon, @styles[@surface1]) !important; + #RGB(startup-background, @styles[@crust]) !important; + + #RGB(progress-background, @styles[@overlay0]) !important; + } + + // Inital loading screen (Avoid FOUC) + [style^="--splashscreen-startup-background: #F7F5F3;"] { + #initialLoad(@catppuccin[@@lightFlavor]); + } + + [style^="--splashscreen-startup-background: #0A1014;"] { + #initialLoad(@catppuccin[@@darkFlavor]); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + @accentContent: if(@flavor = latte, @base, @crust); + + @emphasize: 10%; + @deemphasize: if(@flavor = latte, 15%, 30%); + @bubble-surface-deemp: 20%; + + @scrim: 30%; + @pressed: 20%; + + #WDS(accent, @accent); + #WDS(accent-deemphasized, fade(@accent, @deemphasize)); + #WDS(accent-emphasized, lighten(@accent, @emphasize)); + + #WDS(secondary-negative, @red); + #WDS(secondary-negative-deemphasized, fade(@red, @deemphasize)); + #WDS(secondary-negative-emphasized, @red); + + #WDS(secondary-positive, @green); + #WDS(secondary-positive-deemphasized, fade(@green, @deemphasize)); + + #WDS(secondary-warning, @yellow); + #WDS(secondary-warning-deemphasized, fade(@yellow, @deemphasize)); + + #WDS(content-default, @text); + #WDS(content-deemphasized, @overlay2); + #WDS(content-disabled, fade(@text, 50%)); + + #WDS(content-on-accent, @accentContent); + #WDS(content-action-default, @accent); + #WDS(content-action-emphasized, lighten(@accent, @emphasize)); + #WDS(content-external-link, @blue); + #WDS(content-inverse, @crust); + #WDS(content-read, @blue); + + #WDS(background-wash-inset, @crust); + #WDS(background-wash-plain, @crust); + #WDS(background-elevated-wash-plain, @crust); + #WDS(background-elevated-wash-inset, @crust); + #WDS(background-dimmer, fade(#000, @scrim)); + #WDS(modal-backdrop-solid, @crust); + + #WDS(surface-default, @mantle); + --background-default: var(--WDS-surface-default); + --search-container-background: var(--WDS-surface-default); + #WDS(surface-emphasized, @base); + #WDS(surface-elevated-default, @base); + #WDS(surface-elevated-emphasized, mix(@text, @base, @emphasize)); + #WDS(surface-highlight, fade(@text, @pressed)); + #WDS(surface-inverse, @text); + #WDS(surface-pressed, fade(@text, @pressed)); + + #WDS(lines-divider, fade(@text, 10%)); + #WDS(lines-outline-default, @overlay0); + #WDS(lines-outline-deemphasized, fade(@text, @deemphasize)); + + #WDS(persistent-activity-indicator, fade(@green, 90%)); + #WDS(persistent-always-black, #000); + #WDS(persistent-always-white, #fff); + #WDS(persistent-always-branded, @accent); + + #WDS( + systems-bubble-surface-incoming, + if(@lighterMessages = 1, @surface1, @base), + ); + + #WDS( + systems-bubble-surface-outgoing, + mix(@accent, @base, @bubble-surface-deemp), + ); + #WDS(systems-bubble-content-deemphasized, fade(@text, 50%)); + + #WDS(systems-bubble-surface-overlay, @mantle); + #WDS(systems-bubble-surface-system, @mantle); + + #WDS( + systems-bubble-surface-e2e, + mix(@yellow, @mantle, @bubble-surface-deemp), + ); + #WDS(systems-bubble-content-e2e, @yellow); + + #WDS( + systems-bubble-surface-business, + mix(@teal, @mantle, @bubble-surface-deemp), + ); + + #WDS(systems-chat-surface-composer, @base); + #WDS(systems-chat-background-wallpaper, @crust); + #WDS(systems-chat-foreground-wallpaper, @mantle); + #WDS(systems-chat-surface-tray, @base); + #WDS(systems-status-seen, fade(@text, 50%)); + + #WDS(components-platform-gesture-bar, fade(@crust, 50%)); + #WDS(components-platform-status-bar, fade(@crust, 80%)); + #WDS(components-surface-nav-bar, @base); + + #WDS(app-wash, @surface0); + + #WDS(white, @crust); + #RGB(white, @crust); + + #RGB(attachment-type-stickers-color, @green); + #RGB(attachment-type-polls-color, @yellow); + #RGB(attachment-type-contacts-color, @sky); + #RGB(attachment-type-camera-color, @pink); + #RGB(attachment-type-photos-color, @blue); + #RGB(attachment-type-documents-color, @mauve); + #RGB(attachment-type-audio-color, @peach); + /* \/ Note: Seems to be overwritten by a generated + CSS variable, so has no effect :( */ + #RGB(attachment-type-event-color, @pink); + + #RGB(toast-background, @surface1); + #RGB(toast-text, @text); + + #RGB(picker-background, @surface1); + + #RGB(butterbar-blue-nux-background, @sky); + #RGB(butterbar-blue-nux-icon-background, darken(@sky, 30%)); + #RGB(blue-light, @blue); + + #RGB(gray-500, @overlay2); + + #RGB(focus-animation, mix(@accent, @base, 40%)); + #RGB(focus-animation-deeper, mix(@accent, @base, 30%)); + + #RGB(startup-icon, @surface1); + #RGB(startup-background, @crust); + + #RGB(progress-background, @surface0); + + /* "About AI messages" icon */ + .st0 { + fill: @accent !important; + stroke: @surface0; + } + + /* TODO: Meta AI/other bot colours */ + + input[type="time"]::-webkit-datetime-edit-hour-field:focus, + input[type="time"]::-webkit-datetime-edit-minute-field:focus, + input[type="time"]::-webkit-datetime-edit-second-field:focus, + input[type="time"]::-webkit-datetime-edit-ampm-field:focus, + input[type="date"]::-webkit-datetime-edit-year-field:focus, + input[type="date"]::-webkit-datetime-edit-month-field:focus, + input[type="date"]::-webkit-datetime-edit-day-field:focus { + background-color: @accent; + color: @accentContent; + } + + [data-icon="wa-wordmark-refreshed"] path { + fill: if( + @flavor = latte, + var(--WDS-persistent-always-branded), + currentcolor + ); + } + + /* Toasts */ + #wa-popovers-bucket + + span + > div + button:nth-of-type(1):not(:has(> [data-icon="x-alt"])) { + color: var(--WDS-accent-emphasized); + } + + /* Date picker */ + #RGB(date-picker-text-color, @text); + .react-calendar__tile:disabled { + color: @subtext0; + } + .react-calendar__month-view__days__day--neighboringMonth { + color: @overlay2; + } + } +} + +#WDS(@id, @color) { + --WDS-@{id}: @color; + --WDS-@{id}-RGB: #lib.rgbify(@color)[]; + --WDS-@{id}-rgb: #lib.rgbify(@color)[]; +} + +#RGB(@id, @color) { + --@{id}: @color; + --@{id}-rgb: #lib.rgbify(@color)[]; +} diff --git a/styles/whatsapp-web/preview.webp b/styles/whatsapp-web/preview.webp deleted file mode 100644 index 69d9aa4608..0000000000 --- a/styles/whatsapp-web/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:465c9d0a0029311b4ba5e15f7f5d105c9d4476416e5ec13f84f4a6e3b55b6eb0 -size 297066 diff --git a/styles/wiki.nixos.org/README.md b/styles/wiki.nixos.org/README.md new file mode 100644 index 0000000000..f82f46cd32 --- /dev/null +++ b/styles/wiki.nixos.org/README.md @@ -0,0 +1,37 @@ + + + +

+ Logo
+ + Catppuccin for NixOS Wiki + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [orangci](https://github.com/orangci) + +## ๐Ÿ’– Past Maintainer +- [nekowinston](https://github.com/nekowinston) + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/wiki.nixos.org/catppuccin.user.less b/styles/wiki.nixos.org/catppuccin.user.less new file mode 100644 index 0000000000..067ee70c82 --- /dev/null +++ b/styles/wiki.nixos.org/catppuccin.user.less @@ -0,0 +1,1438 @@ +/* ==UserStyle== +@name NixOS Wiki Catppuccin +@namespace github.com/catppuccin/userstyles/styles/wiki.nixos.org +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/wiki.nixos.org +@version 2026.08.16 +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awiki.nixos.org +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/wiki.nixos.org/catppuccin.user.less +@description Soothing pastel theme for NixOS Wiki +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +@var checkbox highlight-redirect "Highlight redirect links" 0 +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("wiki.nixos.org") { + @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); + + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --background-color-base: @base; + --home-panel-heading-background: @mantle; + --home-panel-border-color: @surface0; + --table-border-color: @crust; + --table-header-background: @surface1; + --table-even-background: @surface2; + + background-color: @base; + + body, + .vector-feature-zebra-design-enabled .vector-header-container .mw-header, + .vector-feature-zebra-design-enabled .mw-page-container, + .vector-feature-zebra-design-enabled .vector-pinned-container, + .vector-feature-zebra-design-enabled + .vector-dropdown + .vector-dropdown-content, + .uls-lcd, + .uls-search, + .uls-filtersuggestion, + #uls-settings-block.uls-settings-block--vector-2022.uls-settings-block--with-add-languages, + .app-badges .footer-sidebar-content, + .pure-form input[type="search"], + .suggestions-dropdown, + .cdx-menu, + .vector-header-container .mw-header, + .mw-page-container, + .vector-pinned-container, + .vector-header-container .vector-sticky-header, + .mw-mmv-image, + .mw-body, + .frb-form-wrapper, + .mw-echo-ui-placeholderItemWidget, + .oo-ui-popupWidget-popup, + .mw-echo-ui-notificationItemWidget, + .oo-ui-optionWidget-selected { + background-color: @base; + } + + body, + .mw-heading, + h1, + h2, + h3, + h4, + h5, + h6, + .vector-feature-zebra-design-enabled body, + .vector-feature-zebra-design-enabled + .vector-toc + .vector-toc-list-item-active + > .vector-toc-link, + .vector-feature-zebra-design-enabled + .vector-toc + .vector-toc-level-1-active:not(.vector-toc-list-item-expanded) + > .vector-toc-link, + .vector-feature-zebra-design-enabled + .vector-toc + .vector-toc-list-item-active.vector-toc-level-1-active + > .vector-toc-link, + .vector-menu-tabs .mw-list-item.selected a, + .vector-menu-tabs .mw-list-item.selected a:visited, + .cdx-button:enabled, + .cdx-button.cdx-button--fake-button--enabled, + .mw-footer li, + .vector-feature-zebra-design-enabled + .vector-toc + .vector-toc-level-1-active:not(.vector-toc-list-item-active) + > .vector-toc-link, + .central-featured-lang small, + .footer-sidebar-text, + .other-project-tagline, + .site-license, + .search-container .js-langpicker-label, + .langlist > ul > li, + .suggestion-title, + .cdx-menu-item--enabled .cdx-menu-item__content, + .mwe-popups .mwe-popups-extract, + .mw-body-content .mw-number-text h3, + .vector-pinnable-element .vector-menu-heading, + .vector-toc .vector-toc-list-item-active > .vector-toc-link, + .vector-toc + .vector-toc-level-1-active:not(.vector-toc-list-item-expanded) + > .vector-toc-link, + .vector-toc + .vector-toc-list-item-active.vector-toc-level-1-active + > .vector-toc-link, + .uls-empty-state .uls-empty-state__header, + .uls-empty-state .uls-empty-state__desc, + .uls-no-results-found-title, + .mw-mmv-post-image, + .mw-mmv-credit, + .frb-form-wrapper, + .mw-echo-ui-notificationItemWidget-content-message-header, + .oo-ui-labelElement, + #contentSub:not(:empty) { + color: @text !important; + } + + .mw-parser-output .fmbox { + border-color: @surface2 !important; + background-color: @base !important; + } + + .cdx-thumbnail__image { + border-color: @text; + } + + /* maths */ + .equation-box, + .equation-box * { + background: none !important; + } + img.mwe-math-fallback-image-display, + img.mwe-math-fallback-image-inline { + & when (@flavor = latte) { + filter: brightness(0) saturate(100%) invert(31%) sepia(9%) saturate( + 1499% + ) hue-rotate(196deg) brightness(90%) contrast(85%); + } + + & when (@flavor = frappe) { + filter: brightness(0) saturate(100%) invert(92%) sepia(6%) saturate( + 3753% + ) hue-rotate(184deg) brightness(93%) contrast(106%); + } + + & when (@flavor = macchiato) { + filter: brightness(0) saturate(100%) invert(82%) sepia(7%) saturate( + 1042% + ) hue-rotate(193deg) brightness(103%) contrast(92%); + } + + & when (@flavor = mocha) { + filter: brightness(0) saturate(100%) invert(83%) sepia(28%) saturate( + 223% + ) hue-rotate(190deg) brightness(99%) contrast(93%); + } + } + + .mwe-popups .mwe-popups-extract[dir="ltr"]::after { + background-image: linear-gradient( + to right, + rgba(255, 255, 255, 0), + @surface0 50% + ); + } + table { + background: @surface2 !important; + } + + tr { + background-color: @surface0 !important; + } + + th { + background: @overlay0 !important; + color: @mantle !important; + } + + .quotebox, + div.thumbinner { + background-color: @surface0 !important; + border-color: @surface2 !important; + } + + .navbox-group, + .infobox-label { + color: @text !important; + } + + .cdx-button:enabled, + .cdx-text-input__input:enabled { + color: @text; + background-color: @base; + border-color: @surface2; + &:hover { + background-color: @mantle; + border-color: @text; + color: @text; + } + } + + .vector-dropdown .vector-dropdown-content, + .header-container.header-chrome { + background-color: @mantle; + } + + .skin-vector .uls-search { + border-bottom-color: @surface2; + } + + .oo-ui-textInputWidget, + .oo-ui-inputWidget-input { + color: @text !important; + background-color: @surface1 !important; + border-color: @surface2 !important; + } + + .oo-ui-pendingElement-pending { + background-color: @base; + background-image: linear-gradient( + 135deg, + @surface0 25%, + transparent 25%, + transparent 50%, + @surface0 50%, + @surface0 75%, + transparent 75%, + transparent + ); + } + + .oo-ui-tagItemWidget.oo-ui-widget-disabled { + color: @text; + background-color: @overlay0; + text-shadow: 0 0 0 @text; + border-color: @surface0; + } + + .oo-ui-buttonElement-frameless.oo-ui-widget-enabled + > .oo-ui-buttonElement-button, + .mw-mmv-credit, + .mw-mmv-options-dialog-header, + .mw-mmv-options-text-header { + color: @text; + } + + .mw-mmv-options-text-body { + color: @subtext0; + } + + .mw-ui-input:not(:disabled) { + background-color: @surface0; + color: @text; + border-color: @surface2; + } + + .mw-ui-button { + color: @mantle; + background-color: @accent; + border-color: @accent; + } + + .imbox-delete { + border-color: @red !important; + background-color: @surface0 !important; + } + + .imbox { + background-color: @overlay0 !important; + border-color: @peach !important; + } + + .talkheader-help { + background-color: @surface1 !important; + border-color: @green !important; + } + + .assess, + .assess-NA, + .navbox-subgroup { + background: @surface0 !important; + border-color: @surface1 !important; + } + + .documentation, + .documentation-container, + .documentation-metadata { + background-color: fade(@green, 15%) !important; + } + + .ambox, + .portalborder { + background-color: @surface1 !important; + border-color: @surface2 !important; + } + + .navbox-title { + color: @text !important; + } + + .mw-content-ltr.mw-highlight-lines pre, + .mw-content-ltr.content .mw-highlight-lines pre { + box-shadow: inset 2.75em 0 0 @mantle; + } + + .mw-redirect when (@highlight-redirect = 1) { + color: @green !important; + } + + .mbox-text { + color: @text !important; + } + + .sidebar-above, + .p, + .o { + color: @text !important; + } + .ni, + .mw-templatedata-doc-muted { + color: @subtext1 !important; + } + .nv, + .nn { + color: @blue !important; + } + + .sidebar-above a span { + color: @text !important; + } + + .sidebar-title-with-pretitle span { + color: @text !important; + } + + .nt { + color: @green !important; + } + + .nl { + color: @teal !important; + } + + .ambox-style { + border-left-color: @yellow !important; + } + + .mw-parser-output .mainpage-frame { + background: @surface0 !important; + border-color: @surface0 !important; + } + + .mw-parser-output .mainpage-heading-title { + background: linear-gradient( + to right, + rgba(saturate(lighten(@accent, 4%), -3%), 0.4), + @surface0 + ) !important; + } + + .hidden-title { + background-color: @green !important; + color: @mantle !important; + } + + .mw-mmv-post-image, + .mw-mmv-options-dialog { + background-color: @base; + color: @text; + } + .mw-mmv-image-metadata { + background-color: @base; + border-color: @base; + } + + .mw-mmv-dialog-down-arrow { + background-color: @base !important; + } + + .oo-ui-tagItemWidget.oo-ui-widget-enabled { + color: @text; + background-color: @overlay0 !important; + border-color: @surface0; + } + + ol.references li:target { + background-color: @surface2; + } + + .mw-body-content .error { + color: @red; + } + + .divbox-gray, + .infobox-above { + background-color: @surface2 !important; + border-color: @overlay0 !important; + } + + .biota > * > tr > th { + background-color: @yellow !important; + color: @mantle !important; + } + + .cmbox { + background-color: @blue !important; + } + + .wikitable { + background-color: @surface0 !important; + color: @text !important; + border-color: @surface2 !important; + } + + .wikitable > * > tr > th { + background-color: @surface1 !important; + } + + .wikitable > * > tr > td, + .wikitable > * > tr > th { + background-color: @surface0 !important; + color: @text !important; + border-color: @surface2; + } + + .mw-searchresults-has-iw .iw-result__header a { + color: @text; + } + + .mw-search-result-data { + color: @subtext0; + } + + .navbox-abovebelow { + background-color: @overlay2 !important; + border-color: @overlay2 !important; + } + + .vector-feature-zebra-design-enabled + .vector-pinnable-element + .vector-menu-heading { + color: @text; + border-bottom-color: @surface0; + } + + .mwe-popups .mwe-popups-container { + background-color: @surface0; + } + + .vector-pinnable-header-toggle-button { + background-color: @surface0; + color: @text; + &:hover { + background-color: @base; + } + } + + .mw-parser-output .navbox-list { + border-color: @surface0; + } + + .pure-button-primary-progressive, + .pure-button-primary-progressive:hover { + background-color: @accent; + border-color: @accent; + } + + .suggestion-link { + border-bottom-color: @surface0; + } + + .cdx-menu, + .skin-vector .uls-menu, + .suggestiodns-dropdown, + .cdx-search-input--has-end-button, + .vector-sticky-header, + .vector-sticky-header-context-bar, + .mw-heading2 { + border-color: @surface2; + } + + .suggestion-link.active { + background-color: fade(@accent, 20%); + .suggestion-title { + color: @accent; + } + } + + .mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-highlighted, + .cdx-menu-item--enabled.cdx-menu-item--highlighted { + background-color: fade(@accent, 20%); + } + + .mw-echo-ui-sortedListWidget, + .mw-echo-ui-sortedListWidget-group, + .mw-echo-ui-subGroupListWidget-header { + border-color: @surface2; + } + + .mw-mmv-post-image, + .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive + .cdx-button__icon { + background-color: @crust; + } + + .cdx-text-input__input:enabled::placeholder, + .cdx-text-input__input:enabled ~ .cdx-text-input__icon-vue, + .skin-vector .uls-languagefilter, + .skin-vector .uls-lcd-region-title, + .suggestion-description, + .cdx-menu-item--enabled .cdx-menu-item__text__description, + .mw-number-text, + .boilerplate > div:nth-child(3) > span:nth-child(1), + .boilerplate > div:nth-child(4) > span:nth-child(2) { + color: @subtext0 !important; + } + + input:hover + .cdx-button.cdx-button--action-progressive { + background-color: fade(@accent, 12.5%); + } + + #pt-notifications-alert .mw-echo-unseen-notifications::after { + background-color: @red !important; + } + + #pt-notifications-notice .mw-echo-unseen-notifications::after { + background-color: @blue !important; + } + + a, + .mw-parser-output a.external:visited { + color: @accent; + &:visited { + color: @mauve; + } + } + + a.new, + .mw-parser-output .cs1-visible-error, + .vector-menu-tabs .mw-list-item.new a, + .mw-plusminus-neg { + color: @red; + } + + a.mw-selflink { + color: @text; + } + + #searchInput { + color: @text; + &:hover { + border-color: @surface2; + } + &:focus { + border-color: @accent; + } + } + + .pure-form input[type="search"] { + border-color: @surface2; + box-shadow: inset 0 0 0 1px @surface2; + } + + #pt-notifications-alert .mw-echo-notifications-badge::after, + #pt-notifications-notice .mw-echo-notifications-badge::after, + .mw-echo-notification-badge-nojs::after { + border-color: @crust; + background-color: @accent; + color: @base; + } + + h2 { + border-bottom-color: @surface2; + } + + .mw-footer { + border-top-color: @surface2; + } + + .bookshelf { + border-top-color: @surface0; + box-shadow: 0 -1px 0 @surface0; + } + + body.ns-talk .mw-parser-output .mp-toolbox, + .mw-parser-output .tmbox, + #talkheader { + border-color: fade(@yellow, 20%) !important; + background-color: fade(@yellow, 10%) !important; + } + + body.ns-talk .mw-parser-output .mp-toolbox-daily th { + border-color: fade(@yellow, 80%) !important; + background-color: fade(@yellow, 20%) !important; + } + + .fn.org { + color: @accent; + } + + .mw-parser-output .mp-toolbox-daily th, + .mw-parser-output td.mp-toolbox-tfl-not { + background: fade(@yellow, 20%) !important; + border-color: fade(@yellow, 20%) !important; + } + + body.ns-talk .mw-parser-output .mp-toolbox-daily { + border-color: fade(@yellow, 20%) !important; + background: none !important; + } + + .mw-parser-output tr + tr > .navbox-list, + .mw-parser-output tr + tr > .navbox-group { + border-top-color: @surface0; + } + + .ext-phonos-PhonosButton.oo-ui-buttonElement-frameless.oo-ui-buttonWidget + > .oo-ui-buttonElement-button:hover { + background-color: fade(@accent, 20%); + } + + .styled-select:hover { + background-color: @surface0; + } + + .lang-list-button, + .lang-list-button:hover { + background-color: @base; + border-color: @surface1; + outline-color: @base; + } + + .cdx-typeahead-search__search-footer__icon.cdx-icon { + color: @subtext0; + } + + .vector-toc + .vector-toc-level-1-active:not(.vector-toc-list-item-active) + > .vector-toc-link { + color: @text !important; + } + + .lang-list-active .lang-list-button { + background-color: @base; + border-color: @surface1; + outline-color: @base; + } + + .lang-list-button:focus { + box-shadow: inset 0 0 0 1px @accent; + } + + .lang-list-border { + background-color: @surface1; + } + + .infobox-header { + background-color: @surface1 !important; + color: @text !important; + } + + td[style*="background-color"], + td[style*="background-color"] * { + color: @crust !important; + } + + #toc-Services > a:nth-child(1) > div:nth-child(1) { + color: @text !important; + } + + .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive, + .vector-menu-tabs .mw-list-item a, + .vector-feature-zebra-design-enabled .vector-toc .vector-toc-link, + .mw-parser-output a.extiw, + .mw-parser-output a.external, + .mw-collapsible-toggle-default .mw-collapsible-text, + .vector-feature-zebra-design-enabled + .vector-pinnable-element + .mw-list-item + a, + .vector-feature-zebra-design-enabled + .vector-dropdown-content + .mw-list-item + a, + .vector-feature-zebra-design-enabled + .vector-pinnable-element + .mw-list-item + a:not(.mw-selflink):visited, + .vector-feature-zebra-design-enabled + .vector-dropdown-content + .mw-list-item + a:not(.mw-selflink):visited, + .uls-language-block a, + .lang-list-button, + .fancycaptcha-reload, + #pt-userpage-2 a:not(.mw-selflink), + .vector-pinnable-element .mw-list-item a, + .vector-pinnable-element .mw-list-item a:not(.mw-selflink):visited, + .vector-toc .vector-toc-link, + .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive + > .oo-ui-buttonElement-button, + .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive + > .oo-ui-buttonElement-button:hover, + .vector-dropdown-content .mw-list-item a, + .vector-dropdown-content .mw-list-item a:not(.mw-selflink):visited { + color: @accent; + } + + .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive, + .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive, + .mw-ui-button.mw-ui-progressive:not(:disabled), + .mw-ui-button.mw-ui-progressive:not(:disabled):hover { + background-color: @accent; + border-color: @accent; + color: @base; + } + + .mw-message-box-warning, + .boilerplate { + border-color: @accent !important; + background-color: fade(@accent, 25%) !important; + color: @text; + } + + .vector-feature-zebra-design-enabled .vector-sticky-pinned-container::after, + .vector-sticky-pinned-container::after { + background: none; + } + + .vector-feature-zebra-design-enabled .vector-pinnable-header-toggle-button { + background-color: @surface0; + color: @text; + &:hover { + background-color: @base; + } + } + + .vector-feature-zebra-design-enabled .vector-pinnable-header, + .vector-pinnable-header, + .vector-pinnable-element .vector-menu-heading { + border-bottom-color: @surface0; + } + + hr { + border-bottom-color: @base; + } + + .central-featured-lang strong:hover, + .link-box:hover, + .central-featured-lang :hover, + .other-project-link:hover, + .lang-list-container { + background-color: @surface0; + } + + .vector-page-toolbar-container { + box-shadow: 0 1px @surface1; + } + + .mw-parser-output .navbox-even { + background-color: @surface1; + } + + .vector-feature-zebra-design-enabled .vector-page-titlebar::after, + .mw-parser-output .wikipedia-languages-prettybars, + .vector-page-titlebar::after { + background-color: @surface2 !important; + } + + table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(2) { + background-color: fade(@accent, 20%) !important; + } + + .client-js .mw-content-ltr .mw-editsection-bracket:first-of-type, + .client-js .mw-content-ltr .mw-editsection-bracket:not(:first-of-type), + .mw-collapsible-toggle-default::before, + .mw-collapsible-toggle-default::after { + color: @subtext1; + } + + .infobox, + .mw-parser-output .navbox, + .catlinks, + .mw-parser-output #mp-topbanner, + .mw-parser-output .sidebar, + .fancycaptcha-captcha-container, + .fancycaptcha-captcha-and-reload, + .cdx-checkbox__icon, + .mw-message-box, + .uls-menu .uls-no-results-view .uls-no-found-more, + .client-js + .vector-below-page-title + .vector-page-titlebar-toc + > label:nth-child(2), + .mw-parser-output .ombox, + code, + .oo-ui-buttonElement-framed.oo-ui-widget-enabled + > .oo-ui-buttonElement-button, + .mw-mmv-label, + #page-secondary-actions > a, + .mw-parser-output .ambox, + td[class="sidebar-navbar"], + textarea, + .mw-parser-output .side-box { + background-color: @surface0 !important; + color: @text !important; + border-color: @surface2 !important; + } + + #pagehistory li.selected { + background-color: @surface0 !important; + color: @text !important; + border-color: @surface2 !important; + outline-color: @surface2 !important; + } + + .cdx-checkbox__icon { + border-color: @accent !important; + } + + .fancycaptcha-captcha-container .mw-ui-inputูˆ .mw-ui-input:not(:disabled) { + background-color: @base !important; + color: @text !important; + border-color: @surface1; + } + + .mw-ui-input:not(:disabled), + .mw-ui-button:not(:disabled) { + background-color: @base !important; + color: @text !important; + border-color: @surface1 !important; + } + + .mw-parser-output .module-shortcutboxplain { + background-color: @base !important; + color: @text !important; + border-color: @surface2; + } + + .sidebar-pretitle, + .sidebar-title-with-pretitle, + .sidebar-list-title { + background-color: fade(@accent, 20%) !important; + } + + .mw-parser-output #mp-bottom, + .mw-parser-output .sidebar-collapse .sidebar-below { + border-color: @surface2; + } + + .lang-list-content, + .bookshelf .text { + background-color: @surface0; + } + + .mw-parser-output #mp-bottom .mp-h2, + .uls-language-block > ul > li:hover { + background: @surface0; + border-color: @surface2; + } + + figure[typeof~="mw:File/Thumb"] { + background-color: @mantle !important; + color: @text !important; + border-top-color: @surface2; + border-left-color: @surface2; + border-right-color: @surface2; + > figcaption { + background-color: @mantle !important; + color: @text !important; + border-bottom-color: @surface2; + border-left-color: @surface2; + border-right-color: @surface2; + } + > :not(figcaption) .mw-file-element { + color: @surface2 !important; + border-color: @surface2; + } + } + + .mw-parser-output #mp-left, + .mw-parser-output #mp-left .mp-h2, + th[class="sidebar-title"] { + background-color: fade(@green, 10%) !important; + border-color: fade(@green, 20%) !important; + } + + .mw-plusminus-pos { + color: @green !important; + } + + .mw-parser-output #mp-right, + .mw-parser-output #mp-right .mp-h2 { + background-color: fade(@blue, 10%) !important; + border-color: fade(@blue, 20%) !important; + } + + .mw-parser-output #mp-lower, + .mw-parser-output #mp-lower .mp-h2 { + background-color: fade(@mauve, 10%) !important; + border-color: fade(@mauve, 20%) !important; + } + + .mw-collapsible-toggle-default:active .mw-collapsible-text { + color: @peach; + } + + .mw-parser-output #mp-middle, + .mw-parser-output #mp-middle .mp-h2 { + background-color: fade(@pink, 10%) !important; + border-color: fade(@pink, 20%) !important; + } + + .mw-parser-output .navbox-title, + .summary, + .infobox > tbody:nth-child(1) > tr:nth-child(4) > th:nth-child(1), + .infobox > tbody:nth-child(1) > tr:nth-child(6) > th:nth-child(1) { + background-color: fade(@accent, 20%) !important; + } + + .infobox > tbody:nth-child(1) > tr:nth-child(2) > td:nth-child(1) { + background-color: @surface1 !important; + } + + .mw-parser-output .navbox-group, + table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(3), + table.expanded:nth-child(2) + > tbody:nth-child(1) + > tr:nth-child(4) + > td:nth-child(2) + > table:nth-child(2) + > tbody:nth-child(1) + > tr:nth-child(1), + table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(1), + table.nowraplinks:nth-child(1) + > tbody:nth-child(1) + > tr:nth-child(3) + > td:nth-child(1) + > table:nth-child(2) + > tbody:nth-child(1) + > tr:nth-child(1), + table.nowraplinks:nth-child(1) + > tbody:nth-child(1) + > tr:nth-child(4) + > td:nth-child(1) + > table:nth-child(2) + > tbody:nth-child(1) + > tr:nth-child(1), + table.nowraplinks:nth-child(1) + > tbody:nth-child(1) + > tr:nth-child(5) + > td:nth-child(1) + > table:nth-child(2) + > tbody:nth-child(1) + > tr:nth-child(1), + .navbox-abovebelow { + background-color: @surface1 !important; + } + + .mw-parser-output .tracklist > tbody { + color: inherit; + + > .tracklist-total-length * { + background-color: @overlay1; + color: @base; + } + } + + .mw-content-ltr + > table:nth-child(20) + > tbody:nth-child(1) + > tr:nth-child(2) + > td:nth-child(2) { + border-color: @surface2 !important; + background-color: @surface0 !important; + } + + .noarticletext, + #noarticletext { + background-color: @base !important; + } + + #sisterproject { + background-color: @mantle !important; + } + + [style="color:#02a64f;line-height:initial"] { + color: @green !important; + } + + [style="color:#f78e1e;line-height:initial"] { + color: @peach !important; + } + + [style="color:#77278b;line-height:initial"] { + color: @mauve !important; + } + + [style="color:#87746a;line-height:initial"] { + color: @maroon !important; + } + + [style="color:#009aC8;line-height:initial"] { + color: @sky !important; + } + + [style="color:#ffd520;line-height:initial"] { + color: @yellow !important; + } + + [style="color:#0060a9;line-height:initial"] { + color: @blue !important; + } + + table.nowraplinks:nth-child(4) > tbody:nth-child(1) > tr:nth-child(1), + .navbox-list-with-group.navbox-list.navbox-odd { + background-color: @surface0 !important; + } + + .mw-parser-output tr + tr > .navbox-abovebelow { + border-color: @base; + } + + .catlinks li { + border-left-color: @surface2; + } + + .vector-icon.mw-ui-icon-wikimedia-menu { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-ellipsis { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-appearance { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + .vector-feature-zebra-design-enabled + .vector-dropdown + .vector-dropdown-label:not(.cdx-button--icon-only)::after, + .vector-icon.mw-ui-icon-wikimedia-expand { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + .cdx-checkbox__input:checked:not(:indeterminate) + + .cdx-checkbox__icon::before { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + .vector-page-titlebar + .mw-portlet-lang + .vector-dropdown-label.cdx-button--action-progressive.cdx-button--weight-quiet::after { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + .vector-dropdown .vector-dropdown-label:not(.cdx-button--icon-only)::after { + @svg: escape( + '' + ); + background: url("data:image/svg+xml,@{svg}") !important; + } + + .vector-icon.mw-ui-icon-wikimedia-language-progressive { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + .vector-icon.mw-ui-icon-wikimedia-language { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + .mw-parser-output a.external { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + .plainlinks a.external { + background: none !important; + } + + #mw-indicator-mw-helplink a { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + .cdx-search-input .cdx-text-input__icon.cdx-text-input__start-icon { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + .vector-icon.mw-ui-icon-wikimedia-listBullet { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + ul { + @svg: escape( + '' + ); + list-style-image: url("data:image/svg+xml,@{svg}"); + } + + .oo-ui-icon-volumeUp, + .mw-ui-icon-volumeUp::before { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-fullScreen { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .fancycaptcha-reload { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .popups-icon--settings { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-userAvatar { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-watchlist { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-tray { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-bell { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-user-menu-logged-in .vector-dropdown-label::after { + @svg: escape( + '' + ); + background: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-star { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-userTalk { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-sandbox { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-settings { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-unStar { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .oo-ui-image-progressive.oo-ui-icon-settings { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .oo-ui-icon-bell { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .oo-ui-icon-next { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .oo-ui-icon-settings { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .oo-ui-icon-expand { + @svg: escape( + ' expand ' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .oo-ui-icon-tray { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-labFlask { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .mw-ui-icon-vector-gadget-pt-darkmode { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .client-dark-mode .mw-ui-icon-vector-gadget-pt-darkmode { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-userContributions { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-logOut { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .uls-search-label, + .vector-icon.mw-ui-icon-wikimedia-search { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .mw-ui-icon-vector-gadget-pt-darkmode-sticky-header { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .cdx-message .cdx-message__icon { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-edit { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-history { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-speechBubbles { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .vector-icon.mw-ui-icon-wikimedia-editLock { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .branding-box > a:nth-child(1) > span:nth-child(1) > img:nth-child(1) { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + .panel-heading, + .mw-pt-languages-list, + .mw-pt-languages-label { + color: @text; + background-color: @base; + } + .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle, + .oo-ui-inputWidget-input, + .mw-widget-dateInputWidget-handle, + .oo-ui-menuSelectWidget { + background-color: @mantle !important; + color: @text !important; + } + .oo-ui-menuOptionWidget:hover { + background-color: @surface1; + color: @text; + } + .cdx-search-input__end-button { + background-color: @crust !important; + } + .mw-pt-languages { + border-bottom-color: @surface0; + } + .mw-pt-progress--complete::after, + .mw-pt-progress--high::after { + border-color: @accent; + background: conic-gradient(@text 0, @accent 0); + } + pre, + .oo-ui-panelLayout-framed { + border-color: @surface0; + } + #vector-page-titlebar-toc-label { + background-color: @mantle; + color: @subtext0 !important; + border-color: @subtext0 !important; + } + tbody * { + background-color: @surface0 !important; + border-color: @surface2 !important; + } + + [style*="padding: 0.5em; margin: 0.50em 0; background-color: #C1E5FF; border: thin solid #1D99F3; overflow: hidden;"] { + background-color: @sapphire !important; + color: @mantle !important; + } + [style*="padding: 0.5em; margin: 0.50em 0; background-color: #F6F6F6; border: thin solid #31363B; overflow: hidden;"] { + background-color: @rosewater !important; + color: @mantle !important; + } + } +} diff --git a/styles/wikipedia/README.md b/styles/wikipedia/README.md index 6345ac72dd..d8788b30e7 100644 --- a/styles/wikipedia/README.md +++ b/styles/wikipedia/README.md @@ -10,17 +10,16 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer -- [GitMuslim](https://github.com/GitMuslim) +- [uncenter](https://github.com/uncenter)   diff --git a/styles/wikipedia/catppuccin.user.css b/styles/wikipedia/catppuccin.user.css deleted file mode 100644 index 37e3f28a8d..0000000000 --- a/styles/wikipedia/catppuccin.user.css +++ /dev/null @@ -1,1648 +0,0 @@ -/* ==UserStyle== -@name Wikipedia Catppuccin -@namespace github.com/catppuccin/userstyles/styles/wikipedia -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/wikipedia -@version 0.0.22 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/wikipedia/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awikipedia -@description Soothing pastel theme for Wikipedia -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -@var checkbox highlight-redirect "Highlight redirect links" 0 -==/UserStyle== */ - -@-moz-document domain('wikipedia.org') { - @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); - - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --ctp-rosewater: @rosewater; - --ctp-flamingo: @flamingo; - --ctp-pink: @pink; - --ctp-mauve: @mauve; - --ctp-red: @red; - --ctp-maroon: @maroon; - --ctp-peach: @peach; - --ctp-yellow: @yellow; - --ctp-green: @green; - --ctp-teal: @teal; - --ctp-sky: @sky; - --ctp-sapphire: @sapphire; - --ctp-blue: @blue; - --ctp-lavender: @lavender; - --ctp-text: @text; - --ctp-subtext1: @subtext1; - --ctp-subtext0: @subtext0; - --ctp-overlay2: @overlay2; - --ctp-overlay1: @overlay1; - --ctp-overlay0: @overlay0; - --ctp-surface2: @surface2; - --ctp-surface1: @surface1; - --ctp-surface0: @surface0; - --ctp-base: @base; - --ctp-mantle: @mantle; - --ctp-crust: @crust; - - --background-color-base: @base; - - body, - .vector-feature-zebra-design-enabled .vector-header-container .mw-header, - .vector-feature-zebra-design-enabled .mw-page-container, - .vector-feature-zebra-design-enabled .vector-pinned-container, - .vector-feature-zebra-design-enabled - .vector-dropdown - .vector-dropdown-content, - .uls-lcd, - .uls-search, - .uls-filtersuggestion, - #uls-settings-block.uls-settings-block--vector-2022.uls-settings-block--with-add-languages, - .app-badges .footer-sidebar-content, - .pure-form input[type="search"], - .suggestions-dropdown, - .cdx-menu, - .vector-header-container .mw-header, - .mw-page-container, - .vector-pinned-container, - .vector-header-container .vector-sticky-header, - .mw-mmv-image, - .mw-body, - .frb-form-wrapper, - .mw-echo-ui-placeholderItemWidget, - .oo-ui-popupWidget-popup, - .mw-echo-ui-notificationItemWidget, - .oo-ui-optionWidget-selected { - background-color: @base; - } - - body, - .mw-heading, - h1, - h2, - h3, - h4, - h5, - h6, - .vector-feature-zebra-design-enabled body, - .vector-feature-zebra-design-enabled - .vector-toc - .vector-toc-list-item-active - > .vector-toc-link, - .vector-feature-zebra-design-enabled - .vector-toc - .vector-toc-level-1-active:not(.vector-toc-list-item-expanded) - > .vector-toc-link, - .vector-feature-zebra-design-enabled - .vector-toc - .vector-toc-list-item-active.vector-toc-level-1-active - > .vector-toc-link, - .vector-menu-tabs .mw-list-item.selected a, - .vector-menu-tabs .mw-list-item.selected a:visited, - .cdx-button:enabled, - .cdx-button.cdx-button--fake-button--enabled, - .mw-footer li, - .vector-feature-zebra-design-enabled - .vector-toc - .vector-toc-level-1-active:not(.vector-toc-list-item-active) - > .vector-toc-link, - .central-featured-lang small, - .footer-sidebar-text, - .other-project-tagline, - .site-license, - .search-container .js-langpicker-label, - .langlist > ul > li, - .suggestion-title, - .cdx-menu-item--enabled .cdx-menu-item__content, - .mwe-popups .mwe-popups-extract, - .mw-body-content .mw-number-text h3, - .vector-pinnable-element .vector-menu-heading, - .vector-toc .vector-toc-list-item-active > .vector-toc-link, - .vector-toc - .vector-toc-level-1-active:not(.vector-toc-list-item-expanded) - > .vector-toc-link, - .vector-toc - .vector-toc-list-item-active.vector-toc-level-1-active - > .vector-toc-link, - .uls-empty-state .uls-empty-state__header, - .uls-empty-state .uls-empty-state__desc, - .uls-no-results-found-title, - .mw-mmv-post-image, - .mw-mmv-credit, - .frb-form-wrapper, - .mw-echo-ui-notificationItemWidget-content-message-header, - .oo-ui-labelElement, - #contentSub:not(:empty) { - color: @text !important; - } - - .mw-parser-output .fmbox { - border-color: @surface2 !important; - background-color: @base !important; - } - - .cdx-thumbnail__image { - border-color: @text; - } - - /* maths */ - .equation-box, - .equation-box * { - background: none !important; - } - img.mwe-math-fallback-image-display, - img.mwe-math-fallback-image-inline { - & when (@lookup = latte) { - filter: brightness(0) saturate(100%) invert(31%) sepia(9%) - saturate(1499%) hue-rotate(196deg) brightness(90%) contrast(85%); - } - - & when (@lookup = frappe) { - filter: brightness(0) saturate(100%) invert(92%) sepia(6%) - saturate(3753%) hue-rotate(184deg) brightness(93%) contrast(106%); - } - - & when (@lookup = macchiato) { - filter: brightness(0) saturate(100%) invert(82%) sepia(7%) - saturate(1042%) hue-rotate(193deg) brightness(103%) contrast(92%); - } - - & when (@lookup = mocha) { - filter: brightness(0) saturate(100%) invert(83%) sepia(28%) - saturate(223%) hue-rotate(190deg) brightness(99%) contrast(93%); - } - } - - .mwe-popups .mwe-popups-extract[dir="ltr"]::after { - background-image: linear-gradient( - to right, - rgba(255, 255, 255, 0), - @surface0 50% - ); - } - table { - background: @surface2 !important; - } - - tr { - background-color: @surface0 !important; - } - - th { - background: @overlay0 !important; - color: @mantle !important; - } - - .quotebox, - div.thumbinner { - background-color: @surface0 !important; - border-color: @surface2 !important; - } - - .navbox-group, - .infobox-label { - color: @text !important; - } - - .cdx-button:enabled, - .cdx-text-input__input:enabled { - color: @text; - background-color: @base; - border-color: @surface2; - &:hover { - background-color: @mantle; - border-color: @text; - color: @text; - } - } - - .vector-dropdown .vector-dropdown-content, - .header-container.header-chrome { - background-color: @mantle; - } - - .skin-vector .uls-search { - border-bottom-color: @surface2; - } - - .oo-ui-textInputWidget, - .oo-ui-inputWidget-input { - color: @text !important; - background-color: @surface1 !important; - border-color: @surface2 !important; - } - - .oo-ui-pendingElement-pending { - background-color: @base; - background-image: linear-gradient( - 135deg, - @surface0 25%, - transparent 25%, - transparent 50%, - @surface0 50%, - @surface0 75%, - transparent 75%, - transparent - ); - } - - .oo-ui-tagItemWidget.oo-ui-widget-disabled { - color: @text; - background-color: @overlay0; - text-shadow: 0 0 0 @text; - border-color: @surface0; - } - - .oo-ui-buttonElement-frameless.oo-ui-widget-enabled - > .oo-ui-buttonElement-button, - .mw-mmv-credit, - .mw-mmv-options-dialog-header, - .mw-mmv-options-text-header { - color: @text; - } - - .mw-mmv-options-text-body { - color: @subtext0; - } - - .mw-ui-input:not(:disabled) { - background-color: @surface0; - color: @text; - border-color: @surface2; - } - - .mw-ui-button { - color: @mantle; - background-color: @accent-color; - border-color: @accent-color; - } - - .imbox-delete { - border-color: @red !important; - background-color: @surface0 !important; - } - - .imbox { - background-color: @overlay0 !important; - border-color: @peach !important; - } - - .talkheader-help { - background-color: @surface1 !important; - border-color: @green !important; - } - - .assess, - .assess-NA, - .navbox-subgroup { - background: @surface0 !important; - border-color: @surface1 !important; - } - - .documentation, - .documentation-container, - .documentation-metadata { - background-color: fade(@green, 15%) !important; - } - - .ambox, - .portalborder { - background-color: @surface1 !important; - border-color: @surface2 !important; - } - - .navbox-title { - color: @text !important; - } - - .mw-highlight pre { - background: @surface0 !important; - border-width: 0; - color: @text; - } - - .mw-content-ltr.mw-highlight-lines pre, - .mw-content-ltr.content .mw-highlight-lines pre { - box-shadow: inset 2.75em 0 0 @surface1; - } - - .mw-redirect when (@highlight-redirect = 1) { - color: @green !important; - } - - .mbox-text { - color: @text !important; - } - - .sidebar-above, - .p, - .o { - color: @text !important; - } - .ni, - .mw-templatedata-doc-muted { - color: @subtext1 !important; - } - .nv, - .nn { - color: @blue !important; - } - - .sidebar-above a span { - color: @text !important; - } - - .sidebar-title-with-pretitle span { - color: @text !important; - } - - .nt { - color: @green !important; - } - - .nl { - color: @teal !important; - } - - .ambox-style { - border-left-color: @yellow !important; - } - - .mw-parser-output .mainpage-frame { - background: @surface0 !important; - border-color: @surface0 !important; - } - - .mw-parser-output .mainpage-heading-title { - background: linear-gradient( - to right, - rgba(saturate(lighten(@accent-color, 4%), -3%), 0.4), - @surface0 - ) !important; - } - - .hidden-title { - background-color: @green !important; - color: @mantle !important; - } - - .mw-mmv-post-image, - .mw-mmv-options-dialog { - background-color: @base; - color: @text; - } - .mw-mmv-image-metadata { - background-color: @base; - border-color: @base; - } - - .mw-mmv-dialog-down-arrow { - background-color: @base !important; - } - - .oo-ui-tagItemWidget.oo-ui-widget-enabled { - color: @text; - background-color: @overlay0 !important; - border-color: @surface0; - } - - ol.references li:target { - background-color: @surface2; - } - - .mw-body-content .error { - color: @red; - } - - .divbox-gray, - .infobox-above { - background-color: @surface2 !important; - border-color: @overlay0 !important; - } - - .biota > * > tr > th { - background-color: @yellow !important; - color: @mantle !important; - } - - .cmbox { - background-color: @blue !important; - } - - .wikitable { - background-color: @surface0 !important; - color: @text !important; - border-color: @surface2 !important; - } - - .wikitable > * > tr > th { - background-color: @surface1 !important; - } - - .wikitable > * > tr > td, - .wikitable > * > tr > th { - background-color: @surface0 !important; - color: @text !important; - border-color: @surface2; - } - - .mw-searchresults-has-iw .iw-result__header a { - color: @text; - } - - .mw-search-result-data { - color: @subtext0; - } - - .navbox-abovebelow { - background-color: @overlay2 !important; - border-color: @overlay2 !important; - } - - .vector-feature-zebra-design-enabled - .vector-pinnable-element - .vector-menu-heading { - color: @text; - border-bottom-color: @surface0; - } - - .mwe-popups .mwe-popups-container { - background-color: @surface0; - } - - .vector-pinnable-header-toggle-button { - background-color: @surface0; - color: @text; - &:hover { - background-color: @base; - } - } - - .mw-parser-output .navbox-list { - border-color: @surface0; - } - - .pure-button-primary-progressive, - .pure-button-primary-progressive:hover { - background-color: @accent-color; - border-color: @accent-color; - } - - .suggestion-link { - border-bottom-color: @surface0; - } - - .cdx-menu, - .skin-vector .uls-menu, - .suggestiodns-dropdown, - .cdx-search-input--has-end-button, - .vector-sticky-header, - .vector-sticky-header-context-bar, - .mw-heading2 { - border-color: @surface2; - } - - .suggestion-link.active { - background-color: fade(@accent-color, 20%); - .suggestion-title { - color: @accent-color; - } - } - - .mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-highlighted, - .cdx-menu-item--enabled.cdx-menu-item--highlighted { - background-color: fade(@accent-color, 20%); - } - - .mw-echo-ui-sortedListWidget, - .mw-echo-ui-sortedListWidget-group, - .mw-echo-ui-subGroupListWidget-header { - border-color: @surface2; - } - - .mw-mmv-post-image, - .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive - .cdx-button__icon { - background-color: @crust; - } - - .cdx-text-input__input:enabled::placeholder, - .cdx-text-input__input:enabled ~ .cdx-text-input__icon-vue, - .skin-vector .uls-languagefilter, - .skin-vector .uls-lcd-region-title, - .suggestion-description, - .cdx-menu-item--enabled .cdx-menu-item__text__description, - .mw-number-text, - .boilerplate > div:nth-child(3) > span:nth-child(1), - .boilerplate > div:nth-child(4) > span:nth-child(2) { - color: @subtext0 !important; - } - - input:hover + .cdx-button.cdx-button--action-progressive { - background-color: fade(@accent-color, 12.5%); - } - - #pt-notifications-alert .mw-echo-unseen-notifications::after { - background-color: @red !important; - } - - #pt-notifications-notice .mw-echo-unseen-notifications::after { - background-color: @blue !important; - } - - a, - .mw-parser-output a.external:visited { - color: @accent-color; - &:visited { - color: @mauve; - } - } - - a.new, - .mw-parser-output .cs1-visible-error, - .vector-menu-tabs .mw-list-item.new a, - .mw-plusminus-neg { - color: @red; - } - - a.mw-selflink { - color: @text; - } - - #searchInput { - color: @text; - &:hover { - border-color: @surface2; - } - &:focus { - border-color: @accent-color; - } - } - - .pure-form input[type="search"] { - border-color: @surface2; - box-shadow: inset 0 0 0 1px @surface2; - } - - #pt-notifications-alert .mw-echo-notifications-badge::after, - #pt-notifications-notice .mw-echo-notifications-badge::after, - .mw-echo-notification-badge-nojs::after { - border-color: @crust; - background-color: @accent-color; - color: @base; - } - - h2 { - border-bottom-color: @surface2; - } - - .mw-footer { - border-top-color: @surface2; - } - - .bookshelf { - border-top-color: @surface0; - box-shadow: 0 -1px 0 @surface0; - } - - body.ns-talk .mw-parser-output .mp-toolbox, - .mw-parser-output .tmbox, - #talkheader { - border-color: fade(@yellow, 20%) !important; - background-color: fade(@yellow, 10%) !important; - } - - body.ns-talk .mw-parser-output .mp-toolbox-daily th { - border-color: fade(@yellow, 80%) !important; - background-color: fade(@yellow, 20%) !important; - } - - .fn.org { - color: @accent-color; - } - - .mw-parser-output .mp-toolbox-daily th, - .mw-parser-output td.mp-toolbox-tfl-not { - background: fade(@yellow, 20%) !important; - border-color: fade(@yellow, 20%) !important; - } - - body.ns-talk .mw-parser-output .mp-toolbox-daily { - border-color: fade(@yellow, 20%) !important; - background: none !important; - } - - .mw-parser-output tr + tr > .navbox-list, - .mw-parser-output tr + tr > .navbox-group { - border-top-color: @surface0; - } - - .ext-phonos-PhonosButton.oo-ui-buttonElement-frameless.oo-ui-buttonWidget - > .oo-ui-buttonElement-button:hover { - background-color: fade(@accent-color, 20%); - } - - .styled-select:hover { - background-color: @surface0; - } - - .lang-list-button, - .lang-list-button:hover { - background-color: @base; - border-color: @surface1; - outline-color: @base; - } - - .cdx-typeahead-search__search-footer__icon.cdx-icon { - color: @subtext0; - } - - .vector-toc - .vector-toc-level-1-active:not(.vector-toc-list-item-active) - > .vector-toc-link { - color: @text !important; - } - - .lang-list-active .lang-list-button { - background-color: @base; - border-color: @surface1; - outline-color: @base; - } - - .lang-list-button:focus { - box-shadow: inset 0 0 0 1px @accent-color; - } - - .lang-list-border { - background-color: @surface1; - } - - .infobox-header { - background-color: @surface1 !important; - color: @text !important; - } - - td[style*="background-color"], - td[style*="background-color"] * { - color: @crust !important; - } - - #toc-Services > a:nth-child(1) > div:nth-child(1) { - color: @text !important; - } - - .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive, - .vector-menu-tabs .mw-list-item a, - .vector-feature-zebra-design-enabled .vector-toc .vector-toc-link, - .mw-parser-output a.extiw, - .mw-parser-output a.external, - .mw-collapsible-toggle-default .mw-collapsible-text, - .vector-feature-zebra-design-enabled - .vector-pinnable-element - .mw-list-item - a, - .vector-feature-zebra-design-enabled - .vector-dropdown-content - .mw-list-item - a, - .vector-feature-zebra-design-enabled - .vector-pinnable-element - .mw-list-item - a:not(.mw-selflink):visited, - .vector-feature-zebra-design-enabled - .vector-dropdown-content - .mw-list-item - a:not(.mw-selflink):visited, - .uls-language-block a, - .lang-list-button, - .fancycaptcha-reload, - #pt-userpage-2 a:not(.mw-selflink), - .vector-pinnable-element .mw-list-item a, - .vector-pinnable-element .mw-list-item a:not(.mw-selflink):visited, - .vector-toc .vector-toc-link, - .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive - > .oo-ui-buttonElement-button, - .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive - > .oo-ui-buttonElement-button:hover, - .vector-dropdown-content .mw-list-item a, - .vector-dropdown-content .mw-list-item a:not(.mw-selflink):visited { - color: @accent-color; - } - - .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive, - .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive, - .mw-ui-button.mw-ui-progressive:not(:disabled), - .mw-ui-button.mw-ui-progressive:not(:disabled):hover { - background-color: @accent-color; - border-color: @accent-color; - color: @base; - } - - .mw-message-box-warning, - .boilerplate { - border-color: @accent-color !important; - background-color: fade(@accent-color, 25%) !important; - color: @text; - } - - .vector-feature-zebra-design-enabled .vector-sticky-pinned-container::after, - .vector-sticky-pinned-container::after { - background: none; - } - - .vector-feature-zebra-design-enabled .vector-pinnable-header-toggle-button { - background-color: @surface0; - color: @text; - &:hover { - background-color: @base; - } - } - - .vector-feature-zebra-design-enabled .vector-pinnable-header, - .vector-pinnable-header, - .vector-pinnable-element .vector-menu-heading { - border-bottom-color: @surface0; - } - - hr { - border-bottom-color: @surface2; - } - - .central-featured-lang strong:hover, - .link-box:hover, - .central-featured-lang :hover, - .other-project-link:hover, - .lang-list-container { - background-color: @surface0; - } - - .vector-page-toolbar-container { - box-shadow: 0 1px @surface1; - } - - .mw-parser-output .navbox-even { - background-color: @surface1; - } - - .vector-feature-zebra-design-enabled .vector-page-titlebar::after, - .mw-parser-output .wikipedia-languages-prettybars, - .vector-page-titlebar::after { - background-color: @surface2 !important; - } - - table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(2) { - background-color: fade(@accent-color, 20%) !important; - } - - .client-js .mw-content-ltr .mw-editsection-bracket:first-of-type, - .client-js .mw-content-ltr .mw-editsection-bracket:not(:first-of-type), - .mw-collapsible-toggle-default::before, - .mw-collapsible-toggle-default::after { - color: @subtext1; - } - - .infobox, - .mw-parser-output .navbox, - .catlinks, - .mw-parser-output #mp-topbanner, - .mw-parser-output .sidebar, - .fancycaptcha-captcha-container, - .fancycaptcha-captcha-and-reload, - .cdx-checkbox__icon, - .mw-message-box, - .uls-menu .uls-no-results-view .uls-no-found-more, - .client-js - .vector-below-page-title - .vector-page-titlebar-toc - > label:nth-child(2), - .mw-parser-output .ombox, - code, - .oo-ui-buttonElement-framed.oo-ui-widget-enabled - > .oo-ui-buttonElement-button, - .mw-mmv-label, - #page-secondary-actions > a, - .mw-parser-output .ambox, - td[class="sidebar-navbar"], - textarea, - .mw-parser-output .side-box { - background-color: @surface0 !important; - color: @text !important; - border-color: @surface2 !important; - } - - #pagehistory li.selected { - background-color: @surface0 !important; - color: @text !important; - border-color: @surface2 !important; - outline-color: @surface2 !important; - } - - .cdx-checkbox__icon { - border-color: @accent-color !important; - } - - .fancycaptcha-captcha-container .mw-ui-inputูˆ .mw-ui-input:not(:disabled) { - background-color: @base !important; - color: @text !important; - border-color: @surface1; - } - - .mw-ui-input:not(:disabled), - .mw-ui-button:not(:disabled) { - background-color: @base !important; - color: @text !important; - border-color: @surface1 !important; - } - - .mw-parser-output .module-shortcutboxplain { - background-color: @base !important; - color: @text !important; - border-color: @surface2; - } - - .sidebar-pretitle, - .sidebar-title-with-pretitle, - .sidebar-list-title { - background-color: fade(@accent-color, 20%) !important; - } - - .mw-parser-output #mp-bottom, - .mw-parser-output .sidebar-collapse .sidebar-below { - border-color: @surface2; - } - - .lang-list-content, - .bookshelf .text { - background-color: @surface0; - } - - .mw-parser-output #mp-bottom .mp-h2, - .uls-language-block > ul > li:hover { - background: @surface0; - border-color: @surface2; - } - - figure[typeof~="mw:File/Thumb"] { - background-color: @mantle !important; - color: @text !important; - border-top-color: @surface2; - border-left-color: @surface2; - border-right-color: @surface2; - > figcaption { - background-color: @mantle !important; - color: @text !important; - border-bottom-color: @surface2; - border-left-color: @surface2; - border-right-color: @surface2; - } - > :not(figcaption) .mw-file-element { - color: @surface2 !important; - border-color: @surface2; - } - } - - .mw-parser-output #mp-left, - .mw-parser-output #mp-left .mp-h2, - th[class="sidebar-title"] { - background-color: fade(@green, 10%) !important; - border-color: fade(@green, 20%) !important; - } - - .mw-plusminus-pos { - color: @green !important; - } - - .mw-parser-output #mp-right, - .mw-parser-output #mp-right .mp-h2 { - background-color: fade(@blue, 10%) !important; - border-color: fade(@blue, 20%) !important; - } - - .mw-parser-output #mp-lower, - .mw-parser-output #mp-lower .mp-h2 { - background-color: fade(@mauve, 10%) !important; - border-color: fade(@mauve, 20%) !important; - } - - .mw-collapsible-toggle-default:active .mw-collapsible-text { - color: @peach; - } - - .mw-parser-output #mp-middle, - .mw-parser-output #mp-middle .mp-h2 { - background-color: fade(@pink, 10%) !important; - border-color: fade(@pink, 20%) !important; - } - - .mw-parser-output .navbox-title, - .summary, - .infobox > tbody:nth-child(1) > tr:nth-child(4) > th:nth-child(1), - .infobox > tbody:nth-child(1) > tr:nth-child(6) > th:nth-child(1) { - background-color: fade(@accent-color, 20%) !important; - } - - .infobox > tbody:nth-child(1) > tr:nth-child(2) > td:nth-child(1) { - background-color: @surface1 !important; - } - - .mw-parser-output .navbox-group, - table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(3), - table.expanded:nth-child(2) - > tbody:nth-child(1) - > tr:nth-child(4) - > td:nth-child(2) - > table:nth-child(2) - > tbody:nth-child(1) - > tr:nth-child(1), - table.expanded:nth-child(2) > tbody:nth-child(1) > tr:nth-child(1), - table.nowraplinks:nth-child(1) - > tbody:nth-child(1) - > tr:nth-child(3) - > td:nth-child(1) - > table:nth-child(2) - > tbody:nth-child(1) - > tr:nth-child(1), - table.nowraplinks:nth-child(1) - > tbody:nth-child(1) - > tr:nth-child(4) - > td:nth-child(1) - > table:nth-child(2) - > tbody:nth-child(1) - > tr:nth-child(1), - table.nowraplinks:nth-child(1) - > tbody:nth-child(1) - > tr:nth-child(5) - > td:nth-child(1) - > table:nth-child(2) - > tbody:nth-child(1) - > tr:nth-child(1), - .navbox-abovebelow { - background-color: @surface1 !important; - } - - .mw-parser-output .tracklist > tbody { - color: inherit; - - > .tracklist-total-length * { - background-color: @overlay1; - color: @base; - } - } - - .mw-content-ltr - > table:nth-child(20) - > tbody:nth-child(1) - > tr:nth-child(2) - > td:nth-child(2) { - border-color: @surface2 !important; - background-color: @surface0 !important; - } - - .noarticletext, - #noarticletext { - background-color: @base !important; - } - - #sisterproject { - background-color: @mantle !important; - } - - [style="color:#02a64f;line-height:initial"] { - color: @green !important; - } - - [style="color:#f78e1e;line-height:initial"] { - color: @peach !important; - } - - [style="color:#77278b;line-height:initial"] { - color: @mauve !important; - } - - [style="color:#87746a;line-height:initial"] { - color: @maroon !important; - } - - [style="color:#009aC8;line-height:initial"] { - color: @sky !important; - } - - [style="color:#ffd520;line-height:initial"] { - color: @yellow !important; - } - - [style="color:#0060a9;line-height:initial"] { - color: @blue !important; - } - - table.nowraplinks:nth-child(4) > tbody:nth-child(1) > tr:nth-child(1), - .navbox-list-with-group.navbox-list.navbox-odd { - background-color: @surface0 !important; - } - - .mw-parser-output tr + tr > .navbox-abovebelow { - border-color: @base; - } - - .catlinks li { - border-left-color: @surface2; - } - - /* Fundraising banner */ - .frb-btn, - .frb-label { - color: @text; - background-color: @base; - border-color: @overlay0; - } - - input[type="radio"]:checked + .frb-btn, - input[type="radio"]:checked + .frb-label, - .frb-btn:hover, - .frb-label:hover { - color: @base; - background-color: @accent-color; - border-color: @accent-color; - } - - #frb-main { - --wmui-base100: @base; - --wmui-base0: @text; - --frb-body: @text; - --frb-muted: @subtext0; - --frb-link: @subtext0; - --frb-link-hover: @text; - --frb-error: @red; - --frb-submit: @accent-color; - --frb-submit-hover: darken(@accent-color, 10%); - - svg.frb-message-icon > g { - circle { - fill: @yellow; - } - path { - fill: @base; - } - } - - .frb-message { - background-color: @green; - border-color: @green; - } - - .frb-message::after { - border-left-color: @green; - } - } - - #frb-inline { - --wmui-base100: @base; - --frb-primary: @red; - --frb-link: @accent-color; - --frb-muted: @subtext0; - --frb-muted-hover: @text; - --frb-body: @text; - --frb-error: @red; - --wmui-red-dark: @red; - --wmui-red-light: @red; - --wmui-green-dark: @green; - --wmui-green-light: @green; - --frb-submit: @accent-color; - --frb-submit-hover: darken(@accent-color, 10%); - - .frb-inline-topbar { - color: @text; - - svg circle { - fill: @yellow; - } - - svg path { - fill: @base; - } - } - - .frb-btn-cta { - background-color: @accent-color !important; - border-color: @accent-color !important; - color: @base !important; - } - - .frb-btn-simple { - color: @accent-color !important; - } - - .frb-monthly-pitch { - color: @blue; - } - - .frb-optin-no-prompt { - color: @base; - } - - .frb-cta-hiddenmessage { - background-color: @red; - color: @base; - } - } - - #frb-nag { - --frb-primary-light: @base; - --frb-body: @text; - --wmui-accent-dark: @subtext0; - --frb-link-hover: @text; - - span.frb-donate-button { - color: @base; - background-color: @red; - - &:hover { - color: @base; - background-color: darken(@red, 10%); - } - } - - svg.frb-icon-close > g { - stroke: @subtext0; - - &:hover { - stroke: @text; - } - } - } - - .frb-nag:not(#frb-nag) { - --frb-message-background: @base; - --frb-message-border: @red; - --frb-message: @text; - border-color: @surface0; - background: @base; - box-shadow: none; - - #nag-rml-btn { - background-color: transparent; - border-color: transparent; - color: @subtext0; - } - - #nag-yes-btn { - background-color: @accent-color; - border-color: @accent-color; - color: @base; - } - } - - .frb-btn-cta-label::after { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - .frb-back { - @svg-raw: ''; - @svg: escape(@svg-raw); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - .frb-close { - @svg-raw: ''; - @svg: escape(@svg-raw); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - .sprite { - @svg: escape( - '' - ); - background-image: linear-gradient(transparent, transparent), - url("data:image/svg+xml,@{svg}"); - } - - .mw-logo-wordmark { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - .mw-logo-tagline { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-menu { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-ellipsis { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-appearance { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - .vector-feature-zebra-design-enabled - .vector-dropdown - .vector-dropdown-label:not(.cdx-button--icon-only)::after, - .vector-icon.mw-ui-icon-wikimedia-expand { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - .cdx-checkbox__input:checked:not(:indeterminate) - + .cdx-checkbox__icon::before { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - .vector-page-titlebar - .mw-portlet-lang - .vector-dropdown-label.cdx-button--action-progressive.cdx-button--weight-quiet::after { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - .vector-dropdown .vector-dropdown-label:not(.cdx-button--icon-only)::after { - @svg: escape( - '' - ); - background: url("data:image/svg+xml,@{svg}") !important; - } - - .vector-icon.mw-ui-icon-wikimedia-language-progressive { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - .vector-icon.mw-ui-icon-wikimedia-language { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - .mw-parser-output a.external { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - .plainlinks a.external { - background: none !important; - } - - #mw-indicator-mw-helplink a { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - [alt="Edit this at Wikidata"] { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}") !important; - } - - .cdx-search-input .cdx-text-input__icon.cdx-text-input__start-icon { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - .vector-icon.mw-ui-icon-wikimedia-listBullet { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}") !important; - } - - ul { - @svg: escape( - '' - ); - list-style-image: url("data:image/svg+xml,@{svg}"); - } - - .oo-ui-icon-volumeUp, - .mw-ui-icon-volumeUp::before { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-fullScreen { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .fancycaptcha-reload { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .popups-icon--settings { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-userAvatar { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-watchlist { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-tray { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-bell { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-user-menu-logged-in .vector-dropdown-label::after { - @svg: escape( - '' - ); - background: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-star { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-userTalk { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-sandbox { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-settings { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-unStar { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .oo-ui-image-progressive.oo-ui-icon-settings { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .oo-ui-icon-bell { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .oo-ui-icon-next { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .oo-ui-icon-settings { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .oo-ui-icon-expand { - @svg: escape( - ' expand ' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .oo-ui-icon-tray { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-labFlask { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .mw-ui-icon-vector-gadget-pt-darkmode { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .client-dark-mode .mw-ui-icon-vector-gadget-pt-darkmode { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-userContributions { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-logOut { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .uls-search-label, - .vector-icon.mw-ui-icon-wikimedia-search { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .mw-ui-icon-vector-gadget-pt-darkmode-sticky-header { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .cdx-message .cdx-message__icon { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-edit { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-history { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-speechBubbles { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .vector-icon.mw-ui-icon-wikimedia-editLock { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .branding-box > a:nth-child(1) > span:nth-child(1) > img:nth-child(1) { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/wikipedia/catppuccin.user.less b/styles/wikipedia/catppuccin.user.less new file mode 100644 index 0000000000..6e4aa51004 --- /dev/null +++ b/styles/wikipedia/catppuccin.user.less @@ -0,0 +1,796 @@ +/* ==UserStyle== +@name Wikipedia Catppuccin +@namespace github.com/catppuccin/userstyles/styles/wikipedia +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/wikipedia +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/wikipedia/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awikipedia +@description Soothing pastel theme for Wikipedia +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +@var checkbox highlight-redirect "Highlight redirect links" 0 +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("wikipedia.org"), + domain("wiktionary.org"), + domain("www.mediawiki.org"), + domain("auth.wikimedia.org"), + domain("wikiversity.org"), + domain("wikisource.org"), + domain("meta.wikimedia.org"), + domain("wikidata.org"), + domain("wikibooks.org"), + domain("species.wikimedia.org"), + domain("commons.wikimedia.org"), + domain("wikivoyage.org"), + domain("wikinews.org"), + domain("wikiquote.org") { + @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); + + :root.skin-theme-clientpref-os, + .vector-feature-night-mode-enabled, + .skin-invert, + .notheme { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + :root.skin-theme-clientpref-night { + #catppuccin(@darkFlavor); + } + + :root.skin-theme-clientpref-day { + #catppuccin(@lightFlavor); + } + + html.skin-theme-clientpref-night, html.skin-theme-clientpref-os { + /* Logo */ + .skin-invert-image img, + .skin-invert, + .oo-ui-iconElement-icon:not( + .oo-ui-image-progressive, + .oo-ui-image-destructive, + .oo-ui-checkboxInputWidget-checkIcon, + .oo-ui-image-invert, + .mw-no-invert + ), + .oo-ui-indicatorElement-indicator { + filter: none; + } + } + + /* MediaWiki only applies the following overrides on dark and automatic appearance settings, leaving broken elements with the light appearance. */ + + .hatnote:not(.notheme), + .dablink:not(.notheme), + .rellink:not(.notheme), + .infobox:not(.notheme) { + color: var(--color-base) !important; + background-color: var(--background-color-interactive-subtle) !important; + } + .infobox td:not(.notheme), + .infobox th:not(.notheme), + .infobox-above:not(.notheme), + .infobox p:not(.notheme), + .infobox > div:not(.notheme), + .infobox caption:not(.notheme), + .infobox--frwiki td:not(.notheme), + .infobox--frwiki th:not(.notheme), + .infobox--frwiki p:not(.notheme), + .infobox--frwiki > div:not(.notheme), + .infobox--frwiki caption:not(.notheme), + .sinottico th:not(.notheme), + .infobox-header:not(.notheme), + .skin-nightmode-reset-color:not(.notheme), + .navigation-box:not(.notheme), + .metadata:not(.notheme), + .quotebox:not(.notheme), + .side-box:not(.notheme), + .side-box div:not(.notheme), + .navbox:not(.notheme), + .navbox-subgroup:not(.notheme), + .navbox-group:not(.notheme), + .navbox-even:not(.notheme), + .navbox-abovebelow:not(.notheme), + .navbox-title:not(.notheme) { + background: inherit !important; + color: inherit !important; + border-color: var(--border-color-subtle) !important; + } + .ns-100 .mw-parser-output :not(.notheme, a) { + background: inherit !important; + color: inherit !important; + border-color: var(--border-color-subtle) !important; + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --color-base: @text; + --color-base--hover: @text; + --color-emphasized: @text; + --color-subtle: @subtext0; + --color-inverted: @crust; + --color-inverted-fixed: @crust; + --color-progressive: @accent; + --color-progressive--hover: darken(@accent, 5%); + --color-progressive--active: darken(@accent, 5%); + --color-progressive--focus: darken(@accent, 5%); + --color-destructive: @red; + --color-destructive--hover: @maroon; + --color-destructive--active: @maroon; + --color-visited: @lavender; + --color-destructive--visited: #b97876; + --color-error: @red; + --color-warning: @yellow; + --color-success: @green; + --color-notice: @text; + --color-icon-error: @red; + --color-icon-warning: @yellow; + --color-icon-success: @green; + --color-icon-notice: @subtext0; + --color-content-added: @green; + --color-content-removed: @maroon; + --color-placeholder: @subtext0; + --color-disabled: @overlay2; + --box-shadow-color-base: #fff; + --box-shadow-color-inverted: #000; + --box-shadow-color-progressive--focus: @accent; + --background-color-interactive: @surface0; + --background-color-interactive-subtle: @surface0; + --background-color-interactive-subtle--hover: @surface1; + --background-color-disabled: @overlay2; + --background-color-disabled-subtle: @surface0; + --background-color-progressive: @accent; + --background-color-progressive-subtle: fade(@accent, 10%); + --background-color-destructive-subtle: #421211; + --background-color-progressive--active: fade(@accent, 70%); + --background-color-progressive--hover: fade(@accent, 70%); + --background-color-progressive--focus: fade(@accent, 70%); + --background-color-error: @red; + --background-color-error--hover: @maroon; + --background-color-error--active: @maroon; + --background-color-error-subtle: fade(@red, 20%); + --background-color-warning-subtle: fade(@yellow, 20%); + --background-color-success-subtle: fade(@green, 20%); + --background-color-notice-subtle: @surface0; + --background-color-content-added: #2a4b8d; + --background-color-content-removed: #a66200; + --background-color-backdrop-light: rgba(0, 0, 0, 0.65); + --background-color-backdrop-dark: rgba(255, 255, 255, 0.65); + --background-color-base: @base; + --background-color-neutral: @base; + --background-color-neutral-subtle: @surface0; + --background-color-inverted: @text; + --background-color-input-binary--checked: @accent; + --border-base: 1px solid @surface0; + --border-subtle: 1px solid @surface0; + --border-color-base: @surface0; + --border-color-interactive: @surface2; + --border-color-interactive--hover: @overlay0; + --border-color-disabled: #54595d; + --border-color-subtle: @surface1; + --border-color-muted: @surface0; + --border-color-inverted: #101418; + --border-color-error: @red; + --border-color-error--hover: @maroon; + --border-color-warning: @yellow; + --border-color-success: @green; + --border-color-notice: @surface2; + --border-color-content-added: @blue; + --border-color-content-removed: @peach; + --border-color-progressive: @accent; + --border-color-progressive--active: @accent; + --border-color-progressive--hover: @accent; + --border-color-progressive--focus: @accent; + + /* Wiktionary */ + --wikt-palette-indigo: @lavender; + --wikt-palette-lightindigo: fade(@lavender, 40%); + --wikt-palette-lighterblue: fade(@blue, 20%); + --wikt-palette-dulllightblue: fade(@blue, 40%); + --wikt-palette-grey: @subtext0; + --wikt-palette-lightergrey: fade(@subtext0, 40%); + + /* Other */ + + .infobox { + border-color: @surface2; + } + + [style="color:white;"], [style*="color:#ffffff"] { + color: @text !important; + } + .mw-collapsible-toggle-default { + &::before, &::after { + color: @subtext0; + } + } + + a { + &:focus { + outline-color: @accent; + } + } + + .mw-parser-output { + a.external { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + /* Wikipedia Home */ + #mp-topbanner { + background-color: @base; + border-color: @surface1; + } + #mp-left { + background-color: fade(@green, 20%); + border-color: @green; + + .mp-h2 { + background-color: fade(@green, 40%); + border-color: fade(@green, 40%); + } + } + #mp-right { + background-color: fade(@blue, 20%); + border-color: @blue; + + .mp-h2 { + background-color: fade(@blue, 40%); + border-color: fade(@blue, 40%); + } + } + #mp-lower { + background-color: fade(@lavender, 20%); + border-color: @lavender; + + .mp-h2 { + background-color: fade(@lavender, 40%); + border-color: fade(@lavender, 40%); + } + } + #mp-bottom { + border-color: @overlay0; + + .mp-h2 { + background-color: fade(@accent, 40%); + border-color: fade(@accent, 40%); + } + } + .wikipedia-languages-prettybars { + background-color: @surface2; + } + + /* MediaWiki Home */ + .mainpage_box { + border-color: @surface2; + + .header_icon { + filter: @text-filter; + } + + .items { + border-top-color: @surface1; + } + } + .nmbox { + background-color: @surface0; + border-color: @surface2; + + .nmbox-header { + background-color: @base; + border-color: @surface1; + } + } + /* MediaWiki Pages */ + .tpl-downloadmediawiki-icon { + filter: @crust-filter; + } + .note-info { + filter: @blue-filter; + color: @text; + background-color: fade(@blue, 20%); + } + .note-warn { + filter: @yellow-filter; + color: @text; + background-color: fade(@yellow, 20%); + } + } + + /* Math equations */ + .mwe-math-element img.skin-invert { + filter: @text-filter; + } + + /* OOUI */ + .oo-ui-indicator-down { + filter: @text-filter !important; + } + .oo-ui-image-invert.oo-ui-icon-check, .mw-ui-icon-check-invert::before { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + /* View source */ + textarea { + background-color: @mantle; + color: @text; + } + + /* View history */ + .flaggedrevs-color-1 { + background-color: fade(@blue, 10%); + } + + /* Language search and settings */ + .uls-search, + .uls-filtersuggestion, + .uls-lcd, + #uls-settings-block.uls-settings-block--vector-2022.uls-settings-block--with-add-languages, + #language-settings-dialog, + #languagesettings-settings-panel, + .uls-language-settings-close-block { + background-color: @mantle; + } + .uls-language-block a { + color: @accent; + } + .uls-search-label, + #uls-settings-block.uls-settings-block--vector-2022 + > button.uls-add-languages-button, + #uls-settings-block.uls-settings-block--vector-2022 + > button.uls-language-settings-button, + #uls-settings-block.uls-settings-block--vector-2022 + > button.uls-language-settings-button:hover, + .uls-icon-close, + .uls-languagefilter-clear { + filter: @text-filter; + } + .uls-sub-panel, .language-settings-buttons { + border-color: @surface1; + } + .uls-language-block > ul > li:hover { + background-color: @surface0; + } + .languagesettings-menu .menu-section.active { + background-color: @surface1; + } + + /* Page preview */ + .mwe-popups .mwe-popups-extract[dir="ltr"]::after { + background-image: linear-gradient(to right, transparent, @base 50%); + } + .mwe-popups .mwe-popups-extract[dir="rtl"]::after { + background-image: linear-gradient(to left, transparent, @base 50%); + } + + /* Icons */ + + img[alt="Edit this on Wikidata"], + img[alt="Edit this at Wikidata"] { + filter: @accent-filter; + } + + /* Logos */ + + .mw-logo-wordmark[alt="Wikipedia"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + + + .mw-logo-tagline { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } + + .mw-logo-icon { + &[src$="wikidatawiki.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &[src$="commonswiki.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &[src$="wikivoyage.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &[src$="wikiquote.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &[src$="wikiversity.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &[src$="mediawikiwiki.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } + + .mw-logo-wordmark { + &[alt="Wikidata"], + &[alt="Wikimedia Commons"] { + filter: @text-filter; + } + &[alt="Wikivoyage"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &[alt="Wikinews"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &[alt="Wikiquote"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &[alt="Wikiversity"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + &[alt="MediaWiki"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } + + .vector-page-titlebar + .mw-portlet-lang + .vector-dropdown-label.cdx-button--action-progressive.cdx-button--weight-quiet::after { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + filter: none; + } + + .vector-icon { + filter: none !important; + + &.mw-ui-icon-wikimedia-menu { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-ellipsis { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-appearance { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-expand { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + &.mw-ui-icon-wikimedia-language-progressive { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + &.mw-ui-icon-wikimedia-language { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + &.mw-ui-icon-wikimedia-listBullet { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}") !important; + } + + &.mw-ui-icon-wikimedia-fullScreen { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-userAvatar { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-watchlist { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-tray { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-bell { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-star { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-userTalk { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-sandbox { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-settings { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-unStar { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-labFlask { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-userContributions { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-logOut { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-search { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-edit { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-history { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-speechBubbles { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + &.mw-ui-icon-wikimedia-editLock { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + } + } + + /* Root */ + :root:has(.central-featured) { + #catppuccin(@lightFlavor); + + &, body { + color: @text; + background-color: @base; + + .svg-Wikipedia_wordmark { + filter: @text-filter; + } + + .central-featured-lang small, + .other-project-tagline, + .site-license, + .footer-sidebar-text { + color: @subtext1; + } + + .central-featured-lang :hover { + background-color: @surface1; + } + + .other-project-link:hover { + background-color: @surface1; + } + + .search-container { + #searchInput { + color: @text; + background-color: @mantle; + border-color: @overlay2; + box-shadow: none; + + &:focus { + border-color: @accent; + } + } + + .js-langpicker-label { + color: @subtext0; + } + .styled-select:hover { + background-color: @surface1; + } + .sprite.svg-arrow-down { + filter: @text-filter; + } + + button[type="submit"] { + background-color: @accent; + border-color: @accent; + + .svg-search-icon { + filter: @crust-filter; + } + } + + .suggestions-dropdown { + background-color: @mantle; + border-color: @overlay2; + + .suggestion-link { + border-bottom-color: @overlay0; + + &.active { + background-color: fade(@accent, 10%); + } + + .suggestion-thumbnail { + @svg: escape( + '', + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .suggestion-title { + color: @text; + } + } + } + } + + hr { + border-bottom-color: @surface1; + } + + .lang-list-border { + background-color: @surface2; + } + .lang-list-button { + background-color: @mantle; + color: @accent; + outline-color: @mantle; + border-color: @surface2; + + .svg-language-icon, + .svg-arrow-down-blue { + filter: @accent-filter; + } + + &:focus { + box-shadow: inset 0 0 0 1px @accent; + } + } + .lang-list-container { + background-color: @surface0; + + .bookshelf { + border-top-color: @overlay1; + box-shadow: none; + + .text { + color: @text; + background-color: @surface2; + } + } + } + } + } +} diff --git a/styles/wikipedia/preview.webp b/styles/wikipedia/preview.webp deleted file mode 100644 index 05cdf89dc7..0000000000 --- a/styles/wikipedia/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:502f72844f21208ca004414747a9e1ea0330d936937ca2b493d08168bd449d87 -size 486506 diff --git a/styles/wikiwand/README.md b/styles/wikiwand/README.md index d34e84ca99..125f922606 100644 --- a/styles/wikiwand/README.md +++ b/styles/wikiwand/README.md @@ -10,13 +10,12 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). ## ๐Ÿ’ Current Maintainer diff --git a/styles/wikiwand/catppuccin.user.css b/styles/wikiwand/catppuccin.user.css deleted file mode 100644 index ee9f3e7f2e..0000000000 --- a/styles/wikiwand/catppuccin.user.css +++ /dev/null @@ -1,152 +0,0 @@ -/* ==UserStyle== -@name Wikiwand Catppuccin -@namespace github.com/catppuccin/userstyles/styles/wikiwand -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/wikiwand -@version 2.0.0 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/wikiwand/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awikiwand -@description Soothing pastel theme for Wikiwand -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain("wikiwand.com") { - @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); - - .theme-system, - .theme-light, - .theme-desert, - .theme-calmness { - #catppuccin(@lightFlavor, @accentColor); - } - .theme-system, - .theme-dark, - .theme-black, - .theme-deepOcean, - .theme-nature { - #catppuccin(@darkFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - --ctp-rosewater: @rosewater; - --ctp-flamingo: @flamingo; - --ctp-pink: @pink; - --ctp-mauve: @mauve; - --ctp-red: @red; - --ctp-maroon: @maroon; - --ctp-peach: @peach; - --ctp-yellow: @yellow; - --ctp-green: @green; - --ctp-teal: @teal; - --ctp-sky: @sky; - --ctp-sapphire: @sapphire; - --ctp-blue: @blue; - --ctp-lavender: @lavender; - --ctp-text: @text; - --ctp-subtext1: @subtext1; - --ctp-subtext0: @subtext0; - --ctp-overlay2: @overlay2; - --ctp-overlay1: @overlay1; - --ctp-overlay0: @overlay0; - --ctp-surface2: @surface2; - --ctp-surface1: @surface1; - --ctp-surface0: @surface0; - --ctp-base: @base; - --ctp-mantle: @mantle; - --ctp-crust: @crust; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - --color-bg: @base !important; - --color-text: @text !important; - --color-grey: @subtext1 !important; - --color-accent: @accent-color !important; - --color-highlight: @surface2 !important; - --color-ash: @surface2 !important; - --color-border: @surface2 !important; - --color-blue-bg: @surface1 !important; - --color-blue-text: @blue !important; - --color-purple-bg: @surface1 !important; - --color-purple-text: @mauve !important; - --color-green-bg: @surface1 !important; - --color-green-text: @green !important; - --color-orange-bg: @surface1 !important; - --color-orange-text: @peach !important; - --color-table: @surface0 !important; - --color-link: @accent-color !important; - --color-score-A: @green !important; - --color-score-B: @mauve !important; - --color-score-C: @peach !important; - --color-score-F: @red !important; - --color-score-NA: var(--color-grey) !important; - --grad: linear-gradient(-45deg, @peach, @blue, @pink, @yellow) !important; - --box-shadow: 0px 1px 4px 1px @crust !important; - --box-shadow-dark: 0px 0px 1px 1px @crust, 0px 1px 5px 2px @crust !important; - --box-shadow-strong: 0px 1px 5px 2px @crust !important; - --backdrop-bg: @base !important; - --backdrop-bg-ash: fade(@surface1, 50%) !important; - - .mw-no-invert * { - color: @crust !important; - } - - .notheme * { - --color-text: auto; - --color-link: auto; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/wikiwand/catppuccin.user.less b/styles/wikiwand/catppuccin.user.less new file mode 100644 index 0000000000..960ecdc86b --- /dev/null +++ b/styles/wikiwand/catppuccin.user.less @@ -0,0 +1,88 @@ +/* ==UserStyle== +@name Wikiwand Catppuccin +@namespace github.com/catppuccin/userstyles/styles/wikiwand +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/wikiwand +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/wikiwand/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Awikiwand +@description Soothing pastel theme for Wikiwand +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("wikiwand.com") { + @import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css"); + + .theme-system { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + .theme-light, + .theme-desert, + .theme-calmness { + #catppuccin(@lightFlavor); + } + .theme-dark, + .theme-black, + .theme-deepOcean, + .theme-nature { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + #lib.css-variables(); + + --color-bg: @base !important; + --color-text: @text !important; + --color-grey: @subtext1 !important; + --color-accent: @accent !important; + --color-highlight: @surface2 !important; + --color-ash: @surface2 !important; + --color-border: @surface2 !important; + --color-blue-bg: @surface1 !important; + --color-blue-text: @blue !important; + --color-purple-bg: @surface1 !important; + --color-purple-text: @mauve !important; + --color-green-bg: @surface1 !important; + --color-green-text: @green !important; + --color-orange-bg: @surface1 !important; + --color-orange-text: @peach !important; + --color-table: @surface0 !important; + --color-link: @accent !important; + --color-score-A: @green !important; + --color-score-B: @mauve !important; + --color-score-C: @peach !important; + --color-score-F: @red !important; + --color-score-NA: var(--color-grey) !important; + --grad: linear-gradient(-45deg, @peach, @blue, @pink, @yellow) !important; + --box-shadow: 0px 1px 4px 1px @crust !important; + --box-shadow-dark: + 0px 0px 1px 1px @crust, 0px 1px 5px 2px @crust !important; + --box-shadow-strong: 0px 1px 5px 2px @crust !important; + --backdrop-bg: @base !important; + --backdrop-bg-ash: fade(@surface1, 50%) !important; + + .mw-no-invert * { + color: @crust !important; + } + + .notheme * { + --color-text: auto; + --color-link: auto; + } + } +} diff --git a/styles/wikiwand/preview.webp b/styles/wikiwand/preview.webp deleted file mode 100644 index f2e3f94875..0000000000 --- a/styles/wikiwand/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:9db82b5e08a75dc83f4c1c7a64e383e281150f0f1dc3925678e7b9aefd889a24 -size 1079808 diff --git a/styles/youtube/README.md b/styles/youtube/README.md index 6892c82d70..1850891aaa 100644 --- a/styles/youtube/README.md +++ b/styles/youtube/README.md @@ -10,24 +10,20 @@

- +

-

- -

+## Usage +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). -## ๐Ÿ™‹ FAQ -- Q: **What does the 'Enable for black bars' option mean?**\ - A: It's available in case you have an OLED display. If you have one, you might want to enable this. ## ๐Ÿ’ Current Maintainers -- [Isabel](https://github.com/isabelroses) +- [isabelroses](https://github.com/isabelroses) - [uncenter](https://github.com/uncenter) ## ๐Ÿ’– Past Maintainer -- [Elkrien](https://github.com/elkrien) +- [elkrien](https://github.com/elkrien)   diff --git a/styles/youtube/catppuccin.user.css b/styles/youtube/catppuccin.user.css deleted file mode 100644 index 684594559f..0000000000 --- a/styles/youtube/catppuccin.user.css +++ /dev/null @@ -1,1376 +0,0 @@ -/* ==UserStyle== -@name YouTube Catppuccin -@namespace github.com/catppuccin/userstyles/styles/youtube -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/youtube -@version 4.2.5 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/youtube/catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ayoutube -@description Soothing pastel theme for YouTube -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] - -@var checkbox logo "Enable YouTube logo" 1 -@var checkbox oled "Enable black bars" 0 -==/UserStyle== */ - -@-moz-document domain('youtube.com') { - :root[dark] { - #catppuccin(@darkFlavor, @accentColor); - } - :root:not([dark]) { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - @text-filter: @catppuccin[@@lookup][@text_filter]; - - @white: if(@lookup = latte, @base, @text); - @black: if(@lookup = latte, @text, @base); - - color: @text; - background: @base !important; - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - &, - [dark], - [system-icons], - [darker-dark-theme], - &[dark], - &[system-icons], - &[darker-dark-theme] { - --yt-spec-white-1: @text !important; - --yt-spec-white-2: @subtext0 !important; - --yt-spec-white-3: @subtext1 !important; - --yt-spec-white-4: darken(@subtext1, 5%) !important; - --yt-spec-black-1: @overlay1 !important; - --yt-spec-black-2: @overlay0 !important; - --yt-spec-black-3: @surface2 !important; - --yt-spec-black-4: @surface1 !important; - --yt-spec-black-pure: @surface0 !important; - --yt-spec-grey-1: @text !important; - --yt-spec-grey-2: @subtext0 !important; - --yt-spec-grey-3: @subtext1 !important; - --yt-spec-grey-4: @overlay2 !important; - --yt-spec-grey-5: @overlay1 !important; - --yt-brand-youtube-red: @accent-color !important; - --yt-brand-medium-red: @accent-color !important; - --yt-brand-light-red: @accent-color !important; - --yt-spec-red-30: @peach !important; - --yt-spec-red-70: @red !important; - --yt-spec-pale-blue: @sky !important; - --yt-spec-light-blue: @sky !important; - --yt-spec-dark-blue: @sapphire !important; - --yt-spec-navy-blue: @teal !important; - --yt-spec-light-green: @green !important; - --yt-spec-dark-green: @green !important; - --yt-spec-yellow: @peach !important; - --yt-spec-black-pure-alpha-5: @subtext0 !important; - --yt-spec-black-pure-alpha-10: @overlay2 !important; - --yt-spec-black-pure-alpha-15: fadeout(@crust, 0.15) !important; - --yt-spec-black-pure-alpha-30: fadeout(@crust, 0.3) !important; - --yt-spec-black-pure-alpha-60: fadeout(@crust, 0.6) !important; - --yt-spec-black-pure-alpha-80: fadeout(@crust, 0.8) !important; - --yt-spec-black-1-alpha-98: fadeout(@crust, 0.98) !important; - --yt-spec-black-1-alpha-95: fadeout(@crust, 0.95) !important; - --yt-spec-white-1-alpha-10: fadeout(@text, 0.1) !important; - --yt-spec-white-1-alpha-20: fadeout(@text, 0.2) !important; - --yt-spec-white-1-alpha-25: fadeout(@text, 0.25) !important; - --yt-spec-white-1-alpha-30: fadeout(@text, 0.3) !important; - --yt-spec-white-1-alpha-70: fadeout(@text, 0.7) !important; - --yt-spec-white-1-alpha-95: fadeout(@text, 0.95) !important; - --yt-spec-white-1-alpha-98: fadeout(@text, 0.98) !important; - --yt-brand-medium-red-alpha-90: fadeout(@accent-color, 0.9) !important; - --yt-brand-medium-red-alpha-30: fadeout(@accent-color, 0.3) !important; - --yt-brand-light-red-alpha-30: fadeout(@accent-color, 0.3) !important; - --yt-spec-light-blue-alpha-30: fadeout(@sapphire, 0.3) !important; - --yt-spec-dark-blue-alpha-30: fadeout(@sapphire, 0.3) !important; - - --yt-spec-base-background: @base !important; - --yt-spec-raised-background: @surface0 !important; - --yt-spec-menu-background: @mantle !important; - --yt-spec-inverted-background: @text !important; - --yt-spec-additive-background: fadeout(@surface1, 0.1) !important; - --yt-spec-outline: @surface0 !important; - --yt-spec-shadow: fadeout(@crust, 0.25) !important; - --yt-spec-text-primary: @text !important; - --yt-spec-text-secondary: @subtext0 !important; - --yt-spec-text-disabled: @subtext1 !important; - --yt-spec-text-primary-inverse: @crust !important; - --yt-spec-call-to-action: @accent-color !important; - --yt-spec-call-to-action-inverse: @accent-color !important; - --yt-spec-suggested-action: fadeout(@accent-color, 80%) !important; - --yt-spec-suggested-action-inverse: @text !important; - --yt-spec-icon-active-other: @text !important; - --yt-spec-button-chip-background-hover: @surface1 !important; - --yt-spec-touch-response: @surface0 !important; - - --yt-spec-touch-response-inverse: @accent-color !important; - --yt-spec-brand-icon-active: @accent-color !important; - --yt-spec-brand-button-background: @accent-color !important; - --yt-spec-brand-link-text: @sapphire !important; - --yt-spec-wordmark-text: @text !important; - --yt-spec-error-indicator: @red !important; - --yt-spec-themed-blue: @accent-color !important; - --yt-spec-themed-green: @green !important; - --yt-spec-ad-indicator: @teal !important; - --yt-spec-themed-overlay-background: fadeout(@crust, 0.8) !important; - --yt-spec-commerce-badge-background: @green !important; - --yt-spec-static-brand-red: @accent-color !important; - --yt-spec-static-brand-white: @text !important; - --yt-spec-static-brand-black: @base !important; - --yt-spec-static-clear-color: fadeout(@crust, 0) !important; - --yt-spec-static-clear-black: fadeout(@crust, 0) !important; - --yt-spec-static-ad-yellow: @peach !important; - --yt-spec-static-grey: @subtext0 !important; - --yt-spec-static-overlay-background-solid: @crust !important; - --yt-spec-static-overlay-background-heavy: @crust; - --yt-spec-static-overlay-background-medium: fade(@crust, 50%) !important; - --yt-spec-static-overlay-background-medium-light: fadeout( - @crust, - 0.3 - ) !important; - --yt-spec-static-overlay-background-light: fadeout( - @crust, - 0.1 - ) !important; - --yt-spec-static-overlay-text-primary: @text !important; - --yt-spec-static-overlay-text-secondary: fadeout( - @subtext0, - 0.7 - ) !important; - --yt-spec-static-overlay-text-disabled: fadeout( - @subtext0, - 0.3 - ) !important; - --yt-spec-static-overlay-call-to-action: @accent-color !important; - --yt-spec-static-overlay-icon-active-other: @text !important; - --yt-spec-static-overlay-icon-inactive: @surface1 !important; - --yt-spec-static-overlay-icon-disabled: @surface2 !important; - --yt-spec-static-overlay-button-primary: @accent-color !important; - --yt-spec-static-overlay-button-secondary: @surface0 !important; - --yt-spec-static-overlay-touch-response: @overlay1 !important; - --yt-spec-static-overlay-touch-response-inverse: @surface1 !important; - --yt-spec-static-overlay-background-brand: @accent-color !important; - --yt-spec-assistive-feed-themed-gradient-1: @subtext0 !important; - --yt-spec-assistive-feed-themed-gradient-2: @lavender !important; - --yt-spec-assistive-feed-themed-gradient-3: @red !important; - --yt-spec-brand-background-solid: @base !important; - --yt-spec-brand-background-primary: @base !important; - --yt-spec-brand-background-secondary: @mantle !important; - --yt-spec-general-background-a: @base !important; - --yt-spec-general-background-b: @base !important; - --yt-spec-general-background-c: @crust !important; - --yt-spec-error-background: @base !important; - --yt-spec-10-percent-layer: @surface0 !important; - --yt-spec-snackbar-background: @mantle !important; - --yt-spec-snackbar-background-updated: @mantle !important; - --yt-spec-badge-chip-background: if( - @lookup =latte, - @crust, - @surface0 - ) !important; - --yt-spec-verified-badge-background: @overlay0 !important; - --yt-spec-call-to-action-fadeoutd: fadeout(@sapphire, 0.3) !important; - --yt-spec-call-to-action-hover: @accent-color !important; - --yt-spec-brand-button-background-hover: @accent-color !important; - --yt-spec-brand-link-text-fadeoutd: fadeout( - @accent-color, - 0.3 - ) !important; - --yt-spec-filled-button-focus-outline: @surface0 !important; - --yt-spec-static-overlay-button-hover: @surface1 !important; - --yt-spec-mono-filled-hover: @surface1 !important; - --yt-spec-commerce-filled-hover: @accent-color !important; - --yt-spec-mono-tonal-hover: @surface1 !important; - --yt-spec-commerce-tonal-hover: @surface2 !important; - --yt-spec-static-overlay-filled-hover: @overlay1 !important; - --yt-spec-static-overlay-tonal-hover: @surface1 !important; - --yt-spec-paper-tab-ink: fadeout(@text, 0.3); - --yt-spec-filled-button-text: @text !important; - --yt-spec-selected-nav-text: @text !important; - --iron-icon-fill-color: @text !important; - - /* Search bar */ - --ytd-searchbox-border-color: @surface0 !important; - --ytd-searchbox-legacy-border-color: @surface0 !important; - --ytd-searchbox-legacy-border-shadow-color: fadeout(@crust, 0) !important; - --ytd-searchbox-legacy-button-color: @mantle !important; - --ytd-searchbox-legacy-button-border-color: @surface0 !important; - --ytd-searchbox-legacy-button-focus-color: @accent-color !important; - --ytd-searchbox-legacy-button-hover-color: @mantle !important; - --ytd-searchbox-legacy-button-hover-border-color: @surface0 !important; - --ytd-searchbox-legacy-button-icon-color: @accent-color !important; - --ytd-searchbox-background: @base !important; - --ytd-searchbox-text-color: @text !important; - - /* System icons */ - --yt-spec-icon-inactive: @text !important; - --yt-spec-icon-disabled: @overlay1 !important; - --yt-spec-brand-icon-inactive: @overlay2 !important; - - /* Yt video Page */ - --yt-live-chat-background-color: @base !important; - --yt-live-chat-action-panel-background-color: @base !important; - --yt-live-chat-secondary-background-color: @surface1; - --yt-live-chat-toast-background-color: @surface2 !important; - --yt-live-chat-mode-change-background-color: @base !important; - --yt-live-chat-secondary-text-color: @subtext0 !important; - --yt-live-chat-tertiary-text-color: fadeout(@text, 0.54) !important; - --yt-live-chat-text-input-field-inactive-underline-color: @subtext0 !important; - --yt-live-chat-text-input-field-placeholder-color: @subtext0 !important; - --yt-live-chat-enabled-send-button-color: @text !important; - --yt-live-chat-disabled-icon-button-color: @subtext1 !important; - --yt-live-chat-picker-button-hover-color: @accent-color !important; - --yt-live-chat-mention-background-color: @accent-color !important; - --yt-live-chat-mention-text-color: @text !important; - --yt-live-chat-deleted-message-color: @subtext0; - --yt-live-chat-deleted-message-bar-color: @subtext1 !important; - --yt-live-chat-reconnect-message-color: @text !important; - --yt-live-chat-disabled-button-background-color: @overlay0 !important; - --yt-live-chat-sub-panel-background-color: @base !important; - --yt-live-chat-sub-panel-background-color-transparent: @mantle !important; - --yt-live-chat-moderator-color: @lavender !important; - --yt-live-chat-owner-color: @peach !important; - --yt-live-chat-message-highlight-background-color: @base !important; - --yt-live-chat-sponsor-color: @green !important; - --yt-live-chat-overlay-color: fadeout(@mantle, 0.5); - --yt-live-chat-dialog-background-color: @base !important; - --yt-emoji-picker-variant-selector-bg-color: @base !important; - --yt-live-chat-moderation-mode-hover-background-color: fadeout( - @mantle, - 0.3 - ) !important; - --yt-grey: @subtext0 !important; - --yt-live-chat-text-input-field-suggestion-background-color: @subtext0 !important; - --yt-live-chat-text-input-field-suggestion-background-color-hover: @subtext1 !important; - --yt-emoji-picker-search-background-color: @surface0 !important; - --yt-emoji-picker-search-color: @text !important; - --yt-emoji-picker-search-placeholder-color: @accent-color !important; - --yt-live-chat-slider-active-color: @accent-color !important; - --yt-live-chat-slider-container-color: @surface0 !important; - --yt-live-chat-slider-markers-color: @text !important; - --yt-live-chat-banner-gradient-scrim: linear-gradient( - @mantle, - transparent - ) !important; - --yt-live-chat-action-panel-gradient-scrim: linear-gradient( - to top, - @mantle, - transparent - ) !important; - --yt-live-chat-automod-button-background-color-hover: fadeout( - @crust, - 0.5 - ) !important; - --yt-live-chat-automod-button-explanation-color: fadeout( - @accent-color, - 0.7 - ) !important; - --yt-live-chat-shimmer-background-color: fadeout(@crust, 0.4) !important; - --yt-live-chat-shimmer-linear-gradient: linear-gradient( - 0deg, - fadeout(@text, 0.1) 40%, - fadeout(@base, 0.3) 50%, - fadeout(@text, 0.1) 60% - ) !important; - --yt-live-chat-vem-background-color: @mantle !important; - --yt-live-chat-product-picker-icon-color: fadeout(@text, 0.5) !important; - --yt-live-chat-product-picker-hover-color: @overlay0 !important; - --yt-live-chat-product-picker-disabled-icon-color: fadeout( - @text, - 0.3 - ) !important; - --yt-live-chat-action-panel-background-color-transparent: ( - null - ) !important; - - --paper-tooltip-background: @overlay0 !important; - --paper-tooltip-text-color: @text !important; - - /* Links */ - --yt-endpoint-color: @accent-color !important; - --yt-endpoint-visited-color: @accent-color !important; - --yt-endpoint-hover-color: @accent-color !important; - - --sb-dark-red-outline: @accent-color !important; - --sb-main-bg-color: @base !important; - --sb-main-fg-color: @text !important; - --sb-grey-bg-color: @base !important; - --sb-grey-fg-color: @subtext0 !important; - --sb-red-bg-color: @accent-color !important; - } - - &:not(.style-scope) { - --primary-text-color: @text !important; - --primary-background-color: @base !important; - --secondary-text-color: @subtext0 !important; - --disabled-text-color: @subtext1 !important; - --divider-color: @overlay0 !important; - --error-color: @red !important; - --primary-color: @accent-color !important; - --light-primary-color: @accent-color !important; - --dark-primary-color: @blue !important; - --accent-color: @accent-color !important; - --light-accent-color: @accent-color !important; - --dark-accent-color: @accent-color !important; - --light-theme-background-color: @base !important; - --light-theme-base-color: @text !important; - --light-theme-text-color: @text !important; - --light-theme-secondary-color: @subtext0 !important; - --light-theme-disabled-color: @subtext1 !important; - --light-theme-divider-color: @overlay0 !important; - --dark-theme-background-color: @base !important; - --dark-theme-base-color: @text !important; - --dark-theme-text-color: @text !important; - --dark-theme-secondary-color: @subtext0 !important; - --dark-theme-disabled-color: @subtext1 !important; - --dark-theme-divider-color: @overlay0 !important; - } - - /* Misc */ - - & when (@logo = 0) { - ytd-topbar-logo-renderer, - svg.ytd-consent-bump-v2-lightbox { - display: none; - } - } - - #channel-name.ytd-video-meta-block { - --yt-endpoint-color: @accent-color !important; - --yt-endpoint-visited-color: @accent-color !important; - color: @accent-color !important; - } - - .yt-page-navigation-progress { - background: @accent-color !important; - } - - /* Selected chapter */ - ytd-macro-markers-list-item-renderer { - --ytd-macro-markers-list-item-background-color: @surface0 !important; - --ytd-macro-markers-list-item-title-color: @text !important; - --ytd-macro-markers-list-item-secondary-color: @subtext1 !important; - --ytd-macro-markers-list-item-timestamp-background-color: @surface1 !important; - } - - ytd-playlist-panel-video-renderer { - --yt-lightsource-section2-color: @surface1 !important; - --yt-lightsource-section4-color: @surface2 !important; - --yt-lightsource-primary-title-color: @text !important; - --yt-lightsource-secondary-title-color: @text !important; - --yt-active-playlist-panel-background-color: @surface0 !important; - } - - ytd-playlist-panel-renderer[collapsible][collapsed][use-color-palette] - .header.ytd-playlist-panel-renderer { - --iron-icon-fill-color: @text !important; - background-color: @base !important; - } - - #container.ytd-masthead { - --iron-icon-fill-color: @text !important; - } - - #background.ytd-masthead { - --yt-frosted-glass-desktop: @base !important; - } - - ytd-feed-filter-chip-bar-renderer[expand-instead-of-scroll] - #chips-wrapper.ytd-feed-filter-chip-bar-renderer { - --iron-icon-fill-color: @text !important; - background-color: @base !important; - } - - #ytd-player #container when (@oled =0) { - background: @crust !important; - } - - .ytp-progress-list when not(@lookup = latte) { - background: fade(@surface0, 80%); - } - .ytp-load-progress when not(@lookup = latte) { - background: fade(@overlay0, 100%); - } - - ytd-expandable-metadata-renderer { - --yt-lightsource-section1-color: @base !important; - --yt-lightsource-section2-color: @surface0 !important; - --yt-lightsource-section3-color: @surface1 !important; - --yt-lightsource-section4-color: @surface2 !important; - --yt-lightsource-primary-title-color: @text !important; - --yt-lightsource-secondary-title-color: @subtext0 !important; - } - - yt-live-chat-renderer { - --yt-button-default-text-color: @text !important; - --yt-button-default-background-color: @base !important; - --yt-button-dark-text-color: @base !important; - --yt-button-dark-background-color: @accent-color !important; - --yt-button-payment-background-color: @accent-color !important; - } - - ytd-author-comment-badge-renderer:not( - [style*="--ytd-author-comment-badge-icon-background-color: transparent;"] - ) { - --yt-basic-background-color: @surface0 !important; - --yt-basic-foreground-title-color: @surface0 !important; - --ytd-author-comment-badge-background-color: @surface0 !important; - --ytd-author-comment-badge-name-color: @text !important; - --ytd-author-comment-badge-icon-color: @text !important; - } - - /* Skeleton */ - #guide-skeleton, - #home-container-skeleton, - #home-chips { - background-color: @base; - z-index: -1; - } - - #guide-skeleton .guide-ghost-icon, - #guide-skeleton .guide-ghost-text, - .masthead-skeleton-icon, - #home-page-skeleton .skeleton-bg-color, - .watch-skeleton .skeleton-bg-color { - background-color: @surface1; - } - - /* Ambient mode */ - #cinematics, - #cinematic-container { - mix-blend-mode: lighten; - } - - .ytp-settings-button.ytp-hd-quality-badge::after, - .ytp-settings-button.ytp-hdr-quality-badge::after, - .ytp-settings-button.ytp-4k-quality-badge::after, - .ytp-settings-button.ytp-5k-quality-badge::after, - .ytp-settings-button.ytp-8k-quality-badge::after, - .ytp-settings-button.ytp-3d-badge-grey::after, - .ytp-settings-button.ytp-3d-badge::after { - background-color: @accent-color; - } - - /* Icons */ - - [fill="red"], - [fill="#F00"], - [fill="#FF0000"], - [fill="#f03"], - [fill="#FF0033"] { - fill: @accent-color !important; - } - - [fill="white"] { - fill: if(@lookup = latte, @base, @text) !important; - } - - /* verification badge */ - [src*="https://www.gstatic.com/images/icons/material/system/1x/check_circle_grey600_36dp.png"] - { - filter: @text-filter; - } - - yt-icon.ytd-logo [fill="white"] { - fill: @crust !important; - } - - .yt-spec-icon-shape { - [fill="#FAFAFA"], - [fill="#000"], - [fill="#fff"], - [fill="#FFF"], - [fill="#FFFFFF"] { - fill: @crust !important; - } - } - - .yt-spec-icon-badge-shape--style-overlay .yt-spec-icon-badge-shape__icon, - .yt-spec-icon-badge-shape { - color: @text; - } - - .yt-spec-icon-badge-shape--type-notification - .yt-spec-icon-badge-shape__badge { - background-color: @accent-color !important; - color: @surface0 !important; - } - - /* Buttons */ - - .yt-spec-button-shape-next--mono { - &.yt-spec-button-shape-next--tonal { - color: @text; - background-color: @surface0; - - [fill="rgb(3,3,3)"], - [fill="rgb(0,0,0)"], - [fill="rgb(255,255,255)"] { - fill: @text !important; - } - - [stroke="rgb(0,0,0)"], - [stroke="rgb(255,255,255)"] { - stroke: @text !important; - } - - /* Accent for filled-in thumbs up (like button) */ - [animated-icon-type="LIKE"] { - g path[fill] { - fill: @accent-color !important; - - + [stroke] { - stroke: @accent-color !important; - } - } - } - - &:hover { - background-color: @surface1; - } - } - - &.yt-spec-button-shape-next--outline { - color: @text; - border-color: @surface2; - - &:hover { - background-color: @surface2; - } - } - - &.yt-spec-button-shape-next--text { - color: @text; - - /* Accent for filled-in thumbs up (like button) */ - path[d="M3,11h3v10H3V11z M18.77,11h-4.23l1.52-4.94C16.38,5.03,15.54,4,14.38,4c-0.58,0-1.14,0.24-1.52,0.65L7,11v10h10.43 c1.06,0,1.98-0.67,2.19-1.61l1.34-6C21.23,12.15,20.18,11,18.77,11z"] { - fill: @accent-color; - } - } - - &.yt-spec-button-shape-next--filled { - color: @crust; - background-color: @accent-color; - - &:hover { - background-color: darken(@accent-color, 5%); - } - } - } - - .yt-spec-button-shape-next--disabled { - background-color: fade(@overlay0, 50%); - color: @subtext0; - } - - .yt-spec-button-shape-next--overlay { - &.yt-spec-button-shape-next--tonal, - &.yt-spec-button-shape-next--text { - color: @text; - } - - &.yt-spec-button-shape-next--filled { - color: @crust; - background-color: @accent-color; - } - } - - .yt-spec-button-shape-next--call-to-action { - &.yt-spec-button-shape-next--outline { - color: @accent-color; - border-color: @surface2; - - &:hover { - background-color: fade(@accent-color, 30%); - color: @accent-color; - } - } - - &.yt-spec-button-shape-next--text { - color: @accent-color; - - &:hover { - background-color: fade(@accent-color, 30%); - } - } - - &.yt-spec-button-shape-next--filled { - color: @crust; - background-color: @accent-color; - - &:hover { - background-color: lighten(@accent-color, 5%); - } - } - } - - .yt-spec-button-shape-next--disabled.yt-spec-button-shape-next--filled { - color: @subtext0; - background-color: fade(@surface1, 70%); - } - - /* Search box */ - - ytd-searchbox[has-focus] #container.ytd-searchbox { - border-color: @accent-color; - } - - .sbsb_a { - background: var(--yt-spec-raised-background); - } - .sbdd_b { - border-color: var(--yt-spec-raised-background); - background-color: var(--yt-spec-raised-background); - } - .sbpqs_a, - .gsfs { - color: var(--yt-spec-text-primary); - } - .sbsb_i { - color: var(--yt-spec-call-to-action); - } - .sbsb_d { - background-color: var(--yt-spec-additive-background); - } - .sbdd_c { - visibility: hidden; - } - - /* "Suggestion removed" */ - .sbpqs_c { - color: @overlay1; - } - - .sbpqs_a::before, - .sbqs_c::before { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - background: none; - } - - /* Video description */ - - #description { - [style*="color: rgb(255, 255, 255);"], - [style*="color: rgb(19, 19, 19);"] { - color: @text !important; - } - } - - .yt-core-attributed-string__link--call-to-action-color { - color: @accent-color; - } - - .YtwCourseProgressViewModelHostProgressTitle, - .YtwCourseProgressViewModelHostProgressSubtitle { - color: @text; - } - - .YtwCourseProgressViewModelHostProgressBar { - background-color: fade(@white, 20%); - - .YtwCourseProgressViewModelHostProgressBarFill { - background-color: @text; - } - } - - /* Thumbnails */ - - #time-status:has([aria-label="LIVE"]), - .badge[aria-label="LIVE"], - .badge[aria-label="PREMIERE"], - .badge-shape-wiz--live.badge-shape-wiz--overlay { - --yt-spec-static-overlay-text-primary: @crust; - --yt-spec-static-overlay-icon-active-other: @crust; - } - .badge-shape-wiz--live.badge-shape-wiz--overlay { - background: var(--yt-spec-static-overlay-background-brand); - color: var(--yt-spec-static-overlay-text-primary); - } - #thumbnail [style="background-color: rgba(51, 51, 51, 0.8);"], - .YtInlinePlayerControlsTopRightControlsCircleButton, - .badge-shape-wiz--default.badge-shape-wiz--overlay, - .branding-context-container-inner { - background-color: @surface0 !important; - color: @text; - } - .ytp-sb-unsubscribe { - background-color: @surface2; - color: @text; - } - .ytp-sb-subscribe { - background-color: @accent-color; - color: @crust; - } - ytd-thumbnail-overlay-resume-playback-renderer { - background-color: @surface1; - } - .badge-shape-wiz--thumbnail-default { - color: @text; - background: fade(@crust, 80%); - } - - /* Panels, popups, tooltips */ - - .ytp-tooltip-text { - background: @surface0 !important; - color: @text; - text-shadow: none !important; - } - - .ytp-popup { - background: @surface0 !important; - text-shadow: none; - } - - .ytp-panel-menu, - .ytp-panel-header, - .ytp-panel-footer, - .ytp-menuitem-label, - .ytp-premium-label, - .ytp-menuitem-content, - .ytp-menuitem-label-count, - .ytp-menu-label-secondary, - .ytd-menu-title-renderer { - color: @text; - } - - .ytp-panel-header { - border-bottom-color: @surface2; - } - - .ytp-panel-footer-content-link { - color: @accent-color; - } - - .ytp-panel-back-button { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - - .ytp-menuitem-toggle-checkbox { - background-color: @surface2; - - &::after { - background-color: @subtext0; - } - } - .ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox { - background: @accent-color; - } - - .ytp-menuitem { - &:not([aria-disabled="true"]):hover { - background-color: @surface1; - } - - svg > path:not([fill="none"]) { - fill: @text !important; - } - - &[aria-haspopup="true"] .ytp-menuitem-content { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - &[role="menuitemradio"][aria-checked="true"] .ytp-menuitem-label { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml,@{svg}"); - } - } - - /* Video player */ - - .ytp-cards-button { - .ytp-cards-button-icon { - use { - fill: @black; - } - path { - fill: @white; - } - } - } - .ytp-cards-teaser { - .ytp-cards-teaser-box { - background-color: @surface2; - border-bottom-color: @surface2; - } - .ytp-cards-teaser-text { - color: @text; - } - } - - .html5-video-player { - color: @white; - - .ytp-swatch-background-color, - .ytp-play-progress { - background: @accent-color !important; - } - - .ytp-svg-fill, - [fill="#fff"] { - fill: @white !important; - } - - .ytp-volume-slider-handle { - &, - &::before { - background-color: @white; - } - &::after { - background-color: fade(@white, 20%); - } - } - - .ytp-time-current, - .ytp-time-separator, - .ytp-time-duration { - color: @white; - } - - .ytp-button, - .ytp-subtitles-button { - &[aria-pressed]::after { - background-color: @accent-color; - } - } - - /* stats for nerds */ - .ytp-sfn { - background: fade(@base, 80%); - color: @text; - } - - .ytp-autonav-toggle-button { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml;charset=utf-8,@{svg}"); - - &::after { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml;charset=utf-8,@{svg}"); - } - - &[aria-checked="true"] { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml;charset=utf-8,@{svg}"); - - &::after { - @svg: escape( - '' - ); - background-image: url("data:image/svg+xml;charset=utf-8,@{svg}"); - } - } - } - } - - #shorts-container { - --yt-spec-static-overlay-text-primary: @white; - .yt-spec-button-shape-next--overlay.yt-spec-button-shape-next--tonal { - color: @white; - } - - .YtwFactoidRendererLabel { - color: @subtext0; - } - .YtwFactoidRendererValue { - color: @text; - } - - ytd-reel-video-renderer:not([is-watch-while-mode]) { - .yt-spec-button-shape-with-label__label { - color: @subtext1; - } - } - ytd-reel-video-renderer[is-watch-while-mode] - .yt-spec-button-shape-with-label__label { - color: @white; - } - - .yt-spec-button-shape-next--overlay-dark.yt-spec-button-shape-next--tonal, - .YtdDesktopShortsVolumeControlsBackgroundScrim { - background-color: fade(@black, 60%); - color: @white; - } - - .yt-spec-button-shape-next--overlay-dark.yt-spec-button-shape-next--filled { - background-color: @accent-color; - color: @crust; - } - - .YtdDesktopShortsVolumeControlsMuteIcon { - color: @white !important; - } - - /* Buy super thanks button */ - .YtdShortsSuggestedActionStaticHostContainer { - background-color: fade(@black, 60%); - - .YtdShortsSuggestedActionStaticHostLeadingIcon, - .YtdShortsSuggestedActionStaticHostPrimaryText { - color: @text; - } - } - } - - /* Buy super thanks bar */ - #progressContainer.tp-yt-paper-progress { - background-color: @mantle !important; - } - - #comment-chip-container.yt-pdg-comment-chip-renderer, - .slider-knob-inner.tp-yt-paper-slider { - background: @accent-color !important; - } - - #primaryProgress.tp-yt-paper-progress { - background: linear-gradient(139deg, @peach, @maroon, @red, @pink); - } - - #container.ytd-pdg-comment-preview-renderer { - background-color: @mantle !important; - } - - #comment-chip-price.yt-pdg-comment-chip-renderer, - yt-icon.yt-pdg-comment-chip-renderer { - color: @crust; - } - - /* Channel pages */ - .yt-tab-shape-wiz__tab { - color: @subtext1; - } - .yt-tab-shape-wiz__tab--tab-selected { - color: @text; - } - .yt-tab-group-shape-wiz__slider { - background-color: @text; - } - .yt-tab-shape-wiz:hover .yt-tab-shape-wiz__tab-bar { - background-color: @subtext1; - } - .truncated-text-wiz, - .page-header-view-model-wiz__page-header-content-metadata { - color: @subtext1; - } - .page-header-view-model-wiz__page-header-title, - [style="color: rgb(255, 255, 255);"]:has(svg), - .truncated-text-wiz__absolute-button { - color: @text !important; - } - .yt-contextual-sheet-layout-wiz { - background-color: @mantle; - - .yt-list-item-view-model-wiz__container--tappable:hover { - background-color: @surface0; - } - - .yt-list-item-view-model-wiz__title, - .yt-list-item-view-model-wiz__accessory, - .radio-shape-wiz__label-container { - color: @text; - } - } - - /* channel details */ - .profile-badge-view-model-wiz__badge-description { - color: @text !important; - } - - .profile-badge-view-model-wiz__badge-subtitle { - color: @subtext0 !important; - } - - .yt-profile-identity-info-view-model-wiz__divider { - border-color: @surface0 !important; - } - - /* Profiles */ - .yt-profile-card-view-model-wiz { - background-color: @mantle; - } - .yt-profile-identity-info-view-model-wiz__channel-name, - .yt-profile-info-view-model-wiz__section-title, - .yt-comment-interaction-view-model-wiz__video-title, - .yt-shared-subscription-view-model-wiz__channel-name { - color: @text; - } - .yt-profile-identity-info-view-model-wiz__badge, - .yt-profile-identity-info-view-model-wiz__metadata-handle, - .yt-profile-identity-info-view-model-wiz__metadata-content, - .yt-profile-info-view-model-wiz__section-subtitle, - .yt-comment-interaction-view-model-wiz__comment-content { - color: @subtext0; - } - } -} - -@-moz-document url-prefix('https://studio.youtube.com') -{ - :root[dark] { - #catppuccin(@darkFlavor, @accentColor); - } - :root { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - [src="https://www.gstatic.com/youtube/img/creator/yt_studio_logo_white.svg"] - { - @svg: escape( - '' - ); - content: url("data:image/svg+xml,@{svg}"); - } - - &, - html, - html[dark], - html[dark][dark], - &[dark], - &[light], - [light], - html[light], - html[light][light] { - --yt-spec-black-pure-alpha-80: (null) !important; - --yt-spec-black-pure-alpha-60: (null) !important; - --yt-spec-black-1-alpha-98: (null) !important; - --yt-spec-black-1-alpha-95: (null) !important; - --iron-icon-fill-color: unset !important; - - --yt-spec-text-primary: @text !important; - --ytcp-text-primary: @text !important; - --ytcp-text-primary-inverse: @base !important; - --ytcp-static-overlay-text-primary-inverse: @base !important; - --ytcp-wordmark-text: @text !important; - --ytcp-text-secondary: @subtext0 !important; - --ytcp-text-disabled: @subtext1 !important; - --ytcp-overlay-text-primary: @overlay2 !important; - - --ytcp-general-background-a: @base !important; - --yt-spec-base-background: @base !important; - --yt-spec-black-3: @base !important; - - --yt-spec-brand-background-solid: @mantle !important; - --ytcp-brand-background-solid: @mantle !important; - --yt-spec-raised-background: @mantle !important; - --ytcp-general-background-b: @mantle !important; - --ytcp-analytics-reach-background: @mantle !important; - --yt-spec-black-2: @mantle !important; - - --ytcp-general-background-c: @crust !important; - --ytcp-menu-background: @surface0 !important; - - --ytcp-container-border-color: @surface0 !important; - --ytcp-container-hovered-border-color: @surface0 !important; - --ytcp-line-divider-solid: @surface0 !important; - --ytcp-container-border-color-inverse: @subtext0 !important; - --ytcp-line-divider-solid-inverse: @subtext0 !important; - - --ytcp-call-to-action: @accent-color !important; - --ytcp-call-to-action-inverse: @mantle !important; - --ytcp-call-to-action-raised-background: @accent-color !important; - --yt-spec-brand-button-background: @accent-color !important; - --ytcp-call-to-action-raised-disabled: @surface2 !important; - --ytcp-call-to-action-raised-disabled-background: @overlay2 !important; - --ytcp-call-to-action-raised-background-inverse: @base !important; - --ytcp-call-to-action-raised-disabled-inverse: @surface2 !important; - --ytcp-call-to-action-raised-disabled-background-inverse: @overlay2 !important; - - --yt-spec-brand-background-primary: @surface0 !important; - - --yt-compact-link-icon-color: @overlay2 !important; - --ytcp-icon-active: @accent-color !important; - --ytcp-icon-inactive: @overlay2 !important; - --ytcp-icon-disabled: @overlay0 !important; - --ytcp-icon-active-inverse: @overlay1 !important; - --ytcp-icon-disabled-inverse: @subtext1 !important; - - --ytcp-error-red: @red !important; - --ytcp-badge-red: @red !important; - --ytcp-error-red-inverse: @red !important; - --ytcp-themed-red-inverse: @red !important; - --ytcp-themed-red: @accent-color !important; - --ytcp-themed-blue: @accent-color !important; - --ytcp-badge-blue: fade(@accent-color, 30%); - --ytcp-badge-blue-solid: @blue !important; - --ytcp-themed-blue-inverse: @blue !important; - --ytcp-themed-green: @green !important; - --ytmus-genre-primary-melon: @green !important; - --ytcp-themed-green-inverse: @green !important; - --ytcp-analytics-pine: @green !important; - --ytcp-analytics-pine-inverse: @green !important; - --ytcp-analytics-parrot: @green !important; - --ytcp-themed-yellow: @peach !important; - --ytmus-genre-primary-gold: @peach !important; - --ytcp-yellow-inverse: @peach !important; - --ytcp-badge-yellow: @peach !important; - --ytcp-analytics-yellow: @peach !important; - --ytcp-analytics-apricot: @peach !important; - --ytcp-suggested-action: @teal !important; - --ytcp-analytics-overview: @teal !important; - --ytcp-analytics-revenue: @teal !important; - --ytcp-analytics-default-secondary: @teal !important; - --ytcp-analytics-royal-blue: @lavender !important; - --ytcp-analytics-reach: @lavender !important; - --ytcp-analytics-audience: @lavender !important; - --ytcp-analytics-engagement: @pink !important; - --ytcp-analytics-revenue-secondary: @pink !important; - --ytcp-analytics-bubblegum: @flamingo !important; - --ytmus-genre-primary-ruby: @flamingo !important; - --ytmus-genre-primary-salmon: @mauve !important; - --ytmus-genre-primary-orange: @maroon !important; - --ytmus-genre-primary-sky: @sky !important; - --ytmus-genre-primary-sky-inverse: @sky !important; - - --yt-spec-badge-chip-background: @surface1 !important; - --ytcp-focus-inverse: @accent-color !important; - --ytcp-focus: @accent-color !important; - --ytcp-selected-item: @accent-color !important; - --ytcp-hover-item: @overlay2 !important; - --ytcp-chip-active-focus: @accent-color !important; - --ytcp-playhead: @overlay2 !important; - --ytcp-playhead-inverse: @overlay2 !important; - } - - ytcp-button.destructive.ytls-error-dialog { - color: @base !important; - } - - yt-formatted-string.ytls-error-dialog, - tp-yt-iron-icon.ytls-error-dialog { - color: @text !important; - } - } -} - -@-moz-document domain('m.youtube.com') { - html[darker-dark-theme] { - #catppuccin(@darkFlavor, @accentColor); - } - html { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - background-color: @base !important; - color: @text !important; - - /* Ambient mode */ - #cinematics { - mix-blend-mode: lighten; - } - - .mobile-topbar-header[data-mode="watch"], - ytm-mobile-topbar-renderer:not([ambient-topbar]) { - background: @base; - } - - .mobile-topbar-header[data-mode="watch"] .mobile-topbar-logo, - .mobile-topbar-header[data-mode="watch"] .mobile-topbar-title, - .mobile-topbar-header[data-mode="watch"] .mobile-topbar-header-content { - color: @text; - } - - .yt-spec-bottom-sheet-layout__bottom-sheet-renderer-container, - .modern-styling { - background: @surface0; - } - - .yt-spec-bottom-sheet-layout__bottom-sheet-layout-header-wrapper { - border-bottom-color: @surface0; - } - - .yt-spec-bottom-sheet-layout__bottom-sheet-content { - color: @text; - } - - /* Comment box */ - .engagement-panel-container { - background: @mantle; - } - - /* Bottom bar */ - ytm-pivot-bar-renderer { - background: @mantle; - color: @text; - border-top-color: @surface0; - } - - /* Chips */ - .chip-bar { - background-color: @base; - } - - [chip-style*="STYLE_"] { - .chip-container { - color: @text; - background-color: @surface0; - } - - &.selected .chip-container { - color: @crust; - background-color: @accent-color; - } - } - - /* Buttons */ - - .yt-spec-touch-feedback-shape--touch-response { - .yt-spec-touch-feedback-shape__fill { - background-color: @text; - } - - .yt-spec-touch-feedback-shape__stroke { - border-color: @surface1; - } - } - - .yt-spec-touch-feedback-shape--overlay-touch-response-inverse - .yt-spec-touch-feedback-shape__fill { - background-color: @accent-color; - } - .yt-spec-touch-feedback-shape--overlay-touch-response - .yt-spec-touch-feedback-shape__fill { - background-color: @text; - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @text_filter: brightness(0) saturate(100%) invert(31%) sepia(12%) saturate(1015%) hue-rotate(196deg) brightness(94%) contrast(91%); @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @text_filter: brightness(0) saturate(100%) invert(80%) sepia(11%) saturate(726%) hue-rotate(192deg) brightness(104%) contrast(92%); @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @text_filter: brightness(0) saturate(100%) invert(84%) sepia(5%) saturate(1385%) hue-rotate(192deg) brightness(101%) contrast(92%); @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @text_filter: brightness(0) saturate(100%) invert(87%) sepia(6%) saturate(985%) hue-rotate(191deg) brightness(96%) contrast(99%); @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/styles/youtube/catppuccin.user.less b/styles/youtube/catppuccin.user.less new file mode 100644 index 0000000000..799be5f13b --- /dev/null +++ b/styles/youtube/catppuccin.user.less @@ -0,0 +1,1574 @@ +/* ==UserStyle== +@name YouTube Catppuccin +@namespace github.com/catppuccin/userstyles/styles/youtube +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/youtube +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/youtube/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Ayoutube +@description Soothing pastel theme for YouTube +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] + +@var checkbox logo "Enable YouTube logo" 1 +@var checkbox oled "Enable black bars" 0 +@var checkbox sponsorBlock "Enable SponsorBlock segments" 1 +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("youtube.com") { + :root[dark] { + #catppuccin(@darkFlavor); + } + :root:not([dark]) { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + @white: if(@flavor = latte, @base, @text); + @black: if(@flavor = latte, @text, @base); + + color: @text; + background: @base; + + #--variables() { + &, + [dark], + [system-icons], + [darker-dark-theme], + &[dark], + &[system-icons], + &[darker-dark-theme] { + --efyt-control-bar-background-color: @mantle; + --dimmer-text: @text; + + /* Newest Variables */ + --yt-sys-color-baseline--base-background: @base; + --yt-sys-color-baseline--menu-background: @mantle; + --yt-sys-color-baseline--raised-background: @surface0; + --yt-sys-color-baseline--additive-background: @surface0; + --yt-sys-color-baseline--wordmark-text: @text; + --yt-sys-color-baseline--text-primary: @text; + --yt-sys-color-baseline--text-secondary: @subtext0; + --yt-sys-color-baseline--call-to-action: @accent; + --yt-sys-color-baseline--suggested-action: mix(@accent, @base, 30%); + --yt-sys-color-baseline--outline: @surface0; + --yt-sys-color-baseline--outline-opaque: @surface1; + --yt-sys-color-baseline--outline-inverse-opaque: @overlay0; + --yt-sys-color-baseline--overlay-background-medium-light: fade( + @black, + 60% + ); + --yt-sys-color-baseline--overlay-background-heavy: fade(@black, 80%); + --yt-sys-color-baseline--overlay-background-solid: @crust; + --yt-sys-color-baseline--overlay-text-primary: @text; + + --yt-spec-white-1: @text; + --yt-spec-white-2: @subtext0; + --yt-spec-white-3: @subtext1; + --yt-spec-white-4: darken(@subtext1, 5%); + --yt-spec-black-1: @overlay1; + --yt-spec-black-2: @overlay0; + --yt-spec-black-3: @surface2; + --yt-spec-black-4: @surface1; + --yt-spec-black-pure: @surface0; + --yt-spec-grey-1: @text; + --yt-spec-grey-2: @subtext0; + --yt-spec-grey-3: @subtext1; + --yt-spec-grey-4: @overlay2; + --yt-spec-grey-5: @overlay1; + --yt-brand-youtube-red: @accent; + --yt-brand-medium-red: @accent; + --yt-brand-light-red: @accent; + --yt-spec-red-30: @peach; + --yt-spec-red-70: @red; + --yt-spec-red-indicator: @accent; + --yt-spec-pale-blue: @sky; + --yt-spec-light-blue: @sky; + --yt-spec-dark-blue: @sapphire; + --yt-spec-navy-blue: @teal; + --yt-spec-light-green: @green; + --yt-spec-dark-green: @green; + --yt-spec-yellow: @peach; + --yt-spec-black-pure-alpha-5: @subtext0; + --yt-spec-black-pure-alpha-10: @overlay2; + --yt-spec-black-pure-alpha-15: fade(@crust, 85%); + --yt-spec-black-pure-alpha-30: fade(@crust, 70%); + --yt-spec-black-pure-alpha-60: fade(@crust, 40%); + --yt-spec-black-pure-alpha-80: fade(@crust, 20%); + --yt-spec-black-1-alpha-98: fade(@crust, 2%); + --yt-spec-black-1-alpha-95: fade(@crust, 5%); + --yt-spec-white-1-alpha-10: fade(@text, 90%); + --yt-spec-white-1-alpha-20: fade(@text, 80%); + --yt-spec-white-1-alpha-25: fade(@text, 75%); + --yt-spec-white-1-alpha-30: fade(@text, 70%); + --yt-spec-white-1-alpha-70: fade(@text, 30%); + --yt-spec-white-1-alpha-95: fade(@text, 5%); + --yt-spec-white-1-alpha-98: fade(@text, 2%); + --yt-brand-medium-red-alpha-90: fade(@accent, 10%); + --yt-brand-medium-red-alpha-30: fade(@accent, 70%); + --yt-brand-light-red-alpha-30: fade(@accent, 70%); + --yt-spec-light-blue-alpha-30: fade(@sapphire, 70%); + --yt-spec-dark-blue-alpha-30: fade(@sapphire, 70%); + + --yt-spec-base-background: @base; + --yt-spec-raised-background: @surface0; + --yt-spec-menu-background: @mantle; + --yt-spec-inverted-background: @text; + --yt-spec-additive-background: @surface0; + --yt-spec-outline: @surface0; + --yt-spec-shadow: fade(@crust, 75%); + --yt-spec-text-primary: @text; + --yt-spec-text-secondary: @subtext0; + --yt-spec-text-disabled: @subtext1; + --yt-spec-text-primary-inverse: @crust; + --yt-spec-call-to-action: @accent; + --yt-spec-call-to-action-inverse: @accent; + --yt-spec-suggested-action: fade(@accent, 20%); + --yt-spec-suggested-action-inverse: @text; + --yt-spec-icon-active-other: @text; + --yt-spec-button-chip-background-hover: @surface1; + --yt-spec-touch-response: @surface0; + + --yt-spec-touch-response-inverse: @accent; + --yt-spec-brand-icon-active: @accent; + --yt-spec-brand-button-background: @accent; + --yt-spec-brand-link-text: @sapphire; + --yt-spec-wordmark-text: @text; + --yt-spec-error-indicator: @red; + --yt-spec-themed-blue: @accent; + --yt-spec-themed-green: @green; + --yt-spec-ad-indicator: @teal; + --yt-spec-themed-overlay-background: fade(@crust, 80%); + --yt-spec-commerce-badge-background: @green; + --yt-spec-static-brand-red: @accent; + --yt-spec-static-brand-white: @text; + --yt-spec-static-brand-black: @base; + --yt-spec-static-clear-color: fade(@crust, 100%); + --yt-spec-static-clear-black: @base; + --yt-spec-static-ad-yellow: @peach; + --yt-spec-static-grey: @subtext0; + --yt-spec-static-overlay-background-solid: @crust; + --yt-spec-static-overlay-background-heavy: @crust; + --yt-spec-static-overlay-background-medium: fade(@crust, 50%); + --yt-spec-static-overlay-background-light: fade( + @crust, + 90% + ); + --yt-spec-static-overlay-text-primary: @text; + --yt-spec-static-overlay-text-secondary: fade( + @subtext0, + 30% + ); + --yt-spec-static-overlay-text-disabled: fade( + @subtext0, + 70% + ); + --yt-spec-static-overlay-call-to-action: @accent; + --yt-spec-static-overlay-icon-active-other: @crust; + --yt-spec-static-overlay-icon-inactive: @surface1; + --yt-spec-static-overlay-icon-disabled: @surface2; + --yt-spec-static-overlay-button-primary: @accent; + --yt-spec-static-overlay-touch-response: @overlay1; + --yt-spec-static-overlay-touch-response-inverse: @surface1; + --yt-spec-static-overlay-background-brand: @accent; + --yt-spec-assistive-feed-themed-gradient-1: @subtext0; + --yt-spec-assistive-feed-themed-gradient-2: @lavender; + --yt-spec-assistive-feed-themed-gradient-3: @red; + --yt-spec-brand-background-solid: @base; + --yt-spec-brand-background-primary: @base; + --yt-spec-brand-background-secondary: @mantle; + --yt-spec-general-background-a: @base; + --yt-spec-general-background-b: @base; + --yt-spec-general-background-c: @crust; + --yt-spec-error-background: @base; + --yt-spec-10-percent-layer: @surface1; + --yt-spec-snackbar-background: @mantle; + --yt-spec-snackbar-background-updated: @mantle; + --yt-spec-badge-chip-background: if( + @flavor = latte, + @crust, + @surface0 + ); + --yt-spec-verified-badge-background: @overlay0; + --yt-spec-call-to-action-fadeoutd: fade(@sapphire, 70%); + --yt-spec-call-to-action-hover: @accent; + --yt-spec-brand-button-background-hover: @accent; + --yt-spec-brand-link-text-fadeoutd: fade( + @accent, + 70% + ); + --yt-spec-filled-button-focus-outline: @surface0; + --yt-spec-static-overlay-button-hover: @surface1; + --yt-spec-mono-filled-hover: @surface1; + --yt-spec-commerce-filled-hover: @accent; + --yt-spec-mono-tonal-hover: @surface1; + --yt-spec-commerce-tonal-hover: @surface2; + --yt-spec-static-overlay-filled-hover: @overlay1; + --yt-spec-static-overlay-tonal-hover: @surface1; + --yt-spec-paper-tab-ink: fade(@text, 70%); + --yt-spec-filled-button-text: @text; + --yt-spec-selected-nav-text: @text; + --iron-icon-fill-color: @text; + + --yt-spec-overlay-text-primary: @text; + --yt-spec-overlay-background-medium-light: fade(@black, 60%); + --yt-spec-overlay-background-heavy: fade(@black, 80%); + --yt-spec-overlay-background-solid: @black; + + /* Search bar */ + --ytd-searchbox-border-color: @surface0; + --ytd-searchbox-legacy-border-color: @surface0; + --ytd-searchbox-legacy-border-shadow-color: fade( + @crust, + 100% + ); + --ytd-searchbox-legacy-button-color: @mantle; + --ytd-searchbox-legacy-button-border-color: @surface0; + --ytd-searchbox-legacy-button-focus-color: @accent; + --ytd-searchbox-legacy-button-hover-color: @mantle; + --ytd-searchbox-legacy-button-hover-border-color: @surface0; + --ytd-searchbox-legacy-button-icon-color: @accent; + --ytd-searchbox-background: @base; + --ytd-searchbox-text-color: @text; + + /* System icons */ + --yt-spec-icon-inactive: @text; + --yt-spec-icon-disabled: @overlay1; + --yt-spec-brand-icon-inactive: @overlay2; + + /* Live chat */ + --yt-live-chat-background-color: @base; + --yt-live-chat-primary-text-color: @text; + --yt-live-chat-action-panel-background-color: @base; + --yt-live-chat-secondary-background-color: @surface1; + --yt-live-chat-toast-background-color: @surface2; + --yt-live-chat-mode-change-background-color: @base; + --yt-live-chat-secondary-text-color: @subtext0; + --yt-live-chat-tertiary-text-color: fade(@text, 46%); + --yt-live-chat-text-input-field-inactive-underline-color: @subtext0; + + --yt-live-chat-text-input-field-placeholder-color: @subtext0; + --yt-live-chat-enabled-send-button-color: @text; + --yt-live-chat-disabled-icon-button-color: @subtext1; + --yt-live-chat-picker-button-hover-color: @accent; + --yt-live-chat-mention-background-color: @accent; + --yt-live-chat-mention-text-color: @text; + --yt-live-chat-deleted-message-color: @subtext0; + --yt-live-chat-deleted-message-bar-color: @subtext1; + --yt-live-chat-reconnect-message-color: @text; + --yt-live-chat-disabled-button-background-color: @overlay0; + --yt-live-chat-sub-panel-background-color: @base; + --yt-live-chat-sub-panel-background-color-transparent: @mantle; + --yt-live-chat-moderator-color: @lavender; + --yt-live-chat-owner-color: @peach; + --yt-live-chat-message-highlight-background-color: @base; + --yt-live-chat-sponsor-color: @green; + --yt-live-chat-overlay-color: fade(@mantle, 50%); + --yt-live-chat-dialog-background-color: @base; + --yt-emoji-picker-variant-selector-bg-color: @base; + --yt-live-chat-moderation-mode-hover-background-color: fade( + @mantle, + 70% + ); + --yt-grey: @subtext0; + --yt-live-chat-text-input-field-suggestion-background-color: @subtext0; + + --yt-live-chat-text-input-field-suggestion-background-color-hover: @subtext1; + + --yt-emoji-picker-search-background-color: @surface0; + --yt-emoji-picker-search-color: @text; + --yt-emoji-picker-search-placeholder-color: @accent; + --yt-live-chat-slider-active-color: @accent; + --yt-live-chat-slider-container-color: @surface0; + --yt-live-chat-slider-markers-color: @text; + --yt-live-chat-banner-gradient-scrim: linear-gradient( + @mantle, + transparent + ); + --yt-live-chat-action-panel-gradient-scrim: linear-gradient( + to top, + @mantle, + transparent + ); + --yt-live-chat-automod-button-background-color-hover: fade( + @crust, + 50% + ); + --yt-live-chat-automod-button-explanation-color: fade( + @accent, + 30% + ); + --yt-live-chat-shimmer-background-color: fade(@crust, 60%); + --yt-live-chat-shimmer-linear-gradient: linear-gradient( + 0deg, + fade(@text, 90%) 40%, + fade(@base, 70%) 50%, + fade(@text, 90%) 60% + ); + --yt-live-chat-vem-background-color: @mantle; + --yt-live-chat-product-picker-icon-color: fade(@text, 50%); + --yt-live-chat-product-picker-hover-color: @overlay0; + --yt-live-chat-product-picker-disabled-icon-color: fade( + @text, + 70% + ); + --yt-live-chat-action-panel-background-color-transparent: (null); + + --paper-tooltip-background: @surface2; + --paper-tooltip-text-color: @text; + .ytTooltipContainerDefaultTooltipContent { + background: var(--paper-tooltip-background); + color: var(--paper-tooltip-text-color); + } + + /* Links */ + --yt-endpoint-color: @text; + --yt-endpoint-visited-color: @text; + --yt-endpoint-hover-color: @accent; + + --sb-dark-red-outline: @accent; + --sb-main-bg-color: @base; + --sb-main-fg-color: @text; + --sb-grey-bg-color: @base; + --sb-grey-fg-color: @subtext0; + --sb-red-bg-color: @accent; + + & when (@sponsorBlock = 1) { + --sb-category-sponsor: @green; + --sb-category-selfpromo: @yellow; + --sb-category-exclusive_access: @teal; + --sb-category-interaction: @mauve; + --sb-category-poi_highlight: @pink; + --sb-category-intro: @sky; + --sb-category-outro: @blue; + --sb-category-preview: @sapphire; + --sb-category-filler: @lavender; + --sb-category-music_offtopic: @peach; + } + } + + &:not(.style-scope) { + --primary-text-color: @text; + --primary-background-color: @base; + --secondary-text-color: @subtext0; + --disabled-text-color: @subtext1; + --divider-color: @overlay0; + --error-color: @red; + --primary-color: @accent; + --light-primary-color: @accent; + --dark-primary-color: @blue; + --accent-color: @accent; + --light-accent-color: @accent; + --dark-accent-color: @accent; + --light-theme-background-color: @base; + --light-theme-base-color: @text; + --light-theme-text-color: @text; + --light-theme-secondary-color: @subtext0; + --light-theme-disabled-color: @subtext1; + --light-theme-divider-color: @overlay0; + --dark-theme-background-color: @base; + --dark-theme-base-color: @text; + --dark-theme-text-color: @text; + --dark-theme-secondary-color: @subtext0; + --dark-theme-disabled-color: @subtext1; + --dark-theme-divider-color: @overlay0; + } + } + + #--variables() !important; + + /* Misc */ + + & when (@logo = 0) { + ytd-topbar-logo-renderer, + svg.ytd-consent-bump-v2-lightbox { + display: none; + } + } + + #progress.yt-page-navigation-progress { + background: @accent; + } + + /* Selected chapter */ + ytd-macro-markers-list-item-renderer { + --ytd-macro-markers-list-item-background-color: @surface0; + --ytd-macro-markers-list-item-title-color: @text; + --ytd-macro-markers-list-item-secondary-color: @subtext1; + --ytd-macro-markers-list-item-timestamp-background-color: @surface1; + } + + ytd-playlist-panel-video-renderer { + --yt-lightsource-section2-color: @surface1; + --yt-lightsource-section4-color: @surface2; + --yt-lightsource-primary-title-color: @text; + --yt-lightsource-secondary-title-color: @text; + --yt-active-playlist-panel-background-color: @surface0; + } + + ytd-playlist-panel-renderer[collapsible][collapsed][use-color-palette] + .header.ytd-playlist-panel-renderer { + --iron-icon-fill-color: @text; + background-color: @base; + } + + #container.ytd-masthead { + --iron-icon-fill-color: @text; + } + + #background.ytd-masthead, + #frosted-glass { + --yt-frosted-glass-desktop: @base; + --yt-spec-frosted-glass-desktop: @base; + } + + ytd-feed-filter-chip-bar-renderer[expand-instead-of-scroll] + #chips-wrapper.ytd-feed-filter-chip-bar-renderer { + --iron-icon-fill-color: @text; + background-color: @base; + } + + .ytp-progress-list when not(@flavor = latte) { + background: fade(@surface0, 80%); + } + .ytp-load-progress when not(@flavor = latte) { + background: fade(@overlay0, 100%); + } + + ytd-expandable-metadata-renderer { + --yt-lightsource-section1-color: @base; + --yt-lightsource-section2-color: @surface0; + --yt-lightsource-section3-color: @surface1; + --yt-lightsource-section4-color: @surface2; + --yt-lightsource-primary-title-color: @text; + --yt-lightsource-secondary-title-color: @subtext0; + } + + yt-live-chat-renderer { + --yt-button-default-text-color: @text; + --yt-button-default-background-color: @base; + --yt-button-dark-text-color: @base; + --yt-button-dark-background-color: @accent; + --yt-button-payment-background-color: @accent; + } + + yt-icon-button.yt-live-chat-item-list-renderer { + background-color: @accent; + color: @base; + + &:hover { + background-color: darken(@accent, 5%); + } + } + + /* Skeleton */ + #guide-skeleton, + #home-container-skeleton, + #home-chips { + background-color: @base; + z-index: -1; + } + + ytd-app[is-shorts-page] { + background: var( + --yt-spec-base-background + ); // fix unset background on shorts page + } + + #guide-skeleton .guide-ghost-icon, + #guide-skeleton .guide-ghost-text, + .masthead-skeleton-icon, + #home-page-skeleton .skeleton-bg-color, + .watch-skeleton .skeleton-bg-color { + background-color: @surface1; + } + + /* Ambient mode */ + #cinematics, + #cinematic-container { + display: none; + } + + .ytp-settings-button.ytp-hd-quality-badge::after, + .ytp-settings-button.ytp-hdr-quality-badge::after, + .ytp-settings-button.ytp-4k-quality-badge::after, + .ytp-settings-button.ytp-5k-quality-badge::after, + .ytp-settings-button.ytp-8k-quality-badge::after, + .ytp-settings-button.ytp-3d-badge-grey::after, + .ytp-settings-button.ytp-3d-badge::after { + background-color: @accent; + } + + /* Icons */ + + [fill="red"], + [fill="#F00"], + [fill="#FF0000"], + [fill="#f03"], + [fill="#FF0033"] { + fill: @accent; + } + + [fill="white"] { + fill: if(@flavor = latte, @base, @text); + } + + yt-icon.ytd-logo [fill="white"] { + fill: @crust; + } + + .yt-spec-icon-shape { + [fill="#FAFAFA"], + [fill="#000"], + [fill="#fff"], + [fill="#FFF"], + [fill="#FFFFFF"] { + fill: @crust; + } + } + + /* Notifications Bell and Indicator */ + .ytSpecIconBadgeShapeStyleOverlay .ytSpecIconBadgeShapeIcon, + .ytSpecIconBadgeShapeBadge { + color: @text; + } + .ytSpecIconBadgeShapeTypeNotification .ytSpecIconBadgeShapeBadge { + background-color: @accent; + color: @base; + } + + /* Buttons */ + + .yt-spec-button-shape-next--mono { + &.yt-spec-button-shape-next--tonal { + color: @text; + background-color: @surface0; + + [fill="rgb(3,3,3)"], + [fill="rgb(0,0,0)"], + [fill="rgb(255,255,255)"] { + fill: @text; + } + + [stroke="rgb(0,0,0)"], + [stroke="rgb(255,255,255)"] { + stroke: @text; + } + + /* Accent for filled-in thumbs up (like button) */ + [animated-icon-type="LIKE"] { + g path[fill] { + fill: @accent; + + + [stroke] { + stroke: @accent; + } + } + } + + &:hover { + background-color: @surface1; + } + } + + &.yt-spec-button-shape-next--outline { + color: @text; + border-color: @surface2; + + &:hover { + background-color: @surface2; + } + } + + &.yt-spec-button-shape-next--text { + color: @text; + + /* Accent for filled-in thumbs up (like button) */ + path[d="M3,11h3v10H3V11z M18.77,11h-4.23l1.52-4.94C16.38,5.03,15.54,4,14.38,4c-0.58,0-1.14,0.24-1.52,0.65L7,11v10h10.43 c1.06,0,1.98-0.67,2.19-1.61l1.34-6C21.23,12.15,20.18,11,18.77,11z"] { + fill: @accent; + } + + &:hover { + background-color: @surface1; + } + } + + &.yt-spec-button-shape-next--filled { + color: @base; + background-color: @accent; + + &:hover { + background-color: darken(@accent, 5%); + } + } + } + + .yt-spec-button-shape-next--disabled { + color: @overlay1; + } + + .yt-spec-button-shape-next--overlay { + &.yt-spec-button-shape-next--tonal { + color: @text; + background-color: @surface0; + &:hover { + background-color: @surface1; + } + } + &.yt-spec-button-shape-next--text { + color: @text; + &:hover { + background-color: @surface0; + } + } + + &.yt-spec-button-shape-next--filled { + color: @base; + background-color: @accent; + } + + &.yt-spec-button-shape-next--outline { + color: @text; + border-color: @surface1; + &:hover { + background: @surface0; + } + } + } + + .yt-spec-button-shape-next--call-to-action { + &.yt-spec-button-shape-next--outline { + color: @accent; + border-color: @surface2; + + &:hover { + background-color: fade(@accent, 30%); + color: @accent; + } + } + + &.yt-spec-button-shape-next--text { + color: @accent; + + &:hover { + background-color: fade(@accent, 30%); + } + } + + &.yt-spec-button-shape-next--filled { + color: @base; + background-color: @accent; + + &:hover { + background-color: lighten(@accent, 5%); + } + } + } + + .yt-spec-button-shape-next--disabled.yt-spec-button-shape-next--filled { + color: @subtext0; + background-color: fade(@surface1, 70%); + } + + /* Search box */ + + .ytSearchboxComponentInputBox, + .ytSearchboxComponentInputBoxDark { + background: var(--ytd-searchbox-background); + color: var(--ytd-searchbox-text-color); + border-color: var(--ytd-searchbox-border-color); + box-shadow: none; + } + + .ytSearchboxComponentInputBoxHasFocus, + .ytSearchboxComponentInputBoxHasFocusDark { + border-color: @accent; + } + + .ytSuggestionComponentPersonalizedSuggestion { + color: @text; + } + .ytSuggestionComponentHighlighted { + background: @surface1; + } + .ytSuggestionComponentLargerRemovedText { + color: @overlay1; + } + + .ytSearchboxComponentSuggestionsContainer, + .ytSearchboxComponentSuggestionsContainerDark { + background: var(--yt-spec-raised-background); + border-color: var(--yt-spec-raised-background); + } + + .ytSuggestionComponentSuggestion, + .ytSuggestionComponentSuggestionDark { + color: var(--ytd-searchbox-text-color); + } + + .ytSearchboxComponentSearchButton, + .ytSearchboxComponentSearchButtonDark { + color: var(--ytd-searchbox-text-color); + background: var(--yt-spec-raised-background); + border-color: var(--ytd-searchbox-border-color); + } + + .ytSearchboxComponentClearButtonIcon, + .ytSearchboxComponentClearButtonIconDark { + color: var(--ytd-searchbox-text-color); + } + + /* Video description */ + + // Video description background (collapsed on hover) + ytd-watch-metadata { + --yt-saturated-raised-background: @surface1 !important; + --yt-saturated-text-primary: @text !important; + --yt-saturated-text-secondary: @subtext1 !important; + } + // Video description text (expanded) + ytd-text-inline-expander + .ytAttributedStringLinkInheritColor:not( + .ytAttributedStringLink + ) { + color: @text !important; + } + // Video description YouTube links + .ytAttributedStringHighlightTextDecorator { + background-color: @surface2 !important; + } + + /* Links */ + .ytAttributedStringLinkCallToActionColor { + color: @accent; + } + + /* Course Playlist (e.g. https://www.youtube.com/playlist?list=PLZHQObOWTQDNPOjrT6KVlfJuKtYTftqH6) */ + .ytwCourseProgressViewModelHostProgressTitle, + .ytwCourseProgressViewModelHostProgressSubtitle { + color: @text; + } + .ytwCourseProgressViewModelHostProgressBar { + background-color: fade(@white, 20%); + + .ytwCourseProgressViewModelHostProgressBarFill { + background-color: @text; + } + } + + .ytwHowThisWasMadeSectionViewModelSectionTitle, + .ytwHowThisWasMadeSectionViewModelBodyHeader { + color: @text; + } + + .ytwHowThisWasMadeSectionViewModelBodyText { + color: @subtext0; + } + + // "Ask" - AI chat + .ytVideoDescriptionYouchatSectionViewModelSectionTitle { + color: @text; + } + .ytVideoDescriptionYouchatSectionViewModelSubHeaderText { + color: @subtext0; + } + .ytwYouChatItemViewModelHost { + color: @text; + } + .ytwYouChatChipsDataChip { + color: @text; + border-color: @surface2; + + &:hover { + background-color: @surface1; + } + } + .chatInputViewModelChatDisclaimer { + color: @subtext0; + } + + // Timeline/Transcript + .ytwTimelineChapterViewModelTitle, + .ytShelfHeaderLayoutTitle { + color: @text; + } + .ytwTranscriptSegmentViewModelHost { + color: @subtext0; + } + .ytwTranscriptSegmentViewModelTimestamp { + background-color: @surface2; + color: @subtext1; + } + .ytwTranscriptSegmentViewModelTimestampActive { + background-color: @overlay0; + color: @text; + } + + // Video Attributes (Music, Games) + .videoAttributesSectionViewModelTitle, + .ytVideoAttributeViewModelTitle { + color: @text; + } + .ytVideoAttributeViewModelSubtitle, + .ytVideoAttributeViewModelSecondarySubtitle { + color: @subtext1; + } + + /* Thumbnails */ + + .ytp-sb-unsubscribe { + background-color: @surface2; + color: @text; + } + .ytp-sb-subscribe { + background-color: @accent; + color: @base; + } + + // Watch progress bar + .ytThumbnailOverlayProgressBarHostWatchedProgressBar { + background-color: @surface2; + } + .ytThumbnailOverlayProgressBarHostWatchedProgressBarSegment { + background: @accent; + } + // Watch progress bar (legacy component) + ytd-thumbnail-overlay-resume-playback-renderer { + background-color: @surface2; + + #progress.ytd-thumbnail-overlay-resume-playback-renderer { + background: @accent; + } + } + + /* Panels, popups, tooltips */ + + .ytp-tooltip-bottom-text { + background: fade(@surface0, 90%); + color: @text; + text-shadow: none; + } + + .ytp-popup { + background: fade(@surface0, 90%); + text-shadow: none; + } + + .ytp-panel-menu, + .ytp-panel-header, + .ytp-panel-footer, + .ytp-menuitem-label, + .ytp-premium-label, + .ytp-menuitem-content, + .ytp-menuitem-label-count, + .ytp-menu-label-secondary, + .ytd-menu-title-renderer { + color: @text; + } + + .ytp-panel-footer-content-link { + color: @accent; + } + + .ytp-panel-back-button { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + } + + .ytp-menuitem[aria-checked="false"] .ytp-menuitem-toggle-checkbox { + &::after { + background-color: @overlay1; + } + } + .ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox { + background-color: @surface2; + + &::after { + background-color: @text; + } + } + + .ytp-menuitem { + &:not([aria-disabled="true"]):hover { + background-color: @surface1; + } + } + + /* Video player */ + + // Shorts and video hover preview progress bars + yt-progress-bar { + .ytProgressBarLineProgressBarPlayed, + .ytProgressBarPlayheadProgressBarPlayheadDot { + background: @accent; + } + + .ytProgressBarLineProgressBarHovered, + .ytProgressBarLineProgressBarBackground { + background: @text; // (background) opacity is already adequately set + } + } + + .ytp-cards-button { + .ytp-cards-button-icon { + use { + fill: @black; + } + path { + fill: @white; + } + } + } + .ytp-cards-teaser { + .ytp-cards-teaser-box { + background-color: @surface2; + border-bottom-color: @surface2; + } + .ytp-cards-teaser-text { + color: @text; + } + } + + .html5-video-player { + color: @white; + & when (@oled = 0) { + background-color: @crust; + } + + .ytp-swatch-background-color, + .ytp-play-progress { + background: @accent; + } + + .ytp-svg-fill, + [fill="#fff"] { + fill: @white; + } + + .ytp-volume-slider-handle { + &, + &::before { + background-color: @white; + } + &::after { + background-color: fade(@white, 20%); + } + } + + .ytp-time-current, + .ytp-time-separator, + .ytp-time-duration { + color: @white; + } + + .ytp-live-badge { + &[disabled]::before { + background: @accent; + } + &::before { + background: @overlay0; + } + } + + .ytp-button, + .ytp-subtitles-button { + &[aria-pressed]::after { + background-color: @accent; + } + } + + /* stats for nerds */ + .ytp-sfn { + background: fade(@base, 80%); + color: @text; + } + + .ytp-autonav-toggle-button { + background-color: @surface2; + + &::after { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + background-color: @overlay1; + } + + &[aria-checked="true"] { + &::after { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); + background-color: @white; + } + } + } + } + + /* Video highlight */ + ytd-rich-item-renderer.ytd-rich-item-renderer-highlight { + background-color: fade(@accent, 10%); + box-shadow: fade(@accent, 10%) 0 0 0 10px; + } + + #shorts-container { + --yt-spec-static-overlay-text-primary: @white; + + .YtwFactoidRendererLabel { + color: @subtext0; + } + .YtwFactoidRendererValue { + color: @text; + } + + ytd-reel-video-renderer:not([is-watch-while-mode]) { + .ytSpecButtonShapeWithLabelLabel { + color: @subtext1; + } + } + ytd-reel-video-renderer[is-watch-while-mode] + .ytSpecButtonShapeWithLabelLabel { + color: @white; + } + + .ytdVolumeControlsMuteIcon { + color: @white; + } + + /* Buy super thanks button */ + .YtdShortsSuggestedActionStaticHostContainer { + background-color: fade(@black, 60%); + + .YtdShortsSuggestedActionStaticHostLeadingIcon, + .YtdShortsSuggestedActionStaticHostPrimaryText { + color: @text; + } + } + } + // Video/thumbnail renderer overlayed buttons + .ytBadgeShapeThumbnailDefaultRedesign, // Timestamp + // Play Next + .yt-spec-button-shape-next--overlay-dark.yt-spec-button-shape-next--tonal[style="background-color: rgba(0, 0, 0, 0.3);"], + .ytdVolumeControlsBackgroundScrim, // Shorts Volume Slider + .ytInlinePlayerControlsTopRightControlsCircleButton // Homepage + { + background: fade(@black, 60%) !important; + color: @white; + } + + .yt-spec-button-shape-next--overlay-dark.yt-spec-button-shape-next--filled { + background: @accent; + color: @base; + } + + /* Video previews */ + + // Background (on hover) + .ytSpecTouchFeedbackShapeHoverEffect { + background-color: @surface0 !important; + } + // Title + .ytLockupMetadataViewModelTitle { + color: @text !important; + } + // Details + .ytLockupMetadataViewModelMetadata { + color: @subtext0 !important; + } + // Badges (e.g. "CC", "New") + .ytBadgeShapeDefault { + color: @subtext0; + background: @surface1; + + &.ytBadgeShapeModern { + background: none; + } + } + // "Fundraiser" + .ytBadgeShapeCommerce { + color: @green; + } + // "Live" + .ytBadgeShapeThumbnailLive { + background: @accent; + color: @base; + } + + /* Shorts titles and views on homepage */ + .shortsLockupViewModelHostOutsideMetadataEndpoint { + color: @text; + } + .shortsLockupViewModelHostOutsideMetadataSubhead { + color: @subtext0; + } + + /* Buy super thanks bar */ + #progressContainer.tp-yt-paper-progress { + background-color: @mantle; + } + + #comment-chip-container.yt-pdg-comment-chip-renderer, + .slider-knob-inner.tp-yt-paper-slider { + background: @accent; + } + + #primaryProgress.tp-yt-paper-progress { + background: linear-gradient(139deg, @peach, @maroon, @red, @pink); + } + + #container.ytd-pdg-comment-preview-renderer { + background-color: @mantle; + } + + #comment-chip-price.yt-pdg-comment-chip-renderer, + yt-icon.yt-pdg-comment-chip-renderer { + color: @crust; + } + + /* Avatar */ + .ytSpecAvatarShapeLiveRing::after { + background: @accent !important; + } + .ytSpecAvatarShapeLiveBadge { + background-color: @accent; + } + .ytSpecAvatarShapeLiveBadgeText { + color: @base; + } + + /* Channel pages */ + + // Channel name + .ytPageHeaderViewModelHost { + .ytPageHeaderViewModelTitle { + color: @text; + } + + // Subscribers and video statistics + .ytPageHeaderViewModelContentMetadata { + color: @subtext0; + } + + // Handle and verified checkmark + [style$="color: rgb(255, 255, 255);"] { + color: @text !important; + } + } + // Channel bio + .ytTruncatedTextHost { + color: @subtext0; + } + // "...More", "and X more links" + .ytAttributionViewModelSuffix .ytAttributedStringLinkCallToActionColor, + .ytTruncatedTextAbsoluteButton { + color: @text; + } + + // Channel tabs + .ytTabShapeTab { + color: @subtext1; + } + .ytTabShapeTabSelected { + color: @text; + } + .tabGroupShapeSlider { + background-color: @text; + } + .ytTabShapeHost:hover .ytTabShapeTabBar { + background-color: @subtext1; + } + + /* Components */ + + /* Menus and context sheets */ + .ytContextualSheetLayoutHost, ytd-menu-popup-renderer { + background-color: @mantle; + } + .ytListItemViewModelTappable:hover { + background-color: @surface0; + } + .ytPanelHeaderViewModelTitle, + .ytListItemViewModelTitle, + .ytListItemViewModelAccessory { + color: @text; + } + .ytListItemViewModelSubtitle { + color: @subtext1; + } + /* Dialogs */ + .ytSpecDialogLayoutHost { + background-color: @mantle; + + .ytDialogHeaderViewModelText { + color: @text; + } + } + + /* Dropdowns */ + .ytDropdownViewModelTitle { + color: @text; + } + .ytDropdownViewModelLabel { + color: @subtext0; + } + .ytDropdownViewModelSupportError { + color: @red; + } + .ytDropdownViewModelDropdownContainerErrorBorder { + border-color: @red; + } + .ytStandardsTextareaShapeTextareaContainerOutline:focus-within { + border-color: @text; + } + + /* Toggles/Switches */ + + .ytSwitchShapeTrack { + background-color: @surface2; + } + .ytSwitchShapeKnob { + background-color: @mantle; + } + .ytSwitchShapeTrackActive { + background-color: @accent; + } + + /* Textareas */ + .ytStandardsTextareaShapeTextarea { + color: @text; + } + .ytStandardsTextareaShapePlaceholder { + color: @subtext0; + } + .ytStandardsTextareaShapeTextarea::placeholder { + color: transparent !important; // defaults important overrides this + } + + /* Comments */ + .ytSubThreadConnection, + .ytSubThreadContinuation { + border-left-color: @surface1; + } + .ytSubThreadConnection { + border-bottom-color: @surface1; + } + .ytSubThreadHovered > .ytSubThreadThreadline .ytSubThreadConnection, + .ytSubThreadHovered > .ytSubThreadThreadline .ytSubThreadContinuation { + border-left-color: @overlay0; + } + .ytSubThreadHovered > .ytSubThreadThreadline .ytSubThreadConnection { + border-bottom-color: @overlay0; + } + + /* Profile Card */ + // (Click a user's profile picture in the comments to view.) + .ytProfileCardViewModelHost { + background-color: @mantle; + + // Name and handle + .ytProfileIdentityInfoViewModelChannelName, + .ytProfileIdentityInfoViewModelMetadataHandleWithBoldFont { + color: @text; + } + // Verification badge + .ytProfileIdentityInfoViewModelBadge { + filter: @text-filter; + } + // Statistics + .ytProfileIdentityInfoViewModelMetadataContent { + color: @subtext0; + } + + // Subsection (e.g. "On this channel") + .ytProfileInfoViewModelSectionTitle { + color: @text; + } + .ytProfileInfoViewModelSectionSubtitle { + color: @subtext1; + } + .ytProfileInfoViewModelSectionHeartIcon { + filter: @subtext1-filter; + } + + // Subsection - "Recent comments on this channel" + .ytCommentInteractionViewModelVideoTitle { + color: @text; + } + .ytCommentInteractionViewModelCommentContent { + color: @subtext1; + } + } + + /* Live chat replay */ + .ytVideoMetadataCarouselViewModelHost, + .YtVideoMetadataCarouselViewModelHost { + background-color: @surface0; + + .ytCarouselTitleViewModelTitle, + .YtCarouselTitleViewModelTitle, + .yt-core-attributed-string, + .yt-icon-shape { + color: @text; + } + .ytTextCarouselItemViewModelHost { + color: @subtext1; + } + } + + /* Category tag pills */ + .ytChipShapeInactive { + background-color: @surface0; + color: @text; + } + .ytChipShapeActive { + background-color: @accent; + color: @base; + } + } +} + +@-moz-document url-prefix("https://studio.youtube.com") { + :root[dark] { + #catppuccin(@darkFlavor); + } + :root { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + + [src="https://www.gstatic.com/youtube/img/creator/yt_studio_logo_white.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + &, + html, + html[dark], + html[dark][dark], + &[dark], + &[light], + [light], + html[light], + html[light][light] { + --yt-spec-black-pure-alpha-80: (null); + --yt-spec-black-pure-alpha-60: (null); + --yt-spec-black-1-alpha-98: (null); + --yt-spec-black-1-alpha-95: (null); + --iron-icon-fill-color: unset; + + --yt-spec-text-primary: @text; + --ytcp-text-primary: @text; + --ytcp-text-primary-inverse: @base; + --ytcp-static-overlay-text-primary-inverse: @base; + --ytcp-wordmark-text: @text; + --ytcp-text-secondary: @subtext0; + --ytcp-text-disabled: @subtext1; + --ytcp-overlay-text-primary: @overlay2; + + --ytcp-general-background-a: @base; + --yt-spec-base-background: @base; + --yt-spec-black-3: @base; + + --yt-spec-brand-background-solid: @mantle; + --ytcp-brand-background-solid: @mantle; + --yt-spec-raised-background: @mantle; + --ytcp-general-background-b: @mantle; + --ytcp-analytics-reach-background: @mantle; + --yt-spec-black-2: @mantle; + + --ytcp-general-background-c: @crust; + --ytcp-menu-background: @surface0; + + --ytcp-container-border-color: @surface0; + --ytcp-container-hovered-border-color: @surface0; + --ytcp-line-divider-solid: @surface0; + --ytcp-container-border-color-inverse: @subtext0; + --ytcp-line-divider-solid-inverse: @subtext0; + + --ytcp-call-to-action: @accent; + --ytcp-call-to-action-inverse: @mantle; + --ytcp-call-to-action-raised-background: @accent; + --yt-spec-brand-button-background: @accent; + --ytcp-call-to-action-raised-disabled: @surface2; + --ytcp-call-to-action-raised-disabled-background: @overlay2; + --ytcp-call-to-action-raised-background-inverse: @base; + --ytcp-call-to-action-raised-disabled-inverse: @surface2; + --ytcp-call-to-action-raised-disabled-background-inverse: @overlay2; + + --yt-spec-brand-background-primary: @surface0; + + --yt-compact-link-icon-color: @overlay2; + --ytcp-icon-active: @accent; + --ytcp-icon-inactive: @overlay2; + --ytcp-icon-disabled: @overlay0; + --ytcp-icon-active-inverse: @overlay1; + --ytcp-icon-disabled-inverse: @subtext1; + + --ytcp-error-red: @red; + --ytcp-badge-red: @red; + --ytcp-error-red-inverse: @red; + --ytcp-themed-red-inverse: @red; + --ytcp-themed-red: @accent; + --ytcp-themed-blue: @accent; + --ytcp-badge-blue: fade(@accent, 30%); + --ytcp-badge-blue-solid: @blue; + --ytcp-themed-blue-inverse: @blue; + --ytcp-themed-green: @green; + --ytmus-genre-primary-melon: @green; + --ytcp-themed-green-inverse: @green; + --ytcp-analytics-pine: @green; + --ytcp-analytics-pine-inverse: @green; + --ytcp-analytics-parrot: @green; + --ytcp-themed-yellow: @peach; + --ytmus-genre-primary-gold: @peach; + --ytcp-yellow-inverse: @peach; + --ytcp-badge-yellow: @peach; + --ytcp-analytics-yellow: @peach; + --ytcp-analytics-apricot: @peach; + --ytcp-suggested-action: @teal; + --ytcp-analytics-overview: @teal; + --ytcp-analytics-revenue: @teal; + --ytcp-analytics-default-secondary: @teal; + --ytcp-analytics-royal-blue: @lavender; + --ytcp-analytics-reach: @lavender; + --ytcp-analytics-audience: @lavender; + --ytcp-analytics-engagement: @pink; + --ytcp-analytics-revenue-secondary: @pink; + --ytcp-analytics-bubblegum: @flamingo; + --ytmus-genre-primary-ruby: @flamingo; + --ytmus-genre-primary-salmon: @mauve; + --ytmus-genre-primary-orange: @maroon; + --ytmus-genre-primary-sky: @sky; + --ytmus-genre-primary-sky-inverse: @sky; + + --yt-spec-badge-chip-background: @surface1; + --ytcp-focus-inverse: @accent; + --ytcp-focus: @accent; + --ytcp-selected-item: @accent; + --ytcp-hover-item: @overlay2; + --ytcp-chip-active-focus: @accent; + --ytcp-playhead: @overlay2; + --ytcp-playhead-inverse: @overlay2; + } + + ytcp-button.destructive.ytls-error-dialog { + color: @base; + } + + yt-formatted-string.ytls-error-dialog, + tp-yt-iron-icon.ytls-error-dialog { + color: @text; + } + } +} + +@-moz-document domain("m.youtube.com") { + html[darker-dark-theme] { + #catppuccin(@darkFlavor); + } + html { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + + background-color: @base !important; + color: @text !important; + + /* Ambient mode */ + #cinematics { + mix-blend-mode: lighten; + } + + .mobile-topbar-header[data-mode="watch"], + ytm-mobile-topbar-renderer:not([ambient-topbar]) { + background: @base; + } + + .mobile-topbar-header[data-mode="watch"] .mobile-topbar-logo, + .mobile-topbar-header[data-mode="watch"] .mobile-topbar-title, + .mobile-topbar-header[data-mode="watch"] .mobile-topbar-header-content { + color: @text; + } + + .yt-spec-bottom-sheet-layout__bottom-sheet-renderer-container, + .modern-styling { + background: @surface0; + } + + .yt-spec-bottom-sheet-layout__bottom-sheet-layout-header-wrapper { + border-bottom-color: @surface0; + } + + .yt-spec-bottom-sheet-layout__bottom-sheet-content { + color: @text; + } + + /* Comment box */ + .engagement-panel-container { + background: @mantle; + } + + /* Bottom bar */ + ytm-pivot-bar-renderer { + background: @mantle; + color: @text; + border-top-color: @surface0; + } + + /* Chips */ + .chip-bar { + background-color: @base; + } + + [chip-style*="STYLE_"] { + .chip-container { + color: @text; + background-color: @surface0; + } + + &.selected .chip-container { + color: @base; + background-color: @accent; + } + } + + /* Buttons */ + + .yt-spec-touch-feedback-shape--touch-response { + .yt-spec-touch-feedback-shape__fill { + background-color: @text; + } + + .yt-spec-touch-feedback-shape__stroke { + border-color: @surface1; + } + } + + .yt-spec-touch-feedback-shape--overlay-touch-response-inverse + .yt-spec-touch-feedback-shape__fill { + background-color: @accent; + } + .yt-spec-touch-feedback-shape--overlay-touch-response + .yt-spec-touch-feedback-shape__fill { + background-color: @text; + } + } +} diff --git a/styles/youtube/preview.webp b/styles/youtube/preview.webp deleted file mode 100644 index 98091dbe53..0000000000 --- a/styles/youtube/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:1e9d8e64822efa59ced67d7a3174a86777deb1705cfe9a5caff483d640b7d715 -size 1115368 diff --git a/styles/zen-browser-docs/README.md b/styles/zen-browser-docs/README.md new file mode 100644 index 0000000000..6b3656e6cd --- /dev/null +++ b/styles/zen-browser-docs/README.md @@ -0,0 +1,35 @@ + + + +

+ Logo
+ + Catppuccin for Zen Browser Docs + +

+ +

+ + +

+ +## Usage + +See [the userstyle usage instructions](https://userstyles.catppuccin.com/getting-started/usage/). + + +## ๐Ÿ’ Current Maintainer +- [ashish0kumar](https://github.com/ashish0kumar) + + +  + +

+ +

+ +

+ Copyright © 2021-present Catppuccin Org +

+ + diff --git a/styles/zen-browser-docs/catppuccin.user.less b/styles/zen-browser-docs/catppuccin.user.less new file mode 100644 index 0000000000..b8f5d4906f --- /dev/null +++ b/styles/zen-browser-docs/catppuccin.user.less @@ -0,0 +1,98 @@ +/* ==UserStyle== +@name Zen Browser Docs Catppuccin +@namespace github.com/catppuccin/userstyles/styles/zen-browser-docs +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/zen-browser-docs +@version 2026.08.16 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/zen-browser-docs/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Azen-browser-docs +@description Soothing pastel theme for Zen Browser Docs +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("zen-browser.app") { + :root[data-theme="light"], + .light { + #catppuccin(@lightFlavor); + } + + :root[data-theme="dark"], + .dark { + #catppuccin(@darkFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --zen-paper: @mantle; + --zen-dark: @subtext1; + --zen-subtle: @surface0; + + --color-fd-background: @mantle; + --color-fd-popover: @mantle; + --color-fd-secondary: @base; + --color-fd-accent: @surface0; + --color-fd-card: @crust; + --color-fd-border: @surface0; + --color-fd-ring: @overlay0; + + --color-fd-primary: @accent; + --color-fd-muted: fade(@subtext1, 5%); + + --color-fd-foreground: @subtext1; + --color-fd-accent-foreground: @subtext1; + --color-fd-card-foreground: @subtext1; + --color-fd-primary-foreground: @subtext1; + --color-fd-secondary-foreground: @subtext1; + --color-fd-popover-foreground: @subtext1; + --color-fd-muted-foreground: @subtext1; + + --color-blue-500: @blue; + --color-red-500: @red; + --color-orange-500: @peach; + + .text-coral, + .zen-link, + .extra a, + .text-\[\#fe846b\], + .text-\[\#f7a74b\], + .text-\[\#f76f53\], + .hover\:text-coral:hover { + color: @accent; + } + + .text-\[\#e3401f\], + .dark\:text-\[\#D02908\] { + color: @red; + } + + .hover\:text-fd-accent-foreground:hover { + color: @text; + } + + .dark\:text-white\/50 { + color: @subtext0; + } + + #nd-sidebar { + --color-fd-secondary: @base; + --color-fd-muted: fade(@subtext1, 5%); + --color-fd-muted-foreground: @text; + } + + img[src="/icon.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + } +} diff --git a/template/catppuccin.user.css b/template/catppuccin.user.css deleted file mode 100644 index 8f9bc3b05c..0000000000 --- a/template/catppuccin.user.css +++ /dev/null @@ -1,115 +0,0 @@ -/* ==UserStyle== -@name Catppuccin -@namespace github.com/catppuccin/userstyles/styles/ -@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/ -@version 0.0.1 -@updateURL https://github.com/catppuccin/userstyles/raw/main/styles//catppuccin.user.css -@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3A -@description Soothing pastel theme for -@author Catppuccin -@license MIT - -@preprocessor less -@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] -@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] -@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] -==/UserStyle== */ - -@-moz-document domain('') { - /* This section applies the light/dark themes automatically based on the user's system theme. - Use the below example CSS to start if the website you are theming doesn't have a light/dark mode toggle. - For an actual example of this, see https://github.com/catppuccin/userstyles/blob/39288b593278e5efa48007d5fc001292cf910672/styles/brave-search/catppuccin.user.css#L16-L29. - */ - @media (prefers-color-scheme: light) { - :root { - #catppuccin(@lightFlavor, @accentColor); - } - } - @media (prefers-color-scheme: dark) { - :root { - #catppuccin(@darkFlavor, @accentColor); - } - } - - /* If the website you are theming *does* have a light/dark mode toggle, - you can conditionally enable light/dark flavors by targeting whatever - attribute that website uses to indicate the theme. *The example below gives you an idea of what - to look for. The website you are theming may use a class-based approach (e.g. :root.theme-dark), - or any of the myriad of other methods like this.* - Use the below example CSS to start if this is the case. - For an actual example of this, see https://github.com/catppuccin/userstyles/blob/39288b593278e5efa48007d5fc001292cf910672/styles/youtube/catppuccin.user.css#L21-L30. - */ - :root[data-theme="dark"] { - #catppuccin(@darkFlavor, @accentColor); - } - :root[data-theme="light"] { - #catppuccin(@lightFlavor, @accentColor); - } - - #catppuccin(@lookup, @accent) { - @rosewater: @catppuccin[@@lookup][@rosewater]; - @flamingo: @catppuccin[@@lookup][@flamingo]; - @pink: @catppuccin[@@lookup][@pink]; - @mauve: @catppuccin[@@lookup][@mauve]; - @red: @catppuccin[@@lookup][@red]; - @maroon: @catppuccin[@@lookup][@maroon]; - @peach: @catppuccin[@@lookup][@peach]; - @yellow: @catppuccin[@@lookup][@yellow]; - @green: @catppuccin[@@lookup][@green]; - @teal: @catppuccin[@@lookup][@teal]; - @sky: @catppuccin[@@lookup][@sky]; - @sapphire: @catppuccin[@@lookup][@sapphire]; - @blue: @catppuccin[@@lookup][@blue]; - @lavender: @catppuccin[@@lookup][@lavender]; - @text: @catppuccin[@@lookup][@text]; - @subtext1: @catppuccin[@@lookup][@subtext1]; - @subtext0: @catppuccin[@@lookup][@subtext0]; - @overlay2: @catppuccin[@@lookup][@overlay2]; - @overlay1: @catppuccin[@@lookup][@overlay1]; - @overlay0: @catppuccin[@@lookup][@overlay0]; - @surface2: @catppuccin[@@lookup][@surface2]; - @surface1: @catppuccin[@@lookup][@surface1]; - @surface0: @catppuccin[@@lookup][@surface0]; - @base: @catppuccin[@@lookup][@base]; - @mantle: @catppuccin[@@lookup][@mantle]; - @crust: @catppuccin[@@lookup][@crust]; - @accent-color: @catppuccin[@@lookup][@@accent]; - - color-scheme: if(@lookup = latte, light, dark); - - ::selection { - background-color: fade(@accent-color, 30%); - } - - input, - textarea { - &::placeholder { - color: @subtext0 !important; - } - } - - /* Start styling your website here: */ - background-color: @base; - - /* If you need to specify an overwrite specific to a flavor - * (e.g. only when the flavor is set to latte), you can use a `when` guard clause. */ - & when (@lookup = latte) { - /* ... */ - } - /* You can also negate the statement above by using - * a `when not` guard clause. */ - & when not (@lookup = latte) { - /* ... */ - } - } -} - -/* prettier-ignore */ -@catppuccin: { - @latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; }; - @frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; }; - @macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; }; - @mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; }; -} - -// vim:ft=less diff --git a/template/catppuccin.user.less b/template/catppuccin.user.less new file mode 100644 index 0000000000..d90daf4b01 --- /dev/null +++ b/template/catppuccin.user.less @@ -0,0 +1,67 @@ +/* ==UserStyle== +@name Catppuccin +@namespace github.com/catppuccin/userstyles/styles/ +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/ +@version 2000.01.01 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles//catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3A +@description Soothing pastel theme for +@author Catppuccin +@license MIT + +@preprocessor less +@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha"] +@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappรฉ", "macchiato:Macchiato", "mocha:Mocha*"] +@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"] +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/std/v1.less"; + +@-moz-document domain("") { + /* This section applies the light/dark themes automatically based on the user's system theme. + Use the below example CSS to start if the website you are theming doesn't have a light/dark mode toggle. + For an actual example of this, see https://github.com/catppuccin/userstyles/blob/39288b593278e5efa48007d5fc001292cf910672/styles/brave-search/catppuccin.user.css#L16-L29. + */ + :root { + @media (prefers-color-scheme: light) { + #catppuccin(@lightFlavor); + } + @media (prefers-color-scheme: dark) { + #catppuccin(@darkFlavor); + } + } + + /* If the website you are theming *does* have a light/dark mode toggle, + you can conditionally enable light/dark flavors by targeting whatever + attribute that website uses to indicate the theme. *The example below gives you an idea of what + to look for. The website you are theming may use a class-based approach (e.g. :root.theme-dark), + or any of the myriad of other methods like this.* + Use the below example CSS to start if this is the case. + For an actual example of this, see https://github.com/catppuccin/userstyles/blob/39288b593278e5efa48007d5fc001292cf910672/styles/youtube/catppuccin.user.css#L21-L30. + */ + :root[data-theme="dark"] { + #catppuccin(@darkFlavor); + } + :root[data-theme="light"] { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + /* Start styling your website here: */ + background-color: @base; + + /* If you need to specify an overwrite specific to a flavor + * (e.g. only when the flavor is set to latte), you can use a `when` guard clause. */ + & when (@flavor = latte) { + /* ... */ + } + /* You can also negate the statement above by using + * a `when not` guard clause. */ + & when not(@flavor = latte) { + /* ... */ + } + } +} diff --git a/template/preview.webp b/template/preview.webp deleted file mode 100644 index d58ea81f46..0000000000 --- a/template/preview.webp +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:676bd77f20e746524ea7b3ccab01bb124546246d5f880e754f61109fc4191305 -size 21134