playbook_ui 14.11.0.pre.rc.10 → 14.11.0.pre.rc.11
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/pb_card/_card.scss +21 -3
- data/app/pb_kits/playbook/pb_card/docs/_card_header.html.erb +18 -0
- data/app/pb_kits/playbook/pb_card/docs/_card_header.jsx +40 -0
- data/dist/playbook-doc.js +1 -1
- data/dist/playbook.css +1 -1
- data/lib/playbook/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: e694c2643ff5bf236176c1fe13c8930bcecc59d1379065aa1e497458dd514729
|
4
|
+
data.tar.gz: 543a3cc41562304441b87189aae7c54ac4342d38d8b6935e474a5f7cb8179cca
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 62b02f1d1f288d2c3936a44f130a0865a9382f97cc730950a00fd53939d6effbfe1819e7d051774cdb48c9fe935a21795956c3238576a376698ec3f951502e18
|
7
|
+
data.tar.gz: 1179d93b6be2fe47dd5a66e60b88c3bc4ec9d95873091c8091b282e4d2708be91986865f848871bff977e02162501218a4fa518f5fe126136cef9729a53a7c68
|
@@ -21,6 +21,14 @@
|
|
21
21
|
border-width: 0px;
|
22
22
|
}
|
23
23
|
|
24
|
+
@function ends-with($string, $suffix) {
|
25
|
+
$suffix-length: str-length($suffix);
|
26
|
+
@if $suffix-length == 0 {
|
27
|
+
@return true;
|
28
|
+
}
|
29
|
+
@return str-slice($string, -$suffix-length) == $suffix;
|
30
|
+
}
|
31
|
+
|
24
32
|
[class^=pb_card_header_kit] {
|
25
33
|
flex-grow: 0;
|
26
34
|
flex-shrink: 0;
|
@@ -30,9 +38,19 @@
|
|
30
38
|
border: 0;
|
31
39
|
border-radius: $pb_card_header_border_radius $pb_card_header_border_radius 0px 0px;
|
32
40
|
@each $color_name, $color_value in $pb_card_header_colors {
|
33
|
-
|
34
|
-
|
35
|
-
|
41
|
+
@if not ends-with($color_name, '_subtle') {
|
42
|
+
&[class*="_#{$color_name}"] {
|
43
|
+
@include pb_card_header_color($color_value);
|
44
|
+
color: lightenText($color_value);
|
45
|
+
}
|
46
|
+
}
|
47
|
+
}
|
48
|
+
@each $color_name, $color_value in $pb_card_header_colors {
|
49
|
+
@if ends-with($color_name, '_subtle') {
|
50
|
+
&[class*="_#{$color_name}"] {
|
51
|
+
@include pb_card_header_color($color_value);
|
52
|
+
color: lightenText($color_value);
|
53
|
+
}
|
36
54
|
}
|
37
55
|
}
|
38
56
|
@each $color_name, $color_value in $pb_card_header_colors {
|
@@ -88,3 +88,21 @@
|
|
88
88
|
Body
|
89
89
|
<% end %>
|
90
90
|
<% end %>
|
91
|
+
|
92
|
+
<%= pb_rails("card", props: { padding: "none", header: true, margin_bottom: "sm"}) do %>
|
93
|
+
<%= pb_rails("card/card_header", props: { padding: "sm", header_color: "success_subtle" }) do %>
|
94
|
+
<%= pb_rails("body", props: { text: "Success Subtle" }) %>
|
95
|
+
<% end %>
|
96
|
+
<%= pb_rails("card/card_body", props: { padding: "md" }) do %>
|
97
|
+
Body
|
98
|
+
<% end %>
|
99
|
+
<% end %>
|
100
|
+
|
101
|
+
<%= pb_rails("card", props: { padding: "none", header: true, margin_bottom: "sm"}) do %>
|
102
|
+
<%= pb_rails("card/card_header", props: { padding: "sm", header_color: "error_subtle" }) do %>
|
103
|
+
<%= pb_rails("body", props: { text: "Error Subtle"}) %>
|
104
|
+
<% end %>
|
105
|
+
<%= pb_rails("card/card_body", props: { padding: "md" }) do %>
|
106
|
+
Body
|
107
|
+
<% end %>
|
108
|
+
<% end %>
|
@@ -231,6 +231,46 @@ const CardHeader = (props) => {
|
|
231
231
|
/>
|
232
232
|
</Card.Body>
|
233
233
|
</Card>
|
234
|
+
|
235
|
+
<Card
|
236
|
+
{...props}
|
237
|
+
marginBottom='sm'
|
238
|
+
padding="none"
|
239
|
+
>
|
240
|
+
<Card.Header
|
241
|
+
headerColor="success_subtle"
|
242
|
+
>
|
243
|
+
<Body
|
244
|
+
text="Success Subtle"
|
245
|
+
/>
|
246
|
+
</Card.Header>
|
247
|
+
<Card.Body>
|
248
|
+
<Body
|
249
|
+
{...props}
|
250
|
+
text="Body"
|
251
|
+
/>
|
252
|
+
</Card.Body>
|
253
|
+
</Card>
|
254
|
+
|
255
|
+
<Card
|
256
|
+
{...props}
|
257
|
+
marginBottom='sm'
|
258
|
+
padding="none"
|
259
|
+
>
|
260
|
+
<Card.Header
|
261
|
+
headerColor="error_subtle"
|
262
|
+
>
|
263
|
+
<Body
|
264
|
+
text="Error Subtle"
|
265
|
+
/>
|
266
|
+
</Card.Header>
|
267
|
+
<Card.Body>
|
268
|
+
<Body
|
269
|
+
{...props}
|
270
|
+
text="Body"
|
271
|
+
/>
|
272
|
+
</Card.Body>
|
273
|
+
</Card>
|
234
274
|
</>
|
235
275
|
)
|
236
276
|
}
|