Merge pull request #41641 from nextcloud/fix/41269/remove-emoji-status-border

fix(user_status): remove border from emoji picker

apps/user_status/src/components/CustomMessageInput.vue

@@ -22,7 +22,6 @@
 	<div class="custom-input" role="group">
 		<NcEmojiPicker container=".custom-input" @select="setIcon">
 			<NcButton type="tertiary"
-				class="custom-input__emoji-button"
 				:aria-label="t('user_status', 'Emoji for your status message')">
 				<template #icon>
 					{{ visibleIcon }}
@@ -30,11 +29,11 @@
 			</NcButton>
 		</NcEmojiPicker>
 		<div class="custom-input__container">
-			<NcTextField maxlength="80"
+			<NcTextField ref="input"
+				maxlength="80"
 				:disabled="disabled"
-				:placeholder="$t('user_status', 'What is your status?')"
+				:placeholder="t('user_status', 'What is your status?')"
 				:value="message"
-				ref="input"
 				type="text"
 				:label="t('user_status', 'What is your status?')"
 				@input="onChange" />
@@ -45,7 +44,7 @@
 <script>
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 import NcEmojiPicker from '@nextcloud/vue/dist/Components/NcEmojiPicker.js'
-import NcTextField	from '@nextcloud/vue/dist/Components/NcTextField.js'
+import NcTextField from '@nextcloud/vue/dist/Components/NcTextField.js'
 
 export default {
 	name: 'CustomMessageInput',
@@ -74,8 +73,7 @@ export default {
 
 	emits: [
 		'change',
-		'submit',
-		'icon-selected',
+		'select-icon',
 	],
 
 	computed: {
@@ -113,28 +111,12 @@ export default {
 <style lang="scss" scoped>
 .custom-input {
 	display: flex;
+	align-items: flex-end;
+	gap: var(--default-grid-baseline);
 	width: 100%;
 
-	&__emoji-button {
-		min-height: 36px;
-		padding: 0;
-		border: 2px solid var(--color-border-maxcontrast);
-		border-right: none;
-		border-radius: var(--border-radius) 0 0 var(--border-radius);
-
-		&:hover {
-			border-color: var(--color-primary-element);
-		}
-	}
-
 	&__container {
 		width: 100%;
-
-		input {
-			width: 100%;
-			margin: 0;
-			border-radius: 0 var(--border-radius) var(--border-radius) 0;
-		}
 	}
 }
 </style>