Tighten schedule cards layout and size.

Use fixed-width cards with left-aligned rows, smaller typography, and adjustable height with extra bottom space so the schedule section matches the compact reference layout.

Made-with: Cursor

meetings_app/ViewController.swift

@@ -307,11 +307,11 @@ private extension ViewController {
         let row = NSStackView()
         row.translatesAutoresizingMaskIntoConstraints = false
         row.orientation = .horizontal
-        row.spacing = 14
+        row.spacing = 10
         row.alignment = .top
-        row.distribution = .fillEqually
-        row.widthAnchor.constraint(greaterThanOrEqualToConstant: 780).isActive = true
-        row.heightAnchor.constraint(equalToConstant: 168).isActive = true
+        row.distribution = .fill
+        row.setContentHuggingPriority(.defaultHigh, for: .horizontal)
+        row.heightAnchor.constraint(equalToConstant: 136).isActive = true
 
         row.addArrangedSubview(scheduleCard())
         row.addArrangedSubview(scheduleCard())
@@ -319,15 +319,18 @@ private extension ViewController {
     }
 
     func scheduleCard() -> NSView {
-        let card = roundedContainer(cornerRadius: 12, color: palette.sectionCard)
+        let cardWidth: CGFloat = 264
+
+        let card = roundedContainer(cornerRadius: 10, color: palette.sectionCard)
         styleSurface(card, borderColor: palette.inputBorder, borderWidth: 1, shadow: true)
         card.translatesAutoresizingMaskIntoConstraints = false
-        card.heightAnchor.constraint(equalToConstant: 168).isActive = true
+        card.widthAnchor.constraint(equalToConstant: cardWidth).isActive = true
+        card.heightAnchor.constraint(equalToConstant: 136).isActive = true
 
-        let icon = roundedContainer(cornerRadius: 7, color: palette.meetingBadge)
+        let icon = roundedContainer(cornerRadius: 5, color: palette.meetingBadge)
         icon.translatesAutoresizingMaskIntoConstraints = false
-        icon.widthAnchor.constraint(equalToConstant: 30).isActive = true
-        icon.heightAnchor.constraint(equalToConstant: 30).isActive = true
+        icon.widthAnchor.constraint(equalToConstant: 22).isActive = true
+        icon.heightAnchor.constraint(equalToConstant: 22).isActive = true
         let iconText = textLabel("••", font: typography.cardIcon, color: .white)
         iconText.translatesAutoresizingMaskIntoConstraints = false
         icon.addSubview(iconText)
@@ -337,8 +340,8 @@ private extension ViewController {
         ])
 
         let title = textLabel("General Meeting", font: typography.cardTitle, color: palette.textPrimary)
-        let subtitle = textLabel("Baisakhi", font: typography.cardSubtitle, color: palette.textSecondary)
-        let time = textLabel("12:00 AM - 11:59 PM", font: typography.cardTime, color: palette.textTertiary)
+        let subtitle = textLabel("Baisakhi", font: typography.cardSubtitle, color: palette.textPrimary)
+        let time = textLabel("12:00 AM - 11:59 PM", font: typography.cardTime, color: palette.textSecondary)
 
         card.addSubview(icon)
         card.addSubview(title)
@@ -346,18 +349,18 @@ private extension ViewController {
         card.addSubview(time)
 
         NSLayoutConstraint.activate([
-            icon.leadingAnchor.constraint(equalTo: card.leadingAnchor, constant: 14),
-            icon.topAnchor.constraint(equalTo: card.topAnchor, constant: 14),
+            icon.leadingAnchor.constraint(equalTo: card.leadingAnchor, constant: 10),
+            icon.topAnchor.constraint(equalTo: card.topAnchor, constant: 10),
 
-            title.leadingAnchor.constraint(equalTo: icon.trailingAnchor, constant: 8),
+            title.leadingAnchor.constraint(equalTo: icon.trailingAnchor, constant: 6),
             title.centerYAnchor.constraint(equalTo: icon.centerYAnchor),
-            title.trailingAnchor.constraint(lessThanOrEqualTo: card.trailingAnchor, constant: -12),
+            title.trailingAnchor.constraint(lessThanOrEqualTo: card.trailingAnchor, constant: -10),
 
-            subtitle.leadingAnchor.constraint(equalTo: card.leadingAnchor, constant: 14),
-            subtitle.topAnchor.constraint(equalTo: icon.bottomAnchor, constant: 12),
+            subtitle.leadingAnchor.constraint(equalTo: card.leadingAnchor, constant: 10),
+            subtitle.topAnchor.constraint(equalTo: icon.bottomAnchor, constant: 7),
 
-            time.leadingAnchor.constraint(equalTo: card.leadingAnchor, constant: 14),
-            time.topAnchor.constraint(equalTo: subtitle.bottomAnchor, constant: 8)
+            time.leadingAnchor.constraint(equalTo: card.leadingAnchor, constant: 10),
+            time.topAnchor.constraint(equalTo: subtitle.bottomAnchor, constant: 4)
         ])
 
         return card
@@ -378,9 +381,9 @@ private extension ViewController {
         view.layer?.borderWidth = borderWidth
         if shadow {
             view.layer?.shadowColor = NSColor.black.cgColor
-            view.layer?.shadowOpacity = 0.22
-            view.layer?.shadowOffset = CGSize(width: 0, height: -2)
-            view.layer?.shadowRadius = 8
+            view.layer?.shadowOpacity = 0.18
+            view.layer?.shadowOffset = CGSize(width: 0, height: -1)
+            view.layer?.shadowRadius = 5
         }
     }
 
@@ -570,9 +573,9 @@ private struct Typography {
     let filterArrow = NSFont.systemFont(ofSize: 12, weight: .regular)
     let iconButton = NSFont.systemFont(ofSize: 14, weight: .medium)
 
-    let cardIcon = NSFont.systemFont(ofSize: 10, weight: .bold)
-    let cardTitle = NSFont.systemFont(ofSize: 23, weight: .semibold)
-    let cardSubtitle = NSFont.systemFont(ofSize: 18, weight: .bold)
-    let cardTime = NSFont.systemFont(ofSize: 14, weight: .regular)
+    let cardIcon = NSFont.systemFont(ofSize: 8, weight: .bold)
+    let cardTitle = NSFont.systemFont(ofSize: 15, weight: .semibold)
+    let cardSubtitle = NSFont.systemFont(ofSize: 13, weight: .bold)
+    let cardTime = NSFont.systemFont(ofSize: 12, weight: .regular)
 }