admin/open-school
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

New prof

Browse Source
This commit is contained in:
laurentbarontini
2026-04-24 20:17:28 +02:00
parent 2db338a9f5
commit e592ed44af
3 changed files with 16 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
frontend/src/App.jsx
View File

@@ -1,4 +1,5 @@
import React, { useEffect, useMemo, useRef, useState } from 'react' import React, { useEffect, useMemo, useRef, useState } from 'react'
import professeurTopImage from './assets/professeur-top.png'
const API_BASE = '/api' const API_BASE = '/api'
const AUTO_STOP_SILENCE_MS = 2500 const AUTO_STOP_SILENCE_MS = 2500
@@ -37,15 +38,13 @@ function Avatar({ speaking }) {
return ( return (
<div className="avatar-shell"> <div className="avatar-shell">
<div className={`avatar ${speaking ? 'speaking' : ''}`}> <div className={`avatar ${speaking ? 'speaking' : ''}`}>
<div className="face"> <img
<div className="eyes"> className="avatar-image"
<span /> src={professeurTopImage}
<span /> alt="Professeur TOP"
</div> />
<div className={`mouth ${speaking ? 'mouth-speaking' : ''}`} />
</div>
</div> </div>
<div className="avatar-caption">ProfAmi</div> <div className="avatar-caption">Professeur TOP</div>
</div> </div>
) )
} }
@@ -646,7 +645,7 @@ export default function App() {
{messages.length === 0 && <p className="muted">Le dialogue apparaîtra ici.</p>} {messages.length === 0 && <p className="muted">Le dialogue apparaîtra ici.</p>}
{messages.map((message) => ( {messages.map((message) => (
<div key={message.id} className={`message ${message.role}`}> <div key={message.id} className={`message ${message.role}`}>
<strong>{message.role === 'assistant' ? 'ProfAmi' : 'Élève'}</strong> <strong>{message.role === 'assistant' ? 'Professeur TOP' : 'Élève'}</strong>
<p>{message.content}</p> <p>{message.content}</p>
</div> </div>
))} ))}

BIN
frontend/src/assets/professeur-top.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 311 KiB

36
frontend/src/styles.css
View File

@@ -96,37 +96,17 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
.avatar { .avatar {
width: 144px; width: 144px;
height: 144px; height: 144px;
border-radius: 50%; border-radius: 28px;
background: radial-gradient(circle at 30% 30%, #fde68a, #f59e0b); overflow: hidden;
display: grid; background: white;
place-items: center;
box-shadow: 0 10px 20px rgba(245, 158, 11, 0.28); box-shadow: 0 10px 20px rgba(245, 158, 11, 0.28);
} }
.avatar.speaking { animation: pulse 0.7s infinite alternate; } .avatar.speaking { animation: pulse 0.7s infinite alternate; }
.face { width: 90px; } .avatar-image {
.eyes { width: 100%;
display: flex; height: 100%;
justify-content: space-between; object-fit: cover;
margin-bottom: 1.2rem; display: block;
}
.eyes span {
width: 14px;
height: 14px;
background: #1f2937;
border-radius: 50%;
}
.mouth {
width: 44px;
height: 10px;
background: #7c2d12;
border-radius: 999px;
margin: 0 auto;
transition: all 0.15s ease;
}
.mouth-speaking {
width: 34px;
height: 24px;
border-radius: 0 0 999px 999px;
} }
.avatar-caption { font-weight: 700; } .avatar-caption { font-weight: 700; }