FE-472: fix type header appearance

[alex-e-leon]

🌟 What is the purpose of this PR?

Fixes issues with layout in entity-header and introduces panda-css to hash-frontend so that ds-components can be loaded in. A couple of notes:

• I'm not across the hash-frontend CI, so while it looks good to me, might be worth double checking that the panda-css step works properly for prod builds as well as dev.
• The layout strategy could be much improved for headers, drawers + pages IMO, but in order to fix the issue without blowing up the scope + to keep the changeset minimal I've just made some manual adjustments to padding in some cases instead of completely fixing the layout strategy, and applied some of second-choice strategies for handling large content: in particular in retrospect I'd probably keep the link icon aligned + right buttons aligned top, possibly even float the title, and consider breaking long words instead of ellipsifying them - but I think the approach is good enough for a first pass.
• I also have no idea why the mui-button drops its padding when under stress. Fixed
• I also fixed up an issue where the breadcrumb menu was sitting underneath the close button.

• And finally here's a screenshot of how it looks with extreme content now:

Pre-Merge Checklist 🚀

🚢 Has this modified a publishable library?

This PR:

• does not modify any publishable blocks or libraries, or modifications do not need publishing

📜 Does this require a change to the docs?

The changes in this PR:

• are internal and do not require a docs change

[cursor]

PR Summary

Medium Risk
Introduces a new build/codegen step (Panda cssgen) that prod CI must run; global CSS is loaded app-wide though ds theme is scoped to .hash-ds-root.

Overview
Entity type header and slide UX are tightened so long titles and crowded headers behave better: the title uses ellipsis and minWidth/flex so the Extend button does not collapse; the slide “open in new tab” control moves from absolute positioning to inline TextMark from @hashintel/ds-components; plural fields always stack in a column; and MUI h1 line height is bumped to 1.2.

Slide stack changes hide the top context bar action menu in slides, fix breadcrumb hrefs for link vs entity types, nudge bar spacing so breadcrumbs sit below the back/forward/close controls, and drop an extra zIndex on that bar.

Panda CSS is wired into hash-frontend: new panda.config.ts (scoped to .hash-ds-root), @pandacss/dev, panda cssgen in codegen, generated CSS imported in _app.page.tsx, plus ESLint/tsconfig exclusions for the config file. TextMark is re-exported from @hashintel/ds-components for app use.

^{Reviewed by Cursor Bugbot for commit ea16fbb. Bugbot is set up for automated code reviews on this repo. Configure here.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
hash	Ready	Preview, Comment	Jun 15, 2026 10:16am

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
hashdotdesign-tokens	Ignored	Preview	Jun 15, 2026 10:16am
petrinaut	Skipped		Jun 15, 2026 10:16am

[CiaranMn]

Definitely an improvement! One comment on the diff and a couple of styling things that we'd ideally fix while touching this:

1. Title text can be cut off (due to line height probably and no overflow?) – see the 'g' below
2. Needs some margin with the description

3. For non link types where the plural title spans multiple rows, 'plural' looks a bit close to the actual plural title... maybe we should just use the layout for link types (above) always, i.e. just stack 'plural' and the plural title vertically rather than putting on the same horizontal row

[alex-e-leon]

Definitely an improvement! One comment on the diff and a couple of styling things that we'd ideally fix while touching this:

Sure thing, I'll fix these up. How is is that the base line-height is so bad : (

[vilkinsons]

Can we make sure the vertical ellipsis icon/breadcrumbs always sit on the same row as the close button when the latter is present? I thought we'd fixed this prior.

[alex-e-leon]

@CiaranMn I've fixed up the other issues you mentioned - let me know if there's anything else. Also left a few comments where I made some choices with non-local impacts. LMK your thoughts on those before I apply them.

[CiaranMn]

One outstanding issue, which is that the context menu can overlap the back/forward/close bar. I mentioned before that we could potentially just hide the context menu dots when in a slide. Otherwise its right offset will need to vary based upon which additional buttons are visible (back, forward, close)

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 0345dc2. Configure here.}

[alex-e-leon]

One outstanding issue, which is that the context menu can overlap the back/forward/close bar. I mentioned before that we could potentially just hide the context menu dots when in a slide. Otherwise its right offset will need to vary based upon which additional buttons are visible (back, forward, close)

Ok fixed in the last commit.