(fix) failure icon with avatar

Author: antoine92190

src/lib/Message/Message.scss

@@ -77,6 +77,10 @@
 		border-radius: 50%;
 		background-color: #f44336;
 
+		&.vac-failure-container-avatar {
+			margin-right: 6px;
+		}
+
 		.vac-failure-text {
 			position: absolute;
 			top: 50%;
@@ -235,6 +239,10 @@
 
 		.vac-failure-container {
 			margin-left: 2px;
+
+			&.vac-failure-container-avatar {
+				margin-right: 0;
+			}
 		}
 
 		.vac-offset-current {

src/lib/Message/Message.vue

@@ -174,22 +174,26 @@
 						@send-message-reaction="sendMessageReaction"
 					/>
 				</div>
-				<div
-					v-if="message.avatar && message.senderId === currentUserId"
-					class="vac-avatar vac-avatar-current"
-					:style="{ 'background-image': `url('${message.avatar}')` }"
-				/>
 				<slot name="message-failure" v-bind="{ message }">
 					<div
 						v-if="message.failure && message.senderId === currentUserId"
 						class="vac-failure-container vac-svg-button"
+						:class="{
+							'vac-failure-container-avatar':
+								message.avatar && message.senderId === currentUserId
+						}"
 						@click="$emit('open-failed-message', { message })"
 					>
 						<div class="vac-failure-text">
 							!
 						</div>
 					</div>
 				</slot>
+				<div
+					v-if="message.avatar && message.senderId === currentUserId"
+					class="vac-avatar vac-avatar-current"
+					:style="{ 'background-image': `url('${message.avatar}')` }"
+				/>
 			</slot>
 		</div>
 	</div>