5f6e0118b0
Add flavor for creating cluster Move subnets from OS Global page to Network page Add find-new-servers on Server Selection page (Improve find-new-servers code by using directive) Combine interface and autofill on Network page Add OS Global section on Review page Remove swipe on wizard Simplify wizard step and commit control Move monitoring part to an individual module Change-Id: I8422506270c428a7f84679cfbff542235ccc556f
544 lines
11 KiB
CSS
544 lines
11 KiB
CSS
html {
|
|
overflow: -moz-scrollbars-vertical;
|
|
overflow-y: scroll;
|
|
overflow-x: scroll;
|
|
font-size: 14px !important;
|
|
height: 100%;
|
|
}
|
|
body {
|
|
min-width: 1024px;
|
|
font-size: 14px !important;
|
|
}
|
|
.main-container {
|
|
position: relative;
|
|
}
|
|
body, .main-content {
|
|
background: #fff;
|
|
/*background: #4a4f56;*/
|
|
/*background: url("../img/bg.png") repeat scroll 0 0 rgba(0, 0, 0, 0);*/
|
|
}
|
|
.page-content {
|
|
background: inherit !important;
|
|
}
|
|
.notification-msg {
|
|
white-space: normal;
|
|
}
|
|
.nav-list > li.open .submenu {
|
|
display: block;
|
|
}
|
|
.nav-list > li > a {
|
|
font-size: inherit !important;
|
|
}
|
|
.table > tbody > tr > td {
|
|
vertical-align: middle;
|
|
}
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
.table > tbody > tr {
|
|
height: 50px;
|
|
}
|
|
}
|
|
/*
|
|
.cssSlideUp {
|
|
transition: 1s linear all;
|
|
height: 300px;
|
|
overflow: hidden;
|
|
}
|
|
.cssSlideUp.ng-hide {
|
|
height:0;
|
|
}
|
|
.cssFade {
|
|
transition: 0.5s linear all;
|
|
opacity: 1;
|
|
}
|
|
.cssFade.ng-hide {
|
|
opacity: 0;
|
|
}*/
|
|
|
|
.no-border {
|
|
border: 0px !important;
|
|
}
|
|
.nowrap {
|
|
white-space: nowrap;
|
|
}
|
|
.action {
|
|
cursor: pointer;
|
|
}
|
|
.action i {
|
|
padding-top: 7px;
|
|
}
|
|
.action i.fa-trash-o:hover {
|
|
background-color: #d15b47 !important;
|
|
color: white;
|
|
}
|
|
.role-tag {
|
|
background-color: #6fb3e0 !important;
|
|
border-color: #6fb3e0 !important;
|
|
border-radius: 10px;
|
|
color: #fff;
|
|
display: inline-block;
|
|
font-size: 13px;
|
|
font-weight: normal;
|
|
margin-bottom: 3px;
|
|
margin-right: 3px;
|
|
padding: 4px 22px 5px 9px;
|
|
position: relative;
|
|
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
|
|
transition: all 0.2s ease 0s;
|
|
vertical-align: baseline;
|
|
white-space: nowrap;
|
|
}
|
|
.no-border-search {
|
|
padding-left: 10px;
|
|
margin-left: 10px;
|
|
border-left: 1px solid rgb(216, 216, 216);
|
|
padding-bottom: 0px
|
|
}
|
|
.alert-dismissable .close {
|
|
color: inherit;
|
|
position: relative;
|
|
right: -17px !important;
|
|
top: 0 !important;
|
|
}
|
|
select {
|
|
padding-left: 1px !important;
|
|
}
|
|
.opacity-zero {
|
|
opacity: 0;
|
|
}
|
|
.margin-bottom-10 {
|
|
margin-bottom: 10px;
|
|
}
|
|
.margin-right-5 {
|
|
margin-right: 5px !important;
|
|
}
|
|
.margin-right-20 {
|
|
margin-right: 20px !important;
|
|
}
|
|
.max-width-200 {
|
|
max-width: 200px;
|
|
}
|
|
.partition-chart {
|
|
padding-top: 30px;
|
|
}
|
|
.margin-top-minus10 {
|
|
margin-top: -10px !important;
|
|
}
|
|
.cluster-progress {
|
|
margin-top: -40px;
|
|
margin-right: 20px;
|
|
margin-bottom: 18px;
|
|
}
|
|
.progressbar-number {
|
|
text-align: center;
|
|
position: absolute;
|
|
width: 100%;
|
|
margin-top: -1px;
|
|
}
|
|
.login-page {
|
|
margin-top: 60px;
|
|
}
|
|
.dashed-panel {
|
|
border: 2px dashed #D0D0D0;
|
|
border-radius: 10px;
|
|
padding: 5px 15px 20px 15px;
|
|
}
|
|
.no-cluster-panel {
|
|
text-align: center;
|
|
cursor: pointer;
|
|
padding-top: 90px;
|
|
height: 350px;
|
|
}
|
|
.no-cluster-panel i {
|
|
transform: scale(2, 2);
|
|
}
|
|
.no-cluster-panel h4 {
|
|
padding-top: 50px;
|
|
}
|
|
.widget-body .table {
|
|
border-top: 0px !important;
|
|
}
|
|
.navbar .navbar-nav > li {
|
|
border-style: none;
|
|
}
|
|
.ace-nav > li {
|
|
border-left: none !important;
|
|
}
|
|
.new-servers-result {
|
|
overflow-y: scroll;
|
|
max-height: 400px
|
|
}
|
|
.padding-top-30 {
|
|
padding-top: 30px;
|
|
}
|
|
.border-radius-4 {
|
|
border-radius: 4px !important;
|
|
}
|
|
textarea, input[type="text"], input[type="password"] {
|
|
-webkit-appearance: none;
|
|
/* Remove inner shadow from inputs on mobile iOS */
|
|
background: inherit;
|
|
}
|
|
/*
|
|
input[type="text"]:focus, input[type="password"]:focus {
|
|
background: inherit;
|
|
}
|
|
*/
|
|
|
|
/* Fix ace checkbox/radio css */
|
|
|
|
input.ace[type="checkbox"] + .lbl:before, input.ace[type="radio"] + .lbl:before {
|
|
content: "\00A0";
|
|
}
|
|
.progress {
|
|
position: relative;
|
|
}
|
|
button[disabled] {
|
|
pointer-events: auto !important;
|
|
cursor: not-allowed !important;
|
|
}
|
|
.wizard-steps li.active .step {
|
|
transform: scale(1.2, 1.2);
|
|
}
|
|
.wizard-steps li.active .title {
|
|
font-weight: bold;
|
|
}
|
|
.wizard-steps li.active .step {
|
|
background: #5293c4;
|
|
color: #fff;
|
|
font-weight: bold;
|
|
transform: scale(1.3, 1.3);
|
|
}
|
|
.wizard-steps li.error .step:before {
|
|
background-color: #fff;
|
|
border-radius: 100%;
|
|
bottom: 0;
|
|
color: #d3413b;
|
|
content: "\f00d";
|
|
display: block;
|
|
font-family: FontAwesome;
|
|
font-size: 17px;
|
|
left: 0;
|
|
line-height: 30px;
|
|
position: absolute;
|
|
right: 0;
|
|
text-align: center;
|
|
top: 0;
|
|
z-index: 3;
|
|
}
|
|
.wizard-steps li.error .step, .wizard-steps li.error:before {
|
|
border-color: #5293c4;
|
|
}
|
|
.wizard-steps li.error .title, .wizard-steps li.error .title {
|
|
color: #2b3d53;
|
|
}
|
|
.wizard-steps li.incomplete:before, li.incomplete .step {
|
|
border-color: #d15b47 !important;
|
|
font-weight: bold;
|
|
}
|
|
.padding-left-15 {
|
|
padding-left: 15px;
|
|
}
|
|
.infobox {
|
|
width: 260px !important;
|
|
height: 160px !important;
|
|
margin-right: 10px;
|
|
margin-bottom: 10px;
|
|
background: rgba(0, 0, 0, 0.07);
|
|
border: 2px dotted #ddd;
|
|
}
|
|
.infobox:hover {
|
|
background: rgba(0, 0, 0, 0.2)
|
|
}
|
|
.clusters-view {
|
|
margin-top: 30px;
|
|
margin-right: 15px;
|
|
}
|
|
.clusters-view .glyphicon {
|
|
margin-right: 5px;
|
|
}
|
|
.top-padding-10 {
|
|
padding-top: 10px
|
|
}
|
|
.autofill-section {
|
|
border-left: 1px solid #ccc;
|
|
}
|
|
/*
|
|
.fa-exclamation:before {
|
|
content: "\f12a"
|
|
}
|
|
*/
|
|
|
|
.btn {
|
|
/*font-weight: 600;*/
|
|
text-shadow: none !important;
|
|
border-width: 3px;
|
|
font-size: 15px;
|
|
line-height: 1.5;
|
|
padding: 4px 12px;
|
|
}
|
|
.btn-xs {
|
|
padding: 1px 5px !important;
|
|
}
|
|
.btn-white {
|
|
border-width: 1px !important;
|
|
}
|
|
.btn-black-white {
|
|
border: none !important;
|
|
background-color: inherit!important;
|
|
color: #000000 !important
|
|
}
|
|
.btn-trash-hover {
|
|
/* Fixes padding on icon*/
|
|
padding: 1px 3px 1px 4px !important;
|
|
}
|
|
button.btn-trash-hover:hover, button.btn-trash-hover:active {
|
|
background-color: #d15b47 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
button.btn-clte:hover, button.btn-clte:active {
|
|
background-color: #3a87ad !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
button.btn-edit-hover:hover, button.btn-edit-hover:active {
|
|
background-color: #87b87f !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
button.btn-sumbit-hover:hover, button.btn-sumbit-hover-hover:active {
|
|
background-color: #428bca !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.btn-topmargin-8 {
|
|
margin-top: 5px;
|
|
}
|
|
/*
|
|
th {
|
|
background-color: #FFFFFF !important;
|
|
color: #000000;
|
|
}*/
|
|
|
|
a.darkfont:link: {
|
|
font color: #000000 !important;
|
|
}
|
|
a.darkfont:visited {
|
|
color: #000000 !important;
|
|
}
|
|
/* visited link */
|
|
|
|
h1.blue-header {
|
|
float: left !important;
|
|
line-height: 1.4 !important;
|
|
color: #2679b5;
|
|
font-size: 24px;
|
|
font-weight: lighter;
|
|
padding: 0;
|
|
}
|
|
.header-margins {
|
|
margin-left: 0px !important;
|
|
margin-right: 0px !important;
|
|
margin-bottom: 15px !important;
|
|
}
|
|
a:active {
|
|
color: #0000FF;
|
|
}
|
|
.page-header {
|
|
border-bottom: 0px !important;
|
|
padding-top: 15px;
|
|
padding-bottom: 6px;
|
|
}
|
|
.label {
|
|
border-radius: 0.25em !important;
|
|
line-height: 80% !important;
|
|
text-transform: lowercase !important;
|
|
font-size: 100% !important;
|
|
/*padding: 0.2em 0 0 0 !important;*/
|
|
}
|
|
.label:first-letter {
|
|
text-transform: uppercase !important;
|
|
}
|
|
.nav-search {
|
|
position: relative !important;
|
|
float: right !important;
|
|
}
|
|
.btn-create {
|
|
/*line-height: 1.1 !important;*/
|
|
padding: 5px 12px 6px 12px !important;
|
|
width: auto !important;
|
|
font-weight: 500 !important;
|
|
margin-top: 26px !important;
|
|
}
|
|
.input-icon {
|
|
margin-top: 5px !important;
|
|
}
|
|
.ng-table th.sortable {
|
|
cursor: pointer
|
|
}
|
|
.ng-table th.sortable div {
|
|
padding-right: 18px;
|
|
position: relative
|
|
}
|
|
.ng-table th.sortable div:after, .ng-table th.sortable div:before {
|
|
content: "";
|
|
border-width: 0 4px 4px;
|
|
border-style: solid;
|
|
border-color: #000 transparent;
|
|
visibility: visible;
|
|
right: 8px;
|
|
top: 50%;
|
|
position: absolute;
|
|
opacity: .3;
|
|
margin-top: -4px
|
|
}
|
|
.ng-table th.sortable div:before {
|
|
margin-top: 2px;
|
|
border-bottom: 0;
|
|
border-left: 4px solid transparent;
|
|
border-right: 4px solid transparent;
|
|
border-top: 4px solid #000
|
|
}
|
|
.ng-table th.sortable div:hover:after, .ng-table th.sortable div:hover:before {
|
|
opacity: 0.8;
|
|
visibility: visible
|
|
}
|
|
.ng-table th.sortable.sort-desc, .ng-table th.sortable.sort-asc {
|
|
background-color: rgba(141, 192, 219, .25);
|
|
text-shadow: 0 1px 1px rgba(255, 255, 255, .75)
|
|
}
|
|
.ng-table th.sortable.sort-desc div:after, .ng-table th.sortable.sort-asc div:after {
|
|
margin-top: -2px
|
|
}
|
|
.ng-table th.sortable.sort-desc div:before, .ng-table th.sortable.sort-asc div:before {
|
|
visibility: hidden
|
|
}
|
|
.ng-table th.sortable.sort-asc div:after, .ng-table th.sortable.sort-asc div:hover:after {
|
|
visibility: visible;
|
|
filter: alpha(opacity=60);
|
|
-khtml-opacity: .6;
|
|
-moz-opacity: .6;
|
|
/* opacity: .6 */
|
|
}
|
|
.ng-table th.sortable.sort-desc div:after {
|
|
border-bottom: 0;
|
|
border-left: 4px solid transparent;
|
|
border-right: 4px solid transparent;
|
|
border-top: 4px solid #000;
|
|
visibility: visible;
|
|
-webkit-box-shadow: none;
|
|
-moz-box-shadow: none;
|
|
box-shadow: none;
|
|
filter: alpha(opacity=60);
|
|
-khtml-opacity: .6;
|
|
-moz-opacity: .6;
|
|
/* opacity: .6 */
|
|
}
|
|
.ng-table-pager {
|
|
display: none;
|
|
}
|
|
.btn-previous {
|
|
background-color: #abbac3 !important;
|
|
border-color: #abbac3 !important;
|
|
}
|
|
.btn-light {
|
|
cursor: not-allowed !important;
|
|
}
|
|
.btn-prev-spacing {
|
|
margin-right: 10px;
|
|
}
|
|
.networkDeleteView {
|
|
border-bottom-color: #f3cdc6 !important;
|
|
background-color: #f5f5f5 !important;
|
|
}
|
|
.networkDeleteButton {
|
|
color: #dd5a43 !important;
|
|
}
|
|
.th-inhert {
|
|
vertical-align: auto;
|
|
}
|
|
.eth-width {
|
|
width: 13%;
|
|
}
|
|
.max-width-150 {
|
|
max-width: 150px !important;
|
|
}
|
|
.margin-bottom-8 {
|
|
margin-bottom: 0px;
|
|
}
|
|
td.center-align {
|
|
vertical-align: inherit !important;
|
|
}
|
|
.side-padding-30 {
|
|
padding-left: 30px !important;
|
|
padding-right: 30px !important;
|
|
padding-top: 10px;
|
|
}
|
|
.side-padding-40 {
|
|
padding-left: 40px !important;
|
|
padding-right: 40px !important;
|
|
}
|
|
.side-padding-10 {
|
|
padding-left: 10px !important;
|
|
padding-right: 10px !important;
|
|
}
|
|
.side-padding-20 {
|
|
padding-left: 20px !important;
|
|
padding-right: 20px !important;
|
|
}
|
|
.top-margin-14 {
|
|
margin-top: 14px;
|
|
}
|
|
.top-margin-26 {
|
|
margin-top: 26px;
|
|
}
|
|
table {
|
|
margin-bottom: 0px !important;
|
|
}
|
|
div.center-align {
|
|
vertical-align: center !important;
|
|
}
|
|
.margin-right-5 {
|
|
margin-right: 10px;
|
|
}
|
|
.interface-placeholder-margin {
|
|
border: 1px solid rgba(190, 210, 219, .5) !important;
|
|
min-height: 60px !important;
|
|
}
|
|
.network-margin-border {
|
|
border: 1px solid rgba(190, 210, 219, .5) !important;
|
|
}
|
|
.network-margin {
|
|
margin-left: 10px !important;
|
|
margin-top: 10px !important;
|
|
}
|
|
.widget-header-marginbottom {
|
|
border-bottom: 1px solid #bed2db !important;
|
|
}
|
|
.network-background {
|
|
background-image: url();
|
|
}
|
|
/* adjustments to draggable */
|
|
|
|
.network-draggable {
|
|
position: relative;
|
|
width: 132px !important;
|
|
}
|
|
.external-event {
|
|
float: left !important;
|
|
}
|
|
.drag-enter {
|
|
background: none repeat scroll 0 0 #F0F9FF;
|
|
border: 2px dashed #BED2DB !important;
|
|
box-sizing: border-box;
|
|
margin: 5px 0;
|
|
min-height: 50px;
|
|
padding: 0;
|
|
}
|
|
.network-placeholder {
|
|
min-height: 200px;
|
|
}
|
|
.interface-placeholder {
|
|
border: 1px solid #BED2DB;
|
|
box-sizing: border-box;
|
|
margin: 5px 0;
|
|
min-height: 50px;
|
|
padding: 10px;
|
|
}
|