Skip to content

Commit

Permalink
feat(twitch): twitch docs (#1440)
Browse files Browse the repository at this point in the history 
Co-authored-by: uncenter <47499684+uncenter@users.noreply.github.com>
  • Loading branch information
@mxgic1337 @uncenter
mxgic1337 and uncenter authored Nov 11, 2024
1 parent 1cb386a commit 6cc113b
Showing 1 changed file with 377 additions and 1 deletion.
378 changes: 377 additions & 1 deletion styles/twitch/catppuccin.user.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
@name Twitch Catppuccin
@namespace github.com/catppuccin/userstyles/styles/twitch
@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/twitch
@version 1.3.6
@version 1.4.0
@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
Expand All @@ -16,6 +16,8 @@
==/UserStyle== */

@-moz-document domain("twitch.tv") {
@import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css");

.tw-root--theme-dark {
#catppuccin(@darkFlavor, @accentColor);
}
Expand Down Expand Up @@ -711,6 +713,380 @@
}
}

@-moz-document domain("dev.twitch.tv"), url-prefix("https://discuss.dev.twitch.com/embed/topics")
{
@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];

--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;

&,
body {
color: @text !important;
background: @base;
--primary-medium: @text;
--primary-low: @surface0;
scrollbar-color: @surface0 @mantle;
}

a.btn,
button.btn {
border-color: @accent-color;
background: @accent-color !important;
color: @base !important;
}

a.btn:hover,
button.btn:hover {
background: fade(@accent-color, 80%) !important;
}

/* Recent announcements */
.topics-list .topic-list-item .main-link a {
color: @accent-color;
}

.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-color, 10%) !important;
color: @text !important;
}
.nav__links a {
color: @text;

&:hover {
color: @subtext0;
}
&.active {
color: @accent-color;
border-color: @accent-color;
}
}
.nav__logo svg path {
fill: @text;
}
}

/* Footers */
.footer,
.dev-footer,
.subscribe-footer {
h5,
p,
a,
div {
color: @text !important;
}
a:hover {
color: @accent-color !important;
}

svg path {
fill: @text !important;
}

background: @crust;
}

.bright-cta {
* {
color: @mantle !important;
}
background: @accent-color;
}
.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-color !important;
border-color: @accent-color !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;
}
}

blockquote {
border-color: @accent-color;
background: @mantle;
}

.content,
.main,
.topics-list,
.doc-content {
background: @base;
border-color: @base !important;
}

code {
border-color: @accent-color !important;
background: fade(@accent-color, 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-color !important;
}
.pill-beta {
color: @base !important;
background: @yellow !important;
}

a {
color: @accent-color;
}

/* 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-color !important;
}
dl dd a.active-highlight::before {
border-left-color: @accent-color !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-color, 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-color !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-color !important;
}
.story__links a {
color: @base !important;
}

border-color: @surface0;
}

.submission .relative .outer {
svg path {
fill: @text;
}
button {
border-color: @accent-color !important;
}

.tag button {
background: @accent-color !important;
border-color: @accent-color !important;
}

.author {
color: @subtext0 !important;
}
background: @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; @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };
Expand Down

0 comments on commit 6cc113b

Please sign in to comment.