654e8a07d5
This adds a loading indicator to detail pages and makes sure that the page content is not displayed until fully loaded. This prevents the pages from displaying with partial content and having the updated values pop in. It also adds an error indicator with a message when there is an error loading the page. The page content will not display if there is an error. This prevents the user from seeing the page in an error state with missing information and broken links. Change-Id: I6c04d8dd5b27b1ee6423176dd553cc231394ce2f Closes-Bug: #1561102
91 lines
2.4 KiB
SCSS
91 lines
2.4 KiB
SCSS
/*
|
|
* Copyright 2015 IBM Corp.
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the 'License');
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an 'AS IS' BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
|
|
/* Load Balancer Wizard */
|
|
.lbaas-wizard {
|
|
|
|
/* Field widths for editable inputs in the members table */
|
|
table {
|
|
.member-weight,
|
|
.member-port {
|
|
width: 6em;
|
|
}
|
|
.member-address {
|
|
width: 18em;
|
|
}
|
|
}
|
|
|
|
/* The IP addresses list displayed when hovering over the IP address in the
|
|
available instances table, and any lists in the help panels. */
|
|
.addresses-popover + .popover,
|
|
#help-panel {
|
|
ul {
|
|
list-style-type: disc;
|
|
padding-left: 10px;
|
|
}
|
|
}
|
|
|
|
/* Pool Members tab */
|
|
[ng-form="memberDetailsForm"] {
|
|
.transfer-section:first-child {
|
|
/* Remove the borders around the last row in the top table that has the
|
|
"Add external member" action in it. */
|
|
.table-rsp.table-detail tbody tr:nth-last-child(2):not(.expanded) td,
|
|
.table-rsp.table-detail tbody tr:last-child:not(.spacer-row) td {
|
|
border-bottom: none;
|
|
}
|
|
/* Remove the striped background on the last row in the top table that has the
|
|
"Add external member" action in it. */
|
|
.table-rsp.table-detail.table-striped tbody tr:last-child > td {
|
|
background: none;
|
|
}
|
|
td {
|
|
/* So the input fields fit better in the table row */
|
|
.form-group {
|
|
margin-bottom: 0px;
|
|
}
|
|
}
|
|
}
|
|
.transfer-section:last-child {
|
|
/* Hide the badge on the bottom table with the instance count. */
|
|
.transfer-heading .badge {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Progress indicator while data is loading */
|
|
[table-status],
|
|
detail-status {
|
|
.progress {
|
|
margin: 0px auto;
|
|
width: 25%;
|
|
height: $line-height-computed;
|
|
.progress-bar {
|
|
width: 100%;
|
|
}
|
|
}
|
|
}
|
|
detail-status {
|
|
.progress {
|
|
margin-top: 25vh;
|
|
}
|
|
.error-actions {
|
|
text-align: center;
|
|
margin-top: 10px;
|
|
}
|
|
} |