oulu-rails 0.6.5 → 0.6.10

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 6da997af59d6ab87a13f888320bab78d77606f3f
4
- data.tar.gz: 7720b636be50631830e37c567dbd2dab800803e3
3
+ metadata.gz: 812d969978a92ca381503df3a29895616bc7a02a
4
+ data.tar.gz: 37f4e337a216456241cf204915a51773a97f8421
5
5
  SHA512:
6
- metadata.gz: afeab00aa65ad796e8fd3abdce34bf547763df666d6fb7940179d797f4ea39446d3fb7f0dcb2309efd1a7ecf01ccc7cd1a88b3865410bc3c3e6ef2d5cc8000ee
7
- data.tar.gz: 66850469106a8cd8c58c31cfe21a1b18d7fcaf9c69a1da2b034da5a0939909ca3f936adc94e460da89a1634ee1ce9899e1149eb435ac0f671b566db82a6d56f7
6
+ metadata.gz: 418e510f077987490bca984fcfd857d8d9581e6a87a5937964a0b9f2555e7fcf4cf1b1433ff9a4035ce7bcde25ddfe0b9cd026f850e6ea3a29dc2534aed3fc49
7
+ data.tar.gz: 4af3bd2b86bfe628b7e77c7e9905824e517f98aa765422a527c0cb258082aef3148c173fda8b167f2b89ca727dcea44c664f31755d1f1bbad17d5d957b7822ab
@@ -1,3 +1,3 @@
1
1
  module OuluRails
2
- VERSION = "0.6.5"
2
+ VERSION = "0.6.10"
3
3
  end
