frontend/nextjs/components/ResearchBlocks/Question.tsx

import Image from "next/image";

interface QuestionProps {
  question: string;
}

const Question: React.FC<QuestionProps> = ({ question }) => {
  return (
    <div className="container w-full flex flex-col sm:flex-row items-start gap-3 pt-5 mb-2">

      <div className="flex items-center gap-2 sm:gap-4">

        <Image

          src={"/img/message-question-circle.svg"}

          alt="message"

          width={24}

          height={24}

          className="w-6 h-6"

        />

        <p className="font-bold uppercase leading-[152%] text-white">

          Research Task:

        </p><br/>

      </div>

      <div className="grow text-white break-words max-w-full log-message">&quot;{question}&quot;</div>

    </div>
  );
};

export default Question;