Update call to artist button styles -- Fix a responsive bug

This commit is contained in:
AmirGoodarzi
2025-05-02 23:36:44 +03:30
parent 19c114043f
commit d9dc5b7967
5 changed files with 14 additions and 11 deletions

View File

@@ -1,7 +1,7 @@
{
"name": "enduser.salona",
"private": true,
"version": "0.8.6",
"version": "0.8.9",
"type": "module",
"scripts": {
"dev": "vite",

View File

@@ -21,20 +21,19 @@ const AppointmentListItem = ({ data }: Props) => {
<b>آرایشگر: </b>
<p className="inline-block break-word">{data.artist.name}</p>
</div>
<div className="flex items-center gap-2 whitespace-nowrap">
<b>موبایل: </b>
<div className="flex items-center justify-between gap-2 whitespace-nowrap">
<p className="inline-block break-word">{data.artist.phone_number}</p>
<HoverTooltip label="تماس">
<a
className="rounded-full bg-[#AF00FA] hover:bg-[#AF00FA] size-9 inline-flex items-center justify-center ms-1"
className="rounded-full bg-[#AF00FA] hover:bg-[#AF00FA] size-11 inline-flex items-center justify-center mr-auto animate-bounce duration-1000"
href={`tel:${data.artist.phone_number}`}
>
<PhoneCallIcon className="text-white size-4" />
<PhoneCallIcon className="text-white size-5" />
</a>
</HoverTooltip>
</div>
</div>
<div className="flex relative w-44 -mr-14">
<div className="flex relative w-44 -mr-[70px]">
<img
src={cardTimeBg}
className="absolute -top-[15px] w-full h-[124px]"

View File

@@ -30,6 +30,7 @@ const CardComponent = ({
className="flex flex-col items-center gap-2 size-full text-center cursor-pointer p-2 active:scale-95 transition-all"
data-aos="fade-up"
data-aos-delay={100 * index}
data-aos-offset="-200"
{...otherProps}
>
<div

View File

@@ -102,12 +102,15 @@ const Explore = () => {
return (
<div className="explore-page-wrapper bg-slate-50 min-h-[100dvh] flex flex-col gap-4 pt-20">
<div className="absolute -top-1/3 -right-0 size-full bg-[url('@/assets/images/bg-light-effect.png')] bg-cover bg-no-repeat opacity-10" />
<div className="absolute -top-1/3 -right-0 size-full bg-[url('@/assets/images/bg-light-effect.png')] bg-cover bg-no-repeat opacity-30 md:opacity-50 rotate-180" />
<div>
<TopSlider />
</div>
<div className="w-full relative p-2 flex-1 overflow-hidden">
<div className="absolute bottom-0 -left-1/4 size-full bg-[url('@/assets/images/bg-light-effect.png')] bg-cover bg-no-repeat opacity-20" />
<div
className="absolute bottom-0 -left-1/4 lg:left-0 size-full bg-[url('@/assets/images/bg-light-effect.png')]
bg-cover bg-no-repeat opacity-20 md:opacity-50"
/>
<Swiper dir="rtl" {...sliderProps} className="max-w-3xl mx-auto">
{groupedCards.map((slideGroup, index) => (
<SwiperSlide key={index} className="min-h-[480px]">

View File

@@ -38,10 +38,10 @@ const LoyaltyCardListItem = ({ data }: Props) => {
</p>
<HoverTooltip label="تماس">
<a
className="rounded-full bg-[#AF00FA] hover:bg-[#AF00FA] size-9 inline-flex items-center justify-center ms-1"
className="rounded-full bg-[#AF00FA] hover:bg-[#AF00FA] size-11 inline-flex items-center justify-center mr-auto animate-bounce duration-1000"
href={`tel:${data.artist.phone_number}`}
>
<PhoneCallIcon className="text-white size-4" />
<PhoneCallIcon className="text-white size-5" />
</a>
</HoverTooltip>
</div>
@@ -70,7 +70,7 @@ const LoyaltyCardListItem = ({ data }: Props) => {
</Link>
<AccordionTrigger className="[&>svg]:hidden p-0">
<Button
className="border-primary text-gray-700 font-bold"
className="w-full border-primary text-gray-700 font-bold"
variant="outline"
>
<EyeIcon />