summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src
diff options
context:
space:
mode:
Diffstat (limited to 'usecaseui-portal/src')
-rw-r--r--usecaseui-portal/src/app/views/home/home.component.html10
-rw-r--r--usecaseui-portal/src/app/views/home/home.component.less95
2 files changed, 48 insertions, 57 deletions
diff --git a/usecaseui-portal/src/app/views/home/home.component.html b/usecaseui-portal/src/app/views/home/home.component.html
index 5f956827..0946b587 100644
--- a/usecaseui-portal/src/app/views/home/home.component.html
+++ b/usecaseui-portal/src/app/views/home/home.component.html
@@ -15,6 +15,7 @@
-->
<div class="content">
+ <!-- left-content -->
<div class="left-content">
<div class="services">
<h4>{{"i18nTextDefine_SERVICES" | translate}}</h4>
@@ -25,7 +26,7 @@
<span>{{"i18nTextDefine_service_instance" | translate}}</span></h5>
</div>
<p class="tip">
- <span style="color:#3C4F8C" (click) = "goback_services()">{{"i18nTextDefine_ViewDetails" | translate}}</span>
+ <span (click) = "goback_services()">{{"i18nTextDefine_ViewDetails" | translate}}</span>
</p>
</div>
<div class="PACKAGE">
@@ -60,11 +61,12 @@
</li>
</div>
<p class="tip">
- <span style="color:#3C4F8C" (click) = "goback_onboard()">{{"i18nTextDefine_ViewDetails" | translate}}</span>
+ <span (click) = "goback_onboard()">{{"i18nTextDefine_ViewDetails" | translate}}</span>
</p>
</div>
</div>
- <div class="rightcontent" style="height: 96vh">
+ <!-- right-contnet -->
+ <div class="right-content">
<div class="rt-content">
<div class="alarm">
<h4>{{"i18nTextDefine_ALARM" | translate}}</h4>
@@ -75,7 +77,7 @@
<app-pie [initData]="VMAlarmChartInit" [chartData]="VMAlarmChartData"></app-pie>
<p class="alarm-name"> {{"i18nTextDefine_VM_Alarm" | translate}} </p>
<p class="tip">
- <a href="#" style="color:#3C4F8C">{{"i18nTextDefine_ViewDetails" | translate}}</a>
+ <a href="#">{{"i18nTextDefine_ViewDetails" | translate}}</a>
</p>
</div>
</div>
diff --git a/usecaseui-portal/src/app/views/home/home.component.less b/usecaseui-portal/src/app/views/home/home.component.less
index affe4765..dc736f18 100644
--- a/usecaseui-portal/src/app/views/home/home.component.less
+++ b/usecaseui-portal/src/app/views/home/home.component.less
@@ -20,7 +20,6 @@
.left-content{
float: left;
width:30%;
- // height:96vh;
.services,.PACKAGE{
width: 100%;
background:rgba(255,255,255,1);
@@ -31,6 +30,9 @@
font: 600 16px/16px "Arial Bold";
color: #0DA9E2;
}
+ p {
+ font: 400 14px/14px "Arial";
+ }
.tip {
float: right;
width: 110px;
@@ -40,7 +42,11 @@
font-size: 16px;
color: #3C4F8C;
margin-top: 20px;
- margin-bottom: 0!important;
+ margin-bottom: 0;
+ text-align: center;
+ span{
+ color: #3C4F8C;
+ }
}
}
.services{
@@ -111,33 +117,31 @@
}
}
- .services,.PACKAGE{
- h3 {
- font: 400 48px/48px "Arial";
- color: #3fa8eb;
- text-align: center;
- span {
- font-size: 14px;
- }
- }
-
- p {
- font: 400 14px/14px "Arial";
- color: #54657e;
- text-align: center;
- margin-bottom: 48px;
- }
- }
- .rightcontent {
+ .right-content {
float: left;
- padding-left: 15px;
width: 70%;
+ height: 96vh;
+ padding-left: 15px;
.rt-content {
height: 40%;
margin-bottom: 18px;
background:rgba(255,255,255,1);
box-shadow:0px 10px 10px 2px rgba(222,222,222,0.5);
border-radius:6px;
+ .alarm {
+ float: left;
+ background-color: #fff;
+ height: 100%;
+ width: 48%;
+ border-radius: 5px;
+ position: relative;
+ padding: 28px 26px;
+ h4 {
+ position: absolute;
+ font: 600 16px/16px "Arial Bold";
+ color: #0DA9E2;
+ }
+ }
.poerformance {
float: left;
background-color: #fff;
@@ -149,13 +153,7 @@
h3 {
color:#BD57E5;
}
- }
- h4 {
- font: 600 16px/16px "Arial Bold";
- color: #0DA9E2;
- margin-bottom: 34px;
- }
-
+ }
div {
height: 57px;
position: relative;
@@ -178,37 +176,28 @@
left: 0;
}
}
- }
- .alarm {
- float: left;
- background-color: #fff;
- height: 100%;
- width: 48%;
- border-radius: 5px;
- position: relative;
- padding: 28px 26px;
- h4 {
- position: absolute;
- font: 600 16px/16px "Arial Bold";
- color: #0DA9E2;
+ .tip{
+ width: 110px;
+ background-color: #eceff4;
+ color: #3C4F8C;
+ font-size: 16px;
+ float: right;
+ margin-top: 20px;
+ margin-bottom: 0!important;
+ line-height: 35px;
+ border-radius: 5px;
+ text-align: center;
+ a{
+ color:#3C4F8C;
+ }
}
}
+
.alarm-name{
text-align: center;
margin-top: 15px;
}
- .tip{
- width: 110px;
- background-color: #eceff4;
- color: #3C4F8C;
- font-size: 16px;
- float: right;
- margin-top: 20px;
- margin-bottom: 0!important;
- line-height: 35px;
- border-radius: 5px;
- text-align: center;
- }
+
}
.rb-content {
position: relative;