@@ -0,0 +1,338 @@
1
+ /*!
2
+ * Waves v0.6.4
3
+ * http://fian.my.id/Waves
4
+ *
5
+ * Copyright 2014 Alfiana E. Sibuea and other contributors
6
+ * Released under the MIT license
7
+ * https://github.com/fians/Waves/blob/master/LICENSE
8
+ */
9
+
10
+ ;(function(window) {
11
+ 'use strict';
12
+
13
+ var Waves = Waves || {};
14
+ var $$ = document.querySelectorAll.bind(document);
15
+
16
+ // Find exact position of element
17
+ function isWindow(obj) {
18
+ return obj !== null && obj === obj.window;
19
+ }
20
+
21
+ function getWindow(elem) {
22
+ return isWindow(elem) ? elem : elem.nodeType === 9 && elem.defaultView;
23
+ }
24
+
25
+ function offset(elem) {
26
+ var docElem, win,
27
+ box = {top: 0, left: 0},
28
+ doc = elem && elem.ownerDocument;
29
+
30
+ docElem = doc.documentElement;
31
+
32
+ if (typeof elem.getBoundingClientRect !== typeof undefined) {
33
+ box = elem.getBoundingClientRect();
34
+ }
35
+ win = getWindow(doc);
36
+ return {
37
+ top: box.top + win.pageYOffset - docElem.clientTop,
38
+ left: box.left + win.pageXOffset - docElem.clientLeft
39
+ };
40
+ }
41
+
42
+ function convertStyle(obj) {
43
+ var style = '';
44
+
45
+ for (var a in obj) {
46
+ if (obj.hasOwnProperty(a)) {
47
+ style += (a + ':' + obj[a] + ';');
48
+ }
49
+ }
50
+
51
+ return style;
52
+ }
53
+
54
+ var Effect = {
55
+
56
+ // Effect delay
57
+ duration: 750,
58
+
59
+ show: function(e, element) {
60
+
61
+ // Disable right click
62
+ if (e.button === 2) {
63
+ return false;
64
+ }
65
+
66
+ var el = element || this;
67
+
68
+ // Create ripple
69
+ var ripple = document.createElement('div');
70
+ ripple.className = 'waves-ripple';
71
+ el.appendChild(ripple);
72
+
73
+ // Get click coordinate and element witdh
74
+ var pos = offset(el);
75
+ var relativeY = (e.pageY - pos.top);
76
+ var relativeX = (e.pageX - pos.left);
77
+ var scale = 'scale('+((el.clientWidth / 100) * 10)+')';
78
+
79
+ // Support for touch devices
80
+ if ('touches' in e) {
81
+ relativeY = (e.touches[0].pageY - pos.top);
82
+ relativeX = (e.touches[0].pageX - pos.left);
83
+ }
84
+
85
+ // Attach data to element
86
+ ripple.setAttribute('data-hold', Date.now());
87
+ ripple.setAttribute('data-scale', scale);
88
+ ripple.setAttribute('data-x', relativeX);
89
+ ripple.setAttribute('data-y', relativeY);
90
+
91
+ // Set ripple position
92
+ var rippleStyle = {
93
+ 'top': relativeY+'px',
94
+ 'left': relativeX+'px'
95
+ };
96
+
97
+ ripple.className = ripple.className + ' waves-notransition';
98
+ ripple.setAttribute('style', convertStyle(rippleStyle));
99
+ ripple.className = ripple.className.replace('waves-notransition', '');
100
+
101
+ // Scale the ripple
102
+ rippleStyle['-webkit-transform'] = scale;
103
+ rippleStyle['-moz-transform'] = scale;
104
+ rippleStyle['-ms-transform'] = scale;
105
+ rippleStyle['-o-transform'] = scale;
106
+ rippleStyle.transform = scale;
107
+ rippleStyle.opacity = '1';
108
+
109
+ rippleStyle['-webkit-transition-duration'] = Effect.duration + 'ms';
110
+ rippleStyle['-moz-transition-duration'] = Effect.duration + 'ms';
111
+ rippleStyle['-o-transition-duration'] = Effect.duration + 'ms';
112
+ rippleStyle['transition-duration'] = Effect.duration + 'ms';
113
+
114
+ rippleStyle['-webkit-transition-timing-function'] = 'cubic-bezier(0.250, 0.460, 0.450, 0.940)';
115
+ rippleStyle['-moz-transition-timing-function'] = 'cubic-bezier(0.250, 0.460, 0.450, 0.940)';
116
+ rippleStyle['-o-transition-timing-function'] = 'cubic-bezier(0.250, 0.460, 0.450, 0.940)';
117
+ rippleStyle['transition-timing-function'] = 'cubic-bezier(0.250, 0.460, 0.450, 0.940)';
118
+
119
+ ripple.setAttribute('style', convertStyle(rippleStyle));
120
+ },
121
+
122
+ hide: function(e) {
123
+ TouchHandler.touchup(e);
124
+
125
+ var el = this;
126
+ var width = el.clientWidth * 1.4;
127
+
128
+ // Get first ripple
129
+ var ripple = null;
130
+ var ripples = el.getElementsByClassName('waves-ripple');
131
+ if (ripples.length > 0) {
132
+ ripple = ripples[ripples.length - 1];
133
+ } else {
134
+ return false;
135
+ }
136
+
137
+ var relativeX = ripple.getAttribute('data-x');
138
+ var relativeY = ripple.getAttribute('data-y');
139
+ var scale = ripple.getAttribute('data-scale');
140
+
141
+ // Get delay beetween mousedown and mouse leave
142
+ var diff = Date.now() - Number(ripple.getAttribute('data-hold'));
143
+ var delay = 350 - diff;
144
+
145
+ if (delay < 0) {
146
+ delay = 0;
147
+ }
148
+
149
+ // Fade out ripple after delay
150
+ setTimeout(function() {
151
+ var style = {
152
+ 'top': relativeY+'px',
153
+ 'left': relativeX+'px',
154
+ 'opacity': '0',
155
+
156
+ // Duration
157
+ '-webkit-transition-duration': Effect.duration + 'ms',
158
+ '-moz-transition-duration': Effect.duration + 'ms',
159
+ '-o-transition-duration': Effect.duration + 'ms',
160
+ 'transition-duration': Effect.duration + 'ms',
161
+ '-webkit-transform': scale,
162
+ '-moz-transform': scale,
163
+ '-ms-transform': scale,
164
+ '-o-transform': scale,
165
+ 'transform': scale,
166
+ };
167
+
168
+ ripple.setAttribute('style', convertStyle(style));
169
+
170
+ setTimeout(function() {
171
+ try {
172
+ el.removeChild(ripple);
173
+ } catch(e) {
174
+ return false;
175
+ }
176
+ }, Effect.duration);
177
+ }, delay);
178
+ },
179
+
180
+ // Little hack to make <input> can perform waves effect
181
+ wrapInput: function(elements) {
182
+ for (var a = 0; a < elements.length; a++) {
183
+ var el = elements[a];
184
+
185
+ if (el.tagName.toLowerCase() === 'input') {
186
+ var parent = el.parentNode;
187
+
188
+ // If input already have parent just pass through
189
+ if (parent.tagName.toLowerCase() === 'i' && parent.className.indexOf('waves-effect') !== -1) {
190
+ continue;
191
+ }
192
+
193
+ // Put element class and style to the specified parent
194
+ var wrapper = document.createElement('i');
195
+ wrapper.className = el.className + ' waves-input-wrapper';
196
+
197
+ var elementStyle = el.getAttribute('style');
198
+
199
+ if (!elementStyle) {
200
+ elementStyle = '';
201
+ }
202
+
203
+ wrapper.setAttribute('style', elementStyle);
204
+
205
+ el.className = 'waves-button-input';
206
+ el.removeAttribute('style');
207
+
208
+ // Put element as child
209
+ parent.replaceChild(wrapper, el);
210
+ wrapper.appendChild(el);
211
+ }
212
+ }
213
+ }
214
+ };
215
+
216
+
217
+ /**
218
+ * Disable mousedown event for 500ms during and after touch
219
+ */
220
+ var TouchHandler = {
221
+ /* uses an integer rather than bool so there's no issues with
222
+ * needing to clear timeouts if another touch event occurred
223
+ * within the 500ms. Cannot mouseup between touchstart and
224
+ * touchend, nor in the 500ms after touchend. */
225
+ touches: 0,
226
+ allowEvent: function(e) {
227
+ var allow = true;
228
+
229
+ if (e.type === 'touchstart') {
230
+ TouchHandler.touches += 1; //push
231
+ } else if (e.type === 'touchend' || e.type === 'touchcancel') {
232
+ setTimeout(function() {
233
+ if (TouchHandler.touches > 0) {
234
+ TouchHandler.touches -= 1; //pop after 500ms
235
+ }
236
+ }, 500);
237
+ } else if (e.type === 'mousedown' && TouchHandler.touches > 0) {
238
+ allow = false;
239
+ }
240
+
241
+ return allow;
242
+ },
243
+ touchup: function(e) {
244
+ TouchHandler.allowEvent(e);
245
+ }
246
+ };
247
+
248
+
249
+ /**
250
+ * Delegated click handler for .waves-effect element.
251
+ * returns null when .waves-effect element not in "click tree"
252
+ */
253
+ function getWavesEffectElement(e) {
254
+ if (TouchHandler.allowEvent(e) === false) {
255
+ return null;
256
+ }
257
+
258
+ var element = null;
259
+ var target = e.target || e.srcElement;
260
+
261
+ while (target.parentElement !== null) {
262
+ if (!(target instanceof SVGElement) && target.className.indexOf('waves-effect') !== -1) {
263
+ element = target;
264
+ break;
265
+ } else if (target.classList.contains('waves-effect')) {
266
+ element = target;
267
+ break;
268
+ }
269
+ target = target.parentElement;
270
+ }
271
+
272
+ return element;
273
+ }
274
+
275
+ /**
276
+ * Bubble the click and show effect if .waves-effect elem was found
277
+ */
278
+ function showEffect(e) {
279
+ var element = getWavesEffectElement(e);
280
+
281
+ if (element !== null) {
282
+ Effect.show(e, element);
283
+
284
+ if ('ontouchstart' in window) {
285
+ element.addEventListener('touchend', Effect.hide, false);
286
+ element.addEventListener('touchcancel', Effect.hide, false);
287
+ }
288
+
289
+ element.addEventListener('mouseup', Effect.hide, false);
290
+ element.addEventListener('mouseleave', Effect.hide, false);
291
+ }
292
+ }
293
+
294
+ Waves.displayEffect = function(options) {
295
+ options = options || {};
296
+
297
+ if ('duration' in options) {
298
+ Effect.duration = options.duration;
299
+ }
300
+
301
+ //Wrap input inside <i> tag
302
+ Effect.wrapInput($$('.waves-effect'));
303
+
304
+ if ('ontouchstart' in window) {
305
+ document.body.addEventListener('touchstart', showEffect, false);
306
+ }
307
+
308
+ document.body.addEventListener('mousedown', showEffect, false);
309
+ };
310
+
311
+ /**
312
+ * Attach Waves to an input element (or any element which doesn't
313
+ * bubble mouseup/mousedown events).
314
+ * Intended to be used with dynamically loaded forms/inputs, or
315
+ * where the user doesn't want a delegated click handler.
316
+ */
317
+ Waves.attach = function(element) {
318
+ //FUTURE: automatically add waves classes and allow users
319
+ // to specify them with an options param? Eg. light/classic/button
320
+ if (element.tagName.toLowerCase() === 'input') {
321
+ Effect.wrapInput([element]);
322
+ element = element.parentElement;
323
+ }
324
+
325
+ if ('ontouchstart' in window) {
326
+ element.addEventListener('touchstart', showEffect, false);
327
+ }
328
+
329
+ element.addEventListener('mousedown', showEffect, false);
330
+ };
331
+
332
+ window.Waves = Waves;
333
+
334
+ document.addEventListener('DOMContentLoaded', function() {
335
+ Waves.displayEffect();
336
+ }, false);
337
+
338
+ })(window);
@@ -17,11 +17,11 @@ body
17
17
  text-indent: 0
