feat: thème éducatif natif Gradio + traduction UI FR/EN dynamique

app.py

@@ -11,6 +11,47 @@ from core.chunker import chunk_text
 from core.questioner import generate_question
 from core.evaluator import evaluate_answer
 
+# ---------------------------------------------------------------------------
+# Internationalisation
+# ---------------------------------------------------------------------------
+
+UI = {
+    "English": {
+        "load_btn":          "Load PDF",
+        "new_q_btn":         "New Question",
+        "submit_btn":        "Submit Answer",
+        "pdf_label":         "📎 Course PDF",
+        "status_label":      "Status",
+        "question_label":    "❓ Question",
+        "answer_label":      "✏️ Your Answer",
+        "answer_ph":         "Write your answer here…",
+        "feedback_label":    "💬 Feedback",
+        "no_file":           "No file selected.",
+        "no_chunks":         "PDF loaded but no text found (scanned or too short?).",
+        "loaded":            lambda n: f"📚 {n} sections extracted — ready to generate questions!",
+        "no_pdf":            "⚠️ Please upload a PDF first.",
+        "no_question":       "⚠️ Generate a question first.",
+        "no_answer":         "⚠️ Please write an answer before submitting.",
+    },
+    "Français": {
+        "load_btn":          "Charger le PDF",
+        "new_q_btn":         "Nouvelle question",
+        "submit_btn":        "Valider la réponse",
+        "pdf_label":         "📎 Cours PDF",
+        "status_label":      "Statut",
+        "question_label":    "❓ Question",
+        "answer_label":      "✏️ Ta réponse",
+        "answer_ph":         "Écris ta réponse ici…",
+        "feedback_label":    "💬 Feedback",
+        "no_file":           "Aucun fichier sélectionné.",
+        "no_chunks":         "PDF chargé mais aucun texte trouvé (scanné ou trop court ?).",
+        "loaded":            lambda n: f"📚 {n} sections extraites — prêt à générer des questions !",
+        "no_pdf":            "⚠️ Charge d'abord un PDF.",
+        "no_question":       "⚠️ Génère d'abord une question.",
+        "no_answer":         "⚠️ Écris une réponse avant de valider.",
+    },
+}
+
 # ---------------------------------------------------------------------------
 # State helpers
 # ---------------------------------------------------------------------------
@@ -27,9 +68,24 @@ def _score_label(correct: int, total: int) -> str:
     return f"✅ {correct} / {total}" if total > 0 else "—"
 
 
-def load_pdf(pdf_file):
+def update_ui_language(language):
+    s = UI[language]
+    return (
+        gr.update(value=s["load_btn"]),
+        gr.update(value=s["new_q_btn"]),
+        gr.update(value=s["submit_btn"]),
+        gr.update(label=s["pdf_label"]),
+        gr.update(label=s["status_label"]),
+        gr.update(label=s["question_label"]),
+        gr.update(label=s["answer_label"], placeholder=s["answer_ph"]),
+        gr.update(label=s["feedback_label"]),
+    )
+
+
+def load_pdf(pdf_file, language):
+    s = UI[language]
     if pdf_file is None:
-        return [], "Aucun fichier sélectionné.", 0, 0
+        return [], s["no_file"], 0, 0
     try:
         text = extract_text(pdf_file.name)
         chunks = chunk_text(text)
@@ -38,14 +94,15 @@ def load_pdf(pdf_file):
     except Exception as e:
         return [], f"Erreur inattendue : {e}", 0, 0
     if not chunks:
-        return [], "PDF chargé mais aucun contenu textuel trouvé (document trop court ou scanné ?).", 0, 0
-    return chunks, f"📚 {len(chunks)} sections extraites — prêt à générer des questions !", 0, 0
+        return [], s["no_chunks"], 0, 0
+    return chunks, s["loaded"](len(chunks)), 0, 0
 
 
 @spaces.GPU(duration=60)
 def new_question(chunks, language):
+    s = UI[language]
     if not chunks:
-        return "", "", "⚠️ Charge d'abord un PDF."
+        return "", "", s["no_pdf"]
     try:
         chunk = random.choice(chunks)
         question = generate_question(chunk, language=language)
@@ -56,10 +113,11 @@ def new_question(chunks, language):
 
 @spaces.GPU(duration=120)
 def submit_answer(question, chunk, student_answer, correct, total, language):
+    s = UI[language]
     if not question:
-        return "⚠️ Génère d'abord une question.", correct, total, _score_label(correct, total)
+        return s["no_question"], correct, total, _score_label(correct, total)
     if not student_answer.strip():
-        return "⚠️ Écris une réponse avant de valider.", correct, total, _score_label(correct, total)
+        return s["no_answer"], correct, total, _score_label(correct, total)
     try:
         feedback = evaluate_answer(question, chunk, student_answer, language=language)
         total += 1
@@ -71,140 +129,126 @@ def submit_answer(question, chunk, student_answer, correct, total, language):
 
 
 # ---------------------------------------------------------------------------
