fixup! fix(NcEmojiPicker): adjust styles to correctly fit emojis

nextcloud-libraries · Jan 28, 2025 · d74cbc1 · d74cbc1
1 parent 8e67b66
commit d74cbc1
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/src/components/NcEmojiPicker/NcEmojiPicker.vue b/src/components/NcEmojiPicker/NcEmojiPicker.vue
@@ -476,6 +476,10 @@ export default {
 		height: var(--clickable-area-small);
 		min-width: var(--clickable-area-small);
 
+		&:hover {
+			background-color: var(--color-background-hover);
+		}
+
 		&:focus-visible {
 			outline: 2px solid var(--color-primary-element) !important;
 			outline-offset: -2px;
@@ -505,11 +509,13 @@ export default {
 		}
 	}
 
-	.emoji-mart-category-label {
+	/* Label element in the section grid */
+	div.emoji-mart-category-label {
 		grid-column: span 8;
 		justify-self: stretch;
 	}
 
+	/* An actual heading inside the element */
 	h3.emoji-mart-category-label  {
 		display: flex;
 		align-items: center;
@@ -534,6 +540,7 @@ export default {
 			background-color: var(--color-background-hover) !important;
 			border: none;
 			border-radius: var(--border-radius-element, var(--border-radius-pill));
+			box-shadow: none !important;
 			outline: 2px solid var(--color-primary-element) !important;
 			outline-offset: -2px;
 		}