moved from a list to a custom view for the symbol picker it looks beautiful imo

- animations!!
symbol preview doesnt have a glow if its "small"
added a blur on connectionview if the symbol picker popover is visible
 - need to figure out how to animate it dipping

ShhShell/Views/Hosts/ConnectionView.swift

@@ -77,6 +77,7 @@ struct ConnectionView: View {
 					}
 				}
 			}
+			.blur(radius: showIconPicker ? 5 : 0)
 			.scrollContentBackground(.hidden)
 			.transition(.opacity)
 			.onDisappear {
@@ -114,14 +115,14 @@ Hostkey fingerprint is \(handler.getHostkey() ?? "nil")
 			.toolbar {
 				ToolbarItem {
 					Button() {
-						showIconPicker.toggle()
+						withAnimation { showIconPicker.toggle() }
 					} label: {
 						HostSymbolPreview(symbol: handler.host.symbol, label: handler.host.label, small: true)
 							.id(handler.host)
 					}
 					.popover(isPresented: $showIconPicker) {
 						HostSymbolPicker(host: $handler.host)
-							.frame(minWidth: 300, minHeight: 200)
+							.frame(minWidth: 275, minHeight: 125)
 							.modifier(presentationCompactPopover())
 					}
 				}

ShhShell/Views/Hosts/HostSymbolPicker.swift

@@ -10,28 +10,43 @@ import SwiftUI
 struct HostSymbolPicker: View {
 	@Binding var host: Host
 	
+	@Environment(\.colorScheme) var cScheme
+	
     var body: some View {
-		List {
+		ZStack {
-			ScrollView(.horizontal) {
+			Rectangle()
-				HStack {
+				.foregroundStyle(cScheme == .dark ? .black : .gray)
-					ForEach(HostSymbol.allCases, id: \.self) { symbol in
+			VStack(alignment: .center, spacing: 10) {
-						ZStack {
+				ScrollView(.horizontal) {
-							if host.symbol == symbol {
+					HStack {
-								RoundedRectangle(cornerRadius: 10)
+						ForEach(HostSymbol.allCases, id: \.self) { symbol in
-									.fill(.gray.opacity(0.5))
+							ZStack {
+								if host.symbol == symbol {
+									Rectangle()
+										.fill(.gray.opacity(0.5))
+										.clipShape(RoundedRectangle(cornerRadius: 5))
+								}
+								HostSymbolPreview(symbol: symbol, label: host.label)
+									.padding(10)
+							}
+							.transition(.opacity)
+							.animation(.bouncy, value: host.symbol)
+							.frame(width: 50, height: 50)
+							.onTapGesture {
+								withAnimation { host.symbol = symbol }
 							}
-							HostSymbolPreview(symbol: symbol, label: host.label)
-								.padding(5)
-						}
-						.frame(width: 50, height: 50)
-						.onTapGesture {
-							withAnimation { host.symbol = symbol }
 						}
 					}
 				}
+				.scrollIndicators(.visible)
+				
+				Divider()
+				
+				TextBox(label: host.label.isEmpty ? "" : "Icon Label", text: $host.label, prompt: "Icon label")
 			}
-			TextBox(label: "Icon Text", text: $host.label, prompt: "")
+			.padding(10)
 		}
+		.scrollDisabled(true)
     }
 }
 

ShhShell/Views/Misc/HostSymbolPreview.swift

@@ -17,15 +17,9 @@ struct HostSymbolPreview: View {
 			HStack(alignment: .center, spacing: 5) {
 				Text(label)
 					.font(.headline)
-				ZStack(alignment: .center) {
+				symbol.image
-					symbol.image
+					.resizable().scaledToFit()
-						.resizable().scaledToFit()
+					.symbolRenderingMode(.monochrome)
-						.symbolRenderingMode(.monochrome)
-						.blur(radius: 1)
-					symbol.image
-						.resizable().scaledToFit()
-						.symbolRenderingMode(.monochrome)
-				}
 			}
 		} else {
 			ZStack(alignment: .center) {