diff --git a/public/app/features/dashboard/partials/settings.html b/public/app/features/dashboard/partials/settings.html index d1ab548677e..80da0fc474a 100644 --- a/public/app/features/dashboard/partials/settings.html +++ b/public/app/features/dashboard/partials/settings.html @@ -17,11 +17,10 @@ - - + @@ -33,23 +32,6 @@
-
- - -
-
- - - -
- - diff --git a/public/app/features/dashboard/settings/settings.html b/public/app/features/dashboard/settings/settings.html index 058a6279015..0c11e13496e 100644 --- a/public/app/features/dashboard/settings/settings.html +++ b/public/app/features/dashboard/settings/settings.html @@ -5,6 +5,7 @@ + {{::section.title}} diff --git a/public/app/features/dashboard/settings/settings.ts b/public/app/features/dashboard/settings/settings.ts index fe4a3efaef5..18775e5fd29 100644 --- a/public/app/features/dashboard/settings/settings.ts +++ b/public/app/features/dashboard/settings/settings.ts @@ -9,10 +9,15 @@ export class SettingsCtrl { viewId: string; sections: any[] = [ - {title: 'General', id: 'settings'}, - {title: 'Annotations', id: 'annotations'}, - {title: 'Templating', id: 'templating'}, - {title: 'Versions', id: 'versions'}, + {title: 'General', id: 'settings', icon: "fa fa-fw fa-sliders"}, + {title: 'Timepicker', id: 'timepicker', icon: "fa fa-fw fa-clock-o"}, + {title: 'Annotations', id: 'annotations', icon: "fa fa-fw fa-comment-o"}, + {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 */ diff --git a/public/sass/base/_grafana_icons.scss b/public/sass/base/_grafana_icons.scss index 967912eb1ab..9c4b2d0e008 100644 --- a/public/sass/base/_grafana_icons.scss +++ b/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; diff --git a/public/sass/components/_dashboard_settings.scss b/public/sass/components/_dashboard_settings.scss index bb2b5a30920..669078c7f91 100644 --- a/public/sass/components/_dashboard_settings.scss +++ b/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; + } } diff --git a/public/sass/components/_gf-form.scss b/public/sass/components/_gf-form.scss index 7783b364861..1174d307ff2 100644 --- a/public/sass/components/_gf-form.scss +++ b/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; diff --git a/public/sass/components/_switch.scss b/public/sass/components/_switch.scss index 66cadd01369..6b81f144457 100644 --- a/public/sass/components/_switch.scss +++ b/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 { diff --git a/public/sass/components/_tabs.scss b/public/sass/components/_tabs.scss index 396c3f98880..ee53ddfbb4c 100644 --- a/public/sass/components/_tabs.scss +++ b/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;