@eclipse-scout/core/src/desktop/header/DesktopHeader.less

Eclipse Scout runtime

/*
 * Copyright (c) 2010, 2023 BSI Business Systems Integration AG
 *
 * This program and the accompanying materials are made
 * available under the terms of the Eclipse Public License 2.0
 * which is available at https://www.eclipse.org/legal/epl-2.0/
 *
 * SPDX-License-Identifier: EPL-2.0
 */
.desktop-header {
  position: absolute;
  top: 0;
  height: @desktop-header-height;
  color: @desktop-header-color;
  background-color: @desktop-header-background-color;

  & > .simple-tab-area {
    height: @desktop-header-height;

    & > .desktop-tab.selected {

      .navigation-invisible > & > .edge.left {
        display: block;
      }
    }
  }

  .navigation-invisible > &:not(.has-view-button-box) > .simple-tab-area {
    margin-left: 6px;
  }

  &.animate-remove {
    #scout.animation-name(slideout-right);
    #scout.animation-duration(0.5s);
  }

  & > .view-button-box {

    & > .view-tab-wrapper > .view-tab {
      &.animate-bring-to-front,
      &.animate-bring-to-back {
        animation-duration: 0s;
      }
    }

    .in-background& {

      & > .view-menu-tab {
        &.selected {
          background-color: @view-menu-tab-background-color;
          color: inherit;
        }

        & > .view-button,
        & > .view-menu {
          &:hover {
            background-color: @view-menu-tab-hover-background-color;
          }
        }

        & > .view-menu {
          &::before {
            height: 100%;
            border-color: @desktop-header-background-color;
            top: 0;
          }

          &:hover > .icon {
            background-color: transparent;
          }

          &.selected {
            background-color: @view-menu-tab-menu-selected-background-color;

            & > .icon {
              background-color: transparent;
            }
          }
        }
      }

      & > .view-tab-wrapper > .view-tab {
        &.selected {
          color: inherit;
          background-color: transparent;
        }

        &:hover {
          background-color: @view-tab-hover-background-color;
        }

        &.disabled {
          background-color: transparent;
        }
      }
    }
  }

  &:not(.in-background) > .view-button-box {

    & > .view-tab-wrapper > .view-tab,
    & > .view-menu-tab {
      &.selected {
        .outline-content-has-dimmed-background& {
          background-color: @dimmed-background-color;

          & > .edge {
            --color: @dimmed-background-color;
          }
        }
      }
    }
  }
}