chore: Chat permissions page follow up

assets/l10n/intl_en.arb

@@ -2739,5 +2739,6 @@
   "changeTheVisibilityOfChatHistory": "Change the visibility of the chat history",
   "changeTheCanonicalRoomAlias": "Change the main public chat address",
   "sendRoomNotifications": "Send a @room notifications",
-  "changeTheDescriptionOfTheGroup": "Change the description of the chat"
+  "changeTheDescriptionOfTheGroup": "Change the description of the chat",
+  "chatPermissionsDescription": "Define which power level is necessary for certain actions in this chat. The power levels 0, 50 and 100 are usually representing users, moderators and admins, but any gradation is possible."
 }

lib/pages/chat_permissions_settings/chat_permissions_settings_view.dart

@@ -41,6 +41,22 @@ class ChatPermissionsSettingsView extends StatelessWidget {
             )..removeWhere((k, v) => v is! int);
             return Column(
               children: [
+                ListTile(
+                  leading: const Icon(Icons.info_outlined),
+                  subtitle: Text(
+                    L10n.of(context)!.chatPermissionsDescription,
+                  ),
+                ),
+                Divider(color: Theme.of(context).dividerColor),
+                ListTile(
+                  title: Text(
+                    L10n.of(context)!.chatPermissions,
+                    style: TextStyle(
+                      color: Theme.of(context).colorScheme.primary,
+                      fontWeight: FontWeight.bold,
+                    ),
+                  ),
+                ),
                 Column(
                   mainAxisSize: MainAxisSize.min,
                   children: [

lib/pages/chat_permissions_settings/permission_list_tile.dart

@@ -82,11 +82,8 @@ class PermissionsListTile extends StatelessWidget {
         style: Theme.of(context).textTheme.titleSmall,
       ),
       trailing: Material(
-        color: color.withAlpha(64),
-        shape: RoundedRectangleBorder(
-          borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
-          side: BorderSide(color: color),
-        ),
+        color: color.withAlpha(32),
+        borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
         child: DropdownButton<int>(
           padding: const EdgeInsets.symmetric(horizontal: 8.0),
           borderRadius: BorderRadius.circular(AppConfig.borderRadius / 2),
@@ -96,15 +93,24 @@ class PermissionsListTile extends StatelessWidget {
           items: [
             DropdownMenuItem(
               value: permission < 50 ? permission : 0,
-              child: Text(L10n.of(context)!.userLevel(permission)),
+              child: Text(
+                L10n.of(context)!.userLevel(permission < 50 ? permission : 0),
+              ),
             ),
             DropdownMenuItem(
               value: permission < 100 && permission >= 50 ? permission : 50,
-              child: Text(L10n.of(context)!.moderatorLevel(permission)),
+              child: Text(
+                L10n.of(context)!.moderatorLevel(
+                  permission < 100 && permission >= 50 ? permission : 50,
+                ),
+              ),
             ),
             DropdownMenuItem(
               value: permission >= 100 ? permission : 100,
-              child: Text(L10n.of(context)!.adminLevel(permission)),
+              child: Text(
+                L10n.of(context)!
+                    .adminLevel(permission >= 100 ? permission : 100),
+              ),
             ),
             DropdownMenuItem(
               value: null,