瀏覽代碼

ux(): fixed issue with cach buster for temlpates, and updated on hover style for sidemenu to look better

Torkel Ödegaard 9 年之前
父節點
當前提交
cc4fdd6d0c

+ 5 - 2
public/app/app.ts

@@ -48,11 +48,14 @@ export class GrafanaApp {
       this.registerFunctions.service    = $provide.service;
       this.registerFunctions.filter     = $filterProvider.register;
 
-      $provide.decorator("$http", ["$delegate", function($delegate) {
+      $provide.decorator("$http", ["$delegate", "$templateCache", function($delegate, $templateCache) {
         var get = $delegate.get;
         $delegate.get = function(url, config) {
           if (url.match(/\.html$/)) {
-            url += "?v=" + new Date().getTime();
+            // some template's already exist in the cache
+            if (!$templateCache.get(url)) {
+              url += "?v=" + new Date().getTime();
+            }
           }
           return get(url, config);
         };

+ 3 - 3
public/sass/_variables.dark.scss

@@ -166,8 +166,8 @@ $dropdownLinkColor:             $text-color;
 $dropdownLinkColorHover:        $white;
 $dropdownLinkColorActive:       $white;
 
-$dropdownLinkBackgroundActive:  $blue-dark;
-$dropdownLinkBackgroundHover:   $blue-dark;
+$dropdownLinkBackgroundActive:  $dark-4;
+$dropdownLinkBackgroundHover:   $dark-4;
 
 
 // COMPONENT VARIABLES
@@ -206,7 +206,7 @@ $navbarButtonBackgroundHighlight: lighten($navbarBackground, 5%);
 // Sidemenu
 // -------------------------
 $side-menu-bg:            $body-bg;
-$side-menu-item-hover-bg: $dark-4;
+$side-menu-item-hover-bg: $dark-3;
 $side-menu-opacity:		  0.97;
 
 // Pagination

+ 1 - 0
public/sass/components/_search.scss

@@ -73,6 +73,7 @@
     white-space: nowrap;
     background-color: $grafanaListBackground;
     margin-bottom: 4px;
+
     .search-result-icon:before {
       content: "\f009";
     }

+ 5 - 6
public/sass/components/_sidemenu.scss

@@ -58,8 +58,12 @@
 
   li {
     position: relative;
+    @include left-brand-border();
 
     &:hover {
+      background-color: $side-menu-item-hover-bg;
+      @include left-brand-border-gradient();
+
       .dropdown-menu {
         display: block;
         opacity: 0;
@@ -125,10 +129,8 @@
   line-height: 47px;
   padding: 0px 10px 0px 10px;
   display: block;
+  border-left: 1px solid transparent;
 
-  &:hover {
-    background-color: $side-menu-item-hover-bg;
-  }
 
   .sidemenu-item-text {
     padding-left: 11px;
@@ -180,9 +182,6 @@
   padding: 17px 10px 15px 14px;
   box-sizing: border-box;
   cursor: pointer;
-  &:hover {
-    background-color: $side-menu-item-hover-bg;
-  }
   display: table;
   position: relative;
   width: 100%;

+ 12 - 0
public/sass/mixins/_mixins.scss

@@ -331,4 +331,16 @@
   background-image: linear-gradient($angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
 }
 
+@mixin left-brand-border() {
+  border-left: 1px solid transparent;
+}
 
+@mixin left-brand-border-gradient() {
+  border-left: 1px solid transparent;
+  border-image: linear-gradient(rgba(255,213,0,1) 0%, rgba(255,68,0,1) 99%, rgba(255,68,0,1) 100%);
+  border-image-slice: 1;
+  border-top: 0;
+  border-right: 0;
+  border-bottom: 0;
+  border-left: 1px solid transparent;
+}

+ 1 - 1
public/vendor/angular/angular.js

@@ -30458,4 +30458,4 @@ $provide.value("$locale", {
 
 })(window, document);
 
-!window.angular.$$csp().noInlineStyle && window.angular.element(document.head).prepend('<style type="text/css">@charset "UTF-8";[ng\\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak,.ng-hide:not(.ng-hide-animate){display:none !important;}ng\\:form{display:block;}.ng-animate-shim{visibility:hidden;}.ng-anchor{position:absolute;}</style>');
+!window.angular.$$csp().noInlineStyle && window.angular.element(document.head).prepend('<style type="text/css">@charset "UTF-8";[ng\\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak,.ng-hide:not(.ng-hide-animate){display:none !important;}ng\\:form{display:block;}.ng-animate-shim{visibility:hidden;}.ng-anchor{position:absolute;}</style>');