From d4914fccc56fe64b7e489fd548287a9933b65505 Mon Sep 17 00:00:00 2001 From: Davide Date: Mon, 12 Jan 2026 17:40:02 +0100 Subject: [PATCH] Refine dark mode borders and improve modal overlay spacing --- src/qt/forms/modaloverlay.ui | 60 +++-- src/qt/res/styles/dark.qss | 462 ++++++++++++++++++++++++++++++++--- 2 files changed, 462 insertions(+), 60 deletions(-) diff --git a/src/qt/forms/modaloverlay.ui b/src/qt/forms/modaloverlay.ui index ef7b52e..9aa6fbd 100644 --- a/src/qt/forms/modaloverlay.ui +++ b/src/qt/forms/modaloverlay.ui @@ -54,29 +54,29 @@ - 0 + 16 - 10 + 20 - 10 + 20 - 10 + 20 - 10 + 20 - - 20 + + 16 - - 0 + + 8 @@ -119,11 +119,8 @@ - - 0 - - - 0 + + 12 @@ -165,7 +162,7 @@ 20 - 40 + 20 @@ -182,7 +179,7 @@ 20 - 40 + 24 @@ -193,13 +190,22 @@ QFormLayout::FieldsStayAtSizeHint - 6 + 16 - 6 + 10 - 10 + 0 + + + 0 + + + 0 + + + 0 @@ -262,6 +268,9 @@ + + 8 + @@ -325,11 +334,20 @@ + + 8 + - 10 + 0 - 10 + 20 + + + 0 + + + 0 diff --git a/src/qt/res/styles/dark.qss b/src/qt/res/styles/dark.qss index abe9bd4..46f1b22 100644 --- a/src/qt/res/styles/dark.qss +++ b/src/qt/res/styles/dark.qss @@ -1,8 +1,21 @@ /* ======================================================= - PALLADIUM CORE DARK THEME (dark.qss) + PALLADIUM CORE DARK THEME - Refined Borders Edition ======================================================= */ -/* --- GRUNDLAGEN --- */ +/* --- BORDER COLOR PALETTE --- + Subtle borders: #404040 (Separators, discrete lines) + Standard borders: #4A4A4A (Containers, inputs) + Emphasized borders: #5A5A5A (Focus, active elements) + Hover borders: #606060 (Interactive feedback) + + Border Radius Strategy: + Small elements: 5px (Buttons, inputs) + Medium elements: 6px (Tabs, cards) + Large elements: 8px (Containers, panels) + Dialogs/Modals: 10px (Top-level windows) +*/ + +/* --- BASE WIDGETS --- */ QWidget { background-color: #2D2D2D; color: #E0E0E0; @@ -11,136 +24,507 @@ QWidget { outline: none; } -/* --- MENÜLEISTE (Oben: File, Settings...) --- */ +/* --- MENU BAR --- */ QMenuBar { background-color: #2D2D2D; color: #E0E0E0; - border-bottom: 1px solid #3A3A3A; + border-bottom: 1px solid #404040; + padding: 2px; } QMenuBar::item { background-color: transparent; padding: 6px 10px; + border-radius: 5px; + margin: 2px; } QMenuBar::item:selected { background-color: #3A3A3A; + border: 1px solid #4A4A4A; } +/* --- MENUS --- */ QMenu { background-color: #2D2D2D; - border: 1px solid #555; + border: 1px solid #4A4A4A; + border-radius: 6px; + padding: 4px; } QMenu::item { - padding: 5px 20px; + padding: 6px 20px; + border-radius: 4px; + margin: 2px; } QMenu::item:selected { background-color: #007BFF; color: white; + border: 1px solid #007BFF; } -/* --- TOOLBAR (Die Icons oben) --- */ -/* Wir machen sie etwas heller, damit schwarze Icons sichtbar bleiben */ +QMenu::separator { + height: 1px; + background: #404040; + margin: 4px 8px; +} + +/* --- TOOLBAR --- */ QToolBar { - background-color: #3D3D3D; - border-bottom: 1px solid #3A3A3A; - padding: 2px; + background-color: #3D3D3D; + border-bottom: 1px solid #404040; + padding: 3px; spacing: 5px; } QToolButton { background-color: transparent; border: 1px solid transparent; - border-radius: 4px; - padding: 4px; + border-radius: 5px; + padding: 5px; color: #E0E0E0; } QToolButton:hover { background-color: #4D4D4D; - border: 1px solid #555; + border: 1px solid #5A5A5A; +} + +QToolButton:pressed { + background-color: #3A3A3A; + border: 1px solid #606060; } QToolButton:checked { background-color: #007BFF; color: white; + border: 1px solid #007BFF; } -/* --- TABS (Overview, Send, Receive) --- */ +/* --- TABS --- */ QTabWidget::pane { - border: 1px solid #3A3A3A; + border: 1px solid #4A4A4A; + border-radius: 6px; + background-color: #2D2D2D; } QTabBar::tab { background: #1E1E1E; color: #AAAAAA; padding: 8px 20px; - border: 1px solid #3A3A3A; + border: 1px solid #4A4A4A; border-bottom: none; - border-top-left-radius: 4px; - border-top-right-radius: 4px; + border-top-left-radius: 6px; + border-top-right-radius: 6px; margin-right: 2px; + min-width: 80px; +} + +QTabBar::tab:hover { + background: #252525; + color: #E0E0E0; + border: 1px solid #5A5A5A; + border-bottom: none; } QTabBar::tab:selected { - background: #2D2D2D; /* Gleiche Farbe wie Hintergrund */ + background: #2D2D2D; color: #FFFFFF; - border-bottom: 1px solid #2D2D2D; /* "Verbindet" den Tab mit dem Inhalt */ + border: 1px solid #4A4A4A; + border-bottom: 1px solid #2D2D2D; font-weight: bold; } -/* --- EINGABEFELDER --- */ +QTabBar::tab:!selected { + margin-top: 2px; +} + +/* --- INPUT FIELDS --- */ QLineEdit, QTextEdit, QPlainTextEdit, QSpinBox, QDoubleSpinBox { background-color: #1E1E1E; color: #FFFFFF; - border: 1px solid #3A3A3A; + border: 1px solid #4A4A4A; + border-radius: 5px; + padding: 6px 8px; + selection-background-color: #007BFF; +} + +QLineEdit:hover, QTextEdit:hover, QPlainTextEdit:hover, +QSpinBox:hover, QDoubleSpinBox:hover { + border: 1px solid #5A5A5A; + background-color: #252525; +} + +QLineEdit:focus, QTextEdit:focus, QPlainTextEdit:focus, +QSpinBox:focus, QDoubleSpinBox:focus { + border: 2px solid #007BFF; + background-color: #252525; + padding: 5px 7px; /* Compensate for thicker border */ +} + +QLineEdit:disabled, QTextEdit:disabled, QPlainTextEdit:disabled, +QSpinBox:disabled, QDoubleSpinBox:disabled { + background-color: #1E1E1E; + color: #6A6A6A; + border: 1px solid #404040; +} + +/* --- SPIN BOX BUTTONS --- */ +QSpinBox::up-button, QDoubleSpinBox::up-button, +QSpinBox::down-button, QDoubleSpinBox::down-button { + background-color: transparent; + border: none; border-radius: 3px; - padding: 4px; + width: 16px; } -QLineEdit:focus { - border: 1px solid #007BFF; +QSpinBox::up-button:hover, QDoubleSpinBox::up-button:hover, +QSpinBox::down-button:hover, QDoubleSpinBox::down-button:hover { + background-color: #3A3A3A; } -/* --- LISTEN & TABELLEN (Transaktionen) --- */ -QTableView, QListView, QTreeWidget { +/* --- LISTS & TABLES --- */ +QTableView, QListView, QTreeWidget, QTreeView { background-color: #1E1E1E; alternate-background-color: #252525; color: #E0E0E0; - gridline-color: #333; - border: 1px solid #3A3A3A; + gridline-color: #404040; + border: 1px solid #4A4A4A; + border-radius: 6px; + selection-background-color: #007BFF; +} + +QTableView:focus, QListView:focus, QTreeWidget:focus, QTreeView:focus { + border: 2px solid #5A5A5A; +} + +QTableView::item:hover, QListView::item:hover, +QTreeWidget::item:hover, QTreeView::item:hover { + background-color: #3A3A3A; +} + +QTableView::item:selected, QListView::item:selected, +QTreeWidget::item:selected, QTreeView::item:selected { + background-color: #007BFF; + color: #FFFFFF; } QHeaderView::section { background-color: #333; color: #E0E0E0; - padding: 4px; - border: 1px solid #444; + padding: 6px 4px; + border: none; + border-right: 1px solid #404040; + border-bottom: 1px solid #4A4A4A; + font-weight: 600; +} + +QHeaderView::section:hover { + background-color: #3A3A3A; + border-bottom: 1px solid #5A5A5A; +} + +QHeaderView::section:first { + border-top-left-radius: 6px; +} + +QHeaderView::section:last { + border-right: none; +} + +/* --- SCROLLBARS --- */ +QScrollBar:vertical { + background: #1E1E1E; + width: 12px; + border-radius: 6px; + margin: 2px; +} + +QScrollBar::handle:vertical { + background: #4A4A4A; + border-radius: 6px; + min-height: 30px; +} + +QScrollBar::handle:vertical:hover { + background: #5A5A5A; +} + +QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical { + height: 0px; +} + +QScrollBar:horizontal { + background: #1E1E1E; + height: 12px; + border-radius: 6px; + margin: 2px; +} + +QScrollBar::handle:horizontal { + background: #4A4A4A; + border-radius: 6px; + min-width: 30px; +} + +QScrollBar::handle:horizontal:hover { + background: #5A5A5A; +} + +QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal { + width: 0px; } /* --- BUTTONS --- */ QPushButton { background-color: #444; - border: 1px solid #555; - border-radius: 4px; - padding: 5px 15px; + border: 1px solid #5A5A5A; + border-radius: 5px; + padding: 6px 16px; color: white; + font-weight: 500; + min-height: 24px; } QPushButton:hover { background-color: #555; + border: 1px solid #606060; } QPushButton:pressed { - background-color: #007BFF; - border-color: #007BFF; + background-color: #3A3A3A; + border: 2px solid #007BFF; + padding: 5px 15px; /* Compensate for thicker border */ } -/* --- STATUSBAR (Unten) --- */ +QPushButton:disabled { + background-color: #2D2D2D; + color: #6A6A6A; + border: 1px solid #404040; +} + +QPushButton:default { + background-color: #007BFF; + color: white; + border: 1px solid #007BFF; +} + +QPushButton:default:hover { + background-color: #0069D9; + border: 1px solid #0069D9; +} + +/* --- CHECKBOXES --- */ +QCheckBox { + spacing: 8px; + color: #E0E0E0; +} + +QCheckBox::indicator { + width: 18px; + height: 18px; + border: 1px solid #4A4A4A; + border-radius: 4px; + background-color: #1E1E1E; +} + +QCheckBox::indicator:hover { + border: 1px solid #5A5A5A; + background-color: #252525; +} + +QCheckBox::indicator:checked { + background-color: #007BFF; + border: 1px solid #007BFF; + image: url(:/icons/check); +} + +QCheckBox::indicator:disabled { + background-color: #1E1E1E; + border: 1px solid #404040; +} + +/* --- RADIO BUTTONS --- */ +QRadioButton { + spacing: 8px; + color: #E0E0E0; +} + +QRadioButton::indicator { + width: 18px; + height: 18px; + border: 1px solid #4A4A4A; + border-radius: 9px; + background-color: #1E1E1E; +} + +QRadioButton::indicator:hover { + border: 1px solid #5A5A5A; + background-color: #252525; +} + +QRadioButton::indicator:checked { + background-color: #007BFF; + border: 2px solid #007BFF; +} + +QRadioButton::indicator:disabled { + background-color: #1E1E1E; + border: 1px solid #404040; +} + +/* --- COMBO BOX --- */ +QComboBox { + background-color: #1E1E1E; + color: #E0E0E0; + border: 1px solid #4A4A4A; + border-radius: 5px; + padding: 6px 8px; + min-height: 24px; +} + +QComboBox:hover { + border: 1px solid #5A5A5A; + background-color: #252525; +} + +QComboBox:focus { + border: 2px solid #007BFF; + padding: 5px 7px; /* Compensate for thicker border */ +} + +QComboBox::drop-down { + border: none; + border-left: 1px solid #404040; + width: 20px; + border-top-right-radius: 5px; + border-bottom-right-radius: 5px; +} + +QComboBox::drop-down:hover { + background-color: #3A3A3A; + border-left: 1px solid #5A5A5A; +} + +QComboBox QAbstractItemView { + background-color: #2D2D2D; + border: 1px solid #4A4A4A; + border-radius: 5px; + selection-background-color: #007BFF; + selection-color: white; +} + +/* --- PROGRESS BAR --- */ +QProgressBar { + background-color: #1E1E1E; + border: 1px solid #4A4A4A; + border-radius: 5px; + text-align: center; + color: #E0E0E0; + height: 20px; +} + +QProgressBar::chunk { + background-color: #007BFF; + border-radius: 4px; +} + +/* --- SLIDER --- */ +QSlider::groove:horizontal { + background: #1E1E1E; + height: 6px; + border-radius: 3px; + border: 1px solid #4A4A4A; +} + +QSlider::handle:horizontal { + background: #007BFF; + width: 16px; + height: 16px; + margin: -6px 0; + border-radius: 8px; + border: 2px solid #007BFF; +} + +QSlider::handle:horizontal:hover { + background: #0069D9; + border: 2px solid #0069D9; +} + +/* --- GROUP BOX --- */ +QGroupBox { + border: 1px solid #4A4A4A; + border-radius: 8px; + margin-top: 12px; + padding-top: 10px; + font-weight: 600; + color: #E0E0E0; +} + +QGroupBox::title { + color: #E0E0E0; + subcontrol-origin: margin; + subcontrol-position: top left; + padding: 0 8px; + background-color: #2D2D2D; +} + +/* --- SPLITTER --- */ +QSplitter::handle { + background-color: #4A4A4A; +} + +QSplitter::handle:hover { + background-color: #5A5A5A; +} + +QSplitter::handle:horizontal { + width: 2px; +} + +QSplitter::handle:vertical { + height: 2px; +} + +/* --- STATUS BAR --- */ QStatusBar { background-color: #2D2D2D; color: #888; - border-top: 1px solid #3A3A3A; + border-top: 1px solid #404040; +} + +QStatusBar::item { + border: none; +} + +/* --- TOOLTIPS --- */ +QToolTip { + background-color: #3A3A3A; + color: #E0E0E0; + border: 1px solid #5A5A5A; + border-radius: 5px; + padding: 4px 8px; +} + +/* --- DIALOG BUTTONS --- */ +QDialogButtonBox QPushButton { + min-width: 80px; +} + +/* --- FRAME --- */ +QFrame[frameShape="StyledPanel"], +QFrame[frameShape="Box"] { + border: 1px solid #4A4A4A; + border-radius: 6px; +} + +QFrame[frameShape="HLine"] { + border: none; + border-top: 1px solid #404040; +} + +QFrame[frameShape="VLine"] { + border: none; + border-left: 1px solid #404040; }