ellipsis-compass 1.0.6 → 1.0.7

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.
Files changed (34) hide show
  1. checksums.yaml +8 -8
  2. data/stylesheets/ellipsis/animation/_transitions.scss +0 -318
  3. data/stylesheets/ellipsis/base/_breakpoints.scss +1 -1
  4. data/stylesheets/ellipsis/base/_document.scss +21 -1
  5. data/stylesheets/ellipsis/base/_global.scss +9 -8
  6. data/stylesheets/ellipsis/component/_element.scss +81 -0
  7. data/stylesheets/ellipsis/component/_ui.scss +94 -22
  8. data/stylesheets/ellipsis/font/_icons.scss +229 -8
  9. data/stylesheets/ellipsis/form/_form.scss +284 -184
  10. data/stylesheets/ellipsis/grid/_grid.scss +21 -1
  11. data/stylesheets/ellipsis/helpers/_component.scss +9 -1
  12. data/stylesheets/ellipsis/helpers/_mixins.scss +13 -194
  13. data/stylesheets/ellipsis/helpers/_visibility.scss +3 -3
  14. data/stylesheets/ellipsis/touch/ui/_topbar.scss +11 -0
  15. data/stylesheets/ellipsis/typography/_typography.scss +1 -1
  16. data/stylesheets/ellipsis/ui/_carousel.scss +275 -132
  17. data/stylesheets/ellipsis/ui/_collapse.scss +174 -0
  18. data/stylesheets/ellipsis/ui/_container.scss +317 -1
  19. data/stylesheets/ellipsis/ui/_drawer.scss +29 -5
  20. data/stylesheets/ellipsis/ui/_dropdown.scss +103 -52
  21. data/stylesheets/ellipsis/ui/_gallery.scss +85 -81
  22. data/stylesheets/ellipsis/ui/_menu.scss +130 -82
  23. data/stylesheets/ellipsis/ui/_navbar.scss +82 -30
  24. data/stylesheets/ellipsis/ui/_pagination.scss +12 -9
  25. data/stylesheets/ellipsis/ui/_screentab.scss +109 -0
  26. data/stylesheets/ellipsis/ui/_slidingpanel.scss +1 -1
  27. data/stylesheets/ellipsis/ui/_social.scss +51 -49
  28. data/stylesheets/ellipsis/ui/_stepprogress.scss +219 -0
  29. data/stylesheets/ellipsis/ui/_toggle.scss +5 -2
  30. data/stylesheets/ellipsis/ui/_tooltip.scss +5 -3
  31. data/stylesheets/ellipsis/ui/_topbar.scss +90 -16
  32. data/stylesheets/ellipsis/ui/_window.scss +13 -8
  33. metadata +6 -3
  34. data/stylesheets/ellipsis/ui/_collapsible.scss +0 -61
checksums.yaml CHANGED
@@ -1,15 +1,15 @@
1
1
  ---
2
2
  !binary "U0hBMQ==":
3
3
  metadata.gz: !binary |-
4
- Y2E5ZjYyOWFlM2QzZGNiZThiNDliZTE1ZWVkZDMwMTZhNmExNjFjZg==
4
+ MWFlYTU1ZDQ4NGYzYmM5OGM3ZmYzYjhiYTBhMzRhZjZlYmFiNDMzMA==
5
5
  data.tar.gz: !binary |-
6
- ZGQyMDg5NDFiOTMzZjlmYTc5ZGJjMWZhODE5NTNlOGNlMzA1NWNlMg==
6
+ OGJjZGZjNmE0YzQ1YTc0NjUwOWMwODZjYmQzNTBhNWJhNDc2Y2Y5OA==
7
7
  !binary "U0hBNTEy":
8
8
  metadata.gz: !binary |-
