Accueil Explorer Aide
Connexion
S.H.I.E.L.D.
/
measureSAAS.v2.APP
3
0
Fork 0
Fichiers Tickets 0 Pull Requests 0 Wiki
Parcourir la source

登录login-cyan的新版

outaozhen il y a 3 ans
Parent
d59bac66e9
commit
1e6f96bfe2
19 fichiers modifiés avec 362 ajouts et 0 suppressions
Vue séparée Afficher les stats Diff
  1. BIN
      css/bg/cyanBg/bg.png
  2. BIN
      css/bg/cyanBg/iamge_mobile_slogan.png
  3. BIN
      css/bg/cyanBg/iamge_pc_slogan.png
  4. BIN
      css/bg/cyanBg/image_welcometo.png
  5. 156 0
      css/cyanLogin.css
  6. BIN
      img/1564729538.png
  7. BIN
      img/bitbug_favicon.ico
  8. BIN
      img/cyanImg/bg.png
  9. BIN
      img/cyanImg/iamge_mobile_slogan.png
  10. BIN
      img/cyanImg/icon_login_pc.png
  11. BIN
      img/cyanImg/icon_login_qr.png
  12. BIN
      img/cyanImg/image_logo.png
  13. BIN
      img/cyanImg/image_welcometo.png
  14. BIN
      img/icon_login_folder.png
  15. BIN
      img/icon_login_lock.png
  16. BIN
      img/icon_login_user.png
  17. 83 0
      login-cyan-on.html
  18. 48 0
      login-cyan-weixin.html
  19. 75 0
      login-cyan.html

BIN
css/bg/cyanBg/bg.png
Voir le fichier


BIN
css/bg/cyanBg/iamge_mobile_slogan.png
Voir le fichier


BIN
css/bg/cyanBg/iamge_pc_slogan.png
Voir le fichier


BIN
css/bg/cyanBg/image_welcometo.png
Voir le fichier


+ 156 - 0
css/cyanLogin.css
Voir le fichier 

@@ -0,0 +1,156 @@
 
+body {
 
+    font-size: 0.9rem;
 
+    overflow: hidden;
 
+    background: #e4e7ea;
 
+
 
+}
 
+a{
 
+  color: rgba(13, 157, 173, 1);
 
+}
 
+.login-new-body{
 
+  width: 100%;
 
+  height: 100%;
 
+  /*background-position:25% 95%;
 
+  background-size: 40% auto;
 
+  display: inline-block;
 
+  opacity: .8*/
 
+  /*animation: change 60s steps(1) infinite;*/
 
+}
 
+.login-new-body.img-1{
 
+  width: 100%;
 
+  height: 100%;
 
+  background: url(bg/cyanBg/bg.png) no-repeat;
 
+  /*background:#192948 url(https://jiliang-qa.oss-cn-shenzhen.aliyuncs.com/loginimg/bg_01.jpg) no-repeat;*/
 
+  background-size: 100% 100%;
 
+  background-size:cover;
 
+  /*background-size: contain;*/
 
+}
 
+/*@keyframes change {
 
+  0% {
 
+  background-image: url(bg/bg_06.png);
 
+  }
 
+  16% {
 
+  background-image: url(bg/bg_01.png);
 
+  }
 
+  32% {
 
+  background-image: url(bg/bg_02.png)
 
+  }
 
+  48% {
 
+  background-image: url(bg/bg_03.png)
 
+  }
 
+  64% {
 
+  background-image: url(bg/bg_04.png)
 
+  }
 
+  80% {
 
+  background-image: url(bg/bg_05.png)
 
+  }
 
+}*/
 
+/*.login-new-b{
 
+  border-right: 2px solid rgba(255, 255, 255, 0.6);
 
+}*/
 
+.logo-big-title{
 
+  font-size: 14px;
 
+}
 
+.logo-sm-title{
 
+  font-size: 12px;
 
+  color: rgba(255, 255, 255, 0.8);
 
+}
 
+/*.sloganImgBox{
 
+  width: 315px;
 
+  height: 105px;
 
+  background: url(bg/cyanBg/iamge_mobile_slogan.png) no-repeat;
 
+}*/
 
+.side-border{
 
+  width: 2px;
 
+  height: 24px;
 
+  background: rgba(255, 255, 255, 0.6);
 
+}
 
+.sloganWid{
 
+  margin: 0 35px;
 
+}
 
+.sloganLeftText{
 
+  font-size: 16px;
 
+  color: #fff;
 
+  font-weight: 600;
 
+}
 
+.top-subtitle{
 
+  font-size: 12px;
 
+  font-weight: 500;
 
+  color: rgb(255, 255, 255);
 
+}
 
