summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/ccvpn-creation
diff options
context:
space:
mode:
authorguochuyicmri <guochuyi@chinamobile.com>2019-04-29 19:29:04 +0800
committerguochuyicmri <guochuyi@chinamobile.com>2019-04-29 19:29:12 +0800
commit5978085f3b08b836e9db75c83791379b1592dd93 (patch)
tree9dd637bb399c20a7265f821a42a124a9501969a5 /usecaseui-portal/src/app/ccvpn-creation
parentac0058d56a368d626a2867bbbf5fd41a7a55b6aa (diff)
Page style created by CCVPN instance
Change-Id: I281c28ffb640d9cdaa220e89099f1f63960667c2 Issue-ID: USECASEUI-220 Signed-off-by: guochuyicmri <guochuyi@chinamobile.com>
Diffstat (limited to 'usecaseui-portal/src/app/ccvpn-creation')
-rw-r--r--usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.css141
1 files changed, 65 insertions, 76 deletions
diff --git a/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.css b/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.css
index 78cf3134..99095ec3 100644
--- a/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.css
+++ b/usecaseui-portal/src/app/ccvpn-creation/ccvpn-creation.component.css
@@ -94,41 +94,47 @@ hr {
color: #000;
}
/* SOTN VPN */
-.model .creation .sotnvpn ul li {
- display: inline-block;
- height: 40px;
- width: 24.5%;
- margin-bottom: 40px;
+.model .creation .sotnvpn .service-title{
+ margin-bottom: 35px;
}
-.model .creation .sotnvpn ul li span {
+.model .creation .sotnvpn .service-title .lable {
display: inline-block;
- width: 110px;
+ width: 90px;
font: 700 14px "Arial";
color: #3C4F8C;
vertical-align: middle;
+ margin-left: 5px;
}
-.model .creation .sotnvpn ul li input {
+.model .creation .sotnvpn .service-title input {
width: 234px;
height: 40px;
border-radius:4px;
outline: none;
+ margin-right: 50px;
}
/* Site List */
/* addsite model */
-.model .sitemodel {
+.model .sitemodel,.model .sotnnpnmodel{
position: absolute;
z-index: 1001;
left: 50px;
top: 60px;
background-color: #fff;
/*box-shadow: 0px 0px 20px #000;*/
- width:1300px;
+ width:1500px;
/*width:1300px;px*/
- max-height: 90%;
+ height: 81%;
border-radius:2px;
- overflow-y: auto;
+ overflow:auto;
+}
+.model .sotnnpnmodel{
+ width: 1000px;
+ height: 53%;
+ top:200px;
+ left: 50%;
+ margin-left: -500px;
}
-.model .sitemodel h3,.sitegroupmodal>h3{
+.model .sitemodel h3,.model .sotnnpnmodel h3{
width: 96%;
height: 40px;
line-height: 35px;
@@ -145,17 +151,20 @@ hr {
border-image: linear-gradient(#07A9E1,#30D9C4) 100 100;
border-radius:2px;
}
-.model .sitemodel .inputs {
+.model .sitemodel .inputs,.model .sotnnpnmodel .inputs {
padding: 10px 20px 0;
}
-.model .sitemodel .inputs ul li {
+.model .sitemodel .inputs ul li,.model .sotnnpnmodel .inputs ul li {
display: inline-block;
height: 35px;
line-height: 35px;
width: 24.5%;
margin-bottom: 20px;
}
-.model .sitemodel .inputs ul li span {
+.model .sotnnpnmodel .inputs ul li{
+ width: 31%;
+}
+.model .sitemodel .inputs ul li span,.model .sotnnpnmodel .inputs ul li span {
display: inline-block;
line-height: 35px;
font-size: 14px;
@@ -170,13 +179,21 @@ hr {
float: right;
margin-right: 25px;
}
-.model .sitemodel .action {
+.model .sotnnpnmodel .inputs input{
+ width: 186px;
+ float: left;
+ margin-left: 20px;
+}
+.model .sitemodel .action,.model .sotnnpnmodel .action {
text-align: center;
margin-top: 30px;
margin-bottom: 20px;
+ cursor: pointer
}
-
-.model .sitemodel .action button{
+.model .sotnnpnmodel .action{
+ margin-top: 70px;
+}
+.model .sitemodel .action button,.model .sotnnpnmodel .action button{
width: 126px;
height:40px;
background:#EEEEEE;
@@ -186,12 +203,12 @@ hr {
font-size: 16px;
margin: 0 15px;
}
-.model .sitemodel .action button:nth-child(2){
+.model .sitemodel .action button:nth-child(2),.model .sotnnpnmodel .action button:nth-child(2){
/*background:linear-gradient(310deg,rgba(30,158,255,1) 0%,rgba(99,200,255,1) 100%);*/
background: #0DA9E2;
color: #fff;
}
-.model .sitemodel .action button:nth-child(2):hover{
+.model .sitemodel .action button:nth-child(2):hover,.model .sotnnpnmodel .action button:nth-child(2):hover{
/*background:linear-gradient(90deg, rgb(103, 207, 246) 0%, rgb(69, 175, 255) 100%) !important;*/
background:#09C6E2;
}
@@ -202,7 +219,7 @@ hr {
}
/* site table */
-.model .site>button,.model .sitegroup>button,.sitemodel h3 button{
+.sitemodel h3 button,.sotnnpnmodel h3 button{
color: #D7D7D7;
width:32px;
height:32px;
@@ -210,12 +227,12 @@ hr {
border-radius:4px;
border:1px solid #D7D7D7;
}
-.model .site>button:hover,.model .sitegroup>button:hover,.sitemodel h3 button:hover,.model .back:hover{
+.sitemodel h3 button:hover,.model .back:hover,.sotnnpnmodel h3 button:hover{
background:#ffffff;
color: #0DA9E2;
border:1px solid #0DA9E2;
}
-.sitemodel h3>button{
+.sitemodel h3>button,.sotnnpnmodel h3>button{
float: right;
width: 30px;
height: 30px;
@@ -231,57 +248,6 @@ hr {
}
/* WAN Port */
-/* Site Group List */
-
-.model .sitegroupmodal {
- position: absolute;
- z-index: 1001;
- width: 360px!important;
- height: 450px!important;
- left:35%;
- top:40%;
- margin-top: -188px;
- margin-left: -180px;
- background: #ffffff;
-}
-
-.sitegroupmodal .list-div{
- width: 100%;
- height: 32px !important;
- line-height: 32px;
- margin-bottom: 10px;
-}
-.sitegroupmodal .list-div > span {
- line-height: 32px !important;
- color: #3C4F8C;
- margin-left: 30px;
-}
-.sitegroupmodal .list-div input, .sitegroupmodal .list-div nz-select {
- margin-right: 50px;
-}
-.sitegroupmodal .action{
- text-align: center;
- margin-top: 30px;
-}
-.sitegroupmodal .action button{
- width: 126px;
- height:40px;
- background:#EEEEEE;
- border-radius:2px;
- border: none!important;
- color: #9DA7C5;
- font-size: 16px;
- margin: 0 8px;
-}
-.sitegroupmodal .action button:nth-child(2){
- /*background:linear-gradient(310deg,rgba(30,158,255,1) 0%,rgba(99,200,255,1) 100%);*/
- background:#0DA9E2;
- color: #fff;
-}
-.sitegroupmodal .action button:nth-child(2):hover{
- /*background:linear-gradient(90deg, rgb(103, 207, 246) 0%, rgb(69, 175, 255) 100%) !important;*/
- background:#09C6E2;
-}
.mask{
width: 100%;
height: 100%;
@@ -323,7 +289,30 @@ hr {
overflow: hidden;
text-overflow: ellipsis;
}
-.model .creation .sotnvpn,.model .creation .site,.model .creation .sitegroup{
+.model .creation .sotnvpn,.model .creation .site{
background: #fff;
padding: 30px 30px 0 30px;
}
+.siteWanTab{
+ width: 96%;
+ margin: 0 auto;
+ margin-top: 10px;
+}
+.siteWanTab th{
+ padding: 10px 8px;
+ color: #3C4F8C;
+ font-size: 16px;
+}
+.siteWanTab tr td{
+ padding: 10px 5px;
+}
+.siteWanTab .tr-border{
+ border-bottom: 1px solid #EDEDED;
+}
+.addListBtn{
+ margin-right: 30px;
+ color: #06A7E2;
+ border: none;
+ background: rgba(229,238,252,0.8);
+ cursor: pointer;
+} \ No newline at end of file