subtle adjust

src/layout/components/Navbar.vue

@@ -1,27 +1,24 @@
 <template>
-  <div class="navbar" :style="showTitle ? 'background: rgba(8,17,50,0.25)' : ''" style="padding-right: 23px;">
+  <div class="navbar" :style="showTitle ? 'background: rgba(8,17,50,0.25)' : ''">
-    <hamburger
+    <div v-if="showTitle" class="homeNavIcon" @click="goToRootPage">
-      v-if="showhome"
-      id="hamburger-container"
-      :is-active="sidebar.opened"
-      class="hamburger-container"
-      @toggleClick="toggleSideBar"
-    />
-
-    <div
-      v-if="showTitle"
-      style="cursor: pointer; color: #fff;font-size: 22px; float: left; letter-spacing: 1px; font-weight: 500; padding-left: 24px; marginTop: 5px"
-      @click="goToRootPage"
-    >
       <img
         src="../../assets/img/cnbm.png"
         style="width: 26px; height: 26px; position: relative; top: 6px; marginRight: 14px"
         alt=""
-      >
+      />
       {{ 'title' | i18nFilter }}
     </div>
 
-    <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
+    <div v-if="showhome" style="display:flex; align-items: center;">
+      <hamburger
+        id="hamburger-container"
+        :is-active="sidebar.opened"
+        class="hamburger-container"
+        @toggleClick="toggleSideBar"
+      />
+
+      <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
+    </div>
 
     <div class="right-menu">
       <div v-if="showhome" class="right-menu-back" @click="toHome">
@@ -96,7 +93,7 @@
         trigger="click"
       >
         <div class="avatar-wrapper">
-          <img :src="require('@/assets/img/head.png')" class="user-avatar">
+          <img :src="require('@/assets/img/head.png')" class="user-avatar" />
           <div class="avatar-username" :title="username">{{ username }}</div>
           <div class="avatar-roles" :title="roles.join(',')">{{ roles.length > 0 ? roles[0] : '' }}</div>
           <!-- <i class="el-icon-caret-bottom" /> -->
@@ -143,7 +140,7 @@
         <el-tooltip class="item" effect="dark" placement="bottom-end">
           <div slot="content">
             {{ 'copyright.copyright' | i18nFilter }}：{{ 'copyright.company' | i18nFilter }}
-            <br>
+            <br />
             {{ 'copyright.version' | i18nFilter }}：3.0
           </div>
           <svg-icon
@@ -328,15 +325,32 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.time-menu {
-  display: inline-block;
-}
 .navbar {
-  height: 48px;
+  // height: 48px;
+  height: calc(100vh / 1600 * 80);
   overflow: hidden;
   position: relative;
   background: #fff;
   box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+  padding-right: calc(100vw / 2560 * 32);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .homeNavIcon {
+    cursor: pointer;
+    color: #fff;
+    font-size: calc(100vh / 1600 * 32);
+    line-height: 1;
+    float: left;
+    letter-spacing: 1px;
+    font-weight: 500;
+    padding-left: calc(100vw / 2560 * 32);
+
+    * {
+      vertical-align: middle;
+    }
+  }
 
   .hamburger-container {
     line-height: 48px;

src/views/3DOverview/components/TechyBox.vue

@@ -10,11 +10,12 @@ export default {}
 
 <style scoped>
 .techy-box {
-  background: transparent;
+  background: rgba(255, 255, 255, 0.0168);
-  box-shadow: inset 0 0 16px 1px rgba(255, 255, 255, 0.5);
+  box-shadow: inset 0 0 17px 0 rgba(255, 255, 255, 0.168);
   display: inline-block;
   height: 100%;
   width: 100%;
-  border-radius: .25rem;
+  border-radius: 4px;
+  backdrop-filter: blur(2px);
 }
 </style>

src/views/3DOverview/components/TechyContainer.vue

@@ -75,7 +75,7 @@ export default {
   box-shadow: inset 0px 0px 20px 0px rgba(255, 255, 255, 0.15);
   /* background: rgba(20, 69, 100, 0.425); */
   background: rgba(6, 16, 39, 0.3);
-  backdrop-filter: blur(1px);
+  backdrop-filter: blur(2px);
 }
 
 .line {

src/views/3DOverview/index.vue

@@ -1,9 +1,9 @@
 <template>
   <div id="v3d-outter" ref="v3d-outter">
-    <V3DApp @3d-loaded="handle3DLoaded" />
+    <!-- <V3DApp @3d-loaded="handle3DLoaded" /> -->
     <!-- 正式内容: -->
-    <div v-if="showPage" id="v3d-main-content">
+    <!-- <div v-if="showPage" id="v3d-main-content"> -->
-      <!-- <div v-if="true" id="v3d-main-content"> -->
+      <div v-if="true" id="v3d-main-content">
       <techy-header :head-title="'合肥新能源数字工厂总览'" @toggle-full-screen="toggleFullScreen" />
 
       <section id="techy-body-part">
@@ -207,7 +207,8 @@ export default {
   padding: calc(100vmin / 1920 * 36);
   padding-bottom: 0;
   display: flex;
-  justify-content: space-between;
+  /* justify-content: space-between; */
+  gap: calc(100vmin / 1920 * 36);
 }
 
 .bottom-part {
@@ -243,16 +244,21 @@ export default {
 }
 
 .techy-body-part__middle {
+  flex: 1;
+  position: relative;
+}
+
+.techy-body-part__middle .techy-box {
   position: absolute;
-  top: 9%;
+  top: 0;
-  left: 26%;
+  left: 0;
   height: 136px;
   width: 176px;
 }
 
 .techy-body-part__middle__inner {
   height: 100%;
-  padding: 12px;
+  padding: 16px;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
@@ -270,11 +276,16 @@ export default {
   position: relative;
   padding-left: 16px;
 }
+
+.techy-body-part__middle__inner p > span.round-dot {
+  padding-left: 28px;
+}
+
 .round-dot::before {
   content: '';
   position: absolute;
   top: 4px;
-  left: 2px;
+  left: 16px;
   width: 8px;
   height: 8px;
   background-color: rgb(82, 231, 82);

src/views/ChoicePart/index.vue

@@ -12,7 +12,7 @@
       >
         <!-- :style="{ background: colorArr.colorList[index % 9] }" -->
         <div class="choicepart-item-border">
-          <img :src="require(`../../assets/img/choicepart/${item.name}.png`)" alt="">
+          <img :src="require(`../../assets/img/choicepart/${item.name}.png`)" alt="" />
         </div>
         <div class="choicepart-item-title" :title="item.meta.title">{{ item.meta.title }}</div>
       </div>
@@ -147,12 +147,14 @@ export default {
   background: url('../../assets/img/choicepart/choicepart-back.jpg') repeat;
   background-size: 100% 100%;
   overflow-x: scroll;
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
   .choicepart-box {
     width: 1440px;
-    margin: 0 auto;
+
-    margin: 0 auto;
-    padding-top: 16vh;
-    min-height: 100vh;
     .choicepart-item {
       display: inline-block;
       width: 208px;