a tool for shared writing and social publishing
added product images
+15
-9
+15
-9
app/about/Features.tsx
+15
-9
app/about/Features.tsx
···
1
-
import { Separator } from "components/Layout";
2
-
3
1
export const Features = () => {
4
2
return (
5
3
<>
6
4
<div className="aboutSpotlightFeatures pt-24 flex flex-col gap-16">
7
-
<div className="flex md:flex-row flex-col md:gap-8 gap-4 justify-center">
8
-
{" "}
9
-
<div className="bg-[#F1EDE5]! aspect-3/2 w-fill min-w-[160px] max-w-[720px] grow mx-auto rounded-lg" />
5
+
<div className="flex md:flex-row flex-col md:gap-12 gap-4 justify-center">
6
+
<img
7
+
src="/about/reach-audience.png"
8
+
alt=""
9
+
className="w-fill min-w-[160px] max-w-[720px] grow mx-auto"
10
+
/>
10
11
<div className="flex flex-col w-fill max-w-sm text-center md:text-left md:py-4 py-0 mx-auto">
11
12
<h3>Reach your readers</h3>
12
13
<p>
13
-
Send updates via email and on the Atmosphere, a social ecosystem
14
-
of millions
14
+
Send updates via email, Bluesky, the Atmosphere
15
+
<br />
16
+
Be part of a social ecosystem with millions of users
15
17
</p>
16
18
</div>
17
19
</div>
···
20
22
<h3>Express yourself</h3>
21
23
<p>Custom themes and domains</p>
22
24
</div>
23
-
<div className="bg-[#F1EDE5]! aspect-3/2 w-fill min-w-[160px] max-w-[720px] grow mx-auto rounded-lg" />
25
+
<img
26
+
src="/about/customize.png"
27
+
alt=""
28
+
className="w-fill min-w-[160px] max-w-[720px] grow mx-auto"
29
+
/>
24
30
</div>
25
31
</div>
26
32
<div className="flex gap-3 sm:gap-8 w-fit mx-auto pt-12 sm:pt-20 items-stretch">
···
28
34
<h4>Write together</h4>
29
35
<p>
30
36
Collaborative editing <br />
31
-
and easy sharing{" "}
37
+
and easy sharing
32
38
</p>
33
39
</div>
34
40
<div className="border-l border-t border-border w-px " />
public/about/customize.png
public/about/customize.png
This is a binary file and will not be displayed.
public/about/reach-audience.png
public/about/reach-audience.png
This is a binary file and will not be displayed.