IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #14423 from grafana/14378-develop-table-options-ux

Browse Source 
Removed side menu for column styles
This commit is contained in:
Torkel Ödegaard 2018-12-13 09:12:05 +01:00 committed by GitHub
commit 1d325cf66f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 165 additions and 171 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
public/app/plugins/panel/table/column_options.html
View File

@ -1,19 +1,5 @@
<div class="edit-tab-with-sidemenu"> <div class="edit-tab-content" ng-repeat="style in editor.panel.styles">
<aside class="edit-sidemenu-aside"> <p class="column-styles-heading">{{style.pattern || 'New rule'}}</p>
<ul class="edit-sidemenu">
<li ng-repeat="style in editor.panel.styles" ng-class="{active: editor.activeStyleIndex === $index}">
<a ng-click="editor.activeStyleIndex = $index">{{style.pattern || 'New rule'}}</a>
</li>
<li>
<a class="pointer" ng-click="editor.addColumnStyle()">
<i class="fa fa-plus"></i>&nbsp;Add
</a>
</li>
</ul>
</aside>
<div class="edit-tab-content" ng-repeat="style in editor.panel.styles" ng-if="editor.activeStyleIndex === $index">
<div class="section gf-form-group"> <div class="section gf-form-group">
<h5 class="section-heading">Options</h5> <h5 class="section-heading">Options</h5>
<div class="gf-form-inline"> <div class="gf-form-inline">
@ -182,7 +168,8 @@
<span> <span>
This title appears when user hovers pointer over the cell with link. Use the same variables as for URL. This title appears when user hovers pointer over the cell with link. Use the same variables as for URL.
</span> </span>
</info-popover></label> </info-popover>
</label>
<input type="text" class="gf-form-input width-29" ng-model="style.linkTooltip" ng-blur="editor.render()" ng-model-onblur <input type="text" class="gf-form-input width-29" ng-model="style.linkTooltip" ng-blur="editor.render()" ng-model-onblur
data-placement="right"> data-placement="right">
</div> </div>
@ -190,11 +177,14 @@
</div> </div>
<div class="clearfix"></div> <div class="clearfix"></div>
<div class="gf-form-group">
<button class="btn btn-danger btn-small" ng-click="editor.removeColumnStyle(style)"> <button class="btn btn-danger btn-small" ng-click="editor.removeColumnStyle(style)">
<i class="fa fa-trash"></i> Remove Rule <i class="fa fa-trash"></i> Remove Rule
</button> </button>
<br />
<br />
</div> </div>
</div>
<div class="gf-form-button-row">
<button class="btn btn-inverse" ng-click="editor.addColumnStyle()">
<i class="fa fa-plus"></i>&nbsp;Add column style
</button>
</div>

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

@ -28,6 +28,10 @@
} }
} }
.column-styles-heading {
border-bottom: 1px solid $gray-1;
}
@include media-breakpoint-down(sm) { @include media-breakpoint-down(sm) {
.edit-tab-with-sidemenu { .edit-tab-with-sidemenu {
flex-direction: column; flex-direction: column;