From 33ae0adda59810a85b00dd7af7e1ec8125043e21 Mon Sep 17 00:00:00 2001
From: Maxime Jacquemin <maxime.jacquemin@cea.fr>
Date: Wed, 26 Jan 2022 16:55:55 +0100
Subject: [PATCH] Unified handling of inactive window
We simply modify the opacity of all the components when the window is
inactive. No need of special CSS for each component.
---
ivette/src/dome/renderer/controls/style.css | 4 +-
ivette/src/dome/renderer/frame/style.css | 90 +++++----------------
ivette/src/dome/renderer/layout/style.css | 10 +--
ivette/src/dome/renderer/style.css | 16 +---
ivette/src/dome/renderer/table/style.css | 6 +-
ivette/src/renderer/style.css | 2 +-
6 files changed, 27 insertions(+), 101 deletions(-)
diff --git a/ivette/src/dome/renderer/controls/style.css b/ivette/src/dome/renderer/controls/style.css
index a7c192a15d4..b98f47eef0c 100644
--- a/ivette/src/dome/renderer/controls/style.css
+++ b/ivette/src/dome/renderer/controls/style.css
@@ -48,7 +48,6 @@
background: #777 ;
}
-.dome-window-inactive .dome-xBadge,
.dome-disabled .dome-xBadge
{
background: #ccc ;
@@ -112,8 +111,7 @@
}
.dome-xButton:disabled,
-.dome-xButton:active:disabled,
-.dome-window-inactive .dome-xButton
+.dome-xButton:active:disabled
{
fill: #b0b0b0 ;
border-color: #ccc ;
diff --git a/ivette/src/dome/renderer/frame/style.css b/ivette/src/dome/renderer/frame/style.css
index 4e20866b172..e00b12bc98c 100644
--- a/ivette/src/dome/renderer/frame/style.css
+++ b/ivette/src/dome/renderer/frame/style.css
@@ -38,11 +38,6 @@
border-right-style: solid ;
}
-.dome-window-inactive .dome-xTab.dome-inactive {
- color: #606060 ;
- border-color: inherit ;
-}
-
.dome-xTab.dome-inactive:hover {
background: #bababa ;
}
@@ -53,11 +48,6 @@
background: #b4b4b4 ;
}
-.dome-window-inactive .dome-xTab.dome-inactive {
- color: #b0b0b0 ;
- background: #e6e6e6 ;
-}
-
/* Closing Tab button */
.dome-xTab-closing {
@@ -107,8 +97,8 @@
padding: 0px ;
}
-.dome-window-active .dome-xSideBar.dome-color-frame,
-.dome-window-active .dome-xSideBarSection-title.dome-color-frame
+.dome-xSideBar.dome-color-frame,
+.dome-xSideBarSection-title.dome-color-frame
{
background: #e3e8ec ;
}
@@ -177,14 +167,10 @@
scroll-margin-top: 30px;
}
-.dome-window-active .dome-xSideBarItem.dome-active {
+.dome-xSideBarItem.dome-active {
background: #ccc ;
}
-.dome-window-inactive .dome-xSideBarItem.dome-active {
- background: #ddd ;
-}
-
.dome-xSideBarItem > .dome-xLabel {
flex: 1 1 ;
overflow: hidden ;
@@ -258,14 +244,10 @@
height: 18px ;
}
-.dome-window-active .dome-xToolBar-vrule {
+.dome-xToolBar-vrule {
background: #aaa ;
}
-.dome-window-inactive .dome-xToolBar-vrule {
- background: #ddd ;
-}
-
/* -------------------------------------------------------------------------- */
/* --- Styling ToolBar Buttons --- */
/* -------------------------------------------------------------------------- */
@@ -294,61 +276,57 @@
/* Background */
-.dome-window-active .dome-xToolBar-control {
+.dome-xToolBar-control {
background-image: linear-gradient(to bottom, #e8e8e8 0, #f1f1f1 100%);
+ border-color: #bbb;
}
-.dome-window-active .dome-xToolBar-control:hover:not(:disabled) {
+.dome-xToolBar-control:hover:not(:disabled) {
background-color: #ffffff ;
background-image: none ;
}
-.dome-window-active .dome-xToolBar-control.dome-xToolBar-positive:not(:disabled) {
+.dome-xToolBar-control.dome-xToolBar-positive:not(:disabled) {
background-image: linear-gradient(to bottom, #34ff52 0%, #48fd64 100%);
}
-.dome-window-active .dome-xToolBar-control.dome-xToolBar-positive:hover:not(:disabled) {
+.dome-xToolBar-control.dome-xToolBar-positive:hover:not(:disabled) {
background-color: #00ff00 ;
background-image: none ;
}
-.dome-window-active .dome-xToolBar-control.dome-xToolBar-negative:not(:disabled) {
+.dome-xToolBar-control.dome-xToolBar-negative:not(:disabled) {
color: #ccc ;
fill: #ccc ;
background-image: linear-gradient(to bottom, #ec453e 0%, #ff4c47 100%);
}
-.dome-window-active .dome-xToolBar-control.dome-xToolBar-negative:hover:not(:disabled) {
+.dome-xToolBar-control.dome-xToolBar-negative:hover:not(:disabled) {
background-color: red ;
background-image: none ;
}
-.dome-window-active .dome-xToolBar-control.dome-xToolBar-warning:not(:disabled) {
+.dome-xToolBar-control.dome-xToolBar-warning:not(:disabled) {
background-image: linear-gradient(to bottom, #fece72 0%, #fcaa0e 100%);
}
-.dome-window-active .dome-xToolBar-control.dome-xToolBar-warning:hover:not(:disabled) {
+.dome-xToolBar-control.dome-xToolBar-warning:hover:not(:disabled) {
background-color: orange ;
background-image: none ;
}
-.dome-window-active .dome-xToolBar-control.dome-xToolBar-cancel:not(:disabled) {
+.dome-xToolBar-control.dome-xToolBar-cancel:not(:disabled) {
background-color: #c2c0c2 ;
background-image: none ;
}
-.dome-window-active .dome-xToolBar-control.dome-xToolBar-cancel:hover:not(:disabled) {
+.dome-xToolBar-control.dome-xToolBar-cancel:hover:not(:disabled) {
background-image: linear-gradient(to bottom, #e8e8e8 0, #f1f1f1 100%);
}
-.dome-window-inactive .dome-xToolBar-control {
- box-shadow: none ;
- background-image: none ;
-}
-
/* Activated */
-.dome-window-active .dome-xToolBar-control:active:not(:disabled) {
+.dome-xToolBar-control:active:not(:disabled) {
fill: #ddd ;
color: #ddd ;
background-color: gray ;
@@ -357,21 +335,15 @@
/* Disabled */
-.dome-window-active .dome-xToolBar-control:disabled {
+.dome-xToolBar-control:disabled {
fill: #ccc ;
color: #ccc ;
box-shadow: none ;
- border-color: #bbb ;
-}
-
-.dome-window-inactive .dome-xToolBar-control:disabled {
- fill: #ccc ;
- color: #ccc ;
}
/* Selected */
-.dome-window-active .dome-xToolBar-control.dome-selected {
+.dome-xToolBar-control.dome-selected {
fill: #fff;
color: #fff;
border: 1px solid transparent ;
@@ -379,33 +351,20 @@
background-image: none ;
}
-.dome-window-active .dome-xToolBar-control.dome-selected:hover {
+.dome-xToolBar-control.dome-selected:hover {
background-color: #888 ;
background-image: none ;
}
-.dome-window-inactive .dome-xToolBar-control.dome-selected:not(:disabled) {
- fill: #eee;
- color: #eee;
- background-color: #ccc ;
-}
-
/* Selected & Disabled */
-.dome-window-active .dome-xToolBar-control.dome-selected:disabled {
+.dome-xToolBar-control.dome-selected:disabled {
fill: #ccc ;
color: #ccc ;
border: 1px solid #bbb ;
background-color: #ddd ;
}
-.dome-window-inactive .dome-xToolBar-control.dome-selected:disabled {
- fill: #ccc ;
- color: #ccc ;
- border-color: #ddd ;
- background-color: #ddd ;
-}
-
/* -------------------------------------------------------------------------- */
/* --- Styling ToolBar Button Group --- */
/* -------------------------------------------------------------------------- */
@@ -459,11 +418,6 @@
transition: width 0.4s ease-in-out ;
}
-.dome-window-inactive .dome-xToolBar-control.dome-xToolBar-searchfield {
- background-color: #f6f6f6 ;
- border-color: #ddd ;
-}
-
.dome-xToolBar-searchfield:focus,
.dome-xToolBar-searchfield:hover,
.dome-xToolBar-searchicon:hover + .dome-xToolBar-searchfield
@@ -481,10 +435,6 @@
left: 12px ;
}
-.dome-window-inactive .dome-xToolBar-searchicon svg {
- fill: #ccc ;
-}
-
.dome-xToolBar-searchmenu {
position: relative ;
width: 162px ;
diff --git a/ivette/src/dome/renderer/layout/style.css b/ivette/src/dome/renderer/layout/style.css
index cdfc2ac1e86..e90f9f94263 100644
--- a/ivette/src/dome/renderer/layout/style.css
+++ b/ivette/src/dome/renderer/layout/style.css
@@ -185,18 +185,12 @@
.dome-xSplitter-vpos-R { position: absolute; height: 1px; width: 100% }
.dome-xSplitter-vpos-B { position: absolute; bottom: 0px; width: 100% }
-.dome-window-active .dome-xSplitter-hline,
-.dome-window-active .dome-xSplitter-vline
+.dome-xSplitter-hline,
+.dome-xSplitter-vline
{
background: #afafaf ;
}
-.dome-window-inactive .dome-xSplitter-hline,
-.dome-window-inactive .dome-xSplitter-vline
-{
- background: #d6d6d6 ;
-}
-
/* -------------------------------------------------------------------------- */
/* --- GridLayout Styles --- */
/* -------------------------------------------------------------------------- */
diff --git a/ivette/src/dome/renderer/style.css b/ivette/src/dome/renderer/style.css
index 258fc4e47c1..ad13efbfe64 100644
--- a/ivette/src/dome/renderer/style.css
+++ b/ivette/src/dome/renderer/style.css
@@ -39,31 +39,19 @@ body {
visibility: hidden;
}
-.dome-window-active .dome-color-frame {
+.dome-color-frame {
fill: #606060 ;
color: #606060 ;
border-color: #afafaf ;
background: #d8d8d8 ;
}
-.dome-window-inactive .dome-color-frame {
- fill: #b0b0b0 ;
- color: #b0b0b0 ;
- border-color: #d6d6d6 ;
- background: #f6f6f6 ;
-}
-
-.dome-window-active .dome-color-selected {
+.dome-color-selected {
border-color: #e8e8e8 ;
background: #ff9504 ;
color: #ffffff ;
}
-.dome-window-inactive .dome-color-selected {
- border-color: #e8e8e8 ;
- background: #d8d8d8 ;
-}
-
.dome-color-dragzone {
opacity: 0.0 ;
background: transparent ;
diff --git a/ivette/src/dome/renderer/table/style.css b/ivette/src/dome/renderer/table/style.css
index aefbe542e53..23c95182929 100644
--- a/ivette/src/dome/renderer/table/style.css
+++ b/ivette/src/dome/renderer/table/style.css
@@ -100,14 +100,10 @@
vertical-align: baseline ;
}
-.dome-window-active .dome-xTable-selected {
+.dome-xTable-selected {
background: #8ce0fb ;
}
-.dome-window-inactive .dome-xTable-selected {
- background: #ccc ;
-}
-
.dome-xTable-odd {
background: #fdfdfd ;
}
diff --git a/ivette/src/renderer/style.css b/ivette/src/renderer/style.css
index fa02656e599..298e1b2d81b 100644
--- a/ivette/src/renderer/style.css
+++ b/ivette/src/renderer/style.css
@@ -62,7 +62,7 @@
fill: red ;
}
-.dome-window-active .labview-icon {
+.labview-icon {
fill: #7d7d7d ;
}
--
GitLab