mirror of
https://github.com/PinkSheep27/SBU-Hackathon.git
synced 2026-10-11 01:40:25 -04:00
formatting
This commit is contained in:
PawelC4
+262
-262
@@ -1,294 +1,294 @@
|
||||
"use client";
|
||||
// "use client";
|
||||
|
||||
import React, { useState } from "react";
|
||||
// import React, { useState } from "react";
|
||||
|
||||
import {
|
||||
FormData,
|
||||
PROFICIENCY_LEVELS
|
||||
} from './formTypes'; // Ensure path is correct
|
||||
// import {
|
||||
// FormData,
|
||||
// PROFICIENCY_LEVELS
|
||||
// } from './formTypes'; // Ensure path is correct
|
||||
|
||||
interface FormPageProps {
|
||||
onFormSubmit: (data: FormData) => void;
|
||||
}
|
||||
// interface FormPageProps {
|
||||
// onFormSubmit: (data: FormData) => void;
|
||||
// }
|
||||
|
||||
const FormPage: React.FC<FormPageProps> = ({ onFormSubmit }) => {
|
||||
const [formData, setFormData] = useState<FormData>({
|
||||
Hackathon: '',
|
||||
mainTheme: '',
|
||||
tracksStack: [''],
|
||||
students: [{
|
||||
studentName: '',
|
||||
skills: [{ skillName: '', proficiency: PROFICIENCY_LEVELS[1] }]
|
||||
}],
|
||||
});
|
||||
// const FormPage: React.FC<FormPageProps> = ({ onFormSubmit }) => {
|
||||
// const [formData, setFormData] = useState<FormData>({
|
||||
// Hackathon: '',
|
||||
// mainTheme: '',
|
||||
// tracksStack: [''],
|
||||
// students: [{
|
||||
// studentName: '',
|
||||
// skills: [{ skillName: '', proficiency: PROFICIENCY_LEVELS[1] }]
|
||||
// }],
|
||||
// });
|
||||
|
||||
const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setFormData({
|
||||
...formData,
|
||||
[event.target.name]: event.target.value,
|
||||
});
|
||||
};
|
||||
// const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
// setFormData({
|
||||
// ...formData,
|
||||
// [event.target.name]: event.target.value,
|
||||
// });
|
||||
// };
|
||||
|
||||
const handleTracksChange = (event: React.ChangeEvent<HTMLInputElement>, index: number) => {
|
||||
const newTracksStack = [...formData.tracksStack];
|
||||
newTracksStack[index] = event.target.value;
|
||||
// const handleTracksChange = (event: React.ChangeEvent<HTMLInputElement>, index: number) => {
|
||||
// const newTracksStack = [...formData.tracksStack];
|
||||
// newTracksStack[index] = event.target.value;
|
||||
|
||||
setFormData({
|
||||
...formData,
|
||||
tracksStack: newTracksStack,
|
||||
});
|
||||
};
|
||||
// setFormData({
|
||||
// ...formData,
|
||||
// tracksStack: newTracksStack,
|
||||
// });
|
||||
// };
|
||||
|
||||
const handleAddTracks = () => {
|
||||
setFormData({
|
||||
...formData,
|
||||
tracksStack: [...formData.tracksStack, ''],
|
||||
});
|
||||
};
|
||||
// const handleAddTracks = () => {
|
||||
// setFormData({
|
||||
// ...formData,
|
||||
// tracksStack: [...formData.tracksStack, ''],
|
||||
// });
|
||||
// };
|
||||
|
||||
const handleRemoveTracks = (index: number) => {
|
||||
const newTracksStack = formData.tracksStack.filter((_, i) => i !== index);
|
||||
setFormData({
|
||||
...formData,
|
||||
tracksStack: newTracksStack,
|
||||
});
|
||||
};
|
||||
// const handleRemoveTracks = (index: number) => {
|
||||
// const newTracksStack = formData.tracksStack.filter((_, i) => i !== index);
|
||||
// setFormData({
|
||||
// ...formData,
|
||||
// tracksStack: newTracksStack,
|
||||
// });
|
||||
// };
|
||||
|
||||
const handleStudentNameChange = (e: React.ChangeEvent<HTMLInputElement>, studentIndex: number) => {
|
||||
const newStudents = [...formData.students];
|
||||
newStudents[studentIndex].studentName = e.target.value;
|
||||
setFormData({ ...formData, students: newStudents });
|
||||
};
|
||||
// const handleStudentNameChange = (e: React.ChangeEvent<HTMLInputElement>, studentIndex: number) => {
|
||||
// const newStudents = [...formData.students];
|
||||
// newStudents[studentIndex].studentName = e.target.value;
|
||||
// setFormData({ ...formData, students: newStudents });
|
||||
// };
|
||||
|
||||
const handleAddStudent = () => {
|
||||
setFormData({
|
||||
...formData,
|
||||
students: [...formData.students, { studentName: '', skills: [{ skillName: '', proficiency: PROFICIENCY_LEVELS[1] }] }]
|
||||
});
|
||||
};
|
||||
// const handleAddStudent = () => {
|
||||
// setFormData({
|
||||
// ...formData,
|
||||
// students: [...formData.students, { studentName: '', skills: [{ skillName: '', proficiency: PROFICIENCY_LEVELS[1] }] }]
|
||||
// });
|
||||
// };
|
||||
|
||||
const handleRemoveStudent = (studentIndex: number) => {
|
||||
const newStudents = formData.students.filter((_, i) => i !== studentIndex);
|
||||
setFormData({ ...formData, students: newStudents });
|
||||
};
|
||||
// const handleRemoveStudent = (studentIndex: number) => {
|
||||
// const newStudents = formData.students.filter((_, i) => i !== studentIndex);
|
||||
// setFormData({ ...formData, students: newStudents });
|
||||
// };
|
||||
|
||||
const handleSkillChange = (
|
||||
e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>,
|
||||
studentIndex: number,
|
||||
skillIndex: number
|
||||
) => {
|
||||
const newStudents = [...formData.students];
|
||||
const targetName = e.target.name;
|
||||
const targetValue = e.target.value;
|
||||
// const handleSkillChange = (
|
||||
// e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>,
|
||||
// studentIndex: number,
|
||||
// skillIndex: number
|
||||
// ) => {
|
||||
// const newStudents = [...formData.students];
|
||||
// const targetName = e.target.name;
|
||||
// const targetValue = e.target.value;
|
||||
|
||||
if (targetName === 'skillName') {
|
||||
newStudents[studentIndex].skills[skillIndex].skillName = targetValue;
|
||||
} else if (targetName === 'proficiency') {
|
||||
newStudents[studentIndex].skills[skillIndex].proficiency = targetValue;
|
||||
}
|
||||
// if (targetName === 'skillName') {
|
||||
// newStudents[studentIndex].skills[skillIndex].skillName = targetValue;
|
||||
// } else if (targetName === 'proficiency') {
|
||||
// newStudents[studentIndex].skills[skillIndex].proficiency = targetValue;
|
||||
// }
|
||||
|
||||
setFormData({ ...formData, students: newStudents });
|
||||
};
|
||||
// setFormData({ ...formData, students: newStudents });
|
||||
// };
|
||||
|
||||
const handleAddSkill = (studentIndex: number) => {
|
||||
const newStudents = [...formData.students];
|
||||
newStudents[studentIndex].skills.push({ skillName: '', proficiency: PROFICIENCY_LEVELS[1] });
|
||||
setFormData({ ...formData, students: newStudents });
|
||||
};
|
||||
// const handleAddSkill = (studentIndex: number) => {
|
||||
// const newStudents = [...formData.students];
|
||||
// newStudents[studentIndex].skills.push({ skillName: '', proficiency: PROFICIENCY_LEVELS[1] });
|
||||
// setFormData({ ...formData, students: newStudents });
|
||||
// };
|
||||
|
||||
const handleRemoveSkill = (studentIndex: number, skillIndex: number) => {
|
||||
const newStudents = [...formData.students];
|
||||
newStudents[studentIndex].skills = newStudents[studentIndex].skills.filter((_, i) => i !== skillIndex);
|
||||
setFormData({ ...formData, students: newStudents });
|
||||
};
|
||||
// const handleRemoveSkill = (studentIndex: number, skillIndex: number) => {
|
||||
// const newStudents = [...formData.students];
|
||||
// newStudents[studentIndex].skills = newStudents[studentIndex].skills.filter((_, i) => i !== skillIndex);
|
||||
// setFormData({ ...formData, students: newStudents });
|
||||
// };
|
||||
|
||||
const handleSubmit = (event: React.FormEvent) => {
|
||||
event.preventDefault();
|
||||
onFormSubmit(formData); // Call the prop function with formData
|
||||
};
|
||||
// const handleSubmit = (event: React.FormEvent) => {
|
||||
// event.preventDefault();
|
||||
// onFormSubmit(formData); // Call the prop function with formData
|
||||
// };
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-50 flex items-start justify-center p-4 sm:p-6 font-inter">
|
||||
<div className="w-full max-w-2xl bg-white p-8 shadow-2xl rounded-xl mt-8">
|
||||
<h1 className="text-3xl font-extrabold text-center text-gray-800 mb-8 tracking-tight">
|
||||
Generate Project Idea
|
||||
</h1>
|
||||
// return (
|
||||
// <div className="min-h-screen bg-gray-50 flex items-start justify-center p-4 sm:p-6 font-inter">
|
||||
// <div className="w-full max-w-2xl bg-white p-8 shadow-2xl rounded-xl mt-8">
|
||||
// <h1 className="text-3xl font-extrabold text-center text-gray-800 mb-8 tracking-tight">
|
||||
// Generate Project Idea
|
||||
// </h1>
|
||||
|
||||
<form className="space-y-8" onSubmit={handleSubmit}>
|
||||
<div className="space-y-6 border-b pb-6 border-gray-200">
|
||||
<h2 className="text-xl font-bold text-gray-700">Project Context</h2>
|
||||
<div>
|
||||
<label htmlFor="hackathonName" className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Hackathon Name
|
||||
</label>
|
||||
<input
|
||||
id="hackathonName"
|
||||
required
|
||||
type="text"
|
||||
placeholder="e.g., Google Code Jam"
|
||||
name="Hackathon"
|
||||
value={formData.Hackathon}
|
||||
onChange={handleChange}
|
||||
className="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:ring-blue-500 focus:border-blue-500 transition duration-150"
|
||||
/>
|
||||
</div>
|
||||
// <form className="space-y-8" onSubmit={handleSubmit}>
|
||||
// <div className="space-y-6 border-b pb-6 border-gray-200">
|
||||
// <h2 className="text-xl font-bold text-gray-700">Project Context</h2>
|
||||
// <div>
|
||||
// <label htmlFor="hackathonName" className="block text-sm font-medium text-gray-700 mb-1">
|
||||
// Hackathon Name
|
||||
// </label>
|
||||
// <input
|
||||
// id="hackathonName"
|
||||
// required
|
||||
// type="text"
|
||||
// placeholder="e.g., Google Code Jam"
|
||||
// name="Hackathon"
|
||||
// value={formData.Hackathon}
|
||||
// onChange={handleChange}
|
||||
// className="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:ring-blue-500 focus:border-blue-500 transition duration-150"
|
||||
// />
|
||||
// </div>
|
||||
|
||||
<div>
|
||||
<label htmlFor="mainTheme" className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Main Theme
|
||||
</label>
|
||||
<input
|
||||
id="mainTheme"
|
||||
required
|
||||
type="text"
|
||||
placeholder="e.g., Sustainability or AI Ethics"
|
||||
name="mainTheme"
|
||||
value={formData.mainTheme}
|
||||
onChange={handleChange}
|
||||
className="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:ring-blue-500 focus:border-blue-500 transition duration-150"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
// <div>
|
||||
// <label htmlFor="mainTheme" className="block text-sm font-medium text-gray-700 mb-1">
|
||||
// Main Theme
|
||||
// </label>
|
||||
// <input
|
||||
// id="mainTheme"
|
||||
// required
|
||||
// type="text"
|
||||
// placeholder="e.g., Sustainability or AI Ethics"
|
||||
// name="mainTheme"
|
||||
// value={formData.mainTheme}
|
||||
// onChange={handleChange}
|
||||
// className="mt-1 block w-full px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:ring-blue-500 focus:border-blue-500 transition duration-150"
|
||||
// />
|
||||
// </div>
|
||||
// </div>
|
||||
|
||||
<div className="space-y-4 border-b pb-6 border-gray-200">
|
||||
<label className="block text-xl font-bold text-gray-700">
|
||||
Tracks Stack
|
||||
</label>
|
||||
<div className="space-y-3">
|
||||
{formData.tracksStack.map((tracks, index) => (
|
||||
<div key={index} className="flex gap-2 items-center">
|
||||
<input
|
||||
type="text"
|
||||
required
|
||||
placeholder={`Tracks #${index + 1}`}
|
||||
name={`tracksStack-${index}`}
|
||||
value={tracks}
|
||||
onChange={(e) => handleTracksChange(e, index)}
|
||||
className="flex-grow px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:ring-green-500 focus:border-green-500 transition duration-150"
|
||||
/>
|
||||
{formData.tracksStack.length > 1 && (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => handleRemoveTracks(index)}
|
||||
className="text-sm px-3 py-2 bg-red-500 text-white rounded-lg hover:bg-red-600 transition duration-150 flex-shrink-0"
|
||||
aria-label={`Remove tracks ${index + 1}`}
|
||||
>
|
||||
Remove
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
// <div className="space-y-4 border-b pb-6 border-gray-200">
|
||||
// <label className="block text-xl font-bold text-gray-700">
|
||||
// Tracks Stack
|
||||
// </label>
|
||||
// <div className="space-y-3">
|
||||
// {formData.tracksStack.map((tracks, index) => (
|
||||
// <div key={index} className="flex gap-2 items-center">
|
||||
// <input
|
||||
// type="text"
|
||||
// required
|
||||
// placeholder={`Tracks #${index + 1}`}
|
||||
// name={`tracksStack-${index}`}
|
||||
// value={tracks}
|
||||
// onChange={(e) => handleTracksChange(e, index)}
|
||||
// className="flex-grow px-4 py-2 border border-gray-300 rounded-lg shadow-sm focus:ring-green-500 focus:border-green-500 transition duration-150"
|
||||
// />
|
||||
// {formData.tracksStack.length > 1 && (
|
||||
// <button
|
||||
// type="button"
|
||||
// onClick={() => handleRemoveTracks(index)}
|
||||
// className="text-sm px-3 py-2 bg-red-500 text-white rounded-lg hover:bg-red-600 transition duration-150 flex-shrink-0"
|
||||
// aria-label={`Remove tracks ${index + 1}`}
|
||||
// >
|
||||
// Remove
|
||||
// </button>
|
||||
// )}
|
||||
// </div>
|
||||
// ))}
|
||||
// </div>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleAddTracks}
|
||||
className="flex items-center justify-center gap-1 py-2 px-4 border border-transparent rounded-lg shadow-sm text-sm font-medium text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition duration-150"
|
||||
>
|
||||
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path></svg>
|
||||
Add Tracks
|
||||
</button>
|
||||
</div>
|
||||
// <button
|
||||
// type="button"
|
||||
// onClick={handleAddTracks}
|
||||
// className="flex items-center justify-center gap-1 py-2 px-4 border border-transparent rounded-lg shadow-sm text-sm font-medium text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition duration-150"
|
||||
// >
|
||||
// <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path></svg>
|
||||
// Add Tracks
|
||||
// </button>
|
||||
// </div>
|
||||
|
||||
<div className="space-y-4">
|
||||
<h2 className="text-xl font-bold text-gray-700">Team Members and Skills</h2>
|
||||
// <div className="space-y-4">
|
||||
// <h2 className="text-xl font-bold text-gray-700">Team Members and Skills</h2>
|
||||
|
||||
<div className="space-y-6">
|
||||
{formData.students.map((student, studentIndex) => (
|
||||
<div key={studentIndex} className="p-4 border-2 border-indigo-200 rounded-lg bg-indigo-50 shadow-inner space-y-4">
|
||||
// <div className="space-y-6">
|
||||
// {formData.students.map((student, studentIndex) => (
|
||||
// <div key={studentIndex} className="p-4 border-2 border-indigo-200 rounded-lg bg-indigo-50 shadow-inner space-y-4">
|
||||
|
||||
<div className="flex justify-between items-center pb-2 border-b border-indigo-300">
|
||||
<h4 className="text-lg font-semibold text-indigo-700">Student #{studentIndex + 1}</h4>
|
||||
{formData.students.length > 1 && (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => handleRemoveStudent(studentIndex)}
|
||||
className="text-xs px-2 py-1 bg-red-400 text-white rounded-md hover:bg-red-500 transition duration-150"
|
||||
>
|
||||
Remove Student
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
// <div className="flex justify-between items-center pb-2 border-b border-indigo-300">
|
||||
// <h4 className="text-lg font-semibold text-indigo-700">Student #{studentIndex + 1}</h4>
|
||||
// {formData.students.length > 1 && (
|
||||
// <button
|
||||
// type="button"
|
||||
// onClick={() => handleRemoveStudent(studentIndex)}
|
||||
// className="text-xs px-2 py-1 bg-red-400 text-white rounded-md hover:bg-red-500 transition duration-150"
|
||||
// >
|
||||
// Remove Student
|
||||
// </button>
|
||||
// )}
|
||||
// </div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-indigo-700 mb-1">Student Name</label>
|
||||
<input
|
||||
type="text"
|
||||
required
|
||||
placeholder="Student Name"
|
||||
value={student.studentName}
|
||||
onChange={(e) => handleStudentNameChange(e, studentIndex)}
|
||||
className="w-full px-4 py-2 border border-indigo-300 rounded-lg shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
|
||||
/>
|
||||
</div>
|
||||
// <div>
|
||||
// <label className="block text-sm font-medium text-indigo-700 mb-1">Student Name</label>
|
||||
// <input
|
||||
// type="text"
|
||||
// required
|
||||
// placeholder="Student Name"
|
||||
// value={student.studentName}
|
||||
// onChange={(e) => handleStudentNameChange(e, studentIndex)}
|
||||
// className="w-full px-4 py-2 border border-indigo-300 rounded-lg shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
|
||||
// />
|
||||
// </div>
|
||||
|
||||
<div className="space-y-3 p-3 bg-white rounded-lg border border-indigo-100">
|
||||
<h5 className="text-md font-medium text-indigo-700">Skills</h5>
|
||||
{student.skills.map((skill, skillIndex) => (
|
||||
<div key={skillIndex} className="flex gap-2 items-center">
|
||||
<input
|
||||
type="text"
|
||||
required
|
||||
name="skillName"
|
||||
placeholder="Skill (e.g., React, Python)"
|
||||
value={skill.skillName}
|
||||
onChange={(e) => handleSkillChange(e, studentIndex, skillIndex)}
|
||||
className="flex-grow px-3 py-2 border border-gray-300 rounded-lg text-sm focus:ring-purple-500 focus:border-purple-500"
|
||||
/>
|
||||
<select
|
||||
name="proficiency"
|
||||
value={skill.proficiency}
|
||||
onChange={(e) => handleSkillChange(e, studentIndex, skillIndex)}
|
||||
className="px-3 py-2 border border-gray-300 rounded-lg text-sm focus:ring-purple-500 focus:border-purple-500 w-1/3"
|
||||
>
|
||||
{PROFICIENCY_LEVELS.map(level => (
|
||||
<option key={level} value={level}>{level}</option>
|
||||
))}
|
||||
</select>
|
||||
{student.skills.length > 1 && (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => handleRemoveSkill(studentIndex, skillIndex)}
|
||||
className="text-xs px-2 py-1 bg-red-500 text-white rounded-md hover:bg-red-600 transition duration-150 flex-shrink-0"
|
||||
>
|
||||
X
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => handleAddSkill(studentIndex)}
|
||||
className="mt-2 text-xs flex items-center gap-1 py-1 px-3 border border-transparent rounded-lg text-white bg-purple-600 hover:bg-purple-700 transition duration-150"
|
||||
>
|
||||
+ Add Skill
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
// <div className="space-y-3 p-3 bg-white rounded-lg border border-indigo-100">
|
||||
// <h5 className="text-md font-medium text-indigo-700">Skills</h5>
|
||||
// {student.skills.map((skill, skillIndex) => (
|
||||
// <div key={skillIndex} className="flex gap-2 items-center">
|
||||
// <input
|
||||
// type="text"
|
||||
// required
|
||||
// name="skillName"
|
||||
// placeholder="Skill (e.g., React, Python)"
|
||||
// value={skill.skillName}
|
||||
// onChange={(e) => handleSkillChange(e, studentIndex, skillIndex)}
|
||||
// className="flex-grow px-3 py-2 border border-gray-300 rounded-lg text-sm focus:ring-purple-500 focus:border-purple-500"
|
||||
// />
|
||||
// <select
|
||||
// name="proficiency"
|
||||
// value={skill.proficiency}
|
||||
// onChange={(e) => handleSkillChange(e, studentIndex, skillIndex)}
|
||||
// className="px-3 py-2 border border-gray-300 rounded-lg text-sm focus:ring-purple-500 focus:border-purple-500 w-1/3"
|
||||
// >
|
||||
// {PROFICIENCY_LEVELS.map(level => (
|
||||
// <option key={level} value={level}>{level}</option>
|
||||
// ))}
|
||||
// </select>
|
||||
// {student.skills.length > 1 && (
|
||||
// <button
|
||||
// type="button"
|
||||
// onClick={() => handleRemoveSkill(studentIndex, skillIndex)}
|
||||
// className="text-xs px-2 py-1 bg-red-500 text-white rounded-md hover:bg-red-600 transition duration-150 flex-shrink-0"
|
||||
// >
|
||||
// X
|
||||
// </button>
|
||||
// )}
|
||||
// </div>
|
||||
// ))}
|
||||
// <button
|
||||
// type="button"
|
||||
// onClick={() => handleAddSkill(studentIndex)}
|
||||
// className="mt-2 text-xs flex items-center gap-1 py-1 px-3 border border-transparent rounded-lg text-white bg-purple-600 hover:bg-purple-700 transition duration-150"
|
||||
// >
|
||||
// + Add Skill
|
||||
// </button>
|
||||
// </div>
|
||||
// </div>
|
||||
// ))}
|
||||
// </div>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleAddStudent}
|
||||
className="mt-4 w-full flex items-center justify-center gap-2 py-2 px-4 border border-transparent rounded-lg shadow-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition duration-150"
|
||||
>
|
||||
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"></path></svg>
|
||||
Add Team Member
|
||||
</button>
|
||||
</div>
|
||||
// <button
|
||||
// type="button"
|
||||
// onClick={handleAddStudent}
|
||||
// className="mt-4 w-full flex items-center justify-center gap-2 py-2 px-4 border border-transparent rounded-lg shadow-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition duration-150"
|
||||
// >
|
||||
// <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"></path></svg>
|
||||
// Add Team Member
|
||||
// </button>
|
||||
// </div>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
className="w-full flex justify-center py-3 px-4 border border-transparent rounded-lg shadow-lg text-lg font-semibold text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 transition duration-150 mt-6"
|
||||
>
|
||||
Generate Idea
|
||||
</button>
|
||||
</form>
|
||||
// <button
|
||||
// type="submit"
|
||||
// className="w-full flex justify-center py-3 px-4 border border-transparent rounded-lg shadow-lg text-lg font-semibold text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 transition duration-150 mt-6"
|
||||
// >
|
||||
// Generate Idea
|
||||
// </button>
|
||||
// </form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
// </div>
|
||||
// </div>
|
||||
// );
|
||||
// };
|
||||
|
||||
export default FormPage;
|
||||
// export default FormPage;
|
||||
Reference in New Issue
Block a user