feat: update projects page #51

chosww · 2025-01-08T19:13:43Z

Update projects page
Implement project panel component for each project
Create singular project page
Implement interaction styles for the card component

cloudflare-workers-and-pages · 2025-01-08T19:18:13Z

Deploying inclusive-standards with Cloudflare Pages

Latest commit:	`67f993a`
Status:	✅ Deploy successful!
Preview URL:	https://955795bc.inclusive-standards.pages.dev
Branch Preview URL:	https://feat-projects.inclusive-standards.pages.dev

View logs

src/_includes/layouts/about.njk

src/_includes/layouts/home.njk

src/assets/styles/app.css

src/assets/styles/base/_base.css

src/_includes/partials/components/projectPanel.macro.njk

src/collections/projects/en/project.md

src/_transforms/parse.js

src/_data/translations.json

src/_transforms/parse.js

greatislander

A few more changes. I also note you haven't added interactive styles for links. The issue which you've indicated that this PR closes lists buttons, selects, and accordions but I don't see those here… perhaps better to remove that from the scope of this PR as we don't have all those elements yet?

src/collections/projects/en/en.json

src/collections/projects/fr/fr.json

src/collections/projects/projects.11tydata.js

src/assets/styles/base/_base.css

src/_data/translations.json

src/_includes/layouts/project.njk

src/assets/styles/components/project-panel.css

greatislander

Only once change left here— replace all hex colours within the style declarations with variables so if we need to change them we can do it in one place!

greatislander · 2025-01-14T11:37:40Z

src/assets/styles/components/card.css

@@ -2,34 +2,34 @@
    color: black;
    min-width: 20.5rem;
    margin-bottom: 1rem;
-    box-shadow: 0 0.625rem 1.25rem 0 #0B046C26;
+    box-shadow:
+        0 0.625rem 1.25rem 0 #0B046C26,


Ideally we should always use a colour variable.

greatislander · 2025-01-14T11:37:52Z

