4566353fe5
* Fix build with Clang 10 * System depend code deduplication * Improve multi-layer style picker. Allows clicking anywhere on a stroke in another layer to pick it - not just the center. Fixes #2843. * Get actual pixel size instead of hard-coding to 1.0. * Rehide features * fix pegbar restoring * gui tweaks tweaks the gui, makes tpaneltitlebarbutton color states changable in stylesheets * fix styleeditor chandle mouse event allow handle to be grabbed properly without slipping Co-authored-by: Rodney <rodney.baker@gmail.com> Co-authored-by: Rozhuk Ivan <rozhuk.im@gmail.com> Co-authored-by: Martin van Zijl <martin.vanzijl@gmail.com> Co-authored-by: shun-iwasawa <shun.iwasawa@ghibli.jp> Co-authored-by: Kite <konero@users.noreply.github.com>
611 lines
14 KiB
Plaintext
611 lines
14 KiB
Plaintext
/* -----------------------------------------------------------------------------
|
|
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 @accent;
|
|
height: 21;
|
|
& #EditToolLockButton {
|
|
background: @topbar-bg-color;
|
|
spacing: 0;
|
|
&::indicator {
|
|
// inherits from #ToolOptions
|
|
background: none;
|
|
border: none;
|
|
height: 18;
|
|
margin: 1 2 0 0;
|
|
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 {
|
|
&::tab {
|
|
margin: 0;
|
|
padding: 2 7 3 8;
|
|
border-bottom: 0;
|
|
&:hover, &:selected {
|
|
border-bottom: 0;
|
|
}
|
|
&:selected {
|
|
color: @rooms-tab-text-color-selected;
|
|
background-color: @rooms-tab-bg-color-selected;
|
|
}
|
|
}
|
|
& 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 {
|
|
padding: 3 28;
|
|
&:selected {
|
|
.hl-color;
|
|
}
|
|
&:checked {
|
|
color: @menu-checkbox-text-color-selected;
|
|
&:selected {
|
|
.hl-color;
|
|
}
|
|
}
|
|
&:disabled {
|
|
background: none;
|
|
color: @text-color-disabled;
|
|
&:selected {
|
|
background-color: @menu-item-bg-color-disabled-hover;
|
|
border-color: transparent;
|
|
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;
|
|
margin: 0 0 0 3;
|
|
padding: 0;
|
|
&:checked {
|
|
background-color: @hl-bg-color;
|
|
}
|
|
}
|
|
&::indicator {
|
|
&:non-exclusive {
|
|
&:extend(.CheckBox::indicator all);
|
|
}
|
|
&:exclusive {
|
|
&:extend(.RadioButton::indicator all);
|
|
}
|
|
margin-left: 7;
|
|
&:non-exclusive {
|
|
&:extend(.CheckBox::indicator all);
|
|
}
|
|
&:exclusive {
|
|
&:extend(.RadioButton::indicator all);
|
|
}
|
|
}
|
|
}
|
|
|
|
/* -----------------------------------------------------------------------------
|
|
Titlebars
|
|
----------------------------------------------------------------------------- */
|
|
|
|
TPanelTitleBar {
|
|
background-color: @title-bg-color;
|
|
border-color: @accent;
|
|
border-style: solid;
|
|
border-width: 0 0 1 0;
|
|
height: 20;
|
|
min-height: 20;
|
|
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-RolloverColor: @title-button-rollover-color;
|
|
qproperty-PressedColor: @title-button-pressed-color;
|
|
qproperty-FreezeColor: @title-button-freeze-color;
|
|
qproperty-PreviewColor: @title-button-preview-color;
|
|
}
|
|
|
|
/* -----------------------------------------------------------------------------
|
|
Scrollbars
|
|
----------------------------------------------------------------------------- */
|
|
|
|
QAbstractScrollArea::corner {
|
|
background-color: @scrollbar-bg-color;
|
|
}
|
|
|
|
QScrollBar {
|
|
background-color: @scrollbar-bg-color;
|
|
border: 0;
|
|
&:horizontal {
|
|
height: 16;
|
|
margin: 0;
|
|
}
|
|
&:vertical {
|
|
margin: 0;
|
|
width: 16;
|
|
}
|
|
|
|
&::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;
|
|
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 on pressed event
|
|
|
|
&::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;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* -----------------------------------------------------------------------------
|
|
Tool Bars
|
|
----------------------------------------------------------------------------- */
|
|
|
|
// this applies to QToolBar
|
|
// !!!! this is not the #ToolBar window !!!!
|
|
// look in [layouts/toolbar] for the window
|
|
|
|
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);
|
|
&::menu-indicator {
|
|
image: none;
|
|
}
|
|
&::menu-button {
|
|
border-image: none;
|
|
}
|
|
}
|
|
|
|
/* -------------------------------------------------------------------------- */
|
|
/* Scrollable QToolBar Buttons
|
|
/* -------------------------------------------------------------------------- */
|
|
|
|
.DvScrollWidget {
|
|
& QPushButton {
|
|
background-color: @bg;
|
|
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 {
|
|
// Can't extend to a Qt selector so we use
|
|
// a mixin 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');
|
|
}
|
|
|
|
/* -------------------------------------------------------------------------- */
|
|
|
|
#keyFrameNavigator {
|
|
background: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
& QToolButton {
|
|
min-width: 18;
|
|
}
|
|
#PreviousKey {
|
|
image: url('@{img-url}/prevkey.svg');
|
|
&:hover {
|
|
image: url('@{img-url}/prevkey_over.svg');
|
|
}
|
|
&:disabled {
|
|
image: url('@{img-url}/prevkey_disabled.svg');
|
|
}
|
|
}
|
|
#NextKey {
|
|
image: url('@{img-url}/nextkey.svg');
|
|
&:hover {
|
|
image: url('@{img-url}/nextkey_over.svg');
|
|
}
|
|
&:disabled {
|
|
image: url('@{img-url}/nextkey_disabled.svg');
|
|
}
|
|
}
|
|
}
|
|
|
|
/* -----------------------------------------------------------------------------
|
|
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 {
|
|
&:adjoins-item {
|
|
// Adding a blank URL hides in-built branch design
|
|
// where it is not wanted.
|
|
border-image: url('');
|
|
}
|
|
&:has-siblings {
|
|
border-image: url('');
|
|
&:adjoins-item {
|
|
border-image: url('');
|
|
}
|
|
}
|
|
&: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;
|
|
}
|
|
|
|
/* -----------------------------------------------------------------------------
|
|
Tabs
|
|
----------------------------------------------------------------------------- */
|
|
|
|
#TabBarContainer {
|
|
background-color: @tabbar-bg-color;
|
|
qproperty-BottomAboveLineColor: @tabbar-bg-color;
|
|
qproperty-BottomBelowLineColor: @accent;
|
|
}
|
|
QTabBar {
|
|
background-color: @tabbar-bg-color;
|
|
margin-bottom: 1;
|
|
&::tear {}
|
|
& QToolButton {
|
|
background-color: @bg;
|
|
border-radius: 0;
|
|
margin-right: 0;
|
|
margin-top: -1;
|
|
margin-bottom: 0;
|
|
border-bottom: 1 solid @accent;
|
|
border-left: 1 solid @accent;
|
|
padding: 3 2 2 2;
|
|
&:hover {
|
|
border-bottom: 1 solid @accent;
|
|
border-left: 1 solid @accent;
|
|
}
|
|
&:disabled {
|
|
color: @text-color-disabled;
|
|
}
|
|
}
|
|
&::tab {
|
|
margin-top: -1; // hide top border
|
|
background-color: @tabbar-bg-color;
|
|
border: 1 solid @tab-border-color;
|
|
border-right: 0;
|
|
color: @tab-text-color;
|
|
min-width: 8ex;
|
|
padding: 3 4 4 4; // y = helps borders to show for the TabBar
|
|
&:selected {
|
|
background-color: @tab-bg-color-selected;
|
|
border-bottom-color: @bg;
|
|
color: @tab-text-color-selected;
|
|
}
|
|
&:hover {
|
|
background-color: @tab-bg-color-hover;
|
|
}
|
|
&:last, &:only-one {
|
|
border-right: 1 solid @tab-border-color;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* -----------------------------------------------------------------------------
|
|
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;
|
|
}
|
|
}
|
|
}
|