guardian / typerighter

Even if you’re the right typer, couldn’t hurt to use Typerighter!
Apache License 2.0
276 stars 12 forks source link

Add basic page layout with EUI #277

Closed jonathonherbert closed 1 year ago

jonathonherbert commented 1 year ago

What does this change?

Adds a basic page layout with EUI. Behold:

Screenshot 2023-03-20 at 17 31 47

Dev notes

Behold, but less triumphantly (this is a production build running in CODE):

Screenshot 2023-03-20 at 17 59 44

... that'll be the next PR 😅. Other tools that use EUI in production come in at about 500kb, so this is likely a problem with our build. Build times are also appalling – I suspect a move to Vite may kill both birds with one stone.

Other notes: I've added a basic CSS reset, taking a few things from here. There's also a CSS override to ensure that our headings are Guardian-specific. I thought this was more elegant than custom heading components for each heading level, but we could move this to heading components if others felt strongly.

How to test

Run locally, or in CODE, remembering to run npm i within rule-manager-client to refresh dependencies – @guardian/source is out, @elastic/eui is in.

jonathonherbert commented 1 year ago

That's right, https://github.com/elastic/eui/issues/6182 is tracking that issue. The list of issues is small, so hopefully it's not too far off!