@eclipse-scout/core/src/popup/MobilePopup.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
 */
.mobile-popup {
  background-color: @popup-background-color;
  border: @popup-border-width solid @popup-border-color;
  border-top-left-radius: @popup-border-radius;
  border-top-right-radius: @popup-border-radius;
  overflow: hidden;
  margin-top: 30px;
  #scout.drop-shadow(@x: 0, @y: 0, @blur: 30px, @spread: 5px, @alpha: 0.5);

  &.animate-open {
    #scout.animation-name(slidein-bottom);
    #scout.animation-duration(0.5s);
  }

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

.mobile-popup-header {
  position: absolute;
  width: 100%;

  padding-top: @mobile-popup-title-margin-top;
  padding-left: 20px;

  & > .title {
    #scout.overflow-ellipsis-nowrap();
    #scout.font-text-large();
    width: 100%;
  }

  & > .closer {
    position: absolute;
    top: 6px;
    right: 6px;
    padding: 7px;
    z-index: 1;
    border-radius: @closer-border-radius;

    &::before {
      display: none;
    }
  }

  .mobile-popup.closable > & > .title {
    margin-right: @mobile-popup-title-margin-right;
    width: calc(~'100% - ' @mobile-popup-title-margin-right);
  }
}

.mobile-popup-widget {
  position: relative;
}