Dividers and padding (#1166)

apps/android/app/src/main/java/chat/simplex/app/views/usersettings/Appearance.kt

@@ -1,6 +1,7 @@
 package chat.simplex.app.views.usersettings
 
 import SectionCustomFooter
+import SectionDivider
 import SectionItemViewSpaceBetween
 import SectionSpacer
 import SectionView
@@ -117,8 +118,7 @@ fun AppearanceView() {
       SectionItemViewSpaceBetween(showThemeSelector) {
         Text(generalGetString(R.string.theme))
       }
-      Spacer(Modifier.padding(horizontal = 4.dp))
-
+      SectionDivider()
       SectionItemViewSpaceBetween({ editPrimaryColor(currentTheme.first.primary) }) {
         val title = generalGetString(R.string.color_primary)
         Text(title)

apps/android/app/src/main/java/chat/simplex/app/views/usersettings/NotificationsSettingsView.kt

@@ -1,5 +1,6 @@
 package chat.simplex.app.views.usersettings
 
+import SectionDivider
 import SectionItemViewSpaceBetween
 import SectionView
 import SectionViewSelectable
@@ -112,7 +113,7 @@ fun NotificationsSettingsLayout(
           color = HighOrLowlight
         )
       }
-      Spacer(Modifier.padding(horizontal = 4.dp))
+      SectionDivider()
       SectionItemViewSpaceBetween({ showPage(CurrentPage.NOTIFICATION_PREVIEW_MODE) }) {
         Text(stringResource(R.string.settings_notification_preview_mode_title))
         Spacer(Modifier.padding(horizontal = 10.dp))

apps/android/app/src/main/java/chat/simplex/app/views/usersettings/RTCServers.kt

@@ -97,92 +97,95 @@ fun RTCServersLayout(
   saveRTCServers: () -> Unit,
   editOn: () -> Unit,
 ) {
-  Column(
-    Modifier
-      .fillMaxWidth()
-      .padding(horizontal = DEFAULT_PADDING),
-  ) {
-    AppBarTitle(stringResource(R.string.your_ICE_servers), false)
-    SectionItemViewSpaceBetween(padding = PaddingValues()) {
-      Text(stringResource(R.string.configure_ICE_servers), Modifier.padding(end = 24.dp))
-      Switch(
-        checked = isUserRTCServers,
-        onCheckedChange = isUserRTCServersOnOff,
-        colors = SwitchDefaults.colors(
-          checkedThumbColor = MaterialTheme.colors.primary,
-          uncheckedThumbColor = HighOrLowlight
-        ),
-      )
-    }
+  Column {
+    AppBarTitle(stringResource(R.string.your_ICE_servers))
+    Column(
+      Modifier
+        .fillMaxWidth()
+        .padding(horizontal = DEFAULT_PADDING),
+      verticalArrangement = Arrangement.spacedBy(8.dp)
+    ) {
+      SectionItemViewSpaceBetween(padding = PaddingValues()) {
+        Text(stringResource(R.string.configure_ICE_servers), Modifier.padding(end = 24.dp))
+        Switch(
+          checked = isUserRTCServers,
+          onCheckedChange = isUserRTCServersOnOff,
+          colors = SwitchDefaults.colors(
+            checkedThumbColor = MaterialTheme.colors.primary,
+            uncheckedThumbColor = HighOrLowlight
+          ),
+        )
+      }
 
-    if (!isUserRTCServers) {
-      Text(stringResource(R.string.using_simplex_chat_servers), lineHeight = 22.sp)
-    } else {
-      Text(stringResource(R.string.enter_one_ICE_server_per_line))
-      if (editRTCServers) {
-        TextEditor(Modifier.height(160.dp), text = userRTCServersStr)
+      if (!isUserRTCServers) {
+        Text(stringResource(R.string.using_simplex_chat_servers), lineHeight = 22.sp)
+      } else {
+        Text(stringResource(R.string.enter_one_ICE_server_per_line))
+        if (editRTCServers) {
+          TextEditor(Modifier.height(160.dp), text = userRTCServersStr)
 
-        Row(
-          Modifier.fillMaxWidth(),
-          horizontalArrangement = Arrangement.SpaceBetween,
-          verticalAlignment = Alignment.CenterVertically
-        ) {
-          Column(horizontalAlignment = Alignment.Start) {
-            Row {
+          Row(
+            Modifier.fillMaxWidth(),
+            horizontalArrangement = Arrangement.SpaceBetween,
+            verticalAlignment = Alignment.CenterVertically
+          ) {
+            Column(horizontalAlignment = Alignment.Start) {
+              Row {
+                Text(
+                  stringResource(R.string.cancel_verb),
+                  color = MaterialTheme.colors.primary,
+                  modifier = Modifier
+                    .clickable(onClick = cancelEdit)
+                )
+                Spacer(Modifier.padding(horizontal = 8.dp))
+                Text(
+                  stringResource(R.string.save_servers_button),
+                  color = MaterialTheme.colors.primary,
+                  modifier = Modifier.clickable(onClick = {
+                    saveRTCServers()
+                  })
+                )
+              }
+            }
+            Column(horizontalAlignment = Alignment.End) {
+              howToButton()
+            }
+          }
+        } else {
+          Surface(
+            modifier = Modifier
+              .height(160.dp)
+              .fillMaxWidth(),
+            shape = RoundedCornerShape(10.dp),
+            border = BorderStroke(1.dp, MaterialTheme.colors.secondary)
+          ) {
+            SelectionContainer(
+              Modifier.verticalScroll(rememberScrollState())
+            ) {
               Text(
-                stringResource(R.string.cancel_verb),
-                color = MaterialTheme.colors.primary,
-                modifier = Modifier
-                  .clickable(onClick = cancelEdit)
-              )
-              Spacer(Modifier.padding(horizontal = 8.dp))
-              Text(
-                stringResource(R.string.save_servers_button),
-                color = MaterialTheme.colors.primary,
-                modifier = Modifier.clickable(onClick = {
-                  saveRTCServers()
-                })
+                userRTCServersStr.value,
+                Modifier
+                  .padding(vertical = 5.dp, horizontal = 7.dp),
+                style = TextStyle(fontFamily = FontFamily.Monospace, fontSize = 14.sp),
               )
             }
           }
-          Column(horizontalAlignment = Alignment.End) {
-            howToButton()
-          }
-        }
-      } else {
-        Surface(
-          modifier = Modifier
-            .height(160.dp)
-            .fillMaxWidth(),
-          shape = RoundedCornerShape(10.dp),
-          border = BorderStroke(1.dp, MaterialTheme.colors.secondary)
-        ) {
-          SelectionContainer(
-            Modifier.verticalScroll(rememberScrollState())
+          Row(
+            Modifier.fillMaxWidth(),
+            horizontalArrangement = Arrangement.SpaceBetween,
+            verticalAlignment = Alignment.CenterVertically
           ) {
-            Text(
-              userRTCServersStr.value,
-              Modifier
-                .padding(vertical = 5.dp, horizontal = 7.dp),
-              style = TextStyle(fontFamily = FontFamily.Monospace, fontSize = 14.sp),
-            )
-          }
-        }
-        Row(
-          Modifier.fillMaxWidth(),
-          horizontalArrangement = Arrangement.SpaceBetween,
-          verticalAlignment = Alignment.CenterVertically
-        ) {
-          Column(horizontalAlignment = Alignment.Start) {
-            Text(
-              stringResource(R.string.edit_verb),
-              color = MaterialTheme.colors.primary,
-              modifier = Modifier
-                .clickable(onClick = editOn)
-            )
-          }
-          Column(horizontalAlignment = Alignment.End) {
-            howToButton()
+            Column(horizontalAlignment = Alignment.Start) {
+              Text(
+                stringResource(R.string.edit_verb),
+                color = MaterialTheme.colors.primary,
+                modifier = Modifier
+                  .clickable(onClick = editOn)
+              )
+            }
+            Column(horizontalAlignment = Alignment.End) {
+              howToButton()
+            }
           }
         }
       }

apps/android/app/src/main/java/chat/simplex/app/views/usersettings/SMPServers.kt

@@ -97,93 +97,96 @@ fun SMPServersLayout(
   saveSMPServers: (List<String>) -> Unit,
   editOn: () -> Unit,
 ) {
-  Column(
-    Modifier
-      .fillMaxWidth()
-      .padding(horizontal = DEFAULT_PADDING),
-  ) {
-    AppBarTitle(stringResource(R.string.your_SMP_servers), false)
-    SectionItemViewSpaceBetween(padding = PaddingValues()) {
-      Text(stringResource(R.string.configure_SMP_servers), Modifier.padding(end = 24.dp))
-      Switch(
-        checked = isUserSMPServers,
-        onCheckedChange = isUserSMPServersOnOff,
-        colors = SwitchDefaults.colors(
-          checkedThumbColor = MaterialTheme.colors.primary,
-          uncheckedThumbColor = HighOrLowlight
-        ),
-      )
-    }
+  Column {
+    AppBarTitle(stringResource(R.string.your_SMP_servers))
+    Column(
+      Modifier
+        .fillMaxWidth()
+        .padding(horizontal = DEFAULT_PADDING),
+      verticalArrangement = Arrangement.spacedBy(8.dp)
+    ) {
+      SectionItemViewSpaceBetween(padding = PaddingValues()) {
+        Text(stringResource(R.string.configure_SMP_servers), Modifier.padding(end = 24.dp))
+        Switch(
+          checked = isUserSMPServers,
+          onCheckedChange = isUserSMPServersOnOff,
+          colors = SwitchDefaults.colors(
+            checkedThumbColor = MaterialTheme.colors.primary,
+            uncheckedThumbColor = HighOrLowlight
+          ),
+        )
+      }
 
-    if (!isUserSMPServers) {
-      Text(stringResource(R.string.using_simplex_chat_servers), lineHeight = 22.sp)
-    } else {
-      Text(stringResource(R.string.enter_one_SMP_server_per_line))
-      if (editSMPServers) {
-        TextEditor(Modifier.height(160.dp), text = userSMPServersStr)
+      if (!isUserSMPServers) {
+        Text(stringResource(R.string.using_simplex_chat_servers), lineHeight = 22.sp)
+      } else {
+        Text(stringResource(R.string.enter_one_SMP_server_per_line))
+        if (editSMPServers) {
+          TextEditor(Modifier.height(160.dp), text = userSMPServersStr)
 
-        Row(
-          Modifier.fillMaxWidth(),
-          horizontalArrangement = Arrangement.SpaceBetween,
-          verticalAlignment = Alignment.CenterVertically
-        ) {
-          Column(horizontalAlignment = Alignment.Start) {
-            Row {
+          Row(
+            Modifier.fillMaxWidth(),
+            horizontalArrangement = Arrangement.SpaceBetween,
+            verticalAlignment = Alignment.CenterVertically
+          ) {
+            Column(horizontalAlignment = Alignment.Start) {
+              Row {
+                Text(
+                  stringResource(R.string.cancel_verb),
+                  color = MaterialTheme.colors.primary,
+                  modifier = Modifier
+                    .clickable(onClick = cancelEdit)
+                )
+                Spacer(Modifier.padding(horizontal = 8.dp))
+                Text(
+                  stringResource(R.string.save_servers_button),
+                  color = MaterialTheme.colors.primary,
+                  modifier = Modifier.clickable(onClick = {
+                    val servers = userSMPServersStr.value.split("\n")
+                    saveSMPServers(servers)
+                  })
+                )
+              }
+            }
+            Column(horizontalAlignment = Alignment.End) {
+              howToButton()
+            }
+          }
+        } else {
+          Surface(
+            modifier = Modifier
+              .height(160.dp)
+              .fillMaxWidth(),
+            shape = RoundedCornerShape(10.dp),
+            border = BorderStroke(1.dp, MaterialTheme.colors.secondary)
+          ) {
+            SelectionContainer(
+              Modifier.verticalScroll(rememberScrollState())
+            ) {
               Text(
-                stringResource(R.string.cancel_verb),
-                color = MaterialTheme.colors.primary,
-                modifier = Modifier
-                  .clickable(onClick = cancelEdit)
-              )
-              Spacer(Modifier.padding(horizontal = 8.dp))
-              Text(
-                stringResource(R.string.save_servers_button),
-                color = MaterialTheme.colors.primary,
-                modifier = Modifier.clickable(onClick = {
-                  val servers = userSMPServersStr.value.split("\n")
-                  saveSMPServers(servers)
-                })
+                userSMPServersStr.value,
+                Modifier
+                  .padding(vertical = 5.dp, horizontal = 7.dp),
+                style = TextStyle(fontFamily = FontFamily.Monospace, fontSize = 14.sp),
               )
             }
           }
-          Column(horizontalAlignment = Alignment.End) {
-            howToButton()
-          }
-        }
-      } else {
-        Surface(
-          modifier = Modifier
-            .height(160.dp)
-            .fillMaxWidth(),
-          shape = RoundedCornerShape(10.dp),
-          border = BorderStroke(1.dp, MaterialTheme.colors.secondary)
-        ) {
-          SelectionContainer(
-            Modifier.verticalScroll(rememberScrollState())
+          Row(
+            Modifier.fillMaxWidth(),
+            horizontalArrangement = Arrangement.SpaceBetween,
+            verticalAlignment = Alignment.CenterVertically
           ) {
-            Text(
-              userSMPServersStr.value,
-              Modifier
-                .padding(vertical = 5.dp, horizontal = 7.dp),
-              style = TextStyle(fontFamily = FontFamily.Monospace, fontSize = 14.sp),
-            )
-          }
-        }
-        Row(
-          Modifier.fillMaxWidth(),
-          horizontalArrangement = Arrangement.SpaceBetween,
-          verticalAlignment = Alignment.CenterVertically
-        ) {
-          Column(horizontalAlignment = Alignment.Start) {
-            Text(
-              stringResource(R.string.edit_verb),
-              color = MaterialTheme.colors.primary,
-              modifier = Modifier
-                .clickable(onClick = editOn)
-            )
-          }
-          Column(horizontalAlignment = Alignment.End) {
-            howToButton()
+            Column(horizontalAlignment = Alignment.Start) {
+              Text(
+                stringResource(R.string.edit_verb),
+                color = MaterialTheme.colors.primary,
+                modifier = Modifier
+                  .clickable(onClick = editOn)
+              )
+            }
+            Column(horizontalAlignment = Alignment.End) {
+              howToButton()
+            }
           }
         }
       }