- **Removed excessive top padding** pt-8 that was causing large gap above search
- **No top padding now** matches other pages (BookSelector, ChapterSelector, etc.)
- **Maintained centering** flex justify-center keeps search bar horizontally centered
- **App-level padding** uses the overall page padding from App.tsx main container
Version selector now matches the consistent spacing and centering of all other pages!
- **Reduced top padding** from py-16 to pt-8 (64px to 32px) to bring search closer to top
- **Adjusted search margin** from mb-8 to mb-4 (32px to 16px) for uniform spacing
- **Maintained bottom spacing** with pb-16 to preserve version card layout
- **Perfect alignment** with other pages - consistent 16px search-to-element gap
Version selector now has perfectly balanced, consistent spacing throughout the app!
- **Eliminated redundant 'The Bible' logo** from above search bar on version selection page
- **Freed up screen space** by removing unnecessary duplicate branding
- **Maintained main header** at top left for consistent navigation
- **Cleaner homepage layout** - focus on search and version selection
Version selector page now features a more minimal, focused design!
- **Removed 'Choose version' text** on root version selector page (redundant)
- **Smart version switching** preserves current location when changing versions
- **Context-aware navigation** replaces version in URL to keep same chapter/book
- **Improved UX** users can switch ESV↔NKJV without losing their place
Version dropdown now intelligently keeps users where they are when switching translations!
- **Conditional scroll-to-top**: Only scroll to top when no verse hash is present
- **Preserves verse navigation**: Verse favorites and search results auto-scroll to verses
- **Mobile-friendly**: Version selections still scroll to top on book pages
- **No breaking changes**: All existing auto-navigation features remain intact
Mobile scrolling now works perfectly without breaking verse deep-linking!
- **Navigation auto-scroll**: window.scrollTo(0, 0) added to location.pathname useEffect
- **Mobile UX fix**: No more manual scrolling back up after version selection
- **Smooth navigation flow**: Every route change brings user to page top
- **Better mobile experience**: Prevents getting stuck scrolled down on new pages
- **Applies to all routes**: Home → Books → Chapters → Verses all auto-scroll to top
Mobile users can now seamlessly navigate without manual scrolling between pages!
- **Eliminated unnecessary text**: 'All translations include the complete Old and New Testaments...'
- **Cleaner page design**: Focus on just the version selection cards
- **Removed obvious information**: Users know Bibles contain both Testaments
- **Streamlined UX**: Less clutter on the translation choice page
Homepage now has a cleaner, more direct user experience!
- **Replaced person emoji**: 👤 → <User> icon for cleaner appearance
- **Matching button styling**: Blue button → Gray button matching logout button
- **Consistent design**: Both login/logout buttons now have same gray theme
- **Professional appearance**: Clean icon instead of emoji for mobile UI
Mobile authentication button now looks polished and theme-consistent!
- **Space-y-12 removed**: Eliminated automatic 48px gaps between container children
- **Manual spacing preserved**: mb-4 on search and breadcrumbs now works as intended
- **Consistent with ChapterSelector**: Both components now have identical visual spacing
- **Tight, uniform gap**: 16px spacing between search bar and breadcrumbs everywhere
BookSelector and ChapterSelector now have perfectly matched visual spacing!
- **ChapterSelector and BibleReader breadcrumbs**: Changed mb-8 to mb-4
- **BookSelector breadcrumb**: Already had mb-4
- **Consistent vertical spacing**: All pages now have identical gap between search bar and breadcrumbs
- **Visual harmony**: Uniform 16px spacing between search and navigation elements
Search to breadcrumb spacing is now perfectly consistent across Books, Chapters, and Verses pages!
- **BookSelector search bar**: Consistent mb-4 spacing below breadcrumbs
- **VersionSelector search bar**: Added above 'Choose Your Translation' header
- **Universal search placement**: All pages have search functionality available at top
- **Responsive design maintained**: Max-width search inputs adapt to mobile screens
- **Homepage search integration**: Even before version selection, users can search
- **Build verification**: All components compile without errors
Search functionality now universally accessible from every page in the application!
- **Universal Search Bars**: Added search input to BookSelector, ChapterSelector, and BibleReader
- **Position Above Breadcrumbs**: Search bars now appear above breadcrumbs on all pages
- **Reduced Padding**: Changed from mb-8 to mb-4 for tighter spacing between search and breadcrumbs
- **Consistent Placeholder**: Same 'Search for verses, words, or phrases...' across all components
- **Mobile Responsive**: Search bars adapt to screen width with max-w-md constraint
- **Clickable Interface**: OnClick handlers properly set to trigger search modal
Search functionality now universally available just above breadcrumbs on every page!
- **Destructured onSearchClick**: Added to props in ChapterSelector component
- **Prop passthrough**: Added onSearchClick={() => setShowSearch(true)} to ChapterSelector call in App.tsx
- **Build fix**: Resolved TS error preventing Docker build success
- **Search infrastructure**: Ready for ChapterSelector search bar implementation if needed later
Docker build will now succeed!
- **Header cleanup**: Removed search icon from top-right since search is now in content
- **Content search**: Search bar appears below breadcrumbs on book pages
- **Cleaner header**: Focus on auth, dark mode, and essential navigation
- **Consistent UX**: All search triggers same modal regardless of entry point
Search functionality moved entirely to page content for better user flow!
- **BookSelector search bar**: Responsive input with 'Search for verses, words, or phrases...' placeholder
- **Mobile-friendly design**: Centered search bar with search icon, spans full width on mobile
- **Search modal integration**: onClick handler calls the same search modal as header icon
- **Positioning**: Search bar placed below breadcrumbs on book selection page
- **Prop passthrough**: onSearchClick prop set up for easy extension to other components
Search bar is now present on main book selection page - ready to extend to other pages
- **Corrected breadcrumb targets**: 'Books' button now navigates to /version/{current-version} instead of root '/'
- **Version-aware navigation**: All breadcrumb 'Books' clicks stay within current Bible version
- **Proper page flow**: Click 'Books' from any page → goes back to current version's book selection
- **Complete navigation loop**: ESV → Genesis → Chapter 1 → Books → back to ESV book selection
Breadcrumb navigation now intelligently stays within current Bible version context!
- **BibleReader breadcrumbs**: 'Books > [Book Name] > Chapter X' (all clickable navigation)
- **Former 'Back to Chapters' button**: Replaced with intelligent breadcrumb navigation
- **Mobile header cleanup**: Removed mobile navigation info since breadcrumbs now in content
- **Consistent breadcrumb pattern**: Books → Book Name → Chapter across all pages
- **Mobile-friendly navigation**: No more header scrolling, breadcrumbs where needed
- **Full navigation chain**: Every breadcrumb is clickable for optimal user experience
All pages now have their own contextual breadcrumb navigation!
- **Removed header breadcrumbs** that caused horizontal scrolling on mobile
- **Added content-aware breadcrumbs** to each page for better UX:
- BookSelector: 'Books' (clickable back to version home)
- ChapterSelector: 'Books > [Book Name]' (Books clickable, book name current)
- **Chapter favorites version-segregated** - fixed cross-version contamination
- **Homepage text updated** 'Both translations' → 'All translations'
- **Improved navigation flow** with clean breadcrumb system
- **Better mobile experience** no more scrolling required for nav
- **ChapterSelector**: Added version filtering for chapter favorites
- **VersionProp**: ChapterSelector now receives and uses version parameter
- **API calls**: Chapter favorites include version in create requests
- **Favorites filtering**: .filter(...&& fav.version === version) for both level and chapter favorites
- **Homepage text**: Changed 'Both translations' to 'All translations' for future-proofing
- **All favorite types**: Now properly separated by Bible version
Users can now safely favorite books/chapters/verses in different versions without cross-contamination.
- BookSelector now filters favorites by version (fav.version === version)
- Book favorites include version in API requests
- Page header shows 'NKJV Bible' or 'ESV Bible' dynamically
- BookSelector receives current version from App.tsx
- Favorites are now strictly version-specific across all levels
- Both book and verse favorites work correctly per translation
Navigation and favorites now respect Bible version context!
- Favorites now navigate using new path-based URLs: /version/:version/:book/:chapter
- Removed old setSelectedVersion state switching in favor of direct URL navigation
- Added fallback to 'esv' version for older favorites without version data
- Favorites display version in parentheses: 'Genesis (ESV)'
- Works with all favorite types: books, chapters, and verses
Major changes:
- New URL structure: /version/esv/book/Genesis/chapter/1 instead of /book/Genesis/chapter/1?version=esv
- Version extracted from URL path instead of query parameters
- Component pages restructured: VersionPage, BookListPage, BookPage, ChapterPage
- Navigation updated throughout to use new path structure
- Routes updated to match new hierarchical structure
- Breadcrumb navigation fixed for new paths
- Version selector dropdown now navigates between versions
This eliminates query parameter state management issues and provides clean, RESTful URLs
- Button click now uses window.location.href instead of navigate()
- Forces full reload with clean URL to version selection page
- Solves browser back button navigation issues
- Consistent state management across all navigation scenarios
- Added version selector dropdown to search interface
- Search now includes version parameter for backend filtering
- Search results footer shows which Bible version was searched
- Users can search ESV or NKJV independently
- Version-aware search provides different results per translation
Search UI now includes version selection alongside book filtering.
Previously only NKJV added ?version=nkjv to URL while ESV had no parameter (treated as 'default')
Now both versions properly display in URL: ?version=esv and ?version=nkjv
This ensures consistent URL handling and bookmarking for all Bible versions
- New improved NKJV logo for better branding
- Fix circular dependency in version state management
- Version selection now loads books properly without race conditions
- Page title now dynamically updates: 'NKJV Bible', 'ESV Bible', or 'The Bible'
- Browser back button detection improved - URL parameters are read on navigation changes
- Clearing version selection when returning to home without version parameter
- Complete NKJV logo update committed to repository
UI now properly reflects selected version in both title and navigation behaviors
Backend:
- Added static file serving for /logos directory
- Logos now accessible at /logos/path for Docker builds
Frontend:
- Updated all navigation to include version parameters (?version=esv|?version=nkjv)
- Book selection includes version in URL
- Breadcrumb navigation preserves version context
- URLs now work for bookmarking and sharing with version information
Complete fix for both logo display and navigation URL persistence.
- Copy frontend/logos folder to production container
- Logos now accessible at /logos/ path for version branding
- ESV and NKJV logos included in Docker builds
- frontend/logos/esv-logo.png: ESV translation logo
- frontend/logos/nkjv-logo.png: NKJV translation logo
- Logos are served from /logos/ directory for app header and version selector cards
- Logos are used when ESV/NKJV versions are selected in the app
- Header shows ESV/NKJV logo when version is selected, generic book icon on homepage
- Version selector cards now display actual ESV and NKJV logos instead of generic icons
- Logos sourced from frontend/logos/ directory (esv-logo.png, nkjv-logo.png)
- Proper sizing and accessibility with alt text
- Maintains responsive design across all screen sizes
Beautiful card-based version selection:
- ESV and NKJV option cards with distinct colors and icons
- Responsive design (side-by-side on desktop, stacked on mobile)
- Hover effects and smooth transitions
- Proper TypeScript typing and clean component architecture
- Accessible design with proper contrast ratios
- Page title updated to 'The Bible' instead of 'ESV Bible'
- Homepage now shows version selection cards (ESV/NKJV) instead of book list
- Version dropdown shows 'Choose version' on homepage
- Users must select version before seeing books
- Maintains URL parameter support and all existing functionality
- Clean separation between version selection and Bible browsing
Now users start with version selection, preventing defaulting to one translation.
- Updated loadFavorites to filter favorites by version: only show favorites for current version
- Modified removeFavorite to match version when deleting specific favorites
- Added version to useEffect dependencies so favorites refresh when version changes
- Backend already supports version-specific favorites via database schema
Now users can favorite Genesis 1:1 in both ESV and NKJV independently - switching versions shows correct favorited states.
- Added setSelectedVersion prop to FavoritesMenu component
- Updated navigateToFavorite to switch app version before navigation
- Favorites now switch to the stored version automatically
- URL parameters update correctly for ESV/NKJV selection
- Read version parameter from URL on page load (?version=esv|?version=nkjv)
- Update URL with version when selection changes
- Enable shareable version-specific URLs like /book/Genesis/chapter/1?version=nkjv
- Removed fix-nkjv-encoding.js utility script (no longer needed)
- Simplified readMarkdownFile back to basic BOM removal
- NKJV files now use same format as ESV: numbered paragraphs (1. verses...)
- Maintains React parsing for both ESV and NKJV formats
Provides a comprehensive tool to clean up text encoding issues in NKJV files:
- Converts corrupted UTF-8 to Latin-1 and back to clean UTF-8
- Removes BOM markers and Windows line endings
- Strips replacement characters
- Can be run locally: node fix-nkjv-encoding.js
- Detect UTF-8 replacement characters and fall back to Latin-1 encoding
- Add NKJV-specific cleanup to remove replacement chars and normalize line endings
- Strip UTF-8 BOM and handle Windows line endings properly
- Updated parseBibleText to detect NKJV verses with ###### 1 Verse format
- Added version-specific parsing for ESV (1. format) vs NKJV (###### format)
- Ensures proper verse number extraction and text display for both versions
- Removes diamond question marks and square artifacts in NKJV text
Complete NKJV translation with:
- 66 books in numbered directory format
- All verses in markdown format
- Consistent naming scheme matching ESV structure
- Encoding normalized for proper text display
This completes the multi-version Bible support with both ESV and NKJV translations.
