Skip to content

Fix UI overlap and padding issues#224

Merged
aly-cloud merged 5 commits intomainfrom
amy-uifixes
Apr 19, 2026
Merged

Fix UI overlap and padding issues#224
aly-cloud merged 5 commits intomainfrom
amy-uifixes

Conversation

@aly-cloud
Copy link
Copy Markdown
Contributor

@aly-cloud aly-cloud commented Apr 4, 2026

Overview

Fixes 3 UI issues relating to padding and constraints in MenuHeaderView and HomeViewController.

Changes Made

Change 1: Increased bottom inset of the collectionView of Eatery cards in HomeViewController

  • Added +25 to collectionView.contentInset.bottom so that the collectionView ends aligned with the CompareMenusButton bottom inset (108 above the bottom of the screen).
  • Prevents the favorites button of the last large Eatery card from being covered by the CompareMenusButton.

Change 2: "Change Date" button internal spacing fixes and padding adjustments in MenuHeaderView

  • Anchored the "Change Date" titleLabel to the "EateryCalendar" imageView to prevent them from overlapping (an issue on smaller phone screens).
  • Reduced the internal padding of the imageView frame to 36x36 and reduced the buttonView right layout margin to 14 in order to preserve the full "Change Date" label text (on iPhone 17 Pro).
  • Made titleLabel text trail off if needed (e.g. "Change D...") for smaller screens using .lessThanOrEqualTo().

Change 3: Prevent overlap with the day title

  • Made day of the week titleLabel trail off if needed for smaller screens using lessThanOrEqualTo() in order to prevent overlap with the "Change Date" button.
  • Kept fixed button width of 156 to prevent overlap with longer day labels (e.g. "Closed Today").

Test Coverage

  • Manually tested on iPhone 17 Pro and iPhone Air.
  • Small and large Eatery card views for home screen padding.
  • Various days of the week including "Closed Today" for "Change Date" button spacing.

Screenshots

Before fixes:

IMG_7178

Summary by CodeRabbit

  • Style
    • Refined menu date-change button layout with tighter spacing, resized calendar icon, and improved label alignment to prevent truncation.
    • Increased home screen bottom content spacing for smoother scrolling and better visual balance above the tab bar.

fixed take 1
Deleted comments to clean up code!
Shrunk fixed button width and shrunk Calendar icon frame to show the full "Closed Today," and shrunk the right button inset to make Change Date button insets more even
@aly-cloud aly-cloud requested review from ArielleNu and MrPeterss April 4, 2026 22:40
@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented Apr 4, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 19f4863f-a0e6-46f7-84fd-dc1137bda27c

📥 Commits

Reviewing files that changed from the base of the PR and between 8abaf07 and 35e071f.

📒 Files selected for processing (1)
  • Eatery Blue/UI/HomeScreen/HomeViewController.swift
✅ Files skipped from review due to trivial changes (1)
  • Eatery Blue/UI/HomeScreen/HomeViewController.swift

📝 Walkthrough

Walkthrough

Two small UI layout changes: MenuHeaderView's date-change button margins and internal constraints were adjusted (image sized and title trailing relaxed), and HomeViewController's collection view bottom content inset was increased by 25 points beyond the tab bar height.

Changes

Cohort / File(s) Summary
Date-Change Button Layout
Eatery Blue/UI/EateryScreen/MenuHeaderView.swift
Changed buttonView layoutMargins right inset 16→14. Created calendar UIImageView earlier, fixed it to 36×36 and centered vertically; reworked titleLabel constraints to lead from image (leading.equalTo(imageView.snp.trailing)) and use lessThanOrEqualTo trailing constraints (including lessThanOrEqualTo(buttonView.snp.leading) in setUpConstraints).
Collection View Spacing
Eatery Blue/UI/HomeScreen/HomeViewController.swift
Increased collectionView.contentInset.bottom to tabBar.frame.height + Constants.collectionViewBottomPadding (adds 25 points) instead of setting it to only the tab bar height.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐰 I nudge a margin, center a view,
A tiny hop makes the layout new,
A little bottom space, a gentle cheer,
UI snug and snugger—Hooray, my dear! ✨

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (2 passed)
Check name Status Explanation
Title check ✅ Passed The title accurately reflects the main changes in the PR - fixing UI overlap and padding issues in MenuHeaderView and HomeViewController.
Description check ✅ Passed The description is comprehensive and well-structured, covering all required sections including overview, changes made, test coverage, and screenshots.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch amy-uifixes

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@aly-cloud aly-cloud requested a review from AdelynnWu April 4, 2026 22:41
Copy link
Copy Markdown

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick comments (2)
Eatery Blue/UI/EateryScreen/MenuHeaderView.swift (1)

102-106: Add spacing between titleLabel and buttonView to prevent them from touching.

