playbook_ui 12.23.0.pre.alpha.play698responsivespacingglobalprop703 → 12.23.0
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
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: f67ec70c0d6e7b36d12c63070302b19e05fb73a0ff350fb0231322450415ed3b
|
4
|
+
data.tar.gz: 437239a1f1bc8fe1b59e9060bd619c7111b3ba70c9a74bcd4bd8535914488439
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: acd3344d113e1132c9ab0f9bb022cdf614ad90f7a71cd1d5b0cadfc8a2eb1e20bab49f34570c7c2574cac06977f542d12013213e1e92288d054d82b379a425c2
|
7
|
+
data.tar.gz: 7b914c68ab0c769a8e75e63600eaf46027ff3afbe8b5ceede26a13f82c2b81ab920b06a12f2d66d7ba426f3194f0f60b206afed133f6817511043ff3016c16e2
|
@@ -38,25 +38,6 @@ $breakpoints_grid: (
|
|
38
38
|
)
|
39
39
|
);
|
40
40
|
|
41
|
-
$breakpoints_max_only: (
|
42
|
-
xl: (
|
43
|
-
max: $screen-xl-max
|
44
|
-
),
|
45
|
-
lg: (
|
46
|
-
max: $screen-lg-max
|
47
|
-
),
|
48
|
-
md: (
|
49
|
-
max: $screen-md-max
|
50
|
-
),
|
51
|
-
sm: (
|
52
|
-
max: $screen-sm-max
|
53
|
-
),
|
54
|
-
xs: (
|
55
|
-
max: $screen-xs-max,
|
56
|
-
)
|
57
|
-
);
|
58
|
-
|
59
|
-
|
60
41
|
@function breakpoint($breakpoint_name) {
|
61
42
|
@return map-get($breakpoints, $breakpoint_name);
|
62
43
|
}
|
@@ -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_max_only {
|
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_at( $max_size) {
|
57
|
-
#{$coordinate}: #{$space} !important;
|
58
|
-
}
|
59
|
-
}
|
60
|
-
}
|
61
|
-
@else {
|
62
|
-
@include break_at( $max_size) {
|
63
|
-
#{$position}: #{$space} !important;
|
64
|
-
}
|
65
|
-
}
|
66
|
-
}
|
67
|
-
}
|
68
|
-
}
|
69
|
-
}
|
@@ -22,7 +22,7 @@ type AlignItems = {
|
|
22
22
|
type AlignSelf = {
|
23
23
|
alignSelf?: Alignment & ("auto" | "stretch" | "baseline")
|
24
24
|
}
|
25
|
-
type AllSizes = None | Sizes
|
25
|
+
type AllSizes = None | Sizes
|
26
26
|
|
27
27
|
type BorderRadius = {
|
28
28
|
borderRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "rounded",
|
@@ -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.23.0
|
4
|
+
version: 12.23.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-23 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: []
|