diff --git a/src/components/QuestionApprovalProgressBarSection.tsx b/src/components/QuestionApprovalProgressBarSection.tsx new file mode 100644 index 0000000..c97fc7f --- /dev/null +++ b/src/components/QuestionApprovalProgressBarSection.tsx @@ -0,0 +1,35 @@ +import React from 'react'; +import { Container } from './Container'; + +const QUESTION_COUNT_LIMIT = 100; + +export function QuestionApprovalProgressBarSection() { + const approvedQuestionCount = 3; + + const progressBarPercentage = Math.floor((approvedQuestionCount / QUESTION_COUNT_LIMIT) * 100); + + return ( + +

We are launching soon!

+
+ +
+ {approvedQuestionCount} +
+
+ / {QUESTION_COUNT_LIMIT} + Questions Approved +
+
+
Questions Approved
+
+ + {progressBarPercentage}% + +
+
+ ); +} diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 5d3aae0..d479024 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,5 +1,6 @@ import { PageProps } from '@/lib/types'; import Head from 'next/head'; +import { QuestionApprovalProgressBarSection } from '@/components/QuestionApprovalProgressBarSection'; import { CallToAction } from '../components/CallToAction'; import { CallToAction2 } from '../components/CallToAction2'; import { Features } from '../components/Features'; @@ -17,6 +18,7 @@ export default function Home({ session }: PageProps) {
+