2826 lines
63 KiB
Plaintext
2826 lines
63 KiB
Plaintext
/* ------------------------------------------------------------------------- *
|
|
* *
|
|
* IMPORTANT *
|
|
* *
|
|
* ------------------------------------------------------------------------- *
|
|
* *
|
|
* Yami contains many core definitions for the appearance of widgets
|
|
* throughout the app.
|
|
*
|
|
* If you are developing a custom theme it is HIGHLY RECOMMENDED that you
|
|
* use Yami as a Base and apply your changes in a Variant Theme (.ovt).
|
|
* Creating your own Base Theme means you are opting out of the default
|
|
* appearance for all widgets and will be responsible for keeping your base
|
|
* theme up to date with every new release!
|
|
*
|
|
* Do NOT copy Yami into a new base theme only to make minor changes or
|
|
* adjustments. Your theme will likely break with every OBS Studio update.
|
|
*
|
|
* You can learn more about OBS Studio's theme system on our GitHub wiki:
|
|
* https://github.com/obsproject/obs-studio/wiki/OBS-Studio-Theme-System
|
|
* *
|
|
* ------------------------------------------------------------------------- */
|
|
|
|
@OBSThemeMeta {
|
|
name: 'Yami';
|
|
id: 'com.obsproject.Yami';
|
|
author: 'Warchamp7';
|
|
dark: 'true';
|
|
}
|
|
|
|
@OBSThemeVars {
|
|
/* OBS Color Palette */
|
|
--blue1: #718CDC;
|
|
--blue2: #476BD7;
|
|
--blue3: #284CB8;
|
|
--blue4: #213E97;
|
|
--blue5: #1A3278;
|
|
--blue6: #162A64;
|
|
|
|
--red1: #E85E75;
|
|
--red2: #E33B57;
|
|
--red3: #C01C37;
|
|
--red4: #A1172E;
|
|
--red5: #7D1224;
|
|
--red6: #590D1A;
|
|
|
|
--pink1: #E5619A;
|
|
--pink2: #E03E84;
|
|
--pink3: #C11F65;
|
|
--pink4: #9E1A53;
|
|
--pink5: #7B1441;
|
|
--pink6: #580E2E;
|
|
|
|
--teal1: #3DBEF5;
|
|
--teal2: #16B1F3;
|
|
--teal3: #0981B4;
|
|
--teal4: #086F9B;
|
|
--teal5: #065374;
|
|
--teal6: #04374E;
|
|
|
|
--purple1: #997FDC;
|
|
--purple2: #805FD3;
|
|
--purple3: #5B34BF;
|
|
--purple4: #4D2CA0;
|
|
--purple5: #3D2380;
|
|
--purple6: #2E1A60;
|
|
|
|
--green1: #59D966;
|
|
--green2: #37D247;
|
|
--green3: #25A231;
|
|
--green4: #1E8528;
|
|
--green5: #17641E;
|
|
--green6: #0F4313;
|
|
|
|
--yellow1: #EABC48;
|
|
--yellow2: #E5AF24;
|
|
--yellow3: #B88A16;
|
|
--yellow4: #926E11;
|
|
--yellow5: #6E520D;
|
|
--yellow6: #493709;
|
|
|
|
--grey1: #5B6273;
|
|
--grey2: #4E5566;
|
|
--grey3: #464B59;
|
|
--grey4: #3C404D;
|
|
--grey5: #323540;
|
|
--grey6: #272A33;
|
|
--grey7: #1D1F26;
|
|
--grey8: #13141A;
|
|
|
|
--white1: #FFFFFF;
|
|
--white2: #E1E1E1;
|
|
--white3: #D2D2D2;
|
|
--white4: #B4B4B4;
|
|
--white5: #969696;
|
|
|
|
--black1: #0A0A0A;
|
|
--black2: #1F1F1F;
|
|
--black3: #414141;
|
|
--black4: #646464;
|
|
--black5: #828282;
|
|
|
|
/* Base Theme Colors */
|
|
--bg_window: var(--grey7);
|
|
--bg_base: var(--grey6);
|
|
--bg_preview: var(--grey8);
|
|
|
|
--primary: var(--blue3);
|
|
--primary_light: var(--blue2);
|
|
--primary_lighter: var(--blue1);
|
|
--primary_dark: var(--blue4);
|
|
--primary_darker: var(--blue5);
|
|
|
|
--warning: var(--yellow3);
|
|
--danger: var(--red3);
|
|
|
|
--text: var(--white1);
|
|
--text_light: var(--white1);
|
|
--text_muted: var(--white5);
|
|
|
|
--text_disabled: var(--text_muted);
|
|
--text_inactive: rgb(255, 254, 255);
|
|
|
|
/* Layout */
|
|
/* Configurable Values */
|
|
--font_base_value: var(--obsFontScale);
|
|
--padding_base_value: var(--obsPadding);
|
|
--spacing_base_value: calc(2 + calc(var(--obsPadding) / 2));
|
|
|
|
--highlight_width: 1px;
|
|
--highlight_color: var(--primary_lighter);
|
|
|
|
/* TODO: Better Accessibility focus state */
|
|
/* TODO: Move Accessibility Colors to Theme config system */
|
|
--border_highlight: "transparent";
|
|
|
|
/* OS Fixes */
|
|
--os_mac_font_base_value: calc(1.2 * var(--obsFontScale));
|
|
|
|
--font_base: calc(1pt * var(--font_base_value));
|
|
--font_small: max(7pt, calc(0.8pt * var(--font_base_value)));
|
|
--font_xsmall: max(6.75pt, calc(0.65pt * var(--font_base_value)));
|
|
--font_large: calc(1.1pt * var(--font_base_value));
|
|
--font_xlarge: calc(1.5pt * var(--font_base_value));
|
|
|
|
--font_heading: calc(2.5pt * var(--font_base_value));
|
|
|
|
--icon_base: calc(calc(max(2, var(--obsPadding)) * 1px) + 12px);
|
|
--icon_small: calc(4px + var(--font_base_value));
|
|
|
|
--spacing_base: min(max(1px, calc(0.4 * var(--spacing_base_value))), 2px);
|
|
--spacing_large: min(max(2px, calc(1px * var(--spacing_base_value))), 4px);
|
|
--spacing_small: max(1px, calc(0.25px * var(--spacing_base_value)));
|
|
--spacing_title: 4px;
|
|
|
|
--padding_base: calc(0.5px * var(--padding_base_value));
|
|
--padding_large: min(max(1px, calc(1px * var(--padding_base_value))), 5px);
|
|
--padding_xlarge: min(max(2px, calc(1.75px * var(--padding_base_value))), 10px);
|
|
--padding_small: max(0px, calc(0.25px * var(--padding_base_value)));
|
|
|
|
--padding_container: max(4px, var(--padding_base));
|
|
--padding_wide: min(calc(12px + max(var(--padding_base_value), 4)), 24px);
|
|
--padding_menu: calc(4px + calc(2 * var(--padding_base_value)));
|
|
--padding_menubar: max(6px, calc(2px + calc(1.25 * var(--padding_base_value))));
|
|
|
|
--padding_base_border: calc(var(--padding_base) + 1px);
|
|
|
|
--spinbox_min_width: calc(var(--input_height) * 2.5);
|
|
--spinbox_button_height: calc(var(--input_height_half) - 1px);
|
|
|
|
--volume_slider: calc(calc(4px + var(--font_base_value)) / 4);
|
|
--volume_slider_box: calc(var(--volume_slider) * 4);
|
|
--volume_slider_label: calc(var(--volume_slider_box) * 2);
|
|
|
|
--scrollbar_size: 12px;
|
|
--settings_scrollbar_size: calc(var(--scrollbar_size) + 9px);
|
|
--scrollbar_handle: var(--grey4);
|
|
|
|
--scrollbar_bg: var(--grey6);
|
|
--scrollbar_hover: var(--grey3);
|
|
--scrollbar_down: var(--grey2);
|
|
|
|
--scrollbar_border: var(--grey2);
|
|
|
|
/* Inputs / Controls */
|
|
--border_color: var(--grey4);
|
|
|
|
--border_radius: 4px;
|
|
--border_radius_small: 2px;
|
|
--border_radius_large: 6px;
|
|
|
|
--input_font_scale: calc(var(--font_base_value) * 2.2);
|
|
--input_font_padding: calc(var(--padding_base_value) * 2);
|
|
|
|
--input_height_base: max(calc(var(--input_font_scale) + var(--input_font_padding)), 24);
|
|
--input_padding: calc(2px + var(--padding_base));
|
|
--input_text_padding: max(calc(6px + var(--padding_base)), 8px);
|
|
--input_height: calc(var(--input_height_base) - calc(var(--input_padding) * 2px));
|
|
--input_height_half: calc(var(--input_height_base) / 2);
|
|
--spinbox_width: calc(var(--input_height_base) + calc(var(--input_padding) * 2px));
|
|
|
|
--input_bg: var(--grey4);
|
|
--input_bg_hover: var(--grey7);
|
|
--input_bg_focus: var(--grey7);
|
|
|
|
--list_item_bg_selected: var(--primary);
|
|
--list_item_bg_hover: var(--primary_light);
|
|
|
|
--input_border: var(--grey1);
|
|
--input_border_width: 1px;
|
|
--input_border_hover: var(--grey1);
|
|
--input_border_focus: var(--primary);
|
|
|
|
--spacing_input: var(--spacing_base);
|
|
|
|
--button_bg: var(--input_bg);
|
|
--button_bg_hover: var(--grey3);
|
|
--button_bg_down: var(--grey7);
|
|
--button_bg_disabled: var(--grey6);
|
|
|
|
--button_border_width: var(--input_border_width);
|
|
--button_border: var(--button_bg);
|
|
--button_border_hover: var(--grey1);
|
|
--button_border_focus: var(--grey1);
|
|
|
|
--tab_bg: var(--button_bg_disabled);
|
|
--tab_bg_hover: var(--button_bg_hover);
|
|
--tab_bg_down: var(--primary);
|
|
--tab_bg_disabled: var(--button_bg_disabled);
|
|
|
|
--tab_border: var(--border_color);
|
|
--tab_border_hover: var(--button_border_hover);
|
|
--tab_border_focus: var(--primary_lighter);
|
|
--tab_border_selected: var(--primary);
|
|
|
|
--tab_padding_base: calc(5px + var(--padding_base));
|
|
--tab_padding_large: calc(9px + var(--padding_base));
|
|
|
|
--preview_scale_width: calc(calc(var(--input_text_padding) * 3.5) * calc(var(--font_base_value) / 10));
|
|
|
|
--separator_hover: var(--white1);
|
|
|
|
--action_row_base: calc(var(--input_height_base) * 0.75);
|
|
--action_row_height: calc(var(--action_row_base) + calc(var(--action_row_padding) * 2px));
|
|
--action_row_border: 3px;
|
|
--action_row_input_width: calc(var(--action_row_base) * 4);
|
|
--action_row_collapse: calc(var(--action_row_base) + var(--padding_large));
|
|
--action_row_collapse_radius: calc(var(--action_row_collapse) / 2);
|
|
--action_row_padding: calc(var(--padding_large) * 1.5);
|
|
--action_row_padding_x: calc(var(--action_row_padding) * 2);
|
|
--action_row_padding_nested: calc(var(--action_row_padding_x) * 1.5);
|
|
|
|
--toggle_border: 1;
|
|
--toggle_margin: 3;
|
|
--toggle_width: calc(var(--action_row_base) * 1.8);
|
|
--toggle_height: calc(var(--action_row_base) * 0.9);
|
|
--toggle_handle: calc(calc(calc(var(--toggle_height) * 0.9) - calc(var(--toggle_border) * 2)) - var(--toggle_margin));
|
|
--toggle_radius: calc(var(--toggle_height) / 2);
|
|
|
|
/* Qt Palette variables can be set with the "palette_" prefix */
|
|
--palette_window: var(--bg_window);
|
|
--palette_windowText: var(--text);
|
|
--palette_base: var(--bg_base);
|
|
|
|
--palette_light: var(--grey2);
|
|
--palette_mid: var(--grey7);
|
|
--palette_dark: var(--grey6);
|
|
|
|
--palette_highlight: var(--primary);
|
|
--palette_highlightedText: var(--text);
|
|
|
|
--palette_text: var(--text);
|
|
--palette_link: var(--blue2);
|
|
--palette_linkVisited: var(--blue2);
|
|
|
|
--palette_button: var(--button_bg);
|
|
--palette_buttonText: var(--text);
|
|
|
|
/* They can be selectively set for palette groups by appending those as well */
|
|
--palette_text_active: var(--text);
|
|
--palette_text_disabled: var(--text_disabled);
|
|
--palette_text_inactive: var(--text_inactive);
|
|
|
|
/*
|
|
* Variables calculated at runtime (after all themes have been composed).
|
|
*
|
|
* Support standard add, sub, mul, div operations.
|
|
* Also supports nested calls (but keep it reasonable).
|
|
*
|
|
* Note: When using two operands that have a type (e.g. "px") the type must match!
|
|
* If only one operand has a type it'll be used for the result.
|
|
* Note 2: Cannot be !editable
|
|
* Note 3: Operands and operator MUST be separated by whitespace
|
|
*/
|
|
}
|
|
|
|
/* --------------------- */
|
|
/* General Styling Hints */
|
|
|
|
/* Backgrounds */
|
|
|
|
.bg_window {
|
|
background-color: var(--bg_window);
|
|
}
|
|
|
|
.bg-base {
|
|
background-color: var(--bg_base);
|
|
}
|
|
|
|
.text-title {
|
|
font-size: var(--font_large);
|
|
font-weight: bold;
|
|
}
|
|
|
|
.text-small {
|
|
font-size: var(--font_small);
|
|
}
|
|
|
|
.text-tiny {
|
|
font-size: var(--font_xsmall);
|
|
}
|
|
|
|
.text-heading {
|
|
font-size: var(--font_heading);
|
|
font-weight: bold;
|
|
}
|
|
|
|
.text-large {
|
|
font-size: var(--font_large);
|
|
}
|
|
|
|
.text-bold {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.text-italic {
|
|
font-style: italic;
|
|
}
|
|
|
|
.text-bright {
|
|
color: var(--primary_light);
|
|
}
|
|
|
|
.text-muted {
|
|
color: var(--text_muted);
|
|
}
|
|
|
|
.text-warning {
|
|
color: var(--warning);
|
|
}
|
|
|
|
.text-danger {
|
|
color: var(--danger);
|
|
}
|
|
|
|
.text-success {
|
|
color: var(--green3);
|
|
}
|
|
|
|
.frame-notice {
|
|
background: var(--grey8);
|
|
border: 1px solid var(--grey6);
|
|
border-radius: var(--border_radius);
|
|
padding: var(--padding_xlarge) var(--padding_large);
|
|
}
|
|
|
|
.frame-notice QLabel {
|
|
padding: var(--padding_large) 0px;
|
|
}
|
|
|
|
.dialog-container {
|
|
padding: var(--padding_large) var(--padding_xlarge);
|
|
}
|
|
|
|
.dialog-frame {
|
|
background-color: var(--grey6);
|
|
border-radius: var(--border_radius);
|
|
border: 1px solid var(--border_color);
|
|
margin: var(--spacing_base);
|
|
}
|
|
|
|
.dialog-frame > QWidget {
|
|
margin: var(--spacing_base) 0;
|
|
}
|
|
|
|
.subtitle {
|
|
font-size: var(--font_small);
|
|
font-weight: bold;
|
|
color: var(--text_muted);
|
|
}
|
|
|
|
.button-primary {
|
|
background-color: var(--primary_dark);
|
|
border-color: var(--primary);
|
|
outline: none;
|
|
}
|
|
|
|
.button-primary:hover,
|
|
.button-primary:focus {
|
|
background-color: var(--primary);
|
|
border-color: var(--white3);
|
|
}
|
|
|
|
.button-primary:hover {
|
|
border-color: var(--primary_light);
|
|
}
|
|
|
|
.toolbar-button {
|
|
background: transparent;
|
|
font-weight: bold;
|
|
padding: 0 var(--padding_xlarge);
|
|
margin: var(--spacing_small) var(--spacing_small) 0px;
|
|
border: var(--highlight_width) solid transparent;
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
.margin {
|
|
margin: var(--spacing_base);
|
|
}
|
|
|
|
.margin-x {
|
|
margin-left: var(--spacing_base);
|
|
margin-right: var(--spacing_base);
|
|
}
|
|
|
|
.margin-left {
|
|
margin-left: var(--spacing_base);
|
|
}
|
|
|
|
.margin-right {
|
|
margin-right: var(--spacing_base);
|
|
}
|
|
|
|
.margin-y {
|
|
margin-top: var(--spacing_base);
|
|
margin-bottom: var(--spacing_base);
|
|
}
|
|
|
|
.margin-top {
|
|
margin-top: var(--spacing_base);
|
|
}
|
|
|
|
.margin-bottom {
|
|
margin-bottom: var(--spacing_base);
|
|
}
|
|
|
|
/* Icon Overrides */
|
|
|
|
.icon-plus {
|
|
qproperty-icon: url(theme:Dark/plus.svg);
|
|
}
|
|
|
|
.icon-minus {
|
|
qproperty-icon: url(theme:Dark/minus.svg);
|
|
}
|
|
|
|
.icon-trash {
|
|
qproperty-icon: url(theme:Dark/trash.svg);
|
|
}
|
|
|
|
.icon-clear {
|
|
qproperty-icon: url(theme:Dark/entry-clear.svg);
|
|
}
|
|
|
|
.icon-gear {
|
|
qproperty-icon: url(theme:Dark/settings/general.svg);
|
|
}
|
|
|
|
.icon-dots-vert {
|
|
qproperty-icon: url(theme:Dark/dots-vert.svg);
|
|
}
|
|
|
|
.icon-refresh {
|
|
qproperty-icon: url(theme:Dark/refresh.svg);
|
|
}
|
|
|
|
.icon-cogs {
|
|
qproperty-icon: url(theme:Dark/cogs.svg);
|
|
}
|
|
|
|
.icon-touch {
|
|
qproperty-icon: url(theme:Dark/interact.svg);
|
|
}
|
|
|
|
.icon-up {
|
|
qproperty-icon: url(theme:Dark/up.svg);
|
|
}
|
|
|
|
.icon-down {
|
|
qproperty-icon: url(theme:Dark/down.svg);
|
|
}
|
|
|
|
.icon-pause {
|
|
qproperty-icon: url(theme:Dark/media-pause.svg);
|
|
}
|
|
|
|
.icon-filter {
|
|
qproperty-icon: url(theme:Dark/filter.svg);
|
|
}
|
|
|
|
.icon-revert {
|
|
qproperty-icon: url(theme:Dark/revert.svg);
|
|
}
|
|
|
|
.icon-save {
|
|
qproperty-icon: url(theme:Dark/save.svg);
|
|
}
|
|
|
|
.icon-close {
|
|
qproperty-icon: url(theme:Dark/close.svg);
|
|
}
|
|
|
|
.icon-pin {
|
|
qproperty-icon: url(theme:Dark/pin.svg);
|
|
}
|
|
|
|
.icon-layout-vertical {
|
|
qproperty-icon: url(theme:Dark/layout-vertical.svg);
|
|
}
|
|
|
|
.icon-layout-horizontal {
|
|
qproperty-icon: url(theme:Dark/layout-horizontal.svg);
|
|
}
|
|
|
|
/* Media icons */
|
|
|
|
.icon-media-play {
|
|
qproperty-icon: url(theme:Dark/media/media_play.svg);
|
|
}
|
|
|
|
.icon-media-pause {
|
|
qproperty-icon: url(theme:Dark/media/media_pause.svg);
|
|
}
|
|
|
|
.icon-media-restart {
|
|
qproperty-icon: url(theme:Dark/media/media_restart.svg);
|
|
}
|
|
|
|
.icon-media-stop {
|
|
qproperty-icon: url(theme:Dark/media/media_stop.svg);
|
|
}
|
|
|
|
.icon-media-next {
|
|
qproperty-icon: url(theme:Dark/media/media_next.svg);
|
|
}
|
|
|
|
.icon-media-prev {
|
|
qproperty-icon: url(theme:Dark/media/media_previous.svg);
|
|
}
|
|
|
|
/* Default widget style, we override only what is needed. */
|
|
|
|
QWidget {
|
|
alternate-background-color: var(--bg_base);
|
|
color: var(--text);
|
|
selection-background-color: var(--primary);
|
|
selection-color: var(--text);
|
|
font-size: var(--font_base);
|
|
font-family: 'Open Sans', '.AppleSystemUIFont', Helvetica, Arial, 'MS Shell Dlg', sans-serif;
|
|
}
|
|
|
|
QWidget:disabled {
|
|
color: var(--text_disabled);
|
|
}
|
|
|
|
/* Container windows */
|
|
|
|
QDialog,
|
|
QMainWindow,
|
|
QStatusBar,
|
|
QMenuBar,
|
|
QMenu {
|
|
background-color: var(--bg_window);
|
|
}
|
|
|
|
/* macOS Separator Fix */
|
|
|
|
QMainWindow::separator {
|
|
background: transparent;
|
|
width: var(--spacing_large);
|
|
height: var(--spacing_large);
|
|
margin: 0px;
|
|
}
|
|
|
|
QMainWindow::separator:hover {
|
|
border: 1px solid var(--separator_hover);
|
|
margin: 1px;
|
|
}
|
|
|
|
/* General Widgets */
|
|
|
|
QLabel,
|
|
QGroupBox,
|
|
QCheckBox {
|
|
background: transparent;
|
|
}
|
|
|
|
QComboBox,
|
|
QCheckBox,
|
|
QPushButton,
|
|
QSpinBox,
|
|
QDoubleSpinBox {
|
|
margin-top: var(--spacing_input);
|
|
margin-bottom: var(--spacing_input);
|
|
}
|
|
|
|
QListView QWidget,
|
|
QListWidget QWidget {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
* [frameShape="1"],
|
|
* [frameShape="2"],
|
|
* [frameShape="3"],
|
|
* [frameShape="4"],
|
|
* [frameShape="5"],
|
|
* [frameShape="6"] {
|
|
border: 1px solid var(--bg_base);
|
|
}
|
|
|
|
QCheckBox,
|
|
QGroupBox,
|
|
QMenuBar,
|
|
QRadioButton {
|
|
spacing: var(--spacing_small);
|
|
}
|
|
|
|
/* Misc */
|
|
|
|
QAbstractItemView {
|
|
background-color: var(--bg_base);
|
|
}
|
|
|
|
QToolTip {
|
|
background-color: var(--bg_base);
|
|
color: var(--text);
|
|
border: none;
|
|
}
|
|
|
|
QProgressBar {
|
|
text-align: center;
|
|
border-radius: 4px;
|
|
border-top: 2px solid transparent;
|
|
}
|
|
|
|
QProgressBar::chunk {
|
|
background: var(--blue3);
|
|
border-top: 1px solid var(--blue2);
|
|
border-bottom: 2px solid var(--blue4);
|
|
border-radius: var(--border_radius_small);
|
|
}
|
|
|
|
/* Context Menu */
|
|
|
|
QMenu::indicator {
|
|
left: var(--padding_large);
|
|
}
|
|
|
|
QMenu::icon {
|
|
left: var(--padding_xlarge);
|
|
}
|
|
|
|
QMenu::separator {
|
|
background: var(--border_color);
|
|
height: 1px;
|
|
margin: var(--spacing_base) var(--spacing_large);
|
|
}
|
|
|
|
QMenu::item:disabled {
|
|
color: var(--text_disabled);
|
|
background: transparent;
|
|
}
|
|
|
|
QMenu::right-arrow {
|
|
image: url(theme:Dark/expand.svg);
|
|
}
|
|
|
|
/* Top Menu Bar Items */
|
|
QMenuBar::item {
|
|
background-color: transparent;
|
|
padding: var(--padding_large) var(--padding_menubar);
|
|
}
|
|
|
|
QMenuBar::item:selected {
|
|
background: var(--primary);
|
|
}
|
|
|
|
/* Toolbars */
|
|
|
|
QToolBar::separator {
|
|
background: var(--border_color);
|
|
width: 1px;
|
|
margin: 0px var(--spacing_base) 0px;
|
|
}
|
|
|
|
/* Item Lists */
|
|
|
|
QListWidget {
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
QListWidget::item {
|
|
color: var(--text);
|
|
}
|
|
|
|
QListView,
|
|
QListWidget,
|
|
QMenu {
|
|
padding: var(--spacing_base);
|
|
outline: none;
|
|
}
|
|
|
|
QListWidget::item,
|
|
SourceTreeItem {
|
|
padding: var(--padding_large) var(--padding_large);
|
|
}
|
|
|
|
QMenu::item,
|
|
QMenu > QWidget {
|
|
padding: var(--padding_large) var(--padding_menu);
|
|
padding-right: 20px;
|
|
}
|
|
|
|
QMenu > QWidget {
|
|
outline: none;
|
|
}
|
|
|
|
QMenu::item,
|
|
QMenu > QWidget,
|
|
QListView::item,
|
|
QListWidget::item {
|
|
border-radius: var(--border_radius);
|
|
color: var(--text);
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
SourceTreeItem {
|
|
border-radius: var(--border_radius);
|
|
color: var(--text);
|
|
}
|
|
|
|
QMenu,
|
|
QMenu > QMenu {
|
|
border: 1px solid var(--border_color);
|
|
padding: var(--spacing_base);
|
|
}
|
|
|
|
/* Temporary fix for plugins affected by fix in #11555 */
|
|
QListView::item,
|
|
QListWidget::item,
|
|
SourceTreeItem {
|
|
min-height: var(--padding_menu);
|
|
}
|
|
|
|
SourceTreeItem .checkbox-icon {
|
|
margin-right: 0;
|
|
margin-left: var(--spacing_large);
|
|
}
|
|
|
|
SourceTree .indicator-expand {
|
|
margin-right: var(--spacing_large);
|
|
margin-left: 0;
|
|
}
|
|
|
|
QMenu::item:selected,
|
|
QMenu > QWidget:selected,
|
|
QListView::item:selected,
|
|
QListWidget::item:selected {
|
|
background-color: var(--primary);
|
|
border-color: var(--primary_light);
|
|
}
|
|
|
|
QMenu::item:hover,
|
|
QListView::item:hover,
|
|
QListWidget::item:hover {
|
|
background: var(--grey4);
|
|
border: 1px solid var(--grey3);
|
|
}
|
|
|
|
QMenu::item:focus,
|
|
QListView::item:focus,
|
|
QListWidget::item:focus,
|
|
QMenu::item:selected:focus,
|
|
QListView::item:selected:focus,
|
|
QListWidget::item:selected:focus {
|
|
border: 1px solid var(--white3);
|
|
}
|
|
|
|
QMenu::item:selected:hover,
|
|
QListView::item:selected:hover,
|
|
QListWidget::item:selected:hover {
|
|
background: var(--primary_light);
|
|
border: 1px solid var(--primary_lighter);
|
|
color: var(--text);
|
|
}
|
|
|
|
QListView::item:disabled,
|
|
QListView::item:disabled:hover,
|
|
QListWidget::item:disabled,
|
|
QListWidget::item:disabled:hover {
|
|
background: transparent;
|
|
color: var(--text_disabled);
|
|
}
|
|
|
|
QListView QLineEdit,
|
|
QListWidget QLineEdit {
|
|
padding: 0;
|
|
padding-bottom: 1px;
|
|
margin: 0;
|
|
border: var(--input_border_width) solid var(--white1);
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
QListView QLineEdit:focus,
|
|
QListWidget QLineEdit:focus {
|
|
border: 1px solid var(--grey1);
|
|
}
|
|
|
|
/* Settings QList */
|
|
|
|
OBSBasicSettings QScrollBar:vertical {
|
|
width: var(--settings_scrollbar_size);
|
|
margin-left: 9px;
|
|
}
|
|
|
|
OBSBasicSettings QScrollBar:horizontal {
|
|
height: var(--settings_scrollbar_size);
|
|
}
|
|
|
|
/* Settings properties view */
|
|
OBSBasicSettings #PropertiesContainer {
|
|
background-color: var(--bg_base);
|
|
}
|
|
|
|
OBSPropertiesView IconLabel {
|
|
margin-left: var(--spacing_large);
|
|
}
|
|
|
|
/* Dock Widget */
|
|
OBSDock > QWidget {
|
|
background: var(--bg_base);
|
|
border-bottom-left-radius: var(--border_radius);
|
|
border-bottom-right-radius: var(--border_radius);
|
|
border: 1px solid var(--border_color);
|
|
border-top: none;
|
|
}
|
|
|
|
OBSDock QToolBar {
|
|
padding: 1px;
|
|
margin: 0px;
|
|
height: 32px;
|
|
max-height: 32px;
|
|
border-top: 1px solid var(--border_color);
|
|
spacing: 0;
|
|
}
|
|
|
|
OBSDock QToolBar QToolButton {
|
|
background: transparent;
|
|
border: 1px solid transparent;
|
|
margin: 1px;
|
|
margin-top: 2px;
|
|
padding: var(--padding_large);
|
|
max-width: var(--icon_small);
|
|
max-height: var(--icon_small);
|
|
}
|
|
|
|
OBSDock QToolBar QToolButton:hover {
|
|
border-color: var(--grey1);
|
|
}
|
|
|
|
OBSDock QToolBar QToolButton:disabled {
|
|
background: var(--grey7);
|
|
}
|
|
|
|
#transitionsFrame {
|
|
padding: var(--padding_container);
|
|
}
|
|
|
|
OBSDock QLabel {
|
|
background: transparent;
|
|
}
|
|
|
|
QDockWidget {
|
|
font-size: var(--font_base);
|
|
font-weight: bold;
|
|
|
|
titlebar-close-icon: url(theme:Dark/close.svg);
|
|
titlebar-normal-icon: url(theme:Dark/popout.svg);
|
|
}
|
|
|
|
QDockWidget::title {
|
|
text-align: left;
|
|
background-color: var(--button_bg);
|
|
padding: var(--padding_large);
|
|
border-top-left-radius: var(--border_radius);
|
|
border-top-right-radius: var(--border_radius);
|
|
}
|
|
|
|
QDockWidget::close-button,
|
|
QDockWidget::float-button {
|
|
border: none;
|
|
border-radius: var(--border_radius);
|
|
background: transparent;
|
|
margin-right: 1px;
|
|
min-width: var(--icon_base);
|
|
min-height: var(--icon_base);
|
|
icon-size: var(--icon_base);
|
|
padding: var(--padding_base);
|
|
}
|
|
|
|
QDockWidget::close-button:hover,
|
|
QDockWidget::float-button:hover {
|
|
background: var(--button_bg_hover);
|
|
}
|
|
|
|
QDockWidget::close-button:pressed,
|
|
QDockWidget::float-button:pressed {
|
|
background: var(--button_bg_down);
|
|
padding: 1px -1px -1px 1px;
|
|
}
|
|
|
|
QAbstractScrollArea {
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
/* ScrollAreaContents */
|
|
QScrollArea > QWidget > QWidget {
|
|
background: transparent;
|
|
}
|
|
|
|
/* Qt enforces a padding inside its status bar, so we
|
|
* oversize it and use margin to crunch it back down
|
|
*/
|
|
OBSBasicStatusBar {
|
|
margin-top: var(--spacing_large);
|
|
border-top: 1px solid var(--border_color);
|
|
background: var(--bg_base);
|
|
}
|
|
|
|
StatusBarWidget > QFrame {
|
|
border: 0px solid var(--border_color);
|
|
border-left-width: 1px;
|
|
padding: 0px var(--padding_xlarge) var(--padding_small);
|
|
}
|
|
|
|
/* Group Box */
|
|
|
|
QGroupBox {
|
|
background: var(--bg_base);
|
|
border-radius: var(--border_radius);
|
|
padding-top: var(--input_height_base);
|
|
padding-bottom: var(--padding_large);
|
|
font-weight: bold;
|
|
margin-bottom: var(--spacing_large);
|
|
}
|
|
|
|
QGroupBox::title {
|
|
subcontrol-origin: margin;
|
|
left: var(--spacing_title);
|
|
top: var(--spacing_title);
|
|
}
|
|
|
|
|
|
/* ScrollBars */
|
|
|
|
QScrollBar {
|
|
background-color: var(--scrollbar_bg);
|
|
margin: 0px;
|
|
border-radius: var(--border_radius);
|
|
border: 1px solid var(--grey6);
|
|
}
|
|
|
|
::corner {
|
|
background-color: var(--bg_window);
|
|
border: none;
|
|
}
|
|
|
|
QScrollBar:vertical {
|
|
width: var(--scrollbar_size);
|
|
}
|
|
|
|
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 {
|
|
height: var(--scrollbar_size);
|
|
}
|
|
|
|
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;
|
|
}
|
|
|
|
QScrollBar::handle {
|
|
background-color: var(--scrollbar_handle);
|
|
margin: 2px;
|
|
border-radius: var(--border_radius_small);
|
|
border: 1px solid var(--scrollbar_handle);
|
|
}
|
|
|
|
QScrollBar::handle:hover {
|
|
background-color: var(--scrollbar_hover);
|
|
border-color: var(--scrollbar_border);
|
|
}
|
|
|
|
QScrollBar::handle:pressed {
|
|
background-color: var(--scrollbar_down);
|
|
border-color: var(--scrollbar_down);
|
|
}
|
|
|
|
QScrollBar::handle:vertical {
|
|
min-height: 32px;
|
|
}
|
|
|
|
QScrollBar::handle:horizontal {
|
|
min-width: 32px;
|
|
}
|
|
|
|
QScrollBar::handle:disabled {
|
|
background: transparent;
|
|
border-color: transparent;
|
|
}
|
|
|
|
OBSDock QScrollBar {
|
|
border-radius: 0;
|
|
}
|
|
|
|
OBSDock QListWidget::corner {
|
|
background: transparent;
|
|
border-top: 1px solid var(--border_color);
|
|
border-left: 1px solid var(--border_color);
|
|
}
|
|
|
|
OBSDock QScrollBar:horizontal {
|
|
border-top: 1px solid var(--border_color);
|
|
}
|
|
|
|
OBSDock QScrollBar:vertical {
|
|
border-left: 1px solid var(--border_color);
|
|
}
|
|
|
|
/* Source Context Bar */
|
|
|
|
#contextContainer {
|
|
background-color: var(--bg_base);
|
|
margin-top: 4px;
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
#contextContainer QPushButton {
|
|
padding-left: 12px;
|
|
padding-right: 12px;
|
|
}
|
|
|
|
QPushButton#sourcePropertiesButton {
|
|
qproperty-icon: url(theme:Dark/settings/general.svg);
|
|
icon-size: var(--icon_base);
|
|
}
|
|
|
|
QPushButton#sourceFiltersButton {
|
|
qproperty-icon: url(theme:Dark/filter.svg);
|
|
icon-size: var(--icon_base);
|
|
}
|
|
|
|
/* Scenes and Sources toolbar */
|
|
|
|
QToolBar {
|
|
background-color: transparent;
|
|
border: none;
|
|
margin: var(--spacing_base) 0px;
|
|
spacing: var(--spacing_base);
|
|
}
|
|
|
|
QToolBarExtension {
|
|
background: var(--button_bg);
|
|
min-width: 12px;
|
|
max-width: 12px;
|
|
padding: 4px 0px;
|
|
margin-left: 0px;
|
|
|
|
qproperty-icon: url(theme:Dark/dots-vert.svg);
|
|
}
|
|
|
|
|
|
/* Tab Widget */
|
|
|
|
/* The tab widget frame */
|
|
QTabWidget::pane {
|
|
border-top: 4px solid var(--tab_bg);
|
|
}
|
|
|
|
QTabBar {
|
|
outline: none;
|
|
}
|
|
|
|
QTabWidget::tab-bar {
|
|
alignment: left;
|
|
}
|
|
|
|
QTabBar QToolButton {
|
|
background: var(--button_bg);
|
|
border: none;
|
|
}
|
|
|
|
QTabBar::tab:top {
|
|
border-top-left-radius: 4px;
|
|
border-top-right-radius: 4px;
|
|
}
|
|
|
|
QTabBar::tab:bottom {
|
|
border-bottom-left-radius: 4px;
|
|
border-bottom-right-radius: 4px;
|
|
}
|
|
|
|
QTabBar::tab {
|
|
background: var(--tab_bg);
|
|
color: var(--text);
|
|
border: none;
|
|
padding: var(--tab_padding_base) var(--tab_padding_large);
|
|
min-width: 50px;
|
|
margin: 1px 0px;
|
|
margin-right: 2px;
|
|
border: 1px solid var(--tab_border);
|
|
}
|
|
|
|
QTabBar::tab:pressed {
|
|
background: var(--tab_bg_down);
|
|
}
|
|
|
|
QTabBar::tab:hover {
|
|
background: var(--tab_bg_hover);
|
|
border-color: var(--tab_border_hover);
|
|
color: var(--text);
|
|
}
|
|
|
|
QTabBar::tab:focus {
|
|
border-color: var(--tab_border_focus);
|
|
}
|
|
|
|
QTabBar::tab:selected {
|
|
background: var(--tab_bg_down);
|
|
color: var(--text);
|
|
}
|
|
|
|
QTabBar::tab:top {
|
|
border-bottom: 0px solid transparent;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
QTabBar::tab:bottom {
|
|
border-top: 0px solid transparent;
|
|
margin-top: 0px;
|
|
}
|
|
|
|
QTabBar QToolButton {
|
|
background: var(--button_bg);
|
|
min-width: 16px;
|
|
padding: 0px;
|
|
}
|
|
|
|
/* ComboBox */
|
|
|
|
QComboBox,
|
|
QDateTimeEdit {
|
|
background-color: var(--input_bg);
|
|
border: 1px solid var(--input_bg);
|
|
border-radius: var(--border_radius);
|
|
padding: var(--input_padding) var(--input_text_padding);
|
|
height: var(--input_height);
|
|
}
|
|
|
|
QComboBox QAbstractItemView {
|
|
padding: var(--spacing_base) var(--spacing_large);
|
|
border: 1px solid var(--border_color);
|
|
outline: none;
|
|
}
|
|
|
|
QComboBox QAbstractItemView::item {
|
|
padding: var(--padding_large) var(--padding_xlarge);
|
|
}
|
|
|
|
QComboBox QAbstractItemView::item:selected,
|
|
QComboBox QAbstractItemView::item:hover {
|
|
background-color: var(--list_item_bg_selected);
|
|
}
|
|
|
|
QComboBox:hover,
|
|
QComboBox:focus,
|
|
QDateTimeEdit:hover,
|
|
QDateTimeEdit:selected {
|
|
border-color: var(--input_border_hover);
|
|
}
|
|
|
|
QComboBox:on {
|
|
border-bottom-left-radius: 0px;
|
|
border-bottom-right-radius: 0px;
|
|
}
|
|
|
|
QComboBox::drop-down,
|
|
QDateTimeEdit::drop-down {
|
|
border: none;
|
|
border-left: 1px solid var(--grey6);
|
|
width: var(--input_height);
|
|
}
|
|
|
|
QComboBox::down-arrow,
|
|
QDateTimeEdit::down-arrow {
|
|
qproperty-alignment: AlignTop;
|
|
image: url(theme:Dark/collapse.svg);
|
|
width: 100%;
|
|
}
|
|
|
|
QComboBox:editable:hover {
|
|
background-color: var(--input_bg_hover);
|
|
border-color: var(--input_border_hover);
|
|
}
|
|
|
|
QComboBox:on,
|
|
QDateTimeEdit:on,
|
|
QComboBox:editable:focus {
|
|
background-color: var(--input_bg_focus);
|
|
border-color: var(--input_border_focus);
|
|
}
|
|
|
|
QComboBox::drop-down:editable,
|
|
QDateTimeEdit::drop-down:editable {
|
|
border-top-right-radius: 4px;
|
|
border-bottom-right-radius: 4px;
|
|
}
|
|
|
|
QComboBox::down-arrow:editable,
|
|
QDateTimeEdit::down-arrow:editable {
|
|
qproperty-alignment: AlignTop;
|
|
image: url(theme:Dark/collapse.svg);
|
|
width: 100%;
|
|
}
|
|
|
|
/* Textedits etc */
|
|
|
|
QLineEdit,
|
|
QTextEdit,
|
|
QPlainTextEdit {
|
|
background-color: var(--input_bg);
|
|
border: none;
|
|
border-radius: var(--border_radius);
|
|
padding: var(--input_padding) var(--input_text_padding);
|
|
border: 1px solid var(--input_bg);
|
|
height: var(--input_height);
|
|
}
|
|
|
|
QLineEdit:hover,
|
|
QTextEdit:hover,
|
|
QPlainTextEdit:hover {
|
|
background-color: var(--input_bg_hover);
|
|
border-color: var(--input_border_hover);
|
|
}
|
|
|
|
QLineEdit:focus,
|
|
QTextEdit:focus,
|
|
QPlainTextEdit:focus {
|
|
background-color: var(--input_bg_focus);
|
|
border-color: var(--input_border_focus);
|
|
}
|
|
|
|
QLineEdit:read-only,
|
|
QLineEdit:read-only:hover,
|
|
QLineEdit:read-only:focus {
|
|
background-color: transparent;
|
|
border-color: var(--input_bg);
|
|
}
|
|
|
|
QTextEdit:!editable,
|
|
QTextEdit:!editable:hover,
|
|
QTextEdit:!editable:focus {
|
|
background-color: var(--input_bg);
|
|
}
|
|
|
|
/* Spinbox and doubleSpinbox */
|
|
|
|
QSpinBox,
|
|
QDoubleSpinBox {
|
|
background-color: var(--input_bg);
|
|
border: var(--input_border_width) solid var(--input_bg);
|
|
border-radius: var(--border_radius);
|
|
padding: var(--input_padding) var(--input_text_padding);
|
|
padding-right: var(--padding_base);
|
|
|
|
height: var(--input_height);
|
|
min-width: var(--spinbox_width);
|
|
max-height: var(--input_height);
|
|
min-width: var(--spinbox_min_width);
|
|
}
|
|
|
|
QSpinBox:hover,
|
|
QDoubleSpinBox:hover {
|
|
background-color: var(--input_bg_hover);
|
|
border-color: var(--input_border_hover);
|
|
}
|
|
|
|
QSpinBox:focus,
|
|
QDoubleSpinBox:focus {
|
|
background-color: var(--input_bg_focus);
|
|
border-color: var(--input_border_focus);
|
|
}
|
|
|
|
QSpinBox::up-button,
|
|
QDoubleSpinBox::up-button {
|
|
subcontrol-origin: padding;
|
|
/* position at the top right corner */
|
|
subcontrol-position: top right;
|
|
|
|
width: var(--input_height);
|
|
height: var(--spinbox_button_height);
|
|
border-left: 1px solid var(--grey6);
|
|
border-bottom: 1px solid transparent;
|
|
border-radius: 0px;
|
|
border-top-right-radius: var(--border_radius_small);
|
|
}
|
|
|
|
QSpinBox::down-button,
|
|
QDoubleSpinBox::down-button {
|
|
subcontrol-origin: padding;
|
|
/* position at the top right corner */
|
|
subcontrol-position: bottom right;
|
|
|
|
width: var(--input_height);
|
|
height: var(--spinbox_button_height);
|
|
border-left: 1px solid var(--grey6);
|
|
border-top: 1px solid var(--grey6);
|
|
border-radius: 0px;
|
|
border-bottom-right-radius: var(--border_radius_small);
|
|
}
|
|
|
|
QSpinBox::up-button:hover,
|
|
QSpinBox::down-button:hover,
|
|
QDoubleSpinBox::up-button:hover,
|
|
QDoubleSpinBox::down-button:hover {
|
|
background-color: var(--button_bg_hover);
|
|
}
|
|
|
|
QSpinBox::up-button:pressed,
|
|
QSpinBox::down-button:pressed,
|
|
QDoubleSpinBox::up-button:pressed,
|
|
QDoubleSpinBox::down-button:pressed {
|
|
background-color: var(--button_bg_down);
|
|
}
|
|
|
|
QSpinBox::up-button:disabled,
|
|
QSpinBox::up-button:off,
|
|
QSpinBox::down-button:disabled,
|
|
QSpinBox::down-button:off {
|
|
background-color: var(--button_bg_disabled);
|
|
}
|
|
|
|
QDoubleSpinBox::up-button:disabled,
|
|
QDoubleSpinBox::up-button:off,
|
|
QDoubleSpinBox::down-button:disabled,
|
|
QDoubleSpinBox::down-button:off {
|
|
background-color: var(--button_bg_disabled);
|
|
}
|
|
|
|
QSpinBox::up-arrow,
|
|
QDoubleSpinBox::up-arrow {
|
|
image: url(theme:Dark/up.svg);
|
|
width: 100%;
|
|
margin: 2px;
|
|
}
|
|
|
|
QSpinBox::down-arrow,
|
|
QDoubleSpinBox::down-arrow {
|
|
image: url(theme:Dark/down.svg);
|
|
width: 100%;
|
|
padding: 2px;
|
|
}
|
|
|
|
/* Controls Dock */
|
|
#controlsFrame {
|
|
padding: var(--padding_container);
|
|
}
|
|
|
|
#controlsFrame QPushButton {
|
|
margin: var(--spacing_base) var(--spacing_small);
|
|
}
|
|
|
|
#streamButton,
|
|
#recordButton,
|
|
#replayBufferButton,
|
|
#broadcastButton {
|
|
padding: var(--padding_large);
|
|
}
|
|
|
|
#pauseRecordButton,
|
|
#saveReplayButton,
|
|
#virtualCamConfigButton {
|
|
padding: var(--padding_large) var(--padding_large);
|
|
width: var(--input_height);
|
|
max-width: var(--input_height);
|
|
}
|
|
|
|
/* Primary Control Button Checked Coloring */
|
|
#streamButton:!hover:!pressed.state-active,
|
|
#recordButton:!hover:!pressed.state-active,
|
|
#pauseRecordButton:!hover:!pressed.state-active,
|
|
#replayBufferButton:!hover:!pressed.state-active,
|
|
#virtualCamButton:!hover:!pressed.state-active,
|
|
#modeSwitch:!hover:!pressed.state-active,
|
|
#broadcastButton:!hover:!pressed.state-active {
|
|
background: var(--primary);
|
|
}
|
|
|
|
/* Primary Control Button Hover Coloring */
|
|
#streamButton:hover:!pressed.state-active,
|
|
#recordButton:hover:!pressed.state-active,
|
|
#pauseRecordButton:hover:!pressed.state-active,
|
|
#replayBufferButton:!pressed.state-active,
|
|
#virtualCamButton:!pressed.state-active,
|
|
#modeSwitch:hover:!pressed.state-active,
|
|
#broadcastButton:hover:!pressed.state-active {
|
|
background: var(--primary_light);
|
|
color: var(--text);
|
|
}
|
|
|
|
|
|
/* Buttons */
|
|
|
|
QPushButton {
|
|
background-color: var(--button_bg);
|
|
color: var(--text);
|
|
border: 1px solid var(--button_border);
|
|
border-radius: var(--border_radius);
|
|
height: var(--input_height);
|
|
max-height: var(--input_height);
|
|
margin-top: var(--spacing_input);
|
|
margin-bottom: var(--spacing_input);
|
|
padding: var(--input_padding) var(--padding_wide);
|
|
icon-size: var(--icon_base);
|
|
outline: none;
|
|
}
|
|
|
|
QPushButton:hover {
|
|
background-color: var(--button_bg_hover);
|
|
}
|
|
|
|
QPushButton:hover,
|
|
QPushButton:focus {
|
|
border-color: var(--button_border_hover);
|
|
}
|
|
|
|
QPushButton::flat {
|
|
background-color: var(--button_bg);
|
|
}
|
|
|
|
QPushButton:checked {
|
|
background-color: var(--primary);
|
|
border-color: var(--primary_light);
|
|
}
|
|
|
|
QPushButton:checked:hover,
|
|
QPushButton:checked:focus {
|
|
border-color: var(--primary_lighter);
|
|
}
|
|
|
|
QPushButton:pressed,
|
|
QPushButton:pressed:hover {
|
|
background-color: var(--button_bg_down);
|
|
border-color: var(--button_border);
|
|
}
|
|
|
|
QPushButton:disabled {
|
|
background-color: var(--button_bg_disabled);
|
|
border-color: var(--button_border);
|
|
}
|
|
|
|
QPushButton::menu-indicator {
|
|
image: url(theme:Dark/collapse.svg);
|
|
subcontrol-position: right;
|
|
subcontrol-origin: content;
|
|
margin-left: var(--spacing_large);
|
|
right: -2px;
|
|
}
|
|
|
|
QToolButton {
|
|
border: 1px solid var(--button_border);
|
|
}
|
|
|
|
QToolButton,
|
|
.btn-tool {
|
|
background-color: var(--button_bg);
|
|
padding: var(--padding_base) var(--padding_base);
|
|
margin: 0px 0px;
|
|
border: 1px solid var(--button_border);
|
|
border-radius: var(--border_radius);
|
|
icon-size: var(--icon_base);
|
|
}
|
|
|
|
QToolButton:last-child,
|
|
.btn-tool:last-child {
|
|
margin-right: 0px;
|
|
}
|
|
|
|
QToolButton:hover,
|
|
QToolButton:focus,
|
|
.btn-tool:hover,
|
|
.btn-tool:focus {
|
|
border-color: var(--button_border);
|
|
background-color: var(--button_bg_hover);
|
|
}
|
|
|
|
QToolButton:checked,
|
|
.btn-tool:checked {
|
|
background-color: var(--primary);
|
|
border-color: var(--primary_light);
|
|
}
|
|
|
|
QToolButton:checked:hover,
|
|
QToolButton:checked:focus,
|
|
.btn-tool:checked:hover,
|
|
.btn-tool:checked:focus {
|
|
border-color: var(--primary_lighter);
|
|
}
|
|
|
|
QToolButton:pressed,
|
|
QToolButton:pressed:hover,
|
|
.btn-tool:pressed,
|
|
.btn-tool:pressed:hover {
|
|
background-color: var(--button_bg_down);
|
|
border-color: var(--button_border);
|
|
}
|
|
|
|
QToolButton:disabled,
|
|
.btn-tool:disabled {
|
|
background-color: var(--button_bg_disabled);
|
|
border-color: transparent;
|
|
}
|
|
|
|
/* Sliders */
|
|
|
|
QSlider::groove {
|
|
background-color: var(--grey4);
|
|
border: none;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
QSlider::groove:horizontal {
|
|
height: 4px;
|
|
}
|
|
|
|
QSlider::groove:vertical {
|
|
width: 4px;
|
|
}
|
|
|
|
QSlider::sub-page:horizontal {
|
|
background-color: var(--blue2);
|
|
border-radius: 2px;
|
|
}
|
|
|
|
QSlider::sub-page:horizontal:disabled {
|
|
background-color: var(--grey4);
|
|
border-radius: 2px;
|
|
}
|
|
|
|
QSlider::add-page:horizontal:disabled {
|
|
background-color: var(--grey7);
|
|
border-radius: 2px;
|
|
}
|
|
|
|
QSlider::add-page:vertical {
|
|
background-color: var(--blue2);
|
|
border-radius: 2px;
|
|
}
|
|
|
|
QSlider::add-page:vertical:disabled {
|
|
background-color: var(--grey4);
|
|
border-radius: 2px;
|
|
}
|
|
|
|
QSlider::sub-page:vertical:disabled {
|
|
background-color: var(--grey7);
|
|
border-radius: 2px;
|
|
}
|
|
|
|
QSlider::handle {
|
|
background-color: var(--white1);
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
QSlider::handle:horizontal {
|
|
height: 10px;
|
|
width: 20px;
|
|
/* Handle is placed by default on the contents rect of the groove. Expand outside the groove */
|
|
margin: -3px 0;
|
|
}
|
|
|
|
QSlider::handle:vertical {
|
|
width: 10px;
|
|
height: 20px;
|
|
/* Handle is placed by default on the contents rect of the groove. Expand outside the groove */
|
|
margin: 0 -3px;
|
|
}
|
|
|
|
QSlider::handle:hover {
|
|
background-color: var(--white4);
|
|
}
|
|
|
|
QSlider::handle:pressed {
|
|
background-color: var(--white3);
|
|
}
|
|
|
|
QSlider::handle:disabled {
|
|
background-color: var(--white5);
|
|
}
|
|
|
|
#stackedMixerArea {
|
|
border: none;
|
|
padding: 0px;
|
|
}
|
|
|
|
.mixer-category {
|
|
color: var(--text_muted);
|
|
margin: 0;
|
|
padding: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
/* Volume Control Buttons */
|
|
|
|
.btn-mute,
|
|
.btn-monitor {
|
|
width: var(--icon_small);
|
|
height: var(--icon_small);
|
|
background-color: transparent;
|
|
padding: var(--padding_base_border) var(--padding_base_border);
|
|
margin: 0px var(--spacing_small);
|
|
border: var(--highlight_width) solid transparent;
|
|
border-radius: var(--border_radius);
|
|
icon-size: var(--icon_small);
|
|
}
|
|
|
|
.btn-mute:checked,
|
|
.btn-monitor:checked {
|
|
background-color: transparent;
|
|
border-color: transparent;
|
|
}
|
|
|
|
.btn-mute:hover,
|
|
.btn-monitor:hover {
|
|
background-color: var(--button_bg_hover);
|
|
border-color: transparent;
|
|
}
|
|
|
|
.btn-mute:pressed,
|
|
.btn-monitor:pressed {
|
|
background-color: var(--button_bg_down);
|
|
}
|
|
|
|
/* Mute Button */
|
|
|
|
.btn-mute {
|
|
color: var(--text);
|
|
qproperty-icon: url(theme:Dark/settings/audio.svg);
|
|
}
|
|
|
|
.btn-mute.checked {
|
|
color: var(--red3);
|
|
background: transparent;
|
|
qproperty-icon: url(theme:Dark/mute.svg);
|
|
}
|
|
|
|
.btn-mute.checked.hover {
|
|
color: var(--red2);
|
|
background: var(--grey8);
|
|
border-color: var(--red1);
|
|
}
|
|
|
|
.btn-mute.checked:focus {
|
|
border-color: var(--red1);
|
|
}
|
|
|
|
.btn-mute.mute-warning {
|
|
color: var(--yellow1);
|
|
background: var(--yellow6);
|
|
qproperty-icon: url(theme:Dark/unassigned.svg);
|
|
}
|
|
|
|
.btn-mute.mute-warning.hover,
|
|
.btn-mute.mute-warning:focus {
|
|
border-color: var(--yellow1);
|
|
}
|
|
|
|
/* Monitor Button */
|
|
|
|
.btn-monitor {
|
|
background: transparent;
|
|
qproperty-icon: url(theme:Dark/headphones-off.svg);
|
|
}
|
|
|
|
.btn-monitor:focus {
|
|
border-color: var(--red1);
|
|
}
|
|
|
|
.btn-monitor.checked {
|
|
background: var(--green4);
|
|
color: var(--text_light);
|
|
qproperty-icon: url(theme:Dark/headphones.svg);
|
|
}
|
|
|
|
.btn-monitor.checked:focus,
|
|
.btn-monitor:checked:focus {
|
|
color: var(--text_light);
|
|
border-color: var(--green1);
|
|
}
|
|
|
|
.btn-monitor.checked:hover {
|
|
background: var(--green3);
|
|
border-color: var(--green1);
|
|
color: var(--text_light);
|
|
}
|
|
|
|
/* Toggle hidden button */
|
|
|
|
.toggle-hidden:checked {
|
|
background: var(--purple5);
|
|
border-color: var(--purple3);
|
|
}
|
|
|
|
.toggle-hidden:disabled {
|
|
background: transparent;
|
|
border-color: transparent;
|
|
}
|
|
|
|
VolumeControl,
|
|
VolumeMeter {
|
|
background: var(--bg_base);
|
|
}
|
|
|
|
VolumeMeter {
|
|
color: var(--grey3);
|
|
font-size: 6pt;
|
|
font-weight: bold;
|
|
|
|
qproperty-backgroundNominalColor: var(--green5);
|
|
qproperty-backgroundWarningColor: var(--yellow5);
|
|
qproperty-backgroundErrorColor: var(--red5);
|
|
qproperty-foregroundNominalColor: var(--green2);
|
|
qproperty-foregroundWarningColor: var(--yellow2);
|
|
qproperty-foregroundErrorColor: var(--red2);
|
|
qproperty-magnitudeColor: rgb(0, 0, 0);
|
|
qproperty-majorTickColor: var(--white5);
|
|
qproperty-minorTickColor: var(--grey1);
|
|
|
|
qproperty-backgroundNominalColorDisabled: var(--black4);
|
|
qproperty-backgroundWarningColorDisabled: var(--black5);
|
|
qproperty-backgroundErrorColorDisabled: var(--black3);
|
|
qproperty-foregroundNominalColorDisabled: var(--white3);
|
|
qproperty-foregroundWarningColorDisabled: var(--white3);
|
|
qproperty-foregroundErrorColorDisabled: var(--white4);
|
|
}
|
|
|
|
VolumeName {
|
|
background: transparent;
|
|
padding: var(--padding_base) 0;
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
VolumeName QLabel {
|
|
font-size: var(--font_small);
|
|
}
|
|
|
|
VolumeName:focus {
|
|
border: 1px solid var(--button_border_hover);
|
|
}
|
|
|
|
VolumeName:hover {
|
|
background: var(--button_bg_hover);
|
|
border: 1px solid var(--button_border_hover);
|
|
}
|
|
|
|
VolumeControl #volLabel {
|
|
min-width: 48px;
|
|
padding: var(--padding_base) 0px var(--padding_base);
|
|
text-align: center;
|
|
font-size: var(--font_small);
|
|
color: var(--text_muted);
|
|
}
|
|
|
|
/* Horizontal Mixer */
|
|
#hVolumeWidgets VolumeControl {
|
|
padding: 0px 0px;
|
|
border-bottom: 1px solid var(--border_color);
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
#hVolumeWidgets .mixer-category {
|
|
margin: var(--spacing_base);
|
|
padding: 0px var(--padding_xlarge);
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
#hVolumeWidgets VolumeName {
|
|
padding-right: var(--padding_large);
|
|
}
|
|
|
|
#hVolumeWidgets VolumeName QLabel {
|
|
margin: 0 var(--padding_large);
|
|
}
|
|
|
|
#hVolumeWidgets #volLabel {
|
|
margin: 0 var(--spacing_base);
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
#hVolumeWidgets #volMeterFrame {
|
|
margin-bottom: var(--padding_large);
|
|
}
|
|
|
|
#hVolumeWidgets VolumeControl QSlider {
|
|
margin: var(--padding_large) 0px var(--padding_large);
|
|
}
|
|
|
|
#hVolumeWidgets VolumeControl QSlider::groove:horizontal {
|
|
background: var(--bg_window);
|
|
height: var(--volume_slider);
|
|
}
|
|
|
|
#hVolumeWidgets VolumeControl QPushButton {
|
|
margin-left: var(--padding_large);
|
|
}
|
|
|
|
#hVolumeWidgets VolumeControl #volMeterFrame {
|
|
padding: 0 var(--padding_xlarge);
|
|
}
|
|
|
|
/* Vertical Mixer */
|
|
#vVolumeWidgets VolumeControl {
|
|
padding: 0px 0px var(--padding_container);
|
|
border-right: 1px solid var(--border_color);
|
|
}
|
|
|
|
#vVolumeWidgets .mixer-category {
|
|
border-bottom: 1px solid var(--border_color);
|
|
}
|
|
|
|
#vMixerScrollArea VolumeControl QSlider {
|
|
width: var(--volume_slider_box);
|
|
margin: 0px var(--padding_xlarge);
|
|
}
|
|
|
|
#vVolumeWidgets VolumeControl #volLabel {
|
|
padding: var(--padding_base) 0px var(--padding_base);
|
|
min-width: var(--volume_slider_label);
|
|
margin-left: var(--padding_xlarge);
|
|
text-align: center;
|
|
}
|
|
|
|
#vVolumeWidgets VolumeControl QSlider::groove:vertical {
|
|
background: var(--bg_window);
|
|
width: var(--volume_slider);
|
|
}
|
|
|
|
#vVolumeWidgets VolumeControl #volMeterFrame {
|
|
padding: var(--padding_large) var(--padding_xlarge) var(--padding_large) 0px;
|
|
}
|
|
|
|
#vVolumeWidgets VolumeControl QLabel {
|
|
padding: 0px var(--padding_large);
|
|
}
|
|
|
|
VolumeControl.volume-inactive,
|
|
VolumeControl.volume-inactive VolumeMeter {
|
|
background: var(--grey7);
|
|
}
|
|
|
|
VolumeControl.volume-hidden .mixer-name,
|
|
VolumeControl.volume-inactive .mixer-name {
|
|
color: var(--text_muted);
|
|
}
|
|
|
|
VolumeControl .mixer-category {
|
|
font-weight: bold;
|
|
background: var(--blue6);
|
|
color: var(--blue1);
|
|
}
|
|
|
|
VolumeControl.volume-pinned .mixer-category {
|
|
background: var(--blue5);
|
|
color: var(--text_light);
|
|
}
|
|
|
|
VolumeControl.volume-hidden .mixer-category {
|
|
background: var(--purple6);
|
|
color: var(--purple1);
|
|
}
|
|
|
|
VolumeControl.volume-unassigned .mixer-category {
|
|
background: var(--yellow6);
|
|
color: var(--yellow1);
|
|
}
|
|
|
|
VolumeControl.volume-inactive .mixer-category {
|
|
background: var(--grey8);
|
|
color: var(--text_muted);
|
|
}
|
|
|
|
VolumeControl.volume-preview .mixer-category {
|
|
background: var(--green6);
|
|
color: var(--green1);
|
|
}
|
|
|
|
#stackedMixerArea VolumeControl.volume-hidden QSlider::groove,
|
|
#stackedMixerArea VolumeControl.volume-inactive QSlider::groove {
|
|
background: var(--grey8);
|
|
}
|
|
|
|
/* Status Bar */
|
|
|
|
QStatusBar::item {
|
|
border: none;
|
|
}
|
|
|
|
/* Table View */
|
|
|
|
QTableView {
|
|
background: var(--bg_base);
|
|
gridline-color: var(--grey1);
|
|
}
|
|
|
|
QTableView::item {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
}
|
|
|
|
QTableView QLineEdit {
|
|
background: var(--input_bg_focus);
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
QTableView QPushButton,
|
|
QTableView QToolButton {
|
|
padding: 0px;
|
|
margin: -1px;
|
|
border-radius: 0px;
|
|
}
|
|
|
|
QHeaderView::section {
|
|
background-color: var(--button_bg);
|
|
color: var(--text);
|
|
border: none;
|
|
border-left: 1px solid var(--bg_window);
|
|
border-right: 1px solid var(--bg_window);
|
|
padding: 3px 0px;
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
/* Canvas / Preview background color */
|
|
|
|
OBSQTDisplay {
|
|
qproperty-displayBackgroundColor: var(--bg_preview);
|
|
}
|
|
|
|
/* Filters Window */
|
|
|
|
OBSBasicFilters #widget,
|
|
OBSBasicFilters #widget_2 {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
padding-bottom: var(--padding_base);
|
|
}
|
|
|
|
OBSBasicFilters #widget QPushButton,
|
|
OBSBasicFilters #widget_2 QPushButton {
|
|
min-width: 16px;
|
|
padding: var(--padding_base) var(--padding_large);
|
|
margin-top: 0px;
|
|
}
|
|
|
|
/* Preview/Program labels */
|
|
|
|
.label-preview-title {
|
|
font-size: var(--font_xlarge);
|
|
font-weight: bold;
|
|
color: var(--text_light);
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
/* Settings Icons */
|
|
|
|
OBSBasicSettings {
|
|
qproperty-generalIcon: url(theme:Dark/settings/general.svg);
|
|
qproperty-appearanceIcon: url(theme:Dark/settings/appearance.svg);
|
|
qproperty-streamIcon: url(theme:Dark/settings/stream.svg);
|
|
qproperty-outputIcon: url(theme:Dark/settings/output.svg);
|
|
qproperty-audioIcon: url(theme:Dark/settings/audio.svg);
|
|
qproperty-videoIcon: url(theme:Dark/settings/video.svg);
|
|
qproperty-hotkeysIcon: url(theme:Dark/settings/hotkeys.svg);
|
|
qproperty-accessibilityIcon: url(theme:Dark/settings/accessibility.svg);
|
|
qproperty-advancedIcon: url(theme:Dark/settings/advanced.svg);
|
|
}
|
|
|
|
/* Checkboxes */
|
|
|
|
QCheckBox::indicator,
|
|
QGroupBox::indicator,
|
|
QTableView::indicator {
|
|
width: var(--icon_base);
|
|
height: var(--icon_base);
|
|
margin-right: var(--spacing_large);
|
|
}
|
|
|
|
QGroupBox::indicator {
|
|
margin-left: 2px;
|
|
}
|
|
|
|
QCheckBox::indicator:unchecked,
|
|
QGroupBox::indicator:unchecked,
|
|
QTableView::indicator:unchecked {
|
|
image: url(theme:Yami/checkbox_unchecked.svg);
|
|
}
|
|
|
|
QCheckBox::indicator:unchecked:hover,
|
|
QGroupBox::indicator:unchecked:hover,
|
|
QTableView::indicator:unchecked:hover {
|
|
image: url(theme:Yami/checkbox_unchecked_focus.svg);
|
|
}
|
|
|
|
QCheckBox::indicator:checked,
|
|
QGroupBox::indicator:checked,
|
|
QTableView::indicator:checked {
|
|
image: url(theme:Yami/checkbox_checked.svg);
|
|
}
|
|
|
|
QCheckBox::indicator:checked:hover,
|
|
QGroupBox::indicator:checked:hover,
|
|
QTableView::indicator:checked:hover {
|
|
image: url(theme:Yami/checkbox_checked_focus.svg);
|
|
}
|
|
|
|
QCheckBox::indicator:checked:disabled,
|
|
QGroupBox::indicator:checked:disabled,
|
|
QTableView::indicator:checked:disabled {
|
|
image: url(theme:Yami/checkbox_checked_disabled.svg);
|
|
}
|
|
|
|
QCheckBox::indicator:unchecked:disabled,
|
|
QGroupBox::indicator:unchecked:disabled,
|
|
QTableView::indicator:unchecked:disabled {
|
|
image: url(theme:Yami/checkbox_unchecked_disabled.svg);
|
|
}
|
|
|
|
/* Icon Checkboxes */
|
|
.checkbox-icon {
|
|
outline: none;
|
|
background: transparent;
|
|
max-width: var(--icon_base);
|
|
max-height: var(--icon_base);
|
|
padding: var(--padding_base);
|
|
margin-right: var(--spacing_large);
|
|
border: var(--highlight_width) solid transparent;
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
.checkbox-icon::indicator {
|
|
width: var(--icon_base);
|
|
height: var(--icon_base);
|
|
}
|
|
|
|
.checkbox-icon:hover,
|
|
.checkbox-icon:focus {
|
|
border-color: var(--primary_lighter);
|
|
}
|
|
|
|
/* Locked CheckBox */
|
|
|
|
.indicator-lock::indicator:checked,
|
|
.indicator-lock::indicator:checked:hover {
|
|
image: url(theme:Dark/locked.svg);
|
|
}
|
|
|
|
.indicator-lock::indicator:unchecked,
|
|
.indicator-lock::indicator:unchecked:hover {
|
|
image: url(:res/images/unlocked.svg);
|
|
}
|
|
|
|
/* Visibility CheckBox */
|
|
|
|
.indicator-visibility::indicator:checked,
|
|
.indicator-visibility::indicator:checked:hover {
|
|
image: url(theme:Dark/visible.svg);
|
|
}
|
|
|
|
.indicator-visibility::indicator:unchecked,
|
|
.indicator-visibility::indicator:unchecked:hover {
|
|
image: url(:res/images/invisible.svg);
|
|
}
|
|
|
|
#hotkeyFilterReset {
|
|
margin-top: 0px;
|
|
}
|
|
|
|
OBSHotkeyWidget {
|
|
padding: 8px 0px;
|
|
margin: 2px 0px;
|
|
}
|
|
|
|
OBSHotkeyLabel {
|
|
padding: 4px 0px;
|
|
}
|
|
|
|
OBSHotkeyWidget QPushButton {
|
|
min-width: 16px;
|
|
padding: var(--padding_base);
|
|
margin-top: 0px;
|
|
margin-left: var(--spacing_base);
|
|
}
|
|
|
|
|
|
/* Sources List Group Collapse Checkbox */
|
|
|
|
.indicator-expand::indicator:checked,
|
|
.indicator-expand::indicator:checked:hover {
|
|
image: url(theme:Dark/expand.svg);
|
|
}
|
|
|
|
.indicator-expand::indicator:unchecked,
|
|
.indicator-expand::indicator:unchecked:hover {
|
|
image: url(theme:Dark/collapse.svg);
|
|
}
|
|
|
|
/* Source Icons */
|
|
|
|
.source-icon {
|
|
margin-right: var(--spacing_large);
|
|
}
|
|
|
|
OBSBasic {
|
|
qproperty-imageIcon: url(theme:Dark/sources/image.svg);
|
|
qproperty-colorIcon: url(theme:Dark/sources/brush.svg);
|
|
qproperty-slideshowIcon: url(theme:Dark/sources/slideshow.svg);
|
|
qproperty-audioInputIcon: url(theme:Dark/sources/microphone.svg);
|
|
qproperty-audioOutputIcon: url(theme:Dark/settings/audio.svg);
|
|
qproperty-desktopCapIcon: url(theme:Dark/settings/video.svg);
|
|
qproperty-windowCapIcon: url(theme:Dark/sources/window.svg);
|
|
qproperty-gameCapIcon: url(theme:Dark/sources/gamepad.svg);
|
|
qproperty-cameraIcon: url(theme:Dark/sources/camera.svg);
|
|
qproperty-textIcon: url(theme:Dark/sources/text.svg);
|
|
qproperty-mediaIcon: url(theme:Dark/sources/media.svg);
|
|
qproperty-browserIcon: url(theme:Dark/sources/globe.svg);
|
|
qproperty-groupIcon: url(theme:Dark/sources/group.svg);
|
|
qproperty-sceneIcon: url(theme:Dark/sources/scene.svg);
|
|
qproperty-defaultIcon: url(theme:Dark/sources/default.svg);
|
|
qproperty-audioProcessOutputIcon: url(theme:Dark/sources/windowaudio.svg);
|
|
}
|
|
|
|
/* Scene Tree Grid Mode */
|
|
|
|
SceneTree {
|
|
qproperty-gridItemWidth: 154;
|
|
qproperty-gridItemHeight: var(--input_height_base);
|
|
}
|
|
|
|
.list-grid SceneTree::item {
|
|
color: var(--text);
|
|
background-color: var(--button_bg);
|
|
border-radius: var(--border_radius);
|
|
margin: var(--spacing_base);
|
|
}
|
|
|
|
.list-grid SceneTree::item:selected {
|
|
background-color: var(--list_item_bg_selected);
|
|
}
|
|
|
|
.list-grid SceneTree::item:checked {
|
|
background-color: var(--primary);
|
|
}
|
|
|
|
.list-grid SceneTree::item:hover {
|
|
background-color: var(--list_item_bg_hover);
|
|
}
|
|
|
|
.list-grid SceneTree::item:selected:hover {
|
|
background-color: var(--list_item_bg_hover);
|
|
}
|
|
|
|
/* Studio Mode T-Bar */
|
|
|
|
.slider-tbar {
|
|
height: 24px;
|
|
}
|
|
|
|
.slider-tbar::groove:horizontal {
|
|
height: 8px;
|
|
}
|
|
|
|
.slider-tbar::sub-page:horizontal {
|
|
background: var(--blue2);
|
|
}
|
|
|
|
.slider-tbar::handle:horizontal {
|
|
width: 12px;
|
|
height: 24px;
|
|
margin: -24px 0px;
|
|
}
|
|
|
|
/* YouTube Integration */
|
|
OBSYoutubeActions {
|
|
qproperty-thumbPlaceholder: url(theme:Dark/sources/image.svg);
|
|
}
|
|
|
|
#ytEventList QLabel {
|
|
color: var(--text);
|
|
background-color: var(--button_bg);
|
|
border: none;
|
|
border-radius: var(--border_radius);
|
|
padding: 4px 20px;
|
|
}
|
|
|
|
#ytEventList QLabel:hover {
|
|
background-color: var(--button_bg_hover);
|
|
}
|
|
|
|
#ytEventList .row-selected {
|
|
background-color: var(--primary);
|
|
border: none;
|
|
}
|
|
|
|
#ytEventList .row-selected:hover {
|
|
background-color: var(--primary_light);
|
|
color: var(--text);
|
|
}
|
|
|
|
/* Calendar Widget */
|
|
QDateTimeEdit::down-arrow {
|
|
qproperty-alignment: AlignTop;
|
|
image: url(theme:Dark/down.svg);
|
|
width: 100%;
|
|
}
|
|
|
|
QDateTimeEdit:on {
|
|
background-color: var(--grey7);
|
|
}
|
|
|
|
/* Calendar Top Bar */
|
|
QCalendarWidget QWidget#qt_calendar_navigationbar {
|
|
background-color: var(--bg_base);
|
|
padding: var(--padding_base) var(--padding_large);
|
|
}
|
|
|
|
/* Calendar Top Bar Buttons */
|
|
QCalendarWidget QToolButton {
|
|
background-color: var(--button_bg);
|
|
padding: 2px 16px;
|
|
border-radius: var(--border_radius);
|
|
margin: var(--spacing_base);
|
|
}
|
|
|
|
#qt_calendar_monthbutton::menu-indicator {
|
|
image: url(theme:Dark/down.svg);
|
|
subcontrol-position: right;
|
|
padding-top: var(--padding_small);
|
|
padding-right: var(--padding_base);
|
|
height: 10px;
|
|
width: 10px;
|
|
}
|
|
|
|
QCalendarWidget #qt_calendar_prevmonth {
|
|
padding: var(--padding_small);
|
|
qproperty-icon: url(theme:Dark/left.svg);
|
|
icon-size: var(--icon_base);
|
|
}
|
|
|
|
QCalendarWidget #qt_calendar_nextmonth {
|
|
padding: var(--padding_small);
|
|
qproperty-icon: url(theme:Dark/right.svg);
|
|
icon-size: var(--icon_base);
|
|
}
|
|
|
|
QCalendarWidget QToolButton:hover {
|
|
background-color: var(--button_bg_hover);
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
QCalendarWidget QToolButton:pressed {
|
|
background-color: var(--button_bg_down);
|
|
}
|
|
|
|
/* Month Dropdown Menu */
|
|
QCalendarWidget QMenu {}
|
|
|
|
/* Year spinbox */
|
|
QCalendarWidget QSpinBox {
|
|
background-color: var(--input_bg);
|
|
border: none;
|
|
border-radius: var(--border_radius);
|
|
margin: 0px var(--spacing_base) 0px 0px;
|
|
padding: var(--padding_base) 16px;
|
|
}
|
|
|
|
QCalendarWidget QSpinBox::up-button {
|
|
subcontrol-origin: border;
|
|
subcontrol-position: top right;
|
|
width: 16px;
|
|
}
|
|
|
|
QCalendarWidget QSpinBox::down-button {
|
|
subcontrol-origin: border;
|
|
subcontrol-position: bottom right;
|
|
width: 16px;
|
|
}
|
|
|
|
QCalendarWidget QSpinBox::up-arrow {
|
|
width: 10px;
|
|
height: 10px;
|
|
}
|
|
|
|
QCalendarWidget QSpinBox::down-arrow {
|
|
width: 10px;
|
|
height: 10px;
|
|
}
|
|
|
|
/* Days of the Week Bar */
|
|
QCalendarWidget QWidget {
|
|
alternate-background-color: var(--grey7);
|
|
}
|
|
|
|
QCalendarWidget QAbstractItemView:enabled {
|
|
background-color: var(--bg_base);
|
|
color: var(--text);
|
|
}
|
|
|
|
QCalendarWidget QAbstractItemView:disabled {
|
|
color: var(--text_disabled);
|
|
}
|
|
|
|
/* VirtualCam Plugin Fixes */
|
|
|
|
#VirtualProperties QWidget {
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
/* Disable icons on QDialogButtonBox */
|
|
QDialogButtonBox {
|
|
dialogbuttonbox-buttons-have-icons: 0;
|
|
}
|
|
|
|
/* Stats dialog */
|
|
OBSBasicStats {
|
|
background: var(--bg_base);
|
|
}
|
|
|
|
/* Advanced audio dialog */
|
|
OBSBasicAdvAudio #scrollAreaWidgetContents {
|
|
background: var(--bg_base);
|
|
}
|
|
|
|
#previewScalePercent,
|
|
#previewScalingMode {
|
|
background: transparent;
|
|
color: var(--text_muted);
|
|
font-size: var(--font_xsmall);
|
|
height: 14px;
|
|
max-height: 14px;
|
|
padding: 0px;
|
|
margin: 0;
|
|
border: none;
|
|
border-radius: 0;
|
|
}
|
|
|
|
#previewXContainer {
|
|
border: 1px solid var(--grey6);
|
|
}
|
|
|
|
#previewScalePercent {
|
|
padding: 0px var(--input_text_padding);
|
|
min-width: var(--preview_scale_width);
|
|
}
|
|
|
|
#previewScalingMode {
|
|
padding: 0px var(--input_text_padding);
|
|
border: 1px solid var(--grey6);
|
|
}
|
|
|
|
#previewScalingMode:hover,
|
|
#previewScalingMode:focus {
|
|
border-color: var(--input_border_hover);
|
|
}
|
|
|
|
#previewScalingMode:on {
|
|
background-color: var(--input_bg_focus);
|
|
border-color: var(--input_border_focus);
|
|
}
|
|
|
|
#previewXScrollBar,
|
|
#previewYScrollBar {
|
|
background: transparent;
|
|
border: 1px solid var(--grey6);
|
|
border-radius: 0;
|
|
}
|
|
|
|
#previewXScrollBar {
|
|
border-left: none;
|
|
height: 16px;
|
|
}
|
|
|
|
#previewXScrollBar::handle,
|
|
#previewYScrollBar::handle {
|
|
margin: 3px;
|
|
}
|
|
|
|
#previewYScrollBar {
|
|
width: 16px;
|
|
}
|
|
|
|
#previewZoomInButton {
|
|
border: none;
|
|
border-radius: 0px;
|
|
outline: none;
|
|
}
|
|
|
|
#previewZoomOutButton {
|
|
border: none;
|
|
border-radius: 0px;
|
|
outline: none;
|
|
}
|
|
|
|
#previewZoomInButton:!hover,
|
|
#previewZoomOutButton:!hover {
|
|
background-color: transparent;
|
|
}
|
|
|
|
#previewZoomInButton:pressed,
|
|
#previewZoomOutButton:pressed {
|
|
background-color: var(--button_bg);
|
|
}
|
|
|
|
#previewZoomInButton:focus,
|
|
#previewZoomOutButton:focus {
|
|
border: 1px solid var(--input_border_hover);
|
|
}
|
|
|
|
/* Add Source Dialog */
|
|
.btn-create-new {
|
|
background: transparent;
|
|
padding: var(--padding_wide) var(--padding_large);
|
|
border-radius: var(--border_radius);
|
|
border: 2px dashed var(--grey3);
|
|
outline: none;
|
|
qproperty-icon: url(theme:Dark/plus.svg);
|
|
margin-bottom: var(--spacing_large);
|
|
}
|
|
|
|
SourceSelectButton {
|
|
background: var(--grey5);
|
|
padding: var(--padding_base) var(--padding_large);
|
|
margin: var(--spacing_base);
|
|
border-radius: var(--border_radius);
|
|
border: 1px solid var(--grey3);
|
|
outline: none;
|
|
}
|
|
|
|
SourceSelectButton QLabel {
|
|
padding: var(--padding_large) 0;
|
|
text-align: center;
|
|
}
|
|
|
|
SourceSelectButton #thumbnail {
|
|
background: var(--grey6);
|
|
border-radius: var(--border_radius);
|
|
padding: 0;
|
|
margin-top: var(--spacing_base);
|
|
}
|
|
|
|
SourceSelectButton:hover {
|
|
background-color: var(--button_bg_hover);
|
|
}
|
|
|
|
SourceSelectButton:checked {
|
|
background-color: var(--primary);
|
|
border-color: var(--primary_light);
|
|
}
|
|
|
|
SourceSelectButton:focus,
|
|
SourceSelectButton:checked:focus {
|
|
border-color: var(--white3);
|
|
}
|
|
|
|
SourceSelectButton:pressed,
|
|
SourceSelectButton:pressed:hover {
|
|
background-color: var(--button_bg_down);
|
|
border-color: var(--button_border);
|
|
}
|
|
|
|
/* Idian Widgets */
|
|
idian--Group {
|
|
border-radius: var(--border_radius);
|
|
font-weight: bold;
|
|
margin: 0 0 var(--spacing_base);
|
|
min-width: 300px;
|
|
max-width: 600px;
|
|
}
|
|
|
|
idian--Group .header .title {
|
|
font-weight: bold;
|
|
padding: var(--padding_large) 0;
|
|
}
|
|
|
|
idian--Group .header .description {
|
|
color: var(--text_muted);
|
|
padding: var(--spacing_small) 0;
|
|
}
|
|
|
|
idian--PropertiesList {
|
|
border-width: 0;
|
|
padding: 0;
|
|
margin: var(--spacing_base) 0;
|
|
}
|
|
|
|
idian--Row {
|
|
background: var(--grey5);
|
|
margin: 0;
|
|
padding: var(--action_row_padding) var(--action_row_padding_x);
|
|
}
|
|
|
|
idian--Row.keyFocus {
|
|
background: var(--grey4);
|
|
border: var(--highlight_width) solid var(--grey4);
|
|
}
|
|
|
|
idian--Row.cursor-pointer.hover {
|
|
background: var(--grey4);
|
|
border: var(--highlight_width) solid var(--grey1);
|
|
}
|
|
|
|
idian--Row.first {
|
|
border-top-left-radius: var(--border_radius);
|
|
border-top-right-radius: var(--border_radius);
|
|
}
|
|
|
|
idian--Row.last {
|
|
border-bottom-left-radius: var(--border_radius);
|
|
border-bottom-right-radius: var(--border_radius);
|
|
}
|
|
|
|
idian--Row > QLabel.description {
|
|
font-size: var(--font_small);
|
|
color: var(--text_muted);
|
|
}
|
|
|
|
idian--ToggleSwitch {
|
|
qproperty-background: var(--grey6);
|
|
qproperty-background_hover: var(--grey7);
|
|
qproperty-background_checked: var(--primary);
|
|
qproperty-background_checked_hover: var(--primary_light);
|
|
|
|
min-width: var(--toggle_width);
|
|
min-height: var(--toggle_height);
|
|
|
|
border-radius: var(--toggle_radius);
|
|
|
|
qproperty-handleColor: var(--white1);
|
|
qproperty-handleSize: var(--toggle_handle);
|
|
|
|
border: var(--highlight_width) solid transparent;
|
|
}
|
|
|
|
idian--ToggleSwitch.hover {
|
|
border-color: var(--grey4);
|
|
}
|
|
|
|
idian--ToggleSwitch.checked.hover {
|
|
border-color: var(--white1);
|
|
}
|
|
|
|
idian--ToggleSwitch.keyFocus {
|
|
border-color: var(--highlight_color);
|
|
}
|
|
|
|
idian--Row idian--ToggleSwitch.hover,
|
|
idian--Row.hover > idian--ToggleSwitch.row-buddy {
|
|
border-color: var(--grey1);
|
|
}
|
|
|
|
idian--Row idian--ToggleSwitch.hover.checked,
|
|
idian--Row.hover > idian--ToggleSwitch.checked.row-buddy {
|
|
border-color: var(--white1);
|
|
}
|
|
|
|
idian--Row QComboBox {
|
|
background-color: transparent;
|
|
min-height: var(--action_row_base);
|
|
max-height: var(--action_row_base);
|
|
min-width: var(--action_row_input_width);
|
|
border: var(--highlight_width) solid transparent;
|
|
padding: 0;
|
|
padding-left: var(--padding_xlarge);
|
|
margin: 0;
|
|
}
|
|
|
|
idian--Row QComboBox:focus {
|
|
border-color: transparent;
|
|
}
|
|
|
|
idian--Row QComboBox.hover {
|
|
border-color: var(--grey1);
|
|
}
|
|
|
|
idian--Row QComboBox.keyFocus {
|
|
border-color: var(--highlight_color);
|
|
}
|
|
|
|
idian--Row QComboBox::drop-down {
|
|
border: none;
|
|
}
|
|
|
|
idian--Row QComboBox::down-arrow {
|
|
image: url(theme:Dark/collapse.svg);
|
|
}
|
|
|
|
idian--Row QComboBox QAbstractItemView {
|
|
outline: none;
|
|
}
|
|
|
|
idian--Row QComboBox QAbstractItemView::item {
|
|
background-color: var(--bg_base);
|
|
padding: var(--padding_base) var(--padding_large);
|
|
}
|
|
|
|
idian--Row QComboBox QAbstractItemView.hover::item,
|
|
idian--Row QComboBox QAbstractItemView::item:selected {
|
|
background-color: var(--list_item_bg_selected);
|
|
padding: var(--padding_base) var(--padding_large);
|
|
}
|
|
|
|
idian--Row QPushButton,
|
|
idian--Row QSpinBox,
|
|
idian--Row QDoubleSpinBox {
|
|
margin: 0;
|
|
padding: var(--padding_base) var(--action_row_padding_x);
|
|
}
|
|
|
|
idian--PropertiesListSpacer {
|
|
max-height: var(--spacing_small);
|
|
min-height: var(--spacing_small);
|
|
background-color: var(--bg_window);
|
|
}
|
|
|
|
idian--Row idian--CheckBox {
|
|
outline: none;
|
|
}
|
|
|
|
idian--CheckBox::indicator {
|
|
border: var(--highlight_width) solid transparent;
|
|
border-radius: var(--border_radius);
|
|
}
|
|
|
|
idian--CheckBox.keyFocus::indicator,
|
|
idian--Row.hover > idian--CheckBox.row-buddy::indicator {
|
|
image: url(theme:Yami/checkbox_unchecked_focus.svg);
|
|
}
|
|
|
|
idian--CheckBox.keyFocus.checked::indicator,
|
|
idian--Row.hover > idian--CheckBox.row-buddy.checked::indicator {
|
|
image: url(theme:Yami/checkbox_checked_focus.svg);
|
|
}
|
|
|
|
idian--CheckBox.hover::indicator,
|
|
idian--CheckBox.checked.hover::indicator,
|
|
idian--Row.hover > idian--CheckBox.row-buddy::indicator
|
|
idian--Row.hover > idian--CheckBox.row-buddy.checked::indicator {
|
|
border-color: var(--grey1);
|
|
}
|
|
|
|
idian--CheckBox.keyFocus::indicator,
|
|
idian--CheckBox.keyFocus.checked::indicator {
|
|
border-color: var(--highlight_color);
|
|
}
|
|
|
|
idian--CollapsibleRow {
|
|
margin: 0;
|
|
padding: 0;
|
|
border: none;
|
|
}
|
|
|
|
idian--CollapsibleRow.keyFocus {
|
|
border: var(--highlight_width) solid var(--highlight_color);
|
|
}
|
|
|
|
idian--CollapsibleRow idian--PropertiesList {
|
|
border-radius: 0;
|
|
border-left: 1px solid var(--grey5);
|
|
border-right: 1px solid var(--grey5);
|
|
border-bottom: 1px solid var(--grey5);
|
|
margin: var(--spacing_small) 0px 0px;
|
|
}
|
|
|
|
idian--CollapsibleRow idian--PropertiesList idian--Row {
|
|
background-color: var(--grey6);
|
|
padding-left: var(--action_row_padding_nested);
|
|
}
|
|
|
|
idian--CollapsibleRow idian--Row.first,
|
|
idian--CollapsibleRow idian--Row.last {
|
|
border-radius: 0;
|
|
}
|
|
|
|
idian--CollapsibleRow idian--PropertiesList idian--ToggleSwitch {
|
|
qproperty-background: var(--grey7);
|
|
qproperty-background_hover: var(--grey6);
|
|
}
|
|
|
|
idian--ExpandButton {
|
|
background: transparent;
|
|
min-width: var(--action_row_collapse);
|
|
max-width: var(--action_row_collapse);
|
|
min-height: var(--action_row_collapse);
|
|
max-height: var(--action_row_collapse);
|
|
border: none;
|
|
}
|
|
|
|
idian--ExpandButton::indicator {
|
|
background: var(--grey5);
|
|
border-radius: var(--action_row_collapse_radius);
|
|
padding: var(--padding_large);
|
|
image: url(theme:Dark/down.svg);
|
|
border: var(--highlight_width) solid var(--grey5);
|
|
}
|
|
|
|
idian--ExpandButton::indicator:checked {
|
|
image: url(theme:Dark/up.svg);
|
|
}
|
|
|
|
idian--ExpandButton.keyFocus,
|
|
idian--ExpandButton.keyFocus::indicator {
|
|
border-color: var(--highlight_color);
|
|
}
|
|
|
|
idian--RowFrame .btn-frame {
|
|
background: var(--grey5);
|
|
padding: var(--action_row_padding) var(--action_row_padding_x);
|
|
}
|
|
|
|
idian--RowFrame.hover .btn-frame {
|
|
background: var(--grey4);
|
|
}
|
|
|
|
idian--RowFrame.hover idian--Row {
|
|
background: var(--grey4);
|
|
border: var(--highlight_width) solid var(--grey1);
|
|
border-right: none;
|
|
}
|
|
|
|
idian--RowFrame.hover .row-buddy {
|
|
background: var(--grey4);
|
|
border: var(--highlight_width) solid var(--grey1);
|
|
border-left: none;
|
|
}
|
|
|
|
idian--RowFrame.hover idian--ExpandButton::indicator {
|
|
border-color: var(--grey1);
|
|
}
|
|
|
|
AlignmentSelector {
|
|
border: 1px solid var(--input_border);
|
|
margin: 0px;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
AlignmentSelector:focus,
|
|
AlignmentSelector:hover {
|
|
border: 1px solid var(--white3);
|
|
}
|
|
|
|
AlignmentSelector:checked:hover {
|
|
border: 1px solid var(--primary_lighter);
|
|
}
|
|
|
|
AlignmentSelector::indicator {
|
|
margin: 0px;
|
|
background: transparent;
|
|
}
|
|
|
|
AlignmentSelector::indicator:checked {
|
|
background: var(--primary);
|
|
}
|
|
|
|
AlignmentSelector::indicator:checked:focus {
|
|
background: var(--primary_light);
|
|
}
|
|
|
|
AlignmentSelector:disabled {
|
|
border: 1px solid var(--grey3);
|
|
}
|
|
|
|
AlignmentSelector::indicator:disabled {
|
|
background: var(--grey5);
|
|
}
|
|
|
|
AlignmentSelector::indicator:checked:disabled {
|
|
background: var(--grey3);
|
|
}
|