The lessThanOrEqualTo constraint correctly prevents overlap, but there's no gap between the title and button. On screens where the title nearly fills the available width, the two elements could visually touch.

♻️ Suggested fix
 titleLabel.snp.makeConstraints { make in
     make.top.leading.equalTo(layoutMarginsGuide)
-    make.trailing.lessThanOrEqualTo(buttonView.snp.leading)
+    make.trailing.lessThanOrEqualTo(buttonView.snp.leading).offset(-8)
 }
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@Eatery` Blue/UI/EateryScreen/MenuHeaderView.swift around lines 102 - 106, In
setUpConstraints the titleLabel’s trailing uses
make.trailing.lessThanOrEqualTo(buttonView.snp.leading) which prevents overlap
but allows the views to touch; update the constraint on titleLabel (in
setUpConstraints) to add a horizontal gap (e.g., apply a negative offset/inset
or constant such as -8 or -12) from buttonView.snp.leading so there is
consistent spacing between titleLabel and buttonView and the label truncates
before touching the button.
Eatery Blue/UI/HomeScreen/HomeViewController.swift (1)

124-124: Consider extracting the magic number to a named constant.

The + 25 offset works to align with the CompareMenusButton inset, but the inline comment // 108 is ambiguous—it's unclear whether it represents the target total or a historical value. For clarity and maintainability, consider adding a named constant in Constants:

♻️ Suggested refactor
 enum Constants {
     static let carouselViewLayoutMargins = UIEdgeInsets(top: 6, left: 0, bottom: 6, right: 0)
     static let customViewLayoutMargins = UIEdgeInsets(top: 6, left: 0, bottom: 6, right: 0)
     static let minHeaderHeight: CGFloat = 44
     static let maxHeaderHeight: CGFloat = 98
     static let loadingHeaderHeight: CGFloat = maxHeaderHeight + 52
     static let collectionViewTopPadding: CGFloat = 8
     static let collectionViewSectionPadding: CGFloat = 16
+    static let collectionViewBottomExtraPadding: CGFloat = 25 // Extra padding to clear CompareMenusButton
     static let isTesting = false
 }

Then at line 124:

-        collectionView.contentInset.bottom = (tabBarController?.tabBar.frame.height ?? 0) + 25 // 108
+        collectionView.contentInset.bottom = (tabBarController?.tabBar.frame.height ?? 0) + Constants.collectionViewBottomExtraPadding
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@Eatery` Blue/UI/HomeScreen/HomeViewController.swift at line 124, Replace the
magic "+ 25" in the collection view bottom inset with a named constant to
clarify intent: introduce a constant (e.g., CompareMenusButton.bottomInset or
HomeViewConstants.compareMenusButtonInset) in your Constants file and use it in
the expression that sets collectionView.contentInset.bottom (the line using
tabBarController?.tabBar.frame.height). Remove or update the ambiguous "// 108"
comment so the constant name documents the purpose (aligning with
CompareMenusButton) and update any references to keep behavior identical.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@Eatery` Blue/UI/EateryScreen/MenuHeaderView.swift:
- Around line 102-106: In setUpConstraints the titleLabel’s trailing uses
make.trailing.lessThanOrEqualTo(buttonView.snp.leading) which prevents overlap
but allows the views to touch; update the constraint on titleLabel (in
setUpConstraints) to add a horizontal gap (e.g., apply a negative offset/inset
or constant such as -8 or -12) from buttonView.snp.leading so there is
consistent spacing between titleLabel and buttonView and the label truncates
before touching the button.

In `@Eatery` Blue/UI/HomeScreen/HomeViewController.swift:
- Line 124: Replace the magic "+ 25" in the collection view bottom inset with a
named constant to clarify intent: introduce a constant (e.g.,
CompareMenusButton.bottomInset or HomeViewConstants.compareMenusButtonInset) in
your Constants file and use it in the expression that sets
collectionView.contentInset.bottom (the line using
tabBarController?.tabBar.frame.height). Remove or update the ambiguous "// 108"
comment so the constant name documents the purpose (aligning with
CompareMenusButton) and update any references to keep behavior identical.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 9e95eb74-3e68-4353-b8af-f4104f765b3d

📥 Commits

Reviewing files that changed from the base of the PR and between 1da0fe1 and 8abaf07.

📒 Files selected for processing (2)
  • Eatery Blue/UI/EateryScreen/MenuHeaderView.swift
  • Eatery Blue/UI/HomeScreen/HomeViewController.swift

Copy link
Copy Markdown
Contributor

@MrPeterss MrPeterss left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice work! Looks great, Amy!

Copy link
Copy Markdown

@JiwonJeong414 JiwonJeong414 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks great Amy nice job!

@aly-cloud aly-cloud merged commit 86f74ab into main Apr 19, 2026
6 checks passed
@aly-cloud aly-cloud deleted the amy-uifixes branch April 19, 2026 16:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants