Răsfoiți Sursa

Improve Calendar page width usage and spacing consistency.

Expand the calendar grid layout, improve control spacing, and ensure the main content area flexes correctly beside the sidebar so Calendar aligns visually with other pages.

Made-with: Cursor
huzaifahayat12 3 luni în urmă
părinte
comite
4b7e611623
1 a modificat fișierele cu 28 adăugiri și 19 ștergeri
  1. 28 19
      meetings_app/ViewController.swift

+ 28 - 19
meetings_app/ViewController.swift

@@ -490,7 +490,8 @@ private extension ViewController {
         let splitContainer = NSStackView()
         splitContainer.translatesAutoresizingMaskIntoConstraints = false
         splitContainer.orientation = .horizontal
-        splitContainer.spacing = 0
+        splitContainer.spacing = 14
+        splitContainer.distribution = .fill
         splitContainer.alignment = .top
         view.addSubview(splitContainer)
 
@@ -503,6 +504,10 @@ private extension ViewController {
 
         let sidebar = makeSidebar()
         let mainPanel = makeMainPanel()
+        sidebar.setContentHuggingPriority(.required, for: .horizontal)
+        sidebar.setContentCompressionResistancePriority(.required, for: .horizontal)
+        mainPanel.setContentHuggingPriority(.defaultLow, for: .horizontal)
+        mainPanel.setContentCompressionResistancePriority(.defaultLow, for: .horizontal)
         splitContainer.addArrangedSubview(sidebar)
         splitContainer.addArrangedSubview(mainPanel)
     }
@@ -1850,7 +1855,7 @@ private extension ViewController {
         titleRow.orientation = .horizontal
         titleRow.alignment = .centerY
         titleRow.distribution = .fill
-        titleRow.spacing = 12
+        titleRow.spacing = 10
 
         let titleLabel = textLabel("Calendar", font: typography.pageTitle, color: palette.textPrimary)
         titleLabel.alignment = .left
@@ -1865,9 +1870,9 @@ private extension ViewController {
         spacer.setContentCompressionResistancePriority(.defaultLow, for: .horizontal)
 
         let prevButton = makeCalendarHeaderPillButton(title: "‹", action: #selector(calendarPrevMonthPressed(_:)))
-        prevButton.widthAnchor.constraint(equalToConstant: 44).isActive = true
+        prevButton.widthAnchor.constraint(equalToConstant: 46).isActive = true
         let nextButton = makeCalendarHeaderPillButton(title: "›", action: #selector(calendarNextMonthPressed(_:)))
-        nextButton.widthAnchor.constraint(equalToConstant: 44).isActive = true
+        nextButton.widthAnchor.constraint(equalToConstant: 46).isActive = true
 
         let monthLabel = textLabel("", font: NSFont.systemFont(ofSize: 16, weight: .semibold), color: palette.textSecondary)
         monthLabel.alignment = .right
@@ -1894,8 +1899,8 @@ private extension ViewController {
         refreshButton.imagePosition = .imageOnly
         refreshButton.imageScaling = .scaleProportionallyDown
         refreshButton.focusRingType = .none
-        refreshButton.heightAnchor.constraint(equalToConstant: 30).isActive = true
-        refreshButton.widthAnchor.constraint(equalToConstant: 30).isActive = true
+        refreshButton.heightAnchor.constraint(equalToConstant: 32).isActive = true
+        refreshButton.widthAnchor.constraint(equalToConstant: 32).isActive = true
 
         titleRow.addArrangedSubview(titleLabel)
         titleRow.addArrangedSubview(spacer)
@@ -1910,7 +1915,7 @@ private extension ViewController {
         weekdayRow.orientation = .horizontal
         weekdayRow.alignment = .centerY
         weekdayRow.distribution = .fillEqually
-        weekdayRow.spacing = 10
+        weekdayRow.spacing = 12
 
         for symbol in calendarWeekdaySymbolsStartingAtFirstWeekday() {
             let label = textLabel(symbol, font: NSFont.systemFont(ofSize: 12, weight: .semibold), color: palette.textMuted)
@@ -1932,15 +1937,16 @@ private extension ViewController {
         let gridCard = roundedContainer(cornerRadius: 14, color: palette.sectionCard)
         gridCard.translatesAutoresizingMaskIntoConstraints = false
         styleSurface(gridCard, borderColor: palette.inputBorder, borderWidth: 1, shadow: false)
-        let gridHeightConstraint = gridCard.heightAnchor.constraint(equalToConstant: 320)
+        let gridHeightConstraint = gridCard.heightAnchor.constraint(equalToConstant: 360)
         gridHeightConstraint.isActive = true
         calendarPageGridHeightConstraint = gridHeightConstraint
+        gridCard.heightAnchor.constraint(greaterThanOrEqualToConstant: 360).isActive = true
         gridCard.addSubview(gridStack)
         NSLayoutConstraint.activate([
-            gridStack.leadingAnchor.constraint(equalTo: gridCard.leadingAnchor, constant: 12),
-            gridStack.trailingAnchor.constraint(equalTo: gridCard.trailingAnchor, constant: -12),
-            gridStack.topAnchor.constraint(equalTo: gridCard.topAnchor, constant: 12),
-            gridStack.bottomAnchor.constraint(equalTo: gridCard.bottomAnchor, constant: -12)
+            gridStack.leadingAnchor.constraint(equalTo: gridCard.leadingAnchor, constant: 16),
+            gridStack.trailingAnchor.constraint(equalTo: gridCard.trailingAnchor, constant: -16),
+            gridStack.topAnchor.constraint(equalTo: gridCard.topAnchor, constant: 16),
+            gridStack.bottomAnchor.constraint(equalTo: gridCard.bottomAnchor, constant: -16)
         ])
 
         let daySummary = textLabel("", font: typography.dateHeading, color: palette.textSecondary)
@@ -1950,8 +1956,11 @@ private extension ViewController {
         calendarPageDaySummaryLabel = daySummary
 
         contentStack.addArrangedSubview(titleRow)
+        contentStack.setCustomSpacing(16, after: titleRow)
         contentStack.addArrangedSubview(weekdayRow)
+        contentStack.setCustomSpacing(10, after: weekdayRow)
         contentStack.addArrangedSubview(gridCard)
+        contentStack.setCustomSpacing(16, after: gridCard)
         contentStack.addArrangedSubview(daySummary)
 
         panel.addSubview(contentStack)
@@ -4643,9 +4652,9 @@ private extension ViewController {
         let totalDays = dayRange.count
         let totalCells = leadingEmpty + totalDays
         let rowCount = Int(ceil(Double(totalCells) / 7.0))
-        let rowHeight: CGFloat = 44
-        let rowSpacing: CGFloat = 10
-        let verticalPadding: CGFloat = 24
+        let rowHeight: CGFloat = 56
+        let rowSpacing: CGFloat = 12
+        let verticalPadding: CGFloat = 32
         calendarPageGridHeightConstraint?.constant = verticalPadding + (CGFloat(rowCount) * rowHeight) + (CGFloat(max(0, rowCount - 1)) * rowSpacing)
 
         let meetingCounts = calendarMeetingCountsByDay(from: scheduleCachedMeetings, monthStart: monthStart, monthEnd: monthEnd)
@@ -4734,7 +4743,7 @@ private extension ViewController {
     private func calendarEmptyDayCell() -> NSView {
         let v = NSView()
         v.translatesAutoresizingMaskIntoConstraints = false
-        v.heightAnchor.constraint(equalToConstant: 44).isActive = true
+        v.heightAnchor.constraint(equalToConstant: 56).isActive = true
         return v
     }
 
@@ -4744,10 +4753,10 @@ private extension ViewController {
         button.isBordered = false
         button.bezelStyle = .regularSquare
         button.wantsLayer = true
-        button.layer?.cornerRadius = 10
+        button.layer?.cornerRadius = 12
         button.layer?.masksToBounds = true
         button.identifier = NSUserInterfaceItemIdentifier(dateKey)
-        button.heightAnchor.constraint(equalToConstant: 44).isActive = true
+        button.heightAnchor.constraint(equalToConstant: 56).isActive = true
         button.setContentHuggingPriority(.required, for: .vertical)
         button.setContentCompressionResistancePriority(.required, for: .vertical)
         button.alignment = .left
@@ -4773,7 +4782,7 @@ private extension ViewController {
         }
 
         button.attributedTitle = NSAttributedString(
-            string: "  \(dayNumber)",
+            string: "   \(dayNumber)",
             attributes: [
                 .font: NSFont.systemFont(ofSize: 14, weight: .bold),
                 .foregroundColor: palette.textPrimary