-# Custom CSS — style Lumni (fond blanc, orange + bleu marine, Nunito)
+# Thème éducatif
 # ---------------------------------------------------------------------------
 
-CSS = """
-@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap');
-
-* { font-family: 'Nunito', sans-serif !important; }
-:root {
-    color-scheme: light !important;
-    /* Override variables Gradio Soft */
-    --block-background-fill: #FFFFFF !important;
-    --panel-background-fill: #FFFFFF !important;
-    --background-fill-primary: #FFF5D6 !important;
-    --background-fill-secondary: #FFFFFF !important;
-    --input-background-fill: #FFFEF8 !important;
-    --block-border-color: #E8DFB8 !important;
-    --border-color-primary: #E8DFB8 !important;
-    --color-accent: #F96A0A !important;
-    --button-primary-background-fill: #F96A0A !important;
-    --button-secondary-background-fill: #3D3BD6 !important;
-}
-
-/* Fond beige Lumni */
-body, .gradio-container { background: #FFF5D6 !important; }
-
-/* Neutralise le rendu "chip" des labels du thème Soft */
-label > span {
-    background: transparent !important;
-    color: #3D3BD6 !important;
-    font-weight: 700 !important;
-    font-size: 0.9rem !important;
-    padding: 0 !important;
-    border-radius: 0 !important;
-    box-shadow: none !important;
-    text-transform: none !important;
-    letter-spacing: normal !important;
-}
+edu_theme = gr.themes.Base(
+    font=gr.themes.GoogleFont("Nunito"),
+    font_mono=gr.themes.GoogleFont("Nunito"),
+).set(
+    # Fond général
+    body_background_fill="#FFF8DC",
+    body_text_color="#1A1A2E",
+    # Cards
+    block_background_fill="#FFFFFF",
+    block_border_color="#F0E0A0",
+    block_border_width="2px",
+    block_radius="18px",
+    block_shadow="0 2px 16px rgba(0,0,0,0.07)",
+    block_label_text_color="#3D3BD6",
+    block_label_text_size="sm",
+    block_label_text_weight="700",
+    # Inputs
+    input_background_fill="#FFFEF5",
+    input_border_color="#F0E0A0",
+    input_radius="12px",
+    # Boutons primary (orange)
+    button_primary_background_fill="#F96A0A",
+    button_primary_background_fill_hover="#D95800",
+    button_primary_text_color="#FFFFFF",
+    button_primary_border_color="#F96A0A",
+    button_large_radius="50px",
+    button_large_padding="12px 28px",
+    button_large_text_weight="800",
+    button_large_text_size="md",
+    # Boutons secondary (bleu)
+    button_secondary_background_fill="#3D3BD6",
+    button_secondary_background_fill_hover="#2B29A8",
+    button_secondary_text_color="#FFFFFF",
+    button_secondary_border_color="#3D3BD6",
+    # Panel
+    panel_background_fill="#FFFFFF",
+    panel_border_color="#F0E0A0",
+    # Slider / Radio
+    color_accent="#F96A0A",
+    color_accent_soft="#FFF3E8",
+)
 
-/* Boutons pilule */
-button.lg {
-    border-radius: 50px !important;
-    font-weight: 800 !important;
-    font-size: 1rem !important;
-    transition: all 0.15s ease !important;
-}
-button.primary { background: #F96A0A !important; color: #fff !important; border: none !important; }
-button.primary:hover { background: #D95800 !important; transform: translateY(-1px) !important; box-shadow: 0 6px 14px rgba(249,106,10,0.3) !important; }
-button.secondary { background: #3D3BD6 !important; color: #fff !important; border: none !important; }
-button.secondary:hover { background: #2B29A8 !important; transform: translateY(-1px) !important; box-shadow: 0 6px 14px rgba(61,59,214,0.25) !important; }
-
-/* Inputs */
-textarea, input[type=text] {
-    border-radius: 12px !important;
-    border: 2px solid #E8DFB8 !important;
-    background: #FFFEF8 !important;
-    color: #1A1A2E !important;
-    font-size: 0.97rem !important;
-}
-textarea:focus { border-color: #F96A0A !important; box-shadow: 0 0 0 3px rgba(249,106,10,0.1) !important; }
+CSS = """
+footer { display: none !important; }
 
-/* Score */
 #score-box textarea {
-    background: #3D3BD6 !important; color: #fff !important;
-    font-weight: 900 !important; font-size: 1.4rem !important;
-    text-align: center !important; border: none !important;
+    background: #3D3BD6 !important;
+    color: #fff !important;
+    font-weight: 900 !important;
+    font-size: 1.4rem !important;
+    text-align: center !important;
+    border: none !important;
 }