9
- YmM1ODM0Yzc1M2ZjYzdmYmQ1ZDMzZGI1MzcwZjA4NmVlZTQ1YzVhYTU2MDhh
10
- ZGE5NDAyYzVmZjA2MTlmZTJmMWUwZWExZGU4YTc2ZTRkMTJiZjc0OTQyMjkz
11
- YWE0MTVkOTM3ODhmMWE5OWRjNTNkNWVlZmIzNTU3ZGNmZjU1ZDY=
9
+ ZmI4YTJhZjI4YWZlZmVjY2UyOTc2YzNjNGE0MGYyNGUwNjUxYjkyNTQzNDk4
10
+ OWQwZjY4Y2VlY2MzMWJlZjcxMTQ5ODc5MzJlNzE5NmE3ZjM4YjQ0ZGZmNWIz
11
+ MTg3NWY0NDIyN2Q2ZDU1NzcxYjJlOGM0ZGU5ZWZjNzdlYzVlNjk=
12
12
  data.tar.gz: !binary |-
13
- YWVlNzQyMTIwMjI4YjYzMzQxODM2ZjA2MTc0YjJiOThmNTZhNmIyMTA1ZGE0
14
- OTJiZmQ4ZDU0NzAzOWVmNjkzZDMzODgxM2ZiZTZjZWY2MDQzZmUwNmNjYjk5
15
- ODk5YjhmMzIyN2U4NTQ5YWZhMzAyMjAwYTY3NGViNGRmYTFkMTU=
13
+ NWFmZDBkZDQ4YTQ1MmE2YzY4YzQ2N2ExYjU3ODRjMGFmOGI2ZTBhZWE3NWQ1
14
+ OGY5ODE1M2UxMzg2NjdkNzE5NDczNzc0YTY3ZWE3YjVjY2I5ZjUzNzJlYmIx
15
+ MjMyNzIzYmQ2OGRjZGE2MjI4ZTFiMjA1MWJmOTE4ZGU0Mjc5MGI=
@@ -1,320 +1,2 @@
1
1
  @import "transit";
2
2
 
