toolkit 2.0.1 → 2.1.0
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
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 608c41e92b39250bd26ec3cc16ee8e22d7d26f77
|
|
4
|
+
data.tar.gz: b3154ccae85ae0f7f6c7f2bcd30cb7eeef68bdad
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: efab2cc26f576a3fb38a4406a7ce4bf92bcb88ece3fb8e886cca0052721642a665140b22254e428e43f165d34b02d0451de2976b2e0484a1f58940d011913c72
|
|
7
|
+
data.tar.gz: 264eaf38db035ebfdabfee61ca2506123651eff23acd054f81bb68d583b315e2284bf8dcae8120a91f918717d9d1d8d83fa0b38e1d897275e300520c4bdf2fc8
|
data/lib/toolkit.rb
CHANGED
data/stylesheets/_toolkit.scss
CHANGED
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
// Vertically center anything, literally anything.
|
|
2
|
+
// http://zerosixthree.se/vertical-align-anything-with-just-3-lines-of-css/
|
|
3
|
+
@mixin vertical-center($midpoint: null, $extend: null) {
|
|
4
|
+
$midpoint: if($midpoint != null, $midpoint, toolkit-get('vertical midpoint'));
|
|
5
|
+
$extend: if($extend != null, $extend, toolkit-get('vertical extend'));
|
|
6
|
+
|
|
7
|
+
top: $midpoint;
|
|
8
|
+
@include vertical-center-core($extend);
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
@mixin vertical-center-core($extend: null) {
|
|
12
|
+
$extend: if($extend != null, $extend, toolkit-get('vertical extend'));
|
|
13
|
+
@if $extend {
|
|
14
|
+
@include dynamic-extend('vertical center') {
|
|
15
|
+
@include vertical-center-core($extend: false);
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
@else {
|
|
19
|
+
position: relative;
|
|
20
|
+
@if mixin-exists(transform) {
|
|
21
|
+
@include transform(translateY(-50%));
|
|
22
|
+
} @else {
|
|
23
|
+
-webkit-transform: translateY(-50%);
|
|
24
|
+
-ms-transform: translateY(-50%);
|
|
25
|
+
transform: translateY(-50%);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
//////////////////////////////
|
|
31
|
+
// Horizontal Center
|
|
32
|
+
//////////////////////////////
|
|
33
|
+
@mixin horizontal-center($midpoint: null, $fixed: null, $extend: null) {
|
|
34
|
+
$fixed: if($fixed != null, $fixed, toolkit-get('horizontal fixed'));
|
|
35
|
+
$extend: if($extend != null, $extend, toolkit-get('horizontal extend'));
|
|
36
|
+
|
|
37
|
+
@if $fixed {
|
|
38
|
+
$midpoint: if($midpoint != null, $midpoint, toolkit-get('horizontal fixed midpoint'));
|
|
39
|
+
}
|
|
40
|
+
@else {
|
|
41
|
+
$midpoint: if($midpoint != null, $midpoint, toolkit-get('horizontal midpoint'));
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
@if $midpoint != 0% {
|
|
45
|
+
left: $midpoint;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
@include horizontal-center-core($fixed, $extend);
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
@mixin horizontal-center-core($fixed: null, $extend: null) {
|
|
52
|
+
$fixed: if($fixed != null, $fixed, toolkit-get('horizontal fixed'));
|
|
53
|
+
$extend: if($extend != null, $extend, toolkit-get('horizontal extend'));
|
|
54
|
+
|
|
55
|
+
@if $extend {
|
|
56
|
+
@if $fixed {
|
|
57
|
+
@include dynamic-extend('horizontal center fixed') {
|
|
58
|
+
@include horizontal-center-core(true, false);
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
@else {
|
|
62
|
+
@include dynamic-extend('horizontal center') {
|
|
63
|
+
@include horizontal-center-core(false, false);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
@else {
|
|
68
|
+
@if $fixed {
|
|
69
|
+
position: fixed;
|
|
70
|
+
@if mixin-exists(transform) {
|
|
71
|
+
@include transform(translateX(-50%));
|
|
72
|
+
} @else {
|
|
73
|
+
-webkit-transform: translateX(-50%);
|
|
74
|
+
-ms-transform: translateX(-50%);
|
|
75
|
+
transform: translateX(-50%);
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
@else {
|
|
79
|
+
position: relative;
|
|
80
|
+
margin: 0 auto;
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
//////////////////////////////
|
|
86
|
+
// Absolute Center
|
|
87
|
+
//////////////////////////////
|
|
88
|
+
@mixin absolute-center($vertical: null, $horizontal: null, $fixed: null, $extend: null) {
|
|
89
|
+
$vertical: if($vertical != null, $vertical, toolkit-get('absolute center vertical midpoint'));
|
|
90
|
+
$fixed: if($fixed != null, $fixed, toolkit-get('absolute center fixed'));
|
|
91
|
+
$extend: if($extend != null, $extend, toolkit-get('absolute center extend'));
|
|
92
|
+
|
|
93
|
+
@if $fixed {
|
|
94
|
+
$horizontal: if($horizontal != null, $horizontal, toolkit-get('absolute center fixed horizontal midpoint'));
|
|
95
|
+
}
|
|
96
|
+
@else {
|
|
97
|
+
$horizontal: if($horizontal != null, $horizontal, toolkit-get('absolute center horizontal midpoint'));
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
top: $vertical;
|
|
101
|
+
@if $horizontal != 0% {
|
|
102
|
+
left: $horizontal;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
@include absolute-center-core($fixed, $extend);
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
@mixin absolute-center-core($fixed: null, $extend: null) {
|
|
109
|
+
$fixed: if($fixed != null, $fixed, toolkit-get('absolute center fixed'));
|
|
110
|
+
$extend: if($extend != null, $extend, toolkit-get('absolute center extend'));
|
|
111
|
+
|
|
112
|
+
@if $extend {
|
|
113
|
+
@if $fixed {
|
|
114
|
+
@include dynamic-extend('absolute center fixed') {
|
|
115
|
+
@include absolute-center-core(true, false);
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
@else {
|
|
119
|
+
@include dynamic-extend('absolute center') {
|
|
120
|
+
@include absolute-center-core(false, false);
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
@else {
|
|
125
|
+
@if $fixed {
|
|
126
|
+
position: fixed;
|
|
127
|
+
@if mixin-exists(transform) {
|
|
128
|
+
@include transform(translateY(-50%) translateX(-50%));
|
|
129
|
+
} @else {
|
|
130
|
+
-webkit-transform: translateY(-50%) translateX(-50%);
|
|
131
|
+
-ms-transform: translateY(-50%) translateX(-50%);
|
|
132
|
+
transform: translateY(-50%) translateX(-50%);
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
@else {
|
|
136
|
+
position: relative;
|
|
137
|
+
@if mixin-exists(transform) {
|
|
138
|
+
@include transform(translateY(-50%));
|
|
139
|
+
} @else {
|
|
140
|
+
-webkit-transform: translateY(-50%);
|
|
141
|
+
-ms-transform: translateY(-50%);
|
|
142
|
+
transform: translateY(-50%);
|
|
143
|
+
}
|
|
144
|
+
margin: 0 auto;
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
}
|
|
@@ -63,4 +63,8 @@
|
|
|
63
63
|
|
|
64
64
|
@mixin ir($ratio: null, $width: null, $elements: null, $position: null, $extend: null) {
|
|
65
65
|
@include intrinsic-ratio($ratio, $width, $elements, $extend, $position);
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
@mixin ir-ratio($ratio: null, $width: null, $position: null) {
|
|
69
|
+
@include intrinsic-ratio-ratio($ratio, $width, $position);
|
|
66
70
|
}
|
|
@@ -33,7 +33,16 @@ $Toolkit-Settings: (
|
|
|
33
33
|
'parallax ios': true,
|
|
34
34
|
'parallax distance': 0,
|
|
35
35
|
'vertical midpoint': 50%,
|
|
36
|
-
'vertical extend': false
|
|
36
|
+
'vertical extend': false,
|
|
37
|
+
'horizontal midpoint': 0%,
|
|
38
|
+
'horizontal fixed midpoint': 50%,
|
|
39
|
+
'horizontal fixed': false,
|
|
40
|
+
'horizontal extend': false,
|
|
41
|
+
'absolute center vertical midpoint': 50%,
|
|
42
|
+
'absolute center horizontal midpoint': 0%,
|
|
43
|
+
'absolute center fixed horizontal midpoint': 50%,
|
|
44
|
+
'absolute center fixed': false,
|
|
45
|
+
'absolute center extend': false,
|
|
37
46
|
);
|
|
38
47
|
|
|
39
48
|
//////////////////////////////
|
|
@@ -1,28 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
@mixin vertical-center($midpoint: null, $extend: null) {
|
|
4
|
-
$midpoint: if($midpoint != null, $midpoint, toolkit-get('vertical midpoint'));
|
|
5
|
-
$extend: if($extend != null, $extend, toolkit-get('vertical extend'));
|
|
6
|
-
|
|
7
|
-
top: $midpoint;
|
|
8
|
-
@include vertical-center-core($extend);
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
@mixin vertical-center-core($extend: null) {
|
|
12
|
-
$extend: if($extend != null, $extend, toolkit-get('vertical extend'));
|
|
13
|
-
@if $extend {
|
|
14
|
-
@include dynamic-extend('vertical center') {
|
|
15
|
-
@include vertical-center-core($extend: false);
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
@else {
|
|
19
|
-
position: relative;
|
|
20
|
-
@if mixin-exists(transform) {
|
|
21
|
-
@include transform(translateY(-50%));
|
|
22
|
-
} @else {
|
|
23
|
-
-webkit-transform: translateY(-50%);
|
|
24
|
-
-ms-transform: translateY(-50%);
|
|
25
|
-
transform: translateY(-50%);
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
}
|
|
1
|
+
@import "center";
|
|
2
|
+
@warn "DEPRECATION: Vertical Center has been moved to the `center` partial, please change your import from `toolkit/vertical-center` to `toolkit/center`. In a future release, this will be deprecated.";
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: toolkit
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 2.0
|
|
4
|
+
version: 2.1.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Sam Richard
|
|
@@ -10,7 +10,7 @@ authors:
|
|
|
10
10
|
autorequire:
|
|
11
11
|
bindir: bin
|
|
12
12
|
cert_chain: []
|
|
13
|
-
date: 2014-03-
|
|
13
|
+
date: 2014-03-27 00:00:00.000000000 Z
|
|
14
14
|
dependencies:
|
|
15
15
|
- !ruby/object:Gem::Dependency
|
|
16
16
|
name: sass
|
|
@@ -38,6 +38,7 @@ extra_rdoc_files: []
|
|
|
38
38
|
files:
|
|
39
39
|
- lib/toolkit.rb
|
|
40
40
|
- stylesheets/_toolkit.scss
|
|
41
|
+
- stylesheets/toolkit/_center.scss
|
|
41
42
|
- stylesheets/toolkit/_clearfix.scss
|
|
42
43
|
- stylesheets/toolkit/_colors.scss
|
|
43
44
|
- stylesheets/toolkit/_fonts.scss
|