You can add the Privacy, About-Us, and Support pages with this approach

[traflagar]

In order to add your own Privacy, About-Us and Support pages do the following,

Create these folder in the src/app/ directory:

support
about-us
privacy

In each folder put a page.tsx.

You can use the following code to fill your page.tsx. This only support basic copy-pasting of plaintext into the designated field for your content. Update the title field too.

You do not need to mess with the function names or tags that says "PrivacyPage()" or "PrivacySection".

import { Container } from '@/components/container';

export default function PrivacyPage() {
  return (
    <div className='flex flex-col gap-8'>
      <PrivacySection />
    </div>
  );
}

function PrivacySection() {
  const privacyText = `

Privacy Policy

Last updated: March 2024
1. Introduction
....PUT YOUR TEXT HERE

`
    .replace(/&/g, '&amp;')
    .replace(/</g, '<')
    .replace(/>/g, '>')
    .replace(/"/g, '&quot;')
    .replace(/'/g, '&#039;');

  return (
    <section className='relative overflow-hidden'>
      <Container className='relative rounded-lg bg-black py-20'>
        <div className='relative z-10 flex flex-col gap-5 lg:pl-8'>
          <div className='w-fit rounded-full bg-gradient-to-r from-[#616571] via-[#7782A9] to-[#826674] px-4 py-1'>
            <span className='font-alt text-sm font-semibold text-black mix-blend-soft-light'>
              Privacy Policy
            </span>
          </div>
          <div 
            className='prose prose-invert max-w-none whitespace-pre-line'
            dangerouslySetInnerHTML={{ __html: privacyText }}
          />
        </div>
      </Container>
    </section>
  );
}