Skip to content

refactor [CAT-15]: update request button style#6

Merged
little9 merged 1 commit into
sandboxfrom
refactor-cat-15-request-button-update
May 4, 2026
Merged

refactor [CAT-15]: update request button style#6
little9 merged 1 commit into
sandboxfrom
refactor-cat-15-request-button-update

Conversation

@jaredgalanis

Copy link
Copy Markdown
Collaborator

CAT-15: Style item-level request buttons in NDE

The "Request from JH" button under Locations was rendering as plain text — not very clickable-looking. This brings it visually in line with the styled request buttons in
current Catalyst (JHU blue, bold white text, rounded).

Changes

  • Added a rule block in src/assets/css/custom.css targeting nde-location-item-service-button button
  • Solid #0072ce background, white bold text, border-radius: 1em, hover darkens to #002d72
  • Slightly tighter padding than Catalyst (0.5em 1.25em) and white-space: nowrap so the label fits the narrower NDE column without wrapping to two lines

Reference for colors / shape: 01JHU_INST-JHU/css/buttons.css in the legacy primo-customization-package repo.

Notes

  • Used !important on a few properties to override Material's default mat-button styles. Open to a cleaner approach if anyone has one.
  • Selector is the custom element wrapper (nde-location-item-service-button), so it shouldn't bleed onto other Material buttons elsewhere on the page.

Testing

  • Ran npm run start:proxy against the JHU sandbox env
  • Signed in and loaded the example item from the ticket — button renders styled, single-line, hover state works
  • Spot-checked other pages (search results, account) — no other buttons affected

Closes CAT-15.

Screenshot 2026-04-28 at 11 28 45 AM Screenshot 2026-04-28 at 11 28 52 AM

@little9 little9 merged commit b02cd95 into sandbox May 4, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants