0
0
mirror of https://github.com/obsproject/obs-studio.git synced 2024-09-20 13:08:50 +02:00
obs-studio/UI/data/themes/Dark.qss
SuslikV 7656ee95db
UI: Remove scrollbar line controls for Dark theme
Fixes an issue when it's hard to perform drag-by-mouse move of the
scrollbar while handle is at corner and has minimum size.

Info: the handle minimum size styled as 20px, while add/sub-line is
14px, thus only 6px left for mouse drag when handle resides at corner.
While handle styled to cover whole bar including, subcontrol elements,
it is better to remove the hidden subcontrols completely.
2018-10-26 18:46:24 +02:00

691 lines
17 KiB
Plaintext

/******************************************************************************/
/* Copyright (C) 2014-2015 by Philippe Groarke <philippe.groarke@gmail.com> */
/* */
/* */
/* This program is free software: you can redistribute it and/or modify */
/* it under the terms of the GNU General Public License as published by */
/* the Free Software Foundation, either version 2 of the License, or */
/* (at your option) any later version. */
/* */
/* This program is distributed in the hope that it will be useful, */
/* but WITHOUT ANY WARRANTY; without even the implied warranty of */
/* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the */
/* GNU General Public License for more details. */
/* */
/* You should have received a copy of the GNU General Public License */
/* along with this program. If not, see <http://www.gnu.org/licenses/>. */
/******************************************************************************/
/* Colors */
/* rgb(225,224,225); /* veryLight */
/* rgb(200,199,200); /* lighter */
/* rgb(122,121,122); /* light */
/* rgb(88,87,88); /* kindaDark */
/* rgb(58,57,58); /* dark */
/* rgb(31,30,31); /* veryDark */
/* rgb(11,10,11); /* veryVeryDark */
/* rgb(42,130,218); /* blue */
/* Custom theme information. This will set the application's QPalette, as
* well as pass to QML via the OBSTheme object.
* Can also use OBSTheme::disabled, OBSTheme::active, and OBSTheme::inactive.
* Using it without will set all three (making 'active' a bit redundant) */
OBSTheme {
window: rgb(58,57,58); /* dark */
windowText: rgb(225,224,225); /* veryLight */
base: rgb(31,30,31); /* veryDark */
alternateBase: rgb(11,10,11); /* veryVeryDark */
text: rgb(225,224,225); /* veryLight */
button: rgb(88,87,88); /* kindaDark */
buttonText: rgb(225,224,225); /* veryLight */
brightText: rgb(200,199,200); /* lighter */
light: rgb(88,87,88); /* kindaDark */
mid: rgb(58,57,58); /* dark */
dark: rgb(31,30,31); /* veryDark */
shadow: rgb(11,10,11); /* veryVeryDark */
highlight: rgb(42,130,218); /* blue */
highlightText: rgb(0,0,0);
link: rgb(114, 162, 255); /* OBS blue */
linkVisited: rgb(114, 162, 255); /* OBS blue */
}
OBSTheme::disabled {
text: rgb(122,121,122); /* light */
buttonText: rgb(122,121,122); /* light */
brightText: rgb(122,121,122); /* light */
}
OBSTheme::inactive {
highlight: rgb(48,47,48);
highlightText: rgb(255, 255, 255);
}
/* General style, we override only what is needed. */
QWidget {
background-color: rgb(58,57,58); /* dark */
alternate-background-color: rgb(31,30,31); /* veryDark */
color: rgb(225,224,225); /* veryLight */
selection-background-color: rgb(42,130,218); /* blue */
selection-color: black;
}
* [frameShape="1"], * [frameShape="2"], * [frameShape="3"], * [frameShape="4"], * [frameShape="5"], * [frameShape="6"] {
border: 1px solid rgb(31,30,31);
}
/* Misc */
QWidget::disabled {
color: 2px solid rgb(200,199,200); /* lighter */
}
QAbstractItemView, QStackedWidget#stackedMixerArea QWidget {
background-color: rgb(31,30,31); /* veryDark */
}
QToolTip {
background-color: rgb(31,30,31); /* veryDark */
color: rgb(205,205,205);
border: none;
}
QMenuBar::item {
background-color: rgb(58,57,58); /* dark */
}
QListWidget::item:selected:!active {
color: rgb(255, 255, 255);
background-color: rgb(48,47,48);
}
/* Dock Widget */
QDockWidget::title {
text-align: center;
background-color: QLinearGradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 rgb(86,85,86),
stop: 0.1 rgb(82,81,82),
stop: 0.5 rgb(78,77,78),
stop: 0.9 rgb(74,73,74),
stop: 1 rgb(70,69,70));
}
QDockWidget::close-button, QDockWidget::float-button {
border: 1px solid transparent;
background: transparent;
padding: 0px;
}
QDockWidget::close-button:hover, QDockWidget::float-button:hover {
background: transparent;
}
QDockWidget::close-button:pressed, QDockWidget::float-button:pressed {
padding: 1px -1px -1px 1px;
}
/* Group Box */
QGroupBox {
border: 1px solid rgb(31,30,31); /* veryDark */;
border-radius: 5px;
padding-top: 16px;
}
/* ScrollBars */
::corner {
background-color: rgb(58,57,58); /* dark */
border: none;
}
QScrollBar:vertical {
background-color: rgb(58,57,58); /* dark */
width: 14px;
margin: 0px;
}
QScrollBar::handle:vertical {
background-color: QLinearGradient(x1: 0, y1: 0, x2: 1, y2: 0,
stop: 0 rgb(122,121,122), /* light */
stop: 0.25 rgb(100, 99, 100),
stop: 1 rgb(88,87,88)); /* kindaDark */
min-height: 20px;
margin: 2px;
border-radius: 5px;
border-width: 1px;
border: 1px solid rgb(31,30,31); /* veryDark */
}
QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical {
border: none;
background: none;
height: 0px;
}
QScrollBar::up-arrow:vertical, QScrollBar::down-arrow:vertical, QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
border: none;
background: none;
color: none;
}
QScrollBar:horizontal {
background-color: rgb(58,57,58); /* dark */
height: 14px;
margin: 0px;
}
QScrollBar::handle:horizontal {
background-color: QLinearGradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 rgb(122,121,122), /* light */
stop: 0.25 rgb(100, 99, 100),
stop: 1 rgb(88,87,88)); /* kindaDark */
min-width: 20px;
margin: 2px;
border-radius: 5px;
border-width: 1px;
border: 1px solid rgb(31,30,31); /* veryDark */
}
QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal {
border: none;
background: none;
width: 0px;
}
QScrollBar::left-arrow:horizontal, QScrollBar::right-arrow:horizontal, QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
border: none;
background: none;
color: none;
}
/* Scenes and Sources toolbar */
QToolBar {
background-color: rgb(58,57,58); /* dark */
border: none;
}
QToolButton:hover {
background-color: rgb(122,121,122); /* light */
border-radius: none;
}
QToolButton:pressed {
background-color: rgb(31,30,31); /* veryDark */
border-radius: none;
}
* [themeID="addIconSmall"] {
qproperty-icon: url(./Dark/plus.png);
}
* [themeID="removeIconSmall"] {
qproperty-icon: url(./Dark/minus.png);
}
* [themeID="propertiesIconSmall"] {
qproperty-icon: url(./Dark/cogwheel.png);
}
* [themeID="configIconSmall"] {
qproperty-icon: url(./Dark/cogwheel.png);
}
* [themeID="refreshIconSmall"] {
qproperty-icon: url(./Dark/refresh.png);
}
* [themeID="upArrowIconSmall"] {
qproperty-icon: url(./Dark/up_arrow.png);
}
* [themeID="downArrowIconSmall"] {
qproperty-icon: url(./Dark/down_arrow.png);
}
/* Tab Widget */
QTabWidget::pane { /* The tab widget frame */
border-top: 1px solid rgb(31,30,31); /* veryDark */
}
QTabWidget::tab-bar {
alignment: center;
}
QTabBar::tab {
background-color: rgb(88,87,88); /* kindaDark */
border: none;
padding: 5px;
min-width: 50px;
margin: 1px;
}
QTabBar::tab:top {
border-bottom: 1px transparent;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
QTabBar::tab:bottom {
padding-top: 1px;
margin-bottom: 4px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
height: 14px;
}
QTabBar::tab:selected {
background-color: rgb(31,30,31); /* veryDark */
}
QTabBar::tab:hover {
background-color: rgb(122,121,122); /* light */
}
QTabBar::tab:pressed {
background-color: rgb(31,30,31); /* veryDark */
}
/* ComboBox */
QComboBox {
background-color: QLinearGradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 rgb(86,85,86),
stop: 0.1 rgb(82,81,82),
stop: 0.5 rgb(78,77,78),
stop: 0.9 rgb(74,73,74),
stop: 1 rgb(70,69,70));
border-style: solid;
border: 1px;
border-radius: 3px;
border-color: rgb(31,30,31); /* veryDark */
padding: 2px;
padding-left: 10px;
}
QComboBox:hover {
background-color: QLinearGradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 rgb(111, 110, 101),
stop: 0.25 rgb(100, 99, 100),
stop: 1 rgb(88,87,88));
}
QComboBox::drop-down {
border:none;
border-left: 1px solid rgba(31,30,31,155); /* veryDark */
width: 20px;
}
QComboBox::down-arrow {
qproperty-alignment: AlignTop;
image: url(./Dark/updown.png);
width: 100%;
}
QComboBox:on {
background-color: rgb(31,30,31); /* veryDark */
}
QComboBox:editable {
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
}
QComboBox::drop-down:editable {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
QComboBox::down-arrow:editable {
qproperty-alignment: AlignTop;
image: url(./Dark/down_arrow.png);
width: 8%;
}
/* Textedits etc */
QLineEdit, QTextEdit, QPlainTextEdit {
background-color: rgb(31,30,31); /* veryDark */
border: none;
border-radius: 3px;
padding: 2px 2px 3px 7px;
}
OBSHotkeyWidget QLineEdit {
margin: 0px 3px 0px 0px;
}
/* Spinbox and doubleSpinbox */
QSpinBox, QDoubleSpinBox {
background-color: rgb(31,30,31); /* veryDark */
border: none;
border-radius: 3px;
margin: 0px 3px 0px 0px;
padding: 2px 2px 3px 7px;
}
QSpinBox::up-button, QDoubleSpinBox::up-button {
subcontrol-origin: margin;
subcontrol-position: top right; /* position at the top right corner */
background-color: rgb(88,87,88); /* kindaDark */
border: 1px solid rgb(31,30,31); /* veryDark */
border-radius: 3px;
border-width: 0;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-bottom-width: 0;
}
QSpinBox::down-button, QDoubleSpinBox::down-button {
subcontrol-origin: margin;
subcontrol-position: bottom right; /* position at the top right corner */
background-color: rgb(88,87,88); /* kindaDark */
border: 1px solid rgb(31,30,31); /* veryDark */
border-radius: 3px;
border-width: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
border-top-width: 0;
}
QSpinBox::up-button:hover, QSpinBox::down-button:hover, QDoubleSpinBox::up-button:hover, QDoubleSpinBox::down-button:hover {
background-color: rgb(122,121,122); /* light */
}
QSpinBox::up-button:pressed, QSpinBox::down-button:pressed, QDoubleSpinBox::up-button:pressed, QDoubleSpinBox::down-button:pressed {
background-color: rgb(58,57,58); /* dark */
}
QSpinBox::up-button:disabled, QSpinBox::up-button:off, QSpinBox::down-button:disabled, QSpinBox::down-button:off {
background-color: rgb(58,57,58); /* dark */
}
QDoubleSpinBox::up-button:disabled, QDoubleSpinBox::up-button:off, QDoubleSpinBox::down-button:disabled, QDoubleSpinBox::down-button:off {
background-color: rgb(58,57,58); /* dark */
}
QSpinBox::up-arrow, QDoubleSpinBox::up-arrow {
image: url(./Dark/up_arrow.png);
width: 100%;
}
QSpinBox::down-arrow, QDoubleSpinBox::down-arrow {
image: url(./Dark/down_arrow.png);
width: 100%;
}
/* Buttons */
QPushButton {
color: rgb(225,224,225); /* veryLight */
background-color: rgb(88,87,88); /* kindaDark */
border: none;
border-radius: 3px;
padding: 4px;
padding-left: 20px;
padding-right: 20px;
}
QPushButton::flat {
background-color: rgb(58,57,58); /* dark */
}
QPushButton:hover {
background-color: rgb(122,121,122); /* light */
}
QPushButton:pressed {
background-color: rgb(31,30,31); /* veryDark */
}
QPushButton:checked {
background-color: rgb(122,121,122); /* light */
}
QPushButton::menu-indicator {
image: url(./Dark/down_arrow.png);
subcontrol-position: right;
subcontrol-origin: padding;
width: 25px;
}
QPushButton[themeID="hotkeyButtons"] {
margin: 1px 2px;
}
/* Sliders */
QSlider::groove:horizontal {
background-color: QLinearGradient(x1: 0, y1: 1, x2: 0, y2: 0,
stop: 0 rgb(50, 49, 50), /* dark */
stop: 0.75 rgb(88,87,88)); /* kindaDark */
height: 4px;
border: none;
border-radius: 2px;
}
QSlider::handle:horizontal {
background-color: QLinearGradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 rgb(240,239,240), /* lighter */
stop: 0.25 rgb(200,199,200),
stop: 1 rgb(162,161,162)); /* light */
border: 1px solid rgb(58,57,58); /* dark */
border-radius: 3px;
height: 10px;
width: 18px;
margin: -3px 0; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */
}
QSlider::handle:horizontal:pressed {
background-color: QLinearGradient(x1: 0, y1: 1, x2: 0, y2: 0,
stop: 0 rgb(240,239,240), /* lighter */
stop: 0.25 rgb(200,199,200),
stop: 1 rgb(162,161,162)); /* light */
}
QSlider::sub-page:horizontal {
background-color: rgb(42,130,218); /* blue */
border-radius: 2px;
}
QSlider::sub-page:horizontal:disabled {
background-color: QLinearGradient(x1: 0, y1: 1, x2: 0, y2: 0,
stop: 0 rgb(31,30,31), /* veryDark */
stop: 0.75 rgb(50, 49, 50)); /* dark */
border-radius: 2px;
}
QSlider::groove:vertical {
background-color: QLinearGradient(x1: 1, y1: 0, x2: 0, y2: 0,
stop: 0 rgb(50, 49, 50), /* dark */
stop: 0.75 rgb(88,87,88)); /* kindaDark */
width: 4px;
border: none;
border-radius: 2px;
}
QSlider::handle:vertical {
background-color: QLinearGradient(x1: 1, y1: 0, x2: 0, y2: 0,
stop: 0 rgb(240,239,240), /* lighter */
stop: 0.25 rgb(200,199,200),
stop: 1 rgb(162,161,162)); /* light */
border: 1px solid rgb(58,57,58); /* dark */
border-radius: 3px;
width: 10px;
height: 18px;
margin: 0 -3px; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */
}
QSlider::handle:vertical:pressed {
background-color: QLinearGradient(x1: 1, y1: 0, x2: 0, y2: 0,
stop: 0 rgb(240,239,240), /* lighter */
stop: 0.25 rgb(200,199,200),
stop: 1 rgb(162,161,162)); /* light */
}
QSlider::add-page:vertical {
background-color: rgb(42,130,218); /* blue */
border-radius: 2px;
}
QSlider::add-page:vertical:disabled {
background-color: QLinearGradient(x1: 1, y1: 0, x2: 0, y2: 0,
stop: 0 rgb(31,30,31), /* veryDark */
stop: 0.75 rgb(50, 49, 50)); /* dark */
border-radius: 2px;
}
QSlider::handle:hover {
background-color: rgb(200,199,200); /* veryLight */
}
QSlider::handle:disabled {
background-color: rgb(122,121,122); /* light */
}
/* Volume Control */
VolumeMeter {
qproperty-backgroundNominalColor: rgb(38, 127, 38);
qproperty-backgroundWarningColor: rgb(127, 127, 38);
qproperty-backgroundErrorColor: rgb(127, 38, 38);
qproperty-foregroundNominalColor: rgb(76, 255, 76);
qproperty-foregroundWarningColor: rgb(255, 255, 76);
qproperty-foregroundErrorColor: rgb(255, 76, 76);
qproperty-magnitudeColor: rgb(0, 0, 0);
qproperty-majorTickColor: rgb(225,224,225); /* veryLight */
qproperty-minorTickColor: rgb(122,121,122); /* light */
}
/* Status Bar */
QStatusBar::item {
border: none;
}
/* Table View */
QTableView {
gridline-color: rgb(88,87,88); /* kindaDark */
}
QHeaderView::section {
background-color: rgb(58,57,58); /* dark */
color: rgb(225,224,225); /* veryLight */
border: 1px solid rgb(31,30,31); /* veryDark */;
border-radius: 5px;
}
/* Mute CheckBox */
MuteCheckBox {
outline: none;
}
MuteCheckBox::indicator:checked {
image: url(./Dark/mute.png);
}
MuteCheckBox::indicator:unchecked {
image: url(./Dark/unmute.png);
}
OBSHotkeyLabel[hotkeyPairHover=true] {
color: red;
}
/* Group Collapse Checkbox */
SourceTreeSubItemCheckBox {
background: transparent;
outline: none;
}
SourceTreeSubItemCheckBox::indicator {
width: 10px;
height: 10px;
}
SourceTreeSubItemCheckBox::indicator:checked {
image: url(./Dark/expand.png);
}
SourceTreeSubItemCheckBox::indicator:unchecked {
image: url(./Dark/collapse.png);
}
/* Label warning/error */
QLabel#warningLabel {
color: rgb(192, 128, 0);
font-weight: bold;
}
QLabel#errorLabel {
color: rgb(192, 0, 0);
font-weight: bold;
}
* [themeID="warning"] {
color: rgb(192, 128, 0);
font-weight: bold;
}
* [themeID="error"] {
color: rgb(192, 0, 0);
font-weight: bold;
}
* [themeID="good"] {
color: rgb(0, 192, 0);
font-weight: bold;
}
/* About dialog */
* [themeID="aboutName"] {
font-size: 36px;
font-weight: bold;
}
* [themeID="aboutVersion"] {
font-size: 16px;
margin-bottom: 20px;
}
* [themeID="aboutInfo"] {
margin-bottom: 20px;
}
* [themeID="aboutHLayout"] {
background-color: rgb(31, 30, 31); /* veryDark */
}
/* Preview background color */
* [themeID="displayBackgroundColor"] {
qproperty-displayBackgroundColor: rgb(76, 76, 76);
}