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

Idea: New Design Markup Elements #521

Open
dasGoogle opened this issue Feb 20, 2024 · 3 comments
Open

Idea: New Design Markup Elements #521

dasGoogle opened this issue Feb 20, 2024 · 3 comments
Labels
enhancement New feature or request question Further information is requested [T] functionality

Comments

@dasGoogle
Copy link
Contributor

An idea that has been floating through my head: We currently do not have many markup elements for making a page look nice. Especially as there are some issues here that try making myHPI more user friendly, this might be a good time to also add a bunch more options for creating content on pages.

These are some of the Ideas I have, but feel free to criticise and add more:

Feature Link

Similar to what you see on social media platforms, this could be useful for displaying (mainly internal) links in a more prominent fashion. In my head, such a button would show the title of the referenced page (in the correct language) and also display the first few lines of the page. It would be nice if these blocks were able to automatically align to a grid if multiple are placed side by side.

Call to Action Button

There sometimes are pages that are mainly there to guide people to another page. In such cases, it is quite annoying that these can only be shown inline with the text.
Having a large primary orange button would greatly improve the UX here.
As a very basic example where something like this would be useful: If we were to write a page about the new Semester Ticket, people mainly need to get to the WebApp where they can download their ticket. This button would be great to do that.

Alerts

This feature exists in GitHub markdown (https://github.com/orgs/community/discussions/16925) and enables highlighting important aspects in a more prominent way than just using emphasis on a text. The FSR and I had a number of occurrences, where we wanted to highlight a main point of a page where other markup elements such as headings had to be misused. This would greatly improve that.

@dasGoogle
Copy link
Contributor Author

Regarding the alerts: The github implementation is criticised for not being compatible with languages other than English. There are some other implementations of this floating around the web, so we could maybe consider those as well. Alternatively, we can of course also translate the relevant elements in myHPI directly and still use English markup as we do with minutes.

@frcroth frcroth added the enhancement New feature or request label Feb 20, 2024
@jeriox
Copy link
Contributor

jeriox commented Jun 3, 2024

Just a quick thought on this: I see two options on how to achieve this.

  • Build it as part of our custom markdown processing. This would probably be quite straightforward to build, as we only need to define a custom markdown syntax and render it to HTML as we please. However, this will make reusability/flexibility of the content a bit harder.
  • Use wagtail features for that. Wagtail knows this concept of "mix of several different components like headings, paragraphs, images etc." as a StreamField with different blocks of content. This would integrate much more nicely into the editor UI (and probably also things like translations, where we already had our fair share of problems). The downside is that the content of one page stops being one blob of markdown, which could make things like diffs/copying content around harder.

@jeriox
Copy link
Contributor

jeriox commented Jun 12, 2024

Additional idea from the FSR: collapsible section, e.g. for FAQs

@jeriox jeriox added question Further information is requested [T] functionality labels Jul 29, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request question Further information is requested [T] functionality
Development

No branches or pull requests

3 participants