@eclipse-scout/core 22.0.0-beta.1 → 22.0.0

package/dist/eclipse-scout-core-theme.css

@@ -439,10 +439,10 @@ button::-moz-focus-inner {
   pointer-events: none;
 }
 .application-loading-root.fadeout {
-  -webkit-animation: application-loading-fade-out 250ms linear 1;
-  -moz-animation: application-loading-fade-out 250ms linear 1;
-  -o-animation: application-loading-fade-out 250ms linear 1;
-  animation: application-loading-fade-out 250ms linear 1;
+  -webkit-animation: application-loading-fade-out 250ms linear 1 forwards;
+  -moz-animation: application-loading-fade-out 250ms linear 1 forwards;
+  -o-animation: application-loading-fade-out 250ms linear 1 forwards;
+  animation: application-loading-fade-out 250ms linear 1 forwards;
 }
 @-webkit-keyframes application-loading-fade-out {
   to {
@@ -2892,6 +2892,15 @@ iframe {
 .desktop-tab.simple-tab:active > .title-line > .title {
   color: inherit;
 }
+.desktop-tab.simple-tab.glasspane-parent {
+  pointer-events: unset;
+}
+.desktop-tab.simple-tab.glasspane-parent:not(.disabled):not(.selected):hover {
+  background-color: rgba(0, 0, 0, 0.1);
+}
+.desktop-tab.simple-tab.glasspane-parent:not(.selected):hover > .closer {
+  display: none;
+}
 .desktop-tab.simple-tab.disabled {
   background-color: transparent;
 }
@@ -3532,10 +3541,6 @@ iframe {
  * Contributors:
  *     BSI Business Systems Integration AG - initial API and implementation
  */
-.outline.tree.in-background > .tree-data > .tree-node.selected {
-  background-color: #808080;
-  color: #fff;
-}
 .outline.tree > .tree-data {
   padding-top: 16px;
 }
@@ -3612,6 +3617,15 @@ iframe {
 .outline.tree > .tree-data > .animation-wrapper > .tree-node.selected > .font-icon {
   color: rgba(255, 255, 255, 0.7);
 }
+.outline.tree.in-background > .tree-data > .tree-node.group,
+.outline.tree.in-background > .tree-data > .animation-wrapper > .tree-node.group {
+  background-color: #e8e8e8;
+}
+.outline.tree.in-background > .tree-data > .tree-node.selected,
+.outline.tree.in-background > .tree-data > .animation-wrapper > .tree-node.selected {
+  background-color: #808080;
+  color: #fff;
+}
 .outline-title {
   cursor: pointer;
   color: #1561A7;
@@ -5909,7 +5923,7 @@ iframe {
   height: 100%;
 }
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -6043,6 +6057,7 @@ iframe {
   display: inline-block;
   vertical-align: middle;
   padding: 12px 0 12px 0;
+  max-width: 100%;
 }
 .group-box.has-sub-label > .group-box-header > .title {
   padding-bottom: 7px;
@@ -6058,6 +6073,8 @@ iframe {
   font-size: 11px;
   letter-spacing: 0.2px;
   color: #666666;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 .group-box-header > .status {
   position: absolute;
@@ -8498,10 +8515,10 @@ iframe {
 .combo-menu:hover {
   background-color: transparent;
 }
-.combo-menu > .menu-item:not(:first-child) {
+.combo-menu > .menu-item:not(.first) {
   margin-left: 3px;
 }
-.combo-menu > .menu-item:not(:first-child)::before {
+.combo-menu > .menu-item:not(.first)::before {
   content: '';
   position: absolute;
   left: -1px;
@@ -8510,8 +8527,13 @@ iframe {
   width: 1px;
   background-color: #DADADA;
 }
-.combo-menu:not(.disabled).child-selected > .menu-item:not(:first-child)::before,
-.combo-menu:not(.disabled):hover > .menu-item:not(:first-child)::before {
+.combo-menu > .menu-item:focus::before {
+  display: none;
+}
+.combo-menu > .menu-item:not(.disabled):hover::before,
+.combo-menu > .menu-item.selected::before,
+.combo-menu > .menu-item:not(.disabled):hover ~ .menu-item::before,
+.combo-menu > .menu-item.selected ~ .menu-item::before {
   display: none;
 }
 .combo-menu.menu-button {
@@ -8519,13 +8541,17 @@ iframe {
 }
 .combo-menu.menu-button > .menu-item {
   border: 1px solid #1561A7;
+  flex-grow: 1;
+}
+.combo-menu.menu-button > .menu-item.menu-icononly:not(.first.last) {
+  flex-grow: 0;
 }
-.combo-menu.menu-button > .menu-item:not(:last-child) {
+.combo-menu.menu-button > .menu-item:not(.last) {
   border-top-right-radius: 0;
   border-bottom-right-radius: 0;
   border-right: 0;
 }
-.combo-menu.menu-button > .menu-item:not(:first-child) {
+.combo-menu.menu-button > .menu-item:not(.first) {
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
   border-left: 0;
@@ -8534,6 +8560,9 @@ iframe {
 .disabled.combo-menu.menu-button > .menu-item {
   border-color: #808080;
 }
+.combo-menu.menu-button > .menu-item:focus {
+  z-index: 1;
+}
 .combo-menu.menu-button.default > .menu-item {
   background-color: #1561A7;
   /* border is necessary to align the text with text from buttons with a real border */
@@ -8560,20 +8589,47 @@ iframe {
   box-shadow: 0 0 0 3px #93c5f4;
   border-color: #64adf0;
 }
+.combo-menu.menu-button.default > .menu-item::before {
+  background-color: #DADADA;
+}
 .combo-menu.menu-button.default > .menu-item.selected {
   background-color: #012c53;
   border-color: #012c53;
 }
+.combo-menu.menu-button.default > .menu-item.disabled {
+  color: rgba(255, 255, 255, 0.4);
+}
+.combo-menu.menu-button.default > .menu-item.disabled:hover,
+.combo-menu.menu-button.default > .menu-item.disabled.active,
+.combo-menu.menu-button.default > .menu-item.disabled:active,
+.combo-menu.menu-button.default > .menu-item.disabled.selected {
+  background-color: #1561A7;
+  border-color: #1561A7;
+}
 .context-menu > .combo-menu {
   padding: 0;
 }
 .context-menu > .combo-menu > .menu-item {
   color: #000;
-  padding-top: 8px;
-  padding-bottom: 8px;
+  padding: 8px 16px 8px 16px;
+  flex-grow: 1;
+  justify-content: start;
+  border-radius: 0;
 }
-.context-menu > .combo-menu > .menu-item:first-child {
-  margin-left: 6px;
+.context-menu > .combo-menu > .menu-item > .font-icon {
+  color: #1561A7;
+}
+.context-menu > .combo-menu > .menu-item.menu-textandicon > .icon {
+  margin-right: 14px;
+}
+.context-menu > .combo-menu > .menu-item.menu-icononly:not(.first.last) {
+  flex-grow: 0;
+}
+.context-menu > .combo-menu > .menu-item.disabled {
+  color: #808080;
+}
+.context-menu > .combo-menu > .menu-item.disabled > .font-icon {
+  color: #808080;
 }
 /*
  * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
@@ -11806,7 +11862,7 @@ Try these to switch between fonts:
   background-color: rgba(255, 255, 255, 0.15);
 }
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -11931,7 +11987,7 @@ Try these to switch between fonts:
   border-color: #fff;
 }
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -12023,18 +12079,24 @@ Try these to switch between fonts:
   background-color: inherit;
 }
 .table > .filter-field {
-  --filter-field-max-bottom: calc(50% -  (30px + var(--controls-height)) / 2);
+  --filter-field-max-bottom: calc(50% -  (var(--filter-field-height) + var(--controls-height)) / 2);
 }
 .table > .filter-field:not(.focused).empty {
   --filter-field-max-bottom: calc(50% -  (24px + var(--controls-height)) / 2);
 }
 .has-menubar.menubar-bottom.table > .filter-field {
-  --filter-field-max-bottom: calc(50% -  (30px + var(--controls-height)) / 2);
+  --filter-field-max-bottom: calc(50% -  (var(--filter-field-height) + var(--controls-height)) / 2);
   bottom: calc(min(var(--filter-field-bottom), var(--filter-field-max-bottom)) + var(--menubar-height));
 }
 .has-menubar.menubar-bottom.table > .filter-field:not(.focused).empty {
   --filter-field-max-bottom: calc(50% -  (24px + var(--controls-height)) / 2);
 }
+.has-cell-editor-popup.table > .filter-field {
+  opacity: 0;
+  visibility: hidden;
+  --filter-field-opacity-transition-delay: 0s;
+  --filter-field-visibility-transition-delay: calc(250ms + var(--filter-field-opacity-transition-delay));
+}
 .table-data {
   position: relative;
   overflow: hidden;
@@ -13703,10 +13765,6 @@ Try these to switch between fonts:
   max-width: 300px;
   white-space: normal;
 }
-.tooltip.has-menus {
-  padding-top: 6px;
-  padding-bottom: 6px;
-}
 .tooltip-content {
   padding: 8px 12px;
   position: relative;
@@ -13722,6 +13780,7 @@ Try these to switch between fonts:
   font-weight: bold;
   padding-left: 16px;
   padding-right: 16px;
+  padding-top: 14px;
 }
 .tooltip-content .small {
   font-size: 11px;
@@ -13733,6 +13792,11 @@ Try these to switch between fonts:
 }
 .tooltip-menus {
   position: relative;
+  background-color: inherit;
+  padding-bottom: 6px;
+}
+.no-text > .tooltip-menus {
+  padding-top: 6px;
 }
 .tooltip-menus > .menu-item {
   display: flex;
@@ -13821,7 +13885,7 @@ Try these to switch between fonts:
   position: relative;
 }
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -13850,7 +13914,7 @@ Try these to switch between fonts:
   border-color: #1561A7;
 }
 .tree > .filter-field {
-  --filter-field-max-bottom: calc(50% -  (30px + var(--menubar-height)) / 2);
+  --filter-field-max-bottom: calc(50% -  (var(--filter-field-height) + var(--menubar-height)) / 2);
   bottom: calc(min(var(--filter-field-bottom), var(--filter-field-max-bottom)) + var(--menubar-height));
 }
 .tree > .filter-field:not(.focused).empty {
@@ -14998,7 +15062,7 @@ Try these to switch between fonts:
   color: #fff;
 }
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -15009,11 +15073,12 @@ Try these to switch between fonts:
  */
 .filter-field {
   position: absolute;
-  --filter-field-bottom: 6px;
-  --filter-field-max-bottom: calc(50% -  30px / 2);
+  --filter-field-height: 30px;
+  --filter-field-bottom: 8px;
+  --filter-field-max-bottom: calc(50% -  var(--filter-field-height) / 2);
   bottom: min(var(--filter-field-bottom), var(--filter-field-max-bottom));
-  right: 6px;
-  height: 30px;
+  right: 8px;
+  height: var(--filter-field-height);
   width: 190px;
   min-width: 75px;
   max-width: 60%;
@@ -15024,10 +15089,16 @@ Try these to switch between fonts:
   box-shadow: 0px 6px 13px 0px rgba(0, 0, 0, 0.2);
   background-color: var(--filter-field-background-color);
   opacity: 1;
-  transition: bottom 250ms ease-in-out, right 250ms ease-in-out, height 250ms ease-in-out, width 250ms ease-in-out, min-width 250ms ease-in-out, max-width 250ms ease-in-out, box-shadow 250ms ease-in-out, opacity 250ms ease-in-out;
+  visibility: visible;
+  --filter-field-opacity-transition-delay: 100ms;
+  --filter-field-visibility-transition-delay: var(--filter-field-opacity-transition-delay);
+  transition: bottom 250ms ease-in-out, right 250ms ease-in-out, height 250ms ease-in-out, width 250ms ease-in-out, min-width 250ms ease-in-out, max-width 250ms ease-in-out, box-shadow 250ms ease-in-out, opacity 250ms ease-in-out var(--filter-field-opacity-transition-delay), visibility 0s var(--filter-field-visibility-transition-delay);
 }
 :not(:hover) > .filter-field:not(.focused):not(.focus-inside-widget).empty {
   opacity: 0;
+  visibility: hidden;
+  --filter-field-opacity-transition-delay: 0s;
+  --filter-field-visibility-transition-delay: calc(250ms + var(--filter-field-opacity-transition-delay));
 }
 .filter-field::before {
   content: '\E02A';
@@ -15041,7 +15112,7 @@ Try these to switch between fonts:
   justify-content: center;
   align-items: center;
   position: absolute;
-  bottom: 3px;
+  bottom: calc((var(--filter-field-height) - 24px) / 2);
   right: 3px;
   height: 24px;
   width: 24px;
@@ -15077,19 +15148,19 @@ Try these to switch between fonts:
   top: calc(50% -  22px / 2) !important;
 }
 .filter-field:not(.focused).empty {
-  --filter-field-bottom: 6px + ((30px - 24px) / 2);
+  --filter-field-bottom: 8px + ((var(--filter-field-height) - 24px) / 2);
   --filter-field-max-bottom: calc(50% -  24px / 2);
-  right: 9px;
+  right: 11px;
   height: 24px;
   width: 24px;
   min-width: 24px;
   max-width: 24px;
   box-shadow: none;
-  background-color: var(--filter-field-background-color);
+  background-color: var(--filter-field-transparent-80-background-color);
 }
 @supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
   .filter-field:not(.focused).empty {
-    background-color: var(--filter-field-transparent-background-color);
+    background-color: var(--filter-field-transparent-50-background-color);
     -webkit-backdrop-filter: blur(2px);
     backdrop-filter: blur(2px);
   }
@@ -15114,10 +15185,11 @@ Try these to switch between fonts:
 }
 .filter-field-container {
   position: sticky;
-  --filter-field-container-top: calc(100% -  6px);
-  --filter-field-container-min-top: calc(50% +  30px / 2);
+  --filter-field-height: 30px;
+  --filter-field-container-top: calc(100% -  8px);
+  --filter-field-container-min-top: calc(50% +  var(--filter-field-height) / 2);
   top: max(var(--filter-field-container-top), var(--filter-field-container-min-top));
-  left: calc(100% -  6px);
+  left: calc(100% -  8px);
   width: 0;
   height: 0;
   overflow: visible;
@@ -15126,6 +15198,9 @@ Try these to switch between fonts:
 }
 .filter-field-container:not(:hover) > .filter-field:not(.focused):not(.focus-inside-widget).empty {
   opacity: 1;
+  visibility: visible;
+  --filter-field-opacity-transition-delay: 100ms;
+  --filter-field-visibility-transition-delay: var(--filter-field-opacity-transition-delay);
 }
 .filter-field-container > .filter-field {
   bottom: 0;
@@ -15134,9 +15209,12 @@ Try these to switch between fonts:
 }
 :not(:hover) > .filter-field-container > .filter-field:not(.focused):not(.focus-inside-widget).empty {
   opacity: 0;
+  visibility: hidden;
+  --filter-field-opacity-transition-delay: 0s;
+  --filter-field-visibility-transition-delay: calc(250ms + var(--filter-field-opacity-transition-delay));
 }
 .filter-field-container > .filter-field:not(.focused).empty {
-  bottom: 3px;
+  bottom: calc((var(--filter-field-height) - 24px) / 2);
   right: 3px;
 }
 @supports not (bottom: min(50%, 42px)) {
@@ -15146,8 +15224,12 @@ Try these to switch between fonts:
     /* NOSONAR (!important is okay here) */
   }
 }
+.dense .filter-field,
+.dense .filter-field-container {
+  --filter-field-height: 24px;
+}
 /*
- * Copyright (c) 2010-2021 BSI Business Systems Integration AG.
+ * Copyright (c) 2010-2022 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials
  * are made available under the terms of the Eclipse Public License v1.0
  * which accompanies this distribution, and is available at
@@ -15221,6 +15303,13 @@ Try these to switch between fonts:
   height: 18px;
   vertical-align: middle;
 }
+.login-body > .box-background-elements.box-background-elements-fadeout,
+.logout-body > .box-background-elements.box-background-elements-fadeout {
+  -webkit-animation: nop 0.05s;
+  -moz-animation: nop 0.05s;
+  -o-animation: nop 0.05s;
+  animation: nop 0.05s;
+}
 /*
  * Copyright (c) 2010-2020 BSI Business Systems Integration AG.
  * All rights reserved. This program and the accompanying materials