IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-11 08:05:43 -06:00
Code Issues Packages Projects Releases Wiki Activity

ux: minor position change for layout selector, fixes #10217

Browse Source
This commit is contained in:
Torkel Ödegaard 2017-12-15 09:58:39 +01:00
parent 3300af909a
commit 9a711a4fc3
3 changed files with 45 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
public/app/features/plugins/partials/ds_list.html
View File

@ -3,10 +3,13 @@
<div class="page-container page-body"> <div class="page-container page-body">
<div ng-if="ctrl.unfiltered.length"> <div ng-if="ctrl.unfiltered.length">
<div class="page-action-bar"> <div class="page-action-bar">
<label class="gf-form gf-form--grow gf-form--has-input-icon"> <div class="gf-form gf-form--grow">
<input type="text" class="gf-form-input width-20" ng-model="ctrl.searchQuery" ng-change="ctrl.onQueryUpdated()" placeholder="Filter by name or type" /> <label class="gf-form--has-input-icon">
<i class="gf-form-input-icon fa fa-search"></i> <input type="text" class="gf-form-input width-20" ng-model="ctrl.searchQuery" ng-change="ctrl.onQueryUpdated()" placeholder="Filter by name or type" />
</label> <i class="gf-form-input-icon fa fa-search"></i>
</label>
<layout-selector />
</div>
<div class="page-action-bar__spacer"></div> <div class="page-action-bar__spacer"></div>
<a class="page-header__cta btn btn-success" href="datasources/new"> <a class="page-header__cta btn btn-success" href="datasources/new">
<i class="fa fa-plus"></i> <i class="fa fa-plus"></i>
@ -15,7 +18,6 @@
</div> </div>
<section class="card-section" layout-mode> <section class="card-section" layout-mode>
<layout-selector></layout-selector>
<ol class="card-list"> <ol class="card-list">
<li class="card-item-wrapper" ng-repeat="ds in ctrl.datasources"> <li class="card-item-wrapper" ng-repeat="ds in ctrl.datasources">
<a class="card-item" href="datasources/edit/{{ds.id}}/"> <a class="card-item" href="datasources/edit/{{ds.id}}/">

73
public/app/features/plugins/partials/plugin_list.html
View File

@ -2,43 +2,44 @@
<div class="page-container page-body"> <div class="page-container page-body">
<div class="page-action-bar"> <div class="page-action-bar">
<label class="gf-form gf-form--grow gf-form--has-input-icon"> <div class="gf-form gf-form--grow">
<input type="text" class="gf-form-input width-20" ng-model="ctrl.searchQuery" ng-change="ctrl.onQueryUpdated()" placeholder="Filter by name or type" /> <label class="gf-form--has-input-icon">
<i class="gf-form-input-icon fa fa-search"></i> <input type="text" class="gf-form-input width-20" ng-model="ctrl.searchQuery" ng-change="ctrl.onQueryUpdated()" placeholder="Filter by name or type" />
</label> <i class="gf-form-input-icon fa fa-search"></i>
</label>
<div class="page-action-bar__spacer"></div> <layout-selector />
<a class="btn btn-success" href="https://grafana.com/plugins?utm_source=grafana_plugin_list" target="_blank"> </div>
Find more plugins on Grafana.com <div class="page-action-bar__spacer"></div>
</a> <a class="btn btn-success" href="https://grafana.com/plugins?utm_source=grafana_plugin_list" target="_blank">
Find more plugins on Grafana.com
</a>
</div> </div>
<section class="card-section" layout-mode> <section class="card-section" layout-mode>
<layout-selector></layout-selector>
<ol class="card-list" > <ol class="card-list" >
<li class="card-item-wrapper" ng-repeat="plugin in ctrl.plugins"> <li class="card-item-wrapper" ng-repeat="plugin in ctrl.plugins">
<a class="card-item" href="plugins/{{plugin.id}}/edit"> <a class="card-item" href="plugins/{{plugin.id}}/edit">
<div class="card-item-header"> <div class="card-item-header">
<div class="card-item-type"> <div class="card-item-type">
<i class="icon-gf icon-gf-{{plugin.type}}"></i> <i class="icon-gf icon-gf-{{plugin.type}}"></i>
{{plugin.type}} {{plugin.type}}
</div> </div>
<div class="card-item-notice" ng-show="plugin.hasUpdate"> <div class="card-item-notice" ng-show="plugin.hasUpdate">
<span bs-tooltip="plugin.latestVersion">Update available!</span> <span bs-tooltip="plugin.latestVersion">Update available!</span>
</div> </div>
</div> </div>
<div class="card-item-body"> <div class="card-item-body">
<figure class="card-item-figure"> <figure class="card-item-figure">
<img ng-src="{{plugin.info.logos.small}}"> <img ng-src="{{plugin.info.logos.small}}">
</figure> </figure>
<div class="card-item-details"> <div class="card-item-details">
<div class="card-item-name">{{plugin.name}}</div> <div class="card-item-name">{{plugin.name}}</div>
<div class="card-item-sub-name">By {{plugin.info.author.name}}</div> <div class="card-item-sub-name">By {{plugin.info.author.name}}</div>
</div> </div>
</div> </div>
</a> </a>
</li> </li>
</ol> </ol>
</section> </section>
</div> </div>

4
public/sass/components/_cards.scss
View File

@ -1,10 +1,8 @@
.layout-selector { .layout-selector {
@include clearfix(); @include clearfix();
margin-left: $spacer;
text-align: right; text-align: right;
margin: 0 $spacer*1.5 $spacer;
position: relative;
top: -0.5rem;
button { button {
background: $input-label-bg; background: $input-label-bg;