git-visualiser 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +15 -0
- data/bin/git_vis +19 -0
- data/lib/application/application.rb +82 -0
- data/lib/application/coffee_engine.rb +20 -0
- data/lib/application/images/ajax-loader.gif +0 -0
- data/lib/application/javascripts/branch_graph.coffee +424 -0
- data/lib/application/javascripts/commit_graph.coffee +442 -0
- data/lib/application/javascripts/common.coffee +50 -0
- data/lib/application/javascripts/d3.min.js +5 -0
- data/lib/application/javascripts/data_convert.coffee +56 -0
- data/lib/application/javascripts/jquery.min.js +6 -0
- data/lib/application/javascripts/moment.min.js +6 -0
- data/lib/application/javascripts/namespace.coffee +2 -0
- data/lib/application/sass_engine.rb +14 -0
- data/lib/application/stylesheets/scss/app.scss +172 -0
- data/lib/application/stylesheets/scss/flat_ui/_config.sass +16 -0
- data/lib/application/stylesheets/scss/flat_ui/_icon-font-24.sass +91 -0
- data/lib/application/stylesheets/scss/flat_ui/_icon-font.sass +91 -0
- data/lib/application/stylesheets/scss/flat_ui/_mixins.sass +96 -0
- data/lib/application/stylesheets/scss/flat_ui/_spaces.sass +129 -0
- data/lib/application/stylesheets/scss/flat_ui/flat-ui.sass +39 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_btn.sass +73 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_checkbox-and-radio.sass +86 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_demo.sass +228 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_footer.sass +57 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_input.sass +66 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_login.sass +95 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_navbar.sass +152 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_pager.sass +56 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_pagination.sass +75 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_palette.sass +88 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_progress.sass +29 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_select.sass +163 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_share.sass +34 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_tagsinput.sass +91 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_tile.sass +42 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_todo.sass +77 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_toggle.sass +85 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_tooltip.sass +45 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_type.sass +43 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_ui-slider.sass +44 -0
- data/lib/application/stylesheets/scss/flat_ui/modules/_video.sass +358 -0
- data/lib/application/views/authors_list.haml +11 -0
- data/lib/application/views/index.haml +48 -0
- data/lib/application/visualisation.rb +156 -0
- metadata +87 -0
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
// Mixins
|
|
2
|
+
=animation($properties)
|
|
3
|
+
-webkit-animation: $properties
|
|
4
|
+
-moz-animation: $properties
|
|
5
|
+
-o-animation: $properties
|
|
6
|
+
animation: $properties
|
|
7
|
+
|
|
8
|
+
=border-radius($radius)
|
|
9
|
+
-webkit-border-radius: $radius
|
|
10
|
+
-moz-border-radius: $radius
|
|
11
|
+
border-radius: $radius
|
|
12
|
+
|
|
13
|
+
=box-sizing
|
|
14
|
+
-webkit-box-sizing: border-box
|
|
15
|
+
-moz-box-sizing: border-box
|
|
16
|
+
box-sizing: border-box
|
|
17
|
+
// *behavior: url('../js/boxsizing.htc')
|
|
18
|
+
|
|
19
|
+
=box-shadow($properties)
|
|
20
|
+
-webkit-box-shadow: $properties
|
|
21
|
+
-moz-box-shadow: $properties
|
|
22
|
+
box-shadow: $properties
|
|
23
|
+
|
|
24
|
+
=inline-block
|
|
25
|
+
display: inline-block
|
|
26
|
+
zoom: 1
|
|
27
|
+
*display: inline
|
|
28
|
+
|
|
29
|
+
=opacity($value)
|
|
30
|
+
opacity: $value
|
|
31
|
+
filter: alpha(opacity=$value*100)
|
|
32
|
+
zoom: 1
|
|
33
|
+
|
|
34
|
+
=placeholder-color($color)
|
|
35
|
+
&:-moz-placeholder
|
|
36
|
+
color: $color
|
|
37
|
+
&::-webkit-input-placeholder
|
|
38
|
+
color: $color
|
|
39
|
+
&.placeholder
|
|
40
|
+
color: $color
|
|
41
|
+
|
|
42
|
+
=transition($properties)
|
|
43
|
+
-webkit-transition: $properties
|
|
44
|
+
-moz-transition: $properties
|
|
45
|
+
-o-transition: $properties
|
|
46
|
+
transition: $properties
|
|
47
|
+
-webkit-backface-visibility: hidden
|
|
48
|
+
|
|
49
|
+
=transform($properties)
|
|
50
|
+
-webkit-transform: $properties
|
|
51
|
+
-moz-transform: $properties
|
|
52
|
+
-ms-transform: $properties
|
|
53
|
+
-o-transform: $properties
|
|
54
|
+
transform: $properties
|
|
55
|
+
|
|
56
|
+
=vertical-gradient($from, $to)
|
|
57
|
+
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, $from), color-stop(100%, $to))
|
|
58
|
+
background: -webkit-linear-gradient(top, $from, $to)
|
|
59
|
+
background: -moz-linear-gradient(top, $from, $to)
|
|
60
|
+
background: -ms-linear-gradient(top, $from, $to)
|
|
61
|
+
background: -o-linear-gradient(top, $from, $to)
|
|
62
|
+
background: linear-gradient(to bottom, $from, $to)
|
|
63
|
+
|
|
64
|
+
=selection($color)
|
|
65
|
+
&::selection
|
|
66
|
+
background: $color
|
|
67
|
+
|
|
68
|
+
&::-moz-selection
|
|
69
|
+
background: $color
|
|
70
|
+
|
|
71
|
+
=clearfix
|
|
72
|
+
*zoom: 1
|
|
73
|
+
&:before,
|
|
74
|
+
&:after
|
|
75
|
+
display: table
|
|
76
|
+
content: ''
|
|
77
|
+
&:after
|
|
78
|
+
clear: both
|
|
79
|
+
|
|
80
|
+
=dropdown-arrow($color: $base, $top: 5px, $left: 15px, $size: 9px)
|
|
81
|
+
&:before
|
|
82
|
+
content: ''
|
|
83
|
+
border-style: solid
|
|
84
|
+
border-width: 0 $size $size $size
|
|
85
|
+
border-color: transparent transparent $color transparent
|
|
86
|
+
height: 0px
|
|
87
|
+
position: absolute
|
|
88
|
+
left: $left
|
|
89
|
+
top: $top
|
|
90
|
+
width: 0px
|
|
91
|
+
// Make corners smooth
|
|
92
|
+
-webkit-transform: rotate(360deg)
|
|
93
|
+
|
|
94
|
+
=drop-ie-gradient
|
|
95
|
+
filter: unquote('progid:DXImageTransform.Microsoft.gradient(enabled = false)')
|
|
96
|
+
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
// Should be used to modify the default spacing between objects (not between nodes of * the same object)
|
|
2
|
+
// p,m = padding,margin
|
|
3
|
+
// a,t,r,b,l,h,v = all,top,right,bottom,left,horizontal,vertical
|
|
4
|
+
// x,s,m,l,n = extra-small($x),small($s),medium($m),large($l),none(0px)
|
|
5
|
+
$x: 3px
|
|
6
|
+
$s: 5px
|
|
7
|
+
$m: 10px
|
|
8
|
+
$l: 20px
|
|
9
|
+
|
|
10
|
+
.ptn, .pvn, .pan
|
|
11
|
+
padding-top: 0
|
|
12
|
+
|
|
13
|
+
.ptx, .pvx, .pax
|
|
14
|
+
padding-top: $x
|
|
15
|
+
|
|
16
|
+
.pts, .pvs, .pas
|
|
17
|
+
padding-top: $s
|
|
18
|
+
|
|
19
|
+
.ptm, .pvm, .pam
|
|
20
|
+
padding-top: $m
|
|
21
|
+
|
|
22
|
+
.ptl, .pvl, .pal
|
|
23
|
+
padding-top: $l
|
|
24
|
+
|
|
25
|
+
.prn, .phn, .pan
|
|
26
|
+
padding-right: 0
|
|
27
|
+
|
|
28
|
+
.prx, .phx, .pax
|
|
29
|
+
padding-right: $x
|
|
30
|
+
|
|
31
|
+
.prs, .phs, .pas
|
|
32
|
+
padding-right: $s
|
|
33
|
+
|
|
34
|
+
.prm, .phm, .pam
|
|
35
|
+
padding-right: $m
|
|
36
|
+
|
|
37
|
+
.prl, .phl, .pal
|
|
38
|
+
padding-right: $l
|
|
39
|
+
|
|
40
|
+
.pbn, .pvn, .pan
|
|
41
|
+
padding-bottom: 0
|
|
42
|
+
|
|
43
|
+
.pbx, .pvx, .pax
|
|
44
|
+
padding-bottom: $x
|
|
45
|
+
|
|
46
|
+
.pbs, .pvs, .pas
|
|
47
|
+
padding-bottom: $s
|
|
48
|
+
|
|
49
|
+
.pbm, .pvm, .pam
|
|
50
|
+
padding-bottom: $m
|
|
51
|
+
|
|
52
|
+
.pbl, .pvl, .pal
|
|
53
|
+
padding-bottom: $l
|
|
54
|
+
|
|
55
|
+
.pln, .phn, .pan
|
|
56
|
+
padding-left: 0
|
|
57
|
+
|
|
58
|
+
.plx, .phx, .pax
|
|
59
|
+
padding-left: $x
|
|
60
|
+
|
|
61
|
+
.pls, .phs, .pas
|
|
62
|
+
padding-left: $s
|
|
63
|
+
|
|
64
|
+
.plm, .phm, .pam
|
|
65
|
+
padding-left: $m
|
|
66
|
+
|
|
67
|
+
.pll, .phl, .pal
|
|
68
|
+
padding-left: $l
|
|
69
|
+
|
|
70
|
+
.mtn, .mvn, .man
|
|
71
|
+
margin-top: 0px
|
|
72
|
+
|
|
73
|
+
.mtx, .mvx, .max
|
|
74
|
+
margin-top: $x
|
|
75
|
+
|
|
76
|
+
.mts, .mvs, .mas
|
|
77
|
+
margin-top: $s
|
|
78
|
+
|
|
79
|
+
.mtm, .mvm, .mam
|
|
80
|
+
margin-top: $m
|
|
81
|
+
|
|
82
|
+
.mtl, .mvl, .mal
|
|
83
|
+
margin-top: $l
|
|
84
|
+
|
|
85
|
+
.mrn, .mhn, .man
|
|
86
|
+
margin-right: 0px
|
|
87
|
+
|
|
88
|
+
.mrx, .mhx, .max
|
|
89
|
+
margin-right: $x
|
|
90
|
+
|
|
91
|
+
.mrs, .mhs, .mas
|
|
92
|
+
margin-right: $s
|
|
93
|
+
|
|
94
|
+
.mrm, .mhm, .mam
|
|
95
|
+
margin-right: $m
|
|
96
|
+
|
|
97
|
+
.mrl, .mhl, .mal
|
|
98
|
+
margin-right: $l
|
|
99
|
+
|
|
100
|
+
.mbn, .mvn, .man
|
|
101
|
+
margin-bottom: 0px
|
|
102
|
+
|
|
103
|
+
.mbx, .mvx, .max
|
|
104
|
+
margin-bottom: $x
|
|
105
|
+
|
|
106
|
+
.mbs, .mvs, .mas
|
|
107
|
+
margin-bottom: $s
|
|
108
|
+
|
|
109
|
+
.mbm, .mvm, .mam
|
|
110
|
+
margin-bottom: $m
|
|
111
|
+
|
|
112
|
+
.mbl, .mvl, .mal
|
|
113
|
+
margin-bottom: $l
|
|
114
|
+
|
|
115
|
+
.mln, .mhn, .man
|
|
116
|
+
margin-left: 0px
|
|
117
|
+
|
|
118
|
+
.mlx, .mhx, .max
|
|
119
|
+
margin-left: $x
|
|
120
|
+
|
|
121
|
+
.mls, .mhs, .mas
|
|
122
|
+
margin-left: $s
|
|
123
|
+
|
|
124
|
+
.mlm, .mhm, .mam
|
|
125
|
+
margin-left: $m
|
|
126
|
+
|
|
127
|
+
.mll, .mhl, .mal
|
|
128
|
+
margin-left: $l
|
|
129
|
+
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
// Flat UI main stylesheet that aggregates all modules
|
|
2
|
+
|
|
3
|
+
// Loading custom fonts
|
|
4
|
+
@import url('http://fonts.googleapis.com/css?family=Lato:400,700,900,400italic')
|
|
5
|
+
@import 'icon-font'
|
|
6
|
+
@import 'icon-font-24'
|
|
7
|
+
|
|
8
|
+
// Loading config with variables (changing them leads to changing a color scheme)
|
|
9
|
+
@import 'config'
|
|
10
|
+
|
|
11
|
+
// Utility mixins for greater good
|
|
12
|
+
@import 'mixins'
|
|
13
|
+
|
|
14
|
+
// Modules
|
|
15
|
+
@import 'modules/type'
|
|
16
|
+
@import 'modules/btn'
|
|
17
|
+
@import 'modules/demo'
|
|
18
|
+
@import 'modules/navbar'
|
|
19
|
+
@import 'modules/select'
|
|
20
|
+
@import 'modules/input'
|
|
21
|
+
@import 'modules/checkbox-and-radio'
|
|
22
|
+
@import 'modules/toggle'
|
|
23
|
+
@import 'modules/tagsinput'
|
|
24
|
+
@import 'modules/progress'
|
|
25
|
+
@import 'modules/ui-slider'
|
|
26
|
+
@import 'modules/pager'
|
|
27
|
+
@import 'modules/pagination'
|
|
28
|
+
@import 'modules/share'
|
|
29
|
+
@import 'modules/tooltip'
|
|
30
|
+
@import 'modules/palette'
|
|
31
|
+
@import 'modules/tile'
|
|
32
|
+
@import 'modules/todo'
|
|
33
|
+
@import 'modules/footer'
|
|
34
|
+
@import 'modules/video'
|
|
35
|
+
@import 'modules/login'
|
|
36
|
+
|
|
37
|
+
// Spaces
|
|
38
|
+
@import 'spaces'
|
|
39
|
+
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
=button-states($color)
|
|
2
|
+
background-color: $color
|
|
3
|
+
&:hover,
|
|
4
|
+
&:focus
|
|
5
|
+
background-color: scale-color($color, $lightness: 20%)
|
|
6
|
+
&:active,
|
|
7
|
+
&.active
|
|
8
|
+
background-color: scale-color($color, $lightness: -15%)
|
|
9
|
+
|
|
10
|
+
// Buttons -----------------------
|
|
11
|
+
.btn
|
|
12
|
+
border: none
|
|
13
|
+
background: $base
|
|
14
|
+
color: $inverse
|
|
15
|
+
font-size: 16.5px
|
|
16
|
+
text-decoration: none
|
|
17
|
+
text-shadow: none
|
|
18
|
+
+box-shadow(none)
|
|
19
|
+
+transition(.25s)
|
|
20
|
+
|
|
21
|
+
&:hover,
|
|
22
|
+
&:focus
|
|
23
|
+
background-color: scale-color($base, $lightness: 20%)
|
|
24
|
+
color: $inverse
|
|
25
|
+
+transition(.25s)
|
|
26
|
+
|
|
27
|
+
&:active,
|
|
28
|
+
&.active
|
|
29
|
+
background-color: scale-color($base, $lightness: -15%)
|
|
30
|
+
color: rgba($inverse, .75)
|
|
31
|
+
+box-shadow(none)
|
|
32
|
+
|
|
33
|
+
&.disabled,
|
|
34
|
+
&[disabled]
|
|
35
|
+
background-color: $gray
|
|
36
|
+
color: $inverse
|
|
37
|
+
|
|
38
|
+
// Sizes -----------------------
|
|
39
|
+
&.btn-large
|
|
40
|
+
padding-bottom: 12px
|
|
41
|
+
padding-top: 13px
|
|
42
|
+
|
|
43
|
+
// Colors -----------------------
|
|
44
|
+
&.btn-primary
|
|
45
|
+
+button-states($firm)
|
|
46
|
+
|
|
47
|
+
&.btn-info
|
|
48
|
+
+button-states($info)
|
|
49
|
+
|
|
50
|
+
&.btn-danger
|
|
51
|
+
+button-states($danger)
|
|
52
|
+
|
|
53
|
+
&.btn-success
|
|
54
|
+
+button-states($success)
|
|
55
|
+
|
|
56
|
+
&.btn-warning
|
|
57
|
+
+button-states($warning)
|
|
58
|
+
|
|
59
|
+
// Button with icon inside
|
|
60
|
+
.btn-toolbar &
|
|
61
|
+
font-size: 18px
|
|
62
|
+
padding: 10px 14px 9px
|
|
63
|
+
|
|
64
|
+
&:first-child
|
|
65
|
+
+border-radius(6px 0 0 6px)
|
|
66
|
+
|
|
67
|
+
&:last-child
|
|
68
|
+
+border-radius(0 6px 6px 0)
|
|
69
|
+
|
|
70
|
+
.btn-toolbar
|
|
71
|
+
.btn.active
|
|
72
|
+
color: $inverse
|
|
73
|
+
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
// Checkbox & Radio
|
|
2
|
+
.checkbox,
|
|
3
|
+
.radio
|
|
4
|
+
margin-bottom: 12px
|
|
5
|
+
padding-left: 32px
|
|
6
|
+
position: relative
|
|
7
|
+
+transition(.25s)
|
|
8
|
+
|
|
9
|
+
&:hover
|
|
10
|
+
color: $firm
|
|
11
|
+
|
|
12
|
+
input
|
|
13
|
+
outline: none !important
|
|
14
|
+
+opacity(0)
|
|
15
|
+
|
|
16
|
+
&.checked
|
|
17
|
+
.icon
|
|
18
|
+
background-position: -60px -30px
|
|
19
|
+
opacity: 1
|
|
20
|
+
display: block\9
|
|
21
|
+
|
|
22
|
+
.icon-to-fade
|
|
23
|
+
opacity: 0
|
|
24
|
+
display: none\9
|
|
25
|
+
|
|
26
|
+
// Disabled state
|
|
27
|
+
&.disabled
|
|
28
|
+
color: scale-color($gray, $lightness: 62%)
|
|
29
|
+
cursor: default
|
|
30
|
+
|
|
31
|
+
.icon
|
|
32
|
+
opacity: 0
|
|
33
|
+
display: none\9
|
|
34
|
+
|
|
35
|
+
.icon-to-fade
|
|
36
|
+
background-position: -30px -60px
|
|
37
|
+
opacity: 1
|
|
38
|
+
display: block\9
|
|
39
|
+
|
|
40
|
+
&.checked
|
|
41
|
+
.icon
|
|
42
|
+
background-position: 0 -90px
|
|
43
|
+
opacity: 1
|
|
44
|
+
display: block\9
|
|
45
|
+
|
|
46
|
+
.icon-to-fade
|
|
47
|
+
opacity: 0
|
|
48
|
+
display: none\9
|
|
49
|
+
|
|
50
|
+
// Icon
|
|
51
|
+
.icon,
|
|
52
|
+
.icon-to-fade
|
|
53
|
+
background: url('../images/checkbox.png') -90px 0 no-repeat
|
|
54
|
+
display: block
|
|
55
|
+
height: 20px
|
|
56
|
+
left: 0
|
|
57
|
+
opacity: 1
|
|
58
|
+
position: absolute
|
|
59
|
+
top: -1px
|
|
60
|
+
width: 20px
|
|
61
|
+
+transition(opacity .1s linear)
|
|
62
|
+
|
|
63
|
+
.icon
|
|
64
|
+
opacity: 0
|
|
65
|
+
top: 0
|
|
66
|
+
z-index: 2
|
|
67
|
+
display: none\9
|
|
68
|
+
|
|
69
|
+
// Radio
|
|
70
|
+
.radio
|
|
71
|
+
.icon,
|
|
72
|
+
.icon-to-fade
|
|
73
|
+
background-image: url('../images/radio.png')
|
|
74
|
+
|
|
75
|
+
// Serving 2x images
|
|
76
|
+
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2)
|
|
77
|
+
.checkbox
|
|
78
|
+
.icon
|
|
79
|
+
background-image: url('../images/checkbox-2x.png')
|
|
80
|
+
background-size: 110px 110px
|
|
81
|
+
|
|
82
|
+
.radio
|
|
83
|
+
.icon
|
|
84
|
+
background-image: url('../images/radio-2x.png')
|
|
85
|
+
background-size: 110px 110px
|
|
86
|
+
|
|
@@ -0,0 +1,228 @@
|
|
|
1
|
+
// For demo purposes only
|
|
2
|
+
.demo-headline
|
|
3
|
+
padding: 73px 0 110px
|
|
4
|
+
text-align: center
|
|
5
|
+
|
|
6
|
+
.demo-logo
|
|
7
|
+
font-size: 90px
|
|
8
|
+
font-weight: 900
|
|
9
|
+
letter-spacing: -2px
|
|
10
|
+
line-height: 100px
|
|
11
|
+
|
|
12
|
+
.logo
|
|
13
|
+
background: url('../images/demo/logo-mask.png') center 0 no-repeat
|
|
14
|
+
background-size: 256px 186px
|
|
15
|
+
height: 186px
|
|
16
|
+
margin: 0 auto 26px
|
|
17
|
+
overflow: hidden
|
|
18
|
+
text-indent: -9999em
|
|
19
|
+
width: 256px
|
|
20
|
+
|
|
21
|
+
small
|
|
22
|
+
color: rgba($base, .3)
|
|
23
|
+
display: block
|
|
24
|
+
font-size: 22px
|
|
25
|
+
font-weight: 700
|
|
26
|
+
letter-spacing: -1px
|
|
27
|
+
padding-top: 5px
|
|
28
|
+
|
|
29
|
+
// Panels delimiter
|
|
30
|
+
.demo-row
|
|
31
|
+
margin-bottom: 20px
|
|
32
|
+
|
|
33
|
+
.demo-panel-title
|
|
34
|
+
margin-bottom: 20px
|
|
35
|
+
padding-top: 20px
|
|
36
|
+
|
|
37
|
+
small
|
|
38
|
+
color: scale-color(desaturate($base, 25%), $lightness: 66%)
|
|
39
|
+
font-size: inherit
|
|
40
|
+
font-weight: 400
|
|
41
|
+
|
|
42
|
+
// Shift blocks to fit design
|
|
43
|
+
.demo-navigation
|
|
44
|
+
margin-bottom: -4px
|
|
45
|
+
margin-top: -10px
|
|
46
|
+
|
|
47
|
+
.demo-pager
|
|
48
|
+
margin-top: -10px
|
|
49
|
+
|
|
50
|
+
.demo-tooltips
|
|
51
|
+
height: 126px
|
|
52
|
+
|
|
53
|
+
// Needed just for the demo. Don't use it in producion ;)
|
|
54
|
+
.tooltip
|
|
55
|
+
left: -8px !important
|
|
56
|
+
position: relative !important
|
|
57
|
+
top: -8px !important
|
|
58
|
+
|
|
59
|
+
.demo-headings
|
|
60
|
+
margin-bottom: 12px
|
|
61
|
+
|
|
62
|
+
.demo-tiles
|
|
63
|
+
margin-bottom: 46px
|
|
64
|
+
|
|
65
|
+
.demo-icons
|
|
66
|
+
margin-bottom: 115px
|
|
67
|
+
|
|
68
|
+
.demo-icons-24
|
|
69
|
+
font-size: 24px
|
|
70
|
+
margin-bottom: 38px
|
|
71
|
+
position: relative
|
|
72
|
+
span
|
|
73
|
+
margin: 0 0 0 18px
|
|
74
|
+
&:first-child
|
|
75
|
+
margin-left: 0
|
|
76
|
+
|
|
77
|
+
.demo-icons-16
|
|
78
|
+
font-size: 16px
|
|
79
|
+
margin: 0 0 38px 5px
|
|
80
|
+
position: relative
|
|
81
|
+
span
|
|
82
|
+
margin: 0 0 0 28px
|
|
83
|
+
&:first-child
|
|
84
|
+
margin-left: 0
|
|
85
|
+
|
|
86
|
+
.demo-icons-tooltip
|
|
87
|
+
bottom: 0
|
|
88
|
+
color: scale-color($base, $lightness: 70%)
|
|
89
|
+
font-size: 12px
|
|
90
|
+
left: 100%
|
|
91
|
+
margin-left: 0 !important
|
|
92
|
+
position: absolute
|
|
93
|
+
width: 80px
|
|
94
|
+
|
|
95
|
+
.demo-illustrations
|
|
96
|
+
margin-bottom: 45px
|
|
97
|
+
|
|
98
|
+
img
|
|
99
|
+
height: 100px
|
|
100
|
+
margin-left: 35px
|
|
101
|
+
width: 100px
|
|
102
|
+
vertical-align: bottom
|
|
103
|
+
|
|
104
|
+
&:first-child
|
|
105
|
+
margin-left: 0
|
|
106
|
+
|
|
107
|
+
&.big-illustration
|
|
108
|
+
height: 111px
|
|
109
|
+
width: 112px
|
|
110
|
+
|
|
111
|
+
&.big-retina-illustration
|
|
112
|
+
height: 104px
|
|
113
|
+
margin-right: -24px
|
|
114
|
+
width: 117px
|
|
115
|
+
|
|
116
|
+
&.big-illustration-pusher
|
|
117
|
+
margin-right: 12px
|
|
118
|
+
|
|
119
|
+
.demo-samples
|
|
120
|
+
margin-bottom: 46px
|
|
121
|
+
|
|
122
|
+
.demo-video
|
|
123
|
+
border-radius: 6px
|
|
124
|
+
padding-top: 95px
|
|
125
|
+
|
|
126
|
+
.demo-download-section
|
|
127
|
+
float: none
|
|
128
|
+
margin: 0 auto
|
|
129
|
+
padding: 60px 0 90px 20px
|
|
130
|
+
text-align: center
|
|
131
|
+
|
|
132
|
+
[class*='fui-']
|
|
133
|
+
margin: 3px 0 -3px
|
|
134
|
+
|
|
135
|
+
.demo-download
|
|
136
|
+
background-color: scale-color($base, $lightness: 90%)
|
|
137
|
+
border-radius: 50%
|
|
138
|
+
height: 120px
|
|
139
|
+
margin: 0 auto 32px
|
|
140
|
+
padding: 40px 28px 30px 32px
|
|
141
|
+
text-align: center
|
|
142
|
+
width: 130px
|
|
143
|
+
|
|
144
|
+
img
|
|
145
|
+
height: 104px
|
|
146
|
+
width: 82px
|
|
147
|
+
|
|
148
|
+
.demo-download-text
|
|
149
|
+
font-size: 15px
|
|
150
|
+
padding: 20px 0
|
|
151
|
+
text-align: center
|
|
152
|
+
|
|
153
|
+
.demo-text-box
|
|
154
|
+
a:hover
|
|
155
|
+
color: $firm
|
|
156
|
+
|
|
157
|
+
.demo-browser
|
|
158
|
+
background: scale-color($base, $lightness: -15%) url('../images/demo/browser.png') 0 0 no-repeat
|
|
159
|
+
background-size: 659px 42px
|
|
160
|
+
border-radius: 0 0 6px 6px
|
|
161
|
+
color: $inverse
|
|
162
|
+
margin: 0 41px 140px 0
|
|
163
|
+
padding-top: 42px
|
|
164
|
+
|
|
165
|
+
.demo-browser-side
|
|
166
|
+
float: left
|
|
167
|
+
padding: 22px 20px
|
|
168
|
+
width: 111px
|
|
169
|
+
|
|
170
|
+
> h5
|
|
171
|
+
margin-bottom: 3px
|
|
172
|
+
text-transform: none
|
|
173
|
+
|
|
174
|
+
> h6
|
|
175
|
+
font-size: 11px
|
|
176
|
+
font-weight: 300
|
|
177
|
+
line-height: 18px
|
|
178
|
+
margin-top: 3px
|
|
179
|
+
text-transform: none
|
|
180
|
+
|
|
181
|
+
.demo-browser-author
|
|
182
|
+
background: url('../images/demo/browser-author.jpg') center center no-repeat
|
|
183
|
+
border: 3px solid $inverse
|
|
184
|
+
display: block
|
|
185
|
+
height: 84px
|
|
186
|
+
margin: 0 auto
|
|
187
|
+
width: 84px
|
|
188
|
+
+border-radius(50%)
|
|
189
|
+
|
|
190
|
+
.demo-browser-action
|
|
191
|
+
padding: 30px 0 12px
|
|
192
|
+
|
|
193
|
+
> .btn
|
|
194
|
+
padding: 9px 0 10px 11px
|
|
195
|
+
text-align: left
|
|
196
|
+
+border-radius(3px)
|
|
197
|
+
|
|
198
|
+
&:before
|
|
199
|
+
color: $inverse
|
|
200
|
+
content: '\e004'
|
|
201
|
+
font-size: 16px
|
|
202
|
+
font-family: 'Flat-UI-Icons-16'
|
|
203
|
+
font-weight: 300
|
|
204
|
+
margin-right: 12px
|
|
205
|
+
position: relative
|
|
206
|
+
top: 1px
|
|
207
|
+
-webkit-font-smoothing: antialiased
|
|
208
|
+
|
|
209
|
+
.demo-browser-content
|
|
210
|
+
background-color: $base
|
|
211
|
+
border-radius: 0 0 6px
|
|
212
|
+
overflow: hidden
|
|
213
|
+
padding: 21px 0 0 20px
|
|
214
|
+
|
|
215
|
+
> img
|
|
216
|
+
border: 6px solid $inverse
|
|
217
|
+
float: left
|
|
218
|
+
margin: 0 15px 20px 0
|
|
219
|
+
width: 134px
|
|
220
|
+
|
|
221
|
+
// Serving 2x images
|
|
222
|
+
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2)
|
|
223
|
+
.logo
|
|
224
|
+
background-image: url('../images/demo/logo-mask-2x.png')
|
|
225
|
+
|
|
226
|
+
.demo-browser
|
|
227
|
+
background-image: url('../images/demo/browser-2x.png')
|
|
228
|
+
|