Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
N
nexpie-grafana-theme
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Registry
Registry
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Kornkitt Poolsup
nexpie-grafana-theme
Commits
26c50292
Commit
26c50292
authored
Feb 23, 2016
by
Torkel Ödegaard
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
ux(): new dashboard tabs view
parent
590da0ca
Hide whitespace changes
Inline
Side-by-side
Showing
7 changed files
with
90 additions
and
25 deletions
+90
-25
public/app/core/directives/dash_edit_link.js
+1
-0
public/app/features/dashboard/partials/settings.html
+13
-11
public/app/features/dashboard/timepicker/settings.html
+0
-11
public/app/partials/bootstrap/tabset.html
+2
-1
public/sass/_grafana.scss
+1
-0
public/sass/components/_tabbed_view.scss
+38
-0
public/sass/components/_tabs.scss
+35
-2
No files found.
public/app/core/directives/dash_edit_link.js
View file @
26c50292
...
...
@@ -45,6 +45,7 @@ function ($, coreModule) {
if
(
editview
)
{
scope
.
contextSrv
.
editview
=
editViewMap
[
editview
];
payload
.
src
=
scope
.
contextSrv
.
editview
.
src
;
payload
.
cssClass
=
"tabbed-view"
;
}
if
(
lastEditor
===
payload
.
src
)
{
...
...
public/app/features/dashboard/partials/settings.html
View file @
26c50292
<div
class=
"gf-box-header"
>
<div
class=
"gf-box-title"
>
<i
class=
"fa fa-cogs"
></i>
<div
class=
"tabbed-view-header"
>
<h2
class=
"tabbed-view-title"
>
Settings
</
div
>
</
h2
>
<div
ng-model=
"editor.index"
bs-tabs
style=
"text-transform:capitalize;"
>
<div
ng-repeat=
"tab in ['General', 'Rows', 'Links', 'Time picker', 'Metadata']"
data-title=
"{{tab}}"
>
</div>
</div>
<ul
class=
"gf-tabs"
>
<li
class=
"gf-tabs-item"
ng-repeat=
"tab in ::['General', 'Rows', 'Links', 'Time picker', 'Metadata']"
>
<a
class=
"gf-tabs-link"
ng-click=
"editor.index = $index"
ng-class=
"{active: editor.index === $index}"
>
{{::tab}}
</a>
</li>
</ul>
<button
class=
"
gf-box-header
-close-btn"
ng-click=
"dismiss();"
>
<button
class=
"
tabbed-view
-close-btn"
ng-click=
"dismiss();"
>
<i
class=
"fa fa-remove"
></i>
</button>
</div>
<div
class=
"
gf-box
-body"
style=
"padding-bottom: 50px;"
>
<div
class=
"
tabbed-view
-body"
style=
"padding-bottom: 50px;"
>
<div
ng-if=
"editor.index == 0"
>
<div
class=
"editor-row"
>
<div
class=
"tight-form-section"
>
...
...
@@ -139,7 +141,7 @@
</li>
</ul>
<div
class=
"clearfix"
></div>
</div>
</div>
<div
class=
"tight-form"
>
<ul
class=
"tight-form-list"
>
<li
class=
"tight-form-item"
style=
"width: 120px"
>
...
...
public/app/features/dashboard/timepicker/settings.html
View file @
26c50292
<div
class=
"editor-row"
>
<div
class=
"section"
>
<div>
<!-- <div class="tight-form"> -->
<!-- <ul class="tight-form-list"> -->
<!-- <li class="tight-form-item" style="width: 118px"> -->
<!-- Relative times -->
<!-- </li> -->
<!-- <li> -->
<!-- <input type="text" class="input-xlarge tight-form-input last" style="width: 450px" ng-model="ctrl.panel.time_options" array-join> -->
<!-- </li> -->
<!-- </ul> -->
<!-- <div class="clearfix"></div> -->
<!-- </div> -->
<div
class=
"tight-form"
>
<ul
class=
"tight-form-list"
>
<li
class=
"tight-form-item"
style=
"width: 118px"
>
...
...
public/app/partials/bootstrap/tabset.html
View file @
26c50292
<div>
<ul
class=
"nav nav-{{type || 'tabs'}} nav-tabs-alt"
ng-class=
"{'nav-stacked': vertical, 'nav-justified': justified}"
ng-transclude
></ul>
<ul
class=
"nav nav-tabs"
ng-class=
"{'nav-stacked': vertical, 'nav-justified': justified}"
ng-transclude
>
</ul>
<div
class=
"tab-content"
>
<div
class=
"tab-pane"
ng-repeat=
"tab in tabs"
...
...
public/sass/_grafana.scss
View file @
26c50292
...
...
@@ -65,6 +65,7 @@
@import
"components/shortcuts"
;
@import
"components/drop"
;
@import
"components/query_editor"
;
@import
"components/tabbed_view"
;
// PAGES
@import
"pages/login"
;
...
...
public/sass/components/_tabbed_view.scss
0 → 100644
View file @
26c50292
.tabbed-view
{
background-color
:
$page-bg
;
background-image
:
linear-gradient
(
60deg
,
transparent
70%
,
darken
(
$page-bg
,
4%
)
98%
);
margin
:
-
(
$spacer
/
2
);
padding
:
$spacer
*
2
;
}
.tabbed-view-header
{
@include
clearfix
();
border-image
:
linear-gradient
(
to
right
,
rgba
(
255
,
213
,
0
,
1
)
0%
,
rgba
(
255
,
68
,
0
,
1
)
99%
,
rgba
(
255
,
68
,
0
,
1
)
100%
);
border-image-slice
:
1
;
border-top
:
0
;
border-right
:
0
;
border-left
:
0
;
border-bottom
:
1px
solid
transparent
;
}
.tabbed-view-close-btn
{
float
:
right
;
padding
:
0
;
margin
:
0
;
background-color
:
transparent
;
border
:
none
;
padding
:
8px
;
i
{
font-size
:
120%
;
}
color
:
$text-color
;
&
:hover
{
color
:
$white
;
}
}
.tabbed-view-body
{
padding
:
20px
;
min-height
:
150px
;
}
public/sass/components/_tabs.scss
View file @
26c50292
.nav-tabs-alt
{
&
>
li
>
a
{
color
:
darken
(
$link-color
,
20%
);
}
...
...
@@ -34,4 +32,39 @@
}
}
.gf-tabs
{
@include
clearfix
();
float
:
left
;
margin
:
0
.5rem
0
0
2rem
;
}
.gf-tabs-item
{
float
:
left
;
list-style
:
none
;
}
.gf-tabs-link
{
padding
:
(
$spacer
*
0
.75
)
$spacer
;
margin-right
:
$spacer
/
2
;
line-height
:
$line-height-base
;
border
:
1px
solid
transparent
;
@include
border-radius
(
4px
4px
0
0
);
&
:hover
,
&
:focus
{
border-color
:
$divider-border-color
;
color
:
$link-color
;
}
&
.active
,
&
.active
:hover
,
&
.active
:focus
{
@include
border-radius
(
3px
);
border
:
1px
solid
$divider-border-color
;
background-color
:
transparent
;
border-bottom
:
1px
solid
$panel-bg
;
color
:
$link-color
;
position
:
relative
;
top
:
1px
;
}
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment