Feedback-Button in der Websiter

[deleonio]

Alles klar, ich fasse kurz zusammen, was du möchtest:

• Button rechts oben auf eurer Doku-Website.
• Beim Klick soll ein Popover aufgehen (ähnlich wie im Bild).
• Darin ein kurzer, motivierender Text, passend zum KoliBri Webcomponents-Design.
• Der Link öffnet eine E-Mail an kolibri@itzbund.de, mit vorbereitetem Betreff und Inhalt (Mail-Template).
• feedback-Icon von Codicon verwenden

Ich schlage folgendes für den Text im Popover vor:

Feedback geben

Ihre Meinung zählt! Helfen Sie uns, KoliBri noch besser zu machen.
Mit nur wenigen Klicks senden Sie uns Ihre Ideen, Anmerkungen oder Probleme.

Und der Link wäre dann ein sogenannter mailto-Link, z.B.:

<a href="mailto:kolibri@itzbund.de?subject=Feedback%20zu%20KoliBri-Webcomponents&body=Hallo%20KoliBri-Team,%0A%0Ahier%20ist%20mein%20Feedback%20zur%20Dokumentation%20oder%20den%20Webcomponents:%0A%0A%5BEinfach%20hier%20Ihr%20Feedback%20einfügen%5D%0A%0AVielen%20Dank!">
    Feedback senden
</a>

➡️ Dadurch wird beim Klicken eine E-Mail geöffnet mit:

• Empfänger: kolibri@itzbund.de
• Betreff: Feedback zu KoliBri-Webcomponents
• Body: eine kleine Vorlage, in die man direkt reinschreiben kann.

[deleonio]

Draft:

<!-- Feedback Button + Popover mit KoliBri KolPopoverButton -->

<kol-popover-button label="Feedback" placement="bottom-end" style="position: fixed; top: 1rem; right: 1rem; z-index: 1000;">
  <div style="width: 300px; padding: 1rem;">
    <h3 style="margin-top: 0;">Feedback geben</h3>
    <p style="font-size: 0.9rem;">Ihre Meinung zählt! Helfen Sie uns, KoliBri noch besser zu machen. Mit nur wenigen Klicks senden Sie uns Ihre Ideen, Anmerkungen oder Probleme.</p>
    <a href="mailto:kolibri@itzbund.de?subject=Feedback%20zu%20KoliBri-Webcomponents&body=Hallo%20KoliBri-Team,%0A%0Ahier%20ist%20mein%20Feedback%20zur%20Dokumentation%20oder%20den%20Webcomponents:%0A%0A%5BEinfach%20hier%20Ihr%20Feedback%20einfügen%5D%0A%0AVielen%20Dank!" 
       style="display: inline-block; margin-top: 0.5rem; padding: 0.5rem 1rem; background-color: var(--kolibri-color-primary); color: white; border-radius: 9999px; text-decoration: none;">
      E-Mail senden
    </a>
  </div>
</kol-popover-button>