getsentry / sentry-docs

Sentry's documentation (and tools to build it)
https://docs.sentry.io
Other
332 stars 1.46k forks source link

"Coose Your SDK" card items have cursor style inconsistencies #9990

Open Lms24 opened 6 months ago

Lms24 commented 6 months ago

Steps to Reproduce

  1. Go to landing page
  2. Hover over "Choose your SDK" link cards

Expected Result

The cursor becomes a pointer on the entire card

Actual Result

The cursor style is inconsistent (see screenshot):

Additional Info

image

a-hariti commented 6 months ago

This was intentional, the rationale behind it is that platforms with nothing to expand take you directly to the page, others link there when clicking the text, and expand elsewhere

Do you think it would be better to have all links limited to visible text @Lms24 ?

Lms24 commented 6 months ago

I see, I kinda suspected something like this. I dont wanna dwell on this too much but to me it seems weird that there's so much dead space where a click doesn't do anything. If we can somehow solve that I think it'd be great but it doesn't necessarily have to be identical to the simple links

a-hariti commented 6 months ago

The cursor style gives a hint (the hand) when you're about to click on a link, that was the compromise I came up.

The alternative was to not have links on expandable headers and nest the platform link along with its guides, which looks weird

Javascript
  Javascript
  [other guides]
Lms24 commented 6 months ago

random idea (please keep in mind, I'm no UI/UX expert); What if we really split the card?

image

Red: Link to base guide Green: Open dropdown

wdyt?

adinauer commented 6 months ago

Hey, It took me a while to figure out this behaviour of opening the generic "Java" docs via the text. Maybe we could simply add the generic link to the list instead and open the dropdown regardless of where you click?

Edit: Ah that's what you suggested above @a-hariti in https://github.com/getsentry/sentry-docs/issues/9990#issuecomment-2107322187

I think that'd be easier to understand.

a-hariti commented 6 months ago

what about adding an arrow next the platform name to make it obvious that its a link, and add a tooltip to the rest of the card? @Lms24

mydea commented 6 months ago

related to this, imho the arrows here are "wrong" - I would expect, when collapsed, that the arrow is v (down), and when expanded, it is ^? does that make sense?

a-hariti commented 6 months ago

currently it kinda mirrors the standard <details> element @mydea

mydea commented 6 months ago

currently it kinda mirrors the standard <details> element @mydea

Hmm, I see, there it is in front of the text though 🤔 no super strong feeling but overall it feels not 100% right to me (subjectively)

a-hariti commented 6 months ago

I meant in terms of caret direction @mydea

a-hariti commented 5 months ago

wyt @stephanie-anderson ?