diff options
Diffstat (limited to 'usecaseui-portal')
| -rw-r--r-- | usecaseui-portal/src/app/views/home/home.component.html | 10 | ||||
| -rw-r--r-- | usecaseui-portal/src/app/views/home/home.component.less | 95 |
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; |