Add new infrastructure UI styling; add CSS for socket info box

Project: http://git-wip-us.apache.org/repos/asf/cloudstack/repo
Commit: http://git-wip-us.apache.org/repos/asf/cloudstack/commit/be5a7b45
Tree: http://git-wip-us.apache.org/repos/asf/cloudstack/tree/be5a7b45
Diff: http://git-wip-us.apache.org/repos/asf/cloudstack/diff/be5a7b45

Branch: refs/heads/rbac
Commit: be5a7b45fba4044a163deb90d5740388bf4e91d1
Parents: bed42de
Author: Brian Federle <brian.fede...@citrix.com>
Authored: Tue Oct 29 14:17:33 2013 -0700
Committer: Brian Federle <brian.fede...@citrix.com>
Committed: Tue Oct 29 14:17:33 2013 -0700

----------------------------------------------------------------------
 ui/css/cloudstack3.css | 162 ++++++++++++++++++++++++++------------------
 1 file changed, 95 insertions(+), 67 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/cloudstack/blob/be5a7b45/ui/css/cloudstack3.css
----------------------------------------------------------------------
diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css
index 2da0d29..71df11a 100644
--- a/ui/css/cloudstack3.css
+++ b/ui/css/cloudstack3.css
@@ -8557,19 +8557,18 @@ div.ui-dialog div.multi-edit-add-list div.view 
div.data-table table.body tbody t
   height: 258px;
   width: 762px;
   display: block;
-  background: #8DA4B9 url(../images/bg-gradients.png) repeat-x 0px -475px;
-  /*+border-radius:8px;*/
-  -moz-border-radius: 8px;
-  -webkit-border-radius: 8px;
-  -khtml-border-radius: 8px;
-  border-radius: 8px;
-  border-radius: 8px 8px 8px 8px;
+  background: #8DA4B9 repeat-x 0px -475px;
+  /*+border-radius:3px;*/
+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
+  -khtml-border-radius: 3px;
+  border-radius: 3px;
   /*+box-shadow:inset 0px 0px 1px #FFFFFF;*/
   -moz-box-shadow: inset 0px 0px 1px #FFFFFF;
   -webkit-box-shadow: inset 0px 0px 1px #FFFFFF;
   -o-box-shadow: inset 0px 0px 1px #FFFFFF;
   box-shadow: inset 0px 0px 1px #FFFFFF;
-  border: 1px solid #BFD4E1;
+  border: 1px solid #7D7D7D;
   position: relative;
   margin: 18px 0 0 15px;
   font-weight: bold;
@@ -8586,15 +8585,14 @@ div.ui-dialog div.multi-edit-add-list div.view 
div.data-table table.body tbody t
 }
 
 .system-dashboard .head {
-  color: #505F6F;
+  color: #000000;
   /*+text-shadow:0px 1px 1px #FFFFFF;*/
   -moz-text-shadow: 0px 1px 1px #FFFFFF;
   -webkit-text-shadow: 0px 1px 1px #FFFFFF;
   -o-text-shadow: 0px 1px 1px #FFFFFF;
   text-shadow: 0px 1px 1px #FFFFFF;
   text-indent: 11px;
-  padding: 12px 0 11px;
-  border-bottom: 1px solid #728EA7;
+  padding: 12px 0 0;
   /*+box-shadow:0px 0px 1px #FFFFFF;*/
   -moz-box-shadow: 0px 0px 1px #FFFFFF;
   -webkit-box-shadow: 0px 0px 1px #FFFFFF;
@@ -8605,13 +8603,11 @@ div.ui-dialog div.multi-edit-add-list div.view 
div.data-table table.body tbody t
 .system-dashboard .view-more,
 .system-dashboard .view-all {
   float: right;
-  padding: 5px 21px 5px 9px;
   margin: -4px 19px 0 0;
   cursor: pointer;
-  font-size: 11px;
-  font-weight: bold;
-  background: #4B5B6A url(../images/bg-gradients.png) repeat-x 0px -735px;
-  color: #FFFFFF;
+  font-size: 13px;
+  font-weight: 100;
+  background: #DADADA repeat-x 0px -735px;
   /*+border-radius:3px;*/
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
@@ -8619,92 +8615,74 @@ div.ui-dialog div.multi-edit-add-list div.view 
div.data-table table.body tbody t
   border-radius: 3px;
   border-radius: 3px 3px 3px 3px;
   border: 1px solid #5A5A5A;
-  /*+box-shadow:inset 0px 0px 1px #FFFFFF;*/
-  -moz-box-shadow: inset 0px 0px 1px #FFFFFF;
-  -webkit-box-shadow: inset 0px 0px 1px #FFFFFF;
-  -o-box-shadow: inset 0px 0px 1px #FFFFFF;
-  box-shadow: inset 0px 0px 1px #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;
 }
 
 .system-dashboard .view-more:hover,
 .system-dashboard .view-all:hover {
   background-position: 0px -763px;
-  /*+box-shadow:inset 0px 1px 1px #313131;*/
-  -moz-box-shadow: inset 0px 1px 1px #313131;
-  -webkit-box-shadow: inset 0px 1px 1px #313131;
-  -o-box-shadow: inset 0px 1px 1px #313131;
-  box-shadow: inset 0px 1px 1px #313131;
+  /*+box-shadow:inset 0px 1px 1px #000000;*/
+  -moz-box-shadow: inset 0px 1px 1px #000000;
+  -webkit-box-shadow: inset 0px 1px 1px #000000;
+  -o-box-shadow: inset 0px 1px 1px #000000;
+  box-shadow: inset 0px 1px 1px #000000;
+  background: #C1C1C1;
 }
 
 .system-dashboard .status_box .view-all {
-  /*+placement:shift 18px 136px;*/
+  /*+placement:shift 18px 128px;*/
   position: relative;
   left: 18px;
-  top: 136px;
+  top: 128px;
   width: 78%;
   position: absolute;
   text-align: center;
-  padding: 5px 0 8px;
+  padding: 8px 0;
 }
 
 .system-dashboard .status_box {
   font-size: 14px;
-  margin: 28px 0 0;
+  margin: 24px 0 0;
   background: transparent;
   border: none;
 }
 
 .system-dashboard .status_box li {
   height: 178px;
-  width: 180px;
+  width: 178px;
   padding: 0;
-  background: url(../images/bg-gradients.png) repeat-x 0px -1003px;
   margin: 0 0 0 8px;
-  /*+border-radius:7px;*/
-  -moz-border-radius: 7px;
-  -webkit-border-radius: 7px;
-  -khtml-border-radius: 7px;
-  border-radius: 7px;
-  border-radius: 7px 7px 7px 7px;
-  /*+box-shadow:inset 0px 1px 3px #000000;*/
-  -moz-box-shadow: inset 0px 1px 3px #000000;
-  -webkit-box-shadow: inset 0px 1px 3px #000000;
-  -o-box-shadow: inset 0px 1px 3px #000000;
-  box-shadow: inset 0px 1px 3px #000000;
+  /*+border-radius:3px;*/
+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
+  -khtml-border-radius: 3px;
+  border-radius: 3px;
   position: relative;
-  border: none;
+  border: 1px solid #808080;
   float: left;
 }
 
 .system-dashboard.zone .status_box li {
-  margin-bottom: 120px;
-  height: 176px;
-  background-position: 0px -1005px;
-  background-color: #35404B;
+  margin-bottom: 38px;
+  height: 170px;
+  background-color: #F4F4F4;
 }
 
 .system-dashboard.zone .status_box li .icon {
   background: url(../images/infrastructure-icons.png) no-repeat 0px 0px;
   padding: 65px 80px 5px;
-  /*+placement:shift 25px 19px;*/
+  /*+placement:shift 31px 19px;*/
   position: relative;
-  left: 25px;
+  left: 31px;
   top: 19px;
   position: absolute;
+  /*+opacity:56%;*/
+  filter: alpha(opacity=56);
+  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=56);
+  -moz-opacity: 0.56;
+  opacity: 0.56;
 }
 
 .system-dashboard .status_box li 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;
 }
 
 .system-dashboard .status_box li span.label {
@@ -8732,15 +8710,12 @@ div.ui-dialog div.multi-edit-add-list div.view 
div.data-table table.body tbody t
   position: relative;
   left: 13px;
   top: 5px;
-  /*+text-shadow:0px 1px 2px #000000;*/
-  -moz-text-shadow: 0px 1px 2px #000000;
-  -webkit-text-shadow: 0px 1px 2px #000000;
-  -o-text-shadow: 0px 1px 2px #000000;
-  text-shadow: 0px 1px 2px #000000;
+  font-weight: 100;
 }
 
 .system-dashboard.zone .status_box li span.header {
-  font-size: 13px;
+  font-size: 14px;
+  color: #4F4F4F;
 }
 
 .system-dashboard .status_box li span.status {
@@ -8878,6 +8853,59 @@ div.ui-dialog div.multi-edit-add-list div.view 
div.data-table table.body tbody t
   position: absolute;
 }
 
+.system-dashboard-view .socket-info {
+  width: 100%;
+  height: 134px;
+  overflow: auto;
+  float: left;
+  padding: 0;
+}
+
+.system-dashboard-view .socket-info > .title {
+  border-bottom: 1px solid #7D7D7D;
+  padding: 8px;
+  font-size: 13px;
+}
+
+.system-dashboard-view .socket-info ul {
+}
+
+.system-dashboard-view .socket-info li {
+  width: 143px;
+  padding: 13px;
+  /*+border-radius:3px;*/
+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
+  -khtml-border-radius: 3px;
+  border-radius: 3px;
+  margin: 7px 7px 7px 12px;
+  border: 1px solid #CCC;
+  background: #E2E2E2;
+  float: left;
+}
+
+.system-dashboard-view .socket-info li > div {
+  text-decoration: none;
+  float: left;
+}
+
+.system-dashboard-view .socket-info li .name {
+  width: 100%;
+  margin-bottom: 13px;
+}
+
+.system-dashboard-view .socket-info li .hosts,
+.system-dashboard-view .socket-info li .sockets {
+  width: 54px;
+}
+
+.system-dashboard-view .socket-info li div .title {
+  color: #424242;
+  border: none;
+  font-size: 13px;
+  padding-bottom: 3px;
+}
+
 .add-zone-resource .form-container {
   height: auto !important;
   display: inline-block;

Reply via email to