From mboxrd@z Thu Jan  1 00:00:00 1970
Return-Path: <p.hufnagl@proxmox.com>
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 2EE0198CFF
 for <pve-devel@lists.proxmox.com>; Tue, 10 Oct 2023 12:40:50 +0200 (CEST)
Received: from firstgate.proxmox.com (localhost [127.0.0.1])
 by firstgate.proxmox.com (Proxmox) with ESMTP id 16AD031746
 for <pve-devel@lists.proxmox.com>; Tue, 10 Oct 2023 12:40:50 +0200 (CEST)
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 <pve-devel@lists.proxmox.com>; Tue, 10 Oct 2023 12:40:48 +0200 (CEST)
Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1])
 by proxmox-new.maurer-it.com (Proxmox) with ESMTP id A6F52449A6
 for <pve-devel@lists.proxmox.com>; Tue, 10 Oct 2023 12:40:48 +0200 (CEST)
From: Philipp Hufnagl <p.hufnagl@proxmox.com>
To: pve-devel@lists.proxmox.com
Date: Tue, 10 Oct 2023 12:40:30 +0200
Message-Id: <20231010104034.932760-2-p.hufnagl@proxmox.com>
X-Mailer: git-send-email 2.39.2
In-Reply-To: <20231010104034.932760-1-p.hufnagl@proxmox.com>
References: <20231010104034.932760-1-p.hufnagl@proxmox.com>
MIME-Version: 1.0
Content-Transfer-Encoding: 8bit
X-SPAM-LEVEL: Spam detection results:  0
 AWL -0.082 Adjusted score from AWL reputation of From: address
 BAYES_00                 -1.9 Bayes spam probability is 0 to 1%
 DMARC_MISSING             0.1 Missing DMARC policy
 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 proxmox-widget-toolkit v2 1/3] fix #4546: css:
 create a new css class for warning texts
X-BeenThere: pve-devel@lists.proxmox.com
X-Mailman-Version: 2.1.29
Precedence: list
List-Id: Proxmox VE development discussion <pve-devel.lists.proxmox.com>
List-Unsubscribe: <https://lists.proxmox.com/cgi-bin/mailman/options/pve-devel>, 
 <mailto:pve-devel-request@lists.proxmox.com?subject=unsubscribe>
List-Archive: <http://lists.proxmox.com/pipermail/pve-devel/>
List-Post: <mailto:pve-devel@lists.proxmox.com>
List-Help: <mailto:pve-devel-request@lists.proxmox.com?subject=help>
List-Subscribe: <https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel>, 
 <mailto:pve-devel-request@lists.proxmox.com?subject=subscribe>
X-List-Received-Date: Tue, 10 Oct 2023 10:40:50 -0000

Creates a new css class 'text-color-warning' for the dark theme, which
will be used to propperly show a warning icon later. For this purpose
the 'pwt-gauge-warn' color is extracted in a variable and reused. Also
the variable 'pwd-gauge-crit' has been extracted for consistency.

Signed-off-by: Philipp Hufnagl <p.hufnagl@proxmox.com>
---
 .../scss/abstracts/_variables.scss            | 20 ++++++++++---------
 src/proxmox-dark/scss/extjs/_menu.scss        |  4 ++++
 src/proxmox-dark/scss/other/_charts.scss      |  4 ++--
 3 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/proxmox-dark/scss/abstracts/_variables.scss b/src/proxmox-dark/scss/abstracts/_variables.scss
index cac51eb..cf7cda4 100644
--- a/src/proxmox-dark/scss/abstracts/_variables.scss
+++ b/src/proxmox-dark/scss/abstracts/_variables.scss
@@ -8,9 +8,20 @@ $highlighted-text: hsl(205deg, 100%, 65%);
 $highlighted-text-alt: hsl(205deg, 100%, 80%);
 $highlighted-text-crit: hsl(360deg, 100%, 65%);
 
+// Backgrounds
+$content-background-color: hsl(0deg, 0%, 20%);
+$content-background-selected: hsl(0deg, 0%, 30%);
+$background-dark: hsl(0deg, 0%, 20%);
+$background-darker: hsl(0deg, 0%, 15%);
+$background-darkest: hsl(0deg, 0%, 10%);
+$background-invalid: hsl(360deg, 60%, 20%);
+$background-warning: hsl(40deg, 100%, 20%);
+
 // Icon and Text colors
 $text-color: hsl(0deg, 0%, 95%);
 $text-color-inactive: hsl(0deg, 0%, 60%);
+$text-color-warning: adjust-color($background-warning, $lightness: lightness($primary-color));
+$text-color-invalid: adjust-color($background-invalid, $lightness: lightness($primary-color));
 $icon-color: hsl(0deg, 0%, 90%);
 $icon-color-alt: hsl(0deg, 0%, 55%);
 
@@ -18,15 +29,6 @@ $icon-color-alt: hsl(0deg, 0%, 55%);
 $border-color: hsl(0deg, 0%, 40%);
 $border-color-alt: hsl(0deg, 0%, 25%);
 
-// Backgrounds
-$content-background-color: hsl(0deg, 0%, 20%);
-$content-background-selected: hsl(0deg, 0%, 30%);
-$background-dark: hsl(0deg, 0%, 20%);
-$background-darker: hsl(0deg, 0%, 15%);
-$background-darkest: hsl(0deg, 0%, 10%);
-$background-invalid: hsl(360deg, 60%, 20%);
-$background-warning: hsl(40deg, 100%, 20%);
-
 // Buttons
 $neutral-button-color: hsl(0deg, 0%, 25%);
 $neutral-button-color-alt: hsl(0deg, 0%, 35%);
diff --git a/src/proxmox-dark/scss/extjs/_menu.scss b/src/proxmox-dark/scss/extjs/_menu.scss
index 2983f60..aa51260 100644
--- a/src/proxmox-dark/scss/extjs/_menu.scss
+++ b/src/proxmox-dark/scss/extjs/_menu.scss
@@ -33,6 +33,10 @@
   color: $icon-color;
 }
 
+.x-menu-item-icon-default.warning {
+  color: $text-color-warning;
+}
+
 // Vertical divider (e.g. in UserInfo between icons and text)
 .x-menu-icon-separator-default {
   background-color: $background-dark;
diff --git a/src/proxmox-dark/scss/other/_charts.scss b/src/proxmox-dark/scss/other/_charts.scss
index 26b0104..a3a5b12 100644
--- a/src/proxmox-dark/scss/other/_charts.scss
+++ b/src/proxmox-dark/scss/other/_charts.scss
@@ -7,8 +7,8 @@
   --pwt-text-color: #{$text-color};
   --pwt-gauge-default: #{$primary-color};
   --pwt-gauge-back: #{$background-dark};
-  --pwt-gauge-warn: #{adjust-color($background-warning, $lightness: lightness($primary-color))};
-  --pwt-gauge-crit: #{adjust-color($background-invalid, $lightness: lightness($primary-color))};
+  --pwt-gauge-warn: #{$text-color-warning};
+  --pwt-gauge-crit: #{$text-color-invalid};
   --pwt-chart-primary: #{$primary-color};
   --pwt-chart-grid-stroke: #{$content-background-selected};
 }
-- 
2.39.2