color update

This commit is contained in:
Samandar Turgunboyev
2025-12-17 14:21:51 +05:00
parent efd75cb836
commit d934fcca13
5 changed files with 36 additions and 59 deletions

View File

@@ -2,7 +2,13 @@
import formatPhone from '@/shared/lib/formatPhone';
import { Button } from '@/shared/ui/button';
import { Form, FormControl, FormField, FormItem } from '@/shared/ui/form';
import {
Form,
FormControl,
FormField,
FormItem,
FormMessage,
} from '@/shared/ui/form';
import { Input } from '@/shared/ui/input';
import { Label } from '@/shared/ui/label';
import { zodResolver } from '@hookform/resolvers/zod';
@@ -45,7 +51,7 @@ const OrderPage = () => {
lastName: '',
lat: '',
long: '',
phone: '',
phone: '+998',
},
});
@@ -130,7 +136,7 @@ const OrderPage = () => {
) => {
const [lat, lon] = e.get('coords');
setCoords({ latitude: lat, longitude: lon, zoom: 14 });
setCoords({ latitude: lat, longitude: lon, zoom: 18 });
form.setValue('lat', lat.toString(), { shouldDirty: true });
form.setValue('long', lon.toString(), { shouldDirty: true });
@@ -192,7 +198,7 @@ const OrderPage = () => {
if (orderSuccess) {
return (
<div className="min-h-screen bg-gray-50 flex items-center justify-center p-4">
<div className="flex justify-center items-center h-screen">
<div className="bg-white rounded-lg shadow-lg p-8 max-w-md w-full text-center">
<div className="w-20 h-20 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-4">
<CheckCircle2 className="w-12 h-12 text-green-600" />
@@ -227,8 +233,8 @@ const OrderPage = () => {
}
return (
<div className="min-h-screen bg-gray-50 py-8">
<div className="max-w-7xl mx-auto px-4">
<div className="custom-container mb-5">
<>
{/* Header */}
<div className="mb-6">
<h1 className="text-3xl font-bold text-gray-800 mb-2">
@@ -254,8 +260,8 @@ const OrderPage = () => {
control={form.control}
name="firstName"
render={({ field }) => (
<FormItem>
<Label className="block text-sm font-medium text-gray-700 mb-2">
<FormItem className="flex justify-start flex-col">
<Label className="block text-sm font-medium text-gray-700">
{'Ism'}
</Label>
<FormControl>
@@ -265,6 +271,7 @@ const OrderPage = () => {
placeholder="Ismingiz"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
@@ -273,8 +280,8 @@ const OrderPage = () => {
control={form.control}
name="lastName"
render={({ field }) => (
<FormItem>
<Label className="block text-sm font-medium text-gray-700 mb-2">
<FormItem className="flex justify-start flex-col">
<Label className="block text-sm font-medium text-gray-700">
{'Familiya'}
</Label>
<FormControl>
@@ -284,6 +291,7 @@ const OrderPage = () => {
placeholder="Familiyangiz"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
@@ -293,7 +301,7 @@ const OrderPage = () => {
name="phone"
render={({ field }) => (
<FormItem>
<Label className="block text-sm font-medium text-gray-700 mb-2">
<Label className="block text-sm font-medium text-gray-700">
Telefon raqam
</Label>
<FormControl>
@@ -302,11 +310,11 @@ const OrderPage = () => {
value={formatPhone(field.value ?? '')}
onChange={(e) => field.onChange(e.target.value)}
type="tel"
required
className="w-full h-12 border border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:border-blue-500"
placeholder="+998 90 123 45 67"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
@@ -338,6 +346,7 @@ const OrderPage = () => {
placeholder="Toshkent"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
@@ -604,7 +613,7 @@ const OrderPage = () => {
</div>
</form>
</Form>
</div>
</>
</div>
);
};

View File

@@ -252,26 +252,6 @@ const ProductDetail = () => {
</div>
</div>
{/* Supplier/Agency Information Section */}
<div className="border border-gray-200 rounded-lg mb-4 bg-gradient-to-r from-blue-50 to-indigo-50">
<div className="flex items-center gap-2">
<div className="w-fit h-full rounded-lg overflow-hidden">
<Image
src={product.supplier.logo || '/placeholder.svg'}
alt={product.supplier.name}
width={60}
height={60}
className="w-full h-full object-contain p-2"
/>
</div>
<div className="flex-1">
<h4 className="font-bold text-gray-800 text-lg mb-1 line-clamp-1">
{product.supplier.name}
</h4>
</div>
</div>
</div>
{/* Quantity Selector */}
<div className="mb-6">
<label className="text-gray-700 font-medium mb-2 block">
@@ -310,9 +290,9 @@ const ProductDetail = () => {
<button
onClick={addToCart}
disabled={!product.inStock}
className={`flex-1 py-4 rounded-lg font-semibold text-white flex items-center justify-center gap-2 transition ${
className={`flex-1 py-4 rounded-lg cursor-pointer font-semibold text-white flex items-center justify-center gap-2 transition ${
product.inStock
? 'bg-blue-600 hover:bg-blue-700'
? 'bg-green-600 hover:bg-green-700'
: 'bg-gray-400 cursor-not-allowed'
}`}
>

View File

@@ -67,8 +67,8 @@ export function CategoryCarousel({ category }: { category: SubCategory }) {
))}
</CarouselContent>
<CarouselPrevious className="hidden lg:flex -top-12 right-12 w-9 h-9 bg-blue-600 text-white border-0" />
<CarouselNext className="hidden lg:flex -top-12 right-0 w-9 h-9 bg-blue-600 text-white border-0" />
<CarouselPrevious className="hidden lg:flex -top-12 right-12 w-9 h-9 bg-green-600 hover:bg-green-600 text-white border-0 cursor-pointer" />
<CarouselNext className="hidden lg:flex -top-12 right-0 w-9 h-9 bg-green-600 text-white border-0 hover:bg-green-600 cursor-pointer" />
</Carousel>
</section>
);

View File

@@ -45,7 +45,7 @@ export function ProductCard({
const decrease = (e: MouseEvent<HTMLButtonElement>) => {
e.stopPropagation();
setQuantity((q) => {
if (q === '' || q <= 1) return 1;
if (q === '' || q <= 1) return 0;
return q - 1;
});
};
@@ -53,7 +53,7 @@ export function ProductCard({
return (
<Card
onClick={() => router.push(`/product/${product.id}`)}
className="group relative p-0 overflow-hidden border border-slate-200 bg-white shadow-sm hover:shadow-lg transition-all rounded-xl sm:rounded-2xl hover:border-blue-400"
className="group relative p-0 overflow-hidden border border-slate-200 bg-white shadow-sm hover:shadow-lg transition-all rounded-xl sm:rounded-2xl hover:border-green-400"
>
<CardContent className="p-0">
<div className="relative overflow-hidden">
@@ -73,7 +73,7 @@ export function ProductCard({
handleLiked(product.id);
}
}}
className="absolute top-2 right-2 z-10 bg-white rounded-full p-1.5 sm:p-2 shadow hover:scale-110"
className="absolute top-2 right-2 z-10 bg-white hover:bg-gray-200 cursor-pointer rounded-full p-1.5 sm:p-2 shadow hover:scale-110"
>
<Heart
className={`w-4 h-4 sm:w-5 sm:h-5 ${
@@ -94,7 +94,7 @@ export function ProductCard({
</div>
</div>
<div className="p-3 sm:p-4 space-y-2 sm:space-y-3">
<div className="p-3 sm:p-4 space-y-1 sm:space-y-1">
<div className="flex items-center gap-2">
<Star className="w-3.5 h-3.5 sm:w-4 sm:h-4 fill-orange-400 text-orange-400" />
<span className="text-xs sm:text-sm font-semibold text-orange-600">
@@ -107,13 +107,13 @@ export function ProductCard({
</h3>
<div>
<span className="text-lg sm:text-xl font-bold text-blue-600">
{formatPrice(product.price)}
<span className="text-lg sm:text-xl font-bold text-green-600">
{formatPrice(product.price, true)}
</span>
{product.oldPrice && (
<div className="text-xs sm:text-sm text-slate-400 line-through">
{formatPrice(product.oldPrice)}
{formatPrice(product.oldPrice, true)}
</div>
)}
</div>
@@ -125,7 +125,7 @@ export function ProductCard({
e.stopPropagation();
setQuantity(1);
}}
className="w-full h-9 sm:h-11 text-sm"
className="w-full h-9 sm:h-11 text-sm bg-green-600 hover:bg-green-600/80 cursor-pointer"
>
<ShoppingCart className="w-4 h-4 mr-1" />
Savatga
@@ -133,7 +133,7 @@ export function ProductCard({
) : (
<div
onClick={(e) => e.stopPropagation()}
className="flex items-center justify-between border border-blue-500 rounded-lg h-9 sm:h-11"
className="flex items-center justify-between border border-green-500 rounded-lg h-9 sm:h-11"
>
<Button size="icon" variant="ghost" onClick={decrease}>
<Minus className="w-4 h-4" />

View File

@@ -9,7 +9,6 @@ import {
Sheet,
SheetClose,
SheetContent,
SheetFooter,
SheetHeader,
SheetTitle,
SheetTrigger,
@@ -165,7 +164,7 @@ const Navbar = () => {
alt="logo"
width={40}
height={20}
className="w-10 h-10"
className="w-10 h-fit"
/>
</div>
<div className="w-full flex justify-end items-center lg:hidden gap-2">
@@ -318,17 +317,6 @@ const Navbar = () => {
</div>
</div>
</div>
<SheetFooter className="px-4 py-4 border-t border-slate-200 bg-slate-50">
<SheetClose asChild>
<Button
variant="outline"
className="w-full border-slate-300 hover:bg-slate-100"
>
Yopish
</Button>
</SheetClose>
</SheetFooter>
</SheetContent>
</Sheet>
</div>