ImAlpha/Portfolio
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

updated images for optimization loading

Browse Source
This commit is contained in:
Jacob Delgado 2024-02-01 04:29:24 -08:00
parent 09be87a3d3
commit f9bbe27fa9
1 changed files with 9 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
Websites/jefes-nextjs/app/menu/MenuCard/MenuCard.tsx
View File

@ -31,9 +31,9 @@ const MenuCard = ({ Menu }: any) => {
alt="chili pepper spice" alt="chili pepper spice"
fill fill
style={{ objectFit: "cover", objectPosition: "center" }} style={{ objectFit: "cover", objectPosition: "center" }}
quality={100} quality={75}
className="flex transition-opacity opacity-0 duration-[2s]" sizes="(max-width: 325px) 100vw, (max-width: 1200px) 50vw, 33vw"
onLoadingComplete={(image) => image.classList.remove("opacity-0")} className="flex"
/> />
</div> </div>
</div> </div>
@ -55,11 +55,12 @@ const MenuCard = ({ Menu }: any) => {
fill fill
style={{ style={{
objectFit: "contain", objectFit: "contain",
objectPosition: "left", objectPosition: "center",
}} }}
quality={100} quality={100}
className="flex transition-opacity opacity-0 duration-[2s]" sizes="(max-width: 25px) 100vw, (max-width: 1200px) 50vw, 33vw"
onLoadingComplete={(image) => image.classList.remove("opacity-0")} className="flex"
/> />
) : ( ) : (
<div className="hidden"></div> <div className="hidden"></div>
@ -74,8 +75,8 @@ const MenuCard = ({ Menu }: any) => {
objectPosition: "right", objectPosition: "right",
}} }}
quality={100} quality={100}
className="flex transition-opacity opacity-0 duration-[2s]" sizes="(max-width: 25px) 100vw, (max-width: 325px) 50vw, 33vw"
onLoadingComplete={(image) => image.classList.remove("opacity-0")} className="flex"
/> />
) : ( ) : (
<div className="hidden"></div> <div className="hidden"></div>