oulu 0.12.0 → 0.12.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 +4 -4
- data/app/assets/stylesheets/_oulu-base.sass +0 -1
- data/app/assets/stylesheets/helpers/_margin-padding.sass +34 -80
- data/app/assets/stylesheets/helpers/_position.sass +32 -17
- data/app/assets/stylesheets/helpers/_typoglaphy.sass +4 -4
- data/app/assets/stylesheets/settings/functions/_background.sass +9 -4
- data/app/assets/stylesheets/settings/functions/_number.sass +8 -0
- data/app/assets/stylesheets/settings/mixins/_background.sass +1 -1
- data/app/assets/stylesheets/settings/mixins/_text.sass +9 -5
- data/bower.json +1 -1
- data/lib/oulu/version.rb +1 -1
- data/package.json +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: c29c9e6cf9219385d84dce05b9d693237f58152f
|
|
4
|
+
data.tar.gz: beb41ae47dc4831856b3a6e180076026c614bc9c
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: c89a67102136bc0de20d5583af63e4937a17fbc633c27bc70e989bb8771c1515c8955f6f2b42cf3447c1b8d7866fefba72761821cfd1ffb5c5be46cba369c627
|
|
7
|
+
data.tar.gz: 49a0e50f7b9a58e3380684ee4a6fb77c5f7e8d6fb8dc91ea4a4633a214a2efbf7febcc50de677dcb100926279ae1b602b23902cc957db5401ef1271b4abbcf69
|
|
@@ -1,81 +1,35 @@
|
|
|
1
|
+
=assign-margin-padding($direction, $property, $n-px)
|
|
2
|
+
@if $direction == horizontal
|
|
3
|
+
#{$property}-left: $n-px
|
|
4
|
+
#{$property}-right: $n-px
|
|
5
|
+
@else if $direction == vertical
|
|
6
|
+
#{$property}-top: $n-px
|
|
7
|
+
#{$property}-bottom: $n-px
|
|
8
|
+
@else
|
|
9
|
+
#{$property}-#{$direction}: $n-px
|
|
1
10
|
body
|
|
2
|
-
@for $i from
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
$rem-value-class: dot_to_underscore($rem-value)
|
|
28
|
-
.has-margin-bottom-#{$rem-value-class}
|
|
29
|
-
margin-bottom: $rem-value
|
|
30
|
-
.has-margin-top-#{$rem-value-class}
|
|
31
|
-
margin-top: $rem-value
|
|
32
|
-
.has-margin-left-#{$rem-value-class}
|
|
33
|
-
margin-left: $rem-value
|
|
34
|
-
.has-margin-right-#{$rem-value-class}
|
|
35
|
-
margin-right: $rem-value
|
|
36
|
-
.has-margin-horizontal-#{$rem-value-class}
|
|
37
|
-
+margin(horizontal, $rem-value)
|
|
38
|
-
.has-padding-bottom-#{$rem-value-class}
|
|
39
|
-
padding-bottom: $rem-value
|
|
40
|
-
.has-padding-top-#{$rem-value-class}
|
|
41
|
-
padding-top: $rem-value
|
|
42
|
-
.has-padding-left-#{$rem-value-class}
|
|
43
|
-
padding-left: $rem-value
|
|
44
|
-
.has-padding-right-#{$rem-value-class}
|
|
45
|
-
padding-right: $rem-value
|
|
46
|
-
.has-padding-horizontal-#{$rem-value-class}
|
|
47
|
-
+padding(horizontal, $rem-value)
|
|
48
|
-
|
|
49
|
-
body
|
|
50
|
-
// horizontal-margin-0
|
|
51
|
-
.has-horizontal-margin-0
|
|
52
|
-
+margin(horizontal, 0)
|
|
53
|
-
.has-horizontal-margin-0-xs-down
|
|
54
|
-
+media-breakpoint-down(xs)
|
|
55
|
-
+margin(horizontal, 0)
|
|
56
|
-
.has-horizontal-margin-0-sm-down
|
|
57
|
-
+media-breakpoint-down(sm)
|
|
58
|
-
+margin(horizontal, 0)
|
|
59
|
-
.has-horizontal-margin-0-md-down
|
|
60
|
-
+media-breakpoint-down(md)
|
|
61
|
-
+margin(horizontal, 0)
|
|
62
|
-
.has-horizontal-margin-0-lg-down
|
|
63
|
-
+media-breakpoint-down(lg)
|
|
64
|
-
+margin(horizontal, 0)
|
|
65
|
-
|
|
66
|
-
body
|
|
67
|
-
// horizontal-padding-0
|
|
68
|
-
.has-horizontal-padding-0
|
|
69
|
-
+padding(horizontal, 0)
|
|
70
|
-
.has-horizontal-padding-0-xs-down
|
|
71
|
-
+media-breakpoint-down(xs)
|
|
72
|
-
+padding(horizontal, 0)
|
|
73
|
-
.has-horizontal-padding-0-sm-down
|
|
74
|
-
+media-breakpoint-down(sm)
|
|
75
|
-
+padding(horizontal, 0)
|
|
76
|
-
.has-horizontal-padding-0-md-down
|
|
77
|
-
+media-breakpoint-down(md)
|
|
78
|
-
+padding(horizontal, 0)
|
|
79
|
-
.has-horizontal-padding-0-lg-down
|
|
80
|
-
+media-breakpoint-down(lg)
|
|
81
|
-
+padding(horizontal, 0)
|
|
11
|
+
@for $i from 0 through 20
|
|
12
|
+
$n: $i*4
|
|
13
|
+
$n-px: px_to_rem($n*1px)
|
|
14
|
+
$properties: margin, padding
|
|
15
|
+
$directions: top, bottom, left, right, horizontal, vertical
|
|
16
|
+
$breakpoints: xs, sm, md, lg, xl, false
|
|
17
|
+
$scopes: up, down
|
|
18
|
+
@each $property in $properties
|
|
19
|
+
@each $direction in $directions
|
|
20
|
+
@each $breakpoint in $breakpoints
|
|
21
|
+
@each $scope in $scopes
|
|
22
|
+
@if $breakpoint
|
|
23
|
+
.is-#{$property}-#{$direction}-#{$n}-#{$breakpoint}-#{$scope}
|
|
24
|
+
@if $scope == up
|
|
25
|
+
+media-breakpoint-up($breakpoint)
|
|
26
|
+
+assign-margin-padding($direction, $property, $n-px)
|
|
27
|
+
@else if $scope == down
|
|
28
|
+
+media-breakpoint-down($breakpoint)
|
|
29
|
+
+assign-margin-padding($direction, $property, $n-px)
|
|
30
|
+
@else if $scope == only
|
|
31
|
+
+media-breakpoint-only($breakpoint)
|
|
32
|
+
+assign-margin-padding($direction, $property, $n-px)
|
|
33
|
+
@else
|
|
34
|
+
.is-#{$property}-#{$direction}-#{$n}
|
|
35
|
+
+assign-margin-padding($direction, $property, $n-px)
|
|
@@ -1,18 +1,33 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
+top(
|
|
4
|
-
|
|
5
|
-
+
|
|
6
|
-
|
|
7
|
-
+left(
|
|
8
|
-
|
|
9
|
-
+right(
|
|
1
|
+
=assign-position($direction, $n-px)
|
|
2
|
+
@if $direction == top
|
|
3
|
+
+top($n-px)
|
|
4
|
+
@else if $direction == bottom
|
|
5
|
+
+bottom($n-px)
|
|
6
|
+
@else if $direction == left
|
|
7
|
+
+left($n-px)
|
|
8
|
+
@else if $direction == right
|
|
9
|
+
+right($n-px)
|
|
10
10
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
11
|
+
@for $i from -8 through 8
|
|
12
|
+
$n: $i*4
|
|
13
|
+
$n-px: px_to_rem($n*1px)
|
|
14
|
+
$directions: top, bottom, left, right
|
|
15
|
+
$breakpoints: xs, sm, md, lg, xl, false
|
|
16
|
+
$scopes: up, down
|
|
17
|
+
@each $direction in $directions
|
|
18
|
+
@each $breakpoint in $breakpoints
|
|
19
|
+
@each $scope in $scopes
|
|
20
|
+
@if $breakpoint
|
|
21
|
+
.is-#{$direction}-#{$n}-#{$breakpoint}-#{$scope}
|
|
22
|
+
@if $scope == up
|
|
23
|
+
+media-breakpoint-up($breakpoint)
|
|
24
|
+
+assign-position($direction, $n-px)
|
|
25
|
+
@else if $scope == down
|
|
26
|
+
+media-breakpoint-down($breakpoint)
|
|
27
|
+
+assign-position($direction, $n-px)
|
|
28
|
+
@else if $scope == only
|
|
29
|
+
+media-breakpoint-only($breakpoint)
|
|
30
|
+
+assign-position($direction, $n-px)
|
|
31
|
+
@else
|
|
32
|
+
.is-#{$direction}-#{$n}
|
|
33
|
+
+assign-position($direction, $n-px)
|
|
@@ -10,11 +10,11 @@ body
|
|
|
10
10
|
+sans-serif
|
|
11
11
|
|
|
12
12
|
@for $i from 0 through 24
|
|
13
|
-
$value: $i
|
|
14
|
-
.is-letter-specing-#{$i}
|
|
15
|
-
letter-spacing: $value
|
|
16
|
-
.is-letter-specing-center-#{$i}px
|
|
13
|
+
$value: px_to_rem($i * 1px)
|
|
14
|
+
.is-letter-specing-#{$i}
|
|
17
15
|
letter-spacing: $value
|
|
16
|
+
.is-letter-specing-center-#{$i}
|
|
17
|
+
letter-spacing: $value * -1
|
|
18
18
|
text-indent: $value
|
|
19
19
|
|
|
20
20
|
.is-white-space-nowrap
|
|
@@ -5,8 +5,13 @@
|
|
|
5
5
|
@return null
|
|
6
6
|
|
|
7
7
|
@function background_position($value)
|
|
8
|
-
@if list($value)
|
|
9
|
-
@
|
|
8
|
+
@if list($value)
|
|
9
|
+
@if string(nth($value, 1)) and not str-index(nth($value, 1), '/')
|
|
10
|
+
@return true
|
|
11
|
+
@else if number(nth($value, 1))
|
|
12
|
+
@return true
|
|
13
|
+
@else
|
|
14
|
+
@return null
|
|
10
15
|
@else
|
|
11
16
|
@return null
|
|
12
17
|
|
|
@@ -17,8 +22,8 @@
|
|
|
17
22
|
@else
|
|
18
23
|
@return null
|
|
19
24
|
@else if list($value)
|
|
20
|
-
@if nth($value, 1)
|
|
21
|
-
@return
|
|
25
|
+
@if string(nth($value, 1)) and str-index(nth($value, 1), '/')
|
|
26
|
+
@return $value
|
|
22
27
|
@else
|
|
23
28
|
@return null
|
|
24
29
|
@else
|
|
@@ -94,6 +94,14 @@
|
|
|
94
94
|
@else if rem($px)
|
|
95
95
|
@return $px
|
|
96
96
|
|
|
97
|
+
@function rem_to_px($rem, $base-px: $base-px)
|
|
98
|
+
@if strip_unit($rem) == 0
|
|
99
|
+
@return 0
|
|
100
|
+
@else if rem($rem)
|
|
101
|
+
@return (strip_unit($rem) * strip_unit($base-px)) * 1px
|
|
102
|
+
@else if px($px)
|
|
103
|
+
@return $rem
|
|
104
|
+
|
|
97
105
|
@function multiple($number, $multiple_number)
|
|
98
106
|
// $multiple_number で割り切れる $number に近い数を出す
|
|
99
107
|
$remainder: $number % $multiple_number
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
@else if background_size($property)
|
|
27
27
|
$background-size: background_size($property)
|
|
28
28
|
@else if background_clip($property)
|
|
29
|
-
$background-clip:
|
|
29
|
+
$background-clip: $property
|
|
30
30
|
@if background-size != () and $background-position == ()
|
|
31
31
|
$background-position: (left top)
|
|
32
32
|
$background-value: $background-color $background-image $background-gradient $background-position $background-size $background-repeat $background-attachment $background-clip
|
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
=small-font($font-size)
|
|
2
|
+
// 9px以下のfont-sizeを使う設定（IE8不可）
|
|
3
|
+
transform: scale3d(strip_unit(rem_to_px($font-size) / 10), strip_unit(rem_to_px($font-size) / 10), 1)
|
|
4
|
+
transform-origin: 0 0
|
|
5
|
+
|
|
1
6
|
// どこでも font-weight と text-align と color と +top() が書ける設定
|
|
2
7
|
=text-block-options($value)
|
|
3
8
|
font-weight: if(font_weight($value), $value, null)
|
|
@@ -9,7 +14,10 @@
|
|
|
9
14
|
|
|
10
15
|
// +text-block($font-size $line-height $margin-bottom, $font-weight $text-align $color $top)
|
|
11
16
|
=text-block($value1: null, $value2: null)
|
|
12
|
-
|
|
17
|
+
@if px_to_rem(nth($value1, 1)) > .5rem
|
|
18
|
+
font-size: nth($value1, 1)
|
|
19
|
+
@else
|
|
20
|
+
+small-font(nth($value1, 1))
|
|
13
21
|
line-height: optional_nth($value1, 2)
|
|
14
22
|
margin-bottom: optional_nth($value1, 3)
|
|
15
23
|
@if ($value2)
|
|
@@ -26,10 +34,6 @@
|
|
|
26
34
|
letter-spacing: $space-width
|
|
27
35
|
text-indent: $space-width
|
|
28
36
|
|
|
29
|
-
=small-font($font-size)
|
|
30
|
-
// 9px以下のfont-sizeを使う設定（IE8不可）
|
|
31
|
-
transform: scale3d(strip_unit($font-size / 10), strip_unit($font-size/ 10), 1)
|
|
32
|
-
transform-origin: 0 0
|
|
33
37
|
|
|
34
38
|
=ellipsis($max-width: 100%)
|
|
35
39
|
display: inline-block
|
data/bower.json
CHANGED
data/lib/oulu/version.rb
CHANGED
data/package.json
CHANGED
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: oulu
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.12.
|
|
4
|
+
version: 0.12.1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- machida
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2016-06-
|
|
11
|
+
date: 2016-06-13 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: thor
|