3
- /*[data-role=container]{
4
- position:absolute;
5
- top:0;
6
- left:0;
7
- width:100%;
8
- min-height: 100%;
9
- }
10
- .ui-page {
11
- top: 0;
12
- left: 0;
13
- position: absolute;
14
- width: 100%;
15
- min-height: 100%;
16
- border: 0;
17
- padding: 0;
18
- margin: 0;
19
- outline: none;
20
- }
21
- .ui-placeholder {
22
- top: 0;
23
- left: 0;
24
- position: absolute;
25
- outline: none;
26
-
27
-
28
- }
29
- .ui-viewport{
30
- position:relative;
31
- visibility: hidden;
32
- //overflow: hidden;
33
- }
34
- .ui-hidden{
35
- visibility: hidden;
36
- }
37
- @media screen and (orientation: portrait){
38
- .ui-page { min-height: 420px; }
39
- body{
40
- -webkit-user-select: none;
41
- }
42
-
43
- }
44
- @media screen and (orientation: landscape){
45
- .ui-page { min-height: 300px; }
46
- body{
47
- -webkit-user-select: none;
48
- }
49
- }
50
-
51
- .ui-viewport-transitioning,
52
- .ui-viewport-transitioning .ui-page {
53
- width: 100%;
54
- height: 100%;
55
- overflow: hidden;
56
- -webkit-box-sizing: border-box;
57
- -moz-box-sizing: border-box;
58
- box-sizing: border-box;
59
- }
60
- .in {
61
- -webkit-animation-timing-function: ease-in-out;
62
- -webkit-animation-duration: 250ms;
63
- -moz-animation-timing-function: ease-in-out;
64
- -moz-animation-duration: 250ms;
65
- -o-animation-timing-function: ease-in-out;
66
- -o-animation-duration: 250ms;
67
- animation-timing-function: ease-in-out;
68
- animation-duration: 250ms;
69
- }
70
- .out {
71
- -webkit-animation-timing-function: ease-in-out;
72
- -webkit-animation-duration: 250ms;
73
- -moz-animation-timing-function: ease-in-out;
74
- -moz-animation-duration: 250ms;
75
- -o-animation-timing-function: ease-in-out;
76
- -o-animation-duration: 250ms;
77
- animation-timing-function: ease-in-out;
78
- animation-duration: 250ms;
79
- }
80
-
81
- .hardware-accelerate{
82
- -webkit-transform: translate3d(0, 0, 0);
83
- }
84
- .supports3d{
85
- -webkit-perspective: 1000;
86
- -moz-perspective: 1000;
87
- -o-perspective: 1000;
88
- perspective: 1000;
89
- > * {
90
- -webkit-transform: translate3d(0,0,0) rotate(0) scale(1);
91
-
92
- }
93
- -webkit-transform-style: preserve-3d;
94
- -moz-transform-style: preserve-3d;
95
-
96
- }
97
-
98
-
99
-
100
- //Page Transitions
101
-
102
- //fade --mobile and desktop
103
- .fade.out, .fade.in {
104
- -webkit-animation-timing-function: ease-in-out;
105
- -webkit-animation-duration: 350ms;
106
- -moz-animation-timing-function: ease-in-out;
107
- -moz-animation-duration: 350ms;
108
- -o-animation-timing-function: ease-in-out;
109
- -o-animation-duration: 350ms;
110
- animation-timing-function: ease-in-out;
111
- animation-duration: 350ms;
112
-
113
- }
114
- .fade.in {
115
- @include animation(fadeIn);
116
- }
117
- .fade.out {
118
- @include animation(fadeOut);
119
- }
120
- .fade.in.reverse {
121
- @include animation(fadeIn);
122
- }
123
- .fade.out.reverse {
124
- @include animation(fadeOut);
125
- }
126
-
127
-
128
- //dissolve --mobile and desktop
129
- .dissolve.out, .dissolve.in {
130
- -webkit-animation-timing-function: ease-in-out;
131
- -webkit-animation-duration: 350ms;
132
- -moz-animation-timing-function: ease-in-out;
133
- -moz-animation-duration: 350ms;
134
- -o-animation-timing-function: ease-in-out;
135
- -o-animation-duration: 350ms;
136
- animation-timing-function: ease-in-out;
137
- animation-duration: 350ms;
138
-
139
- }
140
- .dissolve.in {
141
- @include animation(dissolveIn);
142
- }
143
- .dissolve.out {
144
- @include animation(dissolveOut);
145
- }
146
- .dissolve.in.reverse {
147
- @include animation(dissolveIn);
148
- }
149
- .dissolve.out.reverse {
150
- @include animation(dissolveOut);
151
- }
152
-
153
-
154
-
155
- //slide
156
- .slide.out, .slide.in {
157
- -webkit-animation-timing-function: ease-in-out;
158
- -webkit-animation-duration: 250ms;
159
- -moz-animation-timing-function: ease-in-out;
160
- -moz-animation-duration: 250ms;
161
- -o-animation-timing-function: ease-in-out;
162
- -o-animation-duration: 250ms;
163
- animation-timing-function: ease-in-out;
164
- animation-duration: 250ms;
165
- }
166
- .slide.out {
167
- @include animation(slideleftout);
168
- }
169
-
170
- .slide.in {
171
- @include animation(slideleftin);
172
- }
173
-
174
- .slide.out.reverse {
175
- @include animation(sliderightout);
176
- }
177
-
178
- .slide.in.reverse {
179
- @include animation(sliderightin);
180
- }
181
-
182
-
183
- //pop
184
- .pop.out, .pop.in {
185
- -webkit-animation-timing-function: ease-in-out;
186
- -webkit-animation-duration: 250ms;
187
- -moz-animation-timing-function: ease-in-out;
188
- -moz-animation-duration: 250ms;
189
- -o-animation-timing-function: ease-in-out;
190
- -o-animation-duration: 250ms;
191
- animation-timing-function: ease-in-out;
192
- animation-duration: 250ms;
193
- }
194
- .pop.in {
195
- @include animation(popIn);
196
- }
197
-
198
- .pop.out {
199
- @include animation(popOut);
200
- }
201
- .pop.in.reverse {
202
- @include animation(popIn);
203
- }
204
-
205
- .pop.out.reverse {
206
- @include animation(popOut);
207
- }
208
-
209
- //mobile only
210
- //flip 3D Transition
211
-
212
- .flip.in {
213
- -webkit-backface-visibility: hidden !important;
214
- -webkit-transform-style: preserve-3d;
215
- @include animation(flipleftin);
216
- }
217
-
218
- .flip.out {
219
- -webkit-backface-visibility: hidden !important;
220
- -webkit-transform-style: preserve-3d;
221
- z-index:1000;
222
- background-color:inherit;
223
- @include animation(flipleftout);
224
-
225
- }
226
- .flip.in.reverse {
227
- -webkit-backface-visibility: hidden !important;
228
- -webkit-transform-style: preserve-3d;
229
- @include animation(fliprightin);
230
- }
231
-
232
- .flip.out.reverse {
233
- -webkit-backface-visibility: hidden !important;
234
- -webkit-transform-style: preserve-3d;
235
- @include animation(fliprightout);
236
- }
237
-
238
- //cube 3D Transition
239
-
240
- .cube.in {
241
- -webkit-transform: perspective(800);
242
- -webkit-animation-duration: 5.6s;
243
- -webkit-transform-origin: 0% 50%;
244
- z-index:10;
245
- background-color:inherit;
246
- @include animation(cubeleftin);
247
- }
248
-
249
- .cube.out {
250
- -webkit-transform: perspective(800);
251
- -webkit-animation-duration: 5.6s;
252
- -webkit-transform-origin: 100% 50%;
253
- @include animation(cubeleftout);
254
- }
255
-
256
- .cube.in.reverse {
257
- -webkit-transform: perspective(800);
258
- -webkit-animation-duration: .6s;
259
- -webkit-transform-origin: 100% 50%;
260
- z-index:10;
261
- background-color:inherit;
262
- @include animation(cuberightin);
263
- }
264
- .cube.out.reverse {
265
- -webkit-transform: perspective(800);
266
- -webkit-animation-duration: .6s;
267
- -webkit-transform-origin: 0% 50%;
268
- @include animation(cuberightout);
269
- }
270
-
271
- //fadeSlide
272
-
273
- .fadeSlide.in {
274
- -webkit-animation-delay: 350ms;
275
- @include animation(fadeslideleftin);
276
- }
277
- .fadeSlide.out {
278
- @include animation(fadeOut);
279
- }
280
-
281
- .fadeSlide.in.reverse {
282
- -webkit-animation-delay: 350ms;
283
- @include animation(fadesliderightin);
284
- }
285
- .fadeSlide.out.reverse {
286
- @include animation(fadeOut);
287
- }
288
-
289
-
290
- //swap 3D Transition
291
-
292
- .swap.in {
293
- -webkit-animation-duration: .7s;
294
- -webkit-transform: perspective(800);
295
- -webkit-animation-timing-function: ease-out;
296
- z-index:10;
297
- background-color:inherit;
298
- @include animation(swapleftin);
299
- }
300
- .swap.out {
301
- -webkit-animation-duration: .7s;
302
- -webkit-transform: perspective(800);
303
- -webkit-animation-timing-function: ease-out;
304
- @include animation(swapleftout);
305
- }
306
-
307
- .swap.in.reverse {
308
- -webkit-animation-duration: .7s;
309
- -webkit-transform: perspective(800);
310
- -webkit-animation-timing-function: ease-out;
311
- z-index:10;
312
- background-color:inherit;
313
- @include animation(swaprightin);
314
- }
315
- .swap.out.reverse {
316
- -webkit-animation-duration: .7s;
317
- -webkit-transform: perspective(800);
318
- -webkit-animation-timing-function: ease-out;
319
- @include animation(swaprightout);
320
- }*/
@@ -56,7 +56,7 @@ $breakpoint-desktop: "only screen and (min-width: #{$screen-desktop})" !default;
56
56
 
