webots_dusk.qss

/* theme-name: Webots Dusk */

/*
-------palette colors------
Highlights: #61e2a8;
Background: #40404a;
Inset Widgets: #22222a;
Scene Tree Text: #41f4c1;
Menu Bar Highlight: #c8c4ff;
Generic Text: #fff;
*/

/* main window */

WbSplashScreen {
  qproperty-backgroundGradientStartColor: #22222a;
  qproperty-backgroundGradientEndColor: #33333f;

  qproperty-companyColor: #fff;
  qproperty-taglineColor: #c8c8c8;
  qproperty-versionColor: #dcdcdc;
  qproperty-loadingColor: #b4b4b4;
}

WbMainWindow {
  qproperty-enabledIconPath: "icons/light";
  qproperty-disabledIconPath: "icons/dark";
  qproperty-coreIconPath: "icons/core";
  qproperty-toolBarAlign: "center";
  background: #40404a;
}

QMainWindow::separator {
  background: transparent;
  width: 2px;
  height: 2px;
}

WbSimulationView {
  qproperty-handleWidth: 2;
}

WbSceneTree {
  qproperty-handleWidth: 2;
}

QWidget {
  color: #fff;
  background: #40404a;
  border: none;
}

QWidget#DocumentationWebView {
  background-color: auto;
  color: auto;
  border: auto;
}

QWidget#HtmlRobotWindow * {
  background-color: auto;
  color: auto;
  border: auto;
}

QFrame#consoleTitleBar {
  background: #2a2a33;
}

QFrame#floatableDockTitleFrame:hover, QFrame#consoleTitleBar:hover {
  background: #5a5a5a;
}

QDockWidget {
  background: #40404a;
  color: #fff;
}

QSplitter::handle {
  image: url(blank);
}

/* menus */

QMenuBar {
  background: white;
}

QMenuBar::item {
  background: transparent;
  color: black;
}

QMenuBar::item:disabled {
  background: transparent;
  color: #888;
}

QMenuBar::item:selected {
  background: #afffdb;
  color: black;
}

QMenu::item {
  padding: 4px 20px 4px 20px;
  border: 1px solid transparent;
}

QMenu::item:selected {
  background: #61e2a8;
  color: black;
}

QMenu::item:disabled {
  background: transparent;
  color: #888;
}

QMenu::separator {
  background: #555;
  height: 1px;
}

/* 3D view tools */

QFrame#simulationIndicatorFrame {
  background: qlineargradient(
    x1:0, y1:0, x2:0, y2:1,
    stop:0 #d0e0db, stop:1 #afd8cb
  );
  border-radius: 2%;
  max-height: 13px;
  padding: 6px 6px 7px 6px;
  min-width: 140px;
  margin-left: 5px;
}

QScrollArea#timeLabelContainer {
  background-color: transparent;
}

QLabel#timeLabel {
  font-size: 13px;
  min-width: 78px;
  background: transparent;
  color: black;
  qproperty-alignment: 'AlignLeft | AlignVCenter';
}

QLabel#separator {
  margin-left: 2px;
  font-size: 13px;
  background: transparent;
  color: black;
  qproperty-alignment: 'AlignHCenter | AlignVCenter';
}

QScrollArea#speedLabelContainer {
  background-color: transparent;
}

QLabel#speedLabel {
  min-width: 36px;
  font-size: 13px;
  background: transparent;
  color: black;
  qproperty-alignment: 'AlignRight | AlignVCenter';
}

QLabel#dockWidgetTitleText {
  color: #e0feff;
  background: transparent;
}

QProgressBar {
  qproperty-alignment: 'AlignHCenter | AlignVCenter';
}

/* menu buttons */

QToolBar {
  background-color: transparent;
  border-style: solid; /* required to set the background */
  padding: 4px;
  spacing: 4px;
}

QToolBar::separator {
  background: #666;
  width: 1px;
}

QToolButton#editorButton {
  width: 15px;
  height: 15px;
  padding: 3px;
  border: 1px solid transparent;
}

QToolButton#menuButton {
  width: 15px;
  height: 15px;
  padding: 3px 9px;
  border: 1px solid transparent;
}

QToolButton#menuButton::menu-indicator {
  image: none;
  subcontrol-position: right center;
  subcontrol-origin: padding;
  left: -2px;
}

QToolButton#playButton {
  width: 25px;
  height: 25px;
  padding: 3px;
  border: 1px solid transparent;
}

