payloadcms / website Goto Github PK

Slight CSS refinements need to be made to both of the components so they more closely align with the mockups, namely:

• Background texture pattern (see image below)
• Custom rich text bullets (see image below)
• Adjustments to background color (see mockups)
• Leader text above the form (see image below)

• Build out main menu header
• Integrate new grid/gutter layout

Need to support the container flag on this block.

See mockups

Right now they are all placeholders. They need to reflect the live website. All links need to be custom.

Data is all built out and already fetched on frontend for this block.

The only tricky part might be to render it on either a light or dark background. In the dark mode, you need to use <ThemeProvider theme="dark"> and then manually apply the dark background color (var(--theme-bg)).

One reusable component Banner to be re-used inside the BannerBlock, which will also be used in the docs and possibly elsewhere.

Styles are stubbed out in /css/docsearch.scss but they need some work.

• Reduce the vertical padding of each hover highlight
• Make the media hover about 200px to the right of the cursor, not directly on it
• Need to reduce the space between the row indices and headings. Either center in the available open space, position: absolute and hug it closer to heading, or break the entire component away from the grid and just use display: flex with appropriate spacing / sizing
• Animate the intro / outro of the hovered media. Maybe a subtle transform: scale and opacity
• If you load the site, and don't move your mouse at all, and scroll down the page, MouseInfoProvider will not have initialized and the images will appear in the top left corner

This should include form context (Form) and all fields (Text, etc), but does the FormBlock component. For that, see this ticket.

Importantly, fields should be able to be used outside of the form context.

Cross your fingers that it works with the /app folder

• Build out the footer in its entirety
• Integrate with new grid layout

And offset the scroll by the header height to ensure that going straight to a hash still shows the heading accordingly

• Make sure it looks good in both light and dark mode
• Build in an animation when the text enters the viewport

Add typeface plumbing

I believe it may redirect to a "thank you" page or similar. Double-check how it works on the live site and ensure that we have everything replicated accordingly.

Right now, ⌘ is hardcoded. It should be different on Windows / Linux / etc.

This should be a layout building block that adapts data from the Form Builder plugin into the Form component.

Make sure that it works for all routes, i.e. pages, use cases, blog, docs, etc.

https://beta.nextjs.org/docs/api-reference/file-conventions/not-found

On touch devices there is no hover. We need to remove any hover effects so that hover animations don't block anchor links.

Configure lint tools for consistency

And then force it to render a larger font, with fewer quotes on the screen at once. More padding, larger in size overall.

• [] Open an API route to securely handle regeration requests using the secret key
• [] Fire NextJS revalidate method with the given URL

Related to this issue

We need to setup NextJS preview mode so that editors can make changes without going immediately live. Here's a brief step-by-step of this process:

• Open preview API route and set preview mode
• Handle preview mode in getStaticProps
• Install payload-admin-bar
• Handle preview exit

This will avoid mobile users from needing to double click.

Could use ~10 min or so revalidate window

Just noting this so we can account for it