57
57
  // grid contain
58
58
  $_grid-width:$grid-width;
59
- $breakpoint-grid-contain: "only screen and (max-width:#{$_grid-width})" !default;
59
+ $breakpoint-grid-contain: "only screen and (max-width:#{$_grid-width}) and (min-width: #{$screen-desktop})" !default;
60
60
 
61
61
  //grid breakpoints
62
62
  $breakpoint-grid-tablet: "only screen and (min-width: #{$screen-tablet-small})" !default;
@@ -19,6 +19,21 @@ $document-highlight-color:#c7254e !default;
19
19
  $document-highlight-background:#eee !default;
20
20
  $document-code-font-weight:normal !default;
21
21
 
22
+ @mixin input(){
23
+ input[type="text"],
24
+ input[type="password"],
25
+ input[type="date"],
26
+ input[type="datetime"],
27
+ input[type="email"],
28
+ input[type="number"],
29
+ input[type="search"],
30
+ input[type="tel"],
31
+ input[type="time"],
32
+ input[type="url"],
33
+ textarea{
34
+ @content;
35
+ }
36
+ }
22
37
  /* Document Reset & Standards -------------------------------------------------------- */
23
38
  @mixin document-reset() {
24
39
 
@@ -37,12 +52,12 @@ $document-code-font-weight:normal !default;
37
52
  font-size: $global-font-size;
38
53
  line-height: $global-line-height;
39
54
  color: $global-font-color;
40
- position: relative;
41
55
  -webkit-font-smoothing: $document-font-smoothing;
42
56
  margin: $document-margin;
43
57
  padding: $document-padding;
44
58
  }
