Fix update layout

DroidKaigi · Jun 29, 2024 · 4c279b8 · 4c279b8
1 parent 916961d
commit 4c279b8
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 26 deletions.
diff --git a/app-ios/Sources/StaffFeature/StaffLabel.swift b/app-ios/Sources/StaffFeature/StaffLabel.swift
@@ -6,21 +6,19 @@ struct StaffLabel: View {
     let icon: URL
 
     var body: some View {
-        HStack(alignment: .center) {
-            AsyncImage(url: icon) { image in
-                image.resizable()
-            } placeholder: {
-                Color.gray
+        HStack(alignment: .center, spacing: 12) {
+            AsyncImage(url: icon) {
+                $0.image?.resizable()
             }
-            .frame(width: 60, height: 60)
-            .scaledToFill()
-            .clipShape(RoundedRectangle(cornerRadius: 12))
+            .frame(width: 52, height: 52)
+            .clipShape(Circle())
             .overlay(
-                RoundedRectangle(cornerRadius: 12)
+                Circle()
                     .stroke(AssetColors.Outline.outline.swiftUIColor, lineWidth: 1)
             )
+
             Text(name)
-                .textStyle(TypographyTokens.bodyLarge)
+                .textStyle(.bodyLarge)
                 .foregroundStyle(AssetColors.Surface.onSurface.swiftUIColor)
                 .lineLimit(2)
         }

diff --git a/app-ios/Sources/StaffFeature/StaffView.swift b/app-ios/Sources/StaffFeature/StaffView.swift
@@ -1,5 +1,6 @@
 import ComposableArchitecture
 import SwiftUI
+import Theme
 
 public struct StaffView: View {
     private let store: StoreOf<StaffReducer>
@@ -17,10 +18,12 @@ public struct StaffView: View {
                     } label: {
                         StaffLabel(name: staff.name, icon: staff.icon)
                     }
+                    .padding(.vertical, 12)
                 }
             }
             .padding(16)
         }
+        .background(AssetColors.Surface.surface.swiftUIColor)
         .onAppear {
             store.send(.onAppear)
         }

diff --git a/app-ios/Sources/Theme/Typography.swift b/app-ios/Sources/Theme/Typography.swift
@@ -27,20 +27,20 @@ extension TextStyle {
     public static let labelSmall: TextStyle = TypographyTokens.labelSmall
 }
 
-public enum TypographyTokens {
-    public static let displayLarge = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 57), lineHeight: 64, letterSpacing: -0.25)
-    public static let displayMedium = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 45), lineHeight: 52)
-    public static let displaySmall = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 36), lineHeight: 44)
-    public static let headlineLarge = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 32), lineHeight: 40)
-    public static let headlineMedium = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 28), lineHeight: 36 - 28)
-    public static let headlineSmall = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 24), lineHeight: 32)
-    public static let titleLarge = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 22), lineHeight: 28)
-    public static let titleMedium = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 16), lineHeight: 24, letterSpacing: 0.15)
-    public static let titleSmall = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 14), lineHeight: 20, letterSpacing: 0.1)
-    public static let labelLarge = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 14), lineHeight: 20, letterSpacing: 0.1)
-    public static let labelMedium = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 12), lineHeight: 16, letterSpacing: 0.5)
-    public static let labelSmall = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 11), lineHeight: 16, letterSpacing: 0.5)
-    public static let bodyLarge = TextStyle(font: FontAssets.Roboto.regular.font(size: 16), lineHeight: 24, letterSpacing: 0.5)
-    public static let bodyMedium = TextStyle(font: FontAssets.Roboto.regular.font(size: 14), lineHeight: 20, letterSpacing: 0.25)
-    public static let bodySmall = TextStyle(font: FontAssets.Roboto.regular.font(size: 12), lineHeight: 16, letterSpacing: 0.4)
+enum TypographyTokens {
+    static let displayLarge = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 57), lineHeight: 64, letterSpacing: -0.25)
+    static let displayMedium = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 45), lineHeight: 52)
+    static let displaySmall = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 36), lineHeight: 44)
+    static let headlineLarge = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 32), lineHeight: 40)
+    static let headlineMedium = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 28), lineHeight: 36 - 28)
+    static let headlineSmall = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 24), lineHeight: 32)
+    static let titleLarge = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 22), lineHeight: 28)
+    static let titleMedium = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 16), lineHeight: 24, letterSpacing: 0.15)
+    static let titleSmall = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 14), lineHeight: 20, letterSpacing: 0.1)
+    static let labelLarge = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 14), lineHeight: 20, letterSpacing: 0.1)
+    static let labelMedium = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 12), lineHeight: 16, letterSpacing: 0.5)
+    static let labelSmall = TextStyle(font: FontAssets.DotGothic16.regular.font(size: 11), lineHeight: 16, letterSpacing: 0.5)
+    static let bodyLarge = TextStyle(font: FontAssets.Roboto.regular.font(size: 16), lineHeight: 24, letterSpacing: 0.5)
+    static let bodyMedium = TextStyle(font: FontAssets.Roboto.regular.font(size: 14), lineHeight: 20, letterSpacing: 0.25)
+    static let bodySmall = TextStyle(font: FontAssets.Roboto.regular.font(size: 12), lineHeight: 16, letterSpacing: 0.4)
 }