صفحهٔ اصلی گشت‌و‌گذار راهنما
ثبت نام ورود
oscarleiva
/
energylink
1
0
انشعاب 0
پرونده‌ها مشکلات 0 درخواست واکشی 0 ویکی
فهرست منبع

poc(new sidenav/topnaav)

Torkel Ödegaard 10 سال پیش
والد
cd0256d40d
کامیت
4f227ae92e
5فایلهای تغییر یافته به همراه34 افزوده شده و 46 حذف شده
نمای یکپارچه نمایش آمار تفاوت ها
  1. 1 1
      public/app/features/dashboard/partials/dashboardTopNav.html
  2. 1 7
      public/app/partials/sidemenu.html
  3. 29 35
      public/less/sidemenu.less
  4. 1 1
      public/less/variables.dark.less
  5. 2 2
      public/views/index.html

+ 1 - 1
public/app/features/dashboard/partials/dashboardTopNav.html
مشاهده فایل 

@@ -4,7 +4,7 @@
 
 
 
 			<div class="top-nav">
 
 			<div class="top-nav">
 
 				<div class="top-nav-btn top-nav-menu-btn">
 
 				<div class="top-nav-btn top-nav-menu-btn">
 
-					<a class="pointer" ng-click="openSearch()">
 
+					<a class="pointer" ng-click="contextSrv.toggleSideMenu()">
 
 						<span class="top-nav-logo-background">
 
 						<span class="top-nav-logo-background">
 
 							<img class="logo-icon" src="img/fav32.png"></img>
 
 							<img class="logo-icon" src="img/fav32.png"></img>
 
 						</span>
 
 						</span>

+ 1 - 7
public/app/partials/sidemenu.html
مشاهده فایل 

@@ -1,12 +1,6 @@
 
 <div ng-controller="SideMenuCtrl" ng-init="init()">
 
 <div ng-controller="SideMenuCtrl" ng-init="init()">
 
 
 
 	<ul class="sidemenu sidemenu-main">
 
 	<ul class="sidemenu sidemenu-main">
 
-		<li style="margin-bottom: 15px;">
 
-			<a class="pointer sidemenu-top-btn" ng-click="contextSrv.toggleSideMenu()">
 
-				<img class="logo-icon" src="img/fav32.png"></img>
 
-				<i class="pull-right fa fa-angle-left"></i>
 
-			</a>
 
-		</li>
 
 
 
 		<li class="sidemenu-org-section dropdown" ng-if="contextSrv.isSignedIn">
 
 		<li class="sidemenu-org-section dropdown" ng-if="contextSrv.isSignedIn">
 
 			<div class="sidemenu-org" data-toggle="dropdown" ng-click="openUserDropdown()">
 
 			<div class="sidemenu-org" data-toggle="dropdown" ng-click="openUserDropdown()">
 
@@ -17,7 +11,7 @@
 
 					<span class="sidemenu-org-user sidemenu-item-text">{{contextSrv.user.name}}</span>
 
 					<span class="sidemenu-org-user sidemenu-item-text">{{contextSrv.user.name}}</span>
 
 					<span class="sidemenu-org-name sidemenu-item-text">{{contextSrv.user.orgName}}</span>
 
 					<span class="sidemenu-org-name sidemenu-item-text">{{contextSrv.user.orgName}}</span>
 
 				</div>
 
 				</div>
 
-				<i class="fa fa-caret-down small"></i>
 
+				<i class="fa fa-caret-right small"></i>
 
 			</div>
 
 			</div>
 
 			<ul class="dropdown-menu" role="menu">
 
 			<ul class="dropdown-menu" role="menu">
 
 				<li ng-repeat="menuItem in orgMenu" ng-class="menuItem.cssClass">
 
 				<li ng-repeat="menuItem in orgMenu" ng-class="menuItem.cssClass">

+ 29 - 35
public/less/sidemenu.less
مشاهده فایل 

