File "TopSection.tsx"

Full Path: /home/trinadezambia/public_html/student_panel/src/components/shared/common/TopSection.tsx
File size: 1.02 KB
MIME-type: text/html
Charset: utf-8

'use client';
import { cn } from '@/components/lib/utils';
import React from 'react';
import Title from './Title';

export default function TopSection({
  title,
  description,
  tag,
  tagClassName,
  tagBgColor,
  tagTextColor,
  tagDotColor,
}: {
  title: string;
  description: string;
  tag: string;
  tagClassName?: string;
  tagBgColor?: string;
  tagTextColor?: string;
  tagDotColor?: string;
}) {
  return (
    <div className="text-center mb-12">
      {/* Educational Programs tag */}
      <Title
        title={tag}
        bgColor={tagBgColor}
        textColor={tagTextColor}
        dotColor={tagDotColor}
        className={cn(
          'flex justify-center items-center w-fit mx-auto',
          tagClassName
        )}
      />

      {/* Main heading */}
      <h2 className="md:text-4xl text-2xl font-bold text-black my-4 max-w-md mx-auto">
        {title}
      </h2>

      {/* Description */}
      <p className="text-base font-normal text-gray-600 max-w-lg mx-auto">
        {description}
      </p>
    </div>
  );
}