Remove footer, expand layout and move functions to other elements (#689)
* Remove process and discard upload buttons; change upload process to only have one upload status window that is displayed immediately when an upload is triggered. * Separation of FileTransferHandler: FileTransferHandler was split into 3 parts. One common part remains in the abstract super class. The other pieces were moved to the upload-specific and the streaming-specific subclasses. * Fix upload process: Fix status visualization in progress window. Move repository transfer to the file upload handler so it can report if the complete upload process succeeded or failed. * Prevent file upload if no software module or more than one is selected. * Added Unit Tests and fixed Sonar findings. * Move upload button from the buttom to the right side of the drag and drop area. * Remove minimize and resize buttons in progress dialog. Remove unused code. * Code cleanup and layout adaptions: Remove unnecessary code and fix layout problems when showing the upload button on the right side of the drag and drop area. * Removed abort functionality for user because of Vaadin bug https://github.com/vaadin/framework/issues/10545 * Fixed Vaadin upload bug by subclassing Upload and overriding necessary methods. * Disable drag-and-drop area in case no OR more than one software module selected. * Enhance /adapt unit tests * Enhance /adapt UI tests Signed-off-by: Markus Block <markus.block@bosch-si.com> * First draw, insert delete button in entity tables * Add shortcuts to cancel/confirm buttons in confirmation dialog * First draw, target/distribution assignment * Entity assignments for tables * Fix table row mark correctly when assigning entities * Mark the right entity in table when deleting an entity * Refactor code for distribution tags on deployment view * Target Tags can be managed with Menu Bar * Refactor classes for managing tags and types for all entities * Disable fields correctly when updating/deleting tags and types * Remove delete and action buttons in the bottom * Delete Metadata column in tables * Redesign tables for tags and types. Show action icon for update/delete * Correct CSS for menubar for tag/type actions * Add confirmation window when deleting tag or type * Remove unused code. Fix style for target tag config menu bar * New abstract classes for target/ds tags * Reorganize package structure tags, set ids for tags * Add total targets count in target table, add close icon for menubar * Add total target label and remove footer styles * MenuBar is displayed when update/delete action is cancelled, finished, or update/delete modus is left * Insert EventHandling for show menuBar/CancelButton * Delete drag & drop criteria where not needed anymore * Fix mandatory field check in DistributionTypeLayout * Fix notification message * Move upload button into drop area * Enhance /adapt unit tests * Enhance /adapt UI tests Signed-off-by: Melanie Retter <melanie.retter@bosch-si.com>
This commit is contained in:
Melanie Retter
committed by
Stefan Behl
Stefan Behl
parent
bafce18db6
commit
f5f51bfc2c
@@ -20,11 +20,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
//Accordion button layout style
|
||||
.accordion-tab-button-style {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.accordion {
|
||||
margin: 10px;
|
||||
width: 550px !important;
|
||||
|
||||
@@ -89,6 +89,10 @@
|
||||
// Hence provide margin-top so that it appear at center.
|
||||
margin-top: 45px;
|
||||
}
|
||||
|
||||
.upload-button {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
//Upload confirmation popup and upload result popup style
|
||||
.confirmation-popup {
|
||||
|
||||
@@ -86,20 +86,6 @@
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.view-header:before {
|
||||
border-bottom: $app-header-border-bottom;
|
||||
font-size: 42px;
|
||||
font-weight: bold;
|
||||
height: 42px;
|
||||
line-height: 50px;
|
||||
padding-bottom: 5px;
|
||||
padding-left: 0;
|
||||
padding-top: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: calc(100% - 15px);
|
||||
z-index: 1;
|
||||
}
|
||||
.view-header:after {
|
||||
background: $logo-image no-repeat right top;
|
||||
background-position: $logo-position;
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
|
||||
//Tag widget header height adjusted to match table header heights
|
||||
.filter-btns-header-layout {
|
||||
padding-bottom: 22px;
|
||||
padding-bottom: 14px;
|
||||
}
|
||||
|
||||
//Tag layout style
|
||||
@@ -34,6 +34,10 @@
|
||||
.v-table-table {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.v-table-body {
|
||||
overflow-x:hidden;
|
||||
}
|
||||
}
|
||||
|
||||
//Tag button wrapper style
|
||||
|
||||
@@ -1,123 +0,0 @@
|
||||
/**
|
||||
* 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;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -30,4 +30,12 @@
|
||||
.v-grid-cell.frozen + th {
|
||||
border-left: $v-grid-border-size solid $widget-border-color ;
|
||||
}
|
||||
|
||||
.v-button-borderless-colored {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.fullSize .v-gridlayout-slot {
|
||||
height: 100% !important;
|
||||
}
|
||||
}
|
||||
@@ -67,8 +67,6 @@ $menu-title-bg-color: #551f62;
|
||||
//Color of icons like add ,config,search etc
|
||||
$button-icon-color: #551f62;
|
||||
|
||||
//Footer button background color
|
||||
$footer-button-background-color: #fff;
|
||||
|
||||
//Color of assigned distribution,when target is selected
|
||||
$installed-row-color: $lighter-orange-color;
|
||||
@@ -85,19 +83,9 @@ $success-icon-color: #ff0000;
|
||||
//Error icon color on invalid target filter query
|
||||
$error-icon-color: #008000;
|
||||
|
||||
|
||||
//Font style of view caption
|
||||
$view-caption-font-style: 400 1.6em "Open Sans", sans-serif;
|
||||
|
||||
//Footer button width scale
|
||||
$action-button-width-scale: 3;
|
||||
|
||||
//Footer button height scale
|
||||
$action-button-height-scale:1.2;
|
||||
|
||||
//Delete button width scale
|
||||
$delete-action-button-width-scale:4.8;
|
||||
|
||||
//Detail tab - font scale
|
||||
$details-tab-font-scale: 1;
|
||||
|
||||
|
||||
@@ -33,7 +33,7 @@
|
||||
|
||||
//Deployment view - Style of count message
|
||||
.v-caption-count-msg-box {
|
||||
text-align: center;
|
||||
margin-left: 180px;
|
||||
color: $info-message-color-grey;
|
||||
font-weight: bold;
|
||||
height: 10px;
|
||||
@@ -41,9 +41,8 @@
|
||||
|
||||
//*Deployment view -Assigned and installed message*
|
||||
.count-msg-box {
|
||||
padding-left: 10px;
|
||||
margin-left: 180px;
|
||||
padding-top: 3px;
|
||||
text-align: center;
|
||||
color: $info-message-color-grey;
|
||||
font-weight: italic;
|
||||
font-size: 12px;
|
||||
@@ -288,4 +287,31 @@
|
||||
.breadcrumbPaddingLeft{
|
||||
padding-left: 3px !important;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -70,4 +70,55 @@
|
||||
text-overflow:ellipsis;
|
||||
text-align:left;
|
||||
}
|
||||
|
||||
.menubar-position {
|
||||
margin-top: -5px;
|
||||
right: 20px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.v-menubar-menuitem-tags .v-menubar-submenu-indicator + .v-menubar-menuitem-caption:after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.v-menubar-popup .v-menubar-menuitem-menubar-position {
|
||||
padding-left: 0px;
|
||||
width: 100px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
.v-menubar-submenu-menubar-position {
|
||||
width: 100px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
.v-menubar-submenu-menubar-position .v-menubar-menuitem {
|
||||
padding-left: 3px;
|
||||
}
|
||||
|
||||
.v-menubar-borderless .v-menubar-menuitem-selected {
|
||||
color: inherit;
|
||||
background-image: none;
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
.v-menubar > .v-menubar-menuitem .v-icon {
|
||||
margin: 0 4px 0 19px;
|
||||
}
|
||||
|
||||
.v-menubar-borderless .v-menubar-menuitem {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.v-menubar > .v-menubar-menuitem {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.targetTag {
|
||||
right: 19px;
|
||||
}
|
||||
|
||||
#target\.tag\.drop\.area .v-slot-icon-only {
|
||||
height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -61,7 +61,6 @@ $v-animations-enabled: true;
|
||||
@import 'customstyles/systemconfig';
|
||||
@import 'customstyles/table-common';
|
||||
@import 'customstyles/table-header-common';
|
||||
@import 'customstyles/footer-common';
|
||||
@import 'customstyles/popup-common';
|
||||
@import 'customstyles/target-filter-query';
|
||||
@import 'customstyles/statusprogressbar';
|
||||
@@ -97,7 +96,6 @@ $v-included-components: remove($v-included-components, form);
|
||||
@include filter-layout-styles;
|
||||
@include table-common;
|
||||
@include table-header-common;
|
||||
@include footer-common;
|
||||
@include popup-common;
|
||||
@include target-filter-query;
|
||||
@include statusprogressbar;
|
||||
|
||||
Reference in New Issue
Block a user