Skip to content

Commit

Permalink
Dark-Light stylesheets:
Browse files Browse the repository at this point in the history 
+ file encoding changed to UTF-8
+ fixed QRadioButtons, QCheckBoxes and QPushButtons inside dropdown menus
+ added checked/unchecked state for QToolButtons inside QTabBar
+ fixed QDockWidget background (when undocked)
  • Loading branch information
@pgilfernandez @yorikvanhavre
pgilfernandez authored and yorikvanhavre committed Apr 26, 2016
1 parent 1166d8d commit b43cc0e
Show file tree
Hide file tree
Showing 12 changed files with 336 additions and 90 deletions.
71 changes: 56 additions & 15 deletions src/Gui/Stylesheets/Dark-blue.qss
View file
@@ -1,14 +1,14 @@
/*
ABOUT
============================================================================================================
version 2.04
version 2.05
QT theme (stylesheet) specially developed for FreeCAD (http://www.freecadweb.org/).
It might work with other software that uses QT styling.


LICENSE
============================================================================================================
Copyright (c) 2016 Pablo Gil Fern�ndez
Copyright (c) 2016 Pablo Gil Fernández

This work is licensed under the Creative Commons Attribution-ShareAlike 4.0 International License.
To view a copy of this license, visit http://creativecommons.org/licenses/by-sa/4.0/.
Expand Down Expand Up @@ -93,6 +93,7 @@ Main window
==================================================================================================*/
QMainWindow,
QDialog,
QDockWidget,
QToolBar {
background-color: #6e6e6e; /* main background color */
}
Expand Down Expand Up @@ -158,6 +159,38 @@ QMenu::indicator:non-exclusive:checked {
color: white;
}

/* Fix for elements inside a drop-down menu */
QMenu QRadioButton,
QMenu QCheckBox,
QMenu QPushButton,
QMenu QToolButton {
color: white; /* same as regular QRadioButton and QCheckBox */
}

QMenu QRadioButton:hover,
QMenu QCheckBox:hover,
QMenu QPushButton:hover,
QMenu QToolButton:hover,
QMenu QPushButton:pressed,
QMenu QToolButton:pressed,
QMenu QPushButton:selected,
QMenu QToolButton:selected {
color: white;
background-color: #5e90fa; /* same as QMenu::item:selected and QMenu::item:pressed */
}

QMenu QRadioButton:disabled,
QMenu QCheckBox:disabled {
color: #f5f5f5;
}

QMenu QRadioButton::indicator:disabled,
QMenu QCheckBox::indicator:disabled {
color: #f5f5f5;
background-color: transparent;
border: 1px solid #f5f5f5;
}


/*==================================================================================================
Tool bar
Expand Down Expand Up @@ -937,14 +970,6 @@ QSplitter::handle {
padding: 0px;
}

QSplitter::handle:vertical {
background-image: url(qss:images/splitter_horizontal_dark.png);
background-position: center center;
background-repeat: none;
margin: 2px 4px 2px 4px;
height: 2px;
}

QSplitter::handle:horizontal {
background-image: url(qss:images/splitter_vertical_dark.png);
background-position: center center;
Expand All @@ -953,7 +978,15 @@ QSplitter::handle:horizontal {
width: 2px;
}

/* Similar to the splitter is the following window separator: */
QSplitter::handle:vertical {
background-image: url(qss:images/splitter_horizontal_dark.png);
background-position: center center;
background-repeat: none;
margin: 2px 4px 2px 4px;
height: 2px;
}

