23f1122c8a
menu Level: [Canvas Size] (Current Size, New Size and Anchor), [Export Level] (Vectors Export Box and Vectors Thicness) and Convert > [Convert to Vectors] (Full color non-AA images)
666 lines
15 KiB
Text
666 lines
15 KiB
Text
/* -----------------------------------------------------------------------------
|
|
Main
|
|
----------------------------------------------------------------------------- */
|
|
|
|
QWidget {
|
|
background-color: @bg;
|
|
color: @text-color;
|
|
&:disabled {
|
|
color: @text-color-disabled;
|
|
}
|
|
}
|
|
|
|
QFrame {
|
|
border: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
alternate-background-color: @text-color;
|
|
}
|
|
|
|
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;
|
|
&: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;
|
|
}
|
|
}
|
|
}
|