QToolButton#invisibleButton {
  width: 0px;
  height: 0px;
  padding: 0px;
  margin: 0px;
}

QToolButton#editorButton:hover {
  background-color: #3aba98;
}

QToolButton#menuButton:hover {
  background-color: #3aba98;
}

QToolButton#playButton:hover {
  background-color: #3aba98;
}

QToolButton#editorButton:pressed {
  background-color: #22222a;
}

QToolButton#menuButton:pressed {
  background-color: #22222a;
}

QToolButton#playButton:pressed {
  background-color: #22222a;
}

QPushButton {
  padding: 4px 15px;
  background: #22222a;
  border: none;
}

QPushButton:hover {
  background-color: #555;
}

QPushButton:focus {
  border: 1px solid #61e2a8;
  outline: 1px solid transparent;
}

QPushButton:pressed  {
  border: none;
}

QPushButton:disabled {
  color: #40404a;
  border: none;
}

QPushButton:pressed {
  background-color: rgba(0, 0, 0, 25%);
}

QPushButton#dockButton, QPushButton#dockCloseButton {
  background: transparent;
  border: 1px solid transparent;
  width: 15px;
  height: 15px;
  margin: 0px 3px 0px 3px;
  padding: 1px;
}

QPushButton#dockButton:hover {
  background-color: #3aba98;
}

QPushButton#dockCloseButton:hover {
  background-color: #c94848;
}

QPushButton#dockButton:pressed, QPushButton#dockCloseButton:pressed {
  background-color: rgba(0, 0, 0, 25%);
}

/* add node dialog and add inertia matrix dialog */

QGroupBox#dialogInfoGroupBox {
  border: 1px solid gray;
  border-radius: 1px;
  margin-top: 1ex;
}

QGroupBox#dialogInfoGroupBox::title {
  subcontrol-origin: margin;
  padding: 0 3px;
  subcontrol-position: top left;
}

QLabel#nodePixmapLabel {
  width: 128px;
  height: 128px;
  border: 0px;
  padding: 0px;
}

/* field editor */

QGroupBox#fieldEditorGroupBox {
  margin-top: 2.5ex;
  margin-left: 0;
}

QGroupBox#fieldEditorGroupBox::title {
  subcontrol-origin: margin;
  padding: 0 3px;
  subcontrol-position: top left;
}

QScrollArea#editorPane {
  min-height: 250px;
}

#NodePane,
#LoginTabs {
  background: #33333f;
}

#NodePane QWidget,
#LoginTabs QWidget {
  background: #33333f;
}

#NodePane QPushButton,
#LoginTabs QPushButton {
  background: #22222a;
  border: 1px solid #22222a;
}

#NodePane QPushButton:hover,
#LoginTabs QPushButton:hover {
  background-color: #555;
}

#NodePane QPushButton:focus,
#LoginTabs QPushButton:focus {
  border: 1px solid #61e2a8;
  outline: none;
}

#NodePane QPushButton:pressed,
#LoginTabs QPushButton:pressed {
  background-color: rgba(0, 0, 0, 25%);
}

#NodePane QLineEdit,
#LoginTabs QLineEdit {
  background-color: #22222a;
  color: #fff;
  border: 1px solid #555;
  border-radius: 3px;
  padding: 2px;
}

#NodePane QLineEdit:focus,
#LoginTabs QLineEdit:focus {
  border-color: #61e2a8;
  background-color: #33333f;
}

#NodePane QAbstractSpinBox,
#LoginTabs QAbstractSpinBox {
  background-color: #22222a;
  color: #fff;
  border: 1px solid #555;
  border-radius: 3px;
  padding: 2px;
}

#NodePane QAbstractSpinBox:focus,
#LoginTabs QAbstractSpinBox:focus {
  border-color: #61e2a8;
  background-color: #33333f;
}

#NodePane QComboBox,
#LoginTabs QComboBox {
  background-color: #22222a;
  border-style: solid;
  border: 1px solid #76797C;
  border-radius: 2px;
  padding: 2px;
  min-width: 75px;
}

#NodePane QComboBox:on,
#LoginTabs QComboBox:on {
  border-color: #61e2a8;
  background-color: #33333f;
}

#NodePane QComboBox:focus,
#LoginTabs QComboBox:focus {
  border-color: #61e2a8;
  background-color: #33333f;
}

#NodePane QStackedWidget QComboBox::disabled,
#LoginTabs QStackedWidget QComboBox::disabled {
  color: #555;
}