src/assets/styles/components/card.css

 .card:has(a:focus) {
    border: 0.1875rem solid transparent;
+    box-shadow: 0 0.625rem 1.25rem 0 #0B046C26;


Use a colour variable here.

greatislander · 2025-01-14T11:38:07Z

src/assets/styles/components/card.css

+.card:hover {
+    box-shadow:
+        inset 0 0 0 0.1875rem var(--fl-fgColor, transparent),    
+        0 0.625rem 1.25rem 0 var(--fl-fgColor, #0B046C73);


Use a colour variable here.

greatislander · 2025-01-14T11:38:12Z

src/assets/styles/components/card.css

-    min-height: 2.5rem;
+.card:hover.card:has(a:focus) {
+    box-shadow:
+        0 0.625rem 1.25rem 0 var(--fl-fgColor, #0B046C73);


Use a colour variable here.

greatislander · 2025-01-14T11:38:28Z

src/assets/styles/components/project-panel.css

    position: relative;
 }

 .project-panel:has(a:focus) {
    border: 0.1875rem solid transparent;
+    box-shadow: 0 0.625rem 1.25rem 0 #0B046C26;


Colour variable here.

greatislander · 2025-01-14T11:38:39Z

src/assets/styles/components/project-panel.css

-    box-shadow: 0 0.625rem 1.25rem 0 var(--fl-fgColor, #0B046C73);
+    box-shadow:
+        inset 0 0 0 0.1875rem var(--fl-fgColor, transparent),
+        0 0.625rem 1.25rem 0 var(--fl-fgColor, #0B046C73);


Use a colour variable here.

greatislander · 2025-01-14T11:38:51Z

src/assets/styles/components/project-panel.css

-    box-sizing: content-box;
+.project-panel:hover.project-panel:has(a:focus) {
+    box-shadow:
+        0 0.625rem 1.25rem 0 var(--fl-fgColor, #0B046C73);


Use a colour variable here.

greatislander · 2025-01-14T11:40:59Z

A few more changes. I also note you haven't added interactive styles for links. The issue which you've indicated that this PR closes lists buttons, selects, and accordions but I don't see those here… perhaps better to remove that from the scope of this PR as we don't have all those elements yet?

Also @chosww can you clarify this about the interactive styles?

Signed-off-by: Ned Zimmerman <[email protected]>

chosww added 3 commits January 8, 2025 11:57

feat: add project panel component

fb3a785

fix: adjust card style in different states

9d1be41

fix: merge upstream main

ffb236d

greatislander requested changes Jan 8, 2025

View reviewed changes

fix: based on PR feedback and a style issue

3a0ac6a

chosww commented Jan 8, 2025

View reviewed changes

src/_transforms/parse.js Outdated Show resolved Hide resolved

This was linked to issues Jan 8, 2025

Projects page and cards #46

Closed

Hover, focus and active states for interactive elements #47

Closed

greatislander requested changes Jan 9, 2025

View reviewed changes

src/_data/translations.json Outdated Show resolved Hide resolved

src/_data/translations.json Outdated Show resolved Hide resolved

src/_transforms/parse.js Outdated Show resolved Hide resolved

chosww added 2 commits January 9, 2025 15:19

feat: add single project page and update card's interactive styles

0a7691f

fix: merge upstream main

10fa1f2

chosww marked this pull request as ready for review January 9, 2025 20:24

chosww requested a review from greatislander January 9, 2025 20:25

fix: localization issues

de6e0fc

greatislander requested changes Jan 10, 2025

View reviewed changes

chosww and others added 4 commits January 13, 2025 11:59

fix: update based on PR feedback

b2bec57

feat: add CMS configuration for projects

4a3dcf2

fix: remove empty div for card color

0d9c422

Merge remote-tracking branch 'upstream/feat/projects' into feat/projects

4a84ff9

greatislander requested changes Jan 14, 2025

View reviewed changes

greatislander added 2 commits January 14, 2025 08:16

feat: use variables for shadows

006ab9f

Signed-off-by: Ned Zimmerman <[email protected]>

feat: use abstract flow class for vertical rhythm

67f993a

greatislander removed a link to an issue Jan 14, 2025

Hover, focus and active states for interactive elements #47

Closed

4 tasks

greatislander enabled auto-merge (squash) January 14, 2025 12:21

greatislander approved these changes Jan 14, 2025

View reviewed changes

greatislander merged commit 27ba5fb into main Jan 14, 2025
3 checks passed

greatislander deleted the feat/projects branch January 14, 2025 12:22

github-actions bot mentioned this pull request Jan 9, 2025

chore(main): release 0.1.0 #3

Closed

greatislander mentioned this pull request Jan 14, 2025

Cards #59

Closed

github-actions bot mentioned this pull request Jan 17, 2025

chore(dev): release 0.1.0 #74

Closed

incd-github-actions bot mentioned this pull request Jan 20, 2025

chore(dev): release 1.0.0 #96

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: update projects page #51

feat: update projects page #51

chosww commented Jan 8, 2025 •

edited

Loading

cloudflare-workers-and-pages bot commented Jan 8, 2025 •

edited

Loading

greatislander left a comment

greatislander left a comment

greatislander Jan 14, 2025

greatislander Jan 14, 2025

greatislander Jan 14, 2025

greatislander Jan 14, 2025

greatislander Jan 14, 2025

greatislander Jan 14, 2025

greatislander Jan 14, 2025

greatislander commented Jan 14, 2025

feat: update projects page #51

feat: update projects page #51

Conversation

chosww commented Jan 8, 2025 • edited Loading

cloudflare-workers-and-pages bot commented Jan 8, 2025 • edited Loading

Deploying inclusive-standards with Cloudflare Pages

greatislander left a comment

Choose a reason for hiding this comment

greatislander left a comment

Choose a reason for hiding this comment

greatislander Jan 14, 2025

Choose a reason for hiding this comment

greatislander Jan 14, 2025

Choose a reason for hiding this comment

greatislander Jan 14, 2025

Choose a reason for hiding this comment

greatislander Jan 14, 2025

Choose a reason for hiding this comment

greatislander Jan 14, 2025

Choose a reason for hiding this comment

greatislander Jan 14, 2025

Choose a reason for hiding this comment

greatislander Jan 14, 2025

Choose a reason for hiding this comment

greatislander commented Jan 14, 2025

chosww commented Jan 8, 2025 •

edited

Loading

cloudflare-workers-and-pages bot commented Jan 8, 2025 •

edited

Loading