summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/views/home/home.component.less
diff options
context:
space:
mode:
authorcyuamber <xuranyjy@chinamobile.com>2019-09-17 16:49:24 +0800
committercyuamber <xuranyjy@chinamobile.com>2019-09-17 16:49:34 +0800
commitc176eb964eb4877adb35a502791a13434bd57c76 (patch)
tree562eadea4ad28d55a71b2bac5111604772839966 /usecaseui-portal/src/app/views/home/home.component.less
parente727e1a70079182eac2aec6dfe83a409e811ece9 (diff)
style: optimize the style of the home page
Change-Id: I963cdb61aebcb4d049cfc4cc19c5d5dc3b743986 Issue-ID: USECASEUI-307 Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
Diffstat (limited to 'usecaseui-portal/src/app/views/home/home.component.less')
-rw-r--r--usecaseui-portal/src/app/views/home/home.component.less54
1 files changed, 35 insertions, 19 deletions
diff --git a/usecaseui-portal/src/app/views/home/home.component.less b/usecaseui-portal/src/app/views/home/home.component.less
index dc736f18..193e0748 100644
--- a/usecaseui-portal/src/app/views/home/home.component.less
+++ b/usecaseui-portal/src/app/views/home/home.component.less
@@ -15,12 +15,18 @@
*/
.content {
- padding: 20px 20px;
+ padding: 20px;
+ min-height: 918px;
+ height: 100vh;
overflow: hidden;
.left-content{
+ height: 100%;
float: left;
width:30%;
.services,.PACKAGE{
+ display:flex;
+ flex-direction: column;
+ justify-content: space-between;
width: 100%;
background:rgba(255,255,255,1);
box-shadow:0px 10px 10px 2px rgba(222,222,222,0.5);
@@ -34,27 +40,31 @@
font: 400 14px/14px "Arial";
}
.tip {
- float: right;
+ align-self: flex-end;
width: 110px;
line-height: 35px;
border-radius: 5px;
background-color: #eceff4;
font-size: 16px;
color: #3C4F8C;
- margin-top: 20px;
- margin-bottom: 0;
text-align: center;
+ cursor: pointer;
span{
color: #3C4F8C;
}
}
}
.services{
- height:466px;
- h4{
- margin-bottom: 20px;
- }
+ min-height:466px;
+ height: 50vh;
+ flex-wrap: wrap;
+
+ // h4{
+ // // margin-bottom: 20px;
+ // }
h5 {
+ position: relative;
+ z-index: 3;
font: 500 18px/18px "ArialMT";
color:#0DA9E2;
margin: -2em 0 1em 0 ;
@@ -78,23 +88,24 @@
}
}
.PACKAGE{
- height:422px;
+ min-height:422px;
+ height: 45vh;
margin-top: 20px;
- h4{
- margin-bottom: 50px;
- }
+ // justify-content: space-around;
+ // h4{
+ // margin-bottom: 50px;
+ // }
.details {
.detailstoplinContent{
border-bottom:0.5px solid rgba(237,237,237,1);
border-radius:4px;
- line-height: 45px;
+ line-height: 58px;
font-size: 14px;
color: #3C4F8C;
font-family:"ArialMT";
.detailstoplin {
width: 100%;
- height: 50px;
- border-top: 0.5px solid #ededed;
+ height: 58px;
border-radius: 4px;
div:first-child{
width: 20%;
@@ -112,18 +123,22 @@
color:rgba(60,79,140,0.5);
}
}
- }
+ &:first-child{
+ border-top: 0.5px solid rgba(237,237,237,1);
+ }
+ }
}
}
}
.right-content {
+ height: 100%;
float: left;
width: 70%;
- height: 96vh;
padding-left: 15px;
.rt-content {
- height: 40%;
+ min-height: 350px;
+ height: 40vh;
margin-bottom: 18px;
background:rgba(255,255,255,1);
box-shadow:0px 10px 10px 2px rgba(222,222,222,0.5);
@@ -201,7 +216,8 @@
}
.rb-content {
position: relative;
- height: 58%;
+ min-height: 538px;
+ height: 55vh;
background-color: #fff;
padding: 24px 30px;
box-shadow:0px 10px 15px 2px rgba(222,222,222,0.5);