From 5401e856dfded8d73fe41176885f767bbcabe361 Mon Sep 17 00:00:00 2001 From: MisterMaker Date: Mon, 16 Oct 2023 16:13:28 +0200 Subject: [PATCH] [Overlay/Stylesheets] Add seperate Overlay stylesheets for default stylesheets. (#11005) Added the overlays to the preference packs also made the editor text a bit darker. --- .../Dark modern/Dark modern.cfg | 1 + src/Gui/PreferencePacks/Dark/Dark.cfg | 1 + src/Gui/PreferencePacks/Darker/Darker.cfg | 1 + .../Light modern/Light modern.cfg | 3 +- src/Gui/PreferencePacks/Light/Light.cfg | 3 +- src/Gui/Stylesheets/CMakeLists.txt | 5 + src/Gui/Stylesheets/Dark-modern.qss | 1 + src/Gui/Stylesheets/Dark.qss | 1 + src/Gui/Stylesheets/Darker.qss | 1 + src/Gui/Stylesheets/Light-modern.qss | 1 + src/Gui/Stylesheets/Light.qss | 1 + .../overlay/Dark-Modern_overlay.qss | 107 +++++++++++++++++ src/Gui/Stylesheets/overlay/Dark_overlay.qss | 107 +++++++++++++++++ .../Stylesheets/overlay/Darker_overlay.qss | 109 ++++++++++++++++++ .../overlay/Light-Modern_overlay.qss | 107 +++++++++++++++++ src/Gui/Stylesheets/overlay/Light_overlay.qss | 107 +++++++++++++++++ 16 files changed, 554 insertions(+), 2 deletions(-) create mode 100644 src/Gui/Stylesheets/overlay/Dark-Modern_overlay.qss create mode 100644 src/Gui/Stylesheets/overlay/Dark_overlay.qss create mode 100644 src/Gui/Stylesheets/overlay/Darker_overlay.qss create mode 100644 src/Gui/Stylesheets/overlay/Light-Modern_overlay.qss create mode 100644 src/Gui/Stylesheets/overlay/Light_overlay.qss diff --git a/src/Gui/PreferencePacks/Dark modern/Dark modern.cfg b/src/Gui/PreferencePacks/Dark modern/Dark modern.cfg index 55de24cabd..83050a9bbd 100644 --- a/src/Gui/PreferencePacks/Dark modern/Dark modern.cfg +++ b/src/Gui/PreferencePacks/Dark modern/Dark modern.cfg @@ -98,6 +98,7 @@ Dark-modern.qss + Dark-Modern_overlay.qss diff --git a/src/Gui/PreferencePacks/Dark/Dark.cfg b/src/Gui/PreferencePacks/Dark/Dark.cfg index 5d4c70fabf..13a9956fe0 100644 --- a/src/Gui/PreferencePacks/Dark/Dark.cfg +++ b/src/Gui/PreferencePacks/Dark/Dark.cfg @@ -98,6 +98,7 @@ Dark.qss + Dark_overlay.qss diff --git a/src/Gui/PreferencePacks/Darker/Darker.cfg b/src/Gui/PreferencePacks/Darker/Darker.cfg index 3596d37429..44ea31492f 100644 --- a/src/Gui/PreferencePacks/Darker/Darker.cfg +++ b/src/Gui/PreferencePacks/Darker/Darker.cfg @@ -98,6 +98,7 @@ Darker.qss + Darker_overlay.qss diff --git a/src/Gui/PreferencePacks/Light modern/Light modern.cfg b/src/Gui/PreferencePacks/Light modern/Light modern.cfg index 13ad2aa8dc..9b0eaa21a9 100644 --- a/src/Gui/PreferencePacks/Light modern/Light modern.cfg +++ b/src/Gui/PreferencePacks/Light modern/Light modern.cfg @@ -24,7 +24,7 @@ - + @@ -63,6 +63,7 @@ Light-modern.qss + Light-Modern_overlay.qss diff --git a/src/Gui/PreferencePacks/Light/Light.cfg b/src/Gui/PreferencePacks/Light/Light.cfg index f66e81207e..69935953ba 100644 --- a/src/Gui/PreferencePacks/Light/Light.cfg +++ b/src/Gui/PreferencePacks/Light/Light.cfg @@ -24,7 +24,7 @@ - + @@ -63,6 +63,7 @@ Light.qss + Light_overlay.qss diff --git a/src/Gui/Stylesheets/CMakeLists.txt b/src/Gui/Stylesheets/CMakeLists.txt index 0d1b5e031f..60a450929a 100644 --- a/src/Gui/Stylesheets/CMakeLists.txt +++ b/src/Gui/Stylesheets/CMakeLists.txt @@ -15,6 +15,11 @@ SET(Overlay_Stylesheets_Files "overlay/Light.qss" "overlay/Dark-Outline.qss" "overlay/Light-Outline.qss" + "overlay/Darker_overlay.qss" + "overlay/Dark_overlay.qss" + "overlay/Dark-Modern_overlay.qss" + "overlay/Light-Modern_overlay.qss" + "overlay/Light_overlay.qss" "overlay/close.svg" "overlay/overlay.svg" "overlay/float.svg" diff --git a/src/Gui/Stylesheets/Dark-modern.qss b/src/Gui/Stylesheets/Dark-modern.qss index 07d6de187e..ff7a5b9dc6 100644 --- a/src/Gui/Stylesheets/Dark-modern.qss +++ b/src/Gui/Stylesheets/Dark-modern.qss @@ -1810,6 +1810,7 @@ QTabWidget::pane { margin: 0px; /* Fixes double border inside pane with pyqt5 */ padding: 0px; + background-color: #2b2b2b; } QTabWidget::pane:selected { diff --git a/src/Gui/Stylesheets/Dark.qss b/src/Gui/Stylesheets/Dark.qss index 20b3b60f70..52ffb4de0b 100644 --- a/src/Gui/Stylesheets/Dark.qss +++ b/src/Gui/Stylesheets/Dark.qss @@ -1801,6 +1801,7 @@ QTabWidget::pane { margin: 0px; /* Fixes double border inside pane with pyqt5 */ padding: 0px; + background-color: #7f7f7f; } QTabWidget::pane:selected { diff --git a/src/Gui/Stylesheets/Darker.qss b/src/Gui/Stylesheets/Darker.qss index 6423e21143..70a81b28ed 100644 --- a/src/Gui/Stylesheets/Darker.qss +++ b/src/Gui/Stylesheets/Darker.qss @@ -1801,6 +1801,7 @@ QTabWidget::pane { margin: 0px; /* Fixes double border inside pane with pyqt5 */ padding: 0px; + background-color: #696968; } QTabWidget::pane:selected { diff --git a/src/Gui/Stylesheets/Light-modern.qss b/src/Gui/Stylesheets/Light-modern.qss index a4263e8774..6e492b2cd0 100644 --- a/src/Gui/Stylesheets/Light-modern.qss +++ b/src/Gui/Stylesheets/Light-modern.qss @@ -1818,6 +1818,7 @@ QTabWidget::pane { margin: 0px; /* Fixes double border inside pane with pyqt5 */ padding: 0px; + background-color: #f6f6f6; } QTabWidget::pane:selected { diff --git a/src/Gui/Stylesheets/Light.qss b/src/Gui/Stylesheets/Light.qss index 01a151601d..4ea281a71c 100644 --- a/src/Gui/Stylesheets/Light.qss +++ b/src/Gui/Stylesheets/Light.qss @@ -1803,6 +1803,7 @@ QTabWidget::pane { margin: 0px; /* Fixes double border inside pane with pyqt5 */ padding: 0px; + background-color: #f6f6f6; } QTabWidget::pane:selected { diff --git a/src/Gui/Stylesheets/overlay/Dark-Modern_overlay.qss b/src/Gui/Stylesheets/overlay/Dark-Modern_overlay.qss new file mode 100644 index 0000000000..e31b2d1b09 --- /dev/null +++ b/src/Gui/Stylesheets/overlay/Dark-Modern_overlay.qss @@ -0,0 +1,107 @@ +/* The OverlayTabWidget is named as OverlayLeft, OverlayRight, OverlayTop, OverlayBottom. +To customize for each overlay docking site, use the following selector + +Gui--OverlayTabWidget#OverlayLeft {} +*/ +/* +* { + color: #f0f0f0; + alternate-background-color: rgba(255, 179, 0, 0.607); + background-color: rgba(0, 255, 132, 0.607); +}*/ + +Gui--OverlayTabWidget { + qproperty-effectColor: rgba(42, 42, 42, 0.278); + qproperty-effectBlurRadius: 1.0; + qproperty-effectOffsetX: 0.0; + qproperty-effectOffsetY: 0.0; + qproperty-effectWidth: 2; + qproperty-effectHeight: 2; + qproperty-enableEffect: 1; +} + +Gui--OverlayTabWidget::tab-bar:top, +Gui--OverlayTabWidget::tab-bar:bottom { + left: 10px; + alignment: left; +} + +Gui--OverlayTabWidget::tab-bar:left, +Gui--OverlayTabWidget::tab-bar:right { + top: 10px; + alignment: top; +} + +Gui--OverlayTabWidget::pane { + background-color: transparent; +} + +Gui--OverlayProxyWidget { + qproperty-hintColor: rgba(100, 100, 100, 0.6); +} + +Gui--OverlayToolButton { + background: #444444; + padding: -2px; + border: 0px outset rgb(255, 255, 255); + border-radius: 0px; +} + +Gui--OverlayToolButton:hover { + background: #ffffff; + padding: 0px; +} + +Gui--OverlayToolButton:focus { + background: #cfcfcf; + padding: 0px; +} + +Gui--OverlayToolButton::pressed { + background: rgb(159, 159, 159); + border: 2px inset rgb(84, 84, 84); + padding: 0px; +} + +Gui--OverlayToolButton:checked { + background: #bebebe; + border: 2px inset #bebebe; + padding: 0px; + border-radius: 2px; +} + +Gui--OverlayToolButton:checked:hover { + background: rgba(255, 255, 255, 0.8); + border: 2px inset rgb(255, 255, 255); + +} + +/* Use the following selector to customize title bar for each side */ +/* +Gui--OverlayTabWidget#OverlayBottom Gui--OverlayTitleBar, +Gui--OverlayTabWidget#OverlayBottom QSplitter Gui--OverlaySplitterHandle { + background-color: qlineargradient( + spread:pad, x1:0, y1:1, x2:0, y2:0, + stop:0 #80202020, stop:1 #00202020); +} +*/ + +Gui--OverlaySplitterHandle { + background-color: #444444; +} + +Gui--OverlayTitleBar { + background-color: #444444; +} + +QScrollArea#ClippingScrollArea, +QWidget#ClippingScrollAreaContents { + background-color: #750000; +} +QSint--ActionGroup QFrame[class="content"] { + background-color: #444444; /* Task Panel background color */ +} + +QAbstractItemView { + alternate-background-color: #313131; +} diff --git a/src/Gui/Stylesheets/overlay/Dark_overlay.qss b/src/Gui/Stylesheets/overlay/Dark_overlay.qss new file mode 100644 index 0000000000..e31b2d1b09 --- /dev/null +++ b/src/Gui/Stylesheets/overlay/Dark_overlay.qss @@ -0,0 +1,107 @@ +/* The OverlayTabWidget is named as OverlayLeft, OverlayRight, OverlayTop, OverlayBottom. +To customize for each overlay docking site, use the following selector + +Gui--OverlayTabWidget#OverlayLeft {} +*/ +/* +* { + color: #f0f0f0; + alternate-background-color: rgba(255, 179, 0, 0.607); + background-color: rgba(0, 255, 132, 0.607); +}*/ + +Gui--OverlayTabWidget { + qproperty-effectColor: rgba(42, 42, 42, 0.278); + qproperty-effectBlurRadius: 1.0; + qproperty-effectOffsetX: 0.0; + qproperty-effectOffsetY: 0.0; + qproperty-effectWidth: 2; + qproperty-effectHeight: 2; + qproperty-enableEffect: 1; +} + +Gui--OverlayTabWidget::tab-bar:top, +Gui--OverlayTabWidget::tab-bar:bottom { + left: 10px; + alignment: left; +} + +Gui--OverlayTabWidget::tab-bar:left, +Gui--OverlayTabWidget::tab-bar:right { + top: 10px; + alignment: top; +} + +Gui--OverlayTabWidget::pane { + background-color: transparent; +} + +Gui--OverlayProxyWidget { + qproperty-hintColor: rgba(100, 100, 100, 0.6); +} + +Gui--OverlayToolButton { + background: #444444; + padding: -2px; + border: 0px outset rgb(255, 255, 255); + border-radius: 0px; +} + +Gui--OverlayToolButton:hover { + background: #ffffff; + padding: 0px; +} + +Gui--OverlayToolButton:focus { + background: #cfcfcf; + padding: 0px; +} + +Gui--OverlayToolButton::pressed { + background: rgb(159, 159, 159); + border: 2px inset rgb(84, 84, 84); + padding: 0px; +} + +Gui--OverlayToolButton:checked { + background: #bebebe; + border: 2px inset #bebebe; + padding: 0px; + border-radius: 2px; +} + +Gui--OverlayToolButton:checked:hover { + background: rgba(255, 255, 255, 0.8); + border: 2px inset rgb(255, 255, 255); + +} + +/* Use the following selector to customize title bar for each side */ +/* +Gui--OverlayTabWidget#OverlayBottom Gui--OverlayTitleBar, +Gui--OverlayTabWidget#OverlayBottom QSplitter Gui--OverlaySplitterHandle { + background-color: qlineargradient( + spread:pad, x1:0, y1:1, x2:0, y2:0, + stop:0 #80202020, stop:1 #00202020); +} +*/ + +Gui--OverlaySplitterHandle { + background-color: #444444; +} + +Gui--OverlayTitleBar { + background-color: #444444; +} + +QScrollArea#ClippingScrollArea, +QWidget#ClippingScrollAreaContents { + background-color: #750000; +} +QSint--ActionGroup QFrame[class="content"] { + background-color: #444444; /* Task Panel background color */ +} + +QAbstractItemView { + alternate-background-color: #313131; +} diff --git a/src/Gui/Stylesheets/overlay/Darker_overlay.qss b/src/Gui/Stylesheets/overlay/Darker_overlay.qss new file mode 100644 index 0000000000..5f6ba33f32 --- /dev/null +++ b/src/Gui/Stylesheets/overlay/Darker_overlay.qss @@ -0,0 +1,109 @@ +/* The OverlayTabWidget is named as OverlayLeft, OverlayRight, OverlayTop, OverlayBottom. +To customize for each overlay docking site, use the following selector + +Gui--OverlayTabWidget#OverlayLeft {} +*/ +/* +* { + color: #f0f0f0; + alternate-background-color: rgba(255, 179, 0, 0.607); + background-color: rgba(0, 255, 132, 0.607); +}*/ + +Gui--OverlayTabWidget { + qproperty-effectColor: rgba(42, 42, 42, 0.278); + qproperty-effectBlurRadius: 1.0; + qproperty-effectOffsetX: 0.0; + qproperty-effectOffsetY: 0.0; + qproperty-effectWidth: 2; + qproperty-effectHeight: 2; + qproperty-enableEffect: 1; +} + +Gui--OverlayTabWidget::tab-bar:top, +Gui--OverlayTabWidget::tab-bar:bottom { + left: 10px; + alignment: left; +} + +Gui--OverlayTabWidget::tab-bar:left, +Gui--OverlayTabWidget::tab-bar:right { + top: 10px; + alignment: top; +} + +Gui--OverlayTabWidget::pane { + background-color: transparent; +} + +Gui--OverlayProxyWidget { + qproperty-hintColor: rgba(100, 100, 100, 0.6); +} + +Gui--OverlayToolButton { + background-color: qlineargradient(x1:0, y1:0.3, x2:0, y2:1, stop:0 #333333, stop:1 #2a2a2a); + padding: -2px; + border: 0px outset rgb(255, 255, 255); + border-radius: 0px; +} + +Gui--OverlayToolButton:hover { + background: #ffffff; + padding: 0px; +} + +Gui--OverlayToolButton:focus { + background: #cfcfcf; + padding: 0px; +} + +Gui--OverlayToolButton::pressed { + background: rgb(159, 159, 159); + border: 2px inset rgb(84, 84, 84); + padding: 0px; +} + +Gui--OverlayToolButton:checked { + background: #bebebe; + border: 2px inset #bebebe; + padding: 0px; + border-radius: 2px; +} + +Gui--OverlayToolButton:checked:hover { + background: rgba(255, 255, 255, 0.8); + border: 2px inset rgb(255, 255, 255); + +} + +/* Use the following selector to customize title bar for each side */ +/* +Gui--OverlayTabWidget#OverlayBottom Gui--OverlayTitleBar, +Gui--OverlayTabWidget#OverlayBottom QSplitter Gui--OverlaySplitterHandle { + background-color: qlineargradient( + spread:pad, x1:0, y1:1, x2:0, y2:0, + stop:0 #80202020, stop:1 #00202020); +} +*/ + +Gui--OverlaySplitterHandle { + background-color: qlineargradient(x1:0, y1:0.3, x2:0, y2:1, stop:0 #333333, stop:1 #2a2a2a); +} +Gui--OverlayTitle { + background-color: #1cb00b; +} +Gui--OverlayTitleBar { + background-color: qlineargradient(x1:0, y1:0.3, x2:0, y2:1, stop:0 #333333, stop:1 #2a2a2a); +} + +QScrollArea#ClippingScrollArea, +QWidget#ClippingScrollAreaContents { + background-color: #750000; +} +QSint--ActionGroup QFrame[class="content"] { + background-color: #444444; /* Task Panel background color */ +} + +QAbstractItemView { + alternate-background-color: #313131; +} diff --git a/src/Gui/Stylesheets/overlay/Light-Modern_overlay.qss b/src/Gui/Stylesheets/overlay/Light-Modern_overlay.qss new file mode 100644 index 0000000000..db9f6ceb8b --- /dev/null +++ b/src/Gui/Stylesheets/overlay/Light-Modern_overlay.qss @@ -0,0 +1,107 @@ +/* The OverlayTabWidget is named as OverlayLeft, OverlayRight, OverlayTop, OverlayBottom. +To customize for each overlay docking site, use the following selector + +Gui--OverlayTabWidget#OverlayLeft {} +*/ +/* +* { + color: #f0f0f0; + alternate-background-color: rgba(255, 179, 0, 0.607); + background-color: rgba(0, 255, 132, 0.607); +}*/ + +Gui--OverlayTabWidget { + qproperty-effectColor: rgba(255, 255, 255, 0.394); + qproperty-effectBlurRadius: 1.0; + qproperty-effectOffsetX: 0.0; + qproperty-effectOffsetY: 0.0; + qproperty-effectWidth: 2; + qproperty-effectHeight: 2; + qproperty-enableEffect: 1; +} + +Gui--OverlayTabWidget::tab-bar:top, +Gui--OverlayTabWidget::tab-bar:bottom { + left: 10px; + alignment: left; +} + +Gui--OverlayTabWidget::tab-bar:left, +Gui--OverlayTabWidget::tab-bar:right { + top: 10px; + alignment: top; +} + +Gui--OverlayTabWidget::pane { + background-color: transparent; +} + +Gui--OverlayProxyWidget { + qproperty-hintColor: rgba(255, 255, 255, 0.6); +} + +Gui--OverlayToolButton { + background: #d4d4d4; + padding: -2px; + border: 0px outset rgb(255, 255, 255); + border-radius: 0px; +} + +Gui--OverlayToolButton:hover { + background: #ffffff; + padding: 0px; +} + +Gui--OverlayToolButton:focus { + background: #cfcfcf; + padding: 0px; +} + +Gui--OverlayToolButton::pressed { + background: rgb(159, 159, 159); + border: 2px inset rgb(196, 196, 196); + padding: 0px; +} + +Gui--OverlayToolButton:checked { + background: #bebebe; + border: 2px inset #bebebe; + padding: 0px; + border-radius: 2px; +} + +Gui--OverlayToolButton:checked:hover { + background: rgba(255, 255, 255, 0.8); + border: 2px inset rgb(255, 255, 255); + +} + +/* Use the following selector to customize title bar for each side */ +/* +Gui--OverlayTabWidget#OverlayBottom Gui--OverlayTitleBar, +Gui--OverlayTabWidget#OverlayBottom QSplitter Gui--OverlaySplitterHandle { + background-color: qlineargradient( + spread:pad, x1:0, y1:1, x2:0, y2:0, + stop:0 #80202020, stop:1 #00202020); +} +*/ + +Gui--OverlaySplitterHandle { + background-color: #d4d4d4; +} + +Gui--OverlayTitleBar { + background-color: #d4d4d4; +} + +QScrollArea#ClippingScrollArea, +QWidget#ClippingScrollAreaContents { + background-color: #ffdede; +} +QSint--ActionGroup QFrame[class="content"] { + background-color: #f6f6f6; /* Task Panel background color */ +} + +QAbstractItemView { + alternate-background-color: #ffffff; +} diff --git a/src/Gui/Stylesheets/overlay/Light_overlay.qss b/src/Gui/Stylesheets/overlay/Light_overlay.qss new file mode 100644 index 0000000000..1a5ef633c5 --- /dev/null +++ b/src/Gui/Stylesheets/overlay/Light_overlay.qss @@ -0,0 +1,107 @@ +/* The OverlayTabWidget is named as OverlayLeft, OverlayRight, OverlayTop, OverlayBottom. +To customize for each overlay docking site, use the following selector + +Gui--OverlayTabWidget#OverlayLeft {} +*/ +/* +* { + color: #f0f0f0; + alternate-background-color: rgba(255, 179, 0, 0.607); + background-color: rgba(0, 255, 132, 0.607); +}*/ + +Gui--OverlayTabWidget { + qproperty-effectColor: rgba(255, 255, 255, 0.394); + qproperty-effectBlurRadius: 1.0; + qproperty-effectOffsetX: 0.0; + qproperty-effectOffsetY: 0.0; + qproperty-effectWidth: 2; + qproperty-effectHeight: 2; + qproperty-enableEffect: 1; +} + +Gui--OverlayTabWidget::tab-bar:top, +Gui--OverlayTabWidget::tab-bar:bottom { + left: 10px; + alignment: left; +} + +Gui--OverlayTabWidget::tab-bar:left, +Gui--OverlayTabWidget::tab-bar:right { + top: 10px; + alignment: top; +} + +Gui--OverlayTabWidget::pane { + background-color: transparent; +} + +Gui--OverlayProxyWidget { + qproperty-hintColor: rgba(255, 255, 255, 0.6); +} + +Gui--OverlayToolButton { + background: #f6f6f6; + padding: -2px; + border: 0px outset rgb(255, 255, 255); + border-radius: 0px; +} + +Gui--OverlayToolButton:hover { + background: #ffffff; + padding: 0px; +} + +Gui--OverlayToolButton:focus { + background: #cfcfcf; + padding: 0px; +} + +Gui--OverlayToolButton::pressed { + background: rgb(159, 159, 159); + border: 2px inset rgb(196, 196, 196); + padding: 0px; +} + +Gui--OverlayToolButton:checked { + background: #bebebe; + border: 2px inset #bebebe; + padding: 0px; + border-radius: 2px; +} + +Gui--OverlayToolButton:checked:hover { + background: rgba(255, 255, 255, 0.8); + border: 2px inset rgb(255, 255, 255); + +} + +/* Use the following selector to customize title bar for each side */ +/* +Gui--OverlayTabWidget#OverlayBottom Gui--OverlayTitleBar, +Gui--OverlayTabWidget#OverlayBottom QSplitter Gui--OverlaySplitterHandle { + background-color: qlineargradient( + spread:pad, x1:0, y1:1, x2:0, y2:0, + stop:0 #80202020, stop:1 #00202020); +} +*/ + +Gui--OverlaySplitterHandle { + background-color: qlineargradient(x1:0, y1:0.3, x2:0, y2:1, stop:0 #E2E2E2, stop:1 #EDEDED); +} + +Gui--OverlayTitleBar { + background-color: qlineargradient(x1:0, y1:0.3, x2:0, y2:1, stop:0 #E2E2E2, stop:1 #EDEDED); +} + +QScrollArea#ClippingScrollArea, +QWidget#ClippingScrollAreaContents { + background-color: #ffdede; +} +QSint--ActionGroup QFrame[class="content"] { + background-color: #f6f6f6; /* Task Panel background color */ +} + +QAbstractItemView { + alternate-background-color: #ffffff; +}