Add central layout.tsx for /learn/* and /parent/* routes

Next.js route-level layouts provide Sidebar + gradient background
automatically for all sub-pages. Individual pages no longer need
their own wrapper divs or Sidebar imports.

- learn/layout.tsx: Sidebar + purple gradient for all learning pages
- parent/layout.tsx: Same for all parent portal pages
- LearnLayout.tsx: Reusable component for other pages
- Fixed broken <LearnLayout>}> artifacts from previous refactoring
- Removed duplicate Sidebar/wrapper code from 9 sub-pages

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Benjamin Admin
2026-04-26 20:44:40 +02:00
parent 3619ddfdad
commit 6210ceb05e
13 changed files with 99 additions and 11 deletions

View File

@@ -5,6 +5,7 @@ import { useParams, useRouter } from 'next/navigation'
import { useTheme } from '@/lib/ThemeContext'
import { useLanguage } from '@/lib/LanguageContext'
import { AudioButton } from '@/components/learn/AudioButton'
import { LearnLayout } from '@/components/learn/LearnLayout'
interface QAItem {
id: string; question: string; answer: string
@@ -65,7 +66,7 @@ export default function ParentQuizPage() {
const nativeTranslation = currentItem?.translations?.[language]?.text || ''
if (isLoading) {
return <div className={`min-h-screen flex items-center justify-center ${isDark ? 'bg-gradient-to-br from-slate-900 via-blue-900 to-indigo-900' : 'bg-gradient-to-br from-blue-50 via-indigo-50 to-purple-50'}`}>
return <LearnLayout>
<div className="w-8 h-8 border-4 border-blue-400 border-t-transparent rounded-full animate-spin" />
</div>
}