The source code for our eny.social landing page, which is mirrored in a different repository as part of the CI setup.
eny.social
social-network
eny
local-first
fix(layout): restrict image width for some content components that caused an overflow
+3
-3
+1
-1
app/components/RememberWhen.tsx
+1
-1
app/components/RememberWhen.tsx
···
66
66
].map((item, i) => (
67
67
<FadeIn key={i} delay={200 + i * 150}>
68
68
<div
69
-
className="relative w-[197px] h-[225px] md:w-[263px] md:h-[300px] overflow-hidden"
69
+
className="relative w-[28vw] h-[32vw] max-w-[263px] max-h-[300px] overflow-hidden"
70
70
style={{ clipPath: `url(#${item.mask})` }}
71
71
>
72
72
<img
+2
-2
app/components/WeBelieve.tsx
+2
-2
app/components/WeBelieve.tsx
···
50
50
51
51
<div className="relative flex items-center justify-center gap-4">
52
52
{/* Circular photo */}
53
-
<div className="h-48 w-48 overflow-hidden rounded-full md:h-56 md:w-56">
53
+
<div className="h-[25vw] w-[25vw] max-h-56 max-w-56 overflow-hidden rounded-full">
54
54
<img
55
55
src="/images/pexels-davner-ribeiro-2711547-4574405.jpg"
56
56
alt="Community"
···
58
58
/>
59
59
</div>
60
60
{/* Rounded rectangle photo */}
61
-
<div className="h-56 w-40 overflow-hidden rounded-3xl md:h-64 md:w-44">
61
+
<div className="h-[30vw] w-[22vw] max-h-64 max-w-44 overflow-hidden rounded-3xl">
62
62
<img
63
63
src="/images/pexels-guilhermealmeida-1858175.png"
64
64
alt="Connection"