Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UI/UX Glossary linking enhancement #1737

Closed
wackerow opened this issue Nov 3, 2020 · 5 comments
Closed

UI/UX Glossary linking enhancement #1737

wackerow opened this issue Nov 3, 2020 · 5 comments
Labels
feature ✨ This is enhancing something existing or creating something new

Comments

@wackerow
Copy link
Member

wackerow commented Nov 3, 2020

Is your feature request related to a problem? Please describe.
Suggested by @ryancreatescopy -- This is a continuation of #1724 with goal to improve the UI/UX of the links on the glossary page by adding styling to further differentiate between different types of links beneath definitions (internal anchor links, vs links to external pages).

Describe the solution you'd like
image
(pulling in the page title and meta description to populate the content)

Describe alternatives you've considered

  • Leave internal anchor links with default anchor styling (colored, underlined) and 👉 emoji (as implemented in Glossary-to-docs linking [Fixed #1717] #1724)
  • Leave internal anchor links with default anchor styling (colored, underlined) without emoji indicator

Additional context
May wait til other PRs get merged to avoid confusion/conflicts, but will take a look at this.

@wackerow wackerow added the feature ✨ This is enhancing something existing or creating something new label Nov 3, 2020
@wackerow
Copy link
Member Author

wackerow commented Nov 4, 2020

@ryancreatescopy Have a component started to address this, but I may need your help with writing the query to pull in the title and description from the document being linked to.

My thought was to have a component called something like <DocLink> with all the templating and styling. Import into the static.js and MDXProvider. In the glossary .md file, this could then be used in the form of <DocLink to="/en/developers/docs/accounts" />...

..but I'm not quite sure how to then query using that path to get the correct .md document, and parse out the title and description. Using static data I've got a working version, but would obviously prefer to make it dynamically pull in what's needed with a query for many reasons.

Lemme know what you think!

@samajammin
Copy link
Contributor

We might just have to bite the bullet & hardcode the title & description. Gatsby's GraphQL doesn't support dynamic queries (queries with variables) since it runs them on build: https://www.gatsbyjs.com/docs/static-vs-normal-queries/

@samajammin
Copy link
Contributor

(There also may be a clever way of accomplishing this that I just haven't thought of)

@wackerow
Copy link
Member Author

wackerow commented Nov 4, 2020

Okay, well I guess it wasn't just me then hah... I'll parse these out today

@wackerow
Copy link
Member Author

Closed with #1753

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature ✨ This is enhancing something existing or creating something new
Projects
None yet
Development

No branches or pull requests

2 participants