whao 2 лет назад
Родитель
Сommit
96756fb3f3
2 измененных файлов с 28 добавлено и 6 удалено
  1. 1 0
      src/assets/styles/base.scss
  2. 27 6
      src/components/v-fastmenu.vue

+ 1 - 0
src/assets/styles/base.scss

@@ -24,6 +24,7 @@ $shadowList: 0 0 1rem 0 rgba($color: #0b1b25, $alpha:.8);
 $shadowTitle: 0 -0.2rem .5rem 0.3rem rgba($color: #19db3f, $alpha: .09) inset;
 $shadowListHover:rgba($color: #0567c2, $alpha: .7) 0px 0px 50px inset;
 $shadowListHoverI:0 0 3px rgba($color: #41ff84, $alpha: .5), -0 -0 10px rgba($color: #41fff8, $alpha: .9);
+$shadowTip: 0 0 1rem 0 rgba($color: #387ee7, $alpha:.8) inset;
 
 //可视化 数字林业
 $fBlue:#03c6e2;

+ 27 - 6
src/components/v-fastmenu.vue

@@ -7,7 +7,7 @@
 			<a  @click="backToMainPage" class="header-right">
 				<span><i class="el-icon-monitor"></i>管理端</span>
 			</a> -->
-			<el-popover placement="top-start" trigger="click" width="300px">
+			<el-popover placement="top-start" trigger="hover" width="300px">
 				<div class="user-tip">
 					<div class="u-tip-1">
 						<img src="@/assets/images/user-photo.png" />
@@ -22,12 +22,12 @@
 						<el-button type="primary" size="small">修改密码</el-button>
 						<el-button type="warning" size="small">退出登录</el-button>
 					</div>
-					<a><i class="el-icon-s-home"></i>返回首页</a>
-					<a><i class="el-icon-monitor"></i>管理端</a>
-
+					<a href="#" style="border-top: 1px solid #334780;"><i class="el-icon-s-home"></i>返回首页</a>
+					<a href="#"><i class="el-icon-monitor"></i>管理系统</a>
+				</div>
+				<div slot="reference" style="text-align: center; width:4rem;height:3rem;">
+					<img src="@/assets/images/mascot-small.png" />
 				</div>
-				<div slot="reference" style="text-align: center; width:4rem;height:3rem;"><img
-						src="@/assets/images/mascot-small.png" /></div>
 			</el-popover>
 		</div>
 	</div>
@@ -112,6 +112,22 @@
 				}
 			}
 		}
+
+		a {
+			color: $inBlue;
+			display: flex;
+			border-bottom: 1px solid #334780;
+			justify-content: center;
+			align-items: center;
+			height: 2rem;
+			i{
+				margin-right:.3rem ;
+			}
+		}
+		a:hover{
+			color: $inBlueHover;
+			box-shadow:$shadowTip
+		}
 	}
 
 
@@ -137,4 +153,9 @@
 
 
 	}
+	.el-popover{
+		background:#0c1327;
+		border:1px solid #334780; 
+		box-shadow:$shadowListHover
+	}
 </style>