@primer/brand-css 0.72.1-rc.8a8dc720 → 0.72.1-rc.c3699332
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.
- package/components/Card/Card.css +5 -43
- package/package.json +1 -1
package/components/Card/Card.css
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
text-decoration: none;
|
|
6
6
|
color: var(--brand-color-text-default);
|
|
7
7
|
|
|
8
|
-
padding: var(--
|
|
8
|
+
padding: var(--base-size-32) var(--base-size-20);
|
|
9
9
|
display: grid;
|
|
10
10
|
grid-template-columns: 1fr 1fr;
|
|
11
11
|
grid-template-areas:
|
|
@@ -26,20 +26,18 @@
|
|
|
26
26
|
|
|
27
27
|
@media screen and (min-width: 64rem) {
|
|
28
28
|
.Card {
|
|
29
|
-
|
|
29
|
+
padding-inline: var(--base-size-32);
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
|
|
33
33
|
.Card--align-center .Card {
|
|
34
|
-
--brand-Card-padding-block: var(--base-size-64);
|
|
35
|
-
--brand-Card-padding-inline: var(--base-size-40);
|
|
36
|
-
|
|
37
34
|
text-align: center;
|
|
35
|
+
padding: var(--base-size-64) var(--base-size-40);
|
|
38
36
|
}
|
|
39
37
|
|
|
40
38
|
@media screen and (min-width: 64rem) {
|
|
41
39
|
.Card--align-center .Card {
|
|
42
|
-
--
|
|
40
|
+
padding: var(--base-size-64) var(--base-size-80);
|
|
43
41
|
}
|
|
44
42
|
}
|
|
45
43
|
|
|
@@ -152,8 +150,7 @@
|
|
|
152
150
|
}
|
|
153
151
|
|
|
154
152
|
.Card--hasLeadingVisual {
|
|
155
|
-
|
|
156
|
-
--brand-Card-padding-inline: var(--base-size-40);
|
|
153
|
+
padding: var(--base-size-64) var(--base-size-40);
|
|
157
154
|
}
|
|
158
155
|
|
|
159
156
|
.Card--imagePos-block-end .Card__image {
|
|
@@ -259,41 +256,6 @@
|
|
|
259
256
|
grid-area: image;
|
|
260
257
|
}
|
|
261
258
|
|
|
262
|
-
.Card__image--padding-none {
|
|
263
|
-
margin-inline: calc(var(--brand-Card-padding-inline) * -1);
|
|
264
|
-
}
|
|
265
|
-
|
|
266
|
-
.Card__image--position-block-start.Card__image--padding-none {
|
|
267
|
-
margin-block-start: calc(var(--brand-Card-padding-block) * -1);
|
|
268
|
-
}
|
|
269
|
-
|
|
270
|
-
.Card__image--position-block-end.Card__image--padding-none {
|
|
271
|
-
margin-block-end: calc(var(--brand-Card-padding-block) * -1);
|
|
272
|
-
}
|
|
273
|
-
|
|
274
|
-
.Card--border .Card__image--position-block-start.Card__image--padding-none {
|
|
275
|
-
border-end-start-radius: 0;
|
|
276
|
-
border-end-end-radius: 0;
|
|
277
|
-
}
|
|
278
|
-
|
|
279
|
-
.Card--border .Card__image--position-block-end.Card__image--padding-none {
|
|
280
|
-
border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);
|
|
281
|
-
border-start-start-radius: 0;
|
|
282
|
-
border-start-end-radius: 0;
|
|
283
|
-
}
|
|
284
|
-
|
|
285
|
-
.Card--variant-minimal .Card__image--padding-none {
|
|
286
|
-
margin-inline: 0;
|
|
287
|
-
}
|
|
288
|
-
|
|
289
|
-
.Card--variant-minimal .Card__image--position-block-start.Card__image--padding-none {
|
|
290
|
-
margin-block-start: 0;
|
|
291
|
-
}
|
|
292
|
-
|
|
293
|
-
.Card--variant-minimal .Card__image--position-block-end.Card__image--padding-none {
|
|
294
|
-
margin-block-end: 0;
|
|
295
|
-
}
|
|
296
|
-
|
|
297
259
|
.Card__image img,
|
|
298
260
|
.Card__image picture,
|
|
299
261
|
.Card__image span {
|