diff --git a/apps/frontend/public/auth/avatars/ali.jpg b/apps/frontend/public/auth/avatars/ali.jpg new file mode 100644 index 00000000..a3102f60 Binary files /dev/null and b/apps/frontend/public/auth/avatars/ali.jpg differ diff --git a/apps/frontend/public/auth/avatars/andy.jpeg b/apps/frontend/public/auth/avatars/andy.jpeg new file mode 100644 index 00000000..b0792588 Binary files /dev/null and b/apps/frontend/public/auth/avatars/andy.jpeg differ diff --git a/apps/frontend/public/auth/avatars/anica.jpg b/apps/frontend/public/auth/avatars/anica.jpg new file mode 100644 index 00000000..2762359a Binary files /dev/null and b/apps/frontend/public/auth/avatars/anica.jpg differ diff --git a/apps/frontend/public/auth/avatars/bart.jpg b/apps/frontend/public/auth/avatars/bart.jpg new file mode 100644 index 00000000..68fa588e Binary files /dev/null and b/apps/frontend/public/auth/avatars/bart.jpg differ diff --git a/apps/frontend/public/auth/avatars/david.jpg b/apps/frontend/public/auth/avatars/david.jpg new file mode 100644 index 00000000..3fcf6029 Binary files /dev/null and b/apps/frontend/public/auth/avatars/david.jpg differ diff --git a/apps/frontend/public/auth/avatars/dilini.jpeg b/apps/frontend/public/auth/avatars/dilini.jpeg new file mode 100644 index 00000000..0cbe820a Binary files /dev/null and b/apps/frontend/public/auth/avatars/dilini.jpeg differ diff --git a/apps/frontend/public/auth/avatars/george.jpg b/apps/frontend/public/auth/avatars/george.jpg new file mode 100644 index 00000000..ca11fcba Binary files /dev/null and b/apps/frontend/public/auth/avatars/george.jpg differ diff --git a/apps/frontend/public/auth/avatars/henry.jpg b/apps/frontend/public/auth/avatars/henry.jpg new file mode 100644 index 00000000..72df9f6b Binary files /dev/null and b/apps/frontend/public/auth/avatars/henry.jpg differ diff --git a/apps/frontend/public/auth/avatars/iorn.jpg b/apps/frontend/public/auth/avatars/iorn.jpg new file mode 100644 index 00000000..af7edbc0 Binary files /dev/null and b/apps/frontend/public/auth/avatars/iorn.jpg differ diff --git a/apps/frontend/public/auth/avatars/johna.jpg b/apps/frontend/public/auth/avatars/johna.jpg new file mode 100644 index 00000000..f36fac83 Binary files /dev/null and b/apps/frontend/public/auth/avatars/johna.jpg differ diff --git a/apps/frontend/public/auth/avatars/josh.jpg b/apps/frontend/public/auth/avatars/josh.jpg new file mode 100644 index 00000000..f00128da Binary files /dev/null and b/apps/frontend/public/auth/avatars/josh.jpg differ diff --git a/apps/frontend/public/auth/avatars/kiley.jpeg b/apps/frontend/public/auth/avatars/kiley.jpeg new file mode 100644 index 00000000..9a25cd47 Binary files /dev/null and b/apps/frontend/public/auth/avatars/kiley.jpeg differ diff --git a/apps/frontend/public/auth/avatars/maria.jpg b/apps/frontend/public/auth/avatars/maria.jpg new file mode 100644 index 00000000..0755a50d Binary files /dev/null and b/apps/frontend/public/auth/avatars/maria.jpg differ diff --git a/apps/frontend/public/auth/avatars/michael.jpeg b/apps/frontend/public/auth/avatars/michael.jpeg new file mode 100644 index 00000000..9bd2e641 Binary files /dev/null and b/apps/frontend/public/auth/avatars/michael.jpeg differ diff --git a/apps/frontend/public/auth/avatars/serge.jpeg b/apps/frontend/public/auth/avatars/serge.jpeg new file mode 100644 index 00000000..c7879bab Binary files /dev/null and b/apps/frontend/public/auth/avatars/serge.jpeg differ diff --git a/apps/frontend/public/auth/avatars/vince.jpeg b/apps/frontend/public/auth/avatars/vince.jpeg new file mode 100644 index 00000000..3357759c Binary files /dev/null and b/apps/frontend/public/auth/avatars/vince.jpeg differ diff --git a/apps/frontend/public/auth/avatars/vincent.jpg b/apps/frontend/public/auth/avatars/vincent.jpg new file mode 100644 index 00000000..6611eab3 Binary files /dev/null and b/apps/frontend/public/auth/avatars/vincent.jpg differ diff --git a/apps/frontend/src/app/(app)/auth/layout.tsx b/apps/frontend/src/app/(app)/auth/layout.tsx index b20788a0..1ee91cff 100644 --- a/apps/frontend/src/app/(app)/auth/layout.tsx +++ b/apps/frontend/src/app/(app)/auth/layout.tsx @@ -4,7 +4,7 @@ export const dynamic = 'force-dynamic'; import { ReactNode } from 'react'; import Image from 'next/image'; import loadDynamic from 'next/dynamic'; -import { Testimonial } from '@gitroom/frontend/components/auth/testimonial'; +import { TestimonialComponent } from '@gitroom/frontend/components/auth/testimonial.component'; const ReturnUrlComponent = loadDynamic(() => import('./return.url.component')); export default async function AuthLayout({ children, @@ -15,55 +15,22 @@ export default async function AuthLayout({ return (
- + {/**/} -
+
Postiz
{children}
-
+
Over 18,000+{' '} - Entrepreneurs use
Postiz - To Grow Their Social Presence -
-
-
-
-
-
- {[1, 2].map((p) => ( -
- - - - - - - - -
- ))} -
-
- {[1, 2].map((p) => ( -
- - - - - - - - - -
- ))} -
-
+ Entrepreneurs use +
+ Postiz To Grow Their Social Presence
+
); diff --git a/apps/frontend/src/app/global.scss b/apps/frontend/src/app/global.scss index ce2787f6..9f9c95cc 100644 --- a/apps/frontend/src/app/global.scss +++ b/apps/frontend/src/app/global.scss @@ -706,21 +706,21 @@ html[dir='rtl'] [dir='ltr'] { } @keyframes marquee-up { - //0% { - // transform: translateY(0); - //} - //100% { - // transform: translateY(-50%); - //} + 0% { + transform: translateY(0); + } + 100% { + transform: translateY(-50%); + } } @keyframes marquee-down { - //0% { - // transform: translateY(-50%); - //} - //100% { - // transform: translateY(0%); - //} + 0% { + transform: translateY(-50%); + } + 100% { + transform: translateY(0%); + } } .blackGradBottomBg { diff --git a/apps/frontend/src/components/auth/activate.tsx b/apps/frontend/src/components/auth/activate.tsx index a8191c12..3ffbd423 100644 --- a/apps/frontend/src/components/auth/activate.tsx +++ b/apps/frontend/src/components/auth/activate.tsx @@ -5,7 +5,7 @@ import { useT } from '@gitroom/react/translation/get.transation.service.client'; export function Activate() { const t = useT(); return ( - <> +

{t('activate_your_account', 'Activate your account')} @@ -19,6 +19,6 @@ export function Activate() { 'Please check your email to activate your account.' )}

- +
); } diff --git a/apps/frontend/src/components/auth/forgot.tsx b/apps/frontend/src/components/auth/forgot.tsx index 57300f63..d6f5110c 100644 --- a/apps/frontend/src/components/auth/forgot.tsx +++ b/apps/frontend/src/components/auth/forgot.tsx @@ -36,52 +36,57 @@ export function Forgot() { setLoading(false); }; return ( - -
-
-

- {t('forgot_password_1', 'Forgot Password')} -

-
- {!state ? ( - <> -
- -
-
-
- +
+ + +
+

+ {t('forgot_password_1', 'Forgot Password')} +

+
+ {!state ? ( + <> +
+ +
+
+
+ +
+

+ + {t('go_back_to_login', 'Go back to login')} + +

+
+ + ) : ( + <> +
+ {t( + 'we_have_send_you_an_email_with_a_link_to_reset_your_password', + 'We have send you an email with a link to reset your password.' + )}

{t('go_back_to_login', 'Go back to login')}

-
- - ) : ( - <> -
- {t( - 'we_have_send_you_an_email_with_a_link_to_reset_your_password', - 'We have send you an email with a link to reset your password.' - )} -
-

- - {t('go_back_to_login', 'Go back to login')} - -

- - )} - - + + )} + + +
); } diff --git a/apps/frontend/src/components/auth/login.tsx b/apps/frontend/src/components/auth/login.tsx index 6344b918..370f5f8a 100644 --- a/apps/frontend/src/components/auth/login.tsx +++ b/apps/frontend/src/components/auth/login.tsx @@ -55,70 +55,81 @@ export function Login() { }; return ( -
-
-

- {t('sign_in', 'Sign In')} -

-
- {isGeneral && genericOauth ? ( - - ) : !isGeneral ? ( - - ) : ( -
- - {!!neynarClientId && } - {billingEnabled && } + +
+
+

+ {t('sign_in', 'Sign In')} +

- )} -
-
-
-
{t('or', 'OR')}
+
+ {t('continue_with', 'Continue With')}
-
- -
- - -
-
-
- +
+ {isGeneral && genericOauth ? ( + + ) : !isGeneral ? ( + + ) : ( +
+ + {!!neynarClientId && } + {billingEnabled && } +
+ )} +
+
+
+
or
+
+
+
+
+ + +
+
+
+ +
+

+ {t('don_t_have_an_account', "Don't Have An Account?")}  + + {t('sign_up', 'Sign Up')} + +

+

+ + {t('forgot_password', 'Forgot password')} + +

+
+
-

- {t('don_t_have_an_account', "Don't Have An Account?")}  - - {t('sign_up', 'Sign Up')} - -

-

- - {t('forgot_password', 'Forgot password')} - -

diff --git a/apps/frontend/src/components/auth/providers/farcaster.provider.tsx b/apps/frontend/src/components/auth/providers/farcaster.provider.tsx index ee58c963..ce4e492a 100644 --- a/apps/frontend/src/components/auth/providers/farcaster.provider.tsx +++ b/apps/frontend/src/components/auth/providers/farcaster.provider.tsx @@ -26,7 +26,7 @@ export const ButtonCaster: FC<{ >
{ return (
{ const t = useT(); return (
{ + return ( +
+
+
+
+
+
+ {[1, 2].flatMap((p) => + testimonials1.flatMap((a) => ( +
+ +
+ )) + )} +
+
+ {[1, 2].flatMap((p) => + testimonials2.flatMap((a) => ( +
+ +
+ )) + )} +
+
+
+
+ ); +}; diff --git a/apps/frontend/src/components/auth/testimonial.tsx b/apps/frontend/src/components/auth/testimonial.tsx index 2604079a..a9eceddf 100644 --- a/apps/frontend/src/components/auth/testimonial.tsx +++ b/apps/frontend/src/components/auth/testimonial.tsx @@ -1,15 +1,31 @@ -export const Testimonial = () => { +import { FC } from 'react'; +import Image from 'next/image'; + +export const Testimonial: FC<{ + picture: string; + name: string; + description: string; + content: any; +}> = ({ content, description, name, picture }) => { return (
-
-
-
-
name
-
description
+ {/* Header */} +
+
+ {name} +
+ +
+
{name}
+
+ {description} +
-
- content + + {/* Content */} +
+ {typeof content === 'string' ? content.replace(/\\n/g, '\n') : content}
); diff --git a/apps/frontend/tailwind.config.js b/apps/frontend/tailwind.config.js index 810f8292..e5c3f7e9 100644 --- a/apps/frontend/tailwind.config.js +++ b/apps/frontend/tailwind.config.js @@ -116,8 +116,8 @@ module.exports = { fadeDown: 'fadeDown 4s ease-in-out forwards', normalFadeDown: 'normalFadeDown 0.5s ease-in-out forwards', newMessages: 'newMessages 1s ease-in-out 4s forwards', - marqueeUp: 'marquee-up 10s linear infinite', - marqueeDown: 'marquee-down 10s linear infinite', + marqueeUp: 'marquee-up 100s linear infinite', + marqueeDown: 'marquee-down 100s linear infinite', }, boxShadow: { yellow: '0 0 60px 20px #6b6237', diff --git a/libraries/react-shared-libraries/src/helpers/testomonials.tsx b/libraries/react-shared-libraries/src/helpers/testomonials.tsx index 7b625b90..69d9c3f8 100644 --- a/libraries/react-shared-libraries/src/helpers/testomonials.tsx +++ b/libraries/react-shared-libraries/src/helpers/testomonials.tsx @@ -1,18 +1,227 @@ -export const testomonials1 = [ +export const testimonials1 = [ { - picture: '', - name: '', - handle: '', - content: <>Content, + picture: '/auth/avatars/vincent.jpg', + name: 'Vincent L.', + description: 'Marketing Coordinator', + content: ( + <> + The UI is friendly and the AI content assistant is surprisingly + effective for professional tones. I especially like how it adjusts to + different industries. + + ), + }, + { + picture: '/auth/avatars/dilini.jpeg', + name: 'Dilini R.', + description: 'AI & Tech Consultant', + content: ( + <> + I just found out about Postiz, a tool for scheduling social media.{' '} + {'\n'} + Exactly what I wish there was a few years back, I even thought of + building one myself at one point, but didn't have the time to. {'\n'} + What I like about it so far: {'\n\n'} + It connects to LinkedIn, X, Instagram, Facebook (and others) from one + dashboard. {'\n'} + {'\n'} + Because it's open-source, you can see how it works and even tweak it if + you need to. {'\n'} + {'\n'} + I've used a few scheduling tools before and most of them are either + expensive or try to be "all-in-one marketing platforms." {'\n'} + {'\n'} + Postiz seems to focus on just doing one thing well. {'\n'} + {'\n'} + + ), + }, + { + picture: '/auth/avatars/johna.jpg', + name: 'Johannes D.', + description: 'CEO', + content: ( + <> + As a privacy-first company we appreciate being able to self-host Postiz! + It brings all the core functionality of a social media scheduler plus a + lot of AI to make things faster. It's also very easy to deploy and use, + great work! + + ), + }, + { + picture: '/auth/avatars/george.jpg', + name: 'George B.', + description: 'Marketing Assistant', + content: ( + <> + It's so easy to jump in and start scheduling. I like that I can see all + planned posts at a glance and edit them quickly if needed. + + ), + }, + { + picture: '/auth/avatars/maria.jpg', + name: 'Maria Camila A.', + description: 'Data Analyst', + content: ( + <> + Postiz changed how we manage our social media presence by aggregating + our platforms into one effective tool. Post scheduling, and AI post + ideation are two of the many features that come with Postiz, and have + made our management of social media simple and effective! Highly + recommend + + ), + }, + { + picture: '/auth/avatars/bart.jpg', + name: 'Bartolomeo H.', + description: 'CEO', + content: ( + <> + It only takes 10 minutes to set up your X scheduling automation. {'\n'} + n8n + Postiz =πŸ”₯Never miss a day of posting again: {'\n\n'}β†’ Easy to get + started {'\n'}β†’ Tutorial video included {'\n'}β†’ Automated content + creation {'\n'}β†’ Multi-platform publishing {'\n'}β†’ Self-hosted (no + monthly fees) {'\n'}β†’ Open-source (customize everything) {'\n'} + + ), + }, + { + picture: '/auth/avatars/henry.jpg', + name: 'Henry H.', + description: 'Social Media Coordinator', + content: ( + <> + The interface is clean and simple. I love how the AI assistant helps + speed up caption writing without sounding generic. It's really helpful + when I'm on a tight schedule. + + ), + }, + { + picture: '/auth/avatars/andy.jpeg', + name: 'Andy C.', + description: 'AI Specialist', + content: ( + <> + Manage all your social media accounts from a single place: Postiz, a + really cool tool I recently discovered :D! {'\n'} + It comes with a bunch of cool tools for posting at specific times, + posting across multiple platforms simultaneously, etc. And all of this + can potentially be self-hosted for free; you just need a small server to + configure everything ;D! It works really well :D! + + ), }, ]; - -export const testomonials2 = [ +export const testimonials2 = [ { - picture: '', - name: '', - handle: '', - content: <>Content, + picture: '/auth/avatars/michael.jpeg', + name: 'Michael H.', + description: 'Senior frontend developer', + content: ( + <> + 🌟 Exciting news! πŸš€ I've just started using Postiz, a fantastic new + tool for scheduling my social media content! {'\n\n'} + Why did I choose Postiz? The ability to self-host it means significant + savings for me! πŸ’° {'\n\n'} + Postiz is an open-source scheduling tool that allows you to plan and + automate posts across 19+ platforms, including X, LinkedIn, BlueSky, and + Mastodon. {'\n\n'} + With its powerful editor, you can easily connect your accounts, create + rich scheduled posts, and manage multiple channels all in one place. + Plus, it supports image uploads, recurring posts, and timezone-aware + scheduling! πŸ“…βœ¨ {'\n\n'} + Built with privacy and flexibility in mind, Postiz can run on your own + infrastructure or be used as a hosted service. It's perfect for + individuals, teams, and communities looking for control and automation + without the unnecessary bloat. {'\n\n'} + + ), + }, + { + picture: '/auth/avatars/kiley.jpeg', + name: 'Kiley H.', + description: 'Content Creator', + content: ( + <> + The unified dashboard helps me manage Instagram, Facebook, and LinkedIn + from one place. I love that it saves time and keeps our campaigns + aligned across all platforms. + + ), + }, + { + picture: '/auth/avatars/iorn.jpg', + name: 'Iornienge S.', + description: 'Social Media Manager', + content: ( + <> + There are several things I love about this suite. Some of these things + include {'\n'}- Ease of use {'\n'}- Helps me organize my social media + accounts {'\n'}- I get work done faster {'\n'}- It does not consume my + time {'\n'}- it has a professional interface {'\n'} + + ), + }, + { + picture: '/auth/avatars/david.jpg', + name: 'David C.', + description: 'Digital Marketing Manager', + content: ( + <> + Postiz makes it so easy to plan ahead. The AI suggestions are relevant, + and the platform feels lightweight but powerful + + ), + }, + { + picture: '/auth/avatars/serge.jpeg', + name: 'Serge A.', + description: 'CEO', + content: ( + <> + Good tool for social media campaigns. The great thing is that the + platform constantly evolves - new features appear all the time, so I can + follow the latest trends (latest AI developments) without leaving + Postiz. + + ), + }, + { + picture: '/auth/avatars/anica.jpg', + name: 'Anica R.', + description: 'University Applications Specialist', + content: ( + <> + It is easy to use, manages your posts simple.It is a helpful tool that + let you organize your content. + + ), + }, + { + picture: '/auth/avatars/josh.jpg', + name: 'Josh W.', + description: 'Content Manager', + content: ( + <> + It's super easy to use even if you're not very techy. The AI writing + tool gives good drafts so I don't have to start from scratch every time + + ), + }, + { + picture: '/auth/avatars/vince.jpeg', + name: 'Vince C.', + description: 'Developer Relations Engineer', + content: ( + <> + I work in Developer Relations, so having a tool that helps me manage and + crosspost to different platforms saves me so, so, so much time! + + ), }, ];