Skip to content

C
CivWeb
Commit 91abc7fb authored by 王万里's avatar 王万里
Browse files
Options

feat: 二连浩特登录

parent efa8f04b
Hide whitespace changes
Inline Side-by-side
Showing with 359 additions and 344 deletions
src/pages/user/login/template/project/erlianhaote/index.js
View file @ 91abc7fb
...@@ -153,7 +153,7 @@ const Login = forwardRef((props, _ref) => { ...@@ -153,7 +153,7 @@ const Login = forwardRef((props, _ref) => {
<title>{props.global.title || defaultSetting.title}</title> <title>{props.global.title || defaultSetting.title}</title>
<meta name="description" content={props.global.title || defaultSetting.title} /> <meta name="description" content={props.global.title || defaultSetting.title} />
</Helmet> </Helmet>
<div className={styles.login}> <div classnames={(styles.erlianhaotelogin, "erlianhaote")}>
<div className={styles['inner-wrapper']}> <div className={styles['inner-wrapper']}>
<div className={styles['left-imgbox']}></div> <div className={styles['left-imgbox']}></div>
<div className={styles['inner-center']}> <div className={styles['inner-center']}>
......
src/pages/user/login/template/project/erlianhaote/index.less
View file @ 91abc7fb
.login {
width: 100%;
height: 100%;
background: url('./images/乐山登录背景.png') no-repeat center;
background-size: 100% 100%;
background-clip: border-box;
position: relative;
min-height: 7.0rem;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
}
.login .inner-bg {
// width: 78%;
width: 100%;
margin: 16% 11% 25% 11%;
&>div {
width: 70%;
margin: 0 auto;
}
}
.inner-wrapper {
position: absolute;
top: 50%;
left: 50%;
width: 1100px;
height: 646px;
margin-left: -550px;
margin-top: -298px;
background: url('./images/二连浩特登陆框.png') no-repeat top;
background-size: 100% 100%;
display: flex;
align-items: flex-end;
}
.left-imgbox {
width: 682px;
height: 596px;
background: url('./images/二连浩特登陆界面配图-动态.gif') no-repeat center;
background-size: 100% 100%;
background-clip: border-box;
}
.img-wrapper {
width: 388px;
height: 134px;
background: url('./images/1.png') no-repeat center;
background-size: 100% 100%;
margin-bottom: 48px;
}
.login .inner-bg img[role="logo"] {
height: 40px;
}
.login .inner-bg .title {
font-size: 27px;
font-weight: bold;
color: rgba(255, 255, 255, 1);
letter-spacing: 2px;
}
@keyframes waving { @keyframes waving {
from { from {
...@@ -85,130 +20,197 @@ ...@@ -85,130 +20,197 @@
} }
} }
.form-control:focus { .erlianhaotelogin {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.inner-center {
width: 418px;
height: 596px;
border-radius: 0px 0px 15px 15px;
display: flex;
flex-flow: column;
align-items: center;
}
.welcome-title{
width: 100%; width: 100%;
height: 178px; height: 100%;
background: url('./images/乐山登录背景.png') no-repeat center;
background-size: 100% 100%;
background-clip: border-box;
position: relative;
min-height: 7.0rem;
overflow: hidden;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: flex-end;
}
.formgroup2 {
display: flex;
align-items: center; align-items: center;
display: flex; .inner-bg {
margin: 0px 5.5%; // width: 78%;
margin-bottom: 10%; width: 100%;
align-items: center; margin: 16% 11% 25% 11%;
margin-bottom: 40px;
}
&>div {
.APPcodeBox { width: 70%;
width: 100%; margin: 0 auto;
display: flex; }
flex-flow: column; }
align-items: center;
cursor: pointer; .inner-wrapper {
position: relative; position: absolute;
} top: 50%;
left: 50%;
.APPCtext { width: 1100px;
font-size: 14px; height: 646px;
font-family: Microsoft YaHei; margin-left: -550px;
font-weight: 400; margin-top: -298px;
color: #000000; background: url('./images/二连浩特登陆框.png') no-repeat top;
line-height: 30px; background-size: 100% 100%;
opacity: 0.75; display: flex;
} align-items: flex-end;
}
.APPCimg {
width: 138px; .left-imgbox {
height: 150px; width: 682px;
background: url('./images/3.png'); height: 596px;
background-size: 100% 100%; background: url('./images/二连浩特登陆界面配图-动态.gif') no-repeat center;
background-repeat: no-repeat; background-size: 100% 100%;
display: none; background-clip: border-box;
position: absolute; }
top: 20px;
left: 50%; .img-wrapper {
transform: translateX(-50%); width: 388px;
padding: 23px 11px 12px; height: 134px;
background: url('./images/1.png') no-repeat center;
span { background-size: 100% 100%;
font-size: 12px; margin-bottom: 48px;
opacity: 0.75;
} }
}
.APPcodeBox:hover .APPCtext {
color: #1685FF;
}
.APPcodeBox:hover .APPCimg {
display: flex;
}
.APPCimg .codeCase {
text-align: center;
padding-top: 32px;
}
.login-header{ .inner-bg img[role="logo"] {
width: 100%; height: 40px;
position: absolute; }
top: 20px;
padding: 0 32px; .inner-bg .title {
display: flex; font-size: 27px;
justify-content: space-between; font-weight: bold;
align-items: center; color: rgba(255, 255, 255, 1);
letter-spacing: 2px;
}
.left-title{ .form-control:focus {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.inner-center {
width: 418px;
height: 596px;
border-radius: 0px 0px 15px 15px;
display: flex;
flex-flow: column;
align-items: center;
} }
.right-timebox{
.welcome-title{
width: 100%;
height: 178px;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: flex-end;
}
.formgroup2 {
display: flex;
align-items: center;
display: flex;
margin: 0px 5.5%;
margin-bottom: 10%;
align-items: center;
margin-bottom: 40px;
}
.APPcodeBox {
width: 100%;
display: flex;
flex-flow: column;
align-items: center; align-items: center;
height: 60px; cursor: pointer;
.curr-time{ position: relative;
width: 140px; }
font-size: 36px;
font-family: Microsoft YaHei; .APPCtext {
font-weight: 300; font-size: 14px;
color: #FFFFFF; font-family: Microsoft YaHei;
font-weight: 400;
color: #000000;
line-height: 30px;
opacity: 0.75;
}
.APPCimg {
width: 138px;
height: 150px;
background: url('./images/3.png');
background-size: 100% 100%;
background-repeat: no-repeat;
display: none;
position: absolute;
top: 20px;
left: 50%;
transform: translateX(-50%);
padding: 23px 11px 12px;
span {
font-size: 12px;
opacity: 0.75;
} }
.curr-week-date{ }
margin-left: 10px;
.curr-week{ .APPcodeBox:hover .APPCtext {
font-size: 16px; color: #1685FF;
}
.APPcodeBox:hover .APPCimg {
display: flex;
}
.APPCimg .codeCase {
text-align: center;
padding-top: 32px;
}
.login-header{
width: 100%;
position: absolute;
top: 20px;
padding: 0 32px;
display: flex;
justify-content: space-between;
align-items: center;
.left-title{
}
.right-timebox{
display: flex;
justify-content: center;
align-items: center;
height: 60px;
.curr-time{
width: 140px;
font-size: 36px;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-weight: 400; font-weight: 300;
color: #FFFFFF; color: #FFFFFF;
} }
.curr-date{ .curr-week-date{
font-size: 14px; margin-left: 10px;
font-family: Microsoft YaHei; .curr-week{
font-weight: 400; font-size: 16px;
color: #FFFFFF; font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
}
.curr-date{
font-size: 14px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
}
} }
} }
} }
:global{ :global{
...@@ -254,8 +256,10 @@ ...@@ -254,8 +256,10 @@
border-color: #00BDA0 !important; border-color: #00BDA0 !important;
} }
} }
} }
src/pages/user/login/template/project/xingan/index.js
View file @ 91abc7fb
...@@ -152,7 +152,7 @@ const Login = forwardRef((props, _ref) => { ...@@ -152,7 +152,7 @@ const Login = forwardRef((props, _ref) => {
<title>{props.global.title || defaultSetting.title}</title> <title>{props.global.title || defaultSetting.title}</title>
<meta name="description" content={props.global.title || defaultSetting.title} /> <meta name="description" content={props.global.title || defaultSetting.title} />
</Helmet> </Helmet>
<div className={styles.login}> <div className={styles.xinganlogin}>
<div className={styles['inner-wrapper']}> <div className={styles['inner-wrapper']}>
{/* <div className={styles['left-imgbox']}></div> */} {/* <div className={styles['left-imgbox']}></div> */}
<div className={styles['inner-center']}> <div className={styles['inner-center']}>
......
src/pages/user/login/template/project/xingan/index.less
View file @ 91abc7fb
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
src: url('@/assets/fonts/PingFang.ttf'); src: url('@/assets/fonts/PingFang.ttf');
} }
.login { .xinganlogin {
width: 100%; width: 100%;
height: 100%; height: 100%;
background: url('./images/6.png') no-repeat; background: url('./images/6.png') no-repeat;
...@@ -15,40 +15,193 @@ ...@@ -15,40 +15,193 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
}
.login .inner-bg { .inner-bg {
width: 100%; width: 100%;
height: 100%; height: 100%;
&>div {
width: 70%;
margin: 0 auto;
}
}
.inner-wrapper {
// width: 800px;
// height: 400px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 10px;
position: absolute;
bottom: 20%;
// top: 46%;
// right: 0;
// transform: translateY(-50%);
}
.inner-bg .title {
font-size: 27px;
font-weight: bold;
color: rgba(255, 255, 255, 1);
letter-spacing: 2px;
}
.form-control:focus {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.inner-center {
position: relative;
width: 482px;
height: 316px;
background: rgba(255,255,255,0.3);
border: 1px solid #FFFFFF;
box-shadow: 0px 15px 15px 3px rgba(140,142,145,0.52);
border-radius: 15px;
}
.welcome-title{
width: 100%;
height: 68px;
line-height: 68px;
font-size: 24px;
font-family: PingFang SC;
font-weight: bold;
color: #000000;
opacity: 0.85;
text-align: center;
}
.formgroup2 {
display: flex;
align-items: center;
display: flex;
margin: 0px 5.5%;
margin-bottom: 10%;
align-items: center;
margin-bottom: 40px;
}
&>div { .APPcodeBox {
width: 70%; width: 100%;
display: flex;
flex-flow: column;
align-items: center;
cursor: pointer;
position: relative;
}
.APPCtext {
font-size: 14px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #000000;
line-height: 30px;
opacity: 0.75;
}
.login-header{
width: 100%;
position: absolute;
top: 4%;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto; margin: 0 auto;
.left-title{
display: flex;
justify-content: center;
align-items: center;
.cn-title{
font-size: 48px;
font-family: PingFang SC;
font-weight: bold;
color: #A6D1FF;
background: linear-gradient(180deg, #00B3FF 0%, #0173B7 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin-bottom: 25px;
}
.logo-png{
width: 107px;
height: 111px;
}
}
.right-timebox{
display: flex;
justify-content: center;
align-items: center;
height: 60px;
.curr-time{
width: 140px;
font-size: 36px;
font-family: Microsoft YaHei;
font-weight: 300;
color: #FFFFFF;
}
.curr-week-date{
margin-left: 10px;
.curr-week{
font-size: 16px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
}
.curr-date{
font-size: 14px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
}
}
}
}
.copyright{
position: absolute;
bottom: 7%;
width: 100%;
margin: 0 auto;
font-size: 12px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #F1F6FD;
text-align: center;
}
.qrcode-box{
position: absolute;
bottom: 0;
right: -35px;
width: 35px;
height: 35px;
background: #FFFFFF;
opacity: 0.8;
cursor: pointer;
}
:global{
.@{ant-prefix}-popover-inner-content{
display: flex;
justify-content: center;
align-items: center;
}
.@{ant-prefix}-popover-title{
display: flex;
justify-content: center;
align-items: center;
}
} }
} }
.inner-wrapper {
// width: 800px;
// height: 400px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 10px;
position: absolute;
bottom: 20%;
// top: 46%;
// right: 0;
// transform: translateY(-50%);
}
.login .inner-bg .title {
font-size: 27px;
font-weight: bold;
color: rgba(255, 255, 255, 1);
letter-spacing: 2px;
}
@keyframes waving { @keyframes waving {
from { from {
...@@ -70,151 +223,10 @@ ...@@ -70,151 +223,10 @@
} }
} }
.form-control:focus {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.inner-center {
position: relative;
width: 482px;
height: 316px;
background: rgba(255,255,255,0.3);
border: 1px solid #FFFFFF;
box-shadow: 0px 15px 15px 3px rgba(140,142,145,0.52);
border-radius: 15px;
}
.welcome-title{
width: 100%;
height: 68px;
line-height: 68px;
font-size: 24px;
font-family: PingFang SC;
font-weight: bold;
color: #000000;
opacity: 0.85;
text-align: center;
}
.formgroup2 {
display: flex;
align-items: center;
display: flex;
margin: 0px 5.5%;
margin-bottom: 10%;
align-items: center;
margin-bottom: 40px;
}
.APPcodeBox {
width: 100%;
display: flex;
flex-flow: column;
align-items: center;
cursor: pointer;
position: relative;
}
.APPCtext {
font-size: 14px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #000000;
line-height: 30px;
opacity: 0.75;
}
.login-header{
width: 100%;
position: absolute;
top: 4%;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto;
.left-title{
display: flex;
justify-content: center;
align-items: center;
.cn-title{
font-size: 48px;
font-family: PingFang SC;
font-weight: bold;
color: #A6D1FF;
background: linear-gradient(180deg, #00B3FF 0%, #0173B7 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin-bottom: 25px;
}
.logo-png{
width: 107px;
height: 111px;
}
}
.right-timebox{
display: flex;
justify-content: center;
align-items: center;
height: 60px;
.curr-time{
width: 140px;
font-size: 36px;
font-family: Microsoft YaHei;
font-weight: 300;
color: #FFFFFF;
}
.curr-week-date{
margin-left: 10px;
.curr-week{
font-size: 16px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
}
.curr-date{
font-size: 14px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
}
}
}
}
.copyright{
position: absolute;
bottom: 7%;
width: 100%;
margin: 0 auto;
font-size: 12px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #F1F6FD;
text-align: center;
}
.qrcode-box{
position: absolute;
bottom: 0;
right: -35px;
width: 35px;
height: 35px;
background: #FFFFFF;
opacity: 0.8;
cursor: pointer;
}
:global{
.@{ant-prefix}-popover-inner-content{
display: flex;
justify-content: center;
align-items: center;
}
.@{ant-prefix}-popover-title{
display: flex;
justify-content: center;
align-items: center;
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment