Update welcome message

Issue #141.

src/assets/css/chat.scss

@@ -869,7 +869,7 @@ $admin-fg: white;
 }
 
 .created-room-welcome-header {
-    background-color: #e0e0e0;
+    background-color: #f5f5f5;
     border-radius: 25px;
     margin: 20px;
     padding: 20px;
@@ -897,4 +897,4 @@ $admin-fg: white;
             opacity: 0.7;
         }
     }
-}
+}

src/assets/translations/en.json

@@ -63,13 +63,13 @@
     "room_list_rooms": "Rooms"
   },
   "room_welcome": {
-    "welcome": "Welcome!",
-    "info": "Here are a few things to know about your group:",
+    "info": "Welcome! Here are a few things to know about your room:",
     "encrypted": "Messages are end-to-end encrypted.",
     "room_history_is": "Room history is {type}.",
+    "room_history_joined": "People can only see the messages sent after they join.",
     "join_public": "Anyone can join by opening this link: {link}.",
     "join_invite": "Only people you invite can join.",
-    "info_permissions": "You can change 'join permissions' and 'message history' at any time in the group settings.",
+    "info_permissions": "You can change ‘join permissions’ at any time in the room settings.",
     "got_it": "Got it"
   },
   "new_room": {

src/components/CreatedRoomWelcomeHeader.vue

@@ -1,13 +1,6 @@
 <template>
   <div class="created-room-welcome-header">
-    <div class="h4">{{ $t("room_welcome.welcome") }}</div>
-    <div class="mt-2">{{ $t("room_welcome.info") }}</div>
-    <div class="mt-2" v-if="roomIsEncrypted">
-      {{ $t("room_welcome.encrypted") }}
-    </div>
-    <div class="mt-2" v-if="roomHistoryDescription">
-      {{ roomHistoryDescription }}
-    </div>
+    <div>{{ $t("room_welcome.info") }}</div>
     <div class="mt-2" v-if="roomJoinRule == 'public'">
       <i18n path="room_welcome.join_public" tag="span">
         <template v-slot:link>
@@ -19,8 +12,14 @@
       {{ $t("room_welcome.join_invite") }}
     </div>
     <div class="mt-2">{{ $t("room_welcome.info_permissions") }}</div>
+    <div class="mt-2" v-if="roomIsEncrypted">
+      {{ $t("room_welcome.encrypted") }}
+    </div>
+    <div class="mt-2" v-if="roomHistoryDescription">
+      {{ roomHistoryDescription }}
+    </div>
     <div class="text-right">
-      <v-btn text @click.stop="$emit('close')">{{
+      <v-btn text @click.stop="$emit('close')" style="text-transform: none">{{
         $t("room_welcome.got_it")
       }}</v-btn>
     </div>
@@ -50,9 +49,7 @@ export default {
             type: this.$t("message.room_history_invited"),
           });
         case "joined":
-          return this.$t("room_welcome.room_history_is", {
-            type: this.$t("message.room_history_joined"),
-          });
+          return this.$t("room_welcome.room_history_joined");
       }
       return null;
     },