RyderTech/the-bible
1
0
Fork 0
Code Issues Pull Requests Packages Activity

Add CSB version support to version selector, app routing, and Dockerfile

Browse Source
This commit is contained in:
Ryderjj89
2025-09-29 09:18:41 -04:00
parent 337294ff97
commit 2bb34ccd49
1192 changed files with 78755 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/App.tsx
View File

@@ -37,7 +37,7 @@ function App() {
// Extract version from URL path on mount and when location changes
useEffect(() => {
const pathParts = location.pathname.split('/').filter(Boolean);
if (pathParts[0] === 'version' && (pathParts[1] === 'esv' || pathParts[1] === 'nkjv' || pathParts[1] === 'nlt')) {
if (pathParts[0] === 'version' && (pathParts[1] === 'esv' || pathParts[1] === 'nkjv' || pathParts[1] === 'nlt' || pathParts[1] === 'csb')) {
setSelectedVersion(pathParts[1]);
} else if (location.pathname === '/') {
// At root path, no version is selected
@@ -261,7 +261,7 @@ function App() {
// Component for the version selection page (root)
const VersionPage = () => {
const handleVersionSelect = (version: 'esv' | 'nkjv' | 'nlt') => {
const handleVersionSelect = (version: 'esv' | 'nkjv' | 'nlt' | 'csb') => {
navigate(`/version/${version}`);
};

30
frontend/src/components/VersionSelector.tsx
View File

@@ -2,7 +2,7 @@ import React from 'react';
import { Search } from 'lucide-react';
interface VersionSelectorProps {
onVersionSelect: (version: 'esv' | 'nkjv' | 'nlt') => void;
onVersionSelect: (version: 'esv' | 'nkjv' | 'nlt' | 'csb') => void;
onSearchClick?: () => void;
}
@@ -81,11 +81,11 @@ const VersionSelector: React.FC<VersionSelectorProps> = ({ onVersionSelect, onSe
</div>
</div>
{/* NLT Row (below the grid) */}
<div className="flex justify-center mt-6">
{/* NLT and CSB Row (below the grid) */}
<div className="grid md:grid-cols-2 gap-8 max-w-2xl mx-auto mt-6">
<div
onClick={() => onVersionSelect('nlt')}
className="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-md hover:shadow-lg transition-all duration-200 cursor-pointer transform hover:-translate-y-1 w-full max-w-md"
className="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-md hover:shadow-lg transition-all duration-200 cursor-pointer transform hover:-translate-y-1"
>
<div className="p-6">
<div className="flex flex-col items-center text-center">
@@ -104,6 +104,28 @@ const VersionSelector: React.FC<VersionSelectorProps> = ({ onVersionSelect, onSe
</div>
</div>
</div>
<div
onClick={() => onVersionSelect('csb')}
className="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-md hover:shadow-lg transition-all duration-200 cursor-pointer transform hover:-translate-y-1"
>
<div className="p-6">
<div className="flex flex-col items-center text-center">
<div className="w-16 h-16 mb-3 flex items-center justify-center">
<img src="/logos/csb-logo.png" alt="CSB Logo" className="max-w-full max-h-full" />
</div>
<h3 className="text-xl font-bold text-gray-900 dark:text-gray-100 mb-2">
CSB
</h3>
<p className="text-gray-600 dark:text-gray-400 mb-3">
Christian Standard Bible
</p>
<p className="text-sm text-gray-500 dark:text-gray-400">
Faithful to the original languages with modern clarity
</p>
</div>
</div>
</div>
</div>
</div>
);