make system message items smaller in size and end-align the timestamp

Signed-off-by: Andy Scherzinger <info@andy-scherzinger.de>

app/src/main/java/com/nextcloud/talk/adapters/messages/MagicSystemMessageViewHolder.java

@@ -26,6 +26,7 @@ import android.graphics.drawable.Drawable;
 import android.text.Spannable;
 import android.text.SpannableString;
 import android.view.View;
+import android.view.ViewGroup;
 
 import com.nextcloud.talk.R;
 import com.nextcloud.talk.application.NextcloudTalkApplication;
@@ -52,9 +53,12 @@ public class MagicSystemMessageViewHolder extends MessageHolders.IncomingTextMes
     @Inject
     Context context;
 
+    protected ViewGroup background;
+
     public MagicSystemMessageViewHolder(View itemView) {
         super(itemView);
         NextcloudTalkApplication.Companion.getSharedApplication().getComponentApplication().inject(this);
+        background = itemView.findViewById(R.id.container);
     }
 
     @Override
@@ -62,17 +66,17 @@ public class MagicSystemMessageViewHolder extends MessageHolders.IncomingTextMes
         super.onBind(message);
 
         Resources resources = itemView.getResources();
-        int normalColor = resources.getColor(R.color.bg_message_list_incoming_bubble);
         int pressedColor;
         int mentionColor;
 
-        pressedColor = normalColor;
+        pressedColor = resources.getColor(R.color.bg_message_list_incoming_bubble);
         mentionColor = resources.getColor(R.color.textColorMaxContrast);
 
-        Drawable bubbleDrawable = DisplayUtils.getMessageSelector(normalColor,
-                                                                  resources.getColor(R.color.transparent), pressedColor,
+        Drawable bubbleDrawable = DisplayUtils.getMessageSelector(resources.getColor(R.color.transparent),
+                                                                  resources.getColor(R.color.transparent),
+                                                                  pressedColor,
                                                                   R.drawable.shape_grouped_incoming_message);
-        ViewCompat.setBackground(bubble, bubbleDrawable);
+        ViewCompat.setBackground(background, bubbleDrawable);
 
         Spannable messageString = new SpannableString(message.getText());
 

app/src/main/res/layout/item_system_message.xml

@@ -1,7 +1,9 @@
 <?xml version="1.0" encoding="utf-8"?><!--
   ~ Nextcloud Talk application
   ~
+  ~ @author Andy Scherzinger
   ~ @author Mario Danic
+  ~ Copyright (C) 2022 Andy Scherzinger <info@andy-scherzinger.de>
   ~ Copyright (C) 2017-2018 Mario Danic <mario@lovelyhq.com>
   ~
   ~ This program is free software: you can redistribute it and/or modify
@@ -19,21 +21,22 @@
   -->
 
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
-    xmlns:tools="http://schemas.android.com/tools"
-    xmlns:app="http://schemas.android.com/apk/res-auto"
-    android:layout_marginStart="16dp"
-    android:layout_marginTop="8dp"
-    android:layout_marginEnd="16dp"
-    android:layout_marginBottom="8dp">
+    android:layout_marginStart="@dimen/standard_margin"
+    android:layout_marginTop="@dimen/standard_eighth_margin"
+    android:layout_marginEnd="@dimen/standard_margin"
+    android:layout_marginBottom="@dimen/standard_eighth_margin">
 
     <com.google.android.flexbox.FlexboxLayout
-        android:id="@id/bubble"
+        android:id="@id/container"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:orientation="vertical"
         android:layout_centerHorizontal="true"
+        android:orientation="vertical"
+        android:padding="@dimen/standard_half_padding"
         app:alignContent="stretch"
         app:alignItems="stretch"
         app:flexWrap="wrap"
@@ -46,23 +49,27 @@
             android:layout_centerHorizontal="true"
             android:gravity="center_horizontal"
             android:textAlignment="center"
-            tools:text="System message"
+            android:layout_marginEnd="@dimen/standard_margin"
+            android:layout_marginStart="@dimen/standard_margin"
             android:textColor="@color/textColorMaxContrast"
             android:textSize="14sp"
             app:layout_alignSelf="flex_start"
             app:layout_flexGrow="1"
-            app:layout_wrapBefore="true"/>
+            app:layout_wrapBefore="true"
+            tools:text="System message" />
 
         <TextView
             android:id="@id/messageTime"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
+            android:layout_marginStart="@dimen/standard_half_margin"
+            android:layout_marginEnd="@dimen/standard_margin"
+            android:gravity="end"
             android:textColor="@color/warm_grey_four"
             android:textSize="12sp"
-            tools:text="17:30"
-            android:layout_marginStart="8dp"
             app:layout_alignSelf="center"
             app:layout_flexGrow="1"
-            app:layout_wrapBefore="false"/>
+            app:layout_wrapBefore="false"
+            tools:text="17:30" />
     </com.google.android.flexbox.FlexboxLayout>
 </RelativeLayout>

app/src/main/res/values/dimens.xml

@@ -38,6 +38,7 @@
 
     <dimen name="chat_text_size">14sp</dimen>
     <dimen name="message_bubble_corners_radius">@dimen/dialogBorderRadius</dimen>
+    <dimen name="message_bubble_corners_radius_half">14dp</dimen>
     <dimen name="message_bubble_corners_padding">16dp</dimen>
 
     <dimen name="geocoding_result_text_size">18sp</dimen>