/* Similar to the splitter is the following window separator (but horizontal/vertical is on the opposite way) */
QMainWindow::separator {
background-position: center center;
background-repeat: none;
Expand Down Expand Up @@ -1555,13 +1588,10 @@ QRadioButton::indicator:pressed {
border-color: #adc5ed;
}

QRadioButton::indicator:disabled {
border: 1px solid #f5f5f5;
}

QRadioButton::indicator:disabled {
color: #f5f5f5;
background-color: transparent;
border: 1px solid #f5f5f5;
}

QRadioButton:focus {
Expand Down Expand Up @@ -1888,6 +1918,17 @@ QToolBar > QToolButton::menu-arrow:open {
background-image: url(qss:images/down_arrow_lighter.png);
}

/* when QToolButton is checked: */
QToolBar > QToolButton:checked {
border: 1px solid #7cabf9;
background-color: rgba(124,171,249,60); /* transparency for #7cabf9 color */
}

QToolBar > QToolButton:checked:hover {
border: 1px solid #7cabf9;
background-color: rgba(124,171,249,80); /* transparency for #7cabf9 color */
}

/*The "show more" button (it can also be stylable with "QToolBarExtension" */
QToolBar QToolButton#qt_toolbar_ext_button {
margin: 0px;
Expand Down
71 changes: 56 additions & 15 deletions src/Gui/Stylesheets/Dark-green.qss
View file
@@ -1,14 +1,14 @@
/*
ABOUT
============================================================================================================
version 2.04
version 2.05
QT theme (stylesheet) specially developed for FreeCAD (http://www.freecadweb.org/).
It might work with other software that uses QT styling.


LICENSE
============================================================================================================
Copyright (c) 2016 Pablo Gil Fern�ndez
Copyright (c) 2016 Pablo Gil Fernández

This work is licensed under the Creative Commons Attribution-ShareAlike 4.0 International License.
To view a copy of this license, visit http://creativecommons.org/licenses/by-sa/4.0/.
Expand Down Expand Up @@ -93,6 +93,7 @@ Main window
==================================================================================================*/
QMainWindow,
QDialog,
QDockWidget,
QToolBar {
background-color: #6e6e6e; /* main background color */
}
Expand Down Expand Up @@ -158,6 +159,38 @@ QMenu::indicator:non-exclusive:checked {
color: white;
}

/* Fix for elements inside a drop-down menu */
QMenu QRadioButton,
QMenu QCheckBox,
QMenu QPushButton,
QMenu QToolButton {
color: white; /* same as regular QRadioButton and QCheckBox */
}

QMenu QRadioButton:hover,
QMenu QCheckBox:hover,
QMenu QPushButton:hover,
QMenu QToolButton:hover,
QMenu QPushButton:pressed,
QMenu QToolButton:pressed,
QMenu QPushButton:selected,
QMenu QToolButton:selected {
color: white;
background-color: #94b30f; /* same as QMenu::item:selected and QMenu::item:pressed */
}

QMenu QRadioButton:disabled,
QMenu QCheckBox:disabled {
color: #f5f5f5;
}

QMenu QRadioButton::indicator:disabled,
QMenu QCheckBox::indicator:disabled {
color: #f5f5f5;
background-color: transparent;
border: 1px solid #f5f5f5;
}


/*==================================================================================================
Tool bar
Expand Down Expand Up @@ -937,14 +970,6 @@ QSplitter::handle {
padding: 0px;
}

QSplitter::handle:vertical {
background-image: url(qss:images/splitter_horizontal_dark.png);
background-position: center center;
background-repeat: none;
margin: 2px 4px 2px 4px;
height: 2px;
}

QSplitter::handle:horizontal {
background-image: url(qss:images/splitter_vertical_dark.png);
background-position: center center;
Expand All @@ -953,7 +978,15 @@ QSplitter::handle:horizontal {
width: 2px;
}

/* Similar to the splitter is the following window separator: */
QSplitter::handle:vertical {
background-image: url(qss:images/splitter_horizontal_dark.png);
background-position: center center;
background-repeat: none;
margin: 2px 4px 2px 4px;
height: 2px;
}

/* Similar to the splitter is the following window separator (but horizontal/vertical is on the opposite way) */
QMainWindow::separator {
background-position: center center;
background-repeat: none;
Expand Down Expand Up @@ -1555,13 +1588,10 @@ QRadioButton::indicator:pressed {
border-color: #c5d675;
}

QRadioButton::indicator:disabled {
border: 1px solid #f5f5f5;
}

QRadioButton::indicator:disabled {
color: #f5f5f5;
background-color: transparent;
border: 1px solid #f5f5f5;
}

QRadioButton:focus {
Expand Down Expand Up @@ -1888,6 +1918,17 @@ QToolBar > QToolButton::menu-arrow:open {
background-image: url(qss:images/down_arrow_lighter.png);
}

/* when QToolButton is checked: */
QToolBar > QToolButton:checked {
border: 1px solid #a5c61a;
background-color: rgba(124,171,249,60); /* transparency for #a5c61a color */
}

QToolBar > QToolButton:checked:hover {
border: 1px solid #a5c61a;
background-color: rgba(124,171,249,80); /* transparency for #a5c61a color */
}

/*The "show more" button (it can also be stylable with "QToolBarExtension" */
QToolBar QToolButton#qt_toolbar_ext_button {
margin: 0px;
Expand Down
71 changes: 56 additions & 15 deletions src/Gui/Stylesheets/Dark-orange.qss
View file
@@ -1,14 +1,14 @@
/*
ABOUT
============================================================================================================
version 2.04
version 2.05
QT theme (stylesheet) specially developed for FreeCAD (http://www.freecadweb.org/).
It might work with other software that uses QT styling.


LICENSE
============================================================================================================
Copyright (c) 2016 Pablo Gil Fern�ndez
Copyright (c) 2016 Pablo Gil Fernández

This work is licensed under the Creative Commons Attribution-ShareAlike 4.0 International License.
To view a copy of this license, visit http://creativecommons.org/licenses/by-sa/4.0/.
Expand Down Expand Up @@ -93,6 +93,7 @@ Main window
==================================================================================================*/
QMainWindow,
QDialog,
QDockWidget,
QToolBar {
background-color: #6e6e6e; /* main background color */
}
Expand Down Expand Up @@ -158,6 +159,38 @@ QMenu::indicator:non-exclusive:checked {
color: white;
}

/* Fix for elements inside a drop-down menu */
QMenu QRadioButton,
QMenu QCheckBox,
QMenu QPushButton,
QMenu QToolButton {
color: white; /* same as regular QRadioButton and QCheckBox */
}

QMenu QRadioButton:hover,
QMenu QCheckBox:hover,
QMenu QPushButton:hover,
QMenu QToolButton:hover,
QMenu QPushButton:pressed,
QMenu QToolButton:pressed,
QMenu QPushButton:selected,
QMenu QToolButton:selected {
color: white;
background-color: #daa116; /* same as QMenu::item:selected and QMenu::item:pressed */
}

QMenu QRadioButton:disabled,
QMenu QCheckBox:disabled {
color: #f5f5f5;
}

QMenu QRadioButton::indicator:disabled,
QMenu QCheckBox::indicator:disabled {
color: #f5f5f5;
background-color: transparent;
border: 1px solid #f5f5f5;
}


/*==================================================================================================
Tool bar
Expand Down Expand Up @@ -937,14 +970,6 @@ QSplitter::handle {
padding: 0px;
}

QSplitter::handle:vertical {
background-image: url(qss:images/splitter_horizontal_dark.png);
background-position: center center;
background-repeat: none;
margin: 2px 4px 2px 4px;
height: 2px;
}

QSplitter::handle:horizontal {
background-image: url(qss:images/splitter_vertical_dark.png);
background-position: center center;
Expand All @@ -953,7 +978,15 @@ QSplitter::handle:horizontal {
width: 2px;
}

/* Similar to the splitter is the following window separator: */
QSplitter::handle:vertical {
background-image: url(qss:images/splitter_horizontal_dark.png);
background-position: center center;
background-repeat: none;
margin: 2px 4px 2px 4px;
height: 2px;
}

/* Similar to the splitter is the following window separator (but horizontal/vertical is on the opposite way) */
QMainWindow::separator {
background-position: center center;
background-repeat: none;
Expand Down Expand Up @@ -1555,13 +1588,10 @@ QRadioButton::indicator:pressed {
border-color: #e0c992;
}

QRadioButton::indicator:disabled {
border: 1px solid #f5f5f5;
}

QRadioButton::indicator:disabled {
color: #f5f5f5;
background-color: transparent;
border: 1px solid #f5f5f5;
}

QRadioButton:focus {
Expand Down Expand Up @@ -1888,6 +1918,17 @@ QToolBar > QToolButton::menu-arrow:open {
background-image: url(qss:images/down_arrow_lighter.png);
}

/* when QToolButton is checked: */
QToolBar > QToolButton:checked {
border: 1px solid #e3b64d;
background-color: rgba(124,171,249,60); /* transparency for #e3b64d color */
}

QToolBar > QToolButton:checked:hover {
border: 1px solid #e3b64d;
background-color: rgba(124,171,249,80); /* transparency for #e3b64d color */
}

/*The "show more" button (it can also be stylable with "QToolBarExtension" */
QToolBar QToolButton#qt_toolbar_ext_button {
margin: 0px;
Expand Down

0 comments on commit b43cc0e

Please sign in to comment.