chore: 修改首页

src/pages/user/login/template/project/tieshan/index.js

@@ -27,7 +27,7 @@ const TieShanLogin = forwardRef((props, _ref) => {
     const [visible, setVisible] = useState(false);
     const history = useHistory();
     const [dateObj, setDateObj] = useState({});
-    const {projectName} = props.loginParams
+    const { projectName } = props.loginParams
     const [action, setAction] = useState(
         () =>
             new LoginAction(Object.assign({}, props, { history }), setVisible, false),
@@ -174,6 +174,7 @@ const TieShanLogin = forwardRef((props, _ref) => {
                         </div>
                     </div>
                 </div>
+                <div className={styles['login-header-wrapper']}>
                     <div className={styles['login-header']}>
                         <div className={styles['left-title']}>
                             <div>
@@ -189,8 +190,9 @@ const TieShanLogin = forwardRef((props, _ref) => {
                             </div>
                         </div>
                     </div>
+                </div>
                 <div className={styles['krpano']}>
-                    <Krpano projectName = {projectName}/>
+                    <Krpano projectName={projectName} />
                 </div>
                 <Modal centered visible={visible} width={340} footer={null} closable={false} bodyStyle={{ padding: '15px' }}>
                     <div ref={sliVerify} />

src/pages/user/login/template/project/tieshan/index.less

-.tieshanLogin{
+.tieshanLogin {
     width: 100%;
     height: 100%;
     position: relative;
@@ -12,7 +12,6 @@
         width: 100%;
         height: 100%;
 
-    
         &>div {
             width: 70%;
             margin: 0 auto;
@@ -24,6 +23,7 @@
         font-weight: bold;
         color: rgba(255, 255, 255, 1);
         letter-spacing: 2px;
+
     }
 
     .form-control:focus {
@@ -45,7 +45,7 @@
         top: 50%;
         transform: translate(-50%, -50%);
         z-index: 100;
-        background-color: rgba(255, 255, 255, .4);
+
         // bottom: 20%;
         //   top: 46%;
         //   right: 0;
@@ -55,15 +55,15 @@
 
     .inner-center {
         position: relative;
-        width: 482px;
-        height: 316px;
-        background: rgba(255,255,255,0.3);
+        width: 400px;
+        // height: 316px;
+        background: rgba(255, 255, 255, 0.9);
         border: 1px solid #FFFFFF;
-        box-shadow: 0px 15px 15px 3px rgba(140,142,145,0.52);
+        box-shadow: 0px 15px 15px 3px rgba(140, 142, 145, 0.52);
         border-radius: 15px;
     }
 
-    .welcome-title{
+    .welcome-title {
         width: 100%;
         height: 68px;
         display: flex;
@@ -71,17 +71,20 @@
         justify-content: center;
         align-items: center;
         flex-wrap: nowrap;
-        background: linear-gradient(#0061E4 , #00CEFA);
+        background: linear-gradient(#0061E4, #00CEFA);
         margin-bottom: 24px;
         border-top-left-radius: 15px;
         border-top-right-radius: 15px;
-        .welcome-split{
+        background-color: rgba(255, 255, 255, .9);
+
+        .welcome-split {
             height: 30px;
             width: 1px;
             background-color: #eee;
             margin: 0 20px;
         }
-        .welcome-slogan{
+
+        .welcome-slogan {
             vertical-align: middle;
             margin-top: 3px;
         }
@@ -125,28 +128,38 @@
     }
 
 
-    .login-header{
+
+    .login-header-wrapper {
+
         width: 100%;
         position: absolute;
         top: 0;
+        background: linear-gradient(to bottom ,rgba(56,158,239, 1), rgba(56,158,239, 0));
+        height: 100px;
+        z-index: 100;
+
+        .login-header {
+            position: relative;
+            width: 100%;
             padding: 0 38px;
             display: flex;
             justify-content: space-between;
             align-items: center;
-        z-index: 100;
-        background: url('./images/header.png');
-        .left-title{
+
+            .left-title {
                 display: flex;
                 justify-content: flex-start;
                 align-items: center;
-            .cn-title{
+
+                .cn-title {
                     font-size: 26px;
                     font-family: Microsoft YaHei;
                     font-weight: 400;
                     color: #FFFFFF;
                     margin-left: 10px;
                 }
-            .en-title{
+
+                .en-title {
                     font-size: 12px;
                     font-family: Microsoft YaHei;
                     font-weight: 400;
@@ -154,27 +167,32 @@
                     opacity: 0.65;
                 }
             }
-        .right-timebox{
+
+            .right-timebox {
                 display: flex;
                 justify-content: center;
                 align-items: center;
                 height: 60px;
-            .curr-time{
+
+                .curr-time {
                     width: 140px;
                     font-size: 36px;
                     font-family: Microsoft YaHei;
                     font-weight: 300;
                     color: #FFFFFF;
                 }
-            .curr-week-date{
+
+                .curr-week-date {
                     margin-left: 10px;
-                .curr-week{
+
+                    .curr-week {
                         font-size: 16px;
                         font-family: Microsoft YaHei;
                         font-weight: 400;
                         color: #FFFFFF;
                     }
-                .curr-date{
+
+                    .curr-date {
                         font-size: 14px;
                         font-family: Microsoft YaHei;
                         font-weight: 400;
@@ -184,7 +202,9 @@
             }
         }
 
-    .copyright{
+    }
+
+    .copyright {
         position: absolute;
         bottom: 7%;
         width: 100%;
@@ -195,7 +215,8 @@
         color: #F1F6FD;
         text-align: center;
     }
-    .qrcode-box{
+
+    .qrcode-box {
         position: absolute;
         bottom: 0;
         right: -35px;
@@ -206,7 +227,7 @@
         cursor: pointer;
     }
 
-    .krpano{
+    .krpano {
         position: absolute;
         left: 0;
         top: 0;