Skip to content

Commit a43e0f3

Browse files
castastrophecastastrophe
committed
Merge branch 'main' into feat-deprecating-old-token-packages
2 parents 41aa824 + a290816 commit a43e0f3

File tree

10 files changed

+247
-55
lines changed

10 files changed

+247
-55
lines changed

‎.storybook/manager.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,13 @@ import logo from "./assets/logo.svg";
77
import pkg from "./package.json";
88

99
// Load global styles
10-
import "@spectrum-css/vars/dist/spectrum-global.css";
11-
import "@spectrum-css/vars/dist/spectrum-light.css";
12-
import "@spectrum-css/vars/dist/spectrum-medium.css";
10+
import "@spectrum-css/vars/css/globals/index.css";
11+
import "@spectrum-css/vars/css/components/index.css";
1312

14-
import "./global.js";
13+
import "@spectrum-css/vars/css/scales/spectrum-medium.css";
14+
import "@spectrum-css/vars/css/themes/spectrum-light.css";
1515

16-
import "@spectrum-css/tokens";
16+
import "./global.js";
1717

1818
addons.setConfig({
1919
theme: create({

‎.storybook/package.json

Lines changed: 0 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -85,21 +85,6 @@
8585
"{workspaceRoot}/storybook-static"
8686
]
8787
},
88-
"storybook": {
89-
"dependsOn": [
90-
"^build"
91-
],
92-
"inputs": [
93-
"{workspaceRoot}/assets",
94-
"{workspaceRoot}/decorators",
95-
"{workspaceRoot}/*.js",
96-
"{workspaceRoot}/*.html",
97-
"{projectRoot}/components/*/dist"
98-
],
99-
"outputs": [
100-
"{workspaceRoot}/storybook-static"
101-
]
102-
},
10388
"clean": {
10489
"inputs": [
10590
"{workspaceRoot}/storybook-static"

‎.storybook/preview.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@ import "@spectrum-css/vars/dist/spectrum-dark.css";
2525
import "@spectrum-css/vars/dist/spectrum-darkest.css";
2626
import "@spectrum-css/vars/dist/spectrum-light.css";
2727

28-
import "@spectrum-css/vars/dist/components/index.css";
2928
import "@spectrum-css/vars/dist/spectrum-global.css";
3029

3130
import "@spectrum-css/expressvars/dist/spectrum-large.css";
@@ -35,7 +34,6 @@ import "@spectrum-css/expressvars/dist/spectrum-dark.css";
3534
import "@spectrum-css/expressvars/dist/spectrum-darkest.css";
3635
import "@spectrum-css/expressvars/dist/spectrum-light.css";
3736

38-
import "@spectrum-css/expressvars/dist/components/index.css";
3937
import "@spectrum-css/expressvars/dist/spectrum-global.css";
4038

4139
import "@spectrum-css/tokens";

‎components/card/index.css

Lines changed: 61 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ governing permissions and limitations under the License.
1818
--spectrum-card-title-padding-right: var(--spectrum-spacing-400);
1919
--spectrum-card-content-margin-top: var(--spectrum-spacing-100);
2020
--spectrum-card-content-margin-bottom: var(--spectrum-spacing-300);
21-
--spectrum-card-footer-margin-top: var(--spectrum-spacing-100);
21+
--spectrum-card-footer-padding-top: var(--spectrum-spacing-100);
2222
--spectrum-card-subtitle-padding-right: var(--spectrum-spacing-100);
2323

2424
--spectrum-card-border-width: var(--spectrum-border-width-100);
@@ -367,9 +367,9 @@ governing permissions and limitations under the License.
367367
);
368368
box-sizing: border-box;
369369

370-
display: flex;
371-
align-items: center;
372-
justify-content: center;
370+
display: flex;
371+
align-items: center;
372+
justify-content: center;
373373

374374
border-start-start-radius: calc(
375375
var(--mod-card-corner-radius, var(--spectrum-card-corner-radius)) -
@@ -408,21 +408,35 @@ governing permissions and limitations under the License.
408408
}
409409

410410
.spectrum-Card-body {
411+
/* @deprecation --mod-card-title-padding-top has been renamed to --mod-card-body-padding-block-start
412+
and will be removed in a future version. */
411413
padding-block-start: var(
412-
--mod-card-title-padding-top,
413-
var(--spectrum-card-title-padding-top)
414+
--mod-card-body-padding-block-start,
415+
var(
416+
--mod-card-title-padding-top,
417+
var(--spectrum-card-title-padding-top)
418+
)
414419
);
415-
padding-inline-end: calc(
416-
var(--mod-card-body-spacing, var(--spectrum-card-body-spacing)) -
420+
padding-inline-end: var(
421+
--mod-card-body-padding-inline-end,
422+
calc(
423+
var(--mod-card-body-spacing, var(--spectrum-card-body-spacing)) -
417424
var(--mod-card-border-width, var(--spectrum-card-border-width))
425+
)
418426
);
419-
padding-inline-start: calc(
420-
var(--mod-card-body-spacing, var(--spectrum-card-body-spacing)) -
427+
padding-inline-start: var(
428+
--mod-card-body-padding-inline-start,
429+
calc(
430+
var(--mod-card-body-spacing, var(--spectrum-card-body-spacing)) -
421431
var(--mod-card-border-width, var(--spectrum-card-border-width))
432+
)
422433
);
423-
padding-block-end: calc(
424-
var(--mod-card-body-spacing, var(--spectrum-card-body-spacing)) -
434+
padding-block-end: var(
435+
--mod-card-body-padding-block-end,
436+
calc(
437+
var(--mod-card-body-spacing, var(--spectrum-card-body-spacing)) -
425438
var(--mod-card-border-width, var(--spectrum-card-border-width))
439+
)
426440
);
427441
}
428442

@@ -526,25 +540,47 @@ governing permissions and limitations under the License.
526540

527541
.spectrum-Card-footer {
528542
/* Accommodate for wanting less spacing between body and footer */
529-
margin-block-start: calc(
530-
-1 * (var(--mod-card-body-spacing, var(--spectrum-card-body-spacing)) -
531-
var(
532-
--mod-card-content-margin-bottom,
533-
var(--spectrum-card-content-margin-bottom)
534-
))
543+
margin-block-start: var(
544+
--mod-card-footer-margin-block-start,
545+
calc(
546+
-1 * (var(--mod-card-body-spacing, var(--spectrum-card-body-spacing)) -
547+
var(
548+
--mod-card-content-margin-bottom,
549+
var(--spectrum-card-content-margin-bottom)
550+
))
551+
)
535552
);
536553
margin-inline-start: var(
537-
--mod-card-body-spacing,
538-
var(--spectrum-card-body-spacing)
554+
--mod-card-footer-margin-inline-start,
555+
var(
556+
--mod-card-body-spacing,
557+
var(--spectrum-card-body-spacing)
558+
)
539559
);
540560
margin-inline-end: var(
541-
--mod-card-body-spacing,
542-
var(--spectrum-card-body-spacing)
561+
--mod-card-footer-margin-inline-end,
562+
var(
563+
--mod-card-body-spacing,
564+
var(--spectrum-card-body-spacing)
565+
)
543566
);
544-
padding-block-end: calc(
545-
var(--mod-card-body-spacing, var(--spectrum-card-body-spacing)) -
567+
padding-block-end: var(
568+
--mod-card-footer-padding-block-end,
569+
calc(
570+
var(--mod-card-body-spacing, var(--spectrum-card-body-spacing)) -
546571
var(--mod-card-border-width, var(--spectrum-card-border-width))
572+
)
573+
);
574+
/* @deprecation --mod-card-footer-margin-top has been renamed to --mod-card-footer-padding-block-start
575+
and will be removed in a future version. */
576+
padding-block-start: var(
577+
--mod-card-footer-padding-block-start,
578+
var(
579+
--mod-card-footer-margin-top,
580+
var(--spectrum-card-footer-padding-top)
581+
)
547582
);
583+
548584
color: var(
549585
--highcontrast-card-body-font-color,
550586
var(--mod-card-body-font-color, var(--spectrum-card-body-font-color))
@@ -553,16 +589,11 @@ governing permissions and limitations under the License.
553589
--mod-card-body-line-height,
554590
var(--spectrum-card-body-line-height)
555591
);
556-
557592
border-block-start: var(
558593
--mod-card-border-width,
559594
var(--spectrum-card-border-width)
560595
)
561596
solid var(--mod-card-divider-color, var(--spectrum-card-divider-color));
562-
padding-block-start: var(
563-
--mod-card-footer-margin-top,
564-
var(--spectrum-card-footer-margin-top)
565-
);
566597
}
567598

568599
.spectrum-Card-header {
@@ -669,7 +700,7 @@ governing permissions and limitations under the License.
669700
}
670701

671702
/* Use ::after to show the selection outline so that the border doesn't
672-
* affect the layout of the content within the preview. */
703+
affect the layout of the content within the preview. */
673704
&::after {
674705
content: "";
675706
block-size: 100%;

‎components/card/metadata/mods.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,10 @@
1818
| `--mod-card-body-font-style` |
1919
| `--mod-card-body-font-weight` |
2020
| `--mod-card-body-line-height` |
21+
| `--mod-card-body-padding-block-end` |
22+
| `--mod-card-body-padding-block-start` |
23+
| `--mod-card-body-padding-inline-end` |
24+
| `--mod-card-body-padding-inline-start` |
2125
| `--mod-card-body-spacing` |
2226
| `--mod-card-border-color` |
2327
| `--mod-card-border-color-hover` |
@@ -29,7 +33,12 @@
2933
| `--mod-card-divider-color` |
3034
| `--mod-card-focus-indicator-color` |
3135
| `--mod-card-focus-indicator-width` |
36+
| `--mod-card-footer-margin-block-start` |
37+
| `--mod-card-footer-margin-inline-end` |
38+
| `--mod-card-footer-margin-inline-start` |
3239
| `--mod-card-footer-margin-top` |
40+
| `--mod-card-footer-padding-block-end` |
41+
| `--mod-card-footer-padding-block-start` |
3342
| `--mod-card-horizontal-body-padding` |
3443
| `--mod-card-horizontal-preview-padding` |
3544
| `--mod-card-minimum-width` |

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
"build:site": "gulp buildDocs -LLL",
3131
"cache:clean": "nx reset",
3232
"ci": "yarn build:all",
33-
"ci:storybook": "nx run-many --projects @spectrum-css/preview --target storybook",
33+
"ci:storybook": "nx run-many --projects @spectrum-css/preview --target build",
3434
"clean": "yarn cache:clean && run-p clean:*",
3535
"clean:components": "lerna exec --scope \"${SCOPE:-@spectrum-css/*}\" --ignore \"@spectrum-css/{*-builder*,preview,generator}\" -- rimraf dist",
3636
"clean:docs": "rimraf dist",

0 commit comments

Comments
 (0)