@@ -4,12 +4,11 @@
 
 
 
 .sidemenu-wrapper {
 
 .sidemenu-wrapper {
 
   position: absolute;
 
   position: absolute;
 
-  display: none;
 
-  top: 0;
 
+  top: 51px;
 
   bottom: 0;
 
   bottom: 0;
 
   left: 0;
 
   left: 0;
 
   width: 200px;
 
   width: 200px;
 
-  background: @bodyBackground;
 
+  background-color: darken(@grafanaTargetFuncBackground, 2%);
 
   min-height: 100%;
 
   min-height: 100%;
 
   z-index: 101;
 
   z-index: 101;
 
 
 
@@ -39,7 +38,6 @@
 
   padding: 0;
 
   padding: 0;
 
 
 
   >li {
 
   >li {
 
-    margin-bottom: 9px;
 
   }
 
   }
 
 
 
   .fa-caret-down {
 
   .fa-caret-down {
 
@@ -61,25 +59,6 @@
 
   text-overflow: ellipsis;
 
   text-overflow: ellipsis;
 
 }
 
 }
 
 
 
-.sidemenu-top-btn {
 
-  display: block;
 
-  padding: 8px 0 4px 22px;
 
-  background-color: @navbarBackground;
 
-  img {
 
-    border-radius: 50%;
 
-    background: @iconContainerBackground;
 
-    border: 1px solid @bodyBackground;
 
-    width: 30px;
 
-    padding: 4px;
 
-  }
 
-  i {
 
-    padding-right: 5px;
 
-    padding-top: 5px;
 
-    font-size: 170%;
 
-    color: @linkColor;
 
-  }
 
-}
 
-
 
 .icon-circle {
 
 .icon-circle {
 
   width: 40px;
 
   width: 40px;
 
   height: 40px;
 
   height: 40px;
 
@@ -100,10 +79,13 @@
 
 
 
 .sidemenu-item {
 
 .sidemenu-item {
 
   color: @linkColor;
 
   color: @linkColor;
 
-  line-height: 40px;
 
+  line-height: 45px;
 
   padding: 0px 10px 0px 20px;
 
   padding: 0px 10px 0px 20px;
 
   display: block;
 
   display: block;
 
   white-space: nowrap;
 
   white-space: nowrap;
 
+  &:hover {
 
+    background-color: @grafanaTargetFuncBackground;
 
+  }
 
 
 
   .sidemenu-item-text {
 
   .sidemenu-item-text {
 
     padding-left: 11px;
 
     padding-left: 11px;
 
@@ -186,19 +168,28 @@
 
   }
 
   }
 
 }
 
 }
 
 
 
+.sidemenu-org-section {
 
+  box-shadow: inset 0 4px 15px -4px #161616;
 
+  border-bottom: 2px solid @sideMenuOrgBorder;
 
+  padding: 17px 10px 15px 21px;
 
+  cursor: pointer;
 
+  &:hover {
 
+    background-color: @grafanaTargetFuncBackground;
 
+  }
 
+}
 
+
 
 .sidemenu-org {
 
 .sidemenu-org {
 
   display: table;
 
   display: table;
 
   position: relative;
 
   position: relative;
 
   width: 159px;
 
   width: 159px;
 
-  padding: 2px 10px 20px 21px;
 
-  border-bottom: 1px solid @sideMenuOrgBorder;
 
-  cursor: pointer;
 
 }
 
 }
 
 
 
-.sidemenu-org .fa-caret-down {
 
+.sidemenu-org .fa-caret-right {
 
   position: absolute;
 
   position: absolute;
 
-  top: 33px;
 
-  right: 2px;
 
+  top: 17px;
 
+  right: -12px;
 
+  font-size: 80%;
 
+  color: @linkColor;
 
 }
 
 }
 
 
 
 .sidemenu-org-avatar,
 
 .sidemenu-org-avatar,
 
@@ -212,22 +203,25 @@
 
 }
 
 }
 
 
 
 .sidemenu-org-avatar > img {
 
 .sidemenu-org-avatar > img {
 
-  width: 44px;
 
-  height: 44px;
 
+  width: 40px;
 
+  height: 40px;
 
   border-radius: 50%;
 
   border-radius: 50%;
 
+  position: absolute;
 
 }
 
 }
 
 
 
 .sidemenu-org-details {
 
 .sidemenu-org-details {
 
-  padding-left: 12px;
 
+  padding-left: 16px;
 
   color: @linkColor;
 
   color: @linkColor;
 
 }
 
 }
 
 
 
-.sidemenu-org-user,
 
 .sidemenu-org-name {
 
 .sidemenu-org-name {
 
   display: block;
 
   display: block;
 
+  font-size: 13px;
 
+  color: @linkColorDisabled;
 
 }
 
 }
 
 
 
+
 
 .sidemenu-org-user {
 
 .sidemenu-org-user {
 
-  font-size: 14px;
 
+  display: block;
 
 }
 
 }

+ 1 - 1
public/less/variables.dark.less
مشاهده فایل 

@@ -58,7 +58,7 @@
 
 // Links
 
 // Links
 
 // -------------------------
 
 // -------------------------
 
 @linkColor:             darken(@white,11%);
 
 @linkColor:             darken(@white,11%);
 
-@linkColorDisabled:     darken(@linkColor,45%);
 
+@linkColorDisabled:     darken(@linkColor,30%);
 
 @linkColorHover:        @white;
 
 @linkColorHover:        @white;

+ 2 - 2
public/views/index.html
مشاهده فایل 

@@ -25,10 +25,10 @@
 
 
 
 	</head>
 
 	</head>
 
 
 
-	<body ng-cloak ng-controller="GrafanaCtrl" ng-class="{'sidemenu-open': contextSrv.sidemenu}">
 
+	<body ng-cloak ng-controller="GrafanaCtrl" ng-class="{'sidemenu-open': contextSrv.sidemenuPinned}">
 
 		<div class="sidemenu-canvas">
 
 		<div class="sidemenu-canvas">
 
 
 
-			<aside class="sidemenu-wrapper" ng-if="contextSrv.sidemenu">
 
+			<aside class="sidemenu-wrapper" ng-if="contextSrv.sidemenu" >
 
 				<div ng-include="'app/partials/sidemenu.html'"></div>
 
 				<div ng-include="'app/partials/sidemenu.html'"></div>
 
 			</aside>
 
 			</aside>