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
c4b57a25
Commit
c4b57a25
authored
Apr 08, 2018
by
Andrzej Ressel
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Revert files
parent
cfd1f5c0
Expand all
Hide whitespace changes
Inline
Side-by-side
Showing
42 changed files
with
413 additions
and
316 deletions
+413
-316
public/app/core/components/EmptyListCTA/EmptyListCTA.tsx
+25
-28
public/app/core/components/Login/LoginBackground.tsx
+7
-9
public/app/core/components/PasswordStrength.tsx
+9
-6
public/app/core/components/colorpicker/ColorPalette.tsx
+2
-2
public/app/core/components/colorpicker/ColorPickerPopover.tsx
+13
-18
public/app/core/components/colorpicker/SpectrumPicker.tsx
+12
-12
public/app/core/specs/PasswordStrength.jest.tsx
+8
-5
public/app/features/dashboard/dashgrid/DashboardPanel.tsx
+9
-6
public/app/features/templating/query_variable.ts
+1
-3
public/sass/_variables.scss
+18
-11
public/sass/base/_font_awesome.scss
+13
-13
public/sass/base/_forms.scss
+22
-22
public/sass/base/_grafana_icons.scss
+62
-61
public/sass/base/_normalize.scss
+10
-10
public/sass/base/_reboot.scss
+4
-4
public/sass/base/font-awesome/_core.scss
+2
-1
public/sass/base/font-awesome/_mixins.scss
+4
-3
public/sass/base/font-awesome/_path.scss
+12
-7
public/sass/base/font-awesome/_variables.scss
+0
-0
public/sass/components/_drop.scss
+6
-6
public/sass/components/_filter-list.scss
+3
-3
public/sass/components/_footer.scss
+2
-2
public/sass/components/_json_explorer.scss
+3
-3
public/sass/components/_jsontree.scss
+2
-2
public/sass/components/_panel_gettingstarted.scss
+2
-2
public/sass/components/_row.scss
+1
-1
public/sass/components/_shortcuts.scss
+1
-1
public/sass/components/_switch.scss
+4
-4
public/sass/components/_tabs.scss
+7
-2
public/sass/components/_timepicker.scss
+2
-2
public/sass/mixins/_drop_element.scss
+34
-18
public/sass/mixins/_forms.scss
+2
-1
public/sass/mixins/_mixins.scss
+53
-10
public/sass/pages/_playlist.scss
+2
-2
public/sass/utils/_validation.scss
+1
-1
public/test/core/utils/version_specs.ts
+18
-18
public/test/index.ts
+4
-0
public/test/jest-shim.ts
+2
-1
public/test/lib/common.ts
+11
-2
public/test/mocks/backend_srv.ts
+4
-1
public/test/specs/app_specs.ts
+5
-2
public/test/specs/helpers.ts
+11
-11
No files found.
public/app/core/components/EmptyListCTA/EmptyListCTA.tsx
View file @
c4b57a25
import
React
,
{
Component
}
from
'react'
;
export
interface
IProps
{
model
:
any
;
model
:
any
;
}
class
EmptyListCTA
extends
Component
<
IProps
,
any
>
{
render
()
{
const
{
title
,
buttonIcon
,
buttonLink
,
buttonTitle
,
proTip
,
proTipLink
,
proTipLinkTitle
,
proTipTarget
,
}
=
this
.
props
.
model
;
return
(
<
div
className=
"empty-list-cta"
>
<
div
className=
"empty-list-cta__title"
>
{
title
}
</
div
>
<
a
href=
{
buttonLink
}
className=
"empty-list-cta__button btn btn-xlarge btn-success"
>
<
i
className=
{
buttonIcon
}
/>
{
buttonTitle
}
</
a
>
<
div
className=
"empty-list-cta__pro-tip"
>
<
i
className=
"fa fa-rocket"
/>
ProTip:
{
proTip
}
<
a
className=
"text-link empty-list-cta__pro-tip-link"
href=
{
proTipLink
}
target=
{
proTipTarget
}
>
{
proTipLinkTitle
}
</
a
>
</
div
>
</
div
>
);
}
render
()
{
const
{
title
,
buttonIcon
,
buttonLink
,
buttonTitle
,
proTip
,
proTipLink
,
proTipLinkTitle
,
proTipTarget
}
=
this
.
props
.
model
;
return
(
<
div
className=
"empty-list-cta"
>
<
div
className=
"empty-list-cta__title"
>
{
title
}
</
div
>
<
a
href=
{
buttonLink
}
className=
"empty-list-cta__button btn btn-xlarge btn-success"
><
i
className=
{
buttonIcon
}
/>
{
buttonTitle
}
</
a
>
<
div
className=
"empty-list-cta__pro-tip"
>
<
i
className=
"fa fa-rocket"
/>
ProTip:
{
proTip
}
<
a
className=
"text-link empty-list-cta__pro-tip-link"
href=
{
proTipLink
}
target=
{
proTipTarget
}
>
{
proTipLinkTitle
}
</
a
>
</
div
>
</
div
>
);
}
}
export
default
EmptyListCTA
;
public/app/core/components/Login/LoginBackground.tsx
View file @
c4b57a25
...
...
@@ -4,14 +4,10 @@ const xCount = 50;
const
yCount
=
50
;
function
Cell
({
x
,
y
,
flipIndex
})
{
const
index
=
y
*
xCount
+
x
;
const
index
=
(
y
*
xCount
)
+
x
;
const
bgColor1
=
getColor
(
x
,
y
);
return
(
<
div
className=
{
`login-bg__item ${flipIndex === index ? 'login-bg-flip' : ''}`
}
key=
{
index
}
style=
{
{
background
:
bgColor1
}
}
/>
<
div
className=
{
`login-bg__item ${flipIndex === index ? 'login-bg-flip' : ''}`
}
key=
{
index
}
style=
{
{
background
:
bgColor1
}
}
/>
);
}
...
...
@@ -35,7 +31,7 @@ export default class LoginBackground extends Component<any, any> {
}
flipElements
()
{
const
elementIndexToFlip
=
getRandomInt
(
0
,
xCount
*
yCount
-
1
);
const
elementIndexToFlip
=
getRandomInt
(
0
,
(
xCount
*
yCount
)
-
1
);
this
.
setState
(
prevState
=>
{
return
{
...
prevState
,
...
...
@@ -61,7 +57,9 @@ export default class LoginBackground extends Component<any, any> {
return
(
<
div
className=
"login-bg__row"
>
{
Array
.
from
(
Array
(
xCount
)).
map
((
el2
,
x
)
=>
{
return
<
Cell
y=
{
y
}
x=
{
x
}
flipIndex=
{
this
.
state
.
flipIndex
}
/>;
return
(
<
Cell
y=
{
y
}
x=
{
x
}
flipIndex=
{
this
.
state
.
flipIndex
}
/>
);
})
}
</
div
>
);
...
...
@@ -1238,5 +1236,5 @@ function getColor(x, y) {
// let randY = getRandomInt(0, y);
// let randIndex = randY * xCount + randX;
return
colors
[(
y
*
xCount
+
x
)
%
colors
.
length
];
return
colors
[(
y
*
xCount
+
x
)
%
colors
.
length
];
}
public/app/core/components/PasswordStrength.tsx
View file @
c4b57a25
...
...
@@ -5,27 +5,28 @@ export interface IProps {
}
export
class
PasswordStrength
extends
React
.
Component
<
IProps
,
any
>
{
constructor
(
props
)
{
super
(
props
);
}
render
()
{
const
{
password
}
=
this
.
props
;
let
strengthText
=
'strength: strong like a bull.'
;
let
strengthClass
=
'password-strength-good'
;
let
strengthText
=
"strength: strong like a bull."
;
let
strengthClass
=
"password-strength-good"
;
if
(
!
password
)
{
return
null
;
}
if
(
password
.
length
<=
8
)
{
strengthText
=
'strength: you can do better.'
;
strengthClass
=
'password-strength-ok'
;
strengthText
=
"strength: you can do better."
;
strengthClass
=
"password-strength-ok"
;
}
if
(
password
.
length
<
4
)
{
strengthText
=
'strength: weak sauce.'
;
strengthClass
=
'password-strength-bad'
;
strengthText
=
"strength: weak sauce."
;
strengthClass
=
"password-strength-bad"
;
}
return
(
...
...
@@ -35,3 +36,5 @@ export class PasswordStrength extends React.Component<IProps, any> {
);
}
}
public/app/core/components/colorpicker/ColorPalette.tsx
View file @
c4b57a25
...
...
@@ -29,8 +29,7 @@ export class ColorPalette extends React.Component<IProps, any> {
key=
{
paletteColor
}
className=
{
'pointer fa '
+
cssClass
}
style=
{
{
color
:
paletteColor
}
}
onClick=
{
this
.
onColorSelect
(
paletteColor
)
}
>
onClick=
{
this
.
onColorSelect
(
paletteColor
)
}
>
</
i
>
);
...
...
@@ -42,3 +41,4 @@ export class ColorPalette extends React.Component<IProps, any> {
);
}
}
public/app/core/components/colorpicker/ColorPickerPopover.tsx
View file @
c4b57a25
...
...
@@ -19,7 +19,7 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
this
.
state
=
{
tab
:
'palette'
,
color
:
this
.
props
.
color
||
DEFAULT_COLOR
,
colorString
:
this
.
props
.
color
||
DEFAULT_COLOR
,
colorString
:
this
.
props
.
color
||
DEFAULT_COLOR
};
}
...
...
@@ -32,7 +32,7 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
if
(
newColor
.
isValid
())
{
this
.
setState
({
color
:
newColor
.
toString
(),
colorString
:
newColor
.
toString
()
,
colorString
:
newColor
.
toString
()
});
this
.
props
.
onColorSelect
(
color
);
}
...
...
@@ -50,7 +50,7 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
onColorStringChange
(
e
)
{
let
colorString
=
e
.
target
.
value
;
this
.
setState
({
colorString
:
colorString
,
colorString
:
colorString
});
let
newColor
=
tinycolor
(
colorString
);
...
...
@@ -71,11 +71,11 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
componentDidMount
()
{
this
.
pickerNavElem
.
find
(
'li:first'
).
addClass
(
'active'
);
this
.
pickerNavElem
.
on
(
'show'
,
e
=>
{
this
.
pickerNavElem
.
on
(
'show'
,
(
e
)
=>
{
// use href attr (#name => name)
let
tab
=
e
.
target
.
hash
.
slice
(
1
);
this
.
setState
({
tab
:
tab
,
tab
:
tab
});
});
}
...
...
@@ -97,24 +97,19 @@ export class ColorPickerPopover extends React.Component<IProps, any> {
<
div
className=
"gf-color-picker"
>
<
ul
className=
"nav nav-tabs"
id=
"colorpickernav"
ref=
{
this
.
setPickerNavElem
.
bind
(
this
)
}
>
<
li
className=
"gf-tabs-item-colorpicker"
>
<
a
href=
"#palette"
data
-
toggle=
"tab"
>
Colors
</
a
>
<
a
href=
"#palette"
data
-
toggle=
"tab"
>
Colors
</
a
>
</
li
>
<
li
className=
"gf-tabs-item-colorpicker"
>
<
a
href=
"#spectrum"
data
-
toggle=
"tab"
>
Custom
</
a
>
<
a
href=
"#spectrum"
data
-
toggle=
"tab"
>
Custom
</
a
>
</
li
>
</
ul
>
<
div
className=
"gf-color-picker__body"
>
{
currentTab
}
</
div
>
<
div
className=
"gf-color-picker__body"
>
{
currentTab
}
</
div
>
<
div
>
<
input
className=
"gf-form-input gf-form-input--small"
value=
{
this
.
state
.
colorString
}
onChange=
{
this
.
onColorStringChange
.
bind
(
this
)
}
onBlur=
{
this
.
onColorStringBlur
.
bind
(
this
)
}
/>
<
input
className=
"gf-form-input gf-form-input--small"
value=
{
this
.
state
.
colorString
}
onChange=
{
this
.
onColorStringChange
.
bind
(
this
)
}
onBlur=
{
this
.
onColorStringBlur
.
bind
(
this
)
}
>
</
input
>
</
div
>
</
div
>
);
...
...
public/app/core/components/colorpicker/SpectrumPicker.tsx
View file @
c4b57a25
...
...
@@ -29,17 +29,14 @@ export class SpectrumPicker extends React.Component<IProps, any> {
}
componentDidMount
()
{
let
spectrumOptions
=
_
.
assignIn
(
{
flat
:
true
,
showAlpha
:
true
,
showButtons
:
false
,
color
:
this
.
props
.
color
,
appendTo
:
this
.
elem
,
move
:
this
.
onSpectrumMove
,
},
this
.
props
.
options
);
let
spectrumOptions
=
_
.
assignIn
({
flat
:
true
,
showAlpha
:
true
,
showButtons
:
false
,
color
:
this
.
props
.
color
,
appendTo
:
this
.
elem
,
move
:
this
.
onSpectrumMove
,
},
this
.
props
.
options
);
this
.
elem
.
spectrum
(
spectrumOptions
);
this
.
elem
.
spectrum
(
'show'
);
...
...
@@ -67,6 +64,9 @@ export class SpectrumPicker extends React.Component<IProps, any> {
}
render
()
{
return
<
div
className=
"spectrum-container"
ref=
{
this
.
setComponentElem
}
/>;
return
(
<
div
className=
"spectrum-container"
ref=
{
this
.
setComponentElem
}
></
div
>
);
}
}
public/app/core/specs/PasswordStrength.jest.tsx
View file @
c4b57a25
import
React
from
'react'
;
import
{
shallow
}
from
'enzyme'
;
import
{
shallow
}
from
'enzyme'
;
import
{
PasswordStrength
}
from
'../components/PasswordStrength'
;
import
{
PasswordStrength
}
from
'../components/PasswordStrength'
;
describe
(
'PasswordStrength'
,
()
=>
{
it
(
'should have class bad if length below 4'
,
()
=>
{
const
wrapper
=
shallow
(<
PasswordStrength
password=
"asd"
/>);
expect
(
wrapper
.
find
(
'.password-strength-bad'
)).
toHaveLength
(
1
);
expect
(
wrapper
.
find
(
".password-strength-bad"
)).
toHaveLength
(
1
);
});
it
(
'should have class ok if length below 8'
,
()
=>
{
const
wrapper
=
shallow
(<
PasswordStrength
password=
"asdasd"
/>);
expect
(
wrapper
.
find
(
'.password-strength-ok'
)).
toHaveLength
(
1
);
expect
(
wrapper
.
find
(
".password-strength-ok"
)).
toHaveLength
(
1
);
});
it
(
'should have class good if length above 8'
,
()
=>
{
const
wrapper
=
shallow
(<
PasswordStrength
password=
"asdaasdda"
/>);
expect
(
wrapper
.
find
(
'.password-strength-good'
)).
toHaveLength
(
1
);
expect
(
wrapper
.
find
(
".password-strength-good"
)).
toHaveLength
(
1
);
});
});
public/app/features/dashboard/dashgrid/DashboardPanel.tsx
View file @
c4b57a25
import
React
from
'react'
;
import
{
PanelModel
}
from
'../panel_model'
;
import
{
PanelContainer
}
from
'./PanelContainer'
;
import
{
AttachedPanel
}
from
'./PanelLoader'
;
import
{
DashboardRow
}
from
'./DashboardRow'
;
import
{
AddPanelPanel
}
from
'./AddPanelPanel'
;
import
{
PanelModel
}
from
'../panel_model'
;
import
{
PanelContainer
}
from
'./PanelContainer'
;
import
{
AttachedPanel
}
from
'./PanelLoader'
;
import
{
DashboardRow
}
from
'./DashboardRow'
;
import
{
AddPanelPanel
}
from
'./AddPanelPanel'
;
export
interface
DashboardPanelProps
{
panel
:
PanelModel
;
...
...
@@ -46,6 +46,9 @@ export class DashboardPanel extends React.Component<DashboardPanelProps, any> {
return
<
AddPanelPanel
panel=
{
this
.
props
.
panel
}
getPanelContainer=
{
this
.
props
.
getPanelContainer
}
/>;
}
return
<
div
ref=
{
element
=>
(
this
.
element
=
element
)
}
className=
"panel-height-helper"
/>;
return
(
<
div
ref=
{
element
=>
this
.
element
=
element
}
className=
"panel-height-helper"
/>
);
}
}
public/app/features/templating/query_variable.ts
View file @
c4b57a25
...
...
@@ -198,9 +198,7 @@ export class QueryVariable implements Variable {
}
});
}
else
if
(
sortType
===
3
)
{
options
=
_
.
sortBy
(
options
,
opt
=>
{
return
_
.
toLower
(
opt
.
text
);
});
options
=
_
.
sortBy
(
options
,
opt
=>
{
return
_
.
toLower
(
opt
.
text
);
});
}
if
(
reverseSort
)
{
...
...
public/sass/_variables.scss
View file @
c4b57a25
...
...
@@ -53,9 +53,9 @@ $enable-flex: true;
// Typography
// -------------------------
$font-family-sans-serif
:
'Roboto'
,
Helvetica
,
Arial
,
sans-serif
;
$font-family-serif
:
Georgia
,
'Times New Roman'
,
Times
,
serif
;
$font-family-monospace
:
Menlo
,
Monaco
,
Consolas
,
'Courier New'
,
monospace
;
$font-family-sans-serif
:
"Roboto"
,
Helvetica
,
Arial
,
sans-serif
;
$font-family-serif
:
Georgia
,
"Times New Roman"
,
Times
,
serif
;
$font-family-monospace
:
Menlo
,
Monaco
,
Consolas
,
"Courier New"
,
monospace
;
$font-family-base
:
$font-family-sans-serif
!
default
;
$font-size-root
:
14px
!
default
;
...
...
@@ -90,7 +90,7 @@ $lead-font-size: 1.25rem !default;
$lead-font-weight
:
300
!
default
;
$headings-margin-bottom
:
(
$spacer
/
2
)
!
default
;
$headings-font-family
:
'Roboto'
,
'Helvetica Neue'
,
Helvetica
,
Arial
,
sans-serif
;
$headings-font-family
:
"Roboto"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
$headings-font-weight
:
400
!
default
;
$headings-line-height
:
1
.1
!
default
;
...
...
@@ -152,9 +152,16 @@ $input-padding-y-sm: 4px !default;
$input-padding-x-lg
:
20px
!
default
;
$input-padding-y-lg
:
10px
!
default
;
$input-height
:
((
$font-size-base
*
$line-height-base
)
+
(
$input-padding-y
*
2
))
!
default
;
$input-height-lg
:
(
(
$font-size-lg
*
$line-height-lg
)
+
(
$input-padding-y-lg
*
2
))
!
default
;
$input-height-sm
:
(
(
$font-size-sm
*
$line-height-sm
)
+
(
$input-padding-y-sm
*
2
))
!
default
;
$input-height
:
((
$font-size-base
*
$line-height-base
)
+
(
$input-padding-y
*
2
))
!
default
;
$input-height-lg
:
(
(
$font-size-lg
*
$line-height-lg
)
+
(
$input-padding-y-lg
*
2
)
)
!
default
;
$input-height-sm
:
(
(
$font-size-sm
*
$line-height-sm
)
+
(
$input-padding-y-sm
*
2
)
)
!
default
;
$form-group-margin-bottom
:
$spacer-y
!
default
;
$gf-form-margin
:
0
.2rem
;
...
...
@@ -214,9 +221,9 @@ $panel-padding: 0px 10px 5px 10px;
$tabs-padding
:
10px
15px
9px
;
$external-services
:
(
github
:
(
bgColor
:
#464646
,
borderColor
:
#393939
,
icon
:
''
)
,
google
:
(
bgColor
:
#e84d3c
,
borderColor
:
#b83e31
,
icon
:
''
)
,
grafanacom
:
(
bgColor
:
inherit
,
borderColor
:
#393939
,
icon
:
''
)
,
oauth
:
(
bgColor
:
inherit
,
borderColor
:
#393939
,
icon
:
''
)
github
:
(
bgColor
:
#464646
,
borderColor
:
#393939
,
icon
:
""
)
,
google
:
(
bgColor
:
#e84d3c
,
borderColor
:
#b83e31
,
icon
:
""
)
,
grafanacom
:
(
bgColor
:
inherit
,
borderColor
:
#393939
,
icon
:
""
)
,
oauth
:
(
bgColor
:
inherit
,
borderColor
:
#393939
,
icon
:
""
)
)
!
default
;
public/sass/base/_font_awesome.scss
View file @
c4b57a25
...
...
@@ -3,16 +3,16 @@
* License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
*/
@import
'./font-awesome/variables'
;
@import
'./font-awesome/mixins'
;
@import
'./font-awesome/path'
;
@import
'./font-awesome/core'
;
@import
'./font-awesome/larger'
;
@import
'./font-awesome/fixed-width'
;
@import
'./font-awesome/list'
;
@import
'./font-awesome/bordered-pulled'
;
@import
'./font-awesome/animated'
;
@import
'./font-awesome/rotated-flipped'
;
@import
'./font-awesome/stacked'
;
@import
'./font-awesome/icons'
;
@import
'./font-awesome/screen-reader'
;
@import
"./font-awesome/variables"
;
@import
"./font-awesome/mixins"
;
@import
"./font-awesome/path"
;
@import
"./font-awesome/core"
;
@import
"./font-awesome/larger"
;
@import
"./font-awesome/fixed-width"
;
@import
"./font-awesome/list"
;
@import
"./font-awesome/bordered-pulled"
;
@import
"./font-awesome/animated"
;
@import
"./font-awesome/rotated-flipped"
;
@import
"./font-awesome/stacked"
;
@import
"./font-awesome/icons"
;
@import
"./font-awesome/screen-reader"
;
public/sass/base/_forms.scss
View file @
c4b57a25
...
...
@@ -58,19 +58,19 @@ textarea {
}
// Reset width of input images, buttons, radios, checkboxes
input
[
type
=
'file'
],
input
[
type
=
'image'
],
input
[
type
=
'submit'
],
input
[
type
=
'reset'
],
input
[
type
=
'button'
],
input
[
type
=
'radio'
],
input
[
type
=
'checkbox'
]
{
input
[
type
=
"file"
],
input
[
type
=
"image"
],
input
[
type
=
"submit"
],
input
[
type
=
"reset"
],
input
[
type
=
"button"
],
input
[
type
=
"radio"
],
input
[
type
=
"checkbox"
]
{
width
:
auto
;
// Override of generic input selector
}
// Set the height of select and file controls to match text inputs
select
,
input
[
type
=
'file'
]
{
input
[
type
=
"file"
]
{
height
:
$input-height
;
/* In IE7, the height of the select element cannot be changed by height, only font-size */
line-height
:
$input-height
;
}
...
...
@@ -90,19 +90,19 @@ select[size] {
// Focus for select, file, radio, and checkbox
select
:focus
,
input
[
type
=
'file'
]
:focus
,
input
[
type
=
'radio'
]
:focus
,
input
[
type
=
'checkbox'
]
:focus
{
input
[
type
=
"file"
]
:focus
,
input
[
type
=
"radio"
]
:focus
,
input
[
type
=
"checkbox"
]
:focus
{
@include
tab-focus
();
}
// not a big fan of number fields
input
[
type
=
'
number
'
]
:
:-
webkit-outer-spin-button
,
input
[
type
=
'number'
]
::-
webkit-inner-spin-button
{
input
[
type
=
"
number
"
]
:
:-
webkit-outer-spin-button
,
input
[
type
=
"number"
]
::-
webkit-inner-spin-button
{
-webkit-appearance
:
none
;
margin
:
0
;
}
input
[
type
=
'number'
]
{
input
[
type
=
"number"
]
{
-moz-appearance
:
textfield
;
}
// Placeholder
...
...
@@ -155,15 +155,15 @@ textarea[readonly] {
}
// Explicitly reset the colors here
input
[
type
=
'radio'
][
disabled
],
input
[
type
=
'checkbox'
][
disabled
],
input
[
type
=
'radio'
][
readonly
],
input
[
type
=
'checkbox'
][
readonly
]
{
input
[
type
=
"radio"
][
disabled
],
input
[
type
=
"checkbox"
][
disabled
],
input
[
type
=
"radio"
][
readonly
],
input
[
type
=
"checkbox"
][
readonly
]
{
cursor
:
$cursor-disabled
;
background-color
:
transparent
;
}
input
[
type
=
'text'
]
.input-fluid
{
input
[
type
=
"text"
]
.input-fluid
{
width
:
100%
;
box-sizing
:
border-box
;
padding
:
10px
;
...
...
@@ -172,7 +172,7 @@ input[type='text'].input-fluid {
height
:
100%
;
}
input
[
type
=
'checkbox'
]
.cr1
{
input
[
type
=
"checkbox"
]
.cr1
{
display
:
none
;
}
...
...
@@ -194,7 +194,7 @@ label.cr1 {
cursor
:
pointer
;
}
input
[
type
=
'checkbox'
]
.cr1
:checked
+
label
{
input
[
type
=
"checkbox"
]
.cr1
:checked
+
label
{
background
:
url($checkboxImageUrl)
0px
-18px
no-repeat
;
}
...
...
@@ -203,7 +203,7 @@ input[type='checkbox'].cr1:checked + label {
display
:
block
;
overflow
:
hidden
;
padding-right
:
10px
;
input
[
type
=
'text'
]
{
input
[
type
=
"text"
]
{
width
:
100%
;
padding
:
5px
6px
;
height
:
100%
;
...
...
public/sass/base/_grafana_icons.scss
View file @
c4b57a25
@font-face
{
font-family
:
'grafana-icons'
;
src
:
url('../fonts/grafana-icons.eot?okx5td')
;
src
:
url('../fonts/grafana-icons.eot?okx5td#iefix')
format
(
'embedded-opentype'
)
,
url('../fonts/grafana-icons.ttf?okx5td')
format
(
'truetype'
)
,
url('../fonts/grafana-icons.woff?okx5td')
format
(
'woff'
)
,
url('../fonts/grafana-icons.svg?okx5td#grafana-icons')
format
(
'svg'
);
font-family
:
"grafana-icons"
;
src
:
url("../fonts/grafana-icons.eot?okx5td")
;
src
:
url("../fonts/grafana-icons.eot?okx5td#iefix")
format
(
"embedded-opentype"
)
,
url("../fonts/grafana-icons.ttf?okx5td")
format
(
"truetype"
)
,
url("../fonts/grafana-icons.woff?okx5td")
format
(
"woff"
)
,
url("../fonts/grafana-icons.svg?okx5td#grafana-icons")
format
(
"svg"
);
font-weight
:
normal
;
font-style
:
normal
;
}
.icon-gf
{
/* use !important to prevent issues with browser extensions that change fonts */
font-family
:
'grafana-icons'
!
important
;
font-family
:
"grafana-icons"
!
important
;
speak
:
none
;
font-style
:
normal
;
font-weight
:
normal
;
...
...
@@ -36,165 +37,165 @@
}
.icon-gf-raintank_wordmark
:before
{
content
:
'\e600'
;
content
:
"\e600"
;
}
.micon-gf-raintank_icn
:before
{
content
:
'\e601'
;
content
:
"\e601"
;
}
.icon-gf-raintank_r-icn
:before
{
content
:
'\e905'
;
content
:
"\e905"
;
}
.icon-gf-check-alt
:before
{
content
:
'\e603'
;
content
:
"\e603"
;
}
.icon-gf-check
:before
{
content
:
'\e604'
;
content
:
"\e604"
;
}
.icon-gf-collector
:before
{
content
:
'\e605'
;
content
:
"\e605"
;
}
.icon-gf-dashboard
:before
{
content
:
'\e606'
;
content
:
"\e606"
;
}
.icon-gf-panel
:before
{
content
:
'\e904'
;
content
:
"\e904"
;
}
.icon-gf-datasources
:before
{
content
:
'\e607'
;
content
:
"\e607"
;
}
.icon-gf-endpoint-tiny
:before
{
content
:
'\e608'
;
content
:
"\e608"
;
}
.icon-gf-endpoint
:before
{
content
:
'\e609'
;
content
:
"\e609"
;
}
.icon-gf-page
:before
{
content
:
'\e908'
;
content
:
"\e908"
;
}
.icon-gf-filter
:before
{
content
:
'\e60a'
;
content
:
"\e60a"
;
}
.icon-gf-status
:before
{
content
:
'\e60b'
;
content
:
"\e60b"
;
}
.icon-gf-monitoring
:before
{
content
:
'\e60c'
;
content
:
"\e60c"
;
}
.icon-gf-monitoring-tiny
:before
{
content
:
'\e620'
;
content
:
"\e620"
;
}
.icon-gf-jump-to-dashboard
:before
{
content
:
'\e60d'
;
content
:
"\e60d"
;
}
.icon-gf-warn
,
.icon-gf-warning
:before
{
content
:
'\e60e'
;
content
:
"\e60e"
;
}
.icon-gf-nodata
:before
{
content
:
'\e60f'
;
content
:
"\e60f"
;
}
.icon-gf-critical
:before
{
content
:
'\e610'
;
content
:
"\e610"
;
}
.icon-gf-crit
:before
{
content
:
'\e610'
;
content
:
"\e610"
;
}
.icon-gf-online
:before
{
content
:
'\e611'
;
content
:
"\e611"
;
}
.icon-gf-event-error
:before
{
content
:
'\e623'
;
content
:
"\e623"
;
}
.icon-gf-event
:before
{
content
:
'\e624'
;
content
:
"\e624"
;
}
.icon-gf-sadface
:before
{
content
:
'\e907'
;
content
:
"\e907"
;
}
.icon-gf-private-collector
:before
{
content
:
'\e612'
;
content
:
"\e612"
;
}
.icon-gf-alert
:before
{
content
:
'\e61f'
;
content
:
"\e61f"
;
}
.icon-gf-alert-disabled
:before
{
content
:
'\e621'
;
content
:
"\e621"
;
}
.icon-gf-refresh
:before
{
content
:
'\e613'
;
content
:
"\e613"
;
}
.icon-gf-save
:before
{
content
:
'\e614'
;
content
:
"\e614"
;
}
.icon-gf-share
:before
{
content
:
'\e616'
;
content
:
"\e616"
;
}
.icon-gf-star
:before
{
content
:
'\e617'
;
content
:
"\e617"
;
}
.icon-gf-search
:before
{
content
:
'\e618'
;
content
:
"\e618"
;
}
.icon-gf-settings
:before
{
content
:
'\e615'
;
content
:
"\e615"
;
}
.icon-gf-add
:before
{
content
:
'\e619'
;
content
:
"\e619"
;
}
.icon-gf-remove
:before
{
content
:
'\e61a'
;
content
:
"\e61a"
;
}
.icon-gf-video
:before
{
content
:
'\e61b'
;
content
:
"\e61b"
;
}
.icon-gf-bulk_action
:before
{
content
:
'\e61c'
;
content
:
"\e61c"
;
}
.icon-gf-grabber
:before
{
content
:
'\e90b'
;
content
:
"\e90b"
;
}
.icon-gf-users
:before
{
content
:
'\e622'
;
content
:
"\e622"
;
}
.icon-gf-globe
:before
{
content
:
'\e61d'
;
content
:
"\e61d"
;
}
.icon-gf-snapshot
:before
{
content
:
'\e61e'
;
content
:
"\e61e"
;
}
.icon-gf-play-grafana-icon
:before
{
content
:
'\e629'
;
content
:
"\e629"
;
}
.icon-gf-grafana-icon
:before
{
content
:
'\e625'
;
content
:
"\e625"
;
}
.icon-gf-email
:before
{
content
:
'\e628'
;
content
:
"\e628"
;
}
.icon-gf-stopwatch
:before
{
content
:
'\e626'
;
content
:
"\e626"
;
}
.icon-gf-skull
:before
{
content
:
'\e900'
;
content
:
"\e900"
;
}
.icon-gf-probe
:before
{
content
:
'\e901'
;
content
:
"\e901"
;
}
.icon-gf-apps
:before
{
content
:
'\e902'
;
content
:
"\e902"
;
}
.icon-gf-scale
:before
{
content
:
'\e906'
;
content
:
"\e906"
;
}
.icon-gf-pending
:before
{
content
:
'\e909'
;
content
:
"\e909"
;
}
.icon-gf-verified
:before
{
content
:
'\e90a'
;
content
:
"\e90a"
;
}
.icon-gf-worldping
:before
{
content
:
'\e627'
;
content
:
"\e627"
;
}
.icon-gf-grafana_wordmark
:before
{
content
:
'\e903'
;
content
:
"\e903"
;
}
public/sass/base/_normalize.scss
View file @
c4b57a25
...
...
@@ -291,9 +291,9 @@ select {
//
button
,
html
input
[
type
=
'button'
],
//
1
input
[
type
=
'reset'
],
input
[
type
=
'submit'
]
{
html
input
[
type
=
"button"
],
//
1
input
[
type
=
"reset"
],
input
[
type
=
"submit"
]
{
-webkit-appearance
:
button
;
// 2
cursor
:
pointer
;
// 3
}
...
...
@@ -334,8 +334,8 @@ input {
// 2. Remove excess padding in IE 8/9/10.
//
input
[
type
=
'checkbox'
],
input
[
type
=
'radio'
]
{
input
[
type
=
"checkbox"
],
input
[
type
=
"radio"
]
{
box-sizing
:
border-box
;
// 1
padding
:
0
;
// 2
}
...
...
@@ -346,8 +346,8 @@ input[type='radio'] {
// decrement button to change from `default` to `text`.
//
input
[
type
=
'
number
'
]
:
:-
webkit-inner-spin-button
,
input
[
type
=
'number'
]
::-
webkit-outer-spin-button
{
input
[
type
=
"
number
"
]
:
:-
webkit-inner-spin-button
,
input
[
type
=
"number"
]
::-
webkit-outer-spin-button
{
height
:
auto
;
}
...
...
@@ -355,7 +355,7 @@ input[type='number']::-webkit-outer-spin-button {
// Address `appearance` set to `searchfield` in Safari and Chrome.
//
input
[
type
=
'search'
]
{
input
[
type
=
"search"
]
{
-webkit-appearance
:
textfield
;
}
...
...
@@ -365,8 +365,8 @@ input[type='search'] {
// padding (and `textfield` appearance).
//
input
[
type
=
'
search
'
]
:
:-
webkit-search-cancel-button
,
input
[
type
=
'search'
]
::-
webkit-search-decoration
{
input
[
type
=
"
search
"
]
:
:-
webkit-search-cancel-button
,
input
[
type
=
"search"
]
::-
webkit-search-decoration
{
-webkit-appearance
:
none
;
}
...
...
public/sass/base/_reboot.scss
View file @
c4b57a25
...
...
@@ -87,7 +87,7 @@ body {
// might still respond to pointer events.
//
// Credit: https://github.com/suitcss/base
[
tabindex
=
'-1'
]
:focus
{
[
tabindex
=
"-1"
]
:focus
{
outline
:
none
!
important
;
}
...
...
@@ -214,7 +214,7 @@ img {
// for traditionally non-focusable elements with role="button"
// see https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
[
role
=
'button'
]
{
[
role
=
"button"
]
{
cursor
:
pointer
;
}
...
...
@@ -231,7 +231,7 @@ img {
a
,
area
,
button
,
[
role
=
'button'
],
[
role
=
"button"
],
input
,
label
,
select
,
...
...
@@ -320,7 +320,7 @@ legend {
// border: 0;
}
input
[
type
=
'search'
]
{
input
[
type
=
"search"
]
{
// This overrides the extra rounded corners on search inputs in iOS so that our
// `.form-control` class can properly style them. Note that this cannot simply
// be added to `.form-control` as it's not specific enough. For details, see
...
...
public/sass/base/font-awesome/_core.scss
View file @
c4b57a25
...
...
@@ -3,7 +3,8 @@
.
#{
$fa-css-prefix
}
{
display
:
inline-block
;
font
:
normal
normal
normal
#{
$fa-font-size-base
}
/
#{
$fa-line-height-base
}
FontAwesome
;
// shortening font declaration
font
:
normal
normal
normal
#{
$fa-font-size-base
}
/
#{
$fa-line-height-base
}
FontAwesome
;
// shortening font declaration
font-size
:
inherit
;
// can't have font-size inherit on line above, so need to override
text-rendering
:
auto
;
// optimizelegibility throws things off #1094
-webkit-font-smoothing
:
antialiased
;
...
...
public/sass/base/font-awesome/_mixins.scss
View file @
c4b57a25
...
...
@@ -3,7 +3,8 @@
@mixin
fa-icon
()
{
display
:
inline-block
;
font
:
normal
normal
normal
#{
$fa-font-size-base
}
/
#{
$fa-line-height-base
}
FontAwesome
;
// shortening font declaration
font
:
normal
normal
normal
#{
$fa-font-size-base
}
/
#{
$fa-line-height-base
}
FontAwesome
;
// shortening font declaration
font-size
:
inherit
;
// can't have font-size inherit on line above, so need to override
text-rendering
:
auto
;
// optimizelegibility throws things off #1094
-webkit-font-smoothing
:
antialiased
;
...
...
@@ -11,14 +12,14 @@
}
@mixin
fa-icon-rotate
(
$degrees
,
$rotation
)
{
-ms-filter
:
'progid:DXImageTransform.Microsoft.BasicImage(rotation=
#{
$rotation
}
)'
;
-ms-filter
:
"progid:DXImageTransform.Microsoft.BasicImage(rotation=
#{
$rotation
}
)"
;
-webkit-transform
:
rotate
(
$degrees
);
-ms-transform
:
rotate
(
$degrees
);
transform
:
rotate
(
$degrees
);
}
@mixin
fa-icon-flip
(
$horiz
,
$vert
,
$rotation
)
{
-ms-filter
:
'progid:DXImageTransform.Microsoft.BasicImage(rotation=
#{
$rotation
}
, mirror=1)'
;
-ms-filter
:
"progid:DXImageTransform.Microsoft.BasicImage(rotation=
#{
$rotation
}
, mirror=1)"
;
-webkit-transform
:
scale
(
$horiz
,
$vert
);
-ms-transform
:
scale
(
$horiz
,
$vert
);
transform
:
scale
(
$horiz
,
$vert
);
...
...
public/sass/base/font-awesome/_path.scss
View file @
c4b57a25
...
...
@@ -2,13 +2,18 @@
* -------------------------- */
@font-face
{
font-family
:
'FontAwesome'
;
src
:
url('
#{
$fa-font-path
}
/fontawesome-webfont.eot?v=
#{
$fa-version
}
')
;
src
:
url('
#{
$fa-font-path
}
/fontawesome-webfont.eot?#iefix&v=
#{
$fa-version
}
')
format
(
'embedded-opentype'
)
,
url('
#{
$fa-font-path
}
/fontawesome-webfont.woff2?v=
#{
$fa-version
}
')
format
(
'woff2'
)
,
url('
#{
$fa-font-path
}
/fontawesome-webfont.woff?v=
#{
$fa-version
}
')
format
(
'woff'
)
,
url('
#{
$fa-font-path
}
/fontawesome-webfont.ttf?v=
#{
$fa-version
}
')
format
(
'truetype'
)
,
url('
#{
$fa-font-path
}
/fontawesome-webfont.svg?v=
#{
$fa-version
}
#fontawesomeregular')
format
(
'svg'
);
font-family
:
"FontAwesome"
;
src
:
url("
#{
$fa-font-path
}
/fontawesome-webfont.eot?v=
#{
$fa-version
}
")
;
src
:
url("
#{
$fa-font-path
}
/fontawesome-webfont.eot?#iefix&v=
#{
$fa-version
}
")
format
(
"embedded-opentype"
)
,
url("
#{
$fa-font-path
}
/fontawesome-webfont.woff2?v=
#{
$fa-version
}
")
format
(
"woff2"
)
,
url("
#{
$fa-font-path
}
/fontawesome-webfont.woff?v=
#{
$fa-version
}
")
format
(
"woff"
)
,
url("
#{
$fa-font-path
}
/fontawesome-webfont.ttf?v=
#{
$fa-version
}
")
format
(
"truetype"
)
,
url("
#{
$fa-font-path
}
/fontawesome-webfont.svg?v=
#{
$fa-version
}
#fontawesomeregular")
format
(
"svg"
);
// src: url('#{$fa-font-path}/FontAwesome.otf') format('opentype'); // used when developing fonts
font-weight
:
normal
;
font-style
:
normal
;
...
...
public/sass/base/font-awesome/_variables.scss
View file @
c4b57a25
This diff is collapsed.
Click to expand it.
public/sass/components/_drop.scss
View file @
c4b57a25
...
...
@@ -5,13 +5,13 @@ $useDropShadow: false;
$attachmentOffset
:
0%
;
$easing
:
cubic-bezier
(
0
,
0
,
0
.265
,
1
);
@include
drop-theme
(
'error'
,
$popover-error-bg
,
$popover-color
);
@include
drop-theme
(
'popover'
,
$popover-bg
,
$popover-color
,
$popover-border-color
);
@include
drop-theme
(
'help'
,
$popover-help-bg
,
$popover-help-color
);
@include
drop-theme
(
"error"
,
$popover-error-bg
,
$popover-color
);
@include
drop-theme
(
"popover"
,
$popover-bg
,
$popover-color
,
$popover-border-color
);
@include
drop-theme
(
"help"
,
$popover-help-bg
,
$popover-help-color
);
@include
drop-animation-scale
(
'drop'
,
'help'
,
$attachmentOffset
:
$attachmentOffset
,
$easing
:
$easing
);
@include
drop-animation-scale
(
'drop'
,
'error'
,
$attachmentOffset
:
$attachmentOffset
,
$easing
:
$easing
);
@include
drop-animation-scale
(
'drop'
,
'popover'
,
$attachmentOffset
:
$attachmentOffset
,
$easing
:
$easing
);
@include
drop-animation-scale
(
"drop"
,
"help"
,
$attachmentOffset
:
$attachmentOffset
,
$easing
:
$easing
);
@include
drop-animation-scale
(
"drop"
,
"error"
,
$attachmentOffset
:
$attachmentOffset
,
$easing
:
$easing
);
@include
drop-animation-scale
(
"drop"
,
"popover"
,
$attachmentOffset
:
$attachmentOffset
,
$easing
:
$easing
);
.drop-element
{
z-index
:
10000
;
...
...
public/sass/components/_filter-list.scss
View file @
c4b57a25
...
...
@@ -67,17 +67,17 @@
text-transform
:
uppercase
;
&
.online
{
background-image
:
url(
'/img/online.svg'
)
;
background-image
:
url(
"/img/online.svg"
)
;
color
:
$online
;
}
&
.warn
{
background-image
:
url(
'/img/warn-tiny.svg'
)
;
background-image
:
url(
"/img/warn-tiny.svg"
)
;
color
:
$warn
;
}
&
.critical
{
background-image
:
url(
'/img/critical.svg'
)
;
background-image
:
url(
"/img/critical.svg"
)
;
color
:
$critical
;
}
}
...
...
public/sass/components/_footer.scss
View file @
c4b57a25
...
...
@@ -25,7 +25,7 @@
display
:
inline-block
;
padding-right
:
2px
;
&
:
:
after
{
content
:
' | '
;
content
:
" | "
;
padding-left
:
2px
;
}
}
...
...
@@ -33,7 +33,7 @@
li
:last-child
{
&
:
:
after
{
padding-left
:
0
;
content
:
''
;
content
:
""
;
}
}
}
...
...
public/sass/components/_json_explorer.scss
View file @
c4b57a25
...
...
@@ -21,10 +21,10 @@
display
:
none
;
}
&.
json-formatter-object
:
:
after
{
content
:
'No properties'
;
content
:
"No properties"
;
}
&.
json-formatter-array
:
:
after
{
content
:
'[]'
;
content
:
"[]"
;
}
}
}
...
...
@@ -87,7 +87,7 @@
&
:
:
after
{
display
:
inline-block
;
transition
:
transform
$json-explorer-rotate-time
ease-in
;
content
:
'►'
;
content
:
"►"
;
}
}
...
...
public/sass/components/_jsontree.scss
View file @
c4b57a25
...
...
@@ -35,12 +35,12 @@ json-tree {
color
:
$variable
;
padding
:
5px
10px
5px
15px
;
&
:
:
after
{
content
:
':'
;
content
:
":"
;
}
}
json-node
.expandable
{
&
:
:
before
{
content
:
'\25b6'
;
content
:
"\25b6"
;
position
:
absolute
;
left
:
0px
;
font-size
:
8px
;
...
...
public/sass/components/_panel_gettingstarted.scss
View file @
c4b57a25
...
...
@@ -52,7 +52,7 @@ $path-position: $marker-size-half - ($path-height / 2);
&
:
:
after
{
right
:
-50%
;
content
:
''
;
content
:
""
;
display
:
block
;
position
:
absolute
;
z-index
:
1
;
...
...
@@ -105,7 +105,7 @@ $path-position: $marker-size-half - ($path-height / 2);
// change icon to check
.
icon-gf
:
:
before
{
content
:
'\e604'
;
content
:
"\e604"
;
}
}
.progress-text
{
...
...
public/sass/components/_row.scss
View file @
c4b57a25
...
...
@@ -69,7 +69,7 @@
cursor
:
move
;
width
:
1rem
;
height
:
100%
;
background
:
url(
'../img/grab_dark.svg'
)
no-repeat
50%
50%
;
background
:
url(
"../img/grab_dark.svg"
)
no-repeat
50%
50%
;
background-size
:
8px
;
visibility
:
hidden
;
position
:
absolute
;
...
...
public/sass/components/_shortcuts.scss
View file @
c4b57a25
...
...
@@ -33,7 +33,7 @@
text-align
:
center
;
margin-right
:
0
.3rem
;
padding
:
3px
5px
;
font
:
11px
Consolas
,
'Liberation Mono'
,
Menlo
,
Courier
,
monospace
;
font
:
11px
Consolas
,
"Liberation Mono"
,
Menlo
,
Courier
,
monospace
;
line-height
:
10px
;
color
:
#555
;
vertical-align
:
middle
;
...
...
public/sass/components/_switch.scss
View file @
c4b57a25
...
...
@@ -64,8 +64,8 @@
}
input
+
label
:
:
before
{
font-family
:
'FontAwesome'
;
content
:
'\f096'
;
// square-o
font-family
:
"FontAwesome"
;
content
:
"\f096"
;
// square-o
color
:
$text-color-weak
;
transition
:
transform
0
.4s
;
backface-visibility
:
hidden
;
...
...
@@ -73,11 +73,11 @@
}
input
+
label
:
:
after
{
content
:
'\f046'
;
// check-square-o
content
:
"\f046"
;
// check-square-o
color
:
$orange
;
text-shadow
:
$text-shadow-strong
;
font-family
:
'FontAwesome'
;
font-family
:
"FontAwesome"
;
transition
:
transform
0
.4s
;
transform
:
rotateY
(
180deg
);
backface-visibility
:
hidden
;
...
...
public/sass/components/_tabs.scss
View file @
c4b57a25
...
...
@@ -44,13 +44,18 @@
&
:
:
before
{
display
:
block
;
content
:
' '
;
content
:
" "
;
position
:
absolute
;
left
:
0
;
right
:
0
;
height
:
2px
;
top
:
0
;
background-image
:
linear-gradient
(
to
right
,
#ffd500
0%
,
#ff4400
99%
,
#ff4400
100%
);
background-image
:
linear-gradient
(
to
right
,
#ffd500
0%
,
#ff4400
99%
,
#ff4400
100%
);
}
}
}
public/sass/components/_timepicker.scss
View file @
c4b57a25
...
...
@@ -103,10 +103,10 @@
}
.
fa-chevron-left
:
:
before
{
content
:
'\f053'
;
content
:
"\f053"
;
}
.
fa-chevron-right
:
:
before
{
content
:
'\f054'
;
content
:
"\f054"
;
}
.glyphicon-chevron-right
{
...
...
public/sass/mixins/_drop_element.scss
View file @
c4b57a25
...
...
@@ -15,7 +15,7 @@
border
:
1px
solid
$border-color
;
&
:before
{
content
:
''
;
content
:
""
;
display
:
block
;
position
:
absolute
;
width
:
0
;
...
...
@@ -88,7 +88,8 @@
left
:
$popover-arrow-size
*
2
;
}
&
.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle
.drop-content
{
&
.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle
.drop-content
{
margin-top
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -98,7 +99,8 @@
}
}
&
.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle
.drop-content
{
&
.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle
.drop-content
{
margin-top
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -108,7 +110,8 @@
}
}
&
.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle
.drop-content
{
&
.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle
.drop-content
{
margin-bottom
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -118,7 +121,8 @@
}
}
&
.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle
.drop-content
{
&
.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle
.drop-content
{
margin-bottom
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -129,7 +133,8 @@
}
// Top and bottom corners
&
.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom
.drop-content
{
&
.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom
.drop-content
{
margin-top
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -139,7 +144,8 @@
}
}
&
.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom
.drop-content
{
&
.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom
.drop-content
{
margin-top
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -149,7 +155,8 @@
}
}
&
.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top
.drop-content
{
&
.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top
.drop-content
{
margin-bottom
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -159,7 +166,8 @@
}
}
&
.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top
.drop-content
{
&
.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top
.drop-content
{
margin-bottom
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -170,7 +178,8 @@
}
// Side corners
&
.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left
.drop-content
{
&
.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left
.drop-content
{
margin-right
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -180,7 +189,8 @@
}
}
&
.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right
.drop-content
{
&
.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right
.drop-content
{
margin-left
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -190,7 +200,8 @@
}
}
&
.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left
.drop-content
{
&
.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left
.drop-content
{
margin-right
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -200,7 +211,8 @@
}
}
&
.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right
.drop-content
{
&
.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right
.drop-content
{
margin-left
:
$popover-arrow-size
;
&
:before
{
...
...
@@ -212,7 +224,7 @@
}
}
@mixin
drop-animation-scale
(
$themePrefix
:
'drop'
,
$themeName
:
'default'
,
$attachmentOffset
:
0
,
$easing
:
'linear'
)
{
@mixin
drop-animation-scale
(
$themePrefix
:
"drop"
,
$themeName
:
"default"
,
$attachmentOffset
:
0
,
$easing
:
"linear"
)
{
.
#{
$themePrefix
}
-element.
#{
$themePrefix
}
-
#{
$themeName
}
{
transform
:
translateZ
(
0
);
transition
:
opacity
100ms
;
...
...
@@ -235,16 +247,20 @@
}
}
// Centers and middles
&
.
#{
$themePrefix
}
-element-attached-bottom.
#{
$themePrefix
}
-element-attached-center
.
#{
$themePrefix
}
-content
{
&
.
#{
$themePrefix
}
-element-attached-bottom.
#{
$themePrefix
}
-element-attached-center
.
#{
$themePrefix
}
-content
{
transform-origin
:
50%
calc
(
100%
+
#{
$attachmentOffset
}
);
}
&
.
#{
$themePrefix
}
-element-attached-top.
#{
$themePrefix
}
-element-attached-center
.
#{
$themePrefix
}
-content
{
&
.
#{
$themePrefix
}
-element-attached-top.
#{
$themePrefix
}
-element-attached-center
.
#{
$themePrefix
}
-content
{
transform-origin
:
50%
(
-
$attachmentOffset
);
}
&
.
#{
$themePrefix
}
-element-attached-right.
#{
$themePrefix
}
-element-attached-middle
.
#{
$themePrefix
}
-content
{
&
.
#{
$themePrefix
}
-element-attached-right.
#{
$themePrefix
}
-element-attached-middle
.
#{
$themePrefix
}
-content
{
transform-origin
:
calc
(
100%
+
#{
$attachmentOffset
}
)
50%
;
}
&
.
#{
$themePrefix
}
-element-attached-left.
#{
$themePrefix
}
-element-attached-middle
.
#{
$themePrefix
}
-content
{
&
.
#{
$themePrefix
}
-element-attached-left.
#{
$themePrefix
}
-element-attached-middle
.
#{
$themePrefix
}
-content
{
transform-origin
:
-
(
$attachmentOffset
50%
);
}
// Top and bottom corners
...
...
public/sass/mixins/_forms.scss
View file @
c4b57a25
...
...
@@ -41,7 +41,8 @@
&
:focus
{
border-color
:
$input-border-focus
;
outline
:
none
;
$shadow
:
inset
0
1px
1px
rgba
(
0
,
0
,
0
,
0
.075
)
,
0
0
5px
$input-box-shadow-focus
;
$shadow
:
inset
0
1px
1px
rgba
(
0
,
0
,
0
,
0
.075
)
,
0
0
5px
$input-box-shadow-focus
;
@include
box-shadow
(
$shadow
);
}
}
...
...
public/sass/mixins/_mixins.scss
View file @
c4b57a25
@mixin
clearfix
()
{
&
:
:
after
{
content
:
''
;
content
:
""
;
display
:
table
;
clear
:
both
;
}
...
...
@@ -265,10 +265,20 @@
// Add an alphatransparency value to any background or border color (via Elyse Holladay)
#translucent
{
@mixin
background
(
$color
:
$white
,
$alpha
:
1
)
{
background-color
:
hsla
(
hue
(
$color
)
,
saturation
(
$color
)
,
lightness
(
$color
)
,
$alpha
);
background-color
:
hsla
(
hue
(
$color
)
,
saturation
(
$color
)
,
lightness
(
$color
)
,
$alpha
);
}
@mixin
border
(
$color
:
$white
,
$alpha
:
1
)
{
border-color
:
hsla
(
hue
(
$color
)
,
saturation
(
$color
)
,
lightness
(
$color
)
,
$alpha
);
border-color
:
hsla
(
hue
(
$color
)
,
saturation
(
$color
)
,
lightness
(
$color
)
,
$alpha
);
@include
background-clip
(
padding-box
);
}
}
...
...
@@ -284,37 +294,66 @@
// Gradients
@mixin
gradient-horizontal
(
$startColor
:
#555
,
$endColor
:
#333
)
{
background-color
:
$endColor
;
background-image
:
linear-gradient
(
to
right
,
$startColor
,
$endColor
);
// Standard, IE10
background-image
:
linear-gradient
(
to
right
,
$startColor
,
$endColor
);
// Standard, IE10
background-repeat
:
repeat-x
;
}
@mixin
gradient-vertical
(
$startColor
:
#555
,
$endColor
:
#333
)
{
background-color
:
mix
(
$startColor
,
$endColor
,
60%
);
background-image
:
linear-gradient
(
to
bottom
,
$startColor
,
$endColor
);
// Standard, IE10
background-image
:
linear-gradient
(
to
bottom
,
$startColor
,
$endColor
);
// Standard, IE10
background-repeat
:
repeat-x
;
}
@mixin
gradient-directional
(
$startColor
:
#555
,
$endColor
:
#333
,
$deg
:
45deg
)
{
background-color
:
$endColor
;
background-repeat
:
repeat-x
;
background-image
:
linear-gradient
(
$deg
,
$startColor
,
$endColor
);
// Standard, IE10
background-image
:
linear-gradient
(
$deg
,
$startColor
,
$endColor
);
// Standard, IE10
}
@mixin
gradient-horizontal-three-colors
(
$startColor
:
#00b3ee
,
$midColor
:
#7a43b6
,
$colorStop
:
50%
,
$endColor
:
#c3325f
)
{
background-color
:
mix
(
$midColor
,
$endColor
,
80%
);
background-image
:
linear-gradient
(
to
right
,
$startColor
,
$midColor
$colorStop
,
$endColor
);
background-image
:
linear-gradient
(
to
right
,
$startColor
,
$midColor
$colorStop
,
$endColor
);
background-repeat
:
no-repeat
;
}
@mixin
gradient-vertical-three-colors
(
$startColor
:
#00b3ee
,
$midColor
:
#7a43b6
,
$colorStop
:
50%
,
$endColor
:
#c3325f
)
{
background-color
:
mix
(
$midColor
,
$endColor
,
80%
);
background-image
:
linear-gradient
(
$startColor
,
$midColor
$colorStop
,
$endColor
);
background-image
:
linear-gradient
(
$startColor
,
$midColor
$colorStop
,
$endColor
);
background-repeat
:
no-repeat
;
}
@mixin
gradient-radial
(
$innerColor
:
#555
,
$outerColor
:
#333
)
{
background-color
:
$outerColor
;
background-image
:
-webkit-gradient
(
radial
,
center
center
,
0
,
center
center
,
460
,
from
(
$innerColor
)
,
to
(
$outerColor
));
background-image
:
-webkit-gradient
(
radial
,
center
center
,
0
,
center
center
,
460
,
from
(
$innerColor
)
,
to
(
$outerColor
)
);
background-image
:
-webkit-radial-gradient
(
circle
,
$innerColor
,
$outerColor
);
background-image
:
-moz-radial-gradient
(
circle
,
$innerColor
,
$outerColor
);
background-image
:
-o-radial-gradient
(
circle
,
$innerColor
,
$outerColor
);
...
...
@@ -341,7 +380,11 @@
@mixin
left-brand-border-gradient
()
{
border
:
none
;
border-image
:
linear-gradient
(
rgba
(
255
,
213
,
0
,
1
)
0%
,
rgba
(
255
,
68
,
0
,
1
)
99%
,
rgba
(
255
,
68
,
0
,
1
)
100%
);
border-image
:
linear-gradient
(
rgba
(
255
,
213
,
0
,
1
)
0%
,
rgba
(
255
,
68
,
0
,
1
)
99%
,
rgba
(
255
,
68
,
0
,
1
)
100%
);
border-image-slice
:
1
;
border-style
:
solid
;
border-top
:
0
;
...
...
public/sass/pages/_playlist.scss
View file @
c4b57a25
...
...
@@ -84,11 +84,11 @@
background-color
:
$list-item-bg
;
margin-bottom
:
4px
;
.search-result-icon
:before
{
content
:
'\f009'
;
content
:
"\f009"
;
}
&
.search-item-dash-home
.search-result-icon
:before
{
content
:
'\f015'
;
content
:
"\f015"
;
}
}
...
...
public/sass/utils/_validation.scss
View file @
c4b57a25
input
[
type
=
'text'
]
.ng-dirty.ng-invalid
{
input
[
type
=
"text"
]
.ng-dirty.ng-invalid
{
}
input
.validation-error
,
...
...
public/test/core/utils/version_specs.ts
View file @
c4b57a25
import
{
describe
,
beforeEach
,
it
,
expect
}
from
'test/lib/common'
;
import
{
describe
,
beforeEach
,
it
,
expect
}
from
'test/lib/common'
;
import
{
SemVersion
,
isVersionGtOrEq
}
from
'app/core/utils/version'
;
import
{
SemVersion
,
isVersionGtOrEq
}
from
'app/core/utils/version'
;
describe
(
'SemVersion'
,
()
=>
{
describe
(
"SemVersion"
,
()
=>
{
let
version
=
'1.0.0-alpha.1'
;
describe
(
'parsing'
,
()
=>
{
...
...
@@ -23,13 +23,13 @@ describe('SemVersion', () => {
it
(
'should detect greater version properly'
,
()
=>
{
let
semver
=
new
SemVersion
(
version
);
let
cases
=
[
{
value
:
'3.4.5'
,
expected
:
true
},
{
value
:
'3.4.4'
,
expected
:
true
},
{
value
:
'3.4.6'
,
expected
:
false
},
{
value
:
'4'
,
expected
:
false
},
{
value
:
'3.5'
,
expected
:
false
},
{
value
:
'3.4.5'
,
expected
:
true
},
{
value
:
'3.4.4'
,
expected
:
true
},
{
value
:
'3.4.6'
,
expected
:
false
},
{
value
:
'4'
,
expected
:
false
},
{
value
:
'3.5'
,
expected
:
false
},
];
cases
.
forEach
(
testCase
=>
{
cases
.
forEach
(
(
testCase
)
=>
{
expect
(
semver
.
isGtOrEq
(
testCase
.
value
)).
to
.
be
(
testCase
.
expected
);
});
});
...
...
@@ -38,16 +38,16 @@ describe('SemVersion', () => {
describe
(
'isVersionGtOrEq'
,
()
=>
{
it
(
'should compare versions properly (a >= b)'
,
()
=>
{
let
cases
=
[
{
values
:
[
'3.4.5'
,
'3.4.5'
],
expected
:
true
},
{
values
:
[
'3.4.5'
,
'3.4.4'
],
expected
:
true
},
{
values
:
[
'3.4.5'
,
'3.4.6'
],
expected
:
false
},
{
values
:
[
'3.4'
,
'3.4.0'
],
expected
:
true
},
{
values
:
[
'3'
,
'3.0.0'
],
expected
:
true
},
{
values
:
[
'3.1.1-beta1'
,
'3.1'
],
expected
:
true
},
{
values
:
[
'3.4.5'
,
'4'
],
expected
:
false
},
{
values
:
[
'3.4.5'
,
'3.5'
],
expected
:
false
},
{
values
:
[
'3.4.5'
,
'3.4.5'
],
expected
:
true
},
{
values
:
[
'3.4.5'
,
'3.4.4'
]
,
expected
:
true
},
{
values
:
[
'3.4.5'
,
'3.4.6'
],
expected
:
false
},
{
values
:
[
'3.4'
,
'3.4.0'
],
expected
:
true
},
{
values
:
[
'3'
,
'3.0.0'
],
expected
:
true
},
{
values
:
[
'3.1.1-beta1'
,
'3.1'
],
expected
:
true
},
{
values
:
[
'3.4.5'
,
'4'
],
expected
:
false
},
{
values
:
[
'3.4.5'
,
'3.5'
],
expected
:
false
},
];
cases
.
forEach
(
testCase
=>
{
cases
.
forEach
(
(
testCase
)
=>
{
expect
(
isVersionGtOrEq
(
testCase
.
values
[
0
],
testCase
.
values
[
1
])).
to
.
be
(
testCase
.
expected
);
});
});
...
...
public/test/index.ts
View file @
c4b57a25
...
...
@@ -25,3 +25,7 @@ const context = (<any>require).context('../', true, /specs\.(tsx?|js)/);
for
(
let
key
of
context
.
keys
())
{
context
(
key
);
}
public/test/jest-shim.ts
View file @
c4b57a25
declare
var
global
:
NodeJS
.
Global
;
(
<
any
>
global
).
requestAnimationFrame
=
callback
=>
{
(
<
any
>
global
).
requestAnimationFrame
=
(
callback
)
=>
{
setTimeout
(
callback
,
0
);
};
public/test/lib/common.ts
View file @
c4b57a25
var
_global
=
<
any
>
window
;
var
_global
=
<
any
>
(
window
)
;
var
beforeEach
=
_global
.
beforeEach
;
var
afterEach
=
_global
.
afterEach
;
var
before
=
_global
.
before
;
...
...
@@ -12,4 +12,13 @@ var angularMocks = {
inject
:
_global
.
inject
,
};
export
{
beforeEach
,
afterEach
,
before
,
describe
,
it
,
sinon
,
expect
,
angularMocks
};
export
{
beforeEach
,
afterEach
,
before
,
describe
,
it
,
sinon
,
expect
,
angularMocks
,
};
public/test/mocks/backend_srv.ts
View file @
c4b57a25
export
class
BackendSrvMock
{
search
:
any
;
constructor
()
{}
constructor
()
{
}
}
public/test/specs/app_specs.ts
View file @
c4b57a25
import
{
describe
,
it
,
expect
}
from
'test/lib/common'
;
import
{
describe
,
it
,
expect
}
from
'test/lib/common'
;
import
{
GrafanaApp
}
from
'app/app'
;
import
{
GrafanaApp
}
from
'app/app'
;
describe
(
'GrafanaApp'
,
()
=>
{
var
app
=
new
GrafanaApp
();
it
(
'can call inits'
,
()
=>
{
expect
(
app
).
to
.
not
.
be
(
null
);
});
});
public/test/specs/helpers.ts
View file @
c4b57a25
import
_
from
'lodash'
;
import
config
from
'app/core/config'
;
import
*
as
dateMath
from
'app/core/utils/datemath'
;
import
{
angularMocks
,
sinon
}
from
'../lib/common'
;
import
{
PanelModel
}
from
'app/features/dashboard/panel_model'
;
import
{
angularMocks
,
sinon
}
from
'../lib/common'
;
import
{
PanelModel
}
from
'app/features/dashboard/panel_model'
;
export
function
ControllerTestContext
()
{
var
self
=
this
;
...
...
@@ -42,8 +42,8 @@ export function ControllerTestContext() {
self
.
$location
=
$location
;
self
.
$browser
=
$browser
;
self
.
$q
=
$q
;
self
.
panel
=
new
PanelModel
({
type
:
'test'
});
self
.
dashboard
=
{
meta
:
{}
};
self
.
panel
=
new
PanelModel
({
type
:
'test'
});
self
.
dashboard
=
{
meta
:
{}
};
$rootScope
.
appEvent
=
sinon
.
spy
();
$rootScope
.
onAppEvent
=
sinon
.
spy
();
...
...
@@ -53,14 +53,14 @@ export function ControllerTestContext() {
$rootScope
.
colors
.
push
(
'#'
+
i
);
}
config
.
panels
[
'test'
]
=
{
info
:
{}
};
config
.
panels
[
'test'
]
=
{
info
:
{}
};
self
.
ctrl
=
$controller
(
Ctrl
,
{
$scope
:
self
.
scope
},
{
$scope
:
self
.
scope
},
{
panel
:
self
.
panel
,
dashboard
:
self
.
dashboard
,
}
}
,
);
});
};
...
...
@@ -72,7 +72,7 @@ export function ControllerTestContext() {
self
.
$browser
=
$browser
;
self
.
scope
.
contextSrv
=
{};
self
.
scope
.
panel
=
{};
self
.
scope
.
dashboard
=
{
meta
:
{}
};
self
.
scope
.
dashboard
=
{
meta
:
{}
};
self
.
scope
.
dashboardMeta
=
{};
self
.
scope
.
dashboardViewState
=
new
DashboardViewStateStub
();
self
.
scope
.
appEvent
=
sinon
.
spy
();
...
...
@@ -131,7 +131,7 @@ export function DashboardViewStateStub() {
export
function
TimeSrvStub
()
{
this
.
init
=
sinon
.
spy
();
this
.
time
=
{
from
:
'now-1h'
,
to
:
'now'
};
this
.
time
=
{
from
:
'now-1h'
,
to
:
'now'
};
this
.
timeRange
=
function
(
parse
)
{
if
(
parse
===
false
)
{
return
this
.
time
;
...
...
@@ -159,7 +159,7 @@ export function ContextSrvStub() {
export
function
TemplateSrvStub
()
{
this
.
variables
=
[];
this
.
templateSettings
=
{
interpolate
:
/
\[\[([\s\S]
+
?)\]\]
/g
};
this
.
templateSettings
=
{
interpolate
:
/
\[\[([\s\S]
+
?)\]\]
/g
};
this
.
data
=
{};
this
.
replace
=
function
(
text
)
{
return
_
.
template
(
text
,
this
.
templateSettings
)(
this
.
data
);
...
...
@@ -188,7 +188,7 @@ var allDeps = {
TimeSrvStub
:
TimeSrvStub
,
ControllerTestContext
:
ControllerTestContext
,
ServiceTestContext
:
ServiceTestContext
,
DashboardViewStateStub
:
DashboardViewStateStub
,
DashboardViewStateStub
:
DashboardViewStateStub
};
// for legacy
...
...
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