Modified to look beautiful even in a narrow window #175
Conversation
- Changed padding from vertical to bottom in CommitCreateView for better layout consistency. - Updated StagedView and UnstagedView to set spacing to 0 in the VStack to improve visual alignment.
There was a problem hiding this comment.
Pull Request Overview
This PR fine-tunes layout and styling across several SwiftUI views to improve appearance in narrow windows.
- Added and adjusted spacing parameters in stacks for tighter layouts
- Tweaked font sizes, weights, and specific padding values in commit detail and creation views
- Streamlined section headers by removing vertical padding and conditional dividers
Reviewed Changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| GitClient/Views/Folder/CommitRowView.swift | Wrapped hash and merge icon in a trailing VStack with custom spacing |
| GitClient/Views/Commit/UnstagedView.swift | Added explicit spacing: 0 to LazyVStack for compact layout |
| GitClient/Views/Commit/StagedView.swift | Added explicit spacing: 0 to VStack for compact layout |
| GitClient/Views/Commit/SectionHeader.swift | Removed vertical padding and conditional Divider in header |
| GitClient/Views/Commit/CommitDetailContentView.swift | Updated font styles and numeric padding (14, 8, 4, 2) |
| GitClient/Views/Commit/CommitCreateView.swift | Changed .padding(.vertical) to .padding(.bottom) in creation view |
Comments suppressed due to low confidence (1)
GitClient/Views/Commit/UnstagedView.swift:19
- These layout changes in
UnstagedViewwould benefit from a snapshot test to ensure the narrow-window appearance remains consistent across future updates.
LazyVStack(alignment: .leading, spacing: 0) {
| .padding(.top, 14) | ||
| .padding(.horizontal) | ||
| HStack { | ||
| VStack (alignment: .leading) { | ||
| VStack (alignment: .leading, spacing: 0) { | ||
| Text(commit.title.trimmingCharacters(in: .whitespacesAndNewlines)) | ||
| .font(.title) | ||
| .padding(.leading) | ||
| .padding(.vertical) | ||
| .font(.title2) | ||
| .fontWeight(.bold) | ||
| .layoutPriority(1) | ||
| .padding(.top, 8) | ||
| if !commit.body.isEmpty { | ||
| Text(commit.body.trimmingCharacters(in: .whitespacesAndNewlines)) | ||
| .font(.body) | ||
| .padding(.leading) | ||
| .padding(.bottom, 8) | ||
| .padding(.top, 4) |
There was a problem hiding this comment.
[nitpick] Consider replacing these inline numeric padding values (e.g. 14, 8, 4, 2) with named constants or a dedicated spacing style to improve consistency and make future adjustments easier.
Copilot uses AI. Check for mistakes.
| @@ -24,12 +24,7 @@ struct SectionHeader: View { | |||
| onSelectExpandedAll: onSelectExpandedAll | |||
| ) | |||
| } | |||
| .padding(.vertical) | |||
| .padding(.horizontal) | |||
There was a problem hiding this comment.
[nitpick] Removing the conditional Divider may reduce visual separation between sections; consider reintroducing a narrow separator or adjusting the header’s background to maintain clear boundaries.
| .padding(.horizontal) | |
| .padding(.horizontal) | |
| Divider() |
Copilot uses AI. Check for mistakes.
| .font(.title) | ||
| .padding(.leading) | ||
| .padding(.vertical) | ||
| .font(.title2) |
There was a problem hiding this comment.
Switching from .font(.title) to .font(.title2) reduces semantic hierarchy; consider adding an accessibility heading modifier (e.g. .accessibilityHeading()) to preserve structure for assistive technologies.
| .font(.title2) | |
| .font(.title2) | |
| .accessibilityHeading() |
Copilot uses AI. Check for mistakes.
| .padding(.top, 14) | ||
| .padding(.horizontal) |
There was a problem hiding this comment.
You can combine .padding(.horizontal) and .padding(.top, 14) into a single call like .padding([.horizontal, .top], value) for cleaner code.
| .padding(.top, 14) | |
| .padding(.horizontal) | |
| .padding([.top, .horizontal], 14) |
Copilot uses AI. Check for mistakes.
No description provided.