45
59
 
60
+
46
61
  /* Links ---------------------- */
47
62
 
48
63
  a img {
@@ -193,6 +208,11 @@ $document-code-font-weight:normal !default;
193
208
  height: auto;
194
209
  min-height: 50px;
195
210
  }
211
+ @include input(){
212
+ &:focus{
213
+ @include tab-focus();
214
+ }
215
+ }
196
216
 
197
217
  /* Misc -------------------------------------------- */
198
218
 
@@ -19,11 +19,11 @@ $info-color:null !default;
19
19
  $warning-color:null !default;
20
20
  $success-color:null !default;
21
21
 
22
+ $component-custom-tags:true !default;
23
+
22
24
  $global-background:$white;
23
25
  $global-font-family: 'ubunturegular' !default;
24
26
  $global-font-size: 16px !default;
25
- $global-font-size-small: 10px !default;
26
- $global-font-size-large: 24px !default;
27
27
  $global-font-color: #777 !default;
28
28
  $global-header-font-color:$dark-gray !default;
29
29
  $global-link-color:#888 !default;
@@ -74,13 +74,14 @@ $component-success-text-shadow: none !default;
74
74
  //icons
75
75
  $global-icon-font-family:ellipsis !default;
76
76
  $global-icon-search:\e01a !default;
77
+ $global-icon-search-2:\e0ec !default;
77
78
  $global-icon-check:\e035 !default;
78
79
  $global-icon-radio:\e158 !default;
79
80
  $global-icon-dropdown:\e1a9 !default;
80
81
  $global-icon-hide:\e1aa !default;
81
- $global-icon-toggle:\e137 !default;
82
- $global-icon-down-arrow:\e1b3 !default;
83
- $global-icon-up-arrow:\e1b4 !default;
82
+ $global-icon-toggle:\e1f3 !default;
83
+ $global-icon-down-arrow:\e1a2 !default;
84
+ $global-icon-up-arrow:\e1a0 !default;
84
85
  $global-icon-down-arrow-2:\e00e !default;
85
86
  $global-icon-up-arrow-2:\e00c !default;
86
87
  $global-icon-next:\e0f9 !default;
@@ -93,15 +94,15 @@ $global-icon-contract:\e1b0 !default;
93
94
  $global-icon-back:\e0f6 !default;
94
95
  $global-icon-forward:\e037 !default;
95
96
  $global-icon-facebook:\e14a !default;
96
- $global-icon-facebook-2:\e14b !default;
97
+ $global-icon-facebook-2:\e227 !default;
97
98
  $global-icon-pinterest:\e197 !default;
98
99
  $global-icon-pinterest-2:\e193 !default;
99
100
  $global-icon-twitter:\e14e !default;
100
- $global-icon-twitter-2:\e047 !default;
101
+ $global-icon-twitter-2:\e228 !default;
101
102
  $global-icon-flickr:\e15c !default;
102
103
  $global-icon-flickr-2:\e16d !default;
103
104
  $global-icon-google:\e145 !default;
104
- $global-icon-google-2:\e147 !default;
105
+ $global-icon-google-2:\e229 !default;
105
106
  $global-icon-github:\e160 !default;
106
107
  $global-icon-github:\e16f !default;
107
108
  $global-icon-remove:\e0db !default;