update 46 files

src/App.js

@@ -153,7 +153,7 @@ function App() {
 
         {/* <ProductTab /> */}
 
-        <ProductStatusCard />
+        {/* <ProductStatusCard /> */}
 
         {/* <AdvertisementDesign1 /> */}
         {/* <AdvertisementDesign2 /> */}
@@ -164,8 +164,8 @@ function App() {
         {/* <Design1 /> */}
         {/* <Design2 /> */}
 
-        {/* <SidebarMenu /> */}
+        <SidebarMenu />
-        {/* <SidebarDesign2 /> */}
+        <SidebarDesign2 />
 
         {/* <SidebarDesign2 className="w-1/5" /> */}
         {/* <TableDesign1 /> */}

src/components/Blogs/design1/BlogDesign1.js

@@ -35,7 +35,7 @@ const BlogDesign1 = ({
         </div>
         <div className="w-3/5 mr-4 flex flex-col justify-between py-2">
           <div>
-            <h2 className="text-base text-justify text-grayTextColor font-bold leading-6">
+            <h2 className="text-base text-justify text-grayTextColor font-sansbold leading-6">
               آیا مواد غذای پر فیبر و مفید هستند؟
             </h2>
             {blogExcerpt && (

src/components/Blogs/design1/index.js

@@ -33,7 +33,7 @@ const BlogDesign1 = ({
         </div>
         <div className="w-3/5 mr-4 flex flex-col justify-between py-2">
           <div>
-            <h2 className="text-base text-justify text-grayTextColor font-bold leading-6">
+            <h2 className="text-base text-justify text-grayTextColor font-sansbold leading-6">
               آیا مواد غذای پر فیبر و مفید هستند؟
             </h2>
             {blogExcerpt && (

src/components/Blogs/design2/BlogDesign2.js

@@ -63,11 +63,11 @@ const BlogDesign2 = ({
           </button>
         )}
         <div className="z-10 child-text">
-          <h2 className="text-white text-base font-bold leading-6">
+          <h2 className="text-white text-base font-sansbold leading-6">
             آیا مواد غذایی پر فیبر مفید هستند؟
           </h2>
           {blogSubTitle && (
-            <h2 className="text-white text-base mt-2 font-bold leading-6">
+            <h2 className="text-white text-base mt-2 font-sansbold leading-6">
               شما چه فکری می کنید
             </h2>
           )}

src/components/Blogs/design2/index.js

@@ -56,11 +56,11 @@ const BlogDesign2 = ({
           </button>
         )}
         <div className="z-10 child-text">
-          <h2 className="text-white text-base font-bold leading-6">
+          <h2 className="text-white text-base font-sansbold leading-6">
             آیا مواد غذایی پر فیبر مفید هستند؟
           </h2>
           {blogSubTitle && (
-            <h2 className="text-white text-base mt-2 font-bold leading-6">
+            <h2 className="text-white text-base mt-2 font-sansbold leading-6">
               شما چه فکری می کنید
             </h2>
           )}

src/components/Blogs/design3/BlogDesign3.js

@@ -48,13 +48,13 @@ const BlogDesign3 = ({
         {/* <img src={blogFeaturedImage2} alt="" /> */}
         <div className="w-full mx-auto p-4 rounded-lg shadow-md bg-white transform translate-y-20">
           <h2
-            className={`text-base text-justify font-bold leading-6 ${blogTitleColor}`}
+            className={`text-base text-justify font-sansbold leading-6 ${blogTitleColor}`}
           >
             آیا مواد غذای پر فیبر و مفید هستند؟
           </h2>
           {blogSubTitle && (
             <h2
-              className={`text-base text-justify mt-2 font-bold leading-6 ${blogTitleColor}`}
+              className={`text-base text-justify mt-2 font-sansbold leading-6 ${blogTitleColor}`}
             >
               نظر شما چیه
             </h2>

src/components/Blogs/design3/index.js

@@ -46,13 +46,13 @@ const BlogDesign3 = ({
         {/* <img src={blogFeaturedImage2} alt="" /> */}
         <div className="w-full mx-auto p-4 rounded-lg shadow-md bg-white transform translate-y-20">
           <h2
-            className={`text-base text-justify font-bold leading-6 ${blogTitleColor}`}
+            className={`text-base text-justify font-sansbold leading-6 ${blogTitleColor}`}
           >
             آیا مواد غذای پر فیبر و مفید هستند؟
           </h2>
           {blogSubTitle && (
             <h2
-              className={`text-base text-justify mt-2 font-bold leading-6 ${blogTitleColor}`}
+              className={`text-base text-justify mt-2 font-sansbold leading-6 ${blogTitleColor}`}
             >
               نظر شما چیه
             </h2>

src/components/Blogs/design4/BlogDesign4.js

@@ -38,7 +38,7 @@ const BlogDesign4 = ({
         </div>
         <div className="w-3/5 flex flex-col justify-between py-3 transform translate-x-10">
           <div>
-            <h2 className="text-base text-grayTextColor font-bold leading-6">
+            <h2 className="text-base text-grayTextColor font-sansbold leading-6">
               آیا مواد غذای پر فیبر و مفید هستند؟
             </h2>
             {blogExcerpt && (

src/components/Blogs/design4/index.js

@@ -36,7 +36,7 @@ const BlogDesign4 = ({
         </div>
         <div className="w-3/5 flex flex-col justify-between py-3 transform translate-x-10">
           <div>
-            <h2 className="text-base text-grayTextColor font-bold leading-6">
+            <h2 className="text-base text-grayTextColor font-sansbold leading-6">
               آیا مواد غذای پر فیبر و مفید هستند؟
             </h2>
             {blogExcerpt && (

src/components/Blogs/design5/BlogDesign5.js

@@ -38,7 +38,7 @@ const BlogDesign5 = ({
         </div>
         <div className="w-3/5 flex flex-col justify-between py-3 mr-4">
           <div>
-            <h2 className="text-base text-justify text-grayTextColor font-bold leading-6">
+            <h2 className="text-base text-justify text-grayTextColor font-sansbold leading-6">
               آیا مواد غذای پر فیبر و مفید هستند؟
             </h2>
             {blogExcerpt && (

src/components/Blogs/design5/index.js

@@ -37,7 +37,7 @@ const BlogDesign5 = ({
         </div>
         <div className="w-3/5 flex flex-col justify-between py-3 mr-4">
           <div>
-            <h2 className="text-base text-justify text-grayTextColor font-bold leading-6">
+            <h2 className="text-base text-justify text-grayTextColor font-sansbold leading-6">
               آیا مواد غذای پر فیبر و مفید هستند؟
             </h2>
             {blogExcerpt && (

src/components/Blogs/design6/BlogDesign6.js

@@ -37,7 +37,7 @@ const BlogDesign6 = ({
       <div className="">
         <img src={FeaturedImage} alt="" className="w-full" />
         <div className="py-2">
-          <h2 className="text-base text-justify text-grayTextColor mt-2 font-bold leading-6">
+          <h2 className="text-base text-justify text-grayTextColor mt-2 font-sansbold leading-6">
             آیا مواد غذای پر فیبر و مفید هستند؟
           </h2>
           {blogExcerpt && (

src/components/Blogs/design6/index.js

@@ -35,7 +35,7 @@ const BlogDesign6 = ({
       <div className="">
         <img src={FeaturedImage} alt="" className="w-full" />
         <div className="py-2">
-          <h2 className="text-base text-justify text-grayTextColor mt-2 font-bold leading-6">
+          <h2 className="text-base text-justify text-grayTextColor mt-2 font-sansbold leading-6">
             آیا مواد غذای پر فیبر و مفید هستند؟
           </h2>
           {blogExcerpt && (

src/components/BoxNextToEachOther/index.js

@@ -17,7 +17,7 @@ const BoxNextToEachOther = ({ items }) => {
         >
           {console.log(setActive)}
           <h2
-            className={`font-bold ${
+            className={`font-sansbold ${
               active === item ? "text-white" : "text-[#0F0543]"
             }`}
           >

src/components/CardDesign1/index.js

@@ -9,7 +9,7 @@ const CardDesign1 = () => {
       <TitleSubtitle
         subTitle={false}
         title={"طبقه سوم"}
-        titleClassName={"font-bold  text-[#0F0543]"}
+        titleClassName={"font-sansbold  text-[#0F0543]"}
         titleBorderClassName={"w-1 h-5 bg-[#F8EA1F] ml-1"}
       />
       <IconText />

src/components/CardDesign2/index.js

@@ -24,7 +24,7 @@ const CardDesign2 = ({ buttons }) => {
       <TitleSubtitle
         subTitle={false}
         title={"افراد حاضر در این سالن"}
-        titleClassName={"font-bold  text-[#0F0543]"}
+        titleClassName={"font-sansbold  text-[#0F0543]"}
         titleBorderClassName={"w-1 h-5 bg-[#1FF87D] ml-1"}
       />
       <IconText />

src/components/CardDesign3/index.js

@@ -16,7 +16,7 @@ const CardDesign3 = () => {
       <TitleSubtitle
         subTitle={false}
         title={"افراد حاضر در این سالن"}
-        titleClassName={"font-bold text-[#0F0543]"}
+        titleClassName={"font-sansbold text-[#0F0543]"}
         titleBorderClassName={"w-1.5 h-7 bg-[#1F8CF9] ml-2"}
       />
       <div className="mt-7">

src/components/ContactUsInfoCard/index.js

@@ -18,7 +18,7 @@ const ContactUsInfoCard = ({ items }) => {
         <div className="flex flex-row items-center mt-2" key={index}>
           {item.icon && <img className="w-5" src={item.icon} alt={item.icon} />}
           <p
-            className={`text-[#2383E1] text-sm font-iransansBold ${
+            className={`text-[#2383E1] text-sm font-sansbold ${
               item.icon === null ? "mr-8" : "mr-2"
             }`}
           >

src/components/CustomToast/index.js

@@ -11,7 +11,7 @@ const CustomToast = ({
 }) => {
   return (
     <div
-      className={`flex flex-row items-center border-2 rounded mt-4 font-bold text-sm ${backgroundColor} ${borderColor} ${textColor} ${padding} `}
+      className={`flex flex-row items-center border-2 rounded mt-4 font-sansbold text-sm ${backgroundColor} ${borderColor} ${textColor} ${padding} `}
     >
       <p className="flex-1">ترسیم نقشه سالن</p>
       <img src={icon} alt="pen" />

src/components/CustomToast2/index.js

@@ -36,7 +36,7 @@ const CustomToast2 = ({ items, num }) => {
           </div>
           {/* left */}
           <div className="flex flex-row items-center">
-            <span className="px-2 py-0.5 rounded-sm bg-[#C9E2B388] text-[#468722] font-bold">
+            <span className="px-2 py-0.5 rounded-sm bg-[#C9E2B388] text-[#468722] font-sansbold">
               {item.number}
             </span>
             <img src={pen} alt="pen" className="mr-4 cursor-pointer" />

src/components/Digikala/Offer.js

@@ -24,7 +24,7 @@ const Offer = ({ products }) => {
       <div className="flex flex-row items-center p-2">
         {/* right */}
         <div className="flex flex-col items-center justify-between w-2/12">
-          <span className="text-base text-center text-white font-bold leading-8">
+          <span className="text-base text-center text-white font-sansbold leading-8">
             پیـــــشنهاد
             <br />
             شگــــفت

src/components/DistributedData/index.js

@@ -12,7 +12,7 @@ const DistributedData = ({ items }) => {
         >
           {row.map((item, index) => (
             <div
-              className={`flex items-center font-bold text-xs border-[#9DACD344] flex-1 justify-around ${
+              className={`flex items-center font-sansbold text-xs border-[#9DACD344] flex-1 justify-around ${
                 index + 1 < row.length ? "border-l" : ""
               } ${item?.className || ""}`}
             >

src/components/Features/index.js

@@ -12,7 +12,7 @@ const Features = ({ features }) => {
   return (
     <section className="bg-white border-2 border-gray-400 rounded m-7">
       {/* top */}
-      <h2 className="text-lg font-bold text-productTitle mr-7 my-5">
+      <h2 className="text-lg font-sansbold text-productTitle mr-7 my-5">
         امکانات و ویژگی ها
       </h2>
       <div className="w-full flex flex-wrap justify-around items-center">

src/components/Folderlist/index.js

@@ -68,7 +68,10 @@ const Folderlists = ({ items }) => {
               ))}{" "}
             </div>
           </div>
-          <p style={{ color: "#00253A" }} className="text-xs font-bold mt-3">
+          <p
+            style={{ color: "#00253A" }}
+            className="text-xs font-sansbold mt-3"
+          >
             {item.title}
           </p>
           <p style={{ color: "#132F52" }} className="text-xs mt-2">

src/components/Header/desgin1/HeaderDesign1.js

@@ -22,7 +22,7 @@ const HeaderDesign1 = ({ username, userJob }) => {
       )} */}
       <div className="flex justify-between items-center relative">
         <div className="flex w-1/5">
-          <span className={`text-sm font-bold ml-4 pt-1 text-productPrice`}>
+          <span className={`text-sm font-sansbold ml-4 pt-1 text-productPrice`}>
             دانوین
           </span>
         </div>

src/components/OutlineInput/index.js

@@ -24,7 +24,7 @@ focus:outline-none focus:border-[#22577E] focus:ring-1 focus:ring-[#22577E] ${te
         onBlur={onBlur}
       />
       <span
-        className={`absolute right-20 -mt-2  bg-white text-xs px-2 font-bold`}
+        className={`absolute right-20 -mt-2  bg-white text-xs px-2 font-sansbold`}
         style={{ color: outlineTitleClr }}
       >
         {outlineTitle}

src/components/OutlineSpan/index.js

@@ -14,7 +14,7 @@ const OutlineSpan = ({
   return (
     <div className={`${divWidth}`}>
       <span
-        className={`absolute right-20 -mt-2 bg-white text-xs px-2 font-bold z-10`}
+        className={`absolute right-20 -mt-2 bg-white text-xs px-2 font-sansbold z-10`}
         style={{ color: outlineTitleClr }}
       >
         {outlineTitle}

src/components/OutlineTextarea/index.js

@@ -5,7 +5,7 @@ const OutlineTextarea = ({ text, outlineTitleClr, outlineTitle, outline }) => {
     <div>
       {outline && (
         <span
-          className={`absolute right-20 mt-3 bg-white text-xs px-2 font-bold z-10`}
+          className={`absolute right-20 mt-3 bg-white text-xs px-2 font-sansbold z-10`}
           style={{ color: outlineTitleClr }}
         >
           {outlineTitle}

src/components/Playlist/index.js

@@ -25,13 +25,16 @@ const Playlist = ({ items }) => {
             </span>
           </div>
           <div className="flex flex-col items-center mr-3">
-            <p style={{ color: "#132F52" }} className="font-bold text-xs">
+            <p style={{ color: "#132F52" }} className="font-sansbold text-xs">
               {item.memory}{" "}
               <span className="font-light" style={{ fontSize: "10px" }}>
                 گیگابایت
               </span>
             </p>
-            <p style={{ color: "#132F52" }} className="font-bold text-xs mt-2">
+            <p
+              style={{ color: "#132F52" }}
+              className="font-sansbold text-xs mt-2"
+            >
               {item.fileNum}{" "}
               <span className="font-light" style={{ fontSize: "10px" }}>
                 فایل

src/components/ProductStatusCard/index.js

@@ -25,13 +25,13 @@ const ProductStatusCard = ({ items, productPrice, discountPrice }) => {
                 <img src={item.icon} alt="" className="w-8" />
                 <div className="flex flex-col mr-3">
                   <p className="text-sm">
-                    <span className="font-bold">{item.subtitle}</span>
+                    <span className="font-sansbold">{item.subtitle}</span>
                     {item.title}
                   </p>
                   {item.customerSatisfaction && (
                     <p className="text-xs mt-1">
                       رضایت خریداران:
-                      <span className="font-bold text-green-500 mr-2">
+                      <span className="font-sansbold text-green-500 mr-2">
                         {item.customerSatisfactionPercent}
                       </span>
                     </p>
@@ -68,7 +68,7 @@ const ProductStatusCard = ({ items, productPrice, discountPrice }) => {
           <img src={arrow} alt="" className="w-20 h-20" />
         </div>
         <div className="flex flex-col mr-5">
-          <h2 className="text-sm font-bold text-blue-900">
+          <h2 className="text-sm font-sansbold text-blue-900">
             بازگشت بی چون و چرا
           </h2>
           <p className="text-xs mt-2 leading-5 text-justify">

src/components/ProductSuggestion/index.js

@@ -9,7 +9,7 @@ const ProductSuggestion = ({ suggestions, selected }) => {
 
   return (
     <section className="m-10 border-2 border-gray-300 p-4 rounded-lg">
-      <h2 className="text-center text-lg font-bold text-productPrice">
+      <h2 className="text-center text-lg font-sansbold text-productPrice">
         این کالاها برای خرید به شما پیشنهام می دهیم
       </h2>
       {/* product design */}
@@ -69,12 +69,12 @@ const ProductSuggestion = ({ suggestions, selected }) => {
       {/* bottom */}
       <div className="flex flex-col justify-center items-center mt-10">
         <div className="flex flex-row mb-5">
-          <p className="text-sm sm:text-base text-productPrice font-bold">
+          <p className="text-sm sm:text-base text-productPrice font-sansbold">
             جمع لوازم اختیاری خریداری شده
             <span> 56/894/400 </span>
             تومان
           </p>
-          <span className="text-lightBlueTextColor text-sm sm:text-base mr-1 font-bold">
+          <span className="text-lightBlueTextColor text-sm sm:text-base mr-1 font-sansbold">
             1 کالا
           </span>
         </div>
@@ -146,7 +146,7 @@ ProductSuggestion.defaultProps = {
 //   };
 //   return (
 //     <section className="m-10 border-2 border-gray-300 p-4 rounded-lg">
-//       <h2 className="text-center text-lg font-bold text-productPrice">
+//       <h2 className="text-center text-lg font-sansbold text-productPrice">
 //         این کالاها برای خرید به شما پیشنهام می دهیم
 //       </h2>
 //       {/* product design */}
@@ -192,12 +192,12 @@ ProductSuggestion.defaultProps = {
 //       {/* bottom */}
 //       <div className="flex flex-col justify-center items-center mt-10">
 //         <div className="flex flex-row mb-5">
-//           <p className="text-sm sm:text-base text-productPrice font-bold">
+//           <p className="text-sm sm:text-base text-productPrice font-sansbold">
 //             جمع لوازم اختیاری خریداری شده
 //             <span> 56/894/400 </span>
 //             تومان
 //           </p>
-//           <span className="text-lightBlueTextColor text-sm sm:text-base mr-1 font-bold">
+//           <span className="text-lightBlueTextColor text-sm sm:text-base mr-1 font-sansbold">
 //             1 کالا
 //           </span>
 //         </div>

src/components/ProfileInfo/index.js

@@ -8,7 +8,7 @@ const ProfileInfo = ({ name, role }) => {
     <div className="flex flex-row items-center">
       <img src={profilePic} className="rounded-full" alt="profile-pic" />
       <div className="mx-4">
-        <p className="text-[#0F0543] font-bold text-sm">{name}</p>
+        <p className="text-[#0F0543] font-sansbold text-sm">{name}</p>
         <span className="text-[#0F0543] text-xs">{role}</span>
       </div>
       {/* dropdown */}

src/components/ReactTable4/EditRow.js

@@ -15,7 +15,7 @@ const EditRow = ({ row, columns }) => {
           className="w-1 h-4 ml-1 rounded"
           style={{ backgroundColor: "#65A9FF" }}
         ></div>
-        <p className="text-sm font-bold" style={{ color: "#00253A" }}>
+        <p className="text-sm font-sansbold" style={{ color: "#00253A" }}>
           اطلاعات هویتی
         </p>
       </div>
@@ -364,7 +364,7 @@ const EditRow = ({ row, columns }) => {
           className="w-1 h-4 ml-1 rounded"
           style={{ backgroundColor: "#65A9FF" }}
         ></div>
-        <p className="text-sm font-bold" style={{ color: "#00253A" }}>
+        <p className="text-sm font-sansbold" style={{ color: "#00253A" }}>
           اطلاعات شخصی
         </p>
       </div>

src/components/ReactTable4/Pagination.js

@@ -14,7 +14,7 @@ export const Pagination = ({
   return (
     <div className="flex flex-row items-center space-x-1">
       <button
-        className="rounded py-1 px-2  text-xs font-bold"
+        className="rounded py-1 px-2  text-xs font-sansbold"
         style={{ backgroundColor: "#F5F9FF", color: "#65A9FF" }}
         onClick={() => gotoPage(0)}
         disabled={!canPreviousPage}
@@ -22,7 +22,7 @@ export const Pagination = ({
         <img src={dobleLeftArrow} className="rotate-180 w-4 h-4" />
       </button>
       <button
-        className="rounded py-1 px-2  text-xs font-bold"
+        className="rounded py-1 px-2  text-xs font-sansbold"
         style={{ backgroundColor: "#F5F9FF", color: "#65A9FF" }}
         onClick={() => previousPage()}
         disabled={!canPreviousPage}
@@ -30,7 +30,7 @@ export const Pagination = ({
         <img src={rightArrow} className="w-3 h-3" />
       </button>
       <button
-        className="rounded py-1 px-2  text-xs font-bold"
+        className="rounded py-1 px-2  text-xs font-sansbold"
         style={{ backgroundColor: "#F5F9FF", color: "#65A9FF" }}
         onClick={() => nextPage()}
         disabled={!canNextPage}
@@ -38,7 +38,7 @@ export const Pagination = ({
         <img src={leftArrow} className="w-3 h-3" />
       </button>
       <button
-        className="rounded py-1 px-2  text-xs font-bold"
+        className="rounded py-1 px-2  text-xs font-sansbold"
         style={{ backgroundColor: "#F5F9FF", color: "#65A9FF" }}
         onClick={() => gotoPage(pageCount - 1)}
         disabled={!canNextPage}

src/components/ReligiousTimes/index.js

@@ -5,10 +5,10 @@ const ReligiousTimes = ({ hours }) => {
     <div className="flex flex-row items-center justify-center bg-white shadow-sm rounded-lg max-w-[465px] w-1/3 py-3.5 px-0.5 mt-10 mr-10">
       {hours.map((hour, index) => (
         <div className="flex flex-row items-center" key={index}>
-          <span className="text-xs text-[#0F0543] font-bold">
+          <span className="text-xs text-[#0F0543] font-sansbold">
             {hour.partOfDay}
           </span>
-          <span className="text-xs text-[#2483E1] font-bold mr-1">
+          <span className="text-xs text-[#2483E1] font-sansbold mr-1">
             {hour.time}
           </span>
           {Number(index) !== hours.length - 1 && (

src/components/SelectYear/Month.js

@@ -9,7 +9,7 @@ const Month = ({ items }) => {
         <span
           onClick={() => setSelectedYear(selectedYear === item ? null : item)}
           className={`text-xs my-2 cursor-pointer ${
-            selectedYear === item ? "text-[#06BACE] font-bold " : ""
+            selectedYear === item ? "text-[#06BACE] font-sansbold " : ""
           }`}
           key={index}
         >

src/components/SelectYear/index.js

@@ -60,7 +60,7 @@ const SelectYear = ({ items }) => {
                 key={index}
                 className={`text-base my-2  cursor-pointer text-center transition ease-in-out delay-150 ${
                   selectedYear === item
-                    ? "text-[#06BACE] font-bold text-2xl"
+                    ? "text-[#06BACE] font-sansbold text-2xl"
                     : "text-gray-500"
                 }`}
               >

src/components/SemiDonut/index.js

@@ -62,7 +62,7 @@ class SemiDonut extends Component {
           width="100%"
           className=""
         />
-        <span className="font-bold text-blue-400 text-lg absolute left-1/2 bottom-60 transform -translate-x-1/2 -translate-y-1/2">
+        <span className="font-sansbold text-blue-400 text-lg absolute left-1/2 bottom-60 transform -translate-x-1/2 -translate-y-1/2">
           899GB
         </span>
         <span

src/components/Sidebar/SidebarMenu/index.js

@@ -26,7 +26,7 @@ const SidebarMenu = ({ items, buttons }) => {
         {/* profile */}
         <div className="flex flex-row items-center">
           <img src={profilePic} alt="" className="w-12 rounded-full" />
-          <p className="text-blue-600 font-bold text-base flex-1 mr-2">
+          <p className="text-blue-600 font-sansbold text-base flex-1 mr-2">
             کامران کوهستانی شیرازی
           </p>
           <img src={downwardArrow} alt="" className="w-5 cursor-pointer" />

src/components/TimeLineComponent/TimeLineItem.js

@@ -23,7 +23,7 @@ const TimeLineItem = ({ data }) => (
       {/* middle --> title & content */}
       <div className="bg-[#F3F3F3] w-full px-4 py-2 flex flex-row items-center">
         <div className="bg-[#65A9FF] w-1 h-full rounded ml-2"></div>
-        <p className="text-right text-sm font-bold text-[#00253A]">
+        <p className="text-right text-sm font-sansbold text-[#00253A]">
           {data.text}
         </p>
       </div>

src/components/VodProduct/index.js

@@ -70,7 +70,7 @@ const VodProduct = ({
               <div className="absolute left-2 top-2">
                 {discountPricePercent && (
                   <div className="bg-discountPriceBg rounded-md px-2 py-2 mt-2 transition ease-in-out duration-300 transform hover:-translate-y-1 hover:scale-110 cursor-pointer">
-                    <p className="text-discountPriceTitle font-bold text-xs">
+                    <p className="text-discountPriceTitle font-sansbold text-xs">
                       23<span>%</span>
                     </p>
                   </div>
@@ -190,7 +190,7 @@ const VodProduct = ({
                 {star && (
                   <div className="flex items-center">
                     <StarRating />
-                    <span className="text-xs text-productContent font-bold mr-2">
+                    <span className="text-xs text-productContent font-sansbold mr-2">
                       39
                     </span>
                   </div>

src/components/VodProductNew/index.js

@@ -69,7 +69,7 @@ const VodProduct = ({
               <div className="absolute left-2 top-2">
                 {discountPricePercent && (
                   <div className="bg-discountPriceBg rounded-md px-2 py-2 mt-2 transition ease-in-out duration-300 transform hover:-translate-y-1 hover:scale-110 cursor-pointer">
-                    <p className="text-discountPriceTitle font-bold text-xs">
+                    <p className="text-discountPriceTitle font-sansbold text-xs">
                       23<span>%</span>
                     </p>
                   </div>
@@ -189,7 +189,7 @@ const VodProduct = ({
                 {star && (
                   <div className="flex items-center">
                     <StarRating />
-                    <span className="text-xs text-productContent font-bold mr-2">
+                    <span className="text-xs text-productContent font-sansbold mr-2">
                       39
                     </span>
                   </div>

src/components/counterDesign/CounterDesign.js

@@ -61,7 +61,7 @@ const CounterDesign = ({
           />
         )}
         <p
-          className={`text-sm sm:text-base md:text-2xl font-bold text-counterColor`}
+          className={`text-sm sm:text-base md:text-2xl font-sansbold text-counterColor`}
           style={
             count > -1
               ? count === 0

src/components/productDesign/ProductDesign.js

@@ -102,7 +102,7 @@ const ProductDesign = ({
               <div className="absolute left-2 top-2">
                 {discountPricePercent && (
                   <div className="bg-discountPriceBg rounded-md px-2 py-2 mt-2 transition ease-in-out duration-300 transform hover:-translate-y-1 hover:scale-110 cursor-pointer">
-                    <p className="text-discountPriceTitle font-bold text-xs">
+                    <p className="text-discountPriceTitle font-sansbold text-xs">
                       23<span>%</span>
                     </p>
                   </div>
@@ -191,7 +191,7 @@ const ProductDesign = ({
               {star && (
                 <div className="flex items-center mt-2">
                   <StarRating />
-                  <span className="text-xs text-productContent font-bold mr-2">
+                  <span className="text-xs text-productContent font-sansbold mr-2">
                     39
                   </span>
                 </div>

src/components/vodProductDesign/VodProductDesign.js

@@ -90,7 +90,7 @@ const VodProductDesign = ({
               <div className="absolute left-2 top-2">
                 {discountPricePercent && (
                   <div className="bg-discountPriceBg rounded-md px-2 py-2 mt-2 transition ease-in-out duration-300 transform hover:-translate-y-1 hover:scale-110 cursor-pointer">
-                    <p className="text-discountPriceTitle font-bold text-xs">
+                    <p className="text-discountPriceTitle font-sansbold text-xs">
                       23<span>%</span>
                     </p>
                   </div>
@@ -224,7 +224,7 @@ const VodProductDesign = ({
                 {star && (
                   <div className="flex items-center">
                     <StarRating />
-                    <span className="text-xs text-productContent font-bold mr-2">
+                    <span className="text-xs text-productContent font-sansbold mr-2">
                       39
                     </span>
                   </div>