diff --git a/scripts/userstyles.yml b/scripts/userstyles.yml index 57c1872f88..1015378e73 100644 --- a/scripts/userstyles.yml +++ b/scripts/userstyles.yml @@ -854,6 +854,13 @@ userstyles: icon: searxng color: blue current-maintainers: [*Sekki21956, *ryanccn] + servarr: + name: Servarr + link: https://wiki.servarr.com + categories: [entertainment] + icon: radarr + color: yellow + current-maintainers: [*gradylink] seventv: name: 7TV link: https://7tv.app diff --git a/styles/servarr/catppuccin.user.less b/styles/servarr/catppuccin.user.less new file mode 100644 index 0000000000..35747663df --- /dev/null +++ b/styles/servarr/catppuccin.user.less @@ -0,0 +1,277 @@ +/* ==UserStyle== +@name Servarr Catppuccin +@namespace github.com/catppuccin/userstyles/styles/servarr +@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/servarr +@version 2000.01.01 +@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/servarr/catppuccin.user.less +@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aservarr +@description Soothing pastel theme for Servarr +@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 text urls "URL(s) for Servarr Applications" "127\.0\.0\.1\:7878,0\.0\.0\.0\:7878,localhost\:7878,127\.0\.0\.1\:8989,0\.0\.0\.0\:8989,localhost\:8989,127\.0\.0\.1\:8686,0\.0\.0\.0\:8686,localhost\:8686,127\.0\.0\.1\:8787,0\.0\.0\.0\:8787,localhost\:8787,127\.0\.0\.1\:9696,0\.0\.0\.0\:9696,localhost\:9696,127\.0\.0\.1\:6969,0\.0\.0\.0\:6969,localhost\:6969" +==/UserStyle== */ + +@import "https://userstyles.catppuccin.com/lib/lib.less"; + +@-moz-document regexp( + replace(replace(%("https?://(%s)/.*", @urls), ",", "|", "g"), " ", "", "g") +) { + :root[style*="--textColor: #ccc"] { + #catppuccin(@darkFlavor); + } + :root[style*="--defaultColor: #333"] { + #catppuccin(@lightFlavor); + } + + #catppuccin(@flavor) { + #lib.palette(); + #lib.defaults(); + + --textColor: @text !important; + --defaultColor: @text !important; + --helpTextColor: @subtext0 !important; + --toolbarColor: @text !important; + --toolbarLabelColor: @text !important; + --toobarButtonHoverColor: @accent !important; + --pageBackground: @base !important; + --toolbarBackgroundColor: @crust !important; + --pageHeaderBackgroundColor: @mantle !important; + --borderColor: @surface2 !important; + --cardBackgroundColor: @mantle !important; + --cardAlternateBackgroundColor: @mantle !important; + --cardCenterBackgroundColor: @base !important; + --iconButtonDisabledColor: @overlay0 !important; + --iconButtonHoverColor: @accent !important; + --collapseButtonBackgroundColor: @crust !important; + --searchIconContainerBackgroundColor: @base !important; + --tableRowHoverBackgroundColor: @mantle !important; + --modalBackgroundColor: @base !important; + --inverseLabelColor: @surface0 !important; + --inverseLabelTextColor: @text !important; + --progressBarBackgroundColor: @crust !important; + --toolbarMenuItemBackgroundColor: @mantle !important; + --sliderAccentColor: @accent !important; + --disabledLabelColor: @surface0 !important; + --disabledInputColor: @overlay0 !important; + --modalCloseButtonHoverColor: @subtext0 !important; + --forgotPasswordColor: @subtext0 !important; + --forgotPasswordAltColor: @text !important; + + --addArtistBackgroundColor: @mantle !important; + --addSeriesBackgroundColor: @mantle !important; + --addMovieBackgroundColor: @mantle !important; + --artistBackgroundColor: @mantle !important; + --seriesBackgroundColor: @mantle !important; + --movieBackgroundColor: @mantle !important; + + --sidebarColor: @text !important; + --sidebarBackgroundColor: @mantle !important; + --sidebarActiveBackgroundColor: @surface0 !important; + + --inputBackgroundColor: @base !important; + --inputBorderColor: @surface2 !important; + --inputFocusBorderColor: @accent !important; + --inputFocusBoxShadowColor: rgba(#lib.rgbify(@accent) [], 0.6) !important; + --inputHoverBackgroundColor: @mantle !important; + --inputReadOnlyBackgroundColor: @base !important; + + --popoverArrowBorderInverseColor: @base !important; + --popoverArrowBorderColor: @mantle !important; + --popoverTitleBackgroundColor: @crust !important; + --popoverTitleBorderColor: @crust !important; + --popoverBodyBackgroundColor: @mantle !important; + + --defaultButtonTextColor: @text !important; + --defaultButtonBackgroundColor: @base !important; + --defaultBackgroundColor: @base !important; + --defaultBorderColor: @surface2 !important; + --defaultHoverBackgroundColor: @surface0 !important; + --defaultHoverBorderColor: @overlay0 !important; + + --primaryBackgroundColor: @accent !important; + --primaryBorderColor: @accent !important; + --primaryHoverBackgroundColor: @accent !important; + --primaryHoverBorderColor: @accent !important; + + --dangerBackgroundColor: @red !important; + --dangerBorderColor: @red !important; + --dangerHoverBackgroundColor: @red !important; + --dangerHoverBorderColor: @red !important; + + --successBackgroundColor: @green !important; + --successBorderColor: @green !important; + --successHoverBackgroundColor: @green !important; + --successHoverBorderColor: @green !important; + + --calendarBackgroundColor: @mantle !important; + --calendarBorderColor: @surface0 !important; + --calendarTodayBackgroundColor: @crust !important; + + --menuItemColor: @text !important; + --menuItemHoverColor: @accent !important; + --toolbarMenuItemHoverBackgroundColor: @base !important; + + --white: @text !important; + --offWhite: @text !important; + --primaryColor: @accent !important; + --themeRed: @red !important; + --dangerColor: @red !important; + --warningColor: @yellow !important; + --successColor: @green !important; + --themeBlue: @accent !important; + --themeAlternateBlue: @accent !important; + --themeDarkColor: @surface1 !important; + --themeLightColor: @surface0 !important; + --disabledColor: @overlay0 !important; + --purple: @mauve !important; + --infoColor: @blue !important; + --gray: @text !important; + --darkGray: @subtext0 !important; + --mediumGray: @subtext1 !important; + --linkColor: @accent !important; + --linkHoverColor: @accent !important; + --alertInfoColor: @text !important; + --alertInfoBackgroundColor: rgba(#lib.rgbify(@blue) [], 0.2) !important; + --alertInfoBorderColor: rgba(#lib.rgbify(@blue) [], 0.4) !important; + --torrentColor: @green !important; + --usenetColor: @blue !important; + --advancedFormLabelColor: @peach !important; + --chartBackgroundColor: @mantle !important; + --queueColor: @mauve !important; + --lidarrGreen: @green !important; + + legend[class*="FieldSet-legend"] { + border-color: @overlay0; + } + + div[class*="CheckInput-input"] { + &[class*="CheckInput-isNotChecked"] { + background-color: @mantle; + border-color: @surface2; + } + + &[class*="CheckInput-primary"] { + color: @base; + + // Needed for Lidarr because checkboxes use --lidarr-green there. + background-color: @accent; + border-color: @accent; + } + } + + span[class*="Label-label"] { + &[class*="Label-danger"], + &[class*="Label-warning"], + &[class*="Label-success"], + &[class*="Label-info"], + &[class*="Label-primary"], + &[class*="ProtocolLabel-torrent"], + &[class*="ProtocolLabel-usenet"], + &[class*="PrivacyLabel-semiPrivateLabel"], + &[class*="PrivacyLabel-publicLabel"], + &[class*="PrivacyLabel-privateLabel"] { + color: @base; + } + } + + a[class*="SeriesDetails-seriesNavigationButton"] { + color: @overlay0; + } + + button[class*="Button-primary"], + button[class*="Button-danger"], + button[class*="Button-success"] { + color: @base; + } + + svg[class*="Updates-upToDateIcon"], + svg[class*="SelectIndexerRow-alreadyExistsIcon"] { + color: @green; + } + + svg[class*="LogsTableRow-info"] { + color: @blue; + } + + div[class*="Updates-info"] { + border-color: @surface2; + } + + div[class*="QualityDefinition-thumb"] { + background-color: @base; + } + + // believe it or not this is actually how it's selected in original styles (well .generated-class instead but u get it) + div[class*="QualityDefinition-track"]:nth-child(3n+1) { + background-color: @overlay0 !important; + } + + div[class*="ProgressBar-container"] { + background-color: @surface1; + } + + div[class*="FormInputGroup-inputUnit"] { + color: @subtext0; + } + + div[class*="SeriesDetailsSeason-sizeOnDisk"] { + color: @subtext0; + } + + button[class*="PageJumpBarItem-jumpBarItem"]:hover { + color: @accent; + } + + div[class*="Tooltip-tooltip"] { + background-color: @base; + } + + td[class*="TableRowCell-cell"] { + border-color: @surface2; + } + + a[class*="Settings-link"] { + &:hover { + color: @accent; + } + + border-color: @overlay2; + } + + div[class*="styles-logoContainer"] { + border-color: @surface2; + } + + button[class*="EnhancedSelectInput-isDisabled"] { + opacity: 1; + } + + a[class*="PageHeader-donate"]:hover { + color: @red; + } + + a[class*="PageHeader-translation"], + a[class*="PageHeader-translate"] { + color: @text; + + &:hover { + color: @accent; + } + } + + button[class*="PageHeaderActionsMenu-menuButton"]:hover { + color: @subtext0; + } + + // Only used on the login page? + .button { + color: @base; + } + } +}