You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
57 lines
2.2 KiB
57 lines
2.2 KiB
import { Routes } from '@/config/routes'
|
|
import {
|
|
Accordion,
|
|
AccordionContent,
|
|
AccordionItem,
|
|
AccordionTrigger,
|
|
} from '../../../components/ui/accordion'
|
|
|
|
export default function HowItWorksSection() {
|
|
return (
|
|
<section
|
|
id='how-it-works'
|
|
className='container mx-auto py-24 px-4 sm:px-6 lg:px-8 max-w-7xl bg-gray-50 dark:bg-muted rounded-2xl'
|
|
>
|
|
<div className='mx-auto max-w-[58rem]'>
|
|
<h2 className='text-3xl font-bold text-center mb-8'>How It Works</h2>
|
|
<p className='text-center mb-12 text-gray-500'>
|
|
How it works is simple. You install the app on your Android device,
|
|
and it will turn your device into a SMS Gateway. You can then use the
|
|
API to send SMS messages from your web applications.
|
|
</p>
|
|
<Accordion type='single' collapsible className='w-full'>
|
|
<AccordionItem value='step-1'>
|
|
<AccordionTrigger>
|
|
Step 1: Download The Android App
|
|
</AccordionTrigger>
|
|
<AccordionContent>
|
|
Download the Android App from{' '}
|
|
<a href={Routes.downloadAndroidApp} target='_blank'>
|
|
{Routes.downloadAndroidApp}
|
|
</a>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value='step-2'>
|
|
<AccordionTrigger>Step 2: Generate an API key</AccordionTrigger>
|
|
<AccordionContent>
|
|
Generate an API key from the dashboard
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value='step-3'>
|
|
<AccordionTrigger>Step 3: Scan the QR code</AccordionTrigger>
|
|
<AccordionContent>
|
|
Open the textbee mobile app and scan the QR code or enter your api
|
|
key manually and enable the gateway app
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value='step-4'>
|
|
<AccordionTrigger>Step 4: Start sending</AccordionTrigger>
|
|
<AccordionContent>
|
|
Start sending SMS messages from the dashboard or using the API
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
</Accordion>
|
|
</div>
|
|
</section>
|
|
)
|
|
}
|