Skip to content

Simplify pagination layout to match Spotify/standard app design#663

Merged
Alexzafra13 merged 1 commit intomainfrom
claude/fix-artist-images-albums-01QC8rZWbCpeBQdFTAGVighT
Nov 23, 2025
Merged

Simplify pagination layout to match Spotify/standard app design#663
Alexzafra13 merged 1 commit intomainfrom
claude/fix-artist-images-albums-01QC8rZWbCpeBQdFTAGVighT

Conversation

@Alexzafra13
Copy link
Copy Markdown
Owner

Major simplification:

  • Remove all complex flexbox layouts (flex: 1 0 auto, justify-content: space-between, etc)
  • Remove min-height constraints on grids that caused empty space
  • Use simple margin-top for pagination spacing (48px desktop, 32px mobile)
  • Standardize bottom padding: 120px desktop, 180px mobile for player space

Desktop:

  • padding-bottom: 120px (consistent across all pages)
  • pagination margin-top: 48px

Mobile (768px):

  • padding-bottom: 180px (for player + bottom nav)
  • pagination margin-top: 32px

This matches how Spotify and other apps handle player spacing:

  1. Fixed bottom padding for the player
  2. Simple pagination spacing with margin-top
  3. No complex positioning - just natural flow

Applied to:

  • AlbumsPage
  • RadioPage
  • ArtistPlaylistsPage

Major simplification:
- Remove all complex flexbox layouts (flex: 1 0 auto, justify-content: space-between, etc)
- Remove min-height constraints on grids that caused empty space
- Use simple margin-top for pagination spacing (48px desktop, 32px mobile)
- Standardize bottom padding: 120px desktop, 180px mobile for player space

Desktop:
- padding-bottom: 120px (consistent across all pages)
- pagination margin-top: 48px

Mobile (768px):
- padding-bottom: 180px (for player + bottom nav)
- pagination margin-top: 32px

This matches how Spotify and other apps handle player spacing:
1. Fixed bottom padding for the player
2. Simple pagination spacing with margin-top
3. No complex positioning - just natural flow

Applied to:
- AlbumsPage
- RadioPage
- ArtistPlaylistsPage
@Alexzafra13 Alexzafra13 merged commit 0c1ecea into main Nov 23, 2025
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.

2 participants