+.right-login{
 
+  margin: 0 35px;
 
+  border-radius: 8px;
 
+  background: rgba(255, 255, 255, 1);
 
+}
 
+.right-login .position-absolute{
 
+  right: 12px;
 
+  top: 12px;
 
+}
 
+.login-border{
 
+  width: 48px;
 
+  height: 4px;
 
+  background: rgba(255, 255, 255, 1);
 
+}
 
+.erweima img{
 
+  width: 240px;
 
+  height: 240px;
 
+  padding: 12px;
 
+  background: #fff;
 
+  border: 1px solid rgba(0, 0, 0, 0.12);
 
+  border-radius: 4px;
 
+}
 
+.right-login .bottom-text{
 
+  padding-top: 5px;
 
+  font-size: 14px;
 
+  line-height: 18px;
 
+  color: rgba(0, 0, 0, 0.6);
 
+}
 
+.btnCyan{
 
+  background: rgba(16, 196, 216, 1);
 
+  border-color: rgba(16, 196, 216, 1);
 
+  color: #fff;
 
+}
 
+.btnCyan:hover{
 
+  color: #fff;
 
+  background-color: #0aa7b8;
 
+  border-color: #0aa7b8;
 
+}
 
+.has-danger {
 
+  -webkit-animation: shake 1s .2s ease both;
 
+  -moz-animation: shake 1s .2s ease both;
 
+  animation: shake 1s .2s ease both;
 
+}
 
+@-webkit-keyframes shake {
 
+  0%, 100% {
 
+    -webkit-transform: translateX(0);
 
+  }
 
+  10%, 30%, 50%, 70%, 90% {
 
+    -webkit-transform: translateX(-10px);
 
+  }
 
+  20%, 40%, 60%, 80% {
 
+    -webkit-transform: translateX(10px);
 
+  }
 
+}
 
+@-moz-keyframes shake {
 
+  0%, 100% {
 
+    -moz-transform: translateX(0);
 
+  }
 
+  10%, 30%, 50%, 70%, 90% {
 
+    -moz-transform: translateX(-10px);
 
+  }
 
+  20%, 40%, 60%, 80% {
 
+    -moz-transform: translateX(10px);
 
+  }
 
+}
 
+@keyframes shake {
 
+  0%, 100% {
 
+    transform: translateX(0);
 
+  }
 
+  10%, 30%, 50%, 70%, 90% {
 
+    transform: translateX(-10px);
 
+  }
 
+  20%, 40%, 60%, 80% {
 
+    transform: translateX(10px);
 
+  }
 
+}

BIN
img/1564729538.png
Voir le fichier


BIN
img/bitbug_favicon.ico
Voir le fichier


BIN
img/cyanImg/bg.png
Voir le fichier


BIN
img/cyanImg/iamge_mobile_slogan.png
Voir le fichier


BIN
img/cyanImg/icon_login_pc.png
Voir le fichier


BIN
img/cyanImg/icon_login_qr.png
Voir le fichier


BIN
img/cyanImg/image_logo.png
Voir le fichier


BIN
img/cyanImg/image_welcometo.png
Voir le fichier


BIN
img/icon_login_folder.png
Voir le fichier


BIN
img/icon_login_lock.png
Voir le fichier


BIN
img/icon_login_user.png
Voir le fichier


+ 83 - 0
login-cyan-on.html
Voir le fichier 

@@ -0,0 +1,83 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="utf-8">
 
+    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
 
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
 
+    <title>用户登录-计量支付</title>
 
+    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
 
+    <link rel="stylesheet" href="css/cyanLogin.css">
 
+    <link rel="stylesheet" href="css/font-awesome/font-awesome.min.css">
 
+    <link rel="shortcut icon" href="img/bitbug_favicon.ico">
 
+<style>
 
+html{height:100%;}
 
+</style>
 
+</head>
 
+<body class="login-new-body img-1">
 
+    <div class="container">
 
+      <div class="login-new-b loginCyanBox d-flex flex-row align-items-center mt-4">
 
+        <div>
 
+          <img src="img/cyanImg/image_logo.png" width="40">
 
+        </div>
 
+        <div class="ml-2">
 
+          <div class="logo-big-title text-white mt-1">纵横计量支付</div>
 
+          <div class="logo-sm-title mt-1">计量支付&nbsp;&nbsp;&nbsp;结算决算</div>
 
+        </div>
 
+        <div class="side-border ml-3 mr-3"></div>
 
+        <div class="top-subtitle">施工舒心 / 监理省心 / 业主安心</div>
 
+      </div>
 
+        <div class="row">
 
+          <div class="col-12 sloganImgBox mt-5 mb-4 text-left">
 
+            <div class="sloganWid sloganPt">
 
+              <div class="sloganLeftBTtile">
 
