ux: minor changes

public/app/features/dashboard/partials/settings.html

@@ -17,11 +17,10 @@
 		<bootstrap-tagsinput ng-model="ctrl.dashboard.tags" tagclass="label label-tag" placeholder="add tags">
 		</bootstrap-tagsinput>
 	</div>
-
+	<folder-picker initial-title="ctrl.dashboard.meta.folderTitle"
-	<folder-picker ng-if="!ctrl.dashboard.meta.isFolder"
+                 initial-folder-id="ctrl.dashboard.folderId"
-								initial-title="ctrl.dashboard.meta.folderTitle"
+                 on-change="ctrl.onFolderChange($folder)"
-				on-change="ctrl.onFolderChange($folder)"
+                 label-class="width-7">
-		label-class="width-7">
 	</folder-picker>
 </div>
 
@@ -33,23 +32,6 @@
 			<div class="gf-form-select-wrapper">
 				<select ng-model="ctrl.dashboard.timezone" class='gf-form-input' ng-options="f.value as f.text for f in [{value: '', text: 'Default'}, {value: 'browser', text: 'Local browser time'},{value: 'utc', text: 'UTC'}]" ng-change="timezoneChanged()"></select>
 			</div>
-      <div class="gf-form">
-				<label class="gf-form-label width-7">Description</label>
-				<input type="text" class="gf-form-input width-30" ng-model='ctrl.dashboard.description'></input>
-			</div>
-      <div class="gf-form">
-				<label class="gf-form-label width-7">
-          Tags
-          <info-popover mode="right-normal">Press enter to add a tag</info-popover>
-        </label>
-				<bootstrap-tagsinput ng-model="ctrl.dashboard.tags" tagclass="label label-tag" placeholder="add tags">
-				</bootstrap-tagsinput>
-			</div>
-      <folder-picker ng-if="!ctrl.dashboard.meta.isFolder"
-                     initial-folder-id="ctrl.dashboard.folderId"
-										 on-change="ctrl.onFolderChange($folder)"
-										 label-class="width-7">
-			</folder-picker>
 		</div>
 		<gf-form-switch class="gf-form" label="Editable" tooltip="Uncheck, then save and reload to disable all dashboard editing" checked="ctrl.dashboard.editable" label-class="width-11">
 		</gf-form-switch>

public/app/features/dashboard/settings/settings.html

@@ -5,6 +5,7 @@
 	</h2>
 
 	<a href="{{::section.url}}" class="dashboard-settings__nav-item" ng-class="{active: ctrl.viewId === section.id}" ng-repeat="section in ctrl.sections">
+    <i class="{{::section.icon}}"></i>
 		{{::section.title}}
 	</a>
 </aside>

public/app/features/dashboard/settings/settings.ts

@@ -9,10 +9,15 @@ export class SettingsCtrl {
   viewId: string;
 
   sections: any[] = [
-    {title: 'General',     id: 'settings'},
+    {title: 'General',     id: 'settings', icon: "fa fa-fw fa-sliders"},
-    {title: 'Annotations', id: 'annotations'},
+    {title: 'Timepicker',  id: 'timepicker', icon: "fa fa-fw fa-clock-o"},
-    {title: 'Templating',  id: 'templating'},
+    {title: 'Annotations', id: 'annotations', icon: "fa fa-fw fa-comment-o"},
-    {title: 'Versions',    id: 'versions'},
+    {title: 'Templating',  id: 'templating', icon: "fa fa-fw fa-dollar"},
+    {title: 'Links',       id: 'links', icon: "fa fa-fw fa-external-link"},
+    {title: 'Versions',    id: 'versions', icon: "fa fa-fw fa-history"},
+    {title: 'View JSON',   id: 'view_json', icon: "fa fa-fw fa-code"},
+    {title: 'Save As',     id: 'save_as', icon: "fa fa-fw fa-copy"},
+    {title: 'Delete',      id: 'delete', icon: "fa fa-fw fa-trash"},
   ];
 
   /** @ngInject */

public/sass/base/_grafana_icons.scss

@@ -19,6 +19,7 @@
     text-transform: none;
     line-height: 1;
     display: inline-block;
+    vertical-align: middle;
 
     /* Better Font Rendering =========== */
     -webkit-font-smoothing: antialiased;

public/sass/components/_dashboard_settings.scss

@@ -27,7 +27,7 @@
 
 .dashboard-settings__aside {
   padding: 30px 0 0 30px;
-  background: $search-filter-box-bg;
+  background: $panel-bg;
   display: flex;
   flex-direction: column;
 }
@@ -48,10 +48,15 @@
 .dashboard-settings__nav-item {
   padding: 7px 12px;
   color: $text-color;
+  font-size: $font-size-md;
   @include left-brand-border;
 
   &.active {
     @include left-brand-border-gradient();
     background: $page-bg;
   }
+
+  i {
+    padding-right: 5px;
+  }
 }

public/sass/components/_gf-form.scss

@@ -66,6 +66,7 @@ $input-border: 1px solid $input-border-color;
   padding: $input-padding-y $input-padding-x;
   flex-shrink: 0;
   font-weight: $font-weight-semi-bold;
+  font-size: $font-size-sm;
 
   background-color: $input-label-bg;
   display: block;

public/sass/components/_switch.scss

@@ -27,6 +27,7 @@
     background: $input-bg;
     border: 1px solid $input-border-color;
     border-left: none;
+    border-radius: $input-border-radius;
   }
 
   input + label::before, input + label::after {
@@ -45,7 +46,6 @@
     display: flex;
     flex-direction: column;
     justify-content: center;
-    border-radius: $input-border-radius;
   }
 
   &:hover {

public/sass/components/_tabs.scss

@@ -18,11 +18,17 @@
   border: solid transparent;
   border-width: 0 1px 1px;
   border-radius: 3px 3px 0 0;
+  color: $text-color;
 
   i {
     margin-right: 5px;
   }
 
+  .gicon {
+    position: relative;
+    top: -2px;
+  }
+
   &:hover,
   &:focus {
     color: $link-hover-color;