/* -----------------------------------------------------------------------------
Main
----------------------------------------------------------------------------- */
QWidget {
background-color: @bg;
color: @text-color;
&:disabled {
color: @text-color-disabled;
}
}
QFrame {
border: 0;
margin: 0;
padding: 0;
}
QToolTip,
#helpToolTip {
background-color: @tooltip-bg-color;
border: 1 solid @tooltip-border-color;
color: @tooltip-text-color;
padding: 1 1;
}
#DockSeparator,
QMainWindow::separator,
QSplitter::handle {
background-color: @dock-bg-color;
height: 4;
width: 4;
}
#TDockPlaceholder {
background-color: @dock-placeholder-color;
}
TPanel {
background-color: @dock-bg-color;
}
/* -----------------------------------------------------------------------------
Topbar
----------------------------------------------------------------------------- */
#TopBar {
background: @topbar-bg-color;
border: 0;
border-bottom: 1 solid @topbar-border-color;
& #EditToolLockButton {
background: @topbar-bg-color;
spacing: 0;
&::indicator {
// inherits from #ToolOptions window
background: none;
border: none;
padding-left: 0;
padding-right: 0;
}
}
}
#TopBarTabContainer {
background-color: @topbar-bg-color;
margin-bottom: 1; // Required for #TopBar border-bottom to show
}
#StackedMenuBar {
border: 0;
margin: 0;
padding: 0;
}
QMenuBar {
background-color: @topbar-bg-color;
border: 0;
&::item {
background-color: @topbar-bg-color;
border-left: 1 solid @topbar-bg-color; // Helps to align with QMenu
margin: 0;
padding: 3 5 3 5;
&:selected {
.hl-color-secondary;
}
&:pressed {
.hl-color;
}
}
}
/* -----------------------------------------------------------------------------
Workspaces
----------------------------------------------------------------------------- */
#TopBarTab {
margin: 0;
padding: 0;
&::tab {
background-color: @rooms-tab-bg-color;
border-top: 1 solid @tab-border-color;
border-right: 1 solid @tab-border-color;
color: @rooms-tab-text-color;
margin: 0 0 -1 0;
padding: 2 8 3 8;
&:hover {
background-color: @rooms-tab-bg-color-hover;
color: @tab-text-color-hover;
}
&:selected {
background-color: @rooms-tab-bg-color-selected;
color: @rooms-tab-text-color-selected;
}
&:first {
border-left: 1 solid @accent;
}
&:last {
border-right: 1 solid @accent;
}
}
& QToolButton {
border-left: 2 solid @accent;
border-top: 1 solid @accent;
border-right: 1 solid @accent;
border-bottom: 0;
margin-left: -1;
margin-top: 0;
}
}
/* -----------------------------------------------------------------------------
Menu
----------------------------------------------------------------------------- */
QMenu {
background-color: @menu-bg-color;
border: 1 solid @menu-border-color;
color: @menu-text-color;
padding: 2 0;
&::item {
border: 0;
padding: 3 28 3 14;
&:selected {
background-color: @menu-item-bg-color-selected;
color: @menu-item-text-color-selected;
}
&:checked {
color: @menu-checkbox-text-color-selected;
&:selected {
background-color: @menu-item-bg-color-selected;
color: @menu-item-text-color-selected;
}
}
&:disabled {
background: none;
color: @text-color-disabled;
&:selected {
color: @text-color-disabled; /* fix for disabled indicator */
}
}
}
&::separator {
border-top: 1 solid @menu-separator-color;
height: 0;
margin: 2 0;
}
&::icon {
border-radius: 2;
position: absolute;
left: 7;
padding: 0;
margin: 0;
qproperty-icon: url('@{img-url}/none');
&:checked {
background-color: @menu-icon-checked-bg-color;
border: 1 solid @menu-icon-checked-border-color;
}
}
&::indicator {
&:non-exclusive {
&:extend(.CheckBox::indicator all);
}
&:exclusive {
&:extend(.RadioButton::indicator all);
}
margin-left: 8;
}
}
/* -----------------------------------------------------------------------------
Titlebars
----------------------------------------------------------------------------- */
TPanelTitleBar {
background-color: @title-bg-color;
border-bottom: @title-border-width solid @title-border-color;
height: 18;
min-height: 18;
qproperty-TitleColor: @title-text-color;
qproperty-ActiveTitleColor: @title-text-color-active;
// QSS only works when pixmaps are set to 'none'
qproperty-BorderPixmap: url('none');
qproperty-ActiveBorderPixmap: url('@{img-url}/@{title-active-border-pixmap}');
qproperty-FloatBorderPixmap: url('none');
qproperty-FloatActiveBorderPixmap: url('@{img-url}/@{title-active-border-pixmap}');
}
TPanelTitleBarButton {
qproperty-PressedColor: @title-button-pressed-color;
qproperty-FreezeColor: @title-button-freeze-color;
qproperty-PreviewColor: @title-button-preview-color;
qproperty-OverColor: @title-button-rollover-color;
}
/* -----------------------------------------------------------------------------
Scrollbars
----------------------------------------------------------------------------- */
QAbstractScrollArea::corner {
background-color: @scrollbar-bg-color;
}
QScrollBar {
background-color: @scrollbar-bg-color;
border: 0;
&:horizontal {
height: 15;
margin: 0;
}
&:vertical {
margin: 0;
width: 15;
}
&::handle {
border: @scrollbar-handle-border-size solid @scrollbar-handle-border-color;
border-radius: @scrollbar-handle-radius;
&:horizontal,
&:vertical {
&:hover {
background-color: @scrollbar-handle-bg-color-hover;
border-color: @scrollbar-handle-border-color-hover;
}
&:pressed {
background-color: @scrollbar-handle-bg-color-pressed;
border-color: @scrollbar-handle-border-color-pressed;
}
}
&:horizontal {
background-color: @scrollbar-handle-bg-color;
margin: @scrollbar-handle-margin 16;
min-width: 20;
}
&:vertical {
background-color: @scrollbar-handle-bg-color;
margin: 16 @scrollbar-handle-margin 16 @scrollbar-handle-margin;
min-height: 20;
}
}
&::add-line {
subcontrol-origin: margin;
border: 0;
&:horizontal { // right
subcontrol-position: right;
background-color: @scrollbar-bg-color;
margin: 0;
width: 16;
}
&:vertical { // down
subcontrol-position: bottom;
background-color: @scrollbar-bg-color;
margin: 0;
height: 16;
}
}
&::sub-line {
border: 0;
subcontrol-origin: margin;
&:horizontal { // left
subcontrol-position: left;
background-color: @scrollbar-bg-color;
margin: 0;
width: 16;
}
&:vertical { // up
subcontrol-position: top;
background-color: @scrollbar-bg-color;
margin: 0;
height: 16;
}
}
@arrow-pressed: 1 0 0 0; // press effect shortcut, nudge arrow down 1
&::up-arrow:vertical {
image: url('@{img-url}/scroll-up.svg');
image-position: center center;
&:pressed {
margin: @arrow-pressed;
}
}
&::down-arrow:vertical {
image: url('@{img-url}/scroll-down.svg');
image-position: center center;
&:pressed {
margin: @arrow-pressed;
}
}
&::left-arrow:horizontal {
image: url('@{img-url}/scroll-left.svg');
image-position: center center;
&:pressed {
margin: @arrow-pressed;
}
}
&::right-arrow:horizontal {
image: url('@{img-url}/scroll-right.svg');
image-position: center center;
&:pressed {
margin: @arrow-pressed;
}
}
&::sub-page,
&::add-page {
&:horizontal,
&:vertical {
background: none;
}
}
}
/* -----------------------------------------------------------------------------
QToolBar
----------------------------------------------------------------------------- */
/* This applies to QToolBar, this is not the #ToolBar window, although the
properties here also apply in the window, you should look in
[layouts/toolbar] if you want window control. */
QToolBar {
padding: 0;
&::separator {
&:horizontal {
border-left: 1 solid @accent;
margin: 0 1;
width: 0;
}
&:vertical {
border-top: 1 solid @accent;
height: 0;
margin: 1 0;
}
}
& QLabel {
margin-top: 1;
}
& QToolBar {
border: 0;
}
}
QToolButton {
&:extend(.button-tool all);
margin-left: 1;
margin-right: 1;
padding: 0;
&::menu-indicator {
image: none;
}
&::menu-button {
border-image: none;
}
&#qt_toolbar_ext_button {
padding: 0;
border: 0;
margin: 0;
qproperty-icon: url('@{img-url}/toolbar_extension_horizontal.png');
&:hover {
background-color: @button-bg-color-hover;
}
&:pressed {
background-color: @button-bg-color-checked;
}
}
}
.DvScrollWidget {
& QPushButton {
background-color: @button-bg-color;
border: 0 solid @accent;
border-radius: 0;
padding: 0;
max-width: 16;
&:hover {
background-color: @button-bg-color-hover;
}
&:pressed {
background-color: @button-bg-color-pressed;
}
}
}
DvScrollWidget {
/* Multiple classes can use the same style as DvScrollWidget, and
since the compiler can't handle extending to Qt names we place the
style in a mixin and extend the name to it instead. */
&:extend(.DvScrollWidget all);
}
#ScrollLeftButton,
#ScrollRightButton,
#ScrollUpButton,
#ScrollDownButton {
&:extend(.DvScrollWidget all);
margin: 0;
min-width: 16;
}
#ScrollLeftButton {
border-right: 1 solid @accent;
image: url('@{img-url}/scroll-left.svg');
}
#ScrollRightButton {
border-left: 1 solid @accent;
margin-left: 3;
image: url('@{img-url}/scroll-right.svg');
}
#ScrollUpButton {
image: url('@{img-url}/scroll-up.svg');
}
#ScrollDownButton {
image: url('@{img-url}/scroll-down.svg');
}
/* -------------------------------------------------------------------------- */
/* For the buttons to display a BG color we need to set a blank image, setting
an empty URL solves this. */
#keyFrameNavigator {
background: transparent;
margin: 0;
padding: 0;
#PreviousKey {
margin: 0 2;
padding-right: -1;
width: 20px;
height: 20px;
image: url('');
&:disabled {
image: url('');
}
}
#NextKey {
margin: 0 2;
padding-right: -1;
width: 20px;
height: 20px;
image: url('');
&:disabled {
image: url('');
}
}
#KeyNo,
#KeyPartial,
#KeyTotal {
margin: 0;
padding-right: -1;
width: 20px;
height: 20px;
image: url('');
&:disabled {
image: url('');
}
}
#KeyNo {
background-color: @keyframe-off-color;
border: 1 solid @keyframe-off-border-color;
image: url('');
&:disabled {
image: url('');
}
&:hover {
background-color: @keyframe-off-color-hover;
border-color: @keyframe-off-border-color-hover;
}
}
#KeyPartial {
background-color: @keyframe-partial-color;
border: 1 solid @keyframe-partial-border-color;
image: url('');
&:hover {
background-color: @keyframe-partial-color-hover;
border-color: @keyframe-partial-border-color-hover;
}
}
#KeyTotal {
background-color: @keyframe-total-color;
border: 1 solid @keyframe-total-border-color;
&:hover {
background-color: @keyframe-total-color-hover;
border-color: @keyframe-total-border-color-hover;
}
}
& QToolButton#qt_toolbar_ext_button {
// adjust for style
padding-bottom: 3;
border-radius: 2;
}
}
/* -----------------------------------------------------------------------------
Tab Containers
----------------------------------------------------------------------------- */
#TabBarContainer {
.tab-container;
}
QTabBar {
background-color: @tabbar-bg-color;
}
/* -----------------------------------------------------------------------------
Tabs
----------------------------------------------------------------------------- */
QTabBar {
&::tab {
&:extend(.tab-flat all);
}
& QToolButton {
/* Scroll buttons */
margin: 0;
background-color: @bg;
border-radius: 0;
border: 1 solid @accent;
border-top: 0;
padding: 3 2 2 2;
&:hover, &:pressed {
border-color: @accent;
}
&:disabled {
color: @text-color-disabled;
}
}
}
/* -----------------------------------------------------------------------------
Item Tree
----------------------------------------------------------------------------- */
.treeview {
background-color: @tree-bg-color;
alternate-background-color: @tree-bg-color-alt;
border: 0;
margin: 0;
outline: 0;
&::item {
&:selected {
.hl-color;
}
}
&::branch {
/* A blank URL may not hide the Qt branch style in Linux, so we add
a transparent PNG which does. */
@blank_img: '@{img-url}/transparent_16x16.png';
&:adjoins-item {
border-image: url('@{blank_img}');
}
&:has-siblings {
border-image: url('@{blank_img}');
&:adjoins-item {
border-image: url('@{blank_img}');
}
}
&:has-children {
&:closed {
background: url('@{img-url}/treebranch-closed.svg') no-repeat;
background-position: center center;
border-image: none;
image: none;
}
&:open {
background: url('@{img-url}/treebranch-open.svg') no-repeat;
background-position: center center;
image: none;
}
&:has-siblings {
&:closed {
background: url('@{img-url}/treebranch-closed.svg') no-repeat;
background-position: center center;
border-image: none;
image: none;
}
&:open {
background: url('@{img-url}/treebranch-open.svg') no-repeat;
background-position: center center;
border-image: none;
image: none;
}
}
}
}
}
QTreeWidget,
QTreeView {
&:extend(.treeview all);
}
QListView {
outline: 0; // hide focus border
background: @tree-bg-color;
alternate-background-color: @tree-bg-color-alt;
}
/* -----------------------------------------------------------------------------
Tool Options - Override DvScroll Widget
----------------------------------------------------------------------------- */
#toolOptionsPanel {
QPushButton {
background-color: @button-bg-color;
border: 1 solid @button-border-color;
border-radius: 2;
color: @button-text-color;
margin: 0;
padding: 0;
&:hover {
background-color: @button-bg-color-hover;
border-color: @button-border-color-hover;
color: @button-text-color-hover;
}
&:pressed {
background-color: @button-bg-color-pressed;
border-color: @button-border-color-pressed;
color: @button-text-color-pressed;
}
&:checked {
background-color: @button-bg-color-checked;
border-color: @button-border-color-checked;
color: @button-text-color-checked;
&:hover {
background-color: @button-bg-color-checked-hover;
&:pressed {
background: @button-bg-color-checked-hover-pressed;
}
}
}
&:disabled {
background-color: @button-bg-color-disabled;
border-color: @button-border-color-disabled;
color: @button-text-color-disabled;
}
}
}