import React, { ButtonHTMLAttributes } from "react";
import styled from "styled-components";
import { colors } from "@theme/colors";

const RemoveButton = styled.button`
  background-color: ${colors.orange1} !important;
  margin-left: auto !important;
  margin-bottom: 0.5rem !important;
  padding: 0.3rem 0.5rem !important;
  float: right !important;
`;

type QuestionProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, "type">;

const Question: React.FC<QuestionProps> = ({ children, ...props }) => (
  <div>
    <RemoveButton type="button" {...props}>
      Delete
    </RemoveButton>
    {children}
  </div>
);

export default Question;
