playbook_ui 12.22.0.pre.alpha.play698responsivespacingglobalprop690 → 12.22.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/utilities/_spacing.scss +1 -27
- data/app/pb_kits/playbook/utilities/globalProps.ts +15 -60
- data/lib/playbook/spacing.rb +5 -20
- data/lib/playbook/version.rb +2 -2
- metadata +7 -7
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 4bbbcbbc5dcde74cb026a9f2b5d510c6362f2654c8c06885b25881598603b1b4
|
4
|
+
data.tar.gz: 5f7fa24b05cee92ce96deab0f358fe0bfbc0909753555b7d13179423d13d26cc
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 9532f359c1aa5bd18300c006a1e9cb97d80377fa4616354c38087b5725e399f3296c179862789c48d04dc34506ffc31a07a3c9a0e9f24498f33e1d98c31ca535
|
7
|
+
data.tar.gz: 86612e31acd71f850bb381a30cf6e044ebf502d4e4be657bfab6bde5bd1a0bf3ebc10106c2e3e4c36c708bf1b4500d4ef701f58f0f9835bbfe566d8ccb269b51
|
@@ -7,10 +7,7 @@ $space_classes: (
|
|
7
7
|
md: $space_md,
|
8
8
|
lg: $space_lg,
|
9
9
|
xl: $space_xl,
|
10
|
-
none: 0
|
11
|
-
auto: auto,
|
12
|
-
initial: initial,
|
13
|
-
inherit: inherit
|
10
|
+
none: 0
|
14
11
|
);
|
15
12
|
|
16
13
|
$positions: (
|
@@ -44,26 +41,3 @@ $positions: (
|
|
44
41
|
}
|
45
42
|
}
|
46
43
|
}
|
47
|
-
|
48
|
-
@each $size, $size_value in $breakpoints_grid {
|
49
|
-
@each $position_name, $position in $positions {
|
50
|
-
@each $space_name, $space in $space_classes {
|
51
|
-
$min_size: map-get($size_value, "min");
|
52
|
-
$max_size: map-get($size_value, "max");
|
53
|
-
.#{$position_name}_#{$size}_#{$space_name} {
|
54
|
-
@if type-of($position)=="list" {
|
55
|
-
@each $coordinate in $position {
|
56
|
-
@include break_on($min_size, $max_size) {
|
57
|
-
#{$coordinate}: #{$space} !important;
|
58
|
-
}
|
59
|
-
}
|
60
|
-
}
|
61
|
-
@else {
|
62
|
-
@include break_on($min_size, $max_size) {
|
63
|
-
#{$position}: #{$space} !important;
|
64
|
-
}
|
65
|
-
}
|
66
|
-
}
|
67
|
-
}
|
68
|
-
}
|
69
|
-
}
|
@@ -153,67 +153,22 @@ const PROP_CATEGORIES: {[key:string]: (props: {[key: string]: any}) => string} =
|
|
153
153
|
padding,
|
154
154
|
}: Margin & Padding) => {
|
155
155
|
let css = ''
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
};
|
172
|
-
|
173
|
-
function handleObjectValue(properties: Margin | Padding, prefix: string) {
|
174
|
-
let classResult = '';
|
175
|
-
|
176
|
-
Object.entries(properties).forEach(([key, value]) => {
|
177
|
-
classResult += `${prefix}_${key}_${value} `;
|
178
|
-
});
|
179
|
-
|
180
|
-
return classResult;
|
181
|
-
}
|
182
|
-
|
183
|
-
function getPrefix(key: string) {
|
184
|
-
const prefixes: Record<string, string> = {
|
185
|
-
marginRight: 'mr',
|
186
|
-
marginLeft: 'ml',
|
187
|
-
marginTop: 'mt',
|
188
|
-
marginBottom: 'mb',
|
189
|
-
marginX: 'mx',
|
190
|
-
marginY: 'my',
|
191
|
-
margin: 'm',
|
192
|
-
paddingRight: 'pr',
|
193
|
-
paddingLeft: 'pl',
|
194
|
-
paddingTop: 'pt',
|
195
|
-
paddingBottom: 'pb',
|
196
|
-
paddingX: 'px',
|
197
|
-
paddingY: 'py',
|
198
|
-
padding: 'p',
|
199
|
-
};
|
200
|
-
|
201
|
-
return prefixes[key];
|
202
|
-
}
|
203
|
-
|
204
|
-
Object.entries(spacingProps).forEach(([key, value]) => {
|
205
|
-
if (value) {
|
206
|
-
if (typeof value === 'object') {
|
207
|
-
css += handleObjectValue(value, getPrefix(key));
|
208
|
-
} else {
|
209
|
-
const prefix = getPrefix(key);
|
210
|
-
css += `${prefix}_${value} `;
|
211
|
-
}
|
212
|
-
}
|
213
|
-
});
|
214
|
-
return css.trim();
|
156
|
+
css += marginRight ? `mr_${marginRight} ` : ''
|
157
|
+
css += marginLeft ? `ml_${marginLeft} ` : ''
|
158
|
+
css += marginTop ? `mt_${marginTop} ` : ''
|
159
|
+
css += marginBottom ? `mb_${marginBottom} ` : ''
|
160
|
+
css += marginX ? `mx_${marginX} ` : ''
|
161
|
+
css += marginY ? `my_${marginY} ` : ''
|
162
|
+
css += margin ? `m_${margin} ` : ''
|
163
|
+
css += paddingRight ? `pr_${paddingRight} ` : ''
|
164
|
+
css += paddingLeft ? `pl_${paddingLeft} ` : ''
|
165
|
+
css += paddingTop ? `pt_${paddingTop} ` : ''
|
166
|
+
css += paddingBottom ? `pb_${paddingBottom} ` : ''
|
167
|
+
css += paddingX ? `px_${paddingX} ` : ''
|
168
|
+
css += paddingY ? `py_${paddingY} ` : ''
|
169
|
+
css += padding ? `p_${padding} ` : ''
|
170
|
+
return css
|
215
171
|
},
|
216
|
-
|
217
172
|
darkProps: ({ dark }: Dark) => dark ? 'dark' : '',
|
218
173
|
numberSpacingProps: ({ numberSpacing }: NumberSpacing) => {
|
219
174
|
let css = ''
|
data/lib/playbook/spacing.rb
CHANGED
@@ -50,32 +50,17 @@ module Playbook
|
|
50
50
|
end
|
51
51
|
|
52
52
|
def spacing_values
|
53
|
-
%w[none xxs xs sm md lg xl
|
54
|
-
end
|
55
|
-
|
56
|
-
def screen_size_values
|
57
|
-
%w[xs sm md lg xl]
|
53
|
+
%w[none xxs xs sm md lg xl]
|
58
54
|
end
|
59
55
|
|
60
56
|
def spacing_props
|
61
57
|
selected_props = spacing_options.keys.select { |sk| try(sk) }
|
62
58
|
return nil unless selected_props.present?
|
63
59
|
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
prefix = spacing_options[prop]
|
69
|
-
if responsive
|
70
|
-
spacing_value.each do |key, value|
|
71
|
-
css += "#{prefix}_#{key}_#{value} " if screen_size_values.include?(key.to_s) && spacing_values.include?(value.to_s)
|
72
|
-
end
|
73
|
-
elsif spacing_values.include?(spacing_value)
|
74
|
-
css += "#{prefix}_#{spacing_value} "
|
75
|
-
end
|
76
|
-
end
|
77
|
-
|
78
|
-
css.strip unless css.blank?
|
60
|
+
selected_props.map do |k|
|
61
|
+
spacing_value = send(k)
|
62
|
+
"#{spacing_options[k]}_#{spacing_value}" if spacing_values.include? spacing_value
|
63
|
+
end.compact.join(" ")
|
79
64
|
end
|
80
65
|
|
81
66
|
def max_width_props
|
data/lib/playbook/version.rb
CHANGED
metadata
CHANGED
@@ -1,15 +1,15 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: playbook_ui
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 12.22.0
|
4
|
+
version: 12.22.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Power UX
|
8
8
|
- Power Devs
|
9
|
-
autorequire:
|
9
|
+
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2023-05-
|
12
|
+
date: 2023-05-18 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionpack
|
@@ -2491,7 +2491,7 @@ homepage: http://playbook.powerapp.cloud
|
|
2491
2491
|
licenses:
|
2492
2492
|
- ISC
|
2493
2493
|
metadata: {}
|
2494
|
-
post_install_message:
|
2494
|
+
post_install_message:
|
2495
2495
|
rdoc_options: []
|
2496
2496
|
require_paths:
|
2497
2497
|
- lib
|
@@ -2502,12 +2502,12 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
2502
2502
|
version: '0'
|
2503
2503
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
2504
2504
|
requirements:
|
2505
|
-
- - "
|
2505
|
+
- - ">="
|
2506
2506
|
- !ruby/object:Gem::Version
|
2507
|
-
version:
|
2507
|
+
version: '0'
|
2508
2508
|
requirements: []
|
2509
2509
|
rubygems_version: 3.3.7
|
2510
|
-
signing_key:
|
2510
|
+
signing_key:
|
2511
2511
|
specification_version: 4
|
2512
2512
|
summary: Playbook Design System
|
2513
2513
|
test_files: []
|