Improve sizing of emoji delegate

* Use Kirigami.Units.gridUnit * 2.5 for normal emoji
* Use Kirigami.Units.gridUnit * 3 for custom emoji
* Add small background padding to delegate
* Add rounded hover effect

Signed-off-by: Carl Schwan <carl@carlschwan.eu>
This commit is contained in:
Carl Schwan
2022-12-06 23:40:25 +01:00
parent b5d8acf9de
commit 0fbc1b2121
2 changed files with 8 additions and 2 deletions

View File

@@ -20,7 +20,7 @@ ColumnLayout {
}
}
readonly property int categoryIconSize: 45
readonly property int categoryIconSize: Math.round(Kirigami.Units.gridUnit * 2.5)
readonly property var currentCategory: currentEmojiModel[categories.currentIndex].category
readonly property alias categoryCount: categories.count
@@ -81,7 +81,7 @@ ColumnLayout {
EmojiGrid {
id: emojiGrid
targetIconSize: root.categoryIconSize
targetIconSize: root.currentCategory === EmojiModel.Custom ? Kirigami.Units.gridUnit * 3 : root.categoryIconSize // Custom emojis are bigger
model: searchField.text.length === 0 ? EmojiModel.emojis(root.currentCategory) : (root.includeCustom ? EmojiModel.filterModel(searchField.text, false) : EmojiModel.filterModelNoCustom(searchField.text, false))
Layout.fillWidth: true
Layout.fillHeight: true