Skip to content

Commit 801375a

Browse files
EjembiEmmanuelEjembiEmmanuel
committed
feat: FAQ tab
1 parent 7529276 commit 801375a

File tree

2 files changed

+194
-0
lines changed

2 files changed

+194
-0
lines changed

‎src/app/strategy/[strategyId]/_components/Strategy.tsx‎

Lines changed: 193 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
11
'use client';
22

33
import {
4+
Accordion,
5+
AccordionButton,
6+
AccordionIcon,
7+
AccordionItem,
8+
AccordionPanel,
49
Alert,
510
AlertIcon,
611
Avatar,
@@ -318,6 +323,190 @@ function Details({ strategy }: { strategy: StrategyInfo<any> }) {
318323
);
319324
}
320325

326+
function FAQ() {
327+
return (
328+
<Flex flexDirection={'column'} padding={'24px 0px'} gap={'24px'}>
329+
<Text fontSize={'24px'} color={'white'} fontWeight={'600'}>
330+
Get to know about all your doubts
331+
</Text>
332+
333+
<Flex>
334+
<Flex flexDirection={'column'} width={'696px'} gap={'16px'}>
335+
<Accordion
336+
width={'100%'}
337+
display={'flex'}
338+
flexDirection={'column'}
339+
gap={'16px'}
340+
>
341+
<AccordionItem
342+
borderRadius={'8px'}
343+
borderWidth={'1px'}
344+
borderColor={'slate_blue'}
345+
>
346+
<Text fontSize={'14px'} fontWeight={'500'} color={'border_light'}>
347+
<AccordionButton>
348+
<Box flex="1" textAlign="left">
349+
Question asked basis zkLend
350+
</Box>
351+
<AccordionIcon />
352+
</AccordionButton>
353+
</Text>
354+
<AccordionPanel
355+
pb={4}
356+
fontSize={'14px'}
357+
fontWeight={'400'}
358+
lineHeight={'20px'}
359+
color={'silver_gray'}
360+
>
361+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
362+
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
363+
enim ad minim veniam, quis nostrud exercitation ullamco laboris
364+
nisi ut aliquip ex ea commodo consequat.
365+
</AccordionPanel>
366+
</AccordionItem>
367+
368+
<AccordionItem
369+
borderRadius={'8px'}
370+
borderWidth={'1px'}
371+
borderColor={'slate_blue'}
372+
>
373+
<Text fontSize={'14px'} fontWeight={'500'} color={'border_light'}>
374+
<AccordionButton>
375+
<Box flex="1" textAlign="left">
376+
Question asked basis zkLend
377+
</Box>
378+
<AccordionIcon />
379+
</AccordionButton>
380+
</Text>
381+
<AccordionPanel
382+
pb={4}
383+
fontSize={'14px'}
384+
fontWeight={'400'}
385+
lineHeight={'20px'}
386+
color={'silver_gray'}
387+
>
388+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
389+
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
390+
enim ad minim veniam, quis nostrud exercitation ullamco laboris
391+
nisi ut aliquip ex ea commodo consequat.
392+
</AccordionPanel>
393+
</AccordionItem>
394+
395+
<AccordionItem
396+
borderRadius={'8px'}
397+
borderWidth={'1px'}
398+
borderColor={'slate_blue'}
399+
>
400+
<Text fontSize={'14px'} fontWeight={'500'} color={'border_light'}>
401+
<AccordionButton>
402+
<Box flex="1" textAlign="left">
403+
Question asked basis zkLend
404+
</Box>
405+
<AccordionIcon />
406+
</AccordionButton>
407+
</Text>
408+
<AccordionPanel
409+
pb={4}
410+
fontSize={'14px'}
411+
fontWeight={'400'}
412+
lineHeight={'20px'}
413+
color={'silver_gray'}
414+
>
415+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
416+
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
417+
enim ad minim veniam, quis nostrud exercitation ullamco laboris
418+
nisi ut aliquip ex ea commodo consequat.
419+
</AccordionPanel>
420+
</AccordionItem>
421+
422+
<AccordionItem
423+
borderRadius={'8px'}
424+
borderWidth={'1px'}
425+
borderColor={'slate_blue'}
426+
>
427+
<Text fontSize={'14px'} fontWeight={'500'} color={'border_light'}>
428+
<AccordionButton>
429+
<Box flex="1" textAlign="left">
430+
Question asked basis zkLend
431+
</Box>
432+
<AccordionIcon />
433+
</AccordionButton>
434+
</Text>
435+
<AccordionPanel
436+
pb={4}
437+
fontSize={'14px'}
438+
fontWeight={'400'}
439+
lineHeight={'20px'}
440+
color={'silver_gray'}
441+
>
442+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
443+
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
444+
enim ad minim veniam, quis nostrud exercitation ullamco laboris
445+
nisi ut aliquip ex ea commodo consequat.
446+
</AccordionPanel>
447+
</AccordionItem>
448+
</Accordion>
449+
</Flex>
450+
451+
<Flex
452+
flexDirection={'column'}
453+
alignItems={'center'}
454+
alignSelf={'center'}
455+
gap={'16px'}
456+
marginLeft={'auto'}
457+
marginRight={'auto'}
458+
>
459+
<Flex
460+
flexDirection={'column'}
461+
width={'415px'}
462+
gap={'8px'}
463+
padding={'10px'}
464+
borderWidth={'1px'}
465+
borderRadius={'8px'}
466+
borderColor={'slate_blue'}
467+
>
468+
<Text
469+
fontSize={'14px'}
470+
fontWeight={'500'}
471+
color={'border_light'}
472+
textAlign={'center'}
473+
>
474+
For more queries reach out to us on Telegram
475+
</Text>
476+
<Text
477+
fontSize={'14px'}
478+
fontWeight={'400'}
479+
color={'silver_gray'}
480+
textAlign={'center'}
481+
>
482+
Our team will respond to you soon!
483+
</Text>
484+
</Flex>
485+
486+
<Link href="https://t.me/+HQ_eHaXmF-1lZDc1">
487+
<Button
488+
bg={'transparent'}
489+
padding={'12px 20px'}
490+
borderRadius={'100px'}
491+
borderWidth={'1px'}
492+
borderColor={'color_7'}
493+
color={'color_7'}
494+
fontSize={'14px'}
495+
fontWeight={'700'}
496+
_hover={{
497+
bg: 'transparent',
498+
color: 'color_7',
499+
}}
500+
>
501+
Connect on Telegram
502+
</Button>
503+
</Link>
504+
</Flex>
505+
</Flex>
506+
</Flex>
507+
);
508+
}
509+
321510
const Strategy = ({ params }: StrategyParams) => {
322511
const address = useAtomValue(addressAtom);
323512
const strategies = useAtomValue(strategiesAtom);
@@ -767,6 +956,10 @@ const Strategy = ({ params }: StrategyParams) => {
767956
<TabPanel width={'100%'} padding={0}>
768957
{strategy && <Details strategy={strategy} />}
769958
</TabPanel>
959+
960+
<TabPanel width={'100%'} padding={0}>
961+
<FAQ />
962+
</TabPanel>
770963
</TabPanels>
771964
</Tabs>
772965
</Flex>

‎src/app/template.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,7 @@ const theme = extendTheme({
7171
color_4: '#4DB8FF',
7272
color_5: '#16131E',
7373
color_6: '#111119',
74+
color_7: '#6E59FF',
7475

7576
border_light: '#CFCFEA',
7677
border_light_3p: '#CFCFEA0D',

0 commit comments

Comments
 (0)