18
18
 
19
19
  // text-align
20
- .is-align-center
20
+ .is-center-align
21
21
  text-align: center
22
- .is-align-right
22
+ .is-right-align
23
23
  text-align: right
24
- .is-align-left
24
+ .is-left-align
25
25
  text-align: left
26
26
 
27
27
  .is-nowrap
@@ -0,0 +1,54 @@
1
+ =button-base
2
+ +inline-block(middle)
3
+ cursor: pointer
4
+ box-sizing: border-box
5
+ text-align: center
6
+ +user-select(none)
7
+ touch-action: manipulation
8
+ text-decoration: none
9
+ -webkit-tap-highlight-color: transparent
10
+
11
+ =button-size($size, $border-width: 0)
12
+ $font-size: ""
13
+ @if $size == 'xs'
14
+ $font-size: 12px
15
+ @else if $size == 'sm'
16
+ $font-size: 14px
17
+ @else if $size == 'md'
18
+ $font-size: 16px
19
+ @else if $size == 'lg'
20
+ $font-size: 18px
21
+ @else if $size == 'xl'
22
+ $font-size: 20px
23
+ $height: round($font-size * 2 + $font-size/2.2)
24
+ +border(all, $border-width)
25
+ +text-block($font-size $height - ($border-width*2))
26
+ +rem('height', $height)
27
+ +padding(horizontal, $height/2)
28
+ @if $font-size > 12px
29
+ font-weight: bold
30
+ i
31
+ @if $font-size > 28
32
+ +rem('margin-right', $font-size/4)
33
+ @else
34
+ +rem('margin-right', $font-size/3)
35
+ &.has-right-icon
36
+ i
37
+ margin-right: 0
38
+ @if $font-size > 28
39
+ +rem('margin-left', $font-size/4)
40
+ @else
41
+ +rem('margin-left', $font-size/3)
42
+ &.is-input-container
43
+ padding: 0
44
+ +relative
45
+ i
46
+ +absolute(left $height/2, top 0)
47
+ +rem('line-height', $height - ($border-width*2))
48
+ input
49
+ +padding(horizontal, ($height + if($font-size > 28, $font-size/4, $font-size/3)) $height/2)
50
+ +rem('height', $height - ($border-width*2))
51
+
52
+ =button-group
53
+ .is-button-group
54
+ @content
@@ -0,0 +1,27 @@
1
+ // button option
2
+ [class^="is-button"]
3
+ &.is-block
4
+ display: block
5
+ width: 100%
6
+ &.has-image
7
+ height: auto
8
+ .is-button-note
9
+ +inline-block
10
+ +rem('font-size', 12px)
11
+ +rem('margin-left', 6px)
12
+
13
+ // button-group
14
+ .is-button-group
15
+ font-size: 0
16
+ >li
17
+ display: inline
18
+ letter-spacing: normal
19
+ font-size: 0
20
+ [class^="is-button"]
21
+ +border-radius(0)
22
+ &:first-child
23
+ [class^="is-button"]
24
+ +border-left-radius(4px)
25
+ &:last-child
26
+ [class^="is-button"]
27
+ +border-right-radius(4px)
@@ -0,0 +1,51 @@
1
+ $button-sizes: xs, sm, md, lg, xl
2
+ $button-color-names: default, primary, success, warning, danger
3
+ $button-styles: normal, border, flat-emboss, material
4
+
5
+ @import button-base
6
+
7
+ @import styles/normal
8
+ @import styles/border
9
+ @import styles/flat-emboss
10
+ @import styles/material
11
+
12
+ @import button-helper
13
+
14
+ =button($style, $size, $color, $options: false)
15
+ +button-base
16
+ @if $style == normal
17
+ +button-size($size, 1px)
18
+ +normal-button($color)
19
+ @else if $style == border
20
+ +button-size($size, 1px)
21
+ +border-button($color)
22
+ @else if $style == flat-emboss
23
+ +button-size($size)
24
+ +flat-emboss-button($color)
25
+ @else if $style == material
26
+ +button-size($size)
27
+ +material-button($color)
28
+ @each $option in $options
29
+ @if $option == 'left'
30
+ text-align: left
31
+ @if $option == 'right'
32
+ text-align: right
33
+
34
+ @each $button-size in $button-sizes
35
+ $button-color-name: ''
36
+ $button-color: ''
37
+ $button-style: ''
38
+ @each $button-color-name in $button-color-names
39
+ @each $button-style in $button-styles
40
+ .is-button-#{$button-style}-#{$button-size}-#{$button-color-name}
41
+ @if $button-color-name == default
42
+ $button-color: $default
43
+ @else if $button-color-name == primary
44
+ $button-color: $primary
45
+ @else if $button-color-name == success
46
+ $button-color: $success
47
+ @else if $button-color-name == warning
48
+ $button-color: $warning
49
+ @else if $button-color-name == danger
50
+ $button-color: $danger
51
+ +button($button-style, $button-size, $button-color)
@@ -0,0 +1,25 @@
1
+ =border-button($color)
2
+ +border(all, solid)
3
+ +border-radius(4px)
4
+ @if $color == $default
5
+ $color: $text-color
6
+ @else
7
+ color: $color
8
+ border-color: $color
9
+ background-color: transparent
10
+ &:link,
11
+ &:visited
12
+ color: $color
13
+ &:hover,
14
+ &.hover,
15
+ &.is-hover
16
+ color: $color
17
+ background-color: rgba($color, .1)
18
+ &:active,
19
+ &.active,
20
+ &.is-active
21
+ color: $color
22
+ background-color: rgba($color, .3)
23
+ &.is-checked
24
+ color: $default-text-reversal
25
+ background-color: $color
@@ -0,0 +1,25 @@
1
+ =flat-emboss-button($color: blue)
2
+ +transition(.5s (background-image))
3
+ +border-radius(4px)
4
+ background-color: $color
5
+ color: luma_contrast_color($color)
6
+ box-shadow: shade($color, 18%) 0 3px 0
7
+ text-shadow: if(luma_bright($color), lighten($color, 8%) 0 1px 0, darken($color, 8%) 0 -1px 0)
8
+ &:hover,
9
+ .hover,
10
+ .is-hover
11
+ $color: lighten($color, 6%)
12
+ @if $color == white
13
+ background-color: #f4f4f4
14
+ @else
15
+ background-color: $color
16
+ &:active,
17
+ .active,
18
+ .is-active
19
+ $color: lighten($color, 6%)
20
+ @if $color == white
21
+ background-color: #f4f4f4
22
+ @else
23
+ background-color: $color
24
+ box-shadow: shade($color, 18%) 0 2px 0
25
+ +top(1px)
@@ -0,0 +1,89 @@
1
+ =waves-effect($color: black)
2
+ +relative(1)
3
+ overflow: hidden
4
+ will-change: opacity, transform
5
+ +transition(all .3s ease-out)
6
+ .waves-ripple
7
+ +absolute
8
+ border-radius: 50%
9
+ +block-size(20px)
10
+ +rem('margin-top', -10px)
11
+ +rem('margin-left', -10px)
12
+ opacity: 0
13
+ @if $color == 'light'
14
+ background-color: rgba(white, 0.45)
15
+ @else if $color == 'red'
16
+ background-color: rgba(#F44336, .70)
17
+ @else if $color == 'yellow'
18
+ background-color: rgba(#FFEB3B, .70)
19
+ @else if $color == 'orange'
20
+ background-color: rgba(#FF9800, .70)
21
+ @else if $color == 'purple'
22
+ background-color: rgba(#9C27B0, 0.70)
23
+ @else if $color == 'green'
24
+ background-color: rgba(#4CAF50, 0.70)
25
+ @else if $color == 'teal'
26
+ background-color: rgba(#009688, 0.70)
27
+ @else if luma_bright(lighten($color, 5%))
28
+ background-color: lighten($color, 45%)
29
+ @else
30
+ background-color: darken($color, 20%)
31
+ +transition(all 0.7s ease-out)
32
+ -webkit-transition-property: -webkit-transform, opacity
33
+ -moz-transition-property: -moz-transform, opacity
34
+ -o-transition-property: -o-transform, opacity
35
+ transition-property: transform, opacity
36
+ +transform(scale(0))
37
+ pointer-events: none
38
+
39
+ =material-button($color: blue)
40
+ +transition(.2s ease-out)
41
+ +border-radius(2px)
42
+ background-color: $color
43
+ color: luma_contrast_color($color)
44
+ box-shadow: 0 2px 5px 0 rgba(black, .16), 0 2px 10px 0 rgba(black, .12)
45
+ +rem('letter-spacing', .5px)
46
+ +waves-effect($color)
47
+ &:hover,
48
+ .hover,
49
+ .is-hover
50
+ $color: lighten($color, 5%)
51
+ box-shadow: 0 5px 11px 0 rgba(black, .18), 0 4px 15px 0 rgba(black, .15)
52
+ @if $color == white
53
+ background-color: #f4f4f4
54
+ @else
55
+ background-color: $color
56
+ &:active,
57
+ .active,
58
+ .is-active
59
+ $color: lighten($color, 6%)
60
+ @if $color == white
61
+ background-color: #f4f4f4
62
+ @else
63
+ background-color: $color
64
+ box-shadow: shade($color, 18%) 0 2px 0
65
+ +top(1px)
66
+
67
+ .waves-effect
68
+ +waves-effect($color: white)
69
+ .waves-notransition
70
+ +transition(none #{"!important"})
71
+ .waves-circle
72
+ +transform(translateZ(0))
73
+ -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%)
74
+ .waves-input-wrapper
75
+ border-radius: 0.2em
76
+ vertical-align: bottom
77
+ .waves-button-input
78
+ +relative(1, top 0, left 0)
79
+ .waves-circle
80
+ text-align: center
81
+ +size(2.5em)
82
+ line-height: 2.5em
83
+ border-radius: 50%
84
+ -webkit-mask-image: none
85
+ .waves-block
86
+ display: block
87
+ /* Firefox Bug: link not triggered */
88
+ a.waves-effect .waves-ripple
89
+ z-index: -1
@@ -0,0 +1,25 @@
1
+ =normal-button-color($color)
2
+ background-color: $color
3
+ +background-image(linear-gradient(top, tint($color, 6%) 0%, shade($color, 6%) 100%))
4
+ color: luma_contrast_color($color)
5
+ +border(all, solid)
6
+ border-color: shade($color, 10%) shade($color, 16%) shade($color, 26%)
7
+ text-shadow: if(luma_bright($color), lighten($color, 18%) 0 1px 0, darken($color, 18%) 0 -1px 0)
8
+
9
+ =normal-button($color: blue)
10
+ +transition(.5s (background-image))
11
+ +border-radius(4px)
12
+ +normal-button-color($color)
13
+ box-shadow: tint($color, 32%) 0 1px 0 inset, shade($color, 26%) 0 1px 0, rgba(black, .15) 0 2px 1px
14
+ &:hover,
15
+ &.hover,
16
+ &.is-hover
17
+ $color: lighten($color, 5%)
18
+ +normal-button-color($color)
19
+ &:active,
20
+ &.active,
21
+ &.is-active
22
+ $color: lighten($color, 7%)
23
+ +normal-button-color($color)
24
+ +top(1px)
25
+ box-shadow: darken($color, 12%) 0 1px 0 inset, rgba(white, .3) 0 1px 1px
@@ -0,0 +1,39 @@
1
+ $tabs-nav-border-color: black !default
2
+ $tabs-nav-background-color: white !default
3
+ $tabs-nav-border-width: 2px !default
4
+ $tabs-nav-font-size: 16px !default
5
+ $tabs-nav-item-gutter: 8px !default
6
+ $tabs-nav-font-color: black !default
7
+ $tabs-nav-current-font-color: red !default
8
+
9
+ .tabs-nav__items
10
+ font-size: 0
11
+ +relative
12
+ &:before
13
+ content: ""
14
+ display: block
15
+ +block-size(100% $tabs-nav-border-width)
16
+ background-color: $tabs-nav-border-color
17
+ +absolute(left 0, bottom 0)
18
+ .tabs-nav__item
19
+ +inline-block(bottom)
20
+ +rem('margin-right', 8px)
21
+ &:last-child
22
+ margin-right: 0
23
+ .tabs-nav__link
24
+ +block-link
25
+ +border(top horizontal, $tabs-nav-border-width solid $tabs-nav-border-color)
26
+ +rem('padding-bottom', $tabs-nav-border-width)
27
+ +text-block($tabs-nav-font-size round($tabs-nav-font-size*2.6), center $tabs-nav-font-color)
28
+ +padding(horizontal, $tabs-nav-font-size*1.6)
29
+ box-sizing: border-box
30
+ +relative
31
+ &:before
32
+ display: block
33
+ +block-size(100% $tabs-nav-border-width)
34
+ background-color: $tabs-nav-background-color
35
+ +absolute(left 0, bottom 0)
36
+ &.is-current
37
+ color: $tabs-nav-current-font-color
38
+ &:before
39
+ content: ""
@@ -57,6 +57,11 @@ textarea
57
57
  outline: none
58
58
  +basic-font
59
59
 
60
+ input[type= submit]
61
+ color: inherit
62
+ font-size: inherit
63
+ font-weight: inherit
64
+
60
65
  button
61
66
  +appearance(button)
62
67
 
@@ -85,7 +90,7 @@ input::-moz-focus-inner
85
90
  input,
86
91
  textarea
87
92
  border: none
88
- +box-sizing(border-box)
93
+ box-sizing: border-box
89
94
 
90
95
  button, x:-moz-any-link,
91
96
  input[type=button], x:-moz-any-link,
@@ -114,7 +119,7 @@ textarea
114
119
 
115
120
  .#{$container-class-name}
116
121
  +rem('max-width', $container-max-width)
117
- +box-sizing(border-box)
122
+ box-sizing: border-box
118
123
  +margin(horizontal, auto)
119
124
  +padding(horizontal, $container-horizontal-padding)
120
125
  clear: both
@@ -14,7 +14,15 @@
14
14
  +fixed(left 50%, top 50%, $block-z-index)
15
15
  +rem('margin-top', $block-height / 2 * -1)
16
16
  +rem('margin-left', $block-width / 2 * -1)
17
- +box-sizing(border-box)
17
+ box-sizing: border-box
18
+
19
+ =horizontal-center-block($values)
20
+ $block-width: optional_nth($values, 1)
21
+ $block-z-index: optional_nth($values, 2)
22
+ +rem('width', $block-width)
23
+ +fixed(left 50%, $block-z-index)
24
+ +rem('margin-left', $block-width / 2 * -1)
25
+ box-sizing: border-box
18
26
 
19
27
  =square-block($values)
20
28
  $square-block-size: optional_nth($values, 1)
@@ -50,3 +58,12 @@
50
58
 
51
59
  =background-clip($value)
52
60
  +prefixer(background-clip, $value, webkit moz spec)
61
+
62
+ =box-shadow($values)
63
+ +rem(box-shadow, $values)
64
+
65
+ =text-shadow($values)
66
+ +rem(text-shadow, $values)
67
+
68
+ =border-radius($values)
69
+ +rem(border-radius, $values)
@@ -1,7 +1,7 @@
1
1
  // +ie-rgba(rgba(black, .4), white, background-color)
2
2
  =ie-rgba($foreground, $backdrop: white, $property: "background-color")
3
3
  @if $property == "background-color"
4
- +rgba-background($foreground)
4
+ background-color: $foreground
5
5
  @else
6
6
  #{$property}: mix(fade-in($foreground, 1), $backdrop, percentage(opacity($foreground)))
7
7
  // Browsers without color opacity
@@ -82,7 +82,7 @@ $break-points: $break-point-xs-namespace, $break-point-sm-namespace, $break-poin
82
82
  =column($number, $columns-gutter-width: $gutter-width)
83
83
  +rem('width', 100 / $columns-count * $number * 1%)
84
84
  +padding(horizontal, $columns-gutter-width / 2)
85
- +box-sizing(border-box)
85
+ box-sizing: border-box
86
86
  float: left
87
87
 
88
88
  // カラムをサイズごとに作る
@@ -16,7 +16,7 @@ $baseline-px: 10px !default
16
16
  @if $property == "font-size" and $px-values < 10px
17
17
  // 9px以下のfont-sizeを使う設定(IE8不可)
18
18
  +base-font-size
19
- +transform(scale3d(strip_unit($px-values / strip_unit($baseline-px)) strip_unit($px-values/ strip_unit($baseline-px)) 1))
19
+ +transform(scale3d(strip_unit($px-values / strip_unit($baseline-px)), strip_unit($px-values/ strip_unit($baseline-px)), 1))
20
20
  +transform-origin(0 0)
21
21
  @else
22
22
  // Convert the baseline into rems
@@ -23,7 +23,7 @@
23
23
 
24
24
  // +table-cell(middle (12px 16px) no_wrap $white, (14px 1.8 1.4em, black bold center), (bottom, solid 1px black))
25
25
  =table-cell($value1: null, $value2: null, $value3: null)
26
- +box-sizing(border-box)
26
+ box-sizing: border-box
27
27
  @if $value1
28
28
  @for $i from 1 through length($value1)
29
29
  +table-cell-assign(nth($value1, $i))
@@ -60,3 +60,26 @@ $basic-mono: Osaka-mono, "MS Gothic", monospace !default
60
60
  $basic-maru: "Varela Round", "Lucida Grande", "Lucida Sans Unicode", Roboto, "Droid Sans", "HG丸ゴシックM-PRO", "Hiragino Maru Gothic Pro", "游ゴシック", YuGothic, "メイリオ", Meiryo, "MS Pゴシック", Helvetica, Arial, Verdana, sans-serif !default
61
61
  $basic-fonts: $basic-sans-serif !default
62
62
  $basic-legacy-ie-fonts: $basic-legacy-ie-sans-serif !default
63
+
64
+ /////////////////
65
+ // UI colors
66
+ ////////////////
67
+
68
+ $default: #ffffff !default
69
+ $primary: #337AB7 !default
70
+ $success: #5CB85C !default
71
+ $info: #5BC0DE !default
72
+ $warning: #F0AD4E !default
73
+ $danger: #D9534F !default
74
+
75
+ $text-color: #333333 !default
76
+ $default-text-reversal: #ffffff !default
77
+
78
+ /////////////////
79
+ // SNS colors
80
+ ////////////////
81
+
82
+ $twitter: #55acee
83
+ $facebook: #3b5998
84
+ $hatena: #008FDE
85
+ $pocket: #f23c53
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: oulu-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.6.5
4
+ version: 0.6.10
5
5
  platform: ruby
6
6
  authors:
7
7
  - machida
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2015-03-21 00:00:00.000000000 Z
11
+ date: 2015-04-15 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: sass-rails
@@ -52,9 +52,6 @@ files:
52
52
  - vendor/assets/javascripts/oulu-ie8.js
53
53
  - vendor/assets/javascripts/oulu-ie9.js
54
54
  - vendor/assets/javascripts/oulu.js
55
- - vendor/assets/javascripts/oulu/dev/positions-p.js.coffee
56
- - vendor/assets/javascripts/oulu/dev/positions-pp.js.coffee
57
- - vendor/assets/javascripts/oulu/dev/positions.js.coffee
58
55
  - vendor/assets/javascripts/oulu/helpers/js-autosize.js.coffee
59
56
  - vendor/assets/javascripts/oulu/helpers/js-checkbox.js.coffee
60
57
  - vendor/assets/javascripts/oulu/helpers/js-click-animate.js.coffee
@@ -88,6 +85,7 @@ files:
88
85
  - vendor/assets/javascripts/oulu/plugins/jquery.css3form.js
89
86
  - vendor/assets/javascripts/oulu/plugins/jquery.depend.min.js
90
87
  - vendor/assets/javascripts/oulu/plugins/sns-buttons.js
88
+ - vendor/assets/javascripts/oulu/plugins/waves.js
91
89
  - vendor/assets/stylesheets/_oulu-base.sass
92
90
  - vendor/assets/stylesheets/_oulu.sass
93
91
  - vendor/assets/stylesheets/bootcamp/CHANGELOG.md
@@ -174,6 +172,14 @@ files:
174
172
  - vendor/assets/stylesheets/helpers/_margin-padding.sass
175
173
  - vendor/assets/stylesheets/helpers/_position.sass
176
174
  - vendor/assets/stylesheets/helpers/_typoglaphy.sass
175
+ - vendor/assets/stylesheets/modules/buttons/_button-base.sass
176
+ - vendor/assets/stylesheets/modules/buttons/_button-helper.sass
177
+ - vendor/assets/stylesheets/modules/buttons/_buttons.sass
178
+ - vendor/assets/stylesheets/modules/buttons/styles/_border.sass
179
+ - vendor/assets/stylesheets/modules/buttons/styles/_flat-emboss.sass
180
+ - vendor/assets/stylesheets/modules/buttons/styles/_material.sass
181
+ - vendor/assets/stylesheets/modules/buttons/styles/_normal.sass
182
+ - vendor/assets/stylesheets/modules/navs/_tabs-nav.sass
177
183
  - vendor/assets/stylesheets/options/amazlet/_amazlet.sass
178
184
  - vendor/assets/stylesheets/options/glitch/_glitch.sass
179
185
  - vendor/assets/stylesheets/options/oulu-buttons/_button-basic.sass
@@ -1,34 +0,0 @@
1
- $ ->
2
- $("body").mousemove (e) ->
3
- mouseX = e.pageX
4
- mouseY = e.pageY
5
- $("#mouseX").val mouseX
6
- $("#mouseY").val mouseY
7
-
8
- # get scroll amount.
9
- window.onscroll = ->
10
- scrollX = document.documentElement.scrollLeft
11
- scrollY = document.documentElement.scrollTop
12
- $("#scrollX").value = scrollX
13
- $("#scrollY").value = scrollY
14
-
15
- $("#js-target-field").mousemove (e) ->
16
- divMouseX = undefined
17
- divMouseY = undefined
18
- offsetX = 0
19
- offsetY = 0
20
- element = this
21
- scrollX = document.documentElement.scrollLeft
22
- scrollY = document.documentElement.scrollTop
23
- while element
24
- offsetX += element.offsetLeft
25
- offsetY += element.offsetTop
26
- element = element.offsetParent
27
- if e
28
- divMouseX = e.pageX - offsetX
29
- divMouseY = e.pageY - offsetY
30
- else
31
- divMouseX = event.pageX + document.body.scrollLeft - offsetX
32
- divMouseY = event.pageY + document.body.scrollTop - offsetY
33
- $("#divMouseX").value divMouseX
34
- $("#divMouseY").value divMouseY
@@ -1,57 +0,0 @@
1
- try
2
- window.addEventListener "load", (->
3
-
4
- # get mouse coords at window.
5
- window.onmousemove = (e) ->
6
- mouseX = undefined
7
- mouseY = undefined
8
- if e
9
- mouseX = e.pageX
10
- mouseY = e.pageY
11
- else
12
- mouseX = event.pageX + document.body.scrollLeft
13
- mouseY = event.pageY + document.body.scrollTop
14
- document.getElementById("mouseX").value = mouseX
15
- document.getElementById("mouseY").value = mouseY
16
-
17
-
18
- # get scroll amount.
19
- window.onscroll = ->
20
- scrollX = document.documentElement.scrollLeft
21
- scrollY = document.documentElement.scrollTop
22
- document.getElementById("scrollX").value = scrollX
23
- document.getElementById("scrollY").value = scrollY
24
-
25
-
26
- # get mouse coords at targetDiv.
27
- document.getElementById("js-target-field").onmousemove = (e) ->
28
- mouseX = undefined
29
- mouseY = undefined
30
- offsetX = 0
31
- offsetY = 0
32
- element = this
33
- while element
34
- offsetX += element.offsetLeft
35
- offsetY += element.offsetTop
36
- element = element.offsetParent
37
- if e
38
- mouseX = e.pageX - offsetX
39
- mouseY = e.pageY - offsetY
40
- else
41
- mouseX = event.pageX + document.body.scrollLeft - offsetX
42
- mouseY = event.pageY + document.body.scrollTop - offsetY
43
- document.getElementById("divMouseX").value = mouseX
44
- document.getElementById("divMouseY").value = mouseY
45
-
46
-
47
- # get Window Size.
48
- window.onresize = (e) ->
49
- w = window.innerWidth
50
- h = window.innerHeight
51
- document.getElementById("windowW").value = w
52
- document.getElementById("windowH").value = h
53
-
54
- document.getElementById("windowW").value = window.innerWidth
55
- document.getElementById("windowH").value = window.innerHeight
56
- prettyPrint()
57
- ), false
@@ -1,6 +0,0 @@
1
- $ ->
2
- $("body").mousemove (e) ->
3
- mouseX = e.pageX
4
- mouseY = e.pageY
5
- $("#mouseX").val mouseX
6
- $("#mouseY").val mouseY