wishpal_ironfan
/
tiefen_space_h5
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改图片布局样式

This commit is contained in:
al 2024-08-09 19:39:17 +08:00
parent f8160ecd42
commit 3e7359983b
1 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/Photos/index.js
View File

@ -209,14 +209,14 @@ export default function Photos({
return ( return (
<> <>
<div <div
className={`grid ${ className={`${
currentPhotos.length > 1 ? "grid-cols-3 gap-1.5 min-h-[24vw]" : "grid-cols-1 min-h-[38vw]" currentPhotos.length > 1 ? "grid grid-cols-3 gap-1.5 min-h-[24vw]" : "min-h-[38vw] w-max"
}`} }`}
> >
{currentPhotos.map((item, index) => { {currentPhotos.map((item, index) => {
return ( return (
<div <div
className="relative w-max" className={`relative w-max ${currentPhotos.length > 1 ? "h-[24vw]" : ""} `}
style={{ maxWidth: "calc(100vw - 72px)" }} style={{ maxWidth: "calc(100vw - 72px)" }}
key={index} key={index}
onClick={() => { onClick={() => {
@ -242,7 +242,7 @@ export default function Photos({
{ {
<div <div
className={`overflow-hidden inline-block rounded h-full max-h-80 ${ className={`overflow-hidden inline-block rounded h-full max-h-80 ${
currentPhotos.length > 1 ? "min-h-[24vw]" : "max-h-[38vw]" currentPhotos.length > 1 ? "h-[24vw]" : "auto"
}`} }`}
> >
<Image <Image
@ -250,8 +250,8 @@ export default function Photos({
placeholder={ placeholder={
<div className="w-full h-full min-h-96 bg-[#1d1d1d] rounded"></div> <div className="w-full h-full min-h-96 bg-[#1d1d1d] rounded"></div>
} }
width={currentPhotos.length > 1 ? "24vw" : "auto"} width={currentPhotos.length > 1 ? "24vw" : "36vw"}
height={currentPhotos.length > 1 ? "24vw" : "38vw"} height={currentPhotos.length > 1 ? "24vw" : "100%"}
className={`rounded max-w-full ${ className={`rounded max-w-full ${
item?.type == "hid" && type == "space" ? "imageBlur" : "" item?.type == "hid" && type == "space" ? "imageBlur" : ""
}`} }`}