#NodePane QStackedWidget QComboBox::drop-down,
#LoginTabs QStackedWidget QComboBox::drop-down {
  border-style: solid;
}

#NodePane QStackedWidget QComboBox QAbstractItemView,
#LoginTabs QStackedWidget QComboBox QAbstractItemView {
  selection-background-color: #61e2a8;
  selection-color: black;
  outline: none;
}

QInputDialog QAbstractItemView {
  background: #22222a;
  outline: none;
}

QInputDialog QAbstractItemView::item {
  padding: 5px 0px;
}

QInputDialog QAbstractItemView::item:hover {
  background: rgba(172, 249, 228, 20%);
}

QInputDialog QAbstractItemView::item:selected {
  background-color: #61e2a8;
  color: black;
}

/* solid editor */

QLabel#inertiaMatrixDiagonalCoefficientLabel {
  color: rgb(40,40,220);
}

QLabel#inertiaMatrixPrimaryCoefficientLabel {
  color: rgb(40,160,160);
}

QLabel#inertiaMatrixSecondaryCoefficientLabel {
  color: darkgray;
}

/* text editor */

WbTextBuffer {
  qproperty-apiColor: rgb(166, 226, 46);
  qproperty-commentColor: rgb(117, 113, 94);
  qproperty-keywordColor: rgb(249, 38, 114);
  qproperty-numberColor: rgb(102, 217, 239);
  qproperty-preprocessorColor: rgb(249, 38, 114);
  qproperty-quotationColor: rgb(230, 219, 116);

  qproperty-gutterBackgroundColor: #27272f;
  qproperty-gutterForegroundColor: #a0a0a0;

  background: #27272f;
  color: #F8F8F2;
  border: none;
  padding-left: 4px;
}

QTabWidget {
  background: #33333f;
}

QTabWidget::pane {
  border: 0;
  background: #22222a;
}

/* console */

WbConsole {
  qproperty-errorColor: #ff614f;
  qproperty-infoColor: #66d9ef;

  qproperty-ansiBlack: white;
  qproperty-ansiRed: #ff614f;
  qproperty-ansiGreen: #66bb6a;
  qproperty-ansiYellow: #d4e157;
  qproperty-ansiBlue: #66d9ef;
  qproperty-ansiMagenta: #9b93ff;
  qproperty-ansiCyan: #4dd0e1;
  qproperty-ansiWhite: gray;
}

QPlainTextEdit#ConsoleEdit {
  background: #22222a;
  color: #fff;
}

/* color editor */

QToolButton#colorToolButton {
  border-style: outset;
  border-color: #22222a;
  border-width: 4px;
  border-radius: 5px;
  padding: 6px;
}

QToolButton#colorToolButton:pressed {
  border-style: inset;
}

/* scene tree & tree views */

WbTreeView {
  qproperty-defaultColor: #fff;
  qproperty-modifiedColor: #41f4c1;
}

QTreeView {
  background: #22222a;
  color: #fff;
  min-width: 250px;
  outline: none;
}

QTreeView::item {
  border-radius: 3px;
  padding-top: 1px;
  padding-bottom: 1px;
}

QTreeView::item:hover {
  background: rgba(172, 249, 228, 20%);
}

QTreeView::item:selected {
  background: #61e2a8;
  color: black;
}

QTreeView::item:selected:!focus {
  background: #688e86;
  color: auto;
}

QTreeView::branch {
  background: #22222a;
}

QTreeView::branch:open {
  image: url(enabledIcons:tree_branch_open.png);
}

QTreeView::branch:open:hover {
  image: url(enabledIcons:tree_branch_open_hover.png);
}

QTreeView::branch:closed:has-children {
  image: url(enabledIcons:tree_branch_closed.png);
}

QTreeView::branch:closed:has-children:hover {
  image: url(enabledIcons:tree_branch_closed_hover.png);
}

QTreeView::branch:closed:!has-children {
  image: url(blank);
}

QTreeView::branch:open:!has-children {
  image: url(blank);
}

QTreeWidget QHeaderView::section {
  color: black;
  background-color: #ddd;
}

QTreeWidget::item {
  color: #fff;
}

QComboBoxListView {
  padding: 2px;
  background: #33333f;
}

/* scrollbar customization */

QScrollBar:horizontal {
  height: 9px;
  background-color: #33333f;
}

QScrollBar::handle:horizontal {
  background-color: #666;
  min-width: 5px;
}

QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal,
QScrollBar::add-line:horizontal:hover,QScrollBar::add-line:horizontal:on,
QScrollBar::sub-line:horizontal:hover, QScrollBar::sub-line:horizontal:on {
  border-image: url(:/qss_icons/rc/right_arrow_disabled.png);
  width: 10px;
  height: 10px;
  subcontrol-position: right;
  subcontrol-origin: margin;
}

QScrollBar::up-arrow:horizontal, QScrollBar::down-arrow:horizontal,
QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
  background: none;
}

QScrollBar:vertical {
  width: 9px;
  background-color: #33333f;
}

QScrollBar::handle:vertical {
  background-color: #666;
  min-height: 5px;
}

QScrollBar::sub-line:vertical, QScrollBar::add-line:vertical,
QScrollBar::sub-line:vertical:hover, QScrollBar::sub-line:vertical:on,
QScrollBar::add-line:vertical:hover, QScrollBar::add-line:vertical:on  {
  border-image: url(blank);
  height: 10px;
  width: 10px;
  subcontrol-position: top;
  subcontrol-origin: margin;
}

QScrollBar::up-arrow:vertical, QScrollBar::down-arrow:vertical,
QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
  background: none;
}

/* tab bars */

QTabBar::tab {
  color: #fff;
  background-color: #31363b;
  padding: 6px 11px 6px 11px;
  min-width: 50px;
  margin: 0;
  border:1px solid transparent;
  outline: 0px;
}

QTabBar::tab:!selected {
  color: #eff0f1;
  background-color: #54575B;
}

QTabBar::tab:!selected:hover {
  background-color: #61e2a8;
}

QTabBar::tab:focus {
  border-color: #61e2a8;
}

QTabBar::close-button {
  image: url(enabledIcons:dock_close_button.png);
  background: transparent;
}

QTabBar::close-button:hover {
  background: #c94848;
}

/* dialog-level widgets */

QLabel {
}

QLineEdit {
  background-color: #22222a;
  color: #fff;
  border: 1px solid #555;
  border-radius: 3px;
  padding: 2px;
}

QAbstractSpinBox {
  background-color: #22222a;
  color: #fff;
  border: 1px solid #555;
  border-radius: 3px;
  padding: 2px;
}

QLineEdit:focus {
  border-color: #61e2a8;
  background-color: #33333f;
}

QAbstractSpinBox:focus {
  border-color: #61e2a8;
  background-color: #33333f;
}

QComboBox {
  background-color: #22222a;
  border-style: solid;
  border: 1px solid #76797C;
  border-radius: 2px;
  padding: 2px;
  min-width: 75px;
}

QComboBox:on, QComboBox:focus {
  border-color: #61e2a8;
  background-color: #33333f;
}

QComboBox::disabled {
  color: #555;
}

QComboBox::drop-down {
  border-style: solid;
}

QComboBox QAbstractItemView {
  selection-background-color: #61e2a8;
  selection-color: black;
  outline: none;
}

QComboBox::down-arrow {
  background-image: url(enabledIcons:menu-drop-down.png);
}

QComboBox::down-arrow:disabled {
  background-image: url(disabledIcons:menu-drop-down.png);
}

QAbstractSpinBox:up-button, QAbstractSpinBox::down-button {
  background: transparent;
}

QAbstractSpinBox:up-button:hover, QAbstractSpinBox::down-button:hover {
  background: #40404a;
}

QAbstractSpinBox:up-button:pressed, QAbstractSpinBox::down-button:pressed {
  background: #888;
}

QAbstractSpinBox::up-arrow {
  image: url(enabledIcons:spinbox_up_arrow.png);
}

QAbstractSpinBox::down-arrow {
  image: url(enabledIcons:spinbox_down_arrow.png);
}

QGroupBox {
  padding: 10px;
}

QFontDialog QListView, QListWidget {
  background: #222;
  outline: 0;
}

QFontDialog QListView::item:hover {
  background-color: rgba(172, 249, 228, 20%);
}

QFontDialog QListView::item:selected {
  background-color: #61e2a8;
  color: black;
}

QListWidget::item:hover {
  background: rgba(172, 249, 228, 20%);
}

QListWidget::item:selected {
  background-color: #61e2a8;
  color: black;
}

QProgressBar {
  border-radius: 3px;
  height: 6px;
  margin: 10px;
  color: transparent;
  background: #222;
}

QProgressBar::chunk {
  background: #61e2a8;
  border-radius: 3px;
}