hawkbit/hawkbit-ui/src/main/resources/VAADIN/themes/hawkbit/customstyles/footer-common.scss

/**
 * Copyright (c) 2015 Bosch Software Innovations GmbH and others.
 *
 * 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
 * http://www.eclipse.org/legal/epl-v10.html
 */
// scss-lint:disable ImportantRule, PropertySortOrder

@mixin footer-common {

  //Footer drop to delete layout - icon style
  .delete-icon {
    .v-icon {
      color: $signal-red-color !important;
    }
  }

  .no-border {
    border: 0px !important;
  }

  //Style applied on all buttons of footer layout.Width and height of buttons can be configured
  .action-button {
    @include valo-gradient($color: $footer-button-background-color);
    background-image: none;
    border: 1px solid $widget-border-color;
    color: $footer-button-color;
    font-weight: $footer-button-font-weight;

    .v-icon {
      color: $hawkbit-primary-color;
    }
    height: round($action-button-height-scale * $v-unit-size) !important;
    font-size: $v-font-size--small !important;
  }

  .action-button:focus:after {
    border: 1px solid $footer-button-background-color;
    box-shadow: none !important;
  }

  .action-button:before {
    height: 100% !important;
  }

  //Upload button style
  .action-button .v-button {
    height: round($action-button-height-scale * $v-unit-size) !important;
    font-size: $v-font-size--small !important;
  }

  .v-upload .v-button {
    text-align: center !important;
  }

  //Width of 'drop to delete' layout and 'no actions' button
  .del-action-button {
    width: round($delete-action-button-width-scale * $v-unit-size);
  }

  //Drop to delete layout style
  .drop-to-delete-button {
    background: $widget-bg !important;
    background-image: none !important;
    cursor: auto !important;

    .v-pressed:after {
      background: none repeat scroll 0 0 transparent !important;
      border-color: #ffffff !important;
      box-shadow: none !important;
      opacity: 1;
    }
  }

  .drop-to-delete-button:hover {
    background: $widget-bg !important;
    background-image: none !important;
  }

  .drop-to-delete-button:hover:after,
  .drop-to-delete-button:focus:after {
    background: none repeat scroll 0 0 transparent !important;
    border-color: $widget-border-color !important;
    box-shadow: none !important;
  }

  .drop-to-delete-button:active {
    opacity: 1 !important;
  }
  
   
  .footer-layout{
   .app-loading {
   	background-position: bottom;
    background-repeat: no-repeat;
   }
   
   .app-loading:before {
   	  background: none;
    height: 20px !important;
    width: 20px !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 2px solid rgba(0, 0, 0, 0);
    border-top-color: $hawkbit-primary-color;
    border-right-color: $hawkbit-primary-color;
    border-radius: 100%;
    -webkit-animation: v-rotate-360 500ms infinite linear;
    -moz-animation: v-rotate-360 500ms infinite linear;
    -ms-animation: v-rotate-360 500ms infinite linear;
    -o-animation: v-rotate-360 500ms infinite linear;
    animation: v-rotate-360 500ms infinite linear;
    pointer-events: none;
    position: fixed;
    margin-top: 12px;
    margin-left: -10px;
   }
  }
 
}