1 files changed, 24 insertions, 21 deletions
diff --git a/Map/Presentation/Preferences/StagesPreferencesView.swift b/Map/Presentation/Preferences/StagesPreferencesView.swift
index cd347bf..6d2154c 100644
--- a/Map/Presentation/Preferences/StagesPreferencesView.swift
+++ b/Map/Presentation/Preferences/StagesPreferencesView.swift
@@ -18,23 +18,14 @@ import SwiftUI
 struct StagesPreferencesView: View {
   @AppStorage("customStages") private var customStagesData: Data = Data()
   @State private var customStages: [CustomStage] = []
+  @State private var showingHelpPopover = false
 
   var body: some View {
     VStack(alignment: .leading, spacing: Dimensions.Spacing.regular) {
-      Text("preferences.stages.title")
-        .font(.Theme.Title.emphasized)
-        .lineSpacing(Dimensions.LineHeight.title - Dimensions.FontSize.title)
-      Text("preferences.stages.explanation")
-        .font(.Theme.Body.regular)
-        .kerning(Dimensions.Kerning.body)
-        .lineSpacing(Dimensions.LineHeight.body - Dimensions.FontSize.body)
-        .padding(.top, Dimensions.Spacing.loose)
-        .padding(.bottom, Dimensions.Spacing.regular)
-
       Table(customStages) {
-        TableColumn("Name") { customStage in
+        TableColumn("preferences.stages.column.name") { customStage in
           TextField(
-            "Stage Name",
+            "preferences.stages.placeholder.name",
             text: Binding(
               get: { customStage.name },
               set: { newValue in
@@ -46,9 +37,9 @@ struct StagesPreferencesView: View {
         }
         .width(120)
 
-        TableColumn("Stage I") { customStage in
+        TableColumn("preferences.stages.column.stage_i") { customStage in
           TextField(
-            "Stage I",
+            "preferences.stages.placeholder.stage_i",
             text: Binding(
               get: { customStage.stage.i },
               set: { newValue in
@@ -59,9 +50,9 @@ struct StagesPreferencesView: View {
           .textFieldStyle(.plain)
         }
 
-        TableColumn("Stage II") { customStage in
+        TableColumn("preferences.stages.column.stage_ii") { customStage in
           TextField(
-            "Stage II",
+            "preferences.stages.placeholder.stage_ii",
             text: Binding(
               get: { customStage.stage.ii },
               set: { newValue in
@@ -72,9 +63,9 @@ struct StagesPreferencesView: View {
           .textFieldStyle(.plain)
         }
 
-        TableColumn("Stage III") { customStage in
+        TableColumn("preferences.stages.column.stage_iii") { customStage in
           TextField(
-            "Stage III",
+            "preferences.stages.placeholder.stage_iii",
             text: Binding(
               get: { customStage.stage.iii },
               set: { newValue in
@@ -85,9 +76,9 @@ struct StagesPreferencesView: View {
           .textFieldStyle(.plain)
         }
 
-        TableColumn("Stage IV") { customStage in
+        TableColumn("preferences.stages.column.stage_iv") { customStage in
           TextField(
-            "Stage IV",
+            "preferences.stages.placeholder.stage_iv",
             text: Binding(
               get: { customStage.stage.iv },
               set: { newValue in
@@ -108,8 +99,20 @@ struct StagesPreferencesView: View {
       }
       .tableStyle(.bordered(alternatesRowBackgrounds: true))
 
-      HStack {
+      HStack(spacing: Dimensions.Spacing.regular) {
         Spacer()
+        Button(action: { showingHelpPopover = true }) {
+          Image(systemName: "questionmark.circle")
+        }
+        .buttonStyle(.borderless)
+        .popover(isPresented: $showingHelpPopover, arrowEdge: .bottom) {
+          Text("preferences.stages.explanation")
+            .font(.Theme.Body.regular)
+            .kerning(Dimensions.Kerning.body)
+            .lineSpacing(Dimensions.LineHeight.body - Dimensions.FontSize.body)
+            .frame(width: 300)
+            .padding(Dimensions.Spacing.regular)
+        }
         Button(action: addStage) {
           Image(systemName: "plus")
         }