nacim/Anonyme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

finalyse

Browse Source
This commit is contained in:
nBiqoz
2025-08-04 00:14:55 +02:00
parent b1de50cbc2
commit ad92302461
8 changed files with 371 additions and 222 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
app/components/ProgressBar.tsx
View File

@@ -27,8 +27,8 @@ export const ProgressBar = ({ currentStep, steps }: ProgressBarProps) => {
return (
<div className="w-full max-w-2xl mx-auto mb-4 px-2">
<div className="flex items-center justify-center">
<div className="flex items-center w-full max-w-md">
<div className="flex items-start justify-center">
<div className="flex items-start w-full max-w-md">
{steps.map((step, index) => {
const stepNumber = index + 1;
const isCompleted = stepNumber < currentStep;
@@ -37,7 +37,10 @@ export const ProgressBar = ({ currentStep, steps }: ProgressBarProps) => {
return (
<React.Fragment key={index}>
{/* Step Circle and Label */}
<div className="flex flex-col items-center">
<div
className="flex flex-col items-center text-center"
style={{ flex: "0 0 auto" }}
>
<div
className={`w-5 h-5 sm:w-6 sm:h-6 rounded-full flex items-center justify-center font-medium text-xs transition-all duration-300 ${
isCompleted
@@ -50,7 +53,7 @@ export const ProgressBar = ({ currentStep, steps }: ProgressBarProps) => {
{getStepIcon(stepNumber, isCompleted)}
</div>
<span
className={`mt-1 text-[8px] sm:text-[10px] font-medium text-center max-w-[60px] sm:max-w-none leading-tight ${
className={`mt-1 text-sm font-medium leading-tight ${
isCompleted || isCurrent
? "text-[#092727]"
: "text-gray-500"
@@ -58,24 +61,19 @@ export const ProgressBar = ({ currentStep, steps }: ProgressBarProps) => {
style={{
wordBreak: "break-word",
hyphens: "auto",
minWidth: "60px", // Assure un espace minimum
maxWidth: "120px", // Empêche de devenir trop large
}}
>
{step === "Anonymisation" ? (
<>
<span className="hidden sm:inline">Anonymisation</span>
<span className="sm:hidden">Anonym.</span>
</>
) : (
step
)}
{step}
</span>
</div>
{/* Connector Line */}
{index < steps.length - 1 && (
<div className="flex-1 flex items-center justify-center px-2 sm:px-4">
<div className="flex-1 flex items-center justify-center px-1 sm:px-2 mt-2.5 sm:mt-3">
<div
className={`h-0.5 w-full max-w-[40px] sm:max-w-[60px] transition-all duration-300 ${
className={`h-0.5 w-full transition-all duration-300 ${
stepNumber < currentStep
? "bg-[#f7ab6e]"
: "bg-gray-200"