update UI
This commit is contained in:
parent
46f50e3054
commit
8228fe865f
@ -37,8 +37,8 @@ export function Header() {
|
||||
{ name: "Accueil", path: "/", icon: Home, public: true },
|
||||
{ name: "Recettes", path: "/recipes", icon: BookOpen, public: true },
|
||||
// { name: "Mes recettes", path: "/my-recipes", icon: BookOpen, public: false },
|
||||
{ name: "Favoris", path: "/favorites", icon: Heart, public: false },
|
||||
{ name: "Profil", path: "/profile", icon: User, public: false },
|
||||
// { name: "Favoris", path: "/favorites", icon: Heart, public: false },
|
||||
// { name: "Profil", path: "/profile", icon: User, public: false },
|
||||
]
|
||||
|
||||
const filteredNavItems = navItems.filter((item) => item.public || isAuthenticated)
|
||||
@ -54,7 +54,7 @@ export function Header() {
|
||||
</div>
|
||||
|
||||
{/* Navigation desktop */}
|
||||
<nav className="hidden md:flex items-center gap-6">
|
||||
<nav className="hidden md:flex items-center gap-10">
|
||||
{filteredNavItems.map((item) => (
|
||||
<Link
|
||||
key={item.path}
|
||||
|
||||
@ -5,18 +5,22 @@ interface KitchenIllustrationProps {
|
||||
}
|
||||
|
||||
export function KitchenIllustration({ height = 200 }: KitchenIllustrationProps) {
|
||||
// Calculate width based on original ratio (280:200)
|
||||
const ratio = 280 / 200;
|
||||
const ratio = 280 / 100;
|
||||
const width = height * ratio;
|
||||
|
||||
return (
|
||||
<div style={{ width: '100%', display: 'flex', justifyContent: 'center' }}>
|
||||
<svg
|
||||
width={width}
|
||||
height={height}
|
||||
viewBox="0 0 280 200"
|
||||
viewBox="0 100 280 100"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
style={{ maxWidth: '100%' }}
|
||||
style={{
|
||||
maxWidth: '100%',
|
||||
height: 'auto',
|
||||
aspectRatio: `${ratio}`,
|
||||
}}
|
||||
>
|
||||
{/* Pot */}
|
||||
<rect x="100" y="120" width="80" height="60" rx="5" fill="#6B7280" />
|
||||
@ -73,5 +77,6 @@ export function KitchenIllustration({ height = 200 }: KitchenIllustrationProps)
|
||||
<rect x="210" y="150" width="20" height="8" rx="2" fill="#F59E0B" /> {/* Carrot */}
|
||||
<rect x="220" y="140" width="15" height="10" rx="2" fill="#F59E0B" transform="rotate(45 220 140)" /> {/* Carrot top */}
|
||||
</svg>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -30,7 +30,7 @@ export function MainLayout({ children }: MainLayoutProps) {
|
||||
<p className="text-center text-sm text-muted-foreground md:text-left">
|
||||
© {new Date().getFullYear()} Freedge. Tous droits réservés.
|
||||
</p>
|
||||
<div className="flex items-center gap-4 text-sm text-muted-foreground">
|
||||
<div className="flex items-center gap-4 text-sm text-muted-foreground pt-4">
|
||||
<a href="#" className="hover:underline">Mentions légales</a>
|
||||
<a href="#" className="hover:underline">Confidentialité</a>
|
||||
<a href="#" className="hover:underline">Contact</a>
|
||||
|
||||
@ -2,11 +2,10 @@
|
||||
|
||||
import type React from "react"
|
||||
|
||||
import { useState, useRef } from "react"
|
||||
import { useState } from "react"
|
||||
import { useNavigate } from "react-router-dom"
|
||||
import { recipeService } from "@/api/recipe"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Input } from "@/components/ui/input"
|
||||
import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { Mic, Upload, ArrowLeft, Loader2 } from "lucide-react"
|
||||
import { motion } from "framer-motion"
|
||||
@ -15,7 +14,6 @@ import { CookingLoader } from "@/components/illustrations/CookingLoader"
|
||||
|
||||
export default function RecipeForm() {
|
||||
const navigate = useNavigate()
|
||||
const fileInputRef = useRef<HTMLInputElement>(null)
|
||||
|
||||
const [audioFile, setAudioFile] = useState<File | null>(null)
|
||||
const [isRecording, setIsRecording] = useState(false)
|
||||
@ -24,13 +22,6 @@ export default function RecipeForm() {
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [error, setError] = useState("")
|
||||
|
||||
// Gérer l'upload de fichier audio
|
||||
const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
if (e.target.files && e.target.files.length > 0) {
|
||||
setAudioFile(e.target.files[0])
|
||||
setError("")
|
||||
}
|
||||
}
|
||||
|
||||
// Démarrer l'enregistrement audio
|
||||
const startRecording = async () => {
|
||||
@ -123,7 +114,7 @@ export default function RecipeForm() {
|
||||
</div>
|
||||
|
||||
<Card className="border-none shadow-lg">
|
||||
<CardHeader className="p-4 sm:p-6">
|
||||
<CardHeader className="p-2 sm:p-4">
|
||||
<CardTitle className="text-xl sm:text-2xl">Créer une nouvelle recette</CardTitle>
|
||||
<CardDescription className="text-sm">
|
||||
Enregistrez ou téléchargez un fichier audio listant les ingrédients disponibles, et nous générerons une
|
||||
@ -131,7 +122,7 @@ export default function RecipeForm() {
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
|
||||
<CardContent className="p-4 sm:p-6">
|
||||
<CardContent className="p-2 sm:p-4">
|
||||
{error && (
|
||||
<div className="rounded-md bg-red-50 p-4 text-sm text-red-700 dark:bg-red-900/50 dark:text-red-200 mb-4">
|
||||
{error}
|
||||
@ -174,7 +165,7 @@ export default function RecipeForm() {
|
||||
)}
|
||||
</CardContent>
|
||||
|
||||
<CardFooter className="p-4 sm:p-6 flex justify-between">
|
||||
<CardFooter className="p-2 sm:p-4 flex justify-between">
|
||||
<Button
|
||||
variant="outline"
|
||||
className="cursor-pointer"
|
||||
|
||||
@ -88,15 +88,16 @@ export default function RecipeList() {
|
||||
)}
|
||||
|
||||
<div className="flex flex-col mx-4 md:mx-4 sm:flex-row sm:items-center sm:justify-between mb-6 mt-6">
|
||||
<Tabs defaultValue="all" className="w-full sm:w-auto" onValueChange={setActiveFilter}>
|
||||
{/* <Tabs defaultValue="all" className="w-full sm:w-auto" onValueChange={setActiveFilter}>
|
||||
<TabsList className="grid grid-cols-4 w-full sm:w-auto">
|
||||
<TabsTrigger value="all">Toutes</TabsTrigger>
|
||||
<TabsTrigger value="easy">Faciles</TabsTrigger>
|
||||
<TabsTrigger value="quick">Rapides</TabsTrigger>
|
||||
<TabsTrigger value="vegetarian">Végé</TabsTrigger>
|
||||
</TabsList>
|
||||
</Tabs>
|
||||
|
||||
</Tabs> */}
|
||||
{
|
||||
filteredRecipes.length !== 0 &&
|
||||
<Button
|
||||
onClick={handleCreateRecipe}
|
||||
className="mt-4 sm:mt-0 bg-gradient-to-r from-orange-500 to-amber-500 hover:from-orange-600 hover:to-amber-600 text-white cursor-pointer"
|
||||
@ -104,6 +105,7 @@ export default function RecipeList() {
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
Nouvelle recette
|
||||
</Button>
|
||||
}
|
||||
</div>
|
||||
|
||||
{loading ? (
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user