整体样式修改

gaoluyang

3 天以前 a88eab39f6b2f5c33913d51fac4e885c052ed4a1

 src/layout/components/Navbar.vue

@@ -1,13 +1,13 @@
<template>
  <div class="navbar">
<!--    <hamburger id="hamburger-container" :is-active="appStore.sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />-->
<!--    <breadcrumb v-if="!settingsStore.topNav" id="breadcrumb-container" class="breadcrumb-container" />-->
    <div v-if="sidebar.hide">
      <top-nav id="topmenu-container" class="topmenu-container" />
    </div>
    <div class="logo" v-if="!sidebar.hide">
      <img src="@/assets/logo/logo.png" alt=""/>
    </div>
    <hamburger id="hamburger-container" :is-active="appStore.sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
    <breadcrumb v-if="!settingsStore.topNav" id="breadcrumb-container" class="breadcrumb-container" />
<!--    <div v-if="sidebar.hide">-->
<!--      <top-nav id="topmenu-container" class="topmenu-container" />-->
<!--    </div>-->
<!--    <div class="logo" v-if="!sidebar.hide">-->
<!--      <img src="@/assets/logo/logo.png" alt=""/>-->
<!--    </div>-->
    <div class="right-menu">
      <template v-if="appStore.device !== 'mobile'">
        <header-search id="header-search" class="right-menu-item" />
@@ -23,9 +23,9 @@
            <router-link to="/user/profile">
              <el-dropdown-item>个人中心</el-dropdown-item>
            </router-link>
<!--            <el-dropdown-item command="setLayout" v-if="settingsStore.showSettings">-->
<!--              <span>布局设置</span>-->
<!--            </el-dropdown-item>-->
            <el-dropdown-item command="setLayout" v-if="settingsStore.showSettings">
              <span>布局设置</span>
            </el-dropdown-item>
            <el-dropdown-item divided command="logout">
              <span>退出登录</span>
            </el-dropdown-item>
@@ -137,24 +137,20 @@
.navbar {
  height: 50px;
  overflow: hidden;
  position: fixed; /* 将头部固定 */
  top: 0; /* 在顶部固定 */
  width: 100%; /* 宽度100%，覆盖整个视口 */
  //background-color: #f8f9fa; /* 设置背景颜色，以便更明显地看到效果 */
  z-index: 1000; /* 确保头部在其他内容之上 */
   position: relative;
  background: var(--navbar-bg);
  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
  display: flex;
  justify-content: space-between;
  padding: 0 20px;
  
  .logo {
    height: 50px;
    line-height: 50px;
    img {
   .hamburger-container {
      line-height: 46px;
      height: 100%;
      float: left;
      cursor: pointer;
      width: 146px;
      height: 46px;
      transition: background 0.3s;
      -webkit-tap-highlight-color: transparent;
		
      &:hover {
         background: rgba(0, 0, 0, 0.025);
    }
  }

@@ -164,6 +160,7 @@

  .topmenu-container {
    position: absolute;
      left: 50px;
  }

  .errLog-container {
@@ -176,6 +173,7 @@
    height: 100%;
    line-height: 50px;
    display: flex;
      margin-right: 30px;

    &:focus {
      outline: none;