Update login and server selection screens (#651)

* Update login and server selection screens.

* Replace all NavigationViews with NavigationStacks

ElementX/Sources/Screens/Authentication/LoginScreen/View/LoginScreen.swift

@@ -28,7 +28,7 @@ struct LoginScreen: View {
         ScrollView {
             VStack(spacing: 0) {
                 header
-                    .padding(.top, UIConstants.topPaddingToNavigationBar)
+                    .padding(.top, UIConstants.titleTopPaddingToNavigationBar)
                     .padding(.bottom, 32)
                 
                 serverInfo
@@ -70,15 +70,15 @@ struct LoginScreen: View {
     var loginForm: some View {
         VStack(alignment: .leading, spacing: 0) {
             Text(ElementL10n.ftueAuthSignInEnterDetails)
-                .font(.element.subheadline)
+                .font(.element.footnote)
                 .foregroundColor(.element.primaryContent)
                 .padding(.horizontal, 16)
                 .padding(.bottom, 8)
             
-            TextField(ElementL10n.loginSigninUsernameHint,
+            TextField(ElementL10n.username,
                       text: $context.username,
                       // Prompt colour fixes a flicker that occurs before the text field style introspects the field.
-                      prompt: Text(ElementL10n.loginSigninUsernameHint).foregroundColor(.element.tertiaryContent))
+                      prompt: Text(ElementL10n.username).foregroundColor(.element.tertiaryContent))
                 .focused($isUsernameFocused)
                 .textFieldStyle(.elementInput(accessibilityIdentifier: A11yIdentifiers.loginScreen.emailUsername))
                 .disableAutocorrection(true)
@@ -162,11 +162,18 @@ struct Login_Previews: PreviewProvider {
     }
     
     static func screen(for viewModel: LoginViewModel) -> some View {
-        NavigationView {
+        NavigationStack {
             LoginScreen(context: viewModel.context)
                 .navigationBarTitleDisplayMode(.inline)
                 .tint(.element.accent)
+                .toolbar {
+                    ToolbarItem(placement: .cancellationAction) {
+                        Button { } label: {
+                            Text("\(Image(systemName: "chevron.backward")) Back")
+                        }
+                    }
+                }
         }
-        .navigationViewStyle(.stack)
+        .tint(.element.accent)
     }
 }

ElementX/Sources/Screens/Authentication/LoginScreen/View/LoginServerInfoSection.swift

@@ -31,7 +31,7 @@ struct LoginServerInfoSection: View {
     var body: some View {
         VStack(alignment: .leading, spacing: 8) {
             Text(ElementL10n.ftueAuthSignInChooseServerHeader)
-                .font(.element.subheadline)
+                .font(.element.footnote)
                 .foregroundColor(.element.primaryContent)
                 .padding(.horizontal, 16)