ios: exact alignment and spacing (#7945)

* ios: exact alignment and spacing

* ios: previews of the views changed for alignment and spacing

* ci: iOS references of exact alignment and spacing

* ios: single check and the time under a received emoji keep their places

* ios: deleted text, link strip text, What's new, app version, QR cards and onion hosts keep master's layout; info headers get more space above the avatar; chat row preview with contact requests

* ci: iOS references of the review round and of chat rows with contact requests

* ios: keep master's tags, requests, group icon, footers, compose strips

* ci: iOS references of the views back on master's layout

* ios: the pull request holds only the agreed changes, without previews of reverted ones

* ios: contact request view as on master

apps/ios/Shared/Views/Chat/ChatInfoView.swift

@@ -370,7 +370,8 @@ struct ChatInfoView: View {
         VStack(spacing: 8) {
             let cInfo = chat.chatInfo
             ChatInfoImage(chat: chat, size: 192, color: Color(uiColor: .tertiarySystemFill))
-                .padding(.vertical, 12)
+                .padding(.top, 20)
+                .padding(.bottom, 12)
             // show actual display name, alias can be edited in this view
             let displayName = contact.profile.displayName.trimmingCharacters(in: .whitespacesAndNewlines)
             let fullName = cInfo.fullName.trimmingCharacters(in: .whitespacesAndNewlines)

apps/ios/Shared/Views/Chat/ChatItem/CIChatFeatureView.swift

@@ -100,7 +100,7 @@ struct CIChatFeatureView: View {
                     .foregroundColor(iconColor)
                     .scaleEffect(feature.iconScale)
                     .if(terminal) { $0.frame(height: 0) }
-                chatEventText(chatItem, theme.colors.secondary, ts: ts)
+                chatEventText(chatItem, theme.colors.secondary, ts: terminal ? ts : textSpace + ts)
                     .if(terminal) { $0.modifier(terminalLineBox(UIFont.preferredFont(forTextStyle: .caption1), theme.colors.secondary, theme)) }
             }
             .padding(terminal ? terminalEventPadding : EdgeInsets(top: 4, leading: 6, bottom: 4, trailing: 6))

apps/ios/Shared/Views/Chat/ChatItem/CIGroupInvitationView.swift

@@ -31,7 +31,7 @@ struct CIGroupInvitationView: View {
         let v = ItemWithMeta {
             CIMetaView(chat: chat, chatItem: chatItem, metaColor: theme.colors.secondary, showStatus: false, showEdited: false)
         } content: { inlineMeta in
-            ZStack(alignment: .bottomTrailing) {
+            ZStack(alignment: Alignment(horizontal: .trailing, vertical: .lastTextBaseline)) {
                 ZStack {
                     VStack(alignment: .leading) {
                         groupInfoView(action)

apps/ios/Shared/Views/Chat/ChatItem/DeletedItemView.swift

@@ -20,7 +20,7 @@ struct DeletedItemView: View {
         ItemWithMeta {
             CIMetaView(chat: chat, chatItem: chatItem, metaColor: theme.colors.secondary)
         } content: { inlineMeta in
-            HStack(alignment: .bottom, spacing: 0) {
+            HStack(alignment: .lastTextBaseline, spacing: 0) {
                 Text(chatItem.content.text)
                     .foregroundColor(theme.colors.secondary)
                     .italic()

apps/ios/Shared/Views/Chat/ChatItem/FramedItemView.swift

@@ -48,7 +48,7 @@ struct FramedItemView: View {
                 invertedMaterial: useWhiteMetaColor && !terminal
             )
         } content: { inlineMeta in
-            ZStack(alignment: .bottomTrailing) {
+            ZStack(alignment: metaPlacement.reserved ? Alignment(horizontal: .trailing, vertical: .lastTextBaseline) : .bottomTrailing) {
                 VStack(alignment: .leading, spacing: 0) {
                     if chatItem.isReport {
                         if chatItem.meta.itemDeleted == nil {
@@ -164,9 +164,9 @@ struct FramedItemView: View {
                     .modifier(MessageLastLine())
                     .padding(EdgeInsets(top: terminalEmojiTopGap, leading: chatItemTextPadding, bottom: terminalEmojiBottomGap, trailing: chatItemTextPadding))
             } else {
-                VStack {
+                VStack(spacing: 4) {
                     emojiText(chatItem.content.text)
-                    Text("")
+                    Text("").font(.caption)
                 }
                 .padding(.vertical, 6)
                 .padding(.horizontal, 12)

apps/ios/Shared/Views/Chat/ChatItemView.swift

@@ -129,6 +129,7 @@ struct ChatItemContentView<Content: View>: View {
     @EnvironmentObject var chatModel: ChatModel
     @EnvironmentObject var theme: AppTheme
     @Environment(\.revealed) var revealed: Bool
+    @Environment(\.terminalLayout) private var terminal
     @ObservedObject var chat: Chat
     @ObservedObject var im: ItemsModel
     var chatItem: ChatItem
@@ -197,7 +198,7 @@ struct ChatItemContentView<Content: View>: View {
 
     private func eventItemView() -> some View {
         ChatEventWithMeta(chatItem: chatItem) { ts in
-            CIEventView(eventText: eventItemViewText(theme.colors.secondary, ts))
+            CIEventView(eventText: eventItemViewText(theme.colors.secondary, terminal ? ts : textSpace + ts))
         }
     }
 

apps/ios/Shared/Views/Chat/Group/GroupChatInfoView.swift

@@ -154,8 +154,6 @@ struct GroupChatInfoView: View {
                             if showUserSupportChat {
                                 UserSupportChatNavLink(chat: chat, groupInfo: groupInfo, scrollToItemId: $scrollToItemId)
                             }
-                        } header: {
-                            Text("")
                         }
                     }
 
@@ -314,14 +312,14 @@ struct GroupChatInfoView: View {
     }
 
     private func groupInfoHeader() -> some View {
-        VStack {
+        VStack(spacing: 8) {
             let cInfo = chat.chatInfo
             // show actual display name, alias can be edited in this view
             let displayName = (cInfo.groupInfo?.groupProfile.displayName ?? cInfo.displayName).trimmingCharacters(in: .whitespacesAndNewlines)
             let fullName = cInfo.fullName.trimmingCharacters(in: .whitespacesAndNewlines)
             ChatInfoImage(chat: chat, size: 192, color: Color(uiColor: .tertiarySystemFill))
-                .padding(.top, 12)
-                .padding()
+                .padding(.top, 20)
+                .padding(.bottom, 12)
             Text(displayName)
                 .font(.largeTitle)
                 .multilineTextAlignment(.center)

apps/ios/Shared/Views/Chat/Group/GroupMemberInfoView.swift

@@ -515,10 +515,10 @@ struct GroupMemberInfoView: View {
     }
 
     private func groupMemberInfoHeader(_ mem: GroupMember) -> some View {
-        VStack {
+        VStack(spacing: 8) {
             MemberProfileImage(mem, size: 192, color: Color(uiColor: .tertiarySystemFill))
-                .padding(.top, 12)
-                .padding()
+                .padding(.top, 20)
+                .padding(.bottom, 12)
             // show alias if set, alias cannot be edited in this view
             let displayName = mem.displayName.trimmingCharacters(in: .whitespacesAndNewlines)
             let fullName = mem.fullName.trimmingCharacters(in: .whitespacesAndNewlines)

apps/ios/Shared/Views/Helpers/ChatItemClipShape.swift

@@ -51,6 +51,12 @@ struct ChatItemClipped: ViewModifier {
                     tailVisible: tail
                 )
                 : .roundRect(radius: msgRectMaxRadius)
+            case .sndDeleted, .rcvDeleted, .sndModerated, .rcvModerated, .rcvBlocked:
+                return terminal
+                ? .roundRect(radius: 8)
+                : tailEnabled
+                ? .bubble(padding: ci.chatDir.sent ? .trailing : .leading, tailVisible: false)
+                : .roundRect(radius: msgRectMaxRadius)
             case .rcvGroupInvitation, .sndGroupInvitation:
                 return .roundRect(radius: msgRectMaxRadius)
             default: return .roundRect(radius: 8)

apps/ios/Shared/Views/Onboarding/SetNotificationsMode.swift

@@ -73,6 +73,7 @@ struct NtfModeSelector: View {
                     .resizable()
                     .scaledToFill()
                     .frame(width: mode.icon == "bolt" ? 14 : 18, height: 18)
+                    .frame(width: 18)
                     .foregroundColor(selection == mode ? theme.colors.primary : theme.colors.secondary)
                 VStack(alignment: .leading, spacing: 4) {
                     Text(mode.label)

apps/ios/Shared/Views/UserSettings/SettingsView.swift

@@ -395,10 +395,8 @@ struct SettingsView: View {
                         .navigationTitle("Notifications")
                         .modifier(ThemedBackground(grouped: true))
                 } label: {
-                    HStack {
-                        notificationsIcon()
-                        Text("Notifications")
-                    }
+                    let (icon, color) = notificationsIcon()
+                    settingsRow(icon, color: color) { Text("Notifications") }
                 }
                 .disabled(chatModel.chatRunning != true)
 
@@ -555,7 +553,7 @@ struct SettingsView: View {
         case error(LocalizedStringKey, String)
     }
 
-    private func notificationsIcon() -> some View {
+    private func notificationsIcon() -> (String, Color) {
         let icon: String
         let color: Color
         switch (chatModel.tokenStatus) {
@@ -585,9 +583,7 @@ struct SettingsView: View {
             icon = "bolt"
             color = theme.colors.secondary
         }
-        return Image(systemName: icon)
-            .padding(.trailing, 9)
-            .foregroundColor(color)
+        return (icon, color)
     }
 }