29 lines
1.1 KiB
TypeScript
29 lines
1.1 KiB
TypeScript
import React, { FC } from 'react';
|
|
import { FaTrash } from 'react-icons/fa';
|
|
import { Link } from 'react-router-dom';
|
|
|
|
type Props = {
|
|
label: string
|
|
id: string
|
|
onRemoveQuestion: Function
|
|
}
|
|
|
|
export const SelectedQuestionCard: FC<Props> = ({ label, id, onRemoveQuestion }) => {
|
|
return (
|
|
<div className="mx-1 sm:mx-0 mb-4 mt-3 sm:mb-0 border-l-8 border-primary-light flex bg-white hover:bg-unifeso-50 rounded shadow hover:shadow-md cursor-pointer group transition-all duration-500">
|
|
<a className="flex flex-col w-full px-3 py-2"
|
|
href={`#${id}`}>
|
|
<h2>{`# ${label ?? id}`}</h2>
|
|
</a>
|
|
<div className="flex flex-col relative flex-grow justify-center">
|
|
<button className="group-hover:block absolute bg-gray-300 hover:bg-primary-normal text-gray-500 hover:text-gray-100 hover:shadow-lg rounded-full p-2 cursor-pointer shadow-inner transition-all duration-500"
|
|
style={{ left: '-1.5rem' }}
|
|
onClick={() => onRemoveQuestion(id)}>
|
|
<FaTrash />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|