-
-/* Status */
-#status-box textarea { background: #EEEEFF !important; border-color: #3D3BD6 !important; color: #1A1A8E !important; font-weight: 600 !important; }
-
-/* Question */
-#question-box textarea { background: #FFF3E8 !important; border-color: #F96A0A !important; font-weight: 700 !important; }
-
-/* Feedback */
+#status-box textarea { background: #EEF0FF !important; color: #2B29A8 !important; font-weight: 600 !important; }
+#question-box textarea { background: #FFF3E8 !important; border-color: #F96A0A !important; font-weight: 700 !important; font-size: 1.05rem !important; }
 #feedback-box textarea { background: #F0FFF6 !important; border-color: #00B08D !important; line-height: 1.75 !important; }
-
-footer { display: none !important; }
 """
 
-HEADER_HTML = """
-<div id="paperprof-header">
-  <span style="font-size:3rem;line-height:1">📄</span>
+HEADER = """
+<div style="background:linear-gradient(135deg,#3D3BD6,#6B69FF);border-radius:20px;padding:24px 28px;margin-bottom:4px;display:flex;align-items:center;gap:18px">
+  <span style="font-size:2.8rem">📄</span>
   <div>
-    <div style="color:white;font-size:2rem;font-weight:900;font-family:Nunito,sans-serif;letter-spacing:-0.02em;line-height:1.1">
-      PaperProf
-    </div>
-    <div style="color:rgba(255,255,255,0.82);font-size:1rem;font-family:Nunito,sans-serif;margin-top:5px">
-      Révise tes cours avec l'IA &mdash; questions, réponses, feedback instantané
-    </div>
+    <div style="color:#fff;font-size:1.9rem;font-weight:900;font-family:Nunito,sans-serif;line-height:1.1">PaperProf</div>
+    <div style="color:rgba(255,255,255,.82);font-size:0.95rem;font-family:Nunito,sans-serif;margin-top:4px">Révise tes cours avec l'IA · questions · réponses · feedback instantané</div>
   </div>
 </div>
 """
 
 # ---------------------------------------------------------------------------
-# Gradio UI
+# UI
 # ---------------------------------------------------------------------------
 
-with gr.Blocks(title="PaperProf", css=CSS, theme=gr.themes.Soft()) as demo:
+with gr.Blocks(title="PaperProf", theme=edu_theme, css=CSS) as demo:
 
-    gr.HTML(HEADER_HTML)
+    gr.HTML(HEADER)
 
-    chunks_state = gr.State([])
-    chunk_state = gr.State("")
+    chunks_state  = gr.State([])
+    chunk_state   = gr.State("")
     correct_state = gr.State(0)
-    total_state = gr.State(0)
+    total_state   = gr.State(0)
 
     with gr.Row():
-        pdf_input = gr.File(label="📎 Cours PDF", file_types=[".pdf"], scale=3)
-        load_btn = gr.Button("Charger le PDF", variant="primary", scale=2)
+        pdf_input         = gr.File(label="📎 Cours PDF", file_types=[".pdf"], scale=3)
+        load_btn          = gr.Button("Charger le PDF", variant="primary", scale=2)
         language_selector = gr.Radio(["English", "Français"], value="Français", label="🌐 Langue")
 
     with gr.Row():
         load_status = gr.Textbox(label="Statut", interactive=False, scale=4, elem_id="status-box")
-        score_box = gr.Textbox(label="Score", value="—", interactive=False, scale=1, elem_id="score-box")
+        score_box   = gr.Textbox(label="Score", value="—", interactive=False, scale=1, elem_id="score-box")
 
     with gr.Row():
         question_box = gr.Textbox(label="❓ Question", interactive=False, lines=3, scale=3, elem_id="question-box")
-        new_q_btn = gr.Button("Nouvelle question", variant="secondary", scale=1)
+        new_q_btn    = gr.Button("Nouvelle question", variant="secondary", scale=1)
 
-    answer_box = gr.Textbox(label="✏️ Ta réponse", lines=4, placeholder="Écris ta réponse ici…")
-    submit_btn = gr.Button("Valider la réponse", variant="primary")
+    answer_box   = gr.Textbox(label="✏️ Ta réponse", lines=4, placeholder="Écris ta réponse ici…")
+    submit_btn   = gr.Button("Valider la réponse", variant="primary")
     feedback_box = gr.Textbox(label="💬 Feedback", interactive=False, lines=7, elem_id="feedback-box")
 
-    # Wire events
+    # Traduction UI quand on change la langue
+    language_selector.change(
+        update_ui_language,
+        inputs=[language_selector],
+        outputs=[load_btn, new_q_btn, submit_btn, pdf_input, load_status, question_box, answer_box, feedback_box],
+    )
+
     load_btn.click(
         load_pdf,
-        inputs=[pdf_input],
+        inputs=[pdf_input, language_selector],
         outputs=[chunks_state, load_status, correct_state, total_state],
     ).then(lambda: "—", outputs=[score_box])
+
     new_q_btn.click(
         new_question,
         inputs=[chunks_state, language_selector],
         outputs=[question_box, chunk_state, feedback_box],
     )
+
     submit_btn.click(
         submit_answer,
         inputs=[question_box, chunk_state, answer_box, correct_state, total_state, language_selector],