style(zoom): update manual zoom region edit popover to consistently follow the colors across the app

Author: jkuri

Reframed/Editor/RegionEditPopover.swift

@@ -42,7 +42,7 @@ struct RegionEditPopover: View {
 
   var body: some View {
     let _ = colorScheme
-    VStack(alignment: .leading, spacing: 0) {
+    VStack(alignment: .leading, spacing: Layout.regionPopoverSpacing) {
       SectionHeader(title: "Zoom")
 
       SliderRow(
@@ -57,8 +57,7 @@ struct RegionEditPopover: View {
       .padding(.vertical, 4)
 
       Divider()
-        .background(ReframedColors.divider)
-        .padding(.vertical, 4)
+        .padding(.horizontal, 12)
 
       SectionHeader(title: "Transition")
 
@@ -86,30 +85,27 @@ struct RegionEditPopover: View {
       .padding(.horizontal, 12)
       .padding(.vertical, 4)
 
-      Divider()
-        .background(ReframedColors.divider)
-        .padding(.vertical, 4)
-
       Button {
         onRemove()
       } label: {
-        HStack(spacing: 8) {
+        HStack(spacing: 5) {
           Image(systemName: "trash")
-            .font(.system(size: 11))
-            .frame(width: 14)
+            .font(.system(size: 12, weight: .semibold))
           Text("Remove")
-            .font(.system(size: 13))
-          Spacer()
+            .font(.system(size: 12, weight: .semibold))
         }
-        .foregroundStyle(.red.opacity(0.8))
-        .padding(.horizontal, 12)
-        .padding(.vertical, 5)
-        .contentShape(Rectangle())
+        .foregroundStyle(.white)
+        .frame(maxWidth: .infinity)
+        .frame(height: 32)
+        .background(Color.red.opacity(0.8))
+        .clipShape(RoundedRectangle(cornerRadius: 7))
       }
       .buttonStyle(.plain)
+      .padding(.horizontal, 12)
+      .padding(.vertical, 8)
     }
     .padding(.vertical, 8)
-    .frame(width: 260)
+    .frame(width: Layout.regionPopoverWidth)
     .popoverContainerStyle()
     .onChange(of: zoomLevel) { commitChanges() }
     .onChange(of: easeIn) { commitChanges() }