Fixed search box centering consistency - removed redundant container wrapper

- **Eliminated duplicate container** from VersionSelector component
- **Matches other page structures** - all pages now use App's main container
- **Consistent centering across all pages** - search bar positioned identically
- **No more shifting** when navigating between version selector and book selector

Version selector layout now perfectly matches BookSelector, ChapterSelector, BibleReader!
This commit is contained in:
Ryderjj89
2025-09-28 17:25:02 -04:00
parent fea95a715e
commit 6ae55009e7

View File

@@ -1,5 +1,5 @@
import React from 'react';
import { Book, Users, Search } from 'lucide-react';
import { Search } from 'lucide-react';
interface VersionSelectorProps {
onVersionSelect: (version: 'esv' | 'nkjv') => void;
@@ -9,8 +9,6 @@ interface VersionSelectorProps {
const VersionSelector: React.FC<VersionSelectorProps> = ({ onVersionSelect, onSearchClick }) => {
return (
<div>
{/* Version Selection */}
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 pb-16">
{/* Search Bar */}
<div className="flex justify-center mb-4">
<div className="w-full max-w-md relative">
@@ -25,6 +23,7 @@ const VersionSelector: React.FC<VersionSelectorProps> = ({ onVersionSelect, onSe
</div>
</div>
{/* Version Selection */}
<div className="text-center mb-12">
<h2 className="text-3xl font-bold text-gray-900 dark:text-gray-100 mb-4">
Choose Your Translation
@@ -82,7 +81,6 @@ const VersionSelector: React.FC<VersionSelectorProps> = ({ onVersionSelect, onSe
</div>
</div>
</div>
</div>
);
};