Commit 271c597c by Torkel Ödegaard

ux: style tweaks

parent d379b501
......@@ -55,15 +55,15 @@
</div>
<div class="search-filter-box">
<a href="dashboard/new" class="search-filter-box-item">
<a href="dashboard/new" class="search-filter-box-link">
<i class="gicon gicon-dashboard-new"></i>
Dashboard
</a>
<a href="dashboards/folder/new" class="search-filter-box-item">
<a href="dashboards/folder/new" class="search-filter-box-link">
<i class="gicon gicon-folder-new"></i>
Folder
</a>
<a class="search-button-row-explore-link" target="_blank" href="https://grafana.com/dashboards?utm_source=grafana_search">
<a class="search-filter-box-link" target="_blank" href="https://grafana.com/dashboards?utm_source=grafana_search">
<img src="public/img/icn-dashboard-tiny.svg" width="20" /> Find dashboards on Grafana.com
</a>
</div>
......
......@@ -13,9 +13,10 @@
<div ng-show="ctrl.editable && section.id > 0" ng-click="ctrl.navigateToFolder(section, $event)">
<i class="fa fa-cog search-section__header__toggle"></i>&nbsp;
</div>
<i class="fa fa-minus search-section__header__toggle" ng-show="section.expanded"></i>
<i class="fa fa-plus search-section__header__toggle" ng-hide="section.expanded"></i>
<i class="fa fa-angle-down search-section__header__toggle" ng-show="section.expanded"></i>
<i class="fa fa-angle-right search-section__header__toggle" ng-hide="section.expanded"></i>
</a>
<div class="search-section__header" ng-show="section.hideHeader"></div>
<div ng-if="section.expanded">
......@@ -45,3 +46,4 @@
</a>
</div>
</div>
......@@ -83,11 +83,17 @@
margin-bottom: $spacer * 1.5;
}
.search-filter-box-item {
.search-filter-box-link {
display:block;
margin-bottom: 16px;
i {
&:last-child {
margin-bottom: 0;
}
i, img {
font-size: 20px;
margin-right: 5px;
}
}
......@@ -116,31 +122,27 @@
.search-section {
background: $panel-bg;
border: $panel-border;
padding: 0px 10px 2px 10px;
padding: 0px 4px 4px 4px;
margin-bottom: 3px;
border-radius: 5px;
}
.search-section__header {
font-size: $font-size-h6;
padding: 6px 0 4px 0;
padding: 7px 4px 3px 0;
color: $text-color-weak;
display: flex;
flex-grow: 1;
&:hover, &.selected {
color: $link-hover-color;
.search-section__header__toggle {
background: $tight-form-func-bg;
color: $link-hover-color;
}
color: $text-color;
}
}
.search-section__header__icon {
padding: 5px 10px;
width: 35px;
padding: 5px 0px;
width: 43px;
text-align: center;
}
.search-section__header__toggle {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment