From b2fe7e518f91a4246b199e7ce647f12fdedbfad9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Thu, 17 Mar 2016 10:15:16 +0100 Subject: [PATCH] ux(): added specific fallback logos for plugin depending on type, polished layout selector style --- pkg/api/datasources.go | 2 +- pkg/plugins/frontend_plugin.go | 8 +++---- public/img/icn-app.svg | 36 ++++++++++++++++++++++++++++++ public/img/icn-dashboard.svg | 36 ++++++++++++++++++++++++++++++ public/img/icn-datasource.svg | 28 +++++++++++++++++++++++ public/img/icn-panel.svg | 23 +++++++++++++++++++ public/sass/components/_cards.scss | 13 +++++++++++ 7 files changed, 141 insertions(+), 5 deletions(-) create mode 100644 public/img/icn-app.svg create mode 100644 public/img/icn-dashboard.svg create mode 100644 public/img/icn-datasource.svg create mode 100644 public/img/icn-panel.svg diff --git a/pkg/api/datasources.go b/pkg/api/datasources.go index 21c7ccf8bed..f685dcc2520 100644 --- a/pkg/api/datasources.go +++ b/pkg/api/datasources.go @@ -40,7 +40,7 @@ func GetDataSources(c *middleware.Context) { if plugin, exists := plugins.DataSources[ds.Type]; exists { dsItem.TypeLogoUrl = plugin.Info.Logos.Small } else { - dsItem.TypeLogoUrl = "public/img/plugin-default-logo_dark.svg" + dsItem.TypeLogoUrl = "public/img/icn-datasources.svg" } result = append(result, dsItem) diff --git a/pkg/plugins/frontend_plugin.go b/pkg/plugins/frontend_plugin.go index 9bca4d7f357..55690777b2a 100644 --- a/pkg/plugins/frontend_plugin.go +++ b/pkg/plugins/frontend_plugin.go @@ -23,17 +23,17 @@ func (fp *FrontendPluginBase) initFrontendPlugin() { fp.handleModuleDefaults() - fp.Info.Logos.Small = getPluginLogoUrl(fp.Info.Logos.Small, fp.BaseUrl) - fp.Info.Logos.Large = getPluginLogoUrl(fp.Info.Logos.Large, fp.BaseUrl) + fp.Info.Logos.Small = getPluginLogoUrl(fp.Type, fp.Info.Logos.Small, fp.BaseUrl) + fp.Info.Logos.Large = getPluginLogoUrl(fp.Type, fp.Info.Logos.Large, fp.BaseUrl) for i := 0; i < len(fp.Info.Screenshots); i++ { fp.Info.Screenshots[i].Path = evalRelativePluginUrlPath(fp.Info.Screenshots[i].Path, fp.BaseUrl) } } -func getPluginLogoUrl(path, baseUrl string) string { +func getPluginLogoUrl(pluginType, path, baseUrl string) string { if path == "" { - return "public/img/plugin-default-logo_dark.svg" + return "public/img/icn-" + pluginType + ".svg" } return evalRelativePluginUrlPath(path, baseUrl) diff --git a/public/img/icn-app.svg b/public/img/icn-app.svg new file mode 100644 index 00000000000..c088093630b --- /dev/null +++ b/public/img/icn-app.svg @@ -0,0 +1,36 @@ + + + + + + + + diff --git a/public/img/icn-dashboard.svg b/public/img/icn-dashboard.svg new file mode 100644 index 00000000000..6db0157b4c3 --- /dev/null +++ b/public/img/icn-dashboard.svg @@ -0,0 +1,36 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/img/icn-datasource.svg b/public/img/icn-datasource.svg new file mode 100644 index 00000000000..ccb18fcf6fa --- /dev/null +++ b/public/img/icn-datasource.svg @@ -0,0 +1,28 @@ + + + + + + + + diff --git a/public/img/icn-panel.svg b/public/img/icn-panel.svg new file mode 100644 index 00000000000..9048c24f61c --- /dev/null +++ b/public/img/icn-panel.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + diff --git a/public/sass/components/_cards.scss b/public/sass/components/_cards.scss index 01f619bf4c2..0d0e36bbb98 100644 --- a/public/sass/components/_cards.scss +++ b/public/sass/components/_cards.scss @@ -1,4 +1,6 @@ .layout-selector { + @include clearfix(); + text-align: right; margin: 0 $spacer*1.5 $spacer; position: relative; @@ -7,10 +9,12 @@ button { background: $input-label-bg; color: $text-color-weak; + box-shadow: $card-shadow; border: none; padding: 0.5rem; line-height: 1; font-size: 130%; + float: right; &:focus { outline: none; @@ -20,6 +24,15 @@ background-color: lighten($input-label-bg, 5%); color: $link-color; } + + &:nth-child(2) { + border-radius: 3px 0 0 3px; + border-right: 1px solid $panel-border; + } + + &:nth-child(1) { + border-radius: 0 3px 3px 0; + } } }