diff --git a/README.md b/README.md index 6b9137b..f0d9eaf 100644 --- a/README.md +++ b/README.md @@ -142,12 +142,20 @@ API credentials are optional — needed for Gelbooru and rate-limited sites. ## Theming -The app uses your OS native theme by default. To customize, create `custom.qss` in your data directory: +The app uses your OS native theme by default. To customize, copy a `.qss` file from the [`themes/`](themes/) folder to your data directory as `custom.qss`: - **Linux**: `~/.local/share/booru-viewer/custom.qss` - **Windows**: `%APPDATA%\booru-viewer\custom.qss` -A template is available in Settings > Theme > Create from Template. +A template is also available in Settings > Theme > Create from Template. + +### Included Themes + +Nord Catppuccin Mocha + +Gruvbox Solarized Dark + +Tokyo Night ## Settings diff --git a/screenshots/themes/catppuccin-mocha.png b/screenshots/themes/catppuccin-mocha.png new file mode 100644 index 0000000..2bf8de4 Binary files /dev/null and b/screenshots/themes/catppuccin-mocha.png differ diff --git a/screenshots/themes/gruvbox.png b/screenshots/themes/gruvbox.png new file mode 100644 index 0000000..a0d6a28 Binary files /dev/null and b/screenshots/themes/gruvbox.png differ diff --git a/screenshots/themes/nord.png b/screenshots/themes/nord.png new file mode 100644 index 0000000..edd474a Binary files /dev/null and b/screenshots/themes/nord.png differ diff --git a/screenshots/themes/solarized-dark.png b/screenshots/themes/solarized-dark.png new file mode 100644 index 0000000..646e769 Binary files /dev/null and b/screenshots/themes/solarized-dark.png differ diff --git a/screenshots/themes/tokyo-night.png b/screenshots/themes/tokyo-night.png new file mode 100644 index 0000000..f0e0480 Binary files /dev/null and b/screenshots/themes/tokyo-night.png differ diff --git a/themes/catppuccin-mocha.qss b/themes/catppuccin-mocha.qss new file mode 100644 index 0000000..00ae173 --- /dev/null +++ b/themes/catppuccin-mocha.qss @@ -0,0 +1,119 @@ +/* booru-viewer — Catppuccin Mocha */ + +QWidget { + background-color: #1e1e2e; + color: #cdd6f4; + font-size: 13px; +} + +QPushButton { + background-color: #313244; + color: #cdd6f4; + border: 1px solid #45475a; + border-radius: 6px; + padding: 5px 14px; +} +QPushButton:hover { + background-color: #45475a; + border-color: #cba6f7; +} +QPushButton:pressed { + background-color: #585b70; +} +QPushButton:checked { + background-color: #cba6f7; + color: #1e1e2e; + border-color: #cba6f7; +} + +QLineEdit, QSpinBox, QComboBox { + background-color: #313244; + color: #cdd6f4; + border: 1px solid #45475a; + border-radius: 6px; + padding: 4px 8px; + selection-background-color: #cba6f7; + selection-color: #1e1e2e; +} +QLineEdit:focus, QSpinBox:focus { + border-color: #cba6f7; +} + +QComboBox::drop-down { + border: none; + width: 20px; +} +QComboBox QAbstractItemView { + background-color: #313244; + color: #cdd6f4; + border: 1px solid #45475a; + selection-background-color: #45475a; +} + +QScrollBar:vertical { + background: #1e1e2e; + width: 10px; + border: none; +} +QScrollBar::handle:vertical { + background: #585b70; + border-radius: 4px; + min-height: 20px; +} +QScrollBar::handle:vertical:hover { background: #cba6f7; } +QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical { height: 0; } + +QScrollBar:horizontal { + background: #1e1e2e; + height: 10px; +} +QScrollBar::handle:horizontal { + background: #585b70; + border-radius: 4px; +} +QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal { width: 0; } + +QMenuBar, QMenu { + background-color: #1e1e2e; + color: #cdd6f4; + border: 1px solid #313244; +} +QMenu::item:selected { + background-color: #45475a; +} + +QStatusBar { + background-color: #1e1e2e; + color: #a6adc8; +} + +QSplitter::handle { + background: #45475a; + width: 2px; +} + +QLabel { background: transparent; } + +QSlider::groove:horizontal { + background: #313244; + height: 4px; + border-radius: 2px; +} +QSlider::handle:horizontal { + background: #cba6f7; + width: 12px; + margin: -4px 0; + border-radius: 6px; +} + +QTabBar::tab { + background: #313244; + color: #cdd6f4; + border: 1px solid #45475a; + padding: 6px 16px; + border-radius: 4px 4px 0 0; +} +QTabBar::tab:selected { + background: #45475a; + color: #cba6f7; +} diff --git a/themes/gruvbox.qss b/themes/gruvbox.qss new file mode 100644 index 0000000..6ad7576 --- /dev/null +++ b/themes/gruvbox.qss @@ -0,0 +1,116 @@ +/* booru-viewer — Gruvbox Dark */ + +QWidget { + background-color: #282828; + color: #ebdbb2; + font-size: 13px; +} + +QPushButton { + background-color: #3c3836; + color: #ebdbb2; + border: 1px solid #504945; + border-radius: 4px; + padding: 5px 14px; +} +QPushButton:hover { + background-color: #504945; + border-color: #fe8019; +} +QPushButton:pressed { + background-color: #fe8019; + color: #282828; +} +QPushButton:checked { + background-color: #fe8019; + color: #282828; + border-color: #fe8019; +} + +QLineEdit, QSpinBox, QComboBox, QTextEdit { + background-color: #3c3836; + color: #ebdbb2; + border: 1px solid #504945; + border-radius: 4px; + padding: 4px 8px; + selection-background-color: #fe8019; + selection-color: #282828; +} +QLineEdit:focus, QSpinBox:focus, QTextEdit:focus { + border-color: #fe8019; +} + +QComboBox::drop-down { border: none; width: 20px; } +QComboBox QAbstractItemView { + background-color: #3c3836; + color: #ebdbb2; + border: 1px solid #504945; + selection-background-color: #504945; +} + +QScrollBar:vertical { + background: #282828; + width: 10px; + border: none; +} +QScrollBar::handle:vertical { + background: #665c54; + border-radius: 4px; + min-height: 20px; +} +QScrollBar::handle:vertical:hover { background: #fe8019; } +QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical { height: 0; } + +QScrollBar:horizontal { + background: #282828; + height: 10px; +} +QScrollBar::handle:horizontal { + background: #665c54; + border-radius: 4px; +} +QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal { width: 0; } + +QMenuBar, QMenu { + background-color: #282828; + color: #ebdbb2; + border: 1px solid #3c3836; +} +QMenu::item:selected { + background-color: #504945; +} + +QStatusBar { + background-color: #282828; + color: #a89984; +} + +QSplitter::handle { + background: #504945; + width: 2px; +} + +QLabel { background: transparent; } + +QSlider::groove:horizontal { + background: #3c3836; + height: 4px; + border-radius: 2px; +} +QSlider::handle:horizontal { + background: #fe8019; + width: 12px; + margin: -4px 0; + border-radius: 6px; +} + +QTabBar::tab { + background: #3c3836; + color: #ebdbb2; + border: 1px solid #504945; + padding: 6px 16px; +} +QTabBar::tab:selected { + background: #504945; + color: #fe8019; +} diff --git a/themes/nord.qss b/themes/nord.qss new file mode 100644 index 0000000..6a9823c --- /dev/null +++ b/themes/nord.qss @@ -0,0 +1,119 @@ +/* booru-viewer — Nord */ + +QWidget { + background-color: #2e3440; + color: #d8dee9; + font-size: 13px; +} + +QPushButton { + background-color: #3b4252; + color: #d8dee9; + border: 1px solid #4c566a; + border-radius: 4px; + padding: 5px 14px; +} +QPushButton:hover { + background-color: #434c5e; + border-color: #88c0d0; +} +QPushButton:pressed { + background-color: #4c566a; +} +QPushButton:checked { + background-color: #5e81ac; + color: #eceff4; + border-color: #5e81ac; +} + +QLineEdit, QSpinBox, QComboBox { + background-color: #3b4252; + color: #eceff4; + border: 1px solid #4c566a; + border-radius: 4px; + padding: 4px 8px; + selection-background-color: #5e81ac; + selection-color: #eceff4; +} +QLineEdit:focus, QSpinBox:focus { + border-color: #88c0d0; +} + +QComboBox::drop-down { + border: none; + width: 20px; +} +QComboBox QAbstractItemView { + background-color: #3b4252; + color: #d8dee9; + border: 1px solid #4c566a; + selection-background-color: #434c5e; +} + +QScrollBar:vertical { + background: #2e3440; + width: 10px; + border: none; +} +QScrollBar::handle:vertical { + background: #4c566a; + border-radius: 4px; + min-height: 20px; +} +QScrollBar::handle:vertical:hover { background: #5e81ac; } +QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical { height: 0; } + +QScrollBar:horizontal { + background: #2e3440; + height: 10px; +} +QScrollBar::handle:horizontal { + background: #4c566a; + border-radius: 4px; +} +QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal { width: 0; } + +QMenuBar, QMenu { + background-color: #2e3440; + color: #d8dee9; + border: 1px solid #3b4252; +} +QMenu::item:selected { + background-color: #434c5e; +} + +QStatusBar { + background-color: #2e3440; + color: #81a1c1; +} + +QSplitter::handle { + background: #4c566a; + width: 2px; +} + +QLabel { background: transparent; } + +QSlider::groove:horizontal { + background: #3b4252; + height: 4px; + border-radius: 2px; +} +QSlider::handle:horizontal { + background: #88c0d0; + width: 12px; + margin: -4px 0; + border-radius: 6px; +} + +QTabBar::tab { + background: #3b4252; + color: #d8dee9; + border: 1px solid #4c566a; + padding: 6px 16px; +} +QTabBar::tab:selected { + background: #434c5e; + color: #88c0d0; + border-bottom-color: #88c0d0; +} diff --git a/themes/solarized-dark.qss b/themes/solarized-dark.qss new file mode 100644 index 0000000..2ba246a --- /dev/null +++ b/themes/solarized-dark.qss @@ -0,0 +1,116 @@ +/* booru-viewer — Solarized Dark */ + +QWidget { + background-color: #002b36; + color: #839496; + font-size: 13px; +} + +QPushButton { + background-color: #073642; + color: #93a1a1; + border: 1px solid #586e75; + border-radius: 4px; + padding: 5px 14px; +} +QPushButton:hover { + background-color: #586e75; + color: #fdf6e3; +} +QPushButton:pressed { + background-color: #268bd2; + color: #fdf6e3; +} +QPushButton:checked { + background-color: #268bd2; + color: #fdf6e3; + border-color: #268bd2; +} + +QLineEdit, QSpinBox, QComboBox, QTextEdit { + background-color: #073642; + color: #93a1a1; + border: 1px solid #586e75; + border-radius: 4px; + padding: 4px 8px; + selection-background-color: #268bd2; + selection-color: #fdf6e3; +} +QLineEdit:focus, QSpinBox:focus, QTextEdit:focus { + border-color: #268bd2; +} + +QComboBox::drop-down { border: none; width: 20px; } +QComboBox QAbstractItemView { + background-color: #073642; + color: #93a1a1; + border: 1px solid #586e75; + selection-background-color: #586e75; +} + +QScrollBar:vertical { + background: #002b36; + width: 10px; + border: none; +} +QScrollBar::handle:vertical { + background: #586e75; + border-radius: 4px; + min-height: 20px; +} +QScrollBar::handle:vertical:hover { background: #268bd2; } +QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical { height: 0; } + +QScrollBar:horizontal { + background: #002b36; + height: 10px; +} +QScrollBar::handle:horizontal { + background: #586e75; + border-radius: 4px; +} +QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal { width: 0; } + +QMenuBar, QMenu { + background-color: #002b36; + color: #839496; + border: 1px solid #073642; +} +QMenu::item:selected { + background-color: #073642; +} + +QStatusBar { + background-color: #002b36; + color: #586e75; +} + +QSplitter::handle { + background: #586e75; + width: 2px; +} + +QLabel { background: transparent; } + +QSlider::groove:horizontal { + background: #073642; + height: 4px; + border-radius: 2px; +} +QSlider::handle:horizontal { + background: #268bd2; + width: 12px; + margin: -4px 0; + border-radius: 6px; +} + +QTabBar::tab { + background: #073642; + color: #839496; + border: 1px solid #586e75; + padding: 6px 16px; +} +QTabBar::tab:selected { + background: #586e75; + color: #fdf6e3; +} diff --git a/themes/tokyo-night.qss b/themes/tokyo-night.qss new file mode 100644 index 0000000..5ed7858 --- /dev/null +++ b/themes/tokyo-night.qss @@ -0,0 +1,116 @@ +/* booru-viewer — Tokyo Night */ + +QWidget { + background-color: #1a1b26; + color: #a9b1d6; + font-size: 13px; +} + +QPushButton { + background-color: #24283b; + color: #a9b1d6; + border: 1px solid #3b4261; + border-radius: 4px; + padding: 5px 14px; +} +QPushButton:hover { + background-color: #3b4261; + border-color: #7aa2f7; +} +QPushButton:pressed { + background-color: #7aa2f7; + color: #1a1b26; +} +QPushButton:checked { + background-color: #7aa2f7; + color: #1a1b26; + border-color: #7aa2f7; +} + +QLineEdit, QSpinBox, QComboBox, QTextEdit { + background-color: #24283b; + color: #a9b1d6; + border: 1px solid #3b4261; + border-radius: 4px; + padding: 4px 8px; + selection-background-color: #7aa2f7; + selection-color: #1a1b26; +} +QLineEdit:focus, QSpinBox:focus, QTextEdit:focus { + border-color: #7aa2f7; +} + +QComboBox::drop-down { border: none; width: 20px; } +QComboBox QAbstractItemView { + background-color: #24283b; + color: #a9b1d6; + border: 1px solid #3b4261; + selection-background-color: #3b4261; +} + +QScrollBar:vertical { + background: #1a1b26; + width: 10px; + border: none; +} +QScrollBar::handle:vertical { + background: #3b4261; + border-radius: 4px; + min-height: 20px; +} +QScrollBar::handle:vertical:hover { background: #7aa2f7; } +QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical { height: 0; } + +QScrollBar:horizontal { + background: #1a1b26; + height: 10px; +} +QScrollBar::handle:horizontal { + background: #3b4261; + border-radius: 4px; +} +QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal { width: 0; } + +QMenuBar, QMenu { + background-color: #1a1b26; + color: #a9b1d6; + border: 1px solid #24283b; +} +QMenu::item:selected { + background-color: #3b4261; +} + +QStatusBar { + background-color: #1a1b26; + color: #565f89; +} + +QSplitter::handle { + background: #3b4261; + width: 2px; +} + +QLabel { background: transparent; } + +QSlider::groove:horizontal { + background: #24283b; + height: 4px; + border-radius: 2px; +} +QSlider::handle:horizontal { + background: #7aa2f7; + width: 12px; + margin: -4px 0; + border-radius: 6px; +} + +QTabBar::tab { + background: #24283b; + color: #a9b1d6; + border: 1px solid #3b4261; + padding: 6px 16px; +} +QTabBar::tab:selected { + background: #3b4261; + color: #7aa2f7; +}