feat: Emoji-Picker Button im Chat-Input (rechts neben Senden)

- #emojiBtn links neben #send platziert
- Fluent Emoji 3D Rendering via parseFluentEmojis()
- Kein Tooltip auf den Emoji-Buttons
- Picker öffnet sich rechts-ausgerichtet über dem Button
- emoji.userdata.js geladen (Kategorien + Mappings)
- Schließt beim Klick außerhalb oder beim destroy()
This commit is contained in:
Meleki committed 2026-03-03 16:18:00 +01:00
1 parent cdd3414771
commit 2673aecc5b
4 files changed
+163

No files matched your search

+51
View File
@@ -318,6 +318,57 @@
color: var(--dangerous);
}
/* Emoji Picker */
.emoji-picker {
position: fixed;
z-index: 500;
background: var(--f2-bg);
border: var(--border-width) solid var(--f2-border);
border-radius: var(--border-radius);
width: 280px;
max-height: 320px;
overflow-y: auto;
padding: var(--badge-spacing);
display: flex;
flex-direction: column;
gap: var(--box-spacing);
box-shadow: 0 4px 16px rgb(0 0 0 / 0.2);
}
.emoji-picker-section {
display: flex;
flex-direction: column;
gap: var(--badge-spacing);
}
.emoji-picker-label {
font-size: var(--font-size);
opacity: var(--semi-transparent);
padding: 0 .2em;
}
.emoji-picker-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(2.6em, 1fr));
}
.emoji-picker-btn {
background: none;
border: none;
padding: .2em .25em;
font-size: 1.3rem;
line-height: 1;
cursor: pointer;
border-radius: var(--border-radius);
transition: background var(--transition-duration);
}
.emoji-picker-btn:hover {
background: var(--f3-bg);
border: none;
}
.stop-btn:hover {
background: rgb(from var(--dangerous) r g b / 0.15);
}