(feat) images move to public

Author: Rupam-Shil

src/assets/airdrop.webp public/images/airdrop.webpsrc/assets/airdrop.webp renamed to public/images/airdrop.webp

@@ -6,11 +6,6 @@ import {
 	useWaitForTransaction,
 	useDisconnect,
 } from 'wagmi';
-import airdropIcon from '@/assets/airdrop.webp';
-import investorIcon from '@/assets/investor.webp';
-import othersIcon from '@/assets/others.webp';
-import ccpIcon from '@/assets/ccp.webp';
-import kolIcon from '@/assets/kols.webp';
 import {
 	useAccount,
 	useConnectors,
@@ -58,7 +53,7 @@ export default function Provisions() {
 			ticketType: 2,
 			description:
 				'You should have completed more than five transactions on Hashstack V1 across three months, with $100+ cumulative value and $25 minimum supply/borrow balance.',
-			icon: airdropIcon,
+			icon: '/images/airdrop.webp',
 		},
 		{
 			ticketId: 0,
@@ -69,7 +64,7 @@ export default function Provisions() {
 			ticketType: 3,
 			description:
 				'You should have generated diverse, original content about Hashstack across multiple platforms, creating at least three distinct pieces in different formats.',
-			icon: ccpIcon,
+			icon: '/images/ccp.webp',
 		},
 		{
 			ticketId: 0,
@@ -80,7 +75,7 @@ export default function Provisions() {
 			ticketType: 0,
 			description:
 				'Early private round investors who contributed to our foundational stage are eligible to claim their benefits.',
-			icon: investorIcon,
+			icon: '/images/investor.webp',
 		},
 		{
 			ticketId: 0,
@@ -91,7 +86,7 @@ export default function Provisions() {
 			ticketType: 1,
 			description:
 				'Key community members who actively promoted our product across various channels qualify for this program.',
-			icon: kolIcon,
+			icon: '/images/kols.webp',
 		},
 		{
 			ticketId: 0,
@@ -102,7 +97,7 @@ export default function Provisions() {
 			ticketType: 4,
 			description:
 				'Individuals with previous SAFT allocations or past incentive program eligibility can claim through this section.',
-			icon: othersIcon,
+			icon: '/images/others.webp',
 		},
 	]);
 

src/assets/ccp.webp public/images/ccp.webpsrc/assets/ccp.webp renamed to public/images/ccp.webp

@@ -22,16 +22,17 @@ export const ProvisionCard = ({
 }: ProvisionCardProps) => {
 	return (
 		<>
-			<div className='flex flex-col md:flex-row gap-8 lg:gap-12 mt-12'>
-				<div className='flex justify-center items-center w-full md:w-[300px] lg:w-[360px] h-full border border-[#2C2B48] rounded-md overflow-hidden'>
+			<div className='flex flex-col regular:flex-row gap-8 lg:gap-12 mt-12'>
+				<div className='flex justify-center items-center w-full regular:w-[300px] lg:w-[360px] h-[200px] regular:h-[170px] lg:h-[198px]  border border-[#2C2B48] rounded-md overflow-hidden flex-shrink-0'>
 					<Image
 						src={category.icon}
 						alt={category.id}
-						style={{
-							width: '100%',
-							height: '100%',
-							objectFit: 'contain',
-						}}
+						width={360}
+						height={360}
+						quality={75}
+						priority={false}
+						loading='lazy'
+						className='w-full h-full object-cover object-top'
 					/>
 				</div>
 

src/assets/investor.webp public/images/investor.webpsrc/assets/investor.webp renamed to public/images/investor.webp

@@ -8,5 +8,5 @@ export type ProvisionCategory = {
 	EmissionRate: number;
 	ticketType: number;
 	description: string;
-	icon: StaticImageData;
+	icon: string;
 };

src/assets/kols.webp public/images/kols.webpsrc/assets/kols.webp renamed to public/images/kols.webp

@@ -11,6 +11,7 @@ module.exports = {
 	theme: {
 		screens: {
 			sm: '500px',
+			regular: '640px',
 			md: '980px',
 			lg: '1210px',
 		},