Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

refactor(Blankslate): add support for css modules to Blankslate #4810

Merged
merged 16 commits into from
Aug 7, 2024
Merged

refactor(Blankslate): add support for css modules to Blankslate #4810

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
e0cce78
test(e2e): add snapshots for Blankslate
joshblack Aug 1, 2024
099cac3
test(e2e): add support for feature flags in globals
joshblack Aug 1, 2024
7aeff6a
refactor(Blankslate): add support for css modules to Blankslate
joshblack Aug 1, 2024
f563bfd
chore: remove local snapshots
joshblack Aug 1, 2024
6ecfc39
test(e2e): add fallback snapshots for styled-components
joshblack Aug 1, 2024
4de18f3
chore: add changeset
joshblack Aug 1, 2024
072e765
fix(stylelint): address stylelint errors
joshblack Aug 1, 2024
ed8e206
chore: fix export size script
joshblack Aug 1, 2024
c59ca5a
Merge branch 'main' of github.com:primer/react into refactor/update-b…
joshblack Aug 1, 2024
d5a1df7
chore: fix feature flag on action
joshblack Aug 1, 2024
a5f363c
test(vrt): update snapshots
joshblack Aug 1, 2024
e0044c4
Merge branch 'refactor/update-blankslate-to-css-modules-2' of github.…
joshblack Aug 1, 2024
5243a7d
test(vrt): update snapshots
joshblack Aug 1, 2024
f8d5f62
Merge branch 'main' into refactor/update-blankslate-to-css-modules-2
joshblack Aug 6, 2024
f931efa
test(e2e): remove styled-components snapshots
joshblack Aug 6, 2024
2416b6a
refactor(e2e): update snapshots to point to same image
joshblack Aug 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
fix(stylelint): address stylelint errors
  • Loading branch information
@joshblack
joshblack committed Aug 1, 2024
commit 072e765b38910982a8be7039ec7d95ed09f52169
8 changes: 4 additions & 4 deletions .stylelintignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
docs/public/**/*.css
lib-esm/**/*.css
lib/**/*.css
dist/**/*.css
.next/**/*.css
**/lib-esm/**/*.css
**/lib/**/*.css
**/dist/**/*.css
**/.next/**/*.css
31 changes: 21 additions & 10 deletions packages/react/src/Blankslate/Blankslate.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@

display: grid;
justify-items: center;
/* stylelint-disable-next-line primer/spacing */
padding: var(--blankslate-outer-padding-block) var(--blankslate-outer-padding-inline);
}

Expand All @@ -22,14 +23,15 @@
}

.Blankslate[data-narrow='true'] {
margin: 0 auto;
max-width: 485px;
margin: 0 auto;
}

.Heading,
.Description {
margin: 0;
margin-bottom: var(--stack-gap-condensed, 0.5rem);
/* stylelint-disable-next-line primer/spacing */
margin-bottom: var(--stack-gap-condensed, var(--base-size-8));
}

.Heading {
Expand All @@ -38,24 +40,28 @@
}

.Description {
color: var(--fgColor-muted);
font-size: var(--text-body-size-large, 1rem);
line-height: var(--text-body-lineHeight-large, 1.5);
color: var(--fgColor-muted);
}

.Action {
margin-top: var(--stack-gap-normal, 1rem);
/* stylelint-disable-next-line primer/spacing */
margin-top: var(--stack-gap-normal, var(--base-size-16));
}

.Action:first-of-type {
margin-top: var(--stack-gap-spacious, 1.5rem);
/* stylelint-disable-next-line primer/spacing */
margin-top: var(--stack-gap-spacious, var(--base-size-24));
}

.Action:last-of-type {
margin-bottom: var(--stack-gap-condensed, 0.5rem);
/* stylelint-disable-next-line primer/spacing */
margin-bottom: var(--stack-gap-condensed, var(--base-size-8));
}

/* At the time these styles were written, 34rem was our "small" breakpoint width */
/* stylelint-disable-next-line plugin/no-unsupported-browser-features */
@container blankslate (max-width: 34rem) {
.Blankslate {
--blankslate-outer-padding-block: var(--base-size-20);
Expand All @@ -68,10 +74,12 @@
}

.Visual {
margin-bottom: var(--stack-gap-condensed, 0.5rem);
max-width: var(--base-size-24);
/* stylelint-disable-next-line primer/spacing */
margin-bottom: var(--stack-gap-condensed, var(--base-size-8));
}

/* stylelint-disable-next-line selector-max-type */
.Visual svg {
width: 100%;
}
Expand All @@ -85,14 +93,17 @@
}

.Action {
margin-top: var(--stack-gap-condensed, 0.5rem);
/* stylelint-disable-next-line primer/spacing */
margin-top: var(--stack-gap-condensed, var(--base-size-8));
}

.Action:first-of-type {
margin-top: var(--stack-gap-normal, 1rem);
/* stylelint-disable-next-line primer/spacing */
margin-top: var(--stack-gap-normal, var(--base-size-16));
}

.Action:last-of-type {
margin-bottom: calc(var(--stack-gap-condensed, 0.5rem) / 2);
/* stylelint-disable-next-line primer/spacing */
margin-bottom: calc(var(--stack-gap-condensed, var(--base-size-8)) / 2);
}
}
Loading