Merge branch 'master' of https://git.luojigou.vip/luojigou_h5/zhongde_web

components/home/header.vue

@@ -4,7 +4,7 @@
     <div
       id="index-header"
       :class="[
-        headFixed == true ? 'fixedTop' : '',
+        headFixed ? 'fixedTop' : '',
         headWhite ? 'head-white' : '',
       ]"
     >
@@ -19,9 +19,7 @@
               <nuxt-link to="/" class="home">首页</nuxt-link>
             </li>
             <li :class="{ 'h-nav-li-more': productActive }">
-              <a class="h-nav-list-parent" href="javascript:void(0)"
-                >产品与服务</a
-              >
+              <a class="h-nav-list-parent" href="javascript:void(0)">产品与服务</a>
               <!-- <nuxt-link to="">产品与服务</nuxt-link> -->
               <ul class="h-nav-list-child">
                 <li>
@@ -90,6 +88,7 @@
             </li>
           </ul>
         </div>
+        <div :class="['h-btn', headWhite && 'blue']" @click="jumpTeach">教师登录</div>
         <!-- <div class="h-right">
           <div class="h-login btn">登录</div>
           <div class="h-regist btn">注册</div>
@@ -128,6 +127,10 @@ export default {
     this.handleRouterActive();
   },
   methods: {
+    jumpTeach() {
+      // window.location.href = "https://luojigou.vip/teacher_lib/#/";
+      window.open("https://luojigou.vip/teacher_lib/#/");
+    },
     handleScroll() {
       let scrollTop =
         window.pageYOffset ||
@@ -258,6 +261,7 @@ export default {
   }
 
   .index-header-box {
+    position: relative;
     height: 72px;
     display: flex;
     align-items: center;
@@ -279,9 +283,14 @@ export default {
   .i-h-nav {
     display: flex;
     align-items: center;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
     height: 72px;
     font-size: 15px;
-    margin-left: 100px;
+    white-space: nowrap;
+    //margin-left: 70px;
   }
 
   .h-nav-list {
@@ -292,7 +301,7 @@ export default {
     li {
       position: relative;
       display: inline-block;
-      padding: 0 50px;
+      padding: 0 40px;
       line-height: 72px;
       box-sizing: border-box;
       font-size: 15px;
@@ -377,9 +386,11 @@ export default {
       }
     }
     .h-nav-list-child {
+      display: flex;
+      flex-direction: column;
       position: absolute;
       width: 100px;
-      border-radius: 0px 0px 4px 4px;
+      border-radius: 0 0 4px 4px;
       overflow: hidden;
       max-height: 0;
       background: #ffffff;
@@ -432,5 +443,29 @@ export default {
       }
     }
   }
+
+  .h-btn {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: absolute;
+    right: 0;
+    top: 50%;
+    transform: translateY(-50%);
+    width: 108px;
+    height: 40px;
+    background: #FFFFFF;
+    border-radius: 26px;
+    font-size: 15px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #0D0827;
+    cursor: pointer;
+  }
+
+  .blue {
+    background-color: #236CFA;
+    color: #fff;
+  }
 }
 </style>