refactoring: dashboard folders

public/app/features/dashboard/acl/acl.html

@@ -51,11 +51,22 @@
             <i class="fa fa-remove"></i>
           </button>
         </div>
-        <div class="gf-form">
-          <button class="btn btn-inverse gf-form-btn" ng-click="ctrl.addQuery()" ng-hide="ctrl.current.meta.mixed">
-            <i class="fa fa-fw fa-plus"></i>
-            Add Permission
+        <div class="gf-form dropdown">
+          <button class="btn btn-inverse gf-form-btn" data-toggle="dropdown">
+            <i class="fa fa-fw fa-plus"></i> Add Permission
           </button>
+          <ul class="dropdown-menu dropdown-menu--new">
+            <li>
+              <a class="pointer" ng-click="ctrl.addUserGroup()">
+                <i class="fa fa-fw fa-users"></i> User Group
+              </a>
+            </li>
+            <li>
+              <a class="pointer" ng-click="ctrl.addUserAcl()">
+                <i class="fa fa-fw fa-user"></i> User
+              </a>
+            </li>
+          </ul>
         </div>
       </div>
       <div class="section pull-right">

public/sass/components/_dropdown.scss

@@ -275,3 +275,22 @@
     content: "\f11c";
   }
 }
+
+.dropdown-menu.dropdown-menu--new {
+  li a {
+    padding: $spacer/2 $spacer;
+    border-left: 2px solid $side-menu-bg;
+    background: $side-menu-bg;
+
+    i {
+      display: inline-block;
+      padding-right: 21px;
+    }
+
+    &:hover {
+      @include left-brand-border-gradient();
+      color: $link-hover-color;
+      background: $input-label-bg;
+    }
+  }
+}

public/sass/components/_navbar.scss

@@ -149,7 +149,6 @@
 }
 
 .dropdown-menu.dropdown-menu--navbar {
-  top: 100%;
   min-width: 100%;
   margin-top: 0px;