Extend with an optional help to visualise specific use cases

[grommas]

Hello Johann

First of all: Thanks for your work – clean, well documented and lots of output. I extended your plugin for a project. Basically I added the possibility of an optional help to visualise specific use cases. The whole section content is inside a table to show label, buttons and use cases side by side. Drop me a word if a pull request sounds interesting for you.

[johannschopplich]

Hi Jakob, thanks for the flowers. Much appreciated.

Sounds like a great addition to the plugin. How did you solve it? Adding an example key to the category field set? Keeping it optional would be ideal. A PR is the way to go, feel free to open one. 🙂

[grommas]

I decided to go with help instead of example. Keeping the keyword generic and logically similar to Kirby’s solution for various fields – even though it’s slightly different, since help is available on each category:

type: punctuation
headline:
  de: Kleine Interpunktionshilfe
  en: Lil Punctuation Helper
fieldsets:
  - category:
    label:
      de: Apostroph
      en: Apostrophe
    help:
      de: "Alex’ Sachen"
      en: "Alex’ things"
    chars:
      - "’"
  - category:
    label:
      de: Gedankenstrich
      en: En Dash
    chars:
      - "–"
  - category:
    label:
      de: Deutsche Anführungszeichen
      en: German Quotation Marks
    help:
      de: "„Das ‚Zitat‘ im Zitat“"
      en: "„The ‚quote‘ inside a quote“"
    chars:
      - "„"
      - "‚"
      - "‘"
      - "“"

Similar to Kirby’s native help we can as well use html e.g. to style it with panel.css:

fieldsets:
  - category:
    label:
      de: Apostroph
      en: Apostrophe
    help:
      de: "<span class="color--600">Alex<span class="color--900">’</span> Sachen</span>"
      en: "<span class="color--600">Alex<span class="color--900">’</span> things</span>"
    chars:
      - "’"

[johannschopplich]

Absolutely! Didn't think of help. Like it a lot. Yes, as native as possible is my approach as well. That's why I re-used the fieldset property.

[grommas]

Just realised that the table is not working well on small screen sizes. Maybe flex or grid. I’ll have a look and make a new pull request. Hope everything was okay with my last request, I’m really not that into a GitHub workflow.

[johannschopplich]

That was my initial thought as well. Feel free to update the PR, no need to create a new one! I think you're doing great with GitHub.

[johannschopplich]

Fixed with the PR https://github.com/johannschopplich/kirby-punctuation-section/pull/2. Thanks!

Released in v2.1.0.

[johannschopplich]

This has to be re-implemented for v3. Preferably with container queries.