From a9d94238288cd4ce8215fc082a3d7f8681495616 Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Thu, 18 Feb 2021 16:39:59 -0500 Subject: [PATCH 01/13] Change colors of qdarkstyle according to new ux palette --- qdarkstyle/__init__.py | 4 +- qdarkstyle/darkpalette.py | 77 ++-- qdarkstyle/qss/_styles.scss | 781 ++++++++++++++++++------------------ qdarkstyle/utils/images.py | 8 +- 4 files changed, 444 insertions(+), 426 deletions(-) diff --git a/qdarkstyle/__init__.py b/qdarkstyle/__init__.py index a2e00ee4..de1e9af0 100644 --- a/qdarkstyle/__init__.py +++ b/qdarkstyle/__init__.py @@ -112,7 +112,7 @@ def _apply_os_patches(): text-align: center; height: 12px; }} - '''.format(color=DarkPalette.COLOR_BACKGROUND_NORMAL) + '''.format(color=DarkPalette.COLOR_BACKGROUND_4) # Only open the QSS file if any patch is needed if os_fix: @@ -160,7 +160,7 @@ def _apply_application_patches(QCoreApplication, QPalette, QColor): that moment for setting reasons. """ # See issue #139 - color = DarkPalette.COLOR_SELECTION_LIGHT + color = DarkPalette.COLOR_ACCENT_3 qcolor = QColor(color) # Todo: check if it is qcoreapplication indeed diff --git a/qdarkstyle/darkpalette.py b/qdarkstyle/darkpalette.py index d6ef9589..48dab182 100644 --- a/qdarkstyle/darkpalette.py +++ b/qdarkstyle/darkpalette.py @@ -14,17 +14,22 @@ class DarkPalette(object): """Theme variables.""" # Color - COLOR_BACKGROUND_LIGHT = Gray.B50 - COLOR_BACKGROUND_NORMAL = Gray.B30 - COLOR_BACKGROUND_DARK = Gray.B10 - - COLOR_FOREGROUND_LIGHT = Gray.B120 - COLOR_FOREGROUND_NORMAL = Gray.B80 - COLOR_FOREGROUND_DARK = Gray.B60 - - COLOR_SELECTION_LIGHT = Blue.B60 - COLOR_SELECTION_NORMAL = Blue.B40 - COLOR_SELECTION_DARK = Blue.B20 + COLOR_BACKGROUND_1 = Gray.B10 + COLOR_BACKGROUND_2 = Gray.B20 + COLOR_BACKGROUND_3 = Gray.B30 + COLOR_BACKGROUND_4 = Gray.B40 + COLOR_BACKGROUND_5 = Gray.B50 + COLOR_BACKGROUND_6 = Gray.B60 + + COLOR_TEXT_1 = Gray.B130 + COLOR_TEXT_2 = Gray.B110 + COLOR_TEXT_3 = Gray.B90 + COLOR_TEXT_4 = Gray.B60 + + COLOR_ACCENT_1 = Blue.B10 + COLOR_ACCENT_2 = Blue.B40 + COLOR_ACCENT_3 = Blue.B50 + COLOR_ACCENT_4 = Blue.B70 OPACITY_TOOLTIP = 230 @@ -32,16 +37,17 @@ class DarkPalette(object): SIZE_BORDER_RADIUS = '4px' # Borders - BORDER_LIGHT = '1px solid $COLOR_BACKGROUND_LIGHT' - BORDER_NORMAL = '1px solid $COLOR_BACKGROUND_NORMAL' - BORDER_DARK = '1px solid $COLOR_BACKGROUND_DARK' + BORDER_1 = '1px solid $COLOR_BACKGROUND_1' + BORDER_2 = '1px solid $COLOR_BACKGROUND_4' + BORDER_3 = '1px solid $COLOR_BACKGROUND_6' + + BORDER_SELECTION_3 = '1px solid $COLOR_ACCENT_3' + BORDER_SELECTION_2 = '1px solid $COLOR_ACCENT_2' + BORDER_SELECTION_1 = '1px solid $COLOR_ACCENT_1' - BORDER_SELECTION_LIGHT = '1px solid $COLOR_SELECTION_LIGHT' - BORDER_SELECTION_NORMAL = '1px solid $COLOR_SELECTION_NORMAL' - BORDER_SELECTION_DARK = '1px solid $COLOR_SELECTION_DARK' # Example of additional widget specific variables - W_STATUS_BAR_BACKGROUND_COLOR = COLOR_SELECTION_DARK + W_STATUS_BAR_BACKGROUND_COLOR = COLOR_ACCENT_1 # Paths PATH_RESOURCES = "':/qss_icons'" @@ -50,23 +56,28 @@ class DarkPalette(object): def to_dict(cls, colors_only=False): """Convert variables to dictionary.""" order = [ - 'COLOR_BACKGROUND_LIGHT', - 'COLOR_BACKGROUND_NORMAL', - 'COLOR_BACKGROUND_DARK', - 'COLOR_FOREGROUND_LIGHT', - 'COLOR_FOREGROUND_NORMAL', - 'COLOR_FOREGROUND_DARK', - 'COLOR_SELECTION_LIGHT', - 'COLOR_SELECTION_NORMAL', - 'COLOR_SELECTION_DARK', + 'COLOR_BACKGROUND_6', + 'COLOR_BACKGROUND_5', + 'COLOR_BACKGROUND_4', + 'COLOR_BACKGROUND_2', + 'COLOR_BACKGROUND_3', + 'COLOR_BACKGROUND_1', + 'COLOR_TEXT_1', + 'COLOR_TEXT_2', + 'COLOR_TEXT_3', + 'COLOR_TEXT_4', + 'COLOR_ACCENT_1', + 'COLOR_ACCENT_2', + 'COLOR_ACCENT_3', + 'COLOR_ACCENT_4', 'OPACITY_TOOLTIP', 'SIZE_BORDER_RADIUS', - 'BORDER_LIGHT', - 'BORDER_NORMAL', - 'BORDER_DARK', - 'BORDER_SELECTION_LIGHT', - 'BORDER_SELECTION_NORMAL', - 'BORDER_SELECTION_DARK', + 'BORDER_1', + 'BORDER_2', + 'BORDER_3', + 'BORDER_SELECTION_3', + 'BORDER_SELECTION_2', + 'BORDER_SELECTION_1', 'W_STATUS_BAR_BACKGROUND_COLOR', 'PATH_RESOURCES', ] diff --git a/qdarkstyle/qss/_styles.scss b/qdarkstyle/qss/_styles.scss index 2a7b76a9..9faded48 100644 --- a/qdarkstyle/qss/_styles.scss +++ b/qdarkstyle/qss/_styles.scss @@ -13,29 +13,29 @@ See Qt documentation: --------------------------------------------------------------------------- */ QWidget { - background-color: $COLOR_BACKGROUND_DARK; - border: 0px solid $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_1; + border: 0px solid $COLOR_BACKGROUND_4; padding: 0px; - color: $COLOR_FOREGROUND_LIGHT; - selection-background-color: $COLOR_SELECTION_NORMAL; - selection-color: $COLOR_FOREGROUND_LIGHT; + color: $COLOR_TEXT_1; + selection-background-color: $COLOR_ACCENT_2; + selection-color: $COLOR_TEXT_1; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; - selection-background-color: $COLOR_SELECTION_DARK; - selection-color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; + selection-background-color: $COLOR_ACCENT_1; + selection-color: $COLOR_TEXT_4; } &::item { &:selected { - background-color: $COLOR_SELECTION_NORMAL; + background-color: $COLOR_ACCENT_2; } &:hover { - background-color: $COLOR_SELECTION_LIGHT; - color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_ACCENT_3; + color: $COLOR_BACKGROUND_4; } } } @@ -49,14 +49,14 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qmainwindow QMainWindow { &::separator { - background-color: $COLOR_BACKGROUND_NORMAL; - border: 0px solid $COLOR_BACKGROUND_DARK; + background-color: $COLOR_BACKGROUND_4; + border: 0px solid $COLOR_BACKGROUND_1; spacing: 0px; padding: 2px; &:hover { - background-color: $COLOR_BACKGROUND_LIGHT; - border: 0px solid $COLOR_SELECTION_LIGHT; + background-color: $COLOR_BACKGROUND_6; + border: 0px solid $COLOR_ACCENT_3; } &:horizontal { @@ -81,9 +81,9 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtooltip --------------------------------------------------------------------------- */ QToolTip { - background-color: $COLOR_SELECTION_LIGHT; - border: $BORDER_DARK; - color: $COLOR_BACKGROUND_DARK; + background-color: $COLOR_ACCENT_2; + border: $BORDER_1; + color: $COLOR_TEXT_1; /* Remove padding, for fix combo box tooltip */ padding: 0px; @@ -97,10 +97,10 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qstatusbar --------------------------------------------------------------------------- */ QStatusBar { - border: $BORDER_NORMAL; + border: $BORDER_2; /* Fixes Spyder #9120, #9121 */ - background: $COLOR_BACKGROUND_NORMAL; + background: $COLOR_BACKGROUND_4; /* Fixes #205, white vertical borders separating items */ &::item { @@ -108,9 +108,9 @@ QStatusBar { } QToolTip { - background-color: $COLOR_SELECTION_LIGHT; - border: $BORDER_DARK; - color: $COLOR_BACKGROUND_DARK; + background-color: $COLOR_ACCENT_3; + border: $BORDER_1; + color: $COLOR_BACKGROUND_1; /* Remove padding, for fix combo box tooltip */ padding: 0px; @@ -131,8 +131,8 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qcheckbox --------------------------------------------------------------------------- */ QCheckBox { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_1; spacing: 4px; outline: none; padding-top: 4px; @@ -143,8 +143,8 @@ QCheckBox { } QWidget:disabled { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; } &::indicator { @@ -205,7 +205,7 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qgroupbox --------------------------------------------------------------------------- */ QGroupBox { font-weight: bold; - border: $BORDER_NORMAL; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; padding: 4px; margin-top: 16px; @@ -266,8 +266,8 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qradiobutton --------------------------------------------------------------------------- */ QRadioButton { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_1; spacing: 4px; padding: 0px; border: none; @@ -278,15 +278,15 @@ QRadioButton { } &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; border: none; outline: none; } QWidget { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_1; spacing: 0px; padding: 0px; outline: none; @@ -343,13 +343,13 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qmenubar --------------------------------------------------------------------------- */ QMenuBar { - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; padding: 2px; - border: $BORDER_DARK; - color: $COLOR_FOREGROUND_LIGHT; + border: $BORDER_1; + color: $COLOR_TEXT_1; &:focus { - border: $BORDER_SELECTION_LIGHT; + border: $BORDER_SELECTION_2; } &::item { @@ -359,14 +359,14 @@ QMenuBar { &:selected { padding: 4px; background: transparent; - border: 0px solid $COLOR_BACKGROUND_NORMAL; + border: 0px solid $COLOR_BACKGROUND_4; } &:pressed { padding: 4px; - border: 0px solid $COLOR_BACKGROUND_NORMAL; - background-color: $COLOR_SELECTION_LIGHT; - color: $COLOR_FOREGROUND_LIGHT; + border: 0px solid $COLOR_BACKGROUND_4; + background-color: $COLOR_ACCENT_3; + color: $COLOR_TEXT_1; margin-bottom: 0px; padding-bottom: 0px; } @@ -379,14 +379,15 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qmenu --------------------------------------------------------------------------- */ QMenu { - border: 0px solid $COLOR_BACKGROUND_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; + border: 0px solid $COLOR_BACKGROUND_4; + color: $COLOR_TEXT_1; margin: 0px; + background-color: $COLOR_BACKGROUND_3; &::separator { height: 1px; - background-color: $COLOR_BACKGROUND_LIGHT; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_6; + color: $COLOR_TEXT_1; } &::icon { @@ -395,13 +396,13 @@ QMenu { } &::item { - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; padding: 4px 24px 4px 24px; /* Reserve space for selection border */ - border: 1px transparent $COLOR_BACKGROUND_NORMAL; + border: 1px transparent $COLOR_BACKGROUND_4; &:selected { - color: $COLOR_FOREGROUND_LIGHT; + color: $COLOR_TEXT_1; } } @@ -465,9 +466,9 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qcombobox --------------------------------------------------------------------------- */ QAbstractItemView { - alternate-background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_LIGHT; - border: $BORDER_NORMAL; + alternate-background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_1; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; QLineEdit { @@ -481,17 +482,17 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qabstractscrollarea --------------------------------------------------------------------------- */ QAbstractScrollArea { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; padding: 2px; /* fix #159 */ min-height: 1.25em; /* fix #159 */ - color: $COLOR_FOREGROUND_LIGHT; + color: $COLOR_TEXT_1; &:disabled { - color: $COLOR_FOREGROUND_DARK; + color: $COLOR_TEXT_4; } } @@ -499,7 +500,7 @@ QAbstractScrollArea { --------------------------------------------------------------------------- */ QScrollArea QWidget QWidget:disabled { - background-color: $COLOR_BACKGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; } /* QScrollBar ------------------------------------------------------------- @@ -512,54 +513,54 @@ QScrollBar { &:horizontal { height: 16px; margin: 2px 16px 2px 16px; - border: $BORDER_NORMAL; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; - background-color: $COLOR_BACKGROUND_DARK; + background-color: $COLOR_BACKGROUND_6; } &:vertical { - background-color: $COLOR_BACKGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; width: 16px; margin: 16px 2px 16px 2px; - border: $BORDER_NORMAL; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; } &::handle { &:horizontal { - background-color: $COLOR_FOREGROUND_DARK; - border: $BORDER_NORMAL; + background-color: $COLOR_BACKGROUND_6; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; min-width: 8px; &:hover { - background-color: $COLOR_SELECTION_LIGHT; - border: $BORDER_SELECTION_LIGHT; + background-color: $COLOR_ACCENT_2; + border: $COLOR_ACCENT_2; border-radius: $SIZE_BORDER_RADIUS; min-width: 8px; } &:focus { - border: $BORDER_SELECTION_NORMAL; + border: $BORDER_SELECTION_3; } } &:vertical { - background-color: $COLOR_FOREGROUND_DARK; - border: $BORDER_NORMAL; + background-color: $COLOR_BACKGROUND_6; + border: $BORDER_2; min-height: 8px; border-radius: $SIZE_BORDER_RADIUS; &:hover { - background-color: $COLOR_SELECTION_LIGHT; - border: $BORDER_SELECTION_LIGHT; + background-color: $COLOR_ACCENT_2; + border: $COLOR_ACCENT_2; border-radius: $SIZE_BORDER_RADIUS; min-height: 8px; } &:focus { - border: $BORDER_SELECTION_NORMAL; + border: $BORDER_SELECTION_3; } } } @@ -668,23 +669,23 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-specific-widgets --------------------------------------------------------------------------- */ QTextEdit { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_1; border-radius: $SIZE_BORDER_RADIUS; - border: $BORDER_NORMAL; + border: $BORDER_2; &:hover { - border: $BORDER_SELECTION_LIGHT; - color: $COLOR_FOREGROUND_LIGHT; + border: $BORDER_SELECTION_2; + color: $COLOR_TEXT_1; } &:focus { - border: $BORDER_SELECTION_NORMAL; + border: $BORDER_SELECTION_3; } &:selected { - background: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_NORMAL; + background: $COLOR_ACCENT_2; + color: $COLOR_BACKGROUND_4; } } @@ -692,23 +693,23 @@ QTextEdit { --------------------------------------------------------------------------- */ QPlainTextEdit { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_1; border-radius: $SIZE_BORDER_RADIUS; - border: $BORDER_NORMAL; + border: $BORDER_2; &:hover { - border: $BORDER_SELECTION_LIGHT; - color: $COLOR_FOREGROUND_LIGHT; + border: $BORDER_SELECTION_2; + color: $COLOR_TEXT_1; } &:focus { - border: $BORDER_SELECTION_NORMAL; + border: $BORDER_SELECTION_3; } &:selected { - background: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_NORMAL; + background: $COLOR_ACCENT_2; + color: $COLOR_BACKGROUND_4; } } @@ -729,8 +730,8 @@ QSizeGrip { --------------------------------------------------------------------------- */ QStackedWidget { padding: 2px; - border: $BORDER_NORMAL; - border: $BORDER_DARK; + border: $BORDER_2; + border: $BORDER_1; } /* QToolBar --------------------------------------------------------------- @@ -739,32 +740,35 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtoolbar --------------------------------------------------------------------------- */ QToolBar { - background-color: $COLOR_BACKGROUND_NORMAL; - border-bottom: $BORDER_DARK; + background-color: $COLOR_BACKGROUND_4; + border-bottom: $BORDER_1; padding: 2px; font-weight: bold; spacing: 2px; QToolButton { - background-color: $COLOR_BACKGROUND_NORMAL; - border: $BORDER_NORMAL; + background-color: $COLOR_BACKGROUND_4; + border: $BORDER_2; &:hover { - border: $BORDER_SELECTION_LIGHT; + background-color: $COLOR_BACKGROUND_5; + border: $COLOR_BACKGROUND_5; } &:checked { - border: $BORDER_DARK; - background-color: $COLOR_BACKGROUND_DARK; + border: $BORDER_1; + background-color: $COLOR_BACKGROUND_6; &:hover { - border: $BORDER_SELECTION_LIGHT; + border: $BORDER_SELECTION_2; } } /* This fixes 202 */ &:disabled { - border: $BORDER_DARK; + border: $COLOR_BACKGROUND_4; + background-color: $COLOR_BACKGROUND_4; + } } @@ -796,9 +800,9 @@ QToolBar { } QToolButton#qt_toolbar_ext_button { - background: $COLOR_BACKGROUND_NORMAL; + background: $COLOR_BACKGROUND_4; border: 0px; - color: $COLOR_FOREGROUND_LIGHT; + color: $COLOR_TEXT_1; image: url($PATH_RESOURCES + '/rc/arrow_right.png'); } @@ -806,9 +810,9 @@ QToolButton#qt_toolbar_ext_button { --------------------------------------------------------------------------- */ QAbstractSpinBox { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; + color: $COLOR_TEXT_1; /* This fixes 103, 111 */ padding-top: 2px; @@ -821,11 +825,11 @@ QAbstractSpinBox { /* min-width: 5px; removed to fix 109 */ &:up-button { - background-color: transparent $COLOR_BACKGROUND_DARK; + background-color: transparent $COLOR_BACKGROUND_1; subcontrol-origin: border; subcontrol-position: top right; - border-left: $BORDER_NORMAL; - border-bottom: $BORDER_NORMAL; + border-left: $BORDER_2; + border-bottom: $BORDER_2; border-top-left-radius: 0; border-bottom-left-radius: 0; margin: 1px; @@ -846,11 +850,11 @@ QAbstractSpinBox { } &:down-button { - background-color: transparent $COLOR_BACKGROUND_DARK; + background-color: transparent $COLOR_BACKGROUND_1; subcontrol-origin: border; subcontrol-position: bottom right; - border-left: $BORDER_NORMAL; - border-top: $BORDER_NORMAL; + border-left: $BORDER_2; + border-top: $BORDER_2; border-top-left-radius: 0; border-bottom-left-radius: 0; margin: 1px; @@ -871,17 +875,17 @@ QAbstractSpinBox { } &:hover { - border: $BORDER_SELECTION_LIGHT; - color: $COLOR_FOREGROUND_LIGHT; + border: $BORDER_SELECTION_2; + color: $COLOR_TEXT_1; } &:focus { - border: $BORDER_SELECTION_NORMAL; + border: $BORDER_SELECTION_3; } &:selected { - background: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_NORMAL; + background: $COLOR_ACCENT_2; + color: $COLOR_BACKGROUND_4; } } @@ -895,16 +899,16 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qframe --------------------------------------------------------------------------- */ QLabel { - background-color: $COLOR_BACKGROUND_DARK; - border: 0px solid $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_1; + border: 0px solid $COLOR_BACKGROUND_4; padding: 2px; margin: 0px; - color: $COLOR_FOREGROUND_LIGHT; + color: $COLOR_TEXT_1; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - border: 0px solid $COLOR_BACKGROUND_NORMAL; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + border: 0px solid $COLOR_BACKGROUND_4; + color: $COLOR_TEXT_4; } } @@ -914,15 +918,15 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qabstractscrollarea --------------------------------------------------------------------------- */ QTextBrowser { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; + color: $COLOR_TEXT_1; border-radius: $SIZE_BORDER_RADIUS; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; + color: $COLOR_TEXT_4; border-radius: $SIZE_BORDER_RADIUS; } @@ -930,7 +934,7 @@ QTextBrowser { &:!hover, &:selected, &:pressed { - border: $BORDER_NORMAL; + border: $BORDER_2; } } @@ -938,15 +942,15 @@ QTextBrowser { --------------------------------------------------------------------------- */ QGraphicsView { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; + color: $COLOR_TEXT_1; border-radius: $SIZE_BORDER_RADIUS; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; + color: $COLOR_TEXT_4; border-radius: $SIZE_BORDER_RADIUS; } @@ -954,7 +958,7 @@ QGraphicsView { &:!hover, &:selected, &:pressed { - border: $BORDER_NORMAL; + border: $BORDER_2; } } @@ -962,12 +966,12 @@ QGraphicsView { --------------------------------------------------------------------------- */ QCalendarWidget { - border: $BORDER_NORMAL; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; } } @@ -975,12 +979,12 @@ QCalendarWidget { --------------------------------------------------------------------------- */ QLCDNumber { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_1; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; } } @@ -990,28 +994,28 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qprogressbar --------------------------------------------------------------------------- */ QProgressBar { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; + color: $COLOR_TEXT_1; border-radius: $SIZE_BORDER_RADIUS; text-align: center; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; + color: $COLOR_TEXT_4; border-radius: $SIZE_BORDER_RADIUS; text-align: center; } &::chunk { - background-color: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_DARK; + background-color: $COLOR_ACCENT_2; + color: $COLOR_BACKGROUND_1; border-radius: $SIZE_BORDER_RADIUS; &:disabled { - background-color: $COLOR_SELECTION_DARK; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_ACCENT_1; + color: $COLOR_TEXT_4; border-radius: $SIZE_BORDER_RADIUS; } } @@ -1027,9 +1031,9 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qpushbutton --------------------------------------------------------------------------- */ QPushButton { - background-color: $COLOR_BACKGROUND_LIGHT; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_4; + border: $BORDER_2; + color: $COLOR_TEXT_1; border-radius: $SIZE_BORDER_RADIUS; padding: 3px; outline: none; @@ -1037,32 +1041,31 @@ QPushButton { min-width: 80px; &:disabled { - background-color: $COLOR_BACKGROUND_NORMAL; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_4; + border: $BORDER_2; + color: $COLOR_TEXT_4; border-radius: $SIZE_BORDER_RADIUS; padding: 3px; } &:checked { - background-color: $COLOR_BACKGROUND_NORMAL; - border: $BORDER_NORMAL; + background-color: $COLOR_BACKGROUND_6; + border: $COLOR_BACKGROUND_6; border-radius: $SIZE_BORDER_RADIUS; padding: 3px; outline: none; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_6; + border: $COLOR_BACKGROUND_6; + color: $COLOR_TEXT_4; border-radius: $SIZE_BORDER_RADIUS; padding: 3px; outline: none; } &:selected { - background: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_NORMAL; + background: $COLOR_BACKGROUND_6; } } @@ -1073,32 +1076,24 @@ QPushButton { bottom: 4px; } - &:pressed { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_DARK; - - &:hover { - border: $BORDER_SELECTION_LIGHT; - } - } - &:hover { - border: $BORDER_SELECTION_LIGHT; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_5; + border: $COLOR_BACKGROUND_5; + color: $COLOR_TEXT_1; } - &:selected { - background: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_NORMAL; + &:pressed { + background-color: $COLOR_BACKGROUND_6; + border: $COLOR_BACKGROUND_6; } - &:hover { - border: $BORDER_SELECTION_LIGHT; - color: $COLOR_FOREGROUND_LIGHT; + &:selected { + background: $COLOR_BACKGROUND_6; + color: $COLOR_TEXT_1; } &:focus { - border: $BORDER_SELECTION_NORMAL; + border: $BORDER_SELECTION_3; } } @@ -1116,26 +1111,38 @@ QToolButton { padding: 2px; &:checked { - background-color: transparent; - border: $BORDER_SELECTION_NORMAL; + background-color: $COLOR_BACKGROUND_3; + border: $COLOR_BACKGROUND_3; &:disabled { - border: $BORDER_SELECTION_DARK; + background-color: $COLOR_BACKGROUND_4; + border: $COLOR_BACKGROUND_4; + } + &:hover { + background-color: $COLOR_BACKGROUND_3; + border: $COLOR_BACKGROUND_3; } } &:pressed { margin: 1px; - background-color: transparent; - border: $BORDER_SELECTION_NORMAL; + background-color: $COLOR_BACKGROUND_3; + border: $COLOR_BACKGROUND_3; + &:hover { + background-color: $COLOR_BACKGROUND_3; + border: $COLOR_BACKGROUND_3; + } } &:disabled { border: none; + } &:hover { - border: $BORDER_SELECTION_LIGHT; + background-color: $COLOR_BACKGROUND_2; + border: $COLOR_BACKGROUND_2; + } /* The subcontrols below are used only in the DelayedPopup mode */ @@ -1154,7 +1161,7 @@ QToolButton { &:hover { border: none; - border-left: 1px solid $COLOR_SELECTION_LIGHT; + border-left: 1px solid $COLOR_ACCENT_3; border-radius: 0; } } @@ -1169,17 +1176,17 @@ QToolButton { &::menu-button { padding: 2px; border-radius: $SIZE_BORDER_RADIUS; - border: $BORDER_NORMAL; + border: $BORDER_2; width: 12px; outline: none; &:hover { - border: $BORDER_SELECTION_LIGHT; + border: $BORDER_SELECTION_2; } &:checked { &:hover { - border: $BORDER_SELECTION_LIGHT; + border: $BORDER_SELECTION_2; } } } @@ -1210,15 +1217,15 @@ QToolButton { --------------------------------------------------------------------------- */ QCommandLinkButton { background-color: transparent; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; + border: $BORDER_2; + color: $COLOR_TEXT_1; border-radius: $SIZE_BORDER_RADIUS; padding: 0px; margin: 0px; &:disabled { background-color: transparent; - color: $COLOR_FOREGROUND_DARK; + color: $COLOR_TEXT_4; } } @@ -1232,9 +1239,9 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qcombobox --------------------------------------------------------------------------- */ QComboBox { - border: $BORDER_NORMAL; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; - selection-background-color: $COLOR_SELECTION_NORMAL; + selection-background-color: $COLOR_ACCENT_2; padding-left: 4px; padding-right: 36px; /* 4 + 16*2 See scrollbar size */ @@ -1247,42 +1254,42 @@ QComboBox { /* min-width: 75px; removed to fix #109 */ QAbstractItemView { - border: $BORDER_NORMAL; + border: $BORDER_2; border-radius: 0; - background-color: $COLOR_BACKGROUND_DARK; - selection-background-color: $COLOR_SELECTION_NORMAL; + background-color: $COLOR_BACKGROUND_1; + selection-background-color: $COLOR_ACCENT_2; &:hover { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_1; } &:selected { - background: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_NORMAL; + background: $COLOR_ACCENT_2; + color: $COLOR_BACKGROUND_4; } &:alternate { - background: $COLOR_BACKGROUND_DARK; + background: $COLOR_BACKGROUND_1; } } &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; } &:hover { - border: $BORDER_SELECTION_LIGHT; + border: $BORDER_SELECTION_2; } &:focus { - border: $BORDER_SELECTION_NORMAL; + border: $BORDER_SELECTION_3; } &:on { - selection-background-color: $COLOR_SELECTION_NORMAL; + selection-background-color: $COLOR_ACCENT_2; } /* Needed to remove indicator - fix #132 */ @@ -1296,14 +1303,14 @@ QComboBox { /* Needed to remove indicator - fix #132 */ &:alternate { - background: $COLOR_BACKGROUND_DARK; + background: $COLOR_BACKGROUND_1; } } &::item { &:alternate { - background: $COLOR_BACKGROUND_DARK; + background: $COLOR_BACKGROUND_1; } &:checked { @@ -1319,7 +1326,7 @@ QComboBox { subcontrol-origin: padding; subcontrol-position: top right; width: 12px; - border-left: 1px solid $COLOR_BACKGROUND_NORMAL; + border-left: 1px solid $COLOR_BACKGROUND_4; } &::down-arrow { @@ -1343,7 +1350,7 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qslider QSlider { &:disabled { - background: $COLOR_BACKGROUND_DARK; + background: $COLOR_BACKGROUND_1; } &:focus { @@ -1352,16 +1359,16 @@ QSlider { &::groove { &:horizontal { - background: $COLOR_BACKGROUND_NORMAL; - border: $BORDER_NORMAL; + background: $COLOR_BACKGROUND_4; + border: $BORDER_2; height: 4px; margin: 0px; border-radius: $SIZE_BORDER_RADIUS; } &:vertical { - background: $COLOR_BACKGROUND_NORMAL; - border: $BORDER_NORMAL; + background: $COLOR_BACKGROUND_4; + border: $BORDER_2; width: 4px; margin: 0px; border-radius: $SIZE_BORDER_RADIUS; @@ -1371,14 +1378,14 @@ QSlider { &::add-page { &:vertical { - background: $COLOR_SELECTION_NORMAL; - border: $BORDER_NORMAL; + background: $COLOR_ACCENT_2; + border: $BORDER_2; width: 4px; margin: 0px; border-radius: $SIZE_BORDER_RADIUS; :disabled { - background: $COLOR_SELECTION_DARK; + background: $COLOR_ACCENT_1; } } } @@ -1386,14 +1393,14 @@ QSlider { &::sub-page { &:horizontal { - background: $COLOR_SELECTION_NORMAL; - border: $BORDER_NORMAL; + background: $COLOR_ACCENT_2; + border: $BORDER_2; height: 4px; margin: 0px; border-radius: $SIZE_BORDER_RADIUS; &:disabled { - background: $COLOR_SELECTION_DARK; + background: $COLOR_ACCENT_1; } } } @@ -1401,38 +1408,38 @@ QSlider { &::handle { &:horizontal { - background: $COLOR_FOREGROUND_DARK; - border: $BORDER_NORMAL; + background: $COLOR_TEXT_4; + border: $BORDER_2; width: 8px; height: 8px; margin: -8px 0px; border-radius: $SIZE_BORDER_RADIUS; &:hover { - background: $COLOR_SELECTION_LIGHT; - border: $BORDER_SELECTION_LIGHT; + background: $COLOR_ACCENT_3; + border: $BORDER_SELECTION_2; } &:focus { - border: $BORDER_SELECTION_NORMAL; + border: $BORDER_SELECTION_3; } } &:vertical { - background: $COLOR_FOREGROUND_DARK; - border: $BORDER_NORMAL; + background: $COLOR_TEXT_4; + border: $BORDER_2; width: 8px; height: 8px; margin: 0 -8px; border-radius: $SIZE_BORDER_RADIUS; &:hover { - background: $COLOR_SELECTION_LIGHT; - border: $BORDER_SELECTION_LIGHT; + background: $COLOR_ACCENT_3; + border: $BORDER_SELECTION_2; } &:focus { - border: $BORDER_SELECTION_NORMAL; + border: $BORDER_SELECTION_3; } } } @@ -1444,7 +1451,7 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qlineedit --------------------------------------------------------------------------- */ QLineEdit { - background-color: $COLOR_BACKGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; padding-top: 2px; /* This QLineEdit fix 103, 111 */ padding-bottom: 2px; @@ -1452,27 +1459,27 @@ QLineEdit { padding-left: 4px; padding-right: 4px; border-style: solid; - border: $BORDER_NORMAL; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; - color: $COLOR_FOREGROUND_LIGHT; + color: $COLOR_TEXT_1; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; } &:hover { - border: $BORDER_SELECTION_LIGHT; - color: $COLOR_FOREGROUND_LIGHT; + border: $BORDER_SELECTION_2; + color: $COLOR_TEXT_1; } &:focus { - border: $BORDER_SELECTION_NORMAL; + border: $BORDER_SELECTION_3; } &:selected { - background-color: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_ACCENT_2; + color: $COLOR_BACKGROUND_4; } } @@ -1483,7 +1490,7 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtabwidget-and-qtabb --------------------------------------------------------------------------- */ QTabWidget { padding: 2px; - selection-background-color: $COLOR_BACKGROUND_NORMAL; + selection-background-color: $COLOR_BACKGROUND_4; QWidget { /* Fixes #189 */ @@ -1491,15 +1498,15 @@ QTabWidget { } &::pane { - border: $BORDER_NORMAL; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; margin: 0px; /* Fixes double border inside pane with pyqt5 */ padding: 0px; &:selected { - background-color: $COLOR_BACKGROUND_NORMAL; - border: 1px solid $COLOR_SELECTION_NORMAL; + background-color: $COLOR_BACKGROUND_4; + border: 1px solid $COLOR_ACCENT_2; } } } @@ -1544,99 +1551,99 @@ QTabBar { &::tab { &:top:selected:disabled { - border-bottom: 3px solid $COLOR_SELECTION_DARK; - color: $COLOR_FOREGROUND_DARK; - background-color: $COLOR_BACKGROUND_NORMAL; + border-bottom: 3px solid $COLOR_ACCENT_1; + color: $COLOR_TEXT_4; + background-color: $COLOR_BACKGROUND_4; } &:bottom:selected:disabled { - border-top: 3px solid $COLOR_SELECTION_DARK; - color: $COLOR_FOREGROUND_DARK; - background-color: $COLOR_BACKGROUND_NORMAL; + border-top: 3px solid $COLOR_ACCENT_1; + color: $COLOR_TEXT_4; + background-color: $COLOR_BACKGROUND_4; } &:left:selected:disabled { - border-right: 3px solid $COLOR_SELECTION_DARK; - color: $COLOR_FOREGROUND_DARK; - background-color: $COLOR_BACKGROUND_NORMAL; + border-right: 3px solid $COLOR_ACCENT_1; + color: $COLOR_TEXT_4; + background-color: $COLOR_BACKGROUND_4; } &:right:selected:disabled { - border-left: 3px solid $COLOR_SELECTION_DARK; - color: $COLOR_FOREGROUND_DARK; - background-color: $COLOR_BACKGROUND_NORMAL; + border-left: 3px solid $COLOR_ACCENT_1; + color: $COLOR_TEXT_4; + background-color: $COLOR_BACKGROUND_4; } /* !selected and disabled ----------------------------------------- */ &:top:!selected:disabled { - border-bottom: 3px solid $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; - background-color: $COLOR_BACKGROUND_DARK; + border-bottom: 3px solid $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; + background-color: $COLOR_BACKGROUND_1; } &:bottom:!selected:disabled { - border-top: 3px solid $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; - background-color: $COLOR_BACKGROUND_DARK; + border-top: 3px solid $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; + background-color: $COLOR_BACKGROUND_1; } &:left:!selected:disabled { - border-right: 3px solid $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; - background-color: $COLOR_BACKGROUND_DARK; + border-right: 3px solid $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; + background-color: $COLOR_BACKGROUND_1; } &:right:!selected:disabled { - border-left: 3px solid $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; - background-color: $COLOR_BACKGROUND_DARK; + border-left: 3px solid $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; + background-color: $COLOR_BACKGROUND_1; } /* selected ------------------------------------------------------- */ &:top:!selected { - border-bottom: 2px solid $COLOR_BACKGROUND_DARK; + border-bottom: 2px solid $COLOR_BACKGROUND_1; margin-top: 2px; } &:bottom:!selected { - border-top: 2px solid $COLOR_BACKGROUND_DARK; + border-top: 2px solid $COLOR_BACKGROUND_1; margin-bottom: 3px; } &:left:!selected { - border-left: 2px solid $COLOR_BACKGROUND_DARK; + border-left: 2px solid $COLOR_BACKGROUND_1; margin-right: 2px; } &:right:!selected { - border-right: 2px solid $COLOR_BACKGROUND_DARK; + border-right: 2px solid $COLOR_BACKGROUND_1; margin-left: 2px; } &:top { - background-color: $COLOR_BACKGROUND_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_4; + color: $COLOR_TEXT_1; margin-left: 2px; padding-left: 4px; padding-right: 4px; padding-top: 2px; padding-bottom: 2px; min-width: 5px; - border-bottom: 3px solid $COLOR_BACKGROUND_NORMAL; + border-bottom: 3px solid $COLOR_BACKGROUND_4; border-top-left-radius: 3px; border-top-right-radius: 3px; &:selected { - background-color: $COLOR_BACKGROUND_LIGHT; - color: $COLOR_FOREGROUND_LIGHT; - border-bottom: 3px solid $COLOR_SELECTION_NORMAL; + background-color: $COLOR_BACKGROUND_6; + color: $COLOR_TEXT_1; + border-bottom: 3px solid $COLOR_ACCENT_2; border-top-left-radius: 3px; border-top-right-radius: 3px; } &:!selected:hover { - border: $BORDER_SELECTION_LIGHT; - border-bottom: 3px solid $COLOR_SELECTION_LIGHT; + border: $BORDER_SELECTION_2; + border-bottom: 3px solid $COLOR_ACCENT_3; /* Fixes spyder-ide/spyder#9766 */ padding-left: 4px; @@ -1645,9 +1652,9 @@ QTabBar { } &:bottom { - color: $COLOR_FOREGROUND_LIGHT; - border-top: 3px solid $COLOR_BACKGROUND_NORMAL; - background-color: $COLOR_BACKGROUND_NORMAL; + color: $COLOR_TEXT_1; + border-top: 3px solid $COLOR_BACKGROUND_4; + background-color: $COLOR_BACKGROUND_4; margin-left: 2px; padding-left: 4px; padding-right: 4px; @@ -1658,16 +1665,16 @@ QTabBar { min-width: 5px; &:selected { - color: $COLOR_FOREGROUND_LIGHT; - background-color: $COLOR_BACKGROUND_LIGHT; - border-top: 3px solid $COLOR_SELECTION_NORMAL; + color: $COLOR_TEXT_1; + background-color: $COLOR_BACKGROUND_6; + border-top: 3px solid $COLOR_ACCENT_2; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } &:!selected:hover { - border: $BORDER_SELECTION_LIGHT; - border-top: 3px solid $COLOR_SELECTION_LIGHT; + border: $BORDER_SELECTION_2; + border-top: 3px solid $COLOR_ACCENT_3; /* Fixes spyder-ide/spyder#9766 */ padding-left: 4px; @@ -1677,8 +1684,8 @@ QTabBar { } &:left { - color: $COLOR_FOREGROUND_LIGHT; - background-color: $COLOR_BACKGROUND_NORMAL; + color: $COLOR_TEXT_1; + background-color: $COLOR_BACKGROUND_4; margin-top: 2px; padding-left: 2px; padding-right: 2px; @@ -1689,21 +1696,21 @@ QTabBar { min-height: 5px; &:selected { - color: $COLOR_FOREGROUND_LIGHT; - background-color: $COLOR_BACKGROUND_LIGHT; - border-right: 3px solid $COLOR_SELECTION_NORMAL; + color: $COLOR_TEXT_1; + background-color: $COLOR_BACKGROUND_6; + border-right: 3px solid $COLOR_ACCENT_2; } &:!selected:hover { - border: $BORDER_SELECTION_LIGHT; - border-right: 3px solid $COLOR_SELECTION_LIGHT; + border: $BORDER_SELECTION_2; + border-right: 3px solid $COLOR_ACCENT_3; padding: 0px; } } &:right { - color: $COLOR_FOREGROUND_LIGHT; - background-color: $COLOR_BACKGROUND_NORMAL; + color: $COLOR_TEXT_1; + background-color: $COLOR_BACKGROUND_4; margin-top: 2px; padding-left: 2px; padding-right: 2px; @@ -1714,15 +1721,15 @@ QTabBar { min-height: 5px; &:selected { - color: $COLOR_FOREGROUND_LIGHT; - background-color: $COLOR_BACKGROUND_LIGHT; - border-left: 3px solid $COLOR_SELECTION_NORMAL; + color: $COLOR_TEXT_1; + background-color: $COLOR_BACKGROUND_6; + border-left: 3px solid $COLOR_ACCENT_2; } &:!selected:hover { - border: $BORDER_SELECTION_LIGHT; - border-left: 3px solid $COLOR_SELECTION_LIGHT; + border: $BORDER_SELECTION_2; + border-left: 3px solid $COLOR_ACCENT_3; padding: 0px; } } @@ -1730,15 +1737,15 @@ QTabBar { QToolButton { /* Fixes #136 */ - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; height: 12px; width: 12px; &:pressed { - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; &:hover { - border: $BORDER_SELECTION_LIGHT; + border: $BORDER_SELECTION_2; } } @@ -1768,9 +1775,9 @@ QTabBar { --------------------------------------------------------------------------- */ QDockWidget { - outline: $BORDER_NORMAL; - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; + outline: $BORDER_2; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; titlebar-close-icon: url($PATH_RESOURCES + '/rc/window_close.png'); titlebar-normal-icon: url($PATH_RESOURCES + '/rc/window_undock.png'); @@ -1782,11 +1789,11 @@ QDockWidget { padding: 6px; spacing: 4px; border: none; - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; } &::close-button { - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; border-radius: $SIZE_BORDER_RADIUS; border: none; @@ -1800,7 +1807,7 @@ QDockWidget { } &::float-button { - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; border-radius: $SIZE_BORDER_RADIUS; border: none; @@ -1907,42 +1914,42 @@ QTreeView, QListView, QTableView, QColumnView { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; - gridline-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; + color: $COLOR_TEXT_1; + gridline-color: $COLOR_BACKGROUND_4; border-radius: $SIZE_BORDER_RADIUS; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; - color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; + color: $COLOR_TEXT_4; } &:selected { - background-color: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_ACCENT_2; + color: $COLOR_BACKGROUND_4; } &:hover { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_SELECTION_LIGHT; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_SELECTION_2; } &::item { &:pressed { - background-color: $COLOR_SELECTION_NORMAL; + background-color: $COLOR_ACCENT_2; } &:selected { &:hover { - background: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_DARK; + background: $COLOR_BACKGROUND_5; + color: $COLOR_TEXT_1; } &:active { - background-color: $COLOR_SELECTION_NORMAL; + background-color: $COLOR_ACCENT_2; } } @@ -1950,8 +1957,8 @@ QColumnView { &:hover { outline: 0; - color: $COLOR_SELECTION_LIGHT; - background-color: $COLOR_BACKGROUND_NORMAL; + color: $COLOR_TEXT_1; + background-color: $COLOR_BACKGROUND_3; } } } @@ -1959,8 +1966,8 @@ QColumnView { QTableCornerButton { &::section { - background-color: $COLOR_BACKGROUND_DARK; - border: 1px transparent $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_1; + border: 1px transparent $COLOR_BACKGROUND_4; border-radius: 0px; } } @@ -1971,62 +1978,62 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qheaderview --------------------------------------------------------------------------- */ QHeaderView { - background-color: $COLOR_BACKGROUND_NORMAL; - border: 0px transparent $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; + border: 0px transparent $COLOR_BACKGROUND_4; padding: 0px; margin: 0px; border-radius: 0px; &:disabled { - background-color: $COLOR_BACKGROUND_NORMAL; - border: 1px transparent $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; + border: 1px transparent $COLOR_BACKGROUND_4; padding: 2px; } &::section { - background-color: $COLOR_BACKGROUND_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_4; + color: $COLOR_TEXT_1; padding: 2px; border-radius: 0px; text-align: left; &:checked { - color: $COLOR_FOREGROUND_LIGHT; - background-color: $COLOR_SELECTION_NORMAL; + color: $COLOR_TEXT_1; + background-color: $COLOR_ACCENT_2; &:disabled { - color: $COLOR_FOREGROUND_DARK; - background-color: $COLOR_SELECTION_DARK; + color: $COLOR_TEXT_4; + background-color: $COLOR_ACCENT_1; } } &::horizontal { padding-left: 4px; padding-right: 4px; - border-left: $BORDER_DARK; + border-left: $BORDER_1; &::first, &::only-one { - border-left: $BORDER_NORMAL; + border-left: $BORDER_2; } &:disabled { - color: $COLOR_FOREGROUND_DARK; + color: $COLOR_TEXT_4; } } &::vertical { padding-left: 4px; padding-right: 4px; - border-top: $BORDER_DARK; + border-top: $BORDER_1; &::first, &::only-one { - border-top: $BORDER_NORMAL; + border-top: $BORDER_2; } &:disabled { - color: $COLOR_FOREGROUND_DARK; + color: $COLOR_TEXT_4; } } } @@ -2034,7 +2041,7 @@ QHeaderView { &::down-arrow { /* Those settings (border/width/height/background-color) solve bug */ /* transparent arrow background and size */ - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; border: none; height: 12px; width: 12px; @@ -2044,7 +2051,7 @@ QHeaderView { } &::up-arrow { - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; border: none; height: 12px; width: 12px; @@ -2062,54 +2069,54 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtoolbox QToolBox { padding: 0px; border: 0px; - border: $BORDER_NORMAL; + border: $BORDER_2; &:selected { padding: 0px; - border: 2px solid $COLOR_SELECTION_NORMAL; + border: 2px solid $COLOR_ACCENT_2; } &::tab { - background-color: $COLOR_BACKGROUND_DARK; - border: $BORDER_NORMAL; - color: $COLOR_FOREGROUND_LIGHT; + background-color: $COLOR_BACKGROUND_1; + border: $BORDER_2; + color: $COLOR_TEXT_1; border-top-left-radius: 4px; border-top-right-radius: 4px; &:disabled { - color: $COLOR_FOREGROUND_DARK; + color: $COLOR_TEXT_4; } &:selected { - background-color: $COLOR_BACKGROUND_LIGHT; - border-bottom: 2px solid $COLOR_SELECTION_NORMAL; + background-color: $COLOR_BACKGROUND_6; + border-bottom: 2px solid $COLOR_ACCENT_2; &:disabled { - background-color: $COLOR_BACKGROUND_NORMAL; - border-bottom: 2px solid $COLOR_SELECTION_DARK; + background-color: $COLOR_BACKGROUND_4; + border-bottom: 2px solid $COLOR_ACCENT_1; } } &:!selected { - background-color: $COLOR_BACKGROUND_NORMAL; - border-bottom: 2px solid $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; + border-bottom: 2px solid $COLOR_BACKGROUND_4; &:disabled { - background-color: $COLOR_BACKGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; } } &:hover { - border-color: $COLOR_SELECTION_LIGHT; - border-bottom: 2px solid $COLOR_SELECTION_LIGHT; + border-color: $COLOR_ACCENT_3; + border-bottom: 2px solid $COLOR_ACCENT_3; } } QScrollArea QWidget QWidget { padding: 0px; border: 0px; - background-color: $COLOR_BACKGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; } } @@ -2126,26 +2133,26 @@ https://stackoverflow.com/questions/14581498/qt-stylesheet-for-hline-vline-color .QFrame { border-radius: $SIZE_BORDER_RADIUS; - border: $BORDER_NORMAL; + border: $BORDER_2; /* No frame */ &[frameShape="0"] { border-radius: $SIZE_BORDER_RADIUS; - border: 1px transparent $COLOR_BACKGROUND_NORMAL; + border: 1px transparent $COLOR_BACKGROUND_4; } /* HLine */ &[frameShape="4"] { max-height: 2px; border: none; - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; } /* HLine */ &[frameShape="5"] { max-width: 2px; border: none; - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; } } @@ -2156,20 +2163,20 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qsplitter --------------------------------------------------------------------------- */ QSplitter { - background-color: $COLOR_BACKGROUND_NORMAL; + background-color: $COLOR_BACKGROUND_4; spacing: 0px; padding: 0px; margin: 0px; &::handle { - background-color: $COLOR_BACKGROUND_NORMAL; - border: 0px solid $COLOR_BACKGROUND_DARK; + background-color: $COLOR_BACKGROUND_4; + border: 0px solid $COLOR_BACKGROUND_1; spacing: 0px; padding: 1px; margin: 0px; &:hover { - background-color: $COLOR_FOREGROUND_DARK; + background-color: $COLOR_TEXT_4; } &:horizontal { @@ -2188,9 +2195,9 @@ QSplitter { --------------------------------------------------------------------------- */ QDateEdit, QDateTimeEdit { - selection-background-color: $COLOR_SELECTION_NORMAL; + selection-background-color: $COLOR_ACCENT_2; border-style: solid; - border: $BORDER_NORMAL; + border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; /* This fixes 103, 111 */ @@ -2203,14 +2210,14 @@ QDateEdit, QDateTimeEdit { min-width: 10px; &:on { - selection-background-color: $COLOR_SELECTION_NORMAL; + selection-background-color: $COLOR_ACCENT_2; } &::drop-down { subcontrol-origin: padding; subcontrol-position: top right; width: 12px; - border-left: 1px solid $COLOR_BACKGROUND_NORMAL; + border-left: 1px solid $COLOR_BACKGROUND_4; } &::down-arrow { @@ -2227,10 +2234,10 @@ QDateEdit, QDateTimeEdit { } QAbstractItemView { - background-color: $COLOR_BACKGROUND_DARK; + background-color: $COLOR_BACKGROUND_1; border-radius: $SIZE_BORDER_RADIUS; - border: $BORDER_NORMAL; - selection-background-color: $COLOR_SELECTION_NORMAL; + border: $BORDER_2; + selection-background-color: $COLOR_ACCENT_2; } } @@ -2241,13 +2248,13 @@ QDateEdit, QDateTimeEdit { QAbstractView { &:hover { - border: $BORDER_SELECTION_LIGHT; - color: $COLOR_FOREGROUND_LIGHT; + border: $BORDER_SELECTION_2; + color: $COLOR_TEXT_1; } &:selected { - background: $COLOR_SELECTION_NORMAL; - color: $COLOR_BACKGROUND_NORMAL; + background: $COLOR_ACCENT_2; + color: $COLOR_BACKGROUND_4; } } diff --git a/qdarkstyle/utils/images.py b/qdarkstyle/utils/images.py index 0356ec1b..11b148c3 100755 --- a/qdarkstyle/utils/images.py +++ b/qdarkstyle/utils/images.py @@ -46,10 +46,10 @@ def _get_file_color_map(fname, palette): """ Return map of files (i.e states) to color from given palette. """ - color_disabled = palette.COLOR_BACKGROUND_NORMAL - color_focus = palette.COLOR_SELECTION_LIGHT - color_pressed = palette.COLOR_SELECTION_NORMAL - color_normal = palette.COLOR_FOREGROUND_DARK + color_disabled = palette.COLOR_BACKGROUND_4 + color_focus = palette.COLOR_ACCENT_3 + color_pressed = palette.COLOR_ACCENT_2 + color_normal = palette.COLOR_TEXT_4 name, ext = fname.split('.') file_colors = { From 04832234d8998ad4d6b4a7c179345daad8d3ad86 Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Mon, 22 Feb 2021 14:42:28 -0500 Subject: [PATCH 02/13] Change gray B20 to improve contrast --- qdarkstyle/colorsystem.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/qdarkstyle/colorsystem.py b/qdarkstyle/colorsystem.py index c089e68d..1ba35ace 100644 --- a/qdarkstyle/colorsystem.py +++ b/qdarkstyle/colorsystem.py @@ -3,7 +3,7 @@ class Gray: B0 = '#000000' B10 = '#19232D' - B20 = '#262E38' + B20 = '#293544' B30 = '#37414F' B40 = '#455364' B50 = '#54687A' From b01c1e00760c24a4b5944cc72c1453919248be1e Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Thu, 25 Feb 2021 14:20:09 -0500 Subject: [PATCH 03/13] Small ux fixes from meeting --- qdarkstyle/darkpalette.py | 2 +- qdarkstyle/qss/_styles.scss | 8 ++++---- qdarkstyle/utils/images.py | 2 +- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/qdarkstyle/darkpalette.py b/qdarkstyle/darkpalette.py index 48dab182..f6760a6e 100644 --- a/qdarkstyle/darkpalette.py +++ b/qdarkstyle/darkpalette.py @@ -24,7 +24,7 @@ class DarkPalette(object): COLOR_TEXT_1 = Gray.B130 COLOR_TEXT_2 = Gray.B110 COLOR_TEXT_3 = Gray.B90 - COLOR_TEXT_4 = Gray.B60 + COLOR_TEXT_4 = Gray.B70 COLOR_ACCENT_1 = Blue.B10 COLOR_ACCENT_2 = Blue.B40 diff --git a/qdarkstyle/qss/_styles.scss b/qdarkstyle/qss/_styles.scss index 80e33bf7..13edfe38 100644 --- a/qdarkstyle/qss/_styles.scss +++ b/qdarkstyle/qss/_styles.scss @@ -1626,7 +1626,7 @@ QTabBar { &:selected { background-color: $COLOR_BACKGROUND_6; color: $COLOR_TEXT_1; - border-bottom: 3px solid $COLOR_ACCENT_2; + border-bottom: 3px solid $COLOR_ACCENT_4; border-top-left-radius: 3px; border-top-right-radius: 3px; } @@ -1657,7 +1657,7 @@ QTabBar { &:selected { color: $COLOR_TEXT_1; background-color: $COLOR_BACKGROUND_6; - border-top: 3px solid $COLOR_ACCENT_2; + border-top: 3px solid $COLOR_ACCENT_4; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } @@ -1688,7 +1688,7 @@ QTabBar { &:selected { color: $COLOR_TEXT_1; background-color: $COLOR_BACKGROUND_6; - border-right: 3px solid $COLOR_ACCENT_2; + border-right: 3px solid $COLOR_ACCENT_4; } &:!selected:hover { @@ -1713,7 +1713,7 @@ QTabBar { &:selected { color: $COLOR_TEXT_1; background-color: $COLOR_BACKGROUND_6; - border-left: 3px solid $COLOR_ACCENT_2; + border-left: 3px solid $COLOR_ACCENT_4; } diff --git a/qdarkstyle/utils/images.py b/qdarkstyle/utils/images.py index 11b148c3..2c955938 100755 --- a/qdarkstyle/utils/images.py +++ b/qdarkstyle/utils/images.py @@ -49,7 +49,7 @@ def _get_file_color_map(fname, palette): color_disabled = palette.COLOR_BACKGROUND_4 color_focus = palette.COLOR_ACCENT_3 color_pressed = palette.COLOR_ACCENT_2 - color_normal = palette.COLOR_TEXT_4 + color_normal = palette.COLOR_TEXT_1 name, ext = fname.split('.') file_colors = { From 4c03d616940f81b69d5a665ef96b0c9279a01b61 Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Fri, 26 Feb 2021 18:46:59 -0500 Subject: [PATCH 04/13] Fix some last issues with items (mostly non-spyder ones) --- qdarkstyle/darkpalette.py | 2 +- qdarkstyle/qss/_styles.scss | 41 +++++++++++++++++++------------------ qdarkstyle/utils/images.py | 2 +- 3 files changed, 23 insertions(+), 22 deletions(-) diff --git a/qdarkstyle/darkpalette.py b/qdarkstyle/darkpalette.py index f6760a6e..64393ae4 100644 --- a/qdarkstyle/darkpalette.py +++ b/qdarkstyle/darkpalette.py @@ -26,7 +26,7 @@ class DarkPalette(object): COLOR_TEXT_3 = Gray.B90 COLOR_TEXT_4 = Gray.B70 - COLOR_ACCENT_1 = Blue.B10 + COLOR_ACCENT_1 = Blue.B20 COLOR_ACCENT_2 = Blue.B40 COLOR_ACCENT_3 = Blue.B50 COLOR_ACCENT_4 = Blue.B70 diff --git a/qdarkstyle/qss/_styles.scss b/qdarkstyle/qss/_styles.scss index 13edfe38..c9003d01 100644 --- a/qdarkstyle/qss/_styles.scss +++ b/qdarkstyle/qss/_styles.scss @@ -33,9 +33,8 @@ QWidget { background-color: $COLOR_ACCENT_2; } - &:hover { + &:hover:!selected { background-color: $COLOR_ACCENT_3; - color: $COLOR_BACKGROUND_4; } } } @@ -515,7 +514,7 @@ QScrollBar { margin: 2px 16px 2px 16px; border: $BORDER_2; border-radius: $SIZE_BORDER_RADIUS; - background-color: $COLOR_BACKGROUND_6; + background-color: $COLOR_BACKGROUND_1; } &:vertical { @@ -746,11 +745,22 @@ QToolBar { } &:checked { - border: $BORDER_1; + border: $COLOR_BACKGROUND_6; background-color: $COLOR_BACKGROUND_6; &:hover { - border: $BORDER_SELECTION_2; + background-color: $COLOR_BACKGROUND_6; + border: $COLOR_BACKGROUND_6; + } + } + + &:pressed { + border: $COLOR_BACKGROUND_6; + background-color: $COLOR_BACKGROUND_6; + + &:hover { + background-color: $COLOR_BACKGROUND_6; + border: $COLOR_BACKGROUND_6; } } @@ -1082,10 +1092,6 @@ QPushButton { color: $COLOR_TEXT_1; } - &:focus { - border: $BORDER_SELECTION_3; - } - } /* QToolButton ------------------------------------------------------------ @@ -1406,7 +1412,7 @@ QSlider { border-radius: $SIZE_BORDER_RADIUS; &:hover { - background: $COLOR_ACCENT_3; + background: $COLOR_ACCENT_2; border: $BORDER_SELECTION_2; } @@ -1424,7 +1430,7 @@ QSlider { border-radius: $SIZE_BORDER_RADIUS; &:hover { - background: $COLOR_ACCENT_3; + background: $COLOR_ACCENT_2; border: $BORDER_SELECTION_2; } @@ -1632,7 +1638,7 @@ QTabBar { } &:!selected:hover { - border: $BORDER_SELECTION_2; + border: $BORDER_SELECTION_3; border-bottom: 3px solid $COLOR_ACCENT_3; /* Fixes spyder-ide/spyder#9766 */ @@ -1663,7 +1669,7 @@ QTabBar { } &:!selected:hover { - border: $BORDER_SELECTION_2; + border: $BORDER_SELECTION_3; border-top: 3px solid $COLOR_ACCENT_3; /* Fixes spyder-ide/spyder#9766 */ @@ -1692,7 +1698,7 @@ QTabBar { } &:!selected:hover { - border: $BORDER_SELECTION_2; + border: $BORDER_SELECTION_3; border-right: 3px solid $COLOR_ACCENT_3; padding: 0px; } @@ -1718,7 +1724,7 @@ QTabBar { } &:!selected:hover { - border: $BORDER_SELECTION_2; + border: $BORDER_SELECTION_3; border-left: 3px solid $COLOR_ACCENT_3; padding: 0px; } @@ -1932,11 +1938,6 @@ QColumnView { &:selected { - &:hover { - background: $COLOR_BACKGROUND_5; - color: $COLOR_TEXT_1; - } - &:active { background-color: $COLOR_ACCENT_2; } diff --git a/qdarkstyle/utils/images.py b/qdarkstyle/utils/images.py index 2c955938..93bba46a 100755 --- a/qdarkstyle/utils/images.py +++ b/qdarkstyle/utils/images.py @@ -47,7 +47,7 @@ def _get_file_color_map(fname, palette): Return map of files (i.e states) to color from given palette. """ color_disabled = palette.COLOR_BACKGROUND_4 - color_focus = palette.COLOR_ACCENT_3 + color_focus = palette.COLOR_ACCENT_4 color_pressed = palette.COLOR_ACCENT_2 color_normal = palette.COLOR_TEXT_1 From 93a4ed2def453328fcbf2231cefcef21eee26bac Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Mon, 1 Mar 2021 11:41:50 -0500 Subject: [PATCH 05/13] Change deactivated text color to B80 --- qdarkstyle/darkpalette.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/qdarkstyle/darkpalette.py b/qdarkstyle/darkpalette.py index 64393ae4..afb24d24 100644 --- a/qdarkstyle/darkpalette.py +++ b/qdarkstyle/darkpalette.py @@ -24,7 +24,7 @@ class DarkPalette(object): COLOR_TEXT_1 = Gray.B130 COLOR_TEXT_2 = Gray.B110 COLOR_TEXT_3 = Gray.B90 - COLOR_TEXT_4 = Gray.B70 + COLOR_TEXT_4 = Gray.B80 COLOR_ACCENT_1 = Blue.B20 COLOR_ACCENT_2 = Blue.B40 From 249b0547d89a6787cc7aced6b80ed12fc95b3dad Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Tue, 2 Mar 2021 15:49:53 -0500 Subject: [PATCH 06/13] Change image hover color to lighter blue added to the color roles --- qdarkstyle/darkpalette.py | 1 + qdarkstyle/utils/images.py | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/qdarkstyle/darkpalette.py b/qdarkstyle/darkpalette.py index afb24d24..44a372de 100644 --- a/qdarkstyle/darkpalette.py +++ b/qdarkstyle/darkpalette.py @@ -30,6 +30,7 @@ class DarkPalette(object): COLOR_ACCENT_2 = Blue.B40 COLOR_ACCENT_3 = Blue.B50 COLOR_ACCENT_4 = Blue.B70 + COLOR_ACCENT_5 = Blue.B90 OPACITY_TOOLTIP = 230 diff --git a/qdarkstyle/utils/images.py b/qdarkstyle/utils/images.py index 93bba46a..934fd0b0 100755 --- a/qdarkstyle/utils/images.py +++ b/qdarkstyle/utils/images.py @@ -47,7 +47,7 @@ def _get_file_color_map(fname, palette): Return map of files (i.e states) to color from given palette. """ color_disabled = palette.COLOR_BACKGROUND_4 - color_focus = palette.COLOR_ACCENT_4 + color_focus = palette.COLOR_ACCENT_5 color_pressed = palette.COLOR_ACCENT_2 color_normal = palette.COLOR_TEXT_1 From 06137d8cbe144ec2797ffd429cae9a48abce1405 Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Tue, 2 Mar 2021 16:13:51 -0500 Subject: [PATCH 07/13] Change hover and pressed states for buttons in dock widget --- qdarkstyle/qss/_styles.scss | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/qdarkstyle/qss/_styles.scss b/qdarkstyle/qss/_styles.scss index c9003d01..36582d3c 100644 --- a/qdarkstyle/qss/_styles.scss +++ b/qdarkstyle/qss/_styles.scss @@ -1794,11 +1794,11 @@ QDockWidget { border: none; &:hover { - image: url($PATH_RESOURCES + '/rc/window_close_focus.png'); + background-color: $COLOR_BACKGROUND_5; } &:pressed { - image: url($PATH_RESOURCES + '/rc/window_close_pressed.png'); + background-color: $COLOR_BACKGROUND_6; } } @@ -1808,11 +1808,11 @@ QDockWidget { border: none; &:hover { - image: url($PATH_RESOURCES + '/rc/window_undock_focus.png'); + background-color: $COLOR_BACKGROUND_5; } &:pressed { - image: url($PATH_RESOURCES + '/rc/window_undock_pressed.png'); + background-color: $COLOR_BACKGROUND_6; } } } From ce2614901f219b9cbcb055e1b8b048e079849c08 Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Sun, 14 Mar 2021 21:50:53 -0500 Subject: [PATCH 08/13] Small changes after meeting --- qdarkstyle/darkpalette.py | 2 +- qdarkstyle/qss/_styles.scss | 11 ++++++++--- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/qdarkstyle/darkpalette.py b/qdarkstyle/darkpalette.py index 44a372de..551575bf 100644 --- a/qdarkstyle/darkpalette.py +++ b/qdarkstyle/darkpalette.py @@ -30,7 +30,7 @@ class DarkPalette(object): COLOR_ACCENT_2 = Blue.B40 COLOR_ACCENT_3 = Blue.B50 COLOR_ACCENT_4 = Blue.B70 - COLOR_ACCENT_5 = Blue.B90 + COLOR_ACCENT_5 = Blue.B80 OPACITY_TOOLTIP = 230 diff --git a/qdarkstyle/qss/_styles.scss b/qdarkstyle/qss/_styles.scss index 36582d3c..99a05d44 100644 --- a/qdarkstyle/qss/_styles.scss +++ b/qdarkstyle/qss/_styles.scss @@ -1522,8 +1522,8 @@ QTabBar { &::close-button { border: 0; - margin: 2px; - padding: 2px; + margin: 1px; + padding: 1px; image: url($PATH_RESOURCES + '/rc/window_close.png'); @@ -1782,13 +1782,15 @@ QDockWidget { &::title { /* Better size for title bar */ - padding: 6px; + padding: 3px; spacing: 4px; border: none; background-color: $COLOR_BACKGROUND_4; } &::close-button { + margin: 1px; + padding: 3px; background-color: $COLOR_BACKGROUND_4; border-radius: $SIZE_BORDER_RADIUS; border: none; @@ -1803,6 +1805,8 @@ QDockWidget { } &::float-button { + margin: 1px; + padding: 1px; background-color: $COLOR_BACKGROUND_4; border-radius: $SIZE_BORDER_RADIUS; border: none; @@ -1986,6 +1990,7 @@ QHeaderView { padding: 2px; border-radius: 0px; text-align: left; + font-size: 13px; &:checked { color: $COLOR_TEXT_1; From 534e17a0e13e4af3663bf9e63a604acd4d5e0488 Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Thu, 18 Mar 2021 13:59:45 -0500 Subject: [PATCH 09/13] Fix padding and border issue with Qtoolbar --- qdarkstyle/qss/_styles.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/qdarkstyle/qss/_styles.scss b/qdarkstyle/qss/_styles.scss index 99a05d44..0002bbdb 100644 --- a/qdarkstyle/qss/_styles.scss +++ b/qdarkstyle/qss/_styles.scss @@ -730,8 +730,8 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtoolbar --------------------------------------------------------------------------- */ QToolBar { background-color: $COLOR_BACKGROUND_4; - border-bottom: $BORDER_1; - padding: 2px; + border-bottom: $BORDER_2; + padding: 0px; font-weight: bold; spacing: 2px; From 1755ed015dd21ae3e522c8b18afba36e7c9ea015 Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Mon, 22 Mar 2021 14:29:27 -0500 Subject: [PATCH 10/13] Fix border of toolbars --- qdarkstyle/qss/_styles.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/qdarkstyle/qss/_styles.scss b/qdarkstyle/qss/_styles.scss index b4cf7ac3..9faf28fc 100644 --- a/qdarkstyle/qss/_styles.scss +++ b/qdarkstyle/qss/_styles.scss @@ -733,8 +733,8 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtoolbar --------------------------------------------------------------------------- */ QToolBar { background-color: $COLOR_BACKGROUND_4; - border-bottom: $BORDER_2; - padding: 0px; + border-bottom: $BORDER_1; + padding: 1px; font-weight: bold; spacing: 2px; From 2af5a11301039bafb3888133fa3c2633eb3daff4 Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Mon, 22 Mar 2021 16:59:09 -0500 Subject: [PATCH 11/13] Remove tooltip border --- qdarkstyle/qss/_styles.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/qdarkstyle/qss/_styles.scss b/qdarkstyle/qss/_styles.scss index 9faf28fc..96df39ea 100644 --- a/qdarkstyle/qss/_styles.scss +++ b/qdarkstyle/qss/_styles.scss @@ -81,7 +81,6 @@ https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtooltip --------------------------------------------------------------------------- */ QToolTip { background-color: $COLOR_ACCENT_2; - border: $BORDER_1; color: $COLOR_TEXT_1; /* Remove padding, for fix combo box tooltip */ From 7552ca6ba55da0c27cecb1ce10624226bbc24ef1 Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Tue, 23 Mar 2021 15:47:37 -0500 Subject: [PATCH 12/13] Change shades of blue and grey in light mode, change background in menus --- qdarkstyle/colorsystem.py | 20 ++++++++++---------- qdarkstyle/qss/_styles.scss | 2 +- 2 files changed, 11 insertions(+), 11 deletions(-) diff --git a/qdarkstyle/colorsystem.py b/qdarkstyle/colorsystem.py index 1ba35ace..c6629847 100644 --- a/qdarkstyle/colorsystem.py +++ b/qdarkstyle/colorsystem.py @@ -10,11 +10,11 @@ class Gray: B60 = '#60798B' B70 = '#788D9C' B80 = '#9DA9B5' - B90 = '#CBCACA' - B100 = '#D9D8D8' - B110 = '#E1E1E1' - B120 = '#EEEEEE' - B130 = '#F5F5F5' + B90 = '#ACB1B6' + B100 = '#B9BDC1' + B110 = '#C9CDD0' + B120 = '#CED1D4' + B130 = '#E0E1E3' B140 = '#FAFAFA' B150 = '#FFFFFF' @@ -30,9 +30,9 @@ class Blue: B70 = '#259AE9' B80 = '#37AEFE' B90 = '#73C7FF' - B100 = '#9FD9FF' - B110 = '#C2E3FA' - B120 = '#CEEBFF' - B130 = '#DAF0FF' - B140 = '#F5FBFF' + B100 = '#9FCBFF' + B110 = '#C2DFFA' + B120 = '#CEE8FF' + B130 = '#DAEDFF' + B140 = '#F5FAFF' B150 = '##FFFFFF' diff --git a/qdarkstyle/qss/_styles.scss b/qdarkstyle/qss/_styles.scss index 96df39ea..b3c39fe3 100644 --- a/qdarkstyle/qss/_styles.scss +++ b/qdarkstyle/qss/_styles.scss @@ -396,7 +396,7 @@ QMenu { } &::item { - background-color: $COLOR_BACKGROUND_4; + background-color: $COLOR_BACKGROUND_3; padding: 4px 24px 4px 8px; /* Reserve space for selection border */ border: 1px transparent $COLOR_BACKGROUND_4; From a41d2166a392c41c4d899930cd80eea69d03e94a Mon Sep 17 00:00:00 2001 From: juanis2112 Date: Tue, 23 Mar 2021 18:26:53 -0500 Subject: [PATCH 13/13] Fix padding in hover/pressed state of toolbar buttons --- qdarkstyle/qss/_styles.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/qdarkstyle/qss/_styles.scss b/qdarkstyle/qss/_styles.scss index b3c39fe3..cd6518bb 100644 --- a/qdarkstyle/qss/_styles.scss +++ b/qdarkstyle/qss/_styles.scss @@ -1148,7 +1148,7 @@ QToolButton { /* The subcontrols below are used only in the DelayedPopup mode */ &[popupMode="0"] { /* Only for DelayedPopup */ - padding-right: 6px; + padding-right: 2px; } /* The subcontrols below are used only in the MenuButtonPopup mode */ @@ -1170,7 +1170,7 @@ QToolButton { /* The subcontrol below is used only in the InstantPopup or DelayedPopup mode */ &[popupMode="2"] { /* Only for InstantPopup */ - padding-right: 6px; + padding-right: 2px; } &::menu-button {