From 4695dea9339528d44cd8203ed5e0c0dc702efbab Mon Sep 17 00:00:00 2001
From: Jianqi Jin <arian.jianqi@gmail.com>
Date: Tue, 26 Sep 2023 19:50:08 -0500
Subject: [PATCH] add waterfall pic wall
---
src/components/Waterfall.js | 39 ++++++++++++++++++++++++++++++-------
1 file changed, 32 insertions(+), 7 deletions(-)
diff --git a/src/components/Waterfall.js b/src/components/Waterfall.js
index b47808c..0fcb567 100644
--- a/src/components/Waterfall.js
+++ b/src/components/Waterfall.js
@@ -13,9 +13,33 @@ const WaterfallItem = ({ data, onLoad }) => {
return (
<div className="waterfallItem" ref={ref}>
<div className="project__content__main__container">
- <div style={{ display: 'flex', flexDirection: 'row', justifyContent:'space-between' }}>
- <h3 style={{ fontFamily: "itrFontMedium", fontSize: '25px', color: "#fff", marginBottom: 12 }}>{data.title}</h3>
- <h3 style={{ fontFamily: "itrFontMedium", fontSize: '25px', color: "#fff", marginBottom: 12 }}>{data.sub}</h3>
+ <div
+ style={{
+ display: "flex",
+ flexDirection: "row",
+ justifyContent: "space-between",
+ }}
+ >
+ <h3
+ style={{
+ fontFamily: "itrFontMedium",
+ fontSize: "25px",
+ color: "#fff",
+ marginBottom: 12,
+ }}
+ >
+ {data.title}
+ </h3>
+ <h3
+ style={{
+ fontFamily: "itrFontMedium",
+ fontSize: "25px",
+ color: "#fff",
+ marginBottom: 12,
+ }}
+ >
+ {data.sub}
+ </h3>
</div>
<div className="project_item_content">
<Image
@@ -24,10 +48,11 @@ const WaterfallItem = ({ data, onLoad }) => {
onLoad(sizeRef.current.size);
}, 500);
}}
- alt="asd"
- onError={setTimeout(() => {
- onLoad(sizeRef.current.size);
- }, 500)}
+ onError={() =>
+ setTimeout(() => {
+ onLoad(sizeRef.current.size);
+ }, 500)
+ }
width={"100%"}
src={data.img}
/>