diff --git a/client/WEB-INF/classes/resources/messages.properties b/client/WEB-INF/classes/resources/messages.properties index 5d34b26bec5..aaf6c0f365f 100644 --- a/client/WEB-INF/classes/resources/messages.properties +++ b/client/WEB-INF/classes/resources/messages.properties @@ -7,6 +7,10 @@ label.network.service.providers=Network Service Providers message.launch.zone=Zone is ready to launch; please proceed to the next step. error.unable.to.reach.management.server=Unable to reach Management Server label.internal.name=Internal name +message.configure.all.traffic.types=You have multiple physical networks; please configure labels for each traffic type by clicking on the Edit button. +message.edit.traffic.type=Please specify the traffic label you want associated with this traffic type. +label.edit.traffic.type=Edit traffic type +label.label=Label label.max.networks=Max. networks error.invalid.username.password=Invalid username or password message.enabling.security.group.provider=Enabling Security Group provider diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css index 11977876bc1..9190283bce9 100644 --- a/ui/css/cloudstack3.css +++ b/ui/css/cloudstack3.css @@ -5623,7 +5623,7 @@ label.error { .multi-wizard.zone-wizard .select-container.multi .drop-container { background: #DAE2EC; width: 484px; - height: 65px; + height: 100px; clear: both; position: relative; /*+border-radius:4px;*/ @@ -5654,7 +5654,7 @@ label.error { .multi-wizard.zone-wizard .select-container.multi .drop-container ul li { float: left; - margin: 0px 0 0 16px; + margin: 2px 17px 0 29px; } .multi-wizard.zone-wizard .select-container.multi .drop-container span.empty-message { @@ -5722,11 +5722,14 @@ label.error { margin: 16px 13px 0 0; } -.multi-wizard.zone-wizard .traffic-types-drag-area > ul > li.management, -.multi-wizard.zone-wizard .traffic-types-drag-area > ul > li.public { +.multi-wizard.zone-wizard .traffic-types-drag-area > ul > li.required { display: none; } +.multi-wizard.zone-wizard .traffic-types-drag-area > ul > li.required.clone { + display: block; +} + .multi-wizard.zone-wizard .traffic-types-drag-area > ul > li ul.container { width: 60px; height: 54px; @@ -5781,7 +5784,8 @@ label.error { position: relative; left: -8px; top: -6px; - margin-right: -16px; + margin-right: 0px; + width: 70px !important; } .multi-wizard.zone-wizard li.traffic-type-draggable.disabled { @@ -5804,7 +5808,7 @@ label.error { } .multi-wizard.zone-wizard .select-container.multi li.traffic-type-draggable.management:hover { - margin-right: -18px; + margin-right: -1px; } .multi-wizard.zone-wizard li.traffic-type-draggable.public { @@ -5853,6 +5857,75 @@ label.error { display: none; } +/*** Traffic type icon -- edit button*/ +.multi-wizard.zone-wizard .traffic-type-draggable .edit-traffic-type { + display: none; +} + +.multi-wizard.zone-wizard .drop-container .traffic-type-draggable > .edit-traffic-type { + cursor: pointer; + display: block; + width: 59px; + height: 23px; + padding: 2px 9px 0 12px; + background: url(../images/bg-gradients.png) 0px 53px; + border: 1px solid #C4C4C4; + /*+border-radius:4px;*/ + -moz-border-radius: 4px; + -webkit-border-radius: 4px; + -khtml-border-radius: 4px; + border-radius: 4px 4px 4px 4px; + border-top: 1px solid #FFFFFF; + /*+placement:shift -15px 61px;*/ + position: relative; + left: -15px; + top: 61px; +} + +.multi-wizard.zone-wizard .drop-container .traffic-type-draggable > .edit-traffic-type:hover { + background-position: 0px -105px; + color: #FFFFFF; + /*+box-shadow:inset 0px 2px 1px #727272;*/ + -moz-box-shadow: inset 0px 2px 1px #727272; + -webkit-box-shadow: inset 0px 2px 1px #727272; + -o-box-shadow: inset 0px 2px 1px #727272; + box-shadow: inset 0px 2px 1px #727272; +} + +.multi-wizard.zone-wizard .drop-container .traffic-type-draggable > .edit-traffic-type:hover span { + color: #FFFFFF; + /*+text-shadow:0px 1px 1px #000000;*/ + -moz-text-shadow: 0px 1px 1px #000000; + -webkit-text-shadow: 0px 1px 1px #000000; + -o-text-shadow: 0px 1px 1px #000000; + text-shadow: 0px 1px 1px #000000; +} + +.multi-wizard.zone-wizard .drop-container .traffic-type-draggable:hover > .edit-traffic-type { + /*+placement:shift -7px 67px;*/ + position: relative; + left: -7px; + top: 67px; +} + +.multi-wizard.zone-wizard .drop-container .traffic-type-draggable .edit-traffic-type span { + text-align: center; + font-size: 11px; + font-weight: bold; + color: #4E73A6; + /*+text-shadow:0px 1px #FFFFFF;*/ + -moz-text-shadow: 0px 1px #FFFFFF; + -webkit-text-shadow: 0px 1px #FFFFFF; + -o-text-shadow: 0px 1px #FFFFFF; + text-shadow: 0px 1px #FFFFFF; +} + +.multi-wizard.zone-wizard .drop-container .traffic-type-draggable .edit-traffic-type span.icon { + float: left; + background: url(../images/sprites.png) -7px -4px; + padding: 7px 11px 0 7px; +} + /*** Configure guest network -- tabs*/ .multi-wizard.zone-wizard .setup-guest-traffic .ui-widget-content { width: 682px; @@ -8353,13 +8426,11 @@ div.panel.ui-dialog div.list-view div.fixed-header { background-position: 1px -674px; } -.migrate .icon, -.migrateToAnotherStorage .icon { +.migrate .icon { background-position: 0px -125px; } -.migrate:hover .icon, -.migrateToAnotherStorage:hover .icon { +.migrate:hover .icon { background-position: 0px -707px; } diff --git a/ui/index.jsp b/ui/index.jsp index 4694a49aba4..057cd387320 100644 --- a/ui/index.jsp +++ b/ui/index.jsp @@ -508,7 +508,13 @@
@@ -519,7 +525,13 @@
@@ -530,7 +542,13 @@
@@ -541,7 +559,13 @@
  • + class="traffic-type-draggable storage"> + +
    +   + Edit +
    +
@@ -1621,6 +1645,10 @@