ソースを参照

Refine main page typography and meeting tab bar spacing.

Reduce heading sizes and tune the platform tab bar shape, insets, and item spacing so the first screen matches the requested compact centered look.

Made-with: Cursor
huzaifahayat12 2 週間 前
コミット
b3ff8cdeaa
共有1 個のファイルを変更した22 個の追加14 個の削除を含む
  1. 22 14
      meetings_app/ViewController.swift

+ 22 - 14
meetings_app/ViewController.swift

@@ -141,15 +141,18 @@ private extension ViewController {
141 141
     }
142 142
 
143 143
     func meetingTypeTabs() -> NSView {
144
-        let shell = roundedContainer(cornerRadius: 20, color: palette.tabBarBackground)
144
+        let wrapper = NSView()
145
+        wrapper.translatesAutoresizingMaskIntoConstraints = false
146
+
147
+        let shell = roundedContainer(cornerRadius: 24, color: palette.tabBarBackground)
145 148
         shell.translatesAutoresizingMaskIntoConstraints = false
146
-        shell.heightAnchor.constraint(equalToConstant: 56).isActive = true
149
+        shell.heightAnchor.constraint(equalToConstant: 48).isActive = true
147 150
 
148 151
         let stack = NSStackView()
149 152
         stack.translatesAutoresizingMaskIntoConstraints = false
150 153
         stack.orientation = .horizontal
151 154
         stack.distribution = .fillEqually
152
-        stack.spacing = 10
155
+        stack.spacing = 4
153 156
 
154 157
         stack.addArrangedSubview(topTab("Meet", icon: "􀤆", selected: true))
155 158
         stack.addArrangedSubview(topTab("Zoom", icon: "􀤉", selected: false))
@@ -157,15 +160,20 @@ private extension ViewController {
157 160
         stack.addArrangedSubview(topTab("Zoho", icon: "􀯶", selected: false))
158 161
 
159 162
         shell.addSubview(stack)
163
+        wrapper.addSubview(shell)
160 164
         NSLayoutConstraint.activate([
161
-            shell.widthAnchor.constraint(greaterThanOrEqualToConstant: 700),
162
-            stack.leadingAnchor.constraint(equalTo: shell.leadingAnchor, constant: 10),
163
-            stack.trailingAnchor.constraint(equalTo: shell.trailingAnchor, constant: -10),
164
-            stack.topAnchor.constraint(equalTo: shell.topAnchor, constant: 8),
165
-            stack.bottomAnchor.constraint(equalTo: shell.bottomAnchor, constant: -8)
165
+            wrapper.widthAnchor.constraint(greaterThanOrEqualToConstant: 780),
166
+            shell.leadingAnchor.constraint(equalTo: wrapper.leadingAnchor),
167
+            shell.trailingAnchor.constraint(equalTo: wrapper.trailingAnchor),
168
+            shell.topAnchor.constraint(equalTo: wrapper.topAnchor),
169
+            shell.bottomAnchor.constraint(equalTo: wrapper.bottomAnchor),
170
+            stack.leadingAnchor.constraint(equalTo: shell.leadingAnchor, constant: 72),
171
+            stack.trailingAnchor.constraint(equalTo: shell.trailingAnchor, constant: -28),
172
+            stack.topAnchor.constraint(equalTo: shell.topAnchor, constant: 6),
173
+            stack.bottomAnchor.constraint(equalTo: shell.bottomAnchor, constant: -6)
166 174
         ])
167 175
 
168
-        return shell
176
+        return wrapper
169 177
     }
170 178
 
171 179
     func meetingUrlSection() -> NSView {
@@ -382,7 +390,7 @@ private extension ViewController {
382 390
     }
383 391
 
384 392
     func topTab(_ title: String, icon: String, selected: Bool) -> NSView {
385
-        let tab = roundedContainer(cornerRadius: 18, color: selected ? palette.primaryBlue : .clear)
393
+        let tab = roundedContainer(cornerRadius: 19, color: selected ? palette.primaryBlue : .clear)
386 394
         tab.translatesAutoresizingMaskIntoConstraints = false
387 395
 
388 396
         let iconLabelView = textLabel(icon, font: typography.tabIcon, color: palette.textPrimary)
@@ -466,10 +474,10 @@ private struct Typography {
466 474
     let sidebarIcon = NSFont.systemFont(ofSize: 12, weight: .medium)
467 475
     let sidebarItem = NSFont.systemFont(ofSize: 16, weight: .medium)
468 476
 
469
-    let pageTitle = NSFont.systemFont(ofSize: 31, weight: .semibold)
470
-    let sectionTitle = NSFont.systemFont(ofSize: 23, weight: .semibold)
471
-    let sectionTitleBold = NSFont.systemFont(ofSize: 29, weight: .bold)
472
-    let dateHeading = NSFont.systemFont(ofSize: 21, weight: .medium)
477
+    let pageTitle = NSFont.systemFont(ofSize: 27, weight: .semibold)
478
+    let sectionTitle = NSFont.systemFont(ofSize: 20, weight: .semibold)
479
+    let sectionTitleBold = NSFont.systemFont(ofSize: 25, weight: .bold)
480
+    let dateHeading = NSFont.systemFont(ofSize: 18, weight: .medium)
473 481
 
474 482
     let tabIcon = NSFont.systemFont(ofSize: 13, weight: .regular)
475 483
     let tabTitle = NSFont.systemFont(ofSize: 31 / 2, weight: .semibold)