curo-material-interface 0.0.3 → 0.0.4
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 +4 -4
- data/README.md +4 -4
- data/lib/assets/javascripts/cmi/form_components/text_field.coffee +2 -2
- data/lib/assets/javascripts/cmi/loading_indicator.coffee +2 -2
- data/lib/assets/javascripts/cmi/tabs.coffee +1 -1
- data/lib/assets/stylesheets/cmi/_extensions.sass +12 -12
- data/lib/assets/stylesheets/cmi/_global.sass +68 -68
- data/lib/assets/stylesheets/cmi/_mixins.sass +2 -2
- data/lib/assets/stylesheets/cmi/_typography.sass +116 -116
- data/lib/assets/stylesheets/cmi/components/_buttons.sass +97 -98
- data/lib/assets/stylesheets/cmi/components/_flex-modal.sass +175 -177
- data/lib/assets/stylesheets/cmi/components/_loading-indicator.sass +6 -6
- data/lib/assets/stylesheets/cmi/components/_navbar.sass +5 -5
- data/lib/assets/stylesheets/cmi/components/_ripples.sass +18 -19
- data/lib/assets/stylesheets/cmi/components/_tabs.sass +5 -5
- data/lib/assets/stylesheets/cmi/form_components/_checkbox.sass +13 -13
- data/lib/assets/stylesheets/cmi/form_components/_text_field.sass +28 -28
- data/lib/curo_material_interface/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: a810bf238f07ceea1a5eb08b9ef9192c7f0b864b
|
|
4
|
+
data.tar.gz: 2a65db94f291305c41bff35bc5bcb6ba753c20f9
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 035442edb414506b34b1d5b3c5dfeae575352717334634494de4714657bbc3f09a47b7d114159aea035e6a297127f47ce479b47b7d1a4ba73dbbb1bcc300ee43
|
|
7
|
+
data.tar.gz: 13eef9a77082220d67761ca19bbc689b334f8e209549e58896ac4097fc65df2c7f2ded128207417f147c04ecde0a2b92b7c90222518c557bb17628c5a7239f15
|
data/README.md
CHANGED
|
@@ -64,11 +64,11 @@ At "@import ./font_mixin" you need to implement the right font font-face call fo
|
|
|
64
64
|
font-weight: normal
|
|
65
65
|
font-style: normal
|
|
66
66
|
|
|
67
|
-
=font-face-helper($family, $fileBaseName, $weight, $style)
|
|
67
|
+
=font-face-helper($family, $fileBaseName, $weight, $style, $svgAppendix: '')
|
|
68
68
|
@font-face
|
|
69
69
|
font-family: $family
|
|
70
70
|
src: asset-url($fileBaseName + '.eot')
|
|
71
|
-
src: asset-url($fileBaseName + '.eot?#iefix') format('embedded-opentype'), asset-url($fileBaseName + '.woff') format('woff'), asset-url($fileBaseName + '.ttf') format('truetype'), asset-url($fileBaseName + '.svg#
|
|
71
|
+
src: asset-url($fileBaseName + '.eot?#iefix') format('embedded-opentype'), asset-url($fileBaseName + '.woff') format('woff'), asset-url($fileBaseName + '.ttf') format('truetype'), asset-url($fileBaseName + '.svg#' + $svgAppendix) format('svg')
|
|
72
72
|
font-weight: $weight
|
|
73
73
|
font-style: $style
|
|
74
74
|
```
|
|
@@ -84,11 +84,11 @@ At "@import ./font_mixin" you need to implement the right font font-face call fo
|
|
|
84
84
|
font-weight: normal
|
|
85
85
|
font-style: normal
|
|
86
86
|
|
|
87
|
-
=font-face-helper($family, $fileBaseName, $weight, $style)
|
|
87
|
+
=font-face-helper($family, $fileBaseName, $weight, $style, $svgAppendix: '')
|
|
88
88
|
@font-face
|
|
89
89
|
font-family: $family
|
|
90
90
|
src: font-path($fileBaseName + '.eot')
|
|
91
|
-
src: font-path($fileBaseName + '.eot?#iefix') format('embedded-opentype'), font-path($fileBaseName + '.woff') format('woff'), font-path($fileBaseName + '.ttf') format('truetype'), font-path($fileBaseName + '.svg#
|
|
91
|
+
src: font-path($fileBaseName + '.eot?#iefix') format('embedded-opentype'), font-path($fileBaseName + '.woff') format('woff'), font-path($fileBaseName + '.ttf') format('truetype'), font-path($fileBaseName + '.svg#' + $svgAppendix) format('svg')
|
|
92
92
|
font-weight: $weight
|
|
93
93
|
font-style: $style
|
|
94
94
|
```
|
|
@@ -4,7 +4,7 @@ window.CMI.FormComponents or= {}
|
|
|
4
4
|
class CMI.FormComponents.TextField
|
|
5
5
|
|
|
6
6
|
@reset: (domElement) ->
|
|
7
|
-
if domElement.val().length > 0
|
|
7
|
+
if domElement.val().length > 0 || domElement.is(':focus')
|
|
8
8
|
domElement.parents(@_getInputBoxSelector()).addClass('cmi-active')
|
|
9
9
|
else
|
|
10
10
|
domElement.parents(@_getInputBoxSelector()).removeClass('cmi-active')
|
|
@@ -38,7 +38,7 @@ class CMI.FormComponents.TextField
|
|
|
38
38
|
parentDomElement.removeClass('cmi-invalid')
|
|
39
39
|
else if parentDomElement.hasClass('cmi-validate')
|
|
40
40
|
if domElement.is(':valid')
|
|
41
|
-
parentDomElement.removeClass('invalid')
|
|
41
|
+
parentDomElement.removeClass('cmi-invalid')
|
|
42
42
|
parentDomElement.addClass('cmi-valid')
|
|
43
43
|
else
|
|
44
44
|
parentDomElement.removeClass('cmi-valid')
|
|
@@ -40,8 +40,8 @@ class CMI.LoadingIndicator extends Backbone.View
|
|
|
40
40
|
|
|
41
41
|
_getInnerHtml: ->
|
|
42
42
|
$('<div class="cmi-loading-indicator-inside">
|
|
43
|
-
<svg class="circular">
|
|
44
|
-
<circle class="path" cx="50" cy="50" fill="none" r="20" stroke-miterlimit="10" stroke-width="3"></circle>
|
|
43
|
+
<svg class="cmi-circular">
|
|
44
|
+
<circle class="cmi-path" cx="50" cy="50" fill="none" r="20" stroke-miterlimit="10" stroke-width="3"></circle>
|
|
45
45
|
</svg>
|
|
46
46
|
</div>')
|
|
47
47
|
|
|
@@ -43,4 +43,4 @@ class CMI.Tabs
|
|
|
43
43
|
|
|
44
44
|
@_ensureActiveIndicator: (tabsElement) ->
|
|
45
45
|
return if tabsElement.find('.cmi-tabs-active-indicator').length > 0
|
|
46
|
-
tabsElement.append('<li class="cmi-tabs-active-indicator"></li>')
|
|
46
|
+
tabsElement.append('<li class="cmi-li cmi-tabs-active-indicator"></li>')
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
.z-depth-1
|
|
2
|
-
+box-shadow(0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12))
|
|
3
|
-
.z-depth-1-hover
|
|
4
|
-
+box-shadow(0 2px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 10px 0 rgba(0, 0, 0, 0.19))
|
|
5
|
-
.z-depth-2
|
|
6
|
-
+box-shadow(0 6px 15px 0 rgba(0, 0, 0, 0.2), 0 4px 18px 0 rgba(0, 0, 0, 0.19))
|
|
7
|
-
.z-depth-3
|
|
8
|
-
+box-shadow(0 10px 13px 0 rgba(0, 0, 0, 0.24), 0 15px 44px 0 rgba(0, 0, 0, 0.19))
|
|
9
|
-
.z-depth-4
|
|
10
|
-
+box-shadow(0 14px 26px 0 rgba(0, 0, 0, 0.22), 0 23px 50px 0 rgba(0, 0, 0, 0.21))
|
|
11
|
-
.z-depth-5
|
|
12
|
-
+box-shadow(0 23px 20px 0 rgba(0, 0, 0, 0.2), 0 36px 70px 0 rgba(0, 0, 0, 0.22))
|
|
1
|
+
.cmi-z-depth-1
|
|
2
|
+
+cmi-box-shadow(0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12))
|
|
3
|
+
.cmi-z-depth-1-hover
|
|
4
|
+
+cmi-box-shadow(0 2px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 10px 0 rgba(0, 0, 0, 0.19))
|
|
5
|
+
.cmi-z-depth-2
|
|
6
|
+
+cmi-box-shadow(0 6px 15px 0 rgba(0, 0, 0, 0.2), 0 4px 18px 0 rgba(0, 0, 0, 0.19))
|
|
7
|
+
.cmi-z-depth-3
|
|
8
|
+
+cmi-box-shadow(0 10px 13px 0 rgba(0, 0, 0, 0.24), 0 15px 44px 0 rgba(0, 0, 0, 0.19))
|
|
9
|
+
.cmi-z-depth-4
|
|
10
|
+
+cmi-box-shadow(0 14px 26px 0 rgba(0, 0, 0, 0.22), 0 23px 50px 0 rgba(0, 0, 0, 0.21))
|
|
11
|
+
.cmi-z-depth-5
|
|
12
|
+
+cmi-box-shadow(0 23px 20px 0 rgba(0, 0, 0, 0.2), 0 36px 70px 0 rgba(0, 0, 0, 0.22))
|
|
@@ -5,77 +5,77 @@
|
|
|
5
5
|
line-height: 1.4
|
|
6
6
|
box-sizing: border-box
|
|
7
7
|
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
8
|
+
*[class^="cmi-"]
|
|
9
|
+
+selection
|
|
10
|
+
background: $color-text-selection-bg
|
|
11
|
+
color: $color-text-selection-text
|
|
12
|
+
text-shadow: none
|
|
13
13
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
14
|
+
div.cmi-div,
|
|
15
|
+
header.cmi-header,
|
|
16
|
+
footer.cmi-footer,
|
|
17
|
+
main.cmi-main,
|
|
18
|
+
aside.cmi-aside,
|
|
19
|
+
ul.cmi-ul,
|
|
20
|
+
ol.cmi-ol,
|
|
21
|
+
form.cmi-form,
|
|
22
|
+
input.cmi-input,
|
|
23
|
+
label.cmi-label,
|
|
24
|
+
textarea.cmi-textarea,
|
|
25
|
+
select.cmi-select
|
|
26
|
+
box-sizing: border-box
|
|
27
27
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
28
|
+
hr.cmi-hr
|
|
29
|
+
display: block
|
|
30
|
+
margin: 1em 0
|
|
31
|
+
padding: 0
|
|
32
|
+
height: 1px
|
|
33
|
+
border: 0
|
|
34
|
+
border-top: 1px solid #ccc
|
|
35
35
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
36
|
+
i.cmi-i
|
|
37
|
+
line-height: inherit
|
|
38
|
+
&.cmi-left
|
|
39
|
+
float: left
|
|
40
|
+
margin-right: 15px
|
|
41
|
+
&.cmi-right
|
|
42
|
+
float: right
|
|
43
|
+
margin-left: 15px
|
|
44
|
+
&.cmi-tiny
|
|
45
|
+
font-size: 1rem
|
|
46
|
+
&.cmi-small
|
|
47
|
+
font-size: 2rem
|
|
48
|
+
&.cmi-medium
|
|
49
|
+
font-size: 4rem
|
|
50
|
+
&.cmi-large
|
|
51
|
+
font-size: 6rem
|
|
52
52
|
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
53
|
+
table.cmi-table, th.cmi-th, td.cmi-td
|
|
54
|
+
border: none
|
|
55
|
+
table.cmi-table
|
|
56
|
+
width: 100%
|
|
57
|
+
display: table
|
|
58
|
+
thead.cmi-thead
|
|
59
|
+
border-bottom: 1px solid $color-table-border
|
|
60
|
+
td.cmi-td, th.cmi-th
|
|
61
|
+
padding: 15px 5px
|
|
62
|
+
display: table-cell
|
|
63
|
+
text-align: left
|
|
64
|
+
vertical-align: middle
|
|
65
|
+
background-color: #fff
|
|
66
|
+
+cmi-border-radius(2px)
|
|
67
|
+
tr.cmi-tr:nth-child(even)
|
|
68
|
+
td.cmi-td
|
|
69
|
+
background-color: #f9f9f9
|
|
70
70
|
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
71
|
+
.cmi-pull-right
|
|
72
|
+
position: relative
|
|
73
|
+
float: right
|
|
74
|
+
top: 0
|
|
75
|
+
+clearfix
|
|
76
76
|
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
77
|
+
.cmi-pull-left
|
|
78
|
+
position: relative
|
|
79
|
+
float: left
|
|
80
|
+
top: 0
|
|
81
|
+
+clearfix
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
// for all corners since bourbon.io does not support this
|
|
2
|
-
=border-radius($radius)
|
|
2
|
+
=cmi-border-radius($radius)
|
|
3
3
|
+border-top-radius($radius)
|
|
4
4
|
+border-bottom-radius($radius)
|
|
5
5
|
|
|
6
6
|
// bourbon removed support
|
|
7
7
|
// see - http://generatedcontent.org/post/37949105556/updateyourcss3
|
|
8
|
-
=box-shadow($values...)
|
|
8
|
+
=cmi-box-shadow($values...)
|
|
9
9
|
-webkit-box-shadow: $values
|
|
10
10
|
box-shadow: $values
|
|
@@ -5,121 +5,121 @@
|
|
|
5
5
|
line-height: 1.5
|
|
6
6
|
color: #333
|
|
7
7
|
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
8
|
+
textarea.cmi-textarea
|
|
9
|
+
font-family: "Roboto", sans-serif
|
|
10
|
+
font-size: 0.875rem
|
|
11
|
+
font-weight: 400
|
|
12
|
+
line-height: 1.3
|
|
13
|
+
color: #333
|
|
14
|
+
|
|
15
|
+
// Text Styles
|
|
16
|
+
|
|
17
|
+
p.cmi-p
|
|
18
|
+
font-size: 0.875rem
|
|
19
|
+
font-weight: 400
|
|
20
|
+
color: $paragraph-color
|
|
21
|
+
|
|
22
|
+
em.cmi-em
|
|
23
|
+
font-weight: 400
|
|
24
|
+
font-style: italic
|
|
25
|
+
color: #000
|
|
26
|
+
|
|
27
|
+
strong.cmi-strong
|
|
28
|
+
font-weight: 600
|
|
29
|
+
color: #000
|
|
30
|
+
|
|
31
|
+
small.cmi-small, small.cmi-small
|
|
32
|
+
font-size: 0.8125rem
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
a.cmi-a
|
|
36
|
+
font-weight: 400
|
|
37
|
+
text-decoration: none
|
|
38
|
+
color: $color-link
|
|
39
|
+
&:hover
|
|
40
|
+
color: $color-link-hover
|
|
41
|
+
text-decoration: underline
|
|
42
|
+
|
|
43
|
+
blockquote.cmi-blockquote
|
|
44
|
+
margin: 20px 0
|
|
45
|
+
padding-left: 1.5rem
|
|
46
|
+
border-left: 5px solid $blockquote-color-border
|
|
47
|
+
font-style: italic
|
|
48
|
+
color: $blockquote-color-font
|
|
49
|
+
|
|
50
|
+
pre.cmi-pre
|
|
51
|
+
margin: 10px 0
|
|
52
|
+
padding: 0.5em 0.5em 0.5em 1.5rem
|
|
53
|
+
font-size: 0.75rem
|
|
54
|
+
line-height: 1.3
|
|
55
|
+
border-left: 5px solid $pre-color-border
|
|
56
|
+
color: $blockquote-color-font
|
|
57
|
+
background-color: $pre-color-background
|
|
58
|
+
white-space: pre-wrap
|
|
59
|
+
word-wrap: break-word
|
|
60
|
+
|
|
61
|
+
.cmi-text-light
|
|
62
|
+
font-weight: 300
|
|
63
|
+
|
|
64
|
+
.cmi-text-primary
|
|
65
|
+
color: $color-primary - 20
|
|
66
|
+
|
|
67
|
+
|
|
68
|
+
// headlines
|
|
69
|
+
|
|
70
|
+
h1.cmi-h1
|
|
71
|
+
margin: 1.25rem 0 0.625rem 0
|
|
72
|
+
font-size: 2rem
|
|
73
|
+
font-weight: 400
|
|
74
|
+
line-height: 1.1
|
|
75
|
+
color: #333
|
|
76
|
+
h2.cmi-h2
|
|
77
|
+
margin: 1rem 0 0.625rem 0
|
|
78
|
+
font-size: 1.625rem
|
|
79
|
+
font-weight: 400
|
|
80
|
+
line-height: 1.1
|
|
81
|
+
color: #333
|
|
82
|
+
h3.cmi-h3
|
|
83
|
+
margin: 1rem 0 0.625rem 0
|
|
84
|
+
font-size: 1.25rem
|
|
85
|
+
font-weight: 400
|
|
86
|
+
line-height: 1.1
|
|
87
|
+
color: #333
|
|
88
|
+
h4.cmi-h4
|
|
89
|
+
margin: 0.625rem 0 0.625rem 0
|
|
90
|
+
font-size: 1.25rem
|
|
91
|
+
font-weight: 200
|
|
92
|
+
line-height: 1.1
|
|
93
|
+
color: #333
|
|
94
|
+
h5.cmi-h5
|
|
95
|
+
margin: 0.625rem 0 0.625rem 0
|
|
96
|
+
font-size: 1rem
|
|
97
|
+
font-weight: 400
|
|
98
|
+
line-height: 1.1
|
|
99
|
+
color: #333
|
|
100
|
+
|
|
101
|
+
h1.cmi-h1,
|
|
102
|
+
h2.cmi-h2,
|
|
103
|
+
h3.cmi-h3,
|
|
104
|
+
h4.cmi-h4,
|
|
105
|
+
h5.cmi-h5
|
|
106
|
+
&.cmi-lined
|
|
107
|
+
width: 100%
|
|
108
|
+
text-align: left
|
|
109
|
+
border-bottom: 1px solid #aaa
|
|
110
|
+
line-height: 0.1em
|
|
111
|
+
.cmi-span
|
|
112
|
+
background: #fff
|
|
113
|
+
padding: 0 15px 0 0
|
|
114
|
+
h1.cmi-h1.cmi-lined
|
|
115
|
+
margin: 2.21rem 0 1.625rem 0
|
|
116
|
+
h2.cmi-h2.cmi-lined
|
|
117
|
+
margin: 1.8125rem 0 1.4rem 0
|
|
118
|
+
h3.cmi-h3.cmi-lined
|
|
119
|
+
margin: 1.625rem 0 1.21rem 0
|
|
120
|
+
h4.cmi-h4.cmi-lined
|
|
121
|
+
margin: 1.25rem 0 1.21rem 0
|
|
122
|
+
h5.cmi-h5.cmi-lined
|
|
123
|
+
margin: 1.125rem 0 1.05rem 0
|
|
124
124
|
|
|
125
125
|
|