+                <div><img src="img/cyanImg/image_welcometo.png" width="255"></div>
 
+              </div>
 
+              <div class="sloganLeftText">安康至来凤国家高速公路奉节至巫山（渝鄂界）段</div>
 
+            </div>
 
+          </div>
 
+          <div class="col-12">
 
+            <div class="right-login position-relative text-center mt-4 pb-3">
 
+              <h3 class="pt-5 mb-4">欢迎登录</h3>
 
+              <div class="position-absolute"><a href="login-cyan-weixin.html"><img src="img/cyanImg/icon_login_qr.png"></a></div>
 
+              <div class="mx-4">
 
+                <from>
 
+                  <div class="input-group mb-4">
 
+                    <div class="input-group-prepend">
 
+                      <div class="input-group-text"><img src="img/icon_login_folder.png"></div>
 
+                    </div>
 
+                    <input type="text" class="form-control" placeholder="项目编号" value="IS6G7">
 
+                  </div>
 
+                  <div class="input-group mb-4">
 
+                    <div class="input-group-prepend">
 
+                      <div class="input-group-text"><img src="img/icon_login_user.png"></div>
 
+                    </div>
 
+                    <input type="text" class="form-control" placeholder="账号">
 
+                  </div>
 
+                  <div class="input-group mb-2">
 
+                    <div class="input-group-prepend">
 
+                      <div class="input-group-text"><img src="img/icon_login_lock.png"></div>
 
+                    </div>
 
+                    <input type="text" class="form-control" placeholder="密码">
 
+                  </div>
 
+                  <div class="form-group mb-4">
 
+                    <div class="form-check d-flex justify-content-start pl-0">
 
+                      <label class="form-check-label" for="exampleCheck1"><a href="#">忘记密码？</a></label>
 
+                    </div>
 
+                  </div>
 
+                  <a href="login-cyan-on.html" type="submit" class="btn btn-primary btnCyan btn-block">登&nbsp;&nbsp;录</a>
 
+                </from>
 
+              </div>
 
+            </div>
 
+          </div>
 
+        </div>
 
+       <!--  <div class="text-white fixed-bottom"><p class="text-center mb-1">Copyright © 2019 <a href="https://smartcost.com.cn" target="_blank" class="text-white">珠海纵横创新软件有限公司</a>.All Rights Reserved.<a class="text-white ml-2" href="http://www.miitbeian.gov.cn" target="_blank">粤ICP备14032472号</a></p></div> -->
 
+    </div>
 
+
 
+    <!-- JS. -->
 
+    <script src="js/jquery/jquery-3.2.1.min.js"></script>
 
+    <script src="js/popper/popper.min.js"></script>
 
+    <script src="js/bootstrap/bootstrap.min.js"></script>
 
+    <script src="js/global.js"></script>
 
+</body>
 
+
 
+</html>

+ 48 - 0
login-cyan-weixin.html
Voir le fichier 

@@ -0,0 +1,48 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="utf-8">
 
+    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
 
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
 
+    <title>用户登录-计量支付</title>
 
+    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
 
+    <link rel="stylesheet" href="css/cyanLogin.css">
 
+    <link rel="stylesheet" href="css/font-awesome/font-awesome.min.css">
 
+    <link rel="shortcut icon" href="img/bitbug_favicon.ico">
 
+<style>
 
+html{height:100%;}
 
+</style>
 
+</head>
 
+<body class="login-new-body img-1">
 
+    <div class="container">
 
+      <div class="login-new-b loginCyanBox d-flex flex-row align-items-center mt-4">
 
+        <div>
 
+          <img src="img/cyanImg/image_logo.png" width="40">
 
+        </div>
 
+        <div class="ml-2">
 
+          <div class="logo-big-title text-white mt-1">纵横计量支付</div>
 
+          <div class="logo-sm-title mt-1">计量支付&nbsp;&nbsp;&nbsp;结算决算</div>
 
+        </div>
 
+      </div>
 
+        <div class="row">
 
+          <div class="col-12 sloganImgBox mt-3 text-center"><img src="img/cyanImg/iamge_mobile_slogan.png"></div>
 
+          <div class="col-12">
 
+            <div class="right-login position-relative text-center mt-3 pb-3">
 
+              <h3 class="pt-5 mb-4">欢迎登录</h3>
 
+              <div class="position-absolute"><a href="login-cyan.html"><img src="img/cyanImg/icon_login_pc.png"></a></div>
 
+              <div class="erweima"><img src="img/1564729538.png"></div>
 
+              <div class="mt-4 bottom-text">请使用微信扫描二维码登录</br>“纵横云计量”</div>
 
+            </div>
 
+          </div>
 
+        </div>
 
