From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by lists.proxmox.com (Postfix) with ESMTPS id E861E911C5 for ; Fri, 10 Mar 2023 14:09:16 +0100 (CET) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id CD82720E4D for ; Fri, 10 Mar 2023 14:09:16 +0100 (CET) Received: from proxmox-new.maurer-it.com (proxmox-new.maurer-it.com [94.136.29.106]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by firstgate.proxmox.com (Proxmox) with ESMTPS for ; Fri, 10 Mar 2023 14:09:16 +0100 (CET) Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1]) by proxmox-new.maurer-it.com (Proxmox) with ESMTP id D05B746301 for ; Fri, 10 Mar 2023 14:09:15 +0100 (CET) From: Stefan Sterz To: pve-devel@lists.proxmox.com Date: Fri, 10 Mar 2023 14:08:34 +0100 Message-Id: <20230310130837.1188003-4-s.sterz@proxmox.com> X-Mailer: git-send-email 2.30.2 In-Reply-To: <20230310130837.1188003-1-s.sterz@proxmox.com> References: <20230310130837.1188003-1-s.sterz@proxmox.com> MIME-Version: 1.0 Content-Transfer-Encoding: 8bit X-SPAM-LEVEL: Spam detection results: 0 AWL -0.071 Adjusted score from AWL reputation of From: address BAYES_00 -1.9 Bayes spam probability is 0 to 1% KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record Subject: [pve-devel] [PATCH widget-toolkit 3/6] dark-theme: re-work buttons colors to appear dimmer X-BeenThere: pve-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox VE development discussion List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , X-List-Received-Date: Fri, 10 Mar 2023 13:09:16 -0000 this dims buttons further by removing pure white text color and adjusting backgrounds and border accordingly. it also keeps the help buttons brighter than other buttons to draw (possibly confused) users to them. Signed-off-by: Stefan Sterz --- src/proxmox-dark/scss/abstracts/_variables.scss | 10 +++++----- src/proxmox-dark/scss/extjs/form/_button.scss | 1 + src/proxmox-dark/scss/proxmox/_helpbutton.scss | 1 + 3 files changed, 7 insertions(+), 5 deletions(-) diff --git a/src/proxmox-dark/scss/abstracts/_variables.scss b/src/proxmox-dark/scss/abstracts/_variables.scss index 96581df..cf61ad2 100644 --- a/src/proxmox-dark/scss/abstracts/_variables.scss +++ b/src/proxmox-dark/scss/abstracts/_variables.scss @@ -28,14 +28,14 @@ $background-invalid: hsl(360deg, 60%, 30%); $background-warning: hsl(40deg, 100%, 30%); // Buttons -$neutral-button-color: hsl(0deg, 0%, 35%); -$neutral-button-color-alt: hsl(0deg, 0%, 55%); -$neutral-button-text-color: hsl(0deg, 0%, 100%); +$neutral-button-color: hsl(0deg, 0%, 25%); +$neutral-button-color-alt: hsl(0deg, 0%, 35%); +$neutral-button-text-color: hsl(0deg, 0%, 95%); $neutral-button-icon-color: $neutral-button-text-color; // Help Buttons -$help-button-color: hsl(0deg, 0%, 70%); -$help-button-color-alt: hsl(0deg, 0%, 60%); +$help-button-color: hsl(0deg, 0%, 65%); +$help-button-color-alt: hsl(0deg, 0%, 55%); $help-button-text-color: hsl(0deg, 0%, 10%); $help-button-icon-color: $help-button-text-color; diff --git a/src/proxmox-dark/scss/extjs/form/_button.scss b/src/proxmox-dark/scss/extjs/form/_button.scss index 0aa1475..bf02135 100644 --- a/src/proxmox-dark/scss/extjs/form/_button.scss +++ b/src/proxmox-dark/scss/extjs/form/_button.scss @@ -35,6 +35,7 @@ &.x-btn-over, .x-keyboard-mode &.x-btn-focus { background-color: $neutral-button-color-alt; + border-color: $neutral-button-color-alt; // the little arrow in certain toolbar buttons with dropdowns .x-btn-wrap-default-toolbar-small.x-btn-arrow-right::after, diff --git a/src/proxmox-dark/scss/proxmox/_helpbutton.scss b/src/proxmox-dark/scss/proxmox/_helpbutton.scss index aad92e2..817d6a1 100644 --- a/src/proxmox-dark/scss/proxmox/_helpbutton.scss +++ b/src/proxmox-dark/scss/proxmox/_helpbutton.scss @@ -1,6 +1,7 @@ // help buttons .proxmox-inline-button { background-color: $help-button-color; + border-color: $help-button-color-alt; color: $help-button-text-color; &.x-btn-over, -- 2.30.2