From cf404e7bd82ed8ccbe62a98ae9df93821506a448 Mon Sep 17 00:00:00 2001 From: Ryan Cao <70191398+ryanccn@users.noreply.github.com> Date: Sun, 30 Jul 2023 17:26:05 +0800 Subject: [PATCH] feat(github): enforce built-in theme --- src/userstyles.yml | 3 +- styles/github/README.md | 3 +- styles/github/catppuccin.user.css | 176 ++++++++++++++++-------------- 3 files changed, 100 insertions(+), 82 deletions(-) diff --git a/src/userstyles.yml b/src/userstyles.yml index acfb482f50..e0bae4aa86 100644 --- a/src/userstyles.yml +++ b/src/userstyles.yml @@ -120,7 +120,7 @@ userstyles: color: green readme: app-link: "https://chess.com" - current-maintainers: [ *coldenate, *isabelroses, *skelebro1 ] + current-maintainers: [*coldenate, *isabelroses, *skelebro1] cinny: name: Cinny category: messaging @@ -165,6 +165,7 @@ userstyles: category: productivity color: text readme: + usage: "Switch to a default GitHub light/dark theme for the best experience!" app-link: "https://github.com" current-maintainers: [*pocco81, *glowingumbreon] past-maintainers: [*andreasgrafen] diff --git a/styles/github/README.md b/styles/github/README.md index 7abffa14d2..24f9b5b390 100644 --- a/styles/github/README.md +++ b/styles/github/README.md @@ -36,7 +36,8 @@ - +## Usage +Switch to a default GitHub light/dark theme for the best experience! diff --git a/styles/github/catppuccin.user.css b/styles/github/catppuccin.user.css index ec9fb1de50..c061cf8cb6 100644 --- a/styles/github/catppuccin.user.css +++ b/styles/github/catppuccin.user.css @@ -144,6 +144,22 @@ #catppuccin(@darkFlavor, @accentColor); } + html:not([data-light-theme="light"]) body::after, html:not([data-dark-theme="dark"]) body::after { + position: fixed; + top: 0; + right: 0; + padding: 1rem; + margin: 1rem; + font-size: 0.9rem; + font-weight: 600; + border-radius: 0.5rem; + max-width: 40ch; + background-color: var(--color-danger-fg); + color: var(--color-header-bg); + content: "You're using an unsupported GitHub theme! Please switch to the default light/dark theme to get the best experience for the Catppuccin GitHub userstyle."; + z-index: 9999; + } + #coloredButton(@name, @color) { --color-btn-@{name}-text: @base; --color-btn-@{name}-bg: @color; @@ -663,24 +679,24 @@ .Button--danger { background: var(--color-btn-danger-bg) } - + /* Create PR button & New branch button */ .iRoQzU, .ifkUYV, .bOZDzN { background-color: @green; color: @base; } - + /* New branch dialog */ .jenxrv { background-color: @mantle; color: @text; } - + /* Branch drop down */ .fHiIQb { background-color: @surface0; } - + /* Compare button & Cancel new branch button */ .idPXPh, .epAEYw { @@ -766,7 +782,7 @@ .col-md-8 { background-color: @base; } - + .user-mention, .team-mention { color: @accent-color; } @@ -869,7 +885,7 @@ background-image: none; background-color: @accent-color; } - + /* Keyboard hint */ .bdgUpN, .hZMmEi .TextInput-icon, .hZMmEi .TextInput-action { @@ -877,19 +893,19 @@ background-color: @mantle; border-color: @surface0; } - + /* Merge icon */ .fMJQEf { color: @text; background-color: @overlay0; } - + /* Branch indicator */ .iVNDSi { color: @accent-color; background-color: fade(@accent-color, 10); } - + /* File view */ .hwnsNO { color: @text; @@ -897,34 +913,34 @@ background: @mantle; } } - + .dXveNa[data-no-visuals="true"] { color: @subtext0; } - + .dXveNa, .kbjJSF { background-color: @surface0; border-color: @surface1; } - + .gUecKw, .lcpiaz, .jolsUx, .fsSggy { background-color: @mantle; } - + .Cxvmo, .dhYcqs { color: @red; } - + .byJIBD, .dMLfZp[data-size="small"][data-no-visuals="true"] svg { color: @green; } - + .lmmHGT:not(:first-of-type), .fOEJrA, .fnFdxN, @@ -943,18 +959,18 @@ .dTxwit { color: @subtext0; } - + .gssqTz { color: @text !important; } - + .bPgnBp, .jMyfUO, .hfRvxg, .cBrzIN { color: @text; } - + .eLaeIt:hover:not([disabled]), .dMLfZp[data-size="small"][data-no-visuals="true"]:hover:not([disabled]), .bqDKPR[data-component="IconButton"][data-no-visuals], @@ -962,11 +978,11 @@ .icOaJE:hover:not([disabled]) { background-color: @surface0; } - + .icOaJE[aria-pressed="true"] { background-color: @surface0; } - + .cZRqXf { background-color: @surface0; &:active:not([disabled]), @@ -978,7 +994,7 @@ background-color: @surface1; } } - + .kdEavw, .ddNLNa, .jepClM, @@ -990,16 +1006,16 @@ background-color: @surface1 } } - + .juEfKr { border-color: @surface2; } - + .eUqMHM, .hSXtjz { background-color: @base; } - + .gtXnmh, .ukUXs, .giEfVQ, @@ -1008,7 +1024,7 @@ .kTUxDY { background-color: @mantle; } - + .hLwWNO .PRIVATE_TreeView-item-container, .hYaoHV, .rLhXz, @@ -1017,12 +1033,12 @@ .dEmXPQ { color: @text; } - + .bJBoUI, .iJtJJh { color: @accent-color; } - + .lhyFLG { background-color: @mantle; border-top: 1px solid @surface1; @@ -1030,23 +1046,23 @@ border-bottom-color: @surface1; border-left-color: @surface1; } - + .hUWqlv, .bJcMWH { color: @blue; } - + .gxGEao { border-bottom-color: @surface0; } - + .hLwWNO .PRIVATE_TreeView-item[aria-current="true"] > .PRIVATE_TreeView-item-container { background-color: @surface0; &::after { background-color: @accent-color; } } - + .dfAUyE, .gKuCoB, .bFrOJy { @@ -1055,7 +1071,7 @@ color: @text } } - + .cuqBaK, .fCAAcl, .dAXkSP { @@ -1065,13 +1081,13 @@ background: @surface0; } } - + @media (hover: hover) and (pointer: fine) { .rLhXz:hover:not([aria-disabled]) { background-color: @surface0; } } - + /* Projects */ .ksbilD, .cuaLcW, @@ -1088,7 +1104,7 @@ .AbCTW { background-color: @mantle; } - + .jEgFtJ, .lixtXZ:hover, .eNIoFu, @@ -1098,23 +1114,23 @@ .gIOnJa { background-color: @surface0; } - + .jBCpbB { color: @text; background-color: @surface0; } - + .kzrUhn.selected { background-color: @base; border-color: @surface0; color: @text; } - + .esIQoN, .kbjJSF:disabled { color: @subtext1; } - + .eJTCnd, .eTthoV { border-color: @surface0; @@ -1129,36 +1145,36 @@ color: @text; } } - + .ikTPpF { box-shadow: @base 0px 3px 6px; border-color: @surface0; } - + .cvveTk, .dwoION { background-color: @base; } - + .FKGWN { background-color: @base; border-color: @surface0; } - + .jEgFtJ::after { background-color: @accent-color; } - + .khCtfm:hover { background-color: @surface0; } - + .khCtfm, .khCtfm[data-component="leadingVisual"], .Tnbrt[data-component="IconButton"][data-no-visuals] { color: @subtext0; } - + .Tnbrt { &:active, &[aria-expanded="true"] { background-color: @surface2; @@ -1170,23 +1186,23 @@ .imsxCM { color: @text; - + .is-selected::after { background-color: @accent-color; } } - + .pxYjU { background-color: @mantle; color: @text; border-color: @surface0; } - + .ilLRrZ { color: @text; background-color: @surface1; } - + .cnIHxk { background-color: @surface0; color: @text; @@ -1195,11 +1211,11 @@ color: @crust; } } - + .ghFpol { background-color: @base; } - + .hVmCdl, .fqKZNC, .fZFWUy, @@ -1209,12 +1225,12 @@ .ekNmOn { color: @text; } - + .lixtXZ[data-component="IconButton"][data-no-visuals], .klUZzf:not(:first-of-type) { color: @subtext0; } - + .jvpWzR { &:hover { background-color: @surface1; @@ -1223,20 +1239,20 @@ color: @subtext0; } } - + .fZFWUy, .fzjwje { background-color: @base; } - + .cEYXBH { background-color: @accent-color; } - + .joxhcl, .hXyJIp, .fMkBhb > .segmentedControl-content { background-color: @mantle; } - + .dVFmxu, .gbKtit, .lnKxja, @@ -1250,7 +1266,7 @@ border-color: @surface0; } } - + .hJMtSk { color: @crust; background-color: @green; @@ -1259,7 +1275,7 @@ background-color: @overlay0; } } - + .iDiUTR { color: @text; background-color: @base; @@ -1268,12 +1284,12 @@ border-color: @surface1; } } - + .eQfJKc, .UHWYv { color: @red; } - + .jVIqnb { color: @red; background-color: @surface0; @@ -1282,15 +1298,15 @@ background-color: @red; } } - + .UHWYv:hover { background-color: fade(@red, 20) } - + .lmmHGT:hover { background-color: @surface0; } - + /* Project table view */ .hYdbWk, .gkeKEr, @@ -1307,13 +1323,13 @@ .dSHKOE { background-color: @base; } - + .gkWKRr { border-top-color: @surface0; border-right-color: @surface0; border-left-color: @surface0; } - + .hPQRKh { background-color: @surface0; &:hover:not([disabled]) { @@ -1323,7 +1339,7 @@ color: @subtext0; } } - + .kfwhFa { &:hover:not([disabled]) { background-color: @surface0; @@ -1332,17 +1348,17 @@ color: @subtext0; } } - + .jykkjb { background-color: @base; box-shadow: @crust 0px -2px 0px inset, @crust 0px 1px 0px inset; } - + .jhjELj, .ixTUPS { border-color: @surface1; } - + .gmscZx, .fUaEiu { &:hover:not([disabled]) { @@ -1357,15 +1373,15 @@ color: @subtext0; } } - + .cBssZb { color: @text; } - + .jhjELj::before { border-color: transparent transparent @surface1; } - + .fHpqaf, .bfQVnA, .iGxiw, @@ -1374,32 +1390,32 @@ .iQkwAM { color: @subtext0; } - + smt { background-color: @base; &:hover { background-color: @surface0; } } - + .dtTTcd { background-color: @base; &.hoverable:hover { background-color: @surface0; } } - + .pQcjM { border-color: @surface1; &.hoverable:hover { background-color: @surface0; } } - + .eTSXcP { background-color: @red; } - + .iGxiw { border-bottom-color: @surface1; } @@ -1633,4 +1649,4 @@ --jp-icon-contrast-color2: var(--color-scale-pink-6); --jp-icon-contrast-color3: var(--color-scale-blue-6); } -} \ No newline at end of file +}