feat: Update landing page index styles #1170
Conversation
|
This pull request has been linked to Shortcut Story #2741: Update page design for .../landing. |
|
Hi there @jcbcapps ! I am not seeing any landing pages. Do I need to hook this PR up to the API? to see data? If so, will these instructions work? #1127 (comment)
|
@AnnaGingle This PR uses data from the CMS, so no, the instructions you linked will not be helpful. You'll need to have the latest version of the CMS on your local machine. After running |
|
@jcbcapps Got it working! Thanks Here is some design feedback (I will circle back when feedback on accessibility)
Everything else is on point! Good work |
src/pages/landing/index.tsx
Outdated
| {sortedLandingPages.length > 0 && ( | ||
| <Table | ||
| bordered | ||
| striped | ||
| className={`usa-table--borderless ${styles.table}`}> | ||
| <tbody> | ||
| {sortedLandingPages.map((landingPage: LandingPage) => { | ||
| return ( | ||
| <li key={`landing_page_` + landingPage.slug}> | ||
| <Link href={`/landing/${landingPage.slug}`}> | ||
| {landingPage.pageTitle} | ||
| </Link> | ||
| </li> | ||
| <tr key={`landing_page_` + landingPage.slug}> | ||
| <td> | ||
| <Link href={`/landing/${landingPage.slug}`}> | ||
| {landingPage.pageTitle} | ||
| </Link> | ||
| </td> | ||
| </tr> | ||
| ) | ||
| })} | ||
| </ul> | ||
| </Grid> | ||
| </div> | ||
| </tbody> | ||
| </Table> | ||
| )} |
There was a problem hiding this comment.
Suggestion: Add a storybook story for this. I think you will need to pull the table out into a component for that since I don't think we add pages there. However, if we do have pages in storybook that works too.
There was a problem hiding this comment.
Additionally that might make adding a simple unit test easier and it will be ready for future features. Though that may already be on your list.
SC-2741
Proposed changes
Adds table to the landing page index
Reviewer notes
Setup
Start the system
yarn services:up yarn dev cd ../ussf-portal-cms yarn devLogin to the portal http://localhost:3000
Start storybook
Login to storybook http://localhost:6006, though the command above should open it for you
Code review steps
As the original developer, I have
As a reviewer, I have
Check out our How to review a pull request document.
Screenshots