IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-09 23:16:16 -06:00
Code Issues Packages Projects Releases Wiki Activity

ux: new fixes

Browse Source
This commit is contained in:
Torkel Ödegaard 2017-10-18 09:48:37 +02:00
parent 148a4c6c2d
commit 6f71af449b
4 changed files with 44 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
pkg/api/index.go
View File

@ -84,6 +84,7 @@ func setIndexViewData(c *middleware.Context) (*dtos.IndexViewData, error) {
themeUrlParam := c.Query("theme")
if themeUrlParam == "light" {
data.User.LightTheme = true
data.Theme = "light"
}
if c.OrgRole == m.ROLE_ADMIN || c.OrgRole == m.ROLE_EDITOR {

2
public/app/features/dashboard/partials/shareModal.html
View File

@ -62,7 +62,7 @@
</gf-form-switch>
<div class="gf-form">
<span class="gf-form-label width-12">Theme</span>
<div class="gf-form-select-wrapper width-6">
<div class="gf-form-select-wrapper width-10">
<select class="gf-form-input" ng-model="options.theme" ng-options="f as f for f in ['current', 'dark', 'light']" ng-change="buildUrl()"></select>
</div>
</div>

2
public/sass/components/_dashboard_grid.scss
View File

@ -22,7 +22,7 @@
}
.react-grid-item {
// overflow: auto;
overflow: hidden;
}
.theme-dark {

63
public/sass/layout/_page.scss
View File

@ -125,31 +125,61 @@
display: flex;
padding: 0 $spacer;
line-height: 0.5;
margin-left: 2em;
}
$page-breadcrumb__angle-1: 39px;
$page-breadcrumb__angle-ul: 31px;
$page-breadcrumb__angle-a: 30px;
.page-breadcrumb__item {
background: $page-nav-bg;
margin-right: .2rem;
transform: skewX(-35deg);
box-shadow: $page-nav-shadow;
> a {
color: $page-nav-breadcrumb-color;
font-size: $font-size-sm;
display: block;
padding: 0.6rem 1rem 0.6rem 1rem;;
padding: 0.6rem 1rem 0.6rem 3rem;;
position: relative;
transform: skewX(35deg);
&::after {
content: '';
position: absolute;
top: -53px;
left: 100%;
content: '';
height: 0;
width: 0;
border: $page-breadcrumb__angle-1 solid transparent;
border-right-width: 0;
border-left-width: $page-breadcrumb__angle-a;
z-index: 2;
border-left-color: $page-nav-bg;
}
}
&:last-child {
background: $breadcrumb-hover-hl;;
&:first-child {
a {
padding-left: 1rem;
}
}
&::after {
content: '';
position: absolute;
top: -53px;
left: 100%;
content: '';
height: 0;
width: 0;
border: $page-breadcrumb__angle-1 solid transparent;
border-right-width: 0;
border-left-width: $page-breadcrumb__angle-ul;
z-index: 1;
transform: translateX(4px);
border-left-color: #282020;
margin: 0;
}
&:hover {
background: $breadcrumb-hover-hl;
@ -169,14 +199,3 @@
}
}
.page-breadcrumb__caret {
opacity: 0;
position: absolute;
display: block;
width: 16px;
height: 16px;
right: -9px;
top: 5px;
z-index: 3;
}