diff --git a/styles/go.dev/catppuccin.user.css b/styles/go.dev/catppuccin.user.css index c0c5a6adb1..72b8b4783a 100644 --- a/styles/go.dev/catppuccin.user.css +++ b/styles/go.dev/catppuccin.user.css @@ -17,12 +17,12 @@ @-moz-document domain('go.dev') { @media (prefers-color-scheme: light) { - :root[data-theme='auto'] { + :root[data-theme="auto"] { #catppuccin(@lightFlavor, @accentColor); } } @media (prefers-color-scheme: dark) { - :root[data-theme='auto'] { + :root[data-theme="auto"] { #catppuccin(@darkFlavor, @accentColor); } } @@ -97,7 +97,7 @@ --color-text: @text; --color-text-link: @accent-color; --color-text-subtle: @subtext1; - --focus-box-shadow: 0 0 .0625rem .0625rem @accent-color; // Only modifies color; + --focus-box-shadow: 0 0 0.0625rem 0.0625rem @accent-color; // Only modifies color; --gray-2: @surface0; --gray-3: @text; --gray-6: @crust; @@ -112,8 +112,10 @@ // /dl page in go.dev .Downloads { div.filename img { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}') + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); } table.downloadtable { @@ -121,23 +123,32 @@ } } // Main Page Footer & Pkg.go Footer - .Footer, .go-Footer { + .Footer, + .go-Footer { background-color: @mantle; button[aria-label="Shorcuts Modal"] img.go-Icon { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); filter: none; } - img.Footer-gopher, img.go-Footer-gopher { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + img.Footer-gopher, + img.go-Footer-gopher { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); } - img.go-Footer-googleLogoImg, img.Footer-googleLogoImg { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + img.go-Footer-googleLogoImg, + img.Footer-googleLogoImg { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); } } // Main Page Footer Get Started @@ -163,34 +174,55 @@ fill: @accent-color; } - .LeftNav a.active, .LeftNav a:hover { + .LeftNav a.active, + .LeftNav a:hover { background-color: fade(@accent-color, 30%); img { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); } } // /solutions/use-cases & Why Use Go / 4 icons - .MarketingCardList, .WhyGo-reasons .WhyGo-reasonIcon { - img.LightMode-img[alt='cloud icon'], img.DarkMode-img[alt='cloud icon'], img[alt='Sphere'] { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); - } - - img.LightMode-img[alt='CLI icon'], img.DarkMode-img[alt='CLI icon'], img[alt='Command Line'] { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); - } - - img.LightMode-img[alt='web dev icon'], img.DarkMode-img[alt='web dev icon'], img[alt='Code'] { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); - } - - img.LightMode-img[alt='ops icon'], img.DarkMode-img[alt='ops icon'], img[alt='Sphere'][src="/images/icons/gear-dark.svg"], img[alt='Sphere'][src="/images/icons/gear.svg"] { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + .MarketingCardList, + .WhyGo-reasons .WhyGo-reasonIcon { + img.LightMode-img[alt="cloud icon"], + img.DarkMode-img[alt="cloud icon"], + img[alt="Sphere"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + img.LightMode-img[alt="CLI icon"], + img.DarkMode-img[alt="CLI icon"], + img[alt="Command Line"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + img.LightMode-img[alt="web dev icon"], + img.DarkMode-img[alt="web dev icon"], + img[alt="Code"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); + } + + img.LightMode-img[alt="ops icon"], + img.DarkMode-img[alt="ops icon"], + img[alt="Sphere"][src="/images/icons/gear-dark.svg"], + img[alt="Sphere"][src="/images/icons/gear.svg"] { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); } } // Mobile Nav Drawer @@ -211,28 +243,35 @@ } } // Run Button for Code Snippet - .Playground-runButton{ + .Playground-runButton { border-color: @accent-color; } // Go Main Header - .Site-header, .go-Header { + .Site-header, + .go-Header { background: @crust; - .Header-menuItem--active a, .go-Header-menuItem--active a { + .Header-menuItem--active a, + .go-Header-menuItem--active a { border-bottom-color: @accent-color; } // Mobile Burger Icon - button.Header-navOpen--white, button.go-Header-navOpen--white { - @svg: escape(''); - background-image: url('data:image/svg+xml,@{svg}'); + button.Header-navOpen--white, + button.go-Header-navOpen--white { + @svg: escape( + '' + ); + background-image: url("data:image/svg+xml,@{svg}"); filter: none; } } // 'What's Possible With Go' .WhyGo-reasons { .WhyGo-reasonPackagesHeader img { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); } .WhyGo-reasonShowMoreLink a { @@ -240,53 +279,83 @@ } img.WhyGo-reasonShowMoreImg { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); } } // /doc/install icon img.CopyPaste-icon { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); } // Go Main Logo - .Site-header .Header-logo, .NavigationDrawer-logo, .go-Header .go-Header-logo, .go-NavigationDrawer .go-NavigationDrawer-logo, .top-bar img.gopherlogo, .go-Main-headerLogo, .SearchResults-headerLogo img[alt="Go"] { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + .Site-header .Header-logo, + .NavigationDrawer-logo, + .go-Header .go-Header-logo, + .go-NavigationDrawer .go-NavigationDrawer-logo, + .top-bar img.gopherlogo, + .go-Main-headerLogo, + .SearchResults-headerLogo img[alt="Go"] { + @svg: escape( + '' + ); + 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}'); + .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}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); filter: none; } .SiteBreadcrumb .BreadcrumbNav-li::after { - @svg: escape(''); - 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}'); + @svg: escape( + '' + ); + 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}'); + .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}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); } // Code Snippet Highlights pre { @@ -308,12 +377,12 @@ @-moz-document domain('pkg.go.dev') { @media (prefers-color-scheme: light) { - :root[data-theme='auto'] { + :root[data-theme="auto"] { #catppuccin(@lightFlavor, @accentColor); } } @media (prefers-color-scheme: dark) { - :root[data-theme='auto']{ + :root[data-theme="auto"] { #catppuccin(@darkFlavor, @accentColor); } } @@ -356,14 +425,18 @@ // Pkg.go Carousel .go-Carousel { .go-Carousel-nextSlide img { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); filter: none; } .go-Carousel-prevSlide img { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); filter: none; } } @@ -373,8 +446,10 @@ } // Pkg.go Clipboard Icon .go-Clipboard img.go-Icon { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); filter: none; } // Pkg.go Header @@ -384,23 +459,30 @@ } // 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}'); + .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; } } // Triangle Icon - .go-Header, .go-Main-navMobile { - @svg: escape(''); - - img.go-Icon[alt='submenu dropdown icon'] { - content: url('data:image/svg+xml,@{svg}'); + .go-Header, + .go-Main-navMobile { + @svg: escape( + '' + ); + + img.go-Icon[alt="submenu dropdown icon"] { + content: url("data:image/svg+xml,@{svg}"); filter: none; } .go-Select { - background-image: url('data:image/svg+xml,@{svg}'); + background-image: url("data:image/svg+xml,@{svg}"); } } // Pkg.go Subheader @@ -408,13 +490,13 @@ background-color: @mantle; } // Pkg.go Fixed Header - .go-Main-header[data-raised='true'] { + .go-Main-header[data-raised="true"] { background-color: @crust; } // Pkg.go Package Documentation Mobile Dropdown Icon .go-Main-navMobile label.go-Label::before { - @svg:escape(''); - background-image: url('data:image/svg+xml,@{svg}'); + @svg:escape (''); + background-image: url("data:image/svg+xml,@{svg}"); } // Pkg.go Mobile Navigation Drawer .go-NavigationDrawer { @@ -441,16 +523,21 @@ 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'] { - @svg: escape(''); - - img, img.go-Icon, img.go-Icon:not(.go-Icon--accented){ - content: url('data:image/svg+xml,@{svg}'); + .Homepage-helpLink, .UnitFiles-titleLink, a[href='https://www.meetup.com/pro/go'], a[href='https://github.com/golang/go/wiki/Conferences'] + { + @svg: escape( + '' + ); + + img, + img.go-Icon, + img.go-Icon:not(.go-Icon--accented) { + content: url("data:image/svg+xml,@{svg}"); filter: none; } - a::after{ - background-image: url('data:image/svg+xml,@{svg}'); + a::after { + background-image: url("data:image/svg+xml,@{svg}"); } } // 'Jump to' Dialog - Desktop @@ -459,9 +546,11 @@ color: @crust; } - .go-Button[aria-label='Close'] img.go-Icon { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + .go-Button[aria-label="Close"] img.go-Icon { + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); filter: none; } } @@ -472,84 +561,110 @@ } } // Search Icon - .SearchResults-header, .go-SearchForm { + .SearchResults-header, + .go-SearchForm { button[aria-label="Submit search"] img.go-Icon { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @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}'); + @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}'); + .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}'); + @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}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); filter: none; } } .UnitDirectories img.go-Icon { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); filter: none; } .UnitFiles img.go-Icon { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @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}'); + 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}'); + 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}'); + 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}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); filter: none; } img.depsdev-Icon { - @svg: escape(''); - content: url('data:image/svg+xml,@{svg}'); + @svg: escape( + '' + ); + content: url("data:image/svg+xml,@{svg}"); } } } @@ -569,14 +684,15 @@ } } -@-moz-document url-prefix("https://go.dev/tour") { +@-moz-document url-prefix("https://go.dev/tour") +{ @media (prefers-color-scheme: light) { - :root[data-theme='auto'] { + :root[data-theme="auto"] { #catppuccin(@lightFlavor, @accentColor); } } @media (prefers-color-scheme: dark) { - :root[data-theme='auto'] { + :root[data-theme="auto"] { #catppuccin(@darkFlavor, @accentColor); } } @@ -630,7 +746,9 @@ color: @crust; } - h2, li, p { + h2, + li, + p { color: @text; } @@ -722,17 +840,17 @@ color: @crust; } - a#run{ + a#run { background-color: @accent-color; } - pre.info { background-color: @surface0 !important; } } - div[vertical-slide], div[horizontal-slide] { + div[vertical-slide], + div[horizontal-slide] { background-color: @surface2; } } @@ -749,7 +867,7 @@ background-color: @mantle; span.ng-binding { background-color: @base; - color: @accent-color + color: @accent-color; } .toc-lesson span.ng-binding { @@ -777,10 +895,11 @@ background-color: @base; .lesson.ng-scope { - background-color: @mantle + background-color: @mantle; } - h1, p { + h1, + p { color: @text; }