share button complated

This commit is contained in:
nabijonovdavronbek619@gmail.com
2026-02-17 16:55:41 +05:00
parent 123e6324e4
commit 974d31c096
3 changed files with 27 additions and 13 deletions

View File

@@ -1,7 +1,7 @@
"use client";
import { usePriceModalStore } from "@/store/useProceModalStore";
import { Instagram, Send, Share2 } from "lucide-react";
import { Check, Instagram, Send, Share2 } from "lucide-react";
import { useTranslations } from "next-intl";
import { useParams } from "next/navigation";
import { useState } from "react";
@@ -32,7 +32,7 @@ export function RightSide({
const [copied, setCopied] = useState(false);
const handleShare = async () => {
const productUrl = `${window.location.origin}/${locale}/products/special_product?productId=${id}`;
const productUrl = `${window.location.origin}/${locale}/catalog_page/products/special_product?productId=${id}`;
try {
// Modern Web Share API dan foydalanish (mobil qurilmalar uchun)
@@ -85,7 +85,7 @@ export function RightSide({
return (
<div className="flex flex-col justify-center space-y-6">
{/* Title */}
<h1 className="text-2xl md:text-3xl lg:text-4xl font-unbounded font-bold text-white leading-tight">
<h1 className="text-xl md:text-3xl font-unbounded font-bold text-white leading-tight">
{title}
</h1>
@@ -112,7 +112,7 @@ export function RightSide({
</div>
{/* Price Section */}
<div className="bg-[#1716169f] rounded-xl p-6 space-y-6">
<div className="bg-[#1716169f] rounded-xl p-5 space-y-6">
{/* Price */}
<div>
<p className="text-gray-400 text-sm mb-2">{t("products.price")}:</p>
@@ -131,12 +131,23 @@ export function RightSide({
{/* Social Share */}
<div className="pt-4 border-t border-gray-800 flex items-center gap-5">
<button
<button
onClick={handleShare}
className="p-2.5 rounded-md bg-white text-red-500 hover:text-white hover:bg-red-500 flex items-center gap-3"
className="flex items-center gap-3 mb-3 text-gray-400 hover:text-white transition-colors group"
>
<Share2 className="w-5 h-5" />
<span className="text-sm">{t("products.share")}</span>
{copied ? (
<>
<Check className="w-5 h-5 text-green-400" />
<span className="text-sm text-green-400">
{t("products.copied") || "Link nusxalandi!"}
</span>
</>
) : (
<>
<Share2 className="w-5 h-5 group-hover:scale-110 transition-transform" />
<span className="text-sm">{t("products.share")}:</span>
</>
)}
</button>
{/* <a href="" className="p-2 rounded-md bg-white text-red-500 hover:text-white hover:bg-red-500">
<Instagram />

View File

@@ -186,7 +186,7 @@ export function OurService() {
<p className="font-almarai text-gray-400 max-w-70 w-full">
{data[3].subtitle}
</p>
<button className="font-almarai sm:mt-35 mt-0 text-[#dc2626] font-semibold flex items-center gap-2 text-sm hover:gap-3 transition-all">
<button className="font-almarai sm:mt-37 mt-0 text-[#dc2626] font-semibold flex items-center gap-2 text-sm hover:gap-3 transition-all">
{t("home.services.learnmore")}{" "}
<ChevronRight size={20} />
</button>
@@ -203,7 +203,7 @@ export function OurService() {
<motion.div
variants={cardVariants}
className="py-4 px-8 rounded-xl mt-5 w-full p-5 bg-[linear-gradient(to_top_right,#000000,#190b00,#542604,#8f4308)] flex sm:flex-row flex-col gap-5 items-center justify-between hover:shadow-2xl hover:shadow-red-500/20 transition-all duration-300"
className="py-6 px-8 rounded-xl mt-5 w-full p-5 bg-[linear-gradient(to_top_right,#000000,#190b00,#542604,#8f4308)] flex sm:flex-row flex-col gap-5 items-center justify-between hover:shadow-2xl hover:shadow-red-500/20 transition-all duration-300"
>
<h2 className="font-unbounded sm:text-3xl text-xl font-semibold font-armanai text-white">
{t("home.services.viewMoreServices")}