1 files changed, 17 insertions, 13 deletions
diff --git a/src/settings/components/ui/DeleteButton.tsx b/src/settings/components/ui/DeleteButton.tsx
index df8976e..ce0183b 100644
--- a/src/settings/components/ui/DeleteButton.tsx
+++ b/src/settings/components/ui/DeleteButton.tsx
@@ -1,19 +1,23 @@
-import "./DeleteButton.scss";
 import React from "react";
+import styled from "styled-components";
 
-type Props = React.AllHTMLAttributes<HTMLInputElement>;
+const Button = styled.input`
+  border: none;
+  padding: 4;
+  display: inline;
+  background: none;
+  color: red;
+  cursor: pointer;
 
-class DeleteButton extends React.Component<Props> {
-  render() {
-    return (
-      <input
-        className="ui-delete-button"
-        type="button"
-        value="&#x2716;"
-        {...this.props}
-      />
-    );
+  &:hover {
+    color: darkred;
   }
-}
+`;
+
+type Props = React.InputHTMLAttributes<HTMLInputElement>;
+
+const DeleteButton: React.FC<Props> = (props) => (
+  <Button type="button" value="&#x2716;" {...props} />
+);
 
 export default DeleteButton;