fixed css bugs

This commit is contained in:
HAM!DREZA
2024-05-09 11:41:05 +03:30
parent a41a54788d
commit 0ac988a9c7
14 changed files with 224 additions and 198 deletions
+19 -19
View File
@@ -1,9 +1,9 @@
<template>
<footer dir="rtl">
<div class=" flex bg-[#F5F5F5] justify-center py-[4.844vw]">
<div class="mt-[10vw] lg:mt-0 w-[80.88%] flex flex-col lg:flex-row justify-between">
<div class="mt-[10vw] md:mt-0 w-[80.88%] flex flex-col md:flex-row justify-between">
<div
class=" w-full lg:w-[32.19%] bg-[#F2F2F2] text-[#383E43] border-[1px] rounded-[16px] p-[1.042vw] border-[#E5E5E5]"
class=" w-full md:w-[32.19%] bg-[#F2F2F2] text-[#383E43] border-[1px] rounded-[16px] p-[1.042vw] border-[#E5E5E5]"
>
<img
src="/public/images/logo.png"
@@ -13,7 +13,7 @@
class="m-2"
/>
<p
class="mt-[5vw] text-[3.59vw] lg:text-[0.938vw] leading-[5.385vw] lg:leading-[1.406vw] font-[500] px-[4vw] lg:p-[0.417vw] lg:mt-[0.417vw]"
class="mt-[5vw] text-[3.59vw] md:text-[0.938vw] leading-[5.385vw] md:leading-[1.406vw] font-[500] px-[4vw] md:p-[0.417vw] md:mt-[0.417vw]"
>
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با
استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در
@@ -23,11 +23,11 @@
</p>
<div
class="space-y-[2.5vw] px-[4vw] lg:px-0 lg:space-y-[1.25vw] mt-[3.333vw] font-[500] text-[3.19vw] lg:text-[0.833vw]"
class="space-y-[2.5vw] px-[4vw] md:px-0 md:space-y-[1.25vw] mt-[3.333vw] font-[500] text-[3.19vw] md:text-[0.833vw]"
>
<p class="flex items-center mt-6 lg:mt-0">
<p class="flex items-center mt-6 md:mt-0">
<svg
class="w-[4.359vw] lg:w-[1.042vw]"
class="w-[4.359vw] md:w-[1.042vw]"
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
@@ -44,7 +44,7 @@
<p class="flex items-center">
<svg
class="w-[4.359vw] lg:w-[1.042vw]"
class="w-[4.359vw] md:w-[1.042vw]"
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
@@ -70,7 +70,7 @@
</p>
<p class="flex">
<svg
class="w-[4.359vw] lg:w-[1.563vw]"
class="w-[4.359vw] md:w-[1.563vw]"
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
@@ -94,22 +94,22 @@
</div>
</div>
<div
class="w-full lg:w-[59.43%] space-y-6 flex flex-col justify-center items-end"
class="w-full md:w-[59.43%] space-y-6 flex flex-col justify-center items-end"
>
<div
class="mt-8 lg:mt-0 w-full flex items-center justify-between flex-row h-[72px] bg-[#F2F2F2] text-[#383E43] border-[1px] rounded-[16px] font-[600] border-[#E5E5E5]"
class="mt-8 md:mt-0 w-full flex items-center justify-between flex-row h-[72px] bg-[#F2F2F2] text-[#383E43] border-[1px] rounded-[16px] font-[600] border-[#E5E5E5]"
>
<p class="hidden lg:block w-[50%] ps-5 text-[0.938vw]">
<p class="hidden md:block w-[50%] ps-5 text-[0.938vw]">
با ثبت ایمیل از آخرین تخفیف ها با خبر شوید
</p>
<div class="flex items-center w-full lg:w-[50%] text-end me-2">
<div class="flex items-center w-full md:w-[50%] text-end me-2">
<input
type="email"
class="w-[80%] ms-2 lg:ms-0 me-2 h-[11.026vw] lg:h-[2.5vw] text-[#383E43] bg-[#E5E5E5] rounded-[8px] placeholder:text-[#383E43] placeholder:ps-4 placeholder:font-[500]"
class="text-[3.19vw] md:text-[0.938vw] w-[80%] ms-2 md:ms-0 me-2 h-[11.026vw] md:h-[2.5vw] text-[#383E43] bg-[#E5E5E5] rounded-[8px] placeholder:text-[#383E43] placeholder:ps-4 placeholder:font-[500]"
placeholder="آدرس ایمیل"
/>
<button
class="flex text-[3.19vw] lg:text-[0.938vw] items-center font-[500] h-[11.026vw] lg:h-[2.4vw] rounded-[8px] bg-[#A62186] text-white px-[4vw] lg:px-[1.25vw]"
class="flex text-[3.19vw] md:text-[0.938vw] items-center font-[500] h-[11.026vw] md:h-[2.4vw] rounded-[8px] bg-[#A62186] text-white px-[4vw] md:px-[1.25vw]"
>
ثبت
</button>
@@ -117,12 +117,12 @@
</div>
<div
class="w-full flex items-center justify-between px-5 lg:px-auto flex-row h-[72px] bg-[#F2F2F2] text-[#383E43] border-[1px] rounded-[16px] font-[600] border-[#E5E5E5]"
class="w-full flex items-center justify-between px-5 md:px-auto flex-row h-[72px] bg-[#F2F2F2] text-[#383E43] border-[1px] rounded-[16px] font-[600] border-[#E5E5E5]"
>
<p class="hidden lg:block text-[0.938vw]">
<p class="hidden md:block text-[0.938vw]">
مارا در شبکه های اجتماعی دنبال کنید
</p>
<div class="flex justify-between px-[10vw] w-full lg:w-[25%]">
<div class="flex justify-between px-[10vw] w-full md:w-[25%]">
<svg
width="40"
height="40"
@@ -209,7 +209,7 @@
</div>
<div
class="hidden lg:flex w-full flex-row items-center justify-between"
class="hidden md:flex w-full flex-row items-center justify-between"
>
<div class="text-[#878787] text-[0.833vw] space-y-3 mt-8">
<h2 class="text-[1.055vw] text-[#383E43] font-[600]">
@@ -328,7 +328,7 @@
</div>
</div>
</div>
<div class="block lg:hidden w-full">
<div class="block md:hidden w-full">
<p
class="flex justify-between text-[3.59vw] text-[#383E43] font-semibold border-b py-[4vw]"
>