diff --git a/src/components/CoreSystem.astro b/src/components/CoreSystem.astro new file mode 100644 index 0000000..ac911f1 --- /dev/null +++ b/src/components/CoreSystem.astro @@ -0,0 +1,44 @@ +--- +const cards = [ + { img: '/assets/icon-messaging.png', title: 'Private Messaging', desc: 'Stay connected through fast and familiar one-on-one conversations.' }, + { img: '/assets/icon-groups.png', title: 'Group Chats', desc: 'Create spaces for friends, teams, communities, and shared discussions.' }, + { img: '/assets/icon-channels.png', title: 'Channels', desc: 'Follow updates, announcements, and content from the people or communities you care about.' }, + { img: '/assets/icon-voice.png', title: 'Voice Calls', desc: 'Talk in real time whenever messages are not enough.' }, + { img: '/assets/icon-video.png', title: 'Video Calls', desc: 'Connect face-to-face with a simple and reliable video call experience.' }, + { img: '/assets/icon-media.png', title: 'Media Sharing', desc: 'Share photos, videos, files, and updates in your conversations.' }, +] +const rows = [cards.slice(0, 3), cards.slice(3)] +--- + +
+
+

CORE SYSTEM

+
+
+

Built for how modern

+

communication actually works.

+
+
+

+ Different identities, different conversations, and different privacy levels should not be forced into one flat interface. Talk Pro lets them exist in order inside one platform. +

+
+ +
+ {rows.map((row) => ( +
+ {row.map((card) => ( +
+
+ {card.title} +
+
+

{card.title}

+
+

{card.desc}

+
+ ))} +
+ ))} +
+
diff --git a/src/pages/index.astro b/src/pages/index.astro index 56cf065..0871c23 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -2,9 +2,11 @@ import Base from '../layouts/Base.astro' import Header from '../components/Header.astro' import Hero from '../components/Hero.astro' +import CoreSystem from '../components/CoreSystem.astro' ---
+