+       <!--  <div class="text-white fixed-bottom"><p class="text-center mb-1">Copyright © 2019 <a href="https://smartcost.com.cn" target="_blank" class="text-white">珠海纵横创新软件有限公司</a>.All Rights Reserved.<a class="text-white ml-2" href="http://www.miitbeian.gov.cn" target="_blank">粤ICP备14032472号</a></p></div> -->
 
+    </div>
 
+
 
+    <!-- JS. -->
 
+    <script src="js/jquery/jquery-3.2.1.min.js"></script>
 
+    <script src="js/popper/popper.min.js"></script>
 
+    <script src="js/bootstrap/bootstrap.min.js"></script>
 
+    <script src="js/global.js"></script>
 
+</body>
 
+
 
+</html>

+ 75 - 0
login-cyan.html
Voir le fichier 

@@ -0,0 +1,75 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="utf-8">
 
+    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
 
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
 
+    <title>用户登录-计量支付</title>
 
+    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
 
+    <link rel="stylesheet" href="css/cyanLogin.css">
 
+    <link rel="stylesheet" href="css/font-awesome/font-awesome.min.css">
 
+    <link rel="shortcut icon" href="img/bitbug_favicon.ico">
 
+<style>
 
+html{height:100%;}
 
+</style>
 
+</head>
 
+<body class="login-new-body img-1">
 
+    <div class="container">
 
+      <div class="login-new-b loginCyanBox d-flex flex-row align-items-center mt-4">
 
+        <div>
 
+          <img src="img/cyanImg/image_logo.png" width="40">
 
+        </div>
 
+        <div class="ml-2">
 
+          <div class="logo-big-title text-white mt-1">纵横计量支付</div>
 
+          <div class="logo-sm-title mt-1">计量支付&nbsp;&nbsp;&nbsp;结算决算</div>
 
+        </div>
 
+      </div>
 
+        <div class="row">
 
+          <div class="col-12 sloganImgBox mt-3 text-center"><img src="img/cyanImg/iamge_mobile_slogan.png"></div>
 
+          <div class="col-12">
 
+            <div class="right-login position-relative text-center mt-3 pb-3">
 
+              <h3 class="pt-5 mb-4">欢迎登录</h3>
 
+              <div class="position-absolute"><a href="login-cyan-weixin.html"><img src="img/cyanImg/icon_login_qr.png"></a></div>
 
+              <div class="mx-4">
 
+                <from>
 
+                  <div class="input-group mb-4">
 
+                    <div class="input-group-prepend">
 
+                      <div class="input-group-text"><img src="img/icon_login_folder.png"></div>
 
+                    </div>
 
+                    <input type="text" class="form-control" placeholder="项目编号">
 
+                  </div>
 
+                  <div class="input-group mb-4">
 
+                    <div class="input-group-prepend">
 
+                      <div class="input-group-text"><img src="img/icon_login_user.png"></div>
 
+                    </div>
 
+                    <input type="text" class="form-control" placeholder="账号">
 
+                  </div>
 
+                  <div class="input-group mb-2">
 
+                    <div class="input-group-prepend">
 
+                      <div class="input-group-text"><img src="img/icon_login_lock.png"></div>
 
+                    </div>
 
+                    <input type="text" class="form-control" placeholder="密码">
 
+                  </div>
 
+                  <div class="form-group mb-4">
 
+                    <div class="form-check d-flex justify-content-start pl-0">
 
+                      <label class="form-check-label" for="exampleCheck1"><a href="#">忘记密码？</a></label>
 
+                    </div>
 
+                  </div>
 
+                  <a href="login-cyan-on.html" type="submit" class="btn btn-primary btnCyan btn-block">登&nbsp;&nbsp;录</a>
 
+                  <div class="alert alert-danger mt-1 mb-0 inputErrow" role="alert"><b>登录失败</b> 用户名或密码错误</div>
 
+                </from>
 
+              </div>
 
+            </div>
 
+          </div>
 
+        </div>
 
+       <!--  <div class="text-white fixed-bottom"><p class="text-center mb-1">Copyright © 2019 <a href="https://smartcost.com.cn" target="_blank" class="text-white">珠海纵横创新软件有限公司</a>.All Rights Reserved.<a class="text-white ml-2" href="http://www.miitbeian.gov.cn" target="_blank">粤ICP备14032472号</a></p></div> -->
 
+    </div>
 
+
 
+    <!-- JS. -->
 
+    <script src="js/jquery/jquery-3.2.1.min.js"></script>
 
+    <script src="js/popper/popper.min.js"></script>
 
+    <script src="js/bootstrap/bootstrap.min.js"></script>
 
+    <script src="js/global.js"></script>
 
+</body>
 
+
 
+</html>