🎨 remove unused inputfield

src/front/Components/Elements/InputField/classes.module.scss

@@ -1,122 +0,0 @@
-@import "@Themes/constants.scss";
-@import "@Themes/animation.scss";
-
-.root {
-	padding: 15px 0;
-	width: 100%;
-	height: 100%;
-	will-change: transform, opacity;
-	animation: fadeInFromLeft 500ms;
-
-	> h1 {
-		margin-top: 0;
-	}
-
-	button {
-		margin-top: 10px;
-	}
-
-	.component {
-		width: 100%;
-		display: block;
-		position: relative;
-		height: 40px;
-		padding: 12px 16px 12px 40px;
-		border-width: 1px;
-		border-style: solid;
-		border-color: $borderColor;
-		border-radius: 4px;
-		transition: border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
-		will-change: border-color, box-shadow;
-		background-color: $backgroundColor;
-
-		&:hover {
-			border-color: $primaryColor;
-		}
-
-		&:focus {
-			box-shadow: 0 0 0 2px $primaryColor;
-			border-color: $primaryColor;
-		}
-
-		&.error {
-			border-color: $downColor;
-
-			&:focus {
-				box-shadow: 0 0 0 2px rgba(237, 29, 37, 0.1);
-			}
-		}
-
-		&.success {
-			border-color: $upColor;
-
-			&:focus {
-				box-shadow: 0 0 0 2px rgba(0, 201, 167, 0.1);
-			}
-		}
-	}
-
-	@keyframes zoomIn {
-		from {
-			transform: scale(0.2);
-			opacity: 0;
-		}
-
-		to {
-			transform: scale(1);
-			opacity: 1;
-		}
-	}
-
-	.status {
-		display: block;
-		position: absolute;
-		top: 50%;
-		right: 10px;
-		z-index: 1;
-		width: 20px;
-		height: 20px;
-		margin-top: -10px;
-		font-size: 14px;
-		line-height: 20px;
-		text-align: center;
-		visibility: visible;
-		pointer-events: none;
-		will-change: transform, opacity;
-
-		&.error {
-			animation: zoomIn 0.3s cubic-bezier(0.12, 0.4, 0.29, 1.46);
-		}
-
-		&.success {
-			animation: zoomIn 0.3s cubic-bezier(0.12, 0.4, 0.29, 1.46);
-		}
-	}
-
-	.icon {
-		display: block;
-		position: absolute;
-		top: 50%;
-		left: 10px;
-		z-index: 1;
-		width: 20px;
-		height: 20px;
-		margin-top: -10px;
-		font-size: 14px;
-		line-height: 20px;
-		text-align: center;
-		visibility: visible;
-		pointer-events: none;
-	}
-}
-
-.errorMsg {
-	color: $downColor;
-	margin: -15px 0 15px 0;
-	line-height: 24px;
-	will-change: transform, opacity;
-	animation: slideDown 0.3s cubic-bezier(0.12, 0.4, 0.29, 1.46);
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}

src/front/Components/Elements/InputField/index.tsx

@@ -1,50 +0,0 @@
-import React, { RefObject } from "react";
-import classes from "./classes.module.scss";
-import classNames from "classnames";
-import Image from "next/image";
-import ErrorIcon from "@Assets/Icons/input-error.svg";
-import SuccessIcon from "@Assets/Icons/input-success.svg";
-
-type IProps = {
-	inputRef?: RefObject<HTMLInputElement>;
-	icon?: string;
-	placeholder?: string;
-	name?: string;
-	value?: string;
-	onChange: any;
-	onBlur?: any;
-	inputStatus: "success" | "error" | "neutral";
-	errorMsg?: string;
-	type: string;
-};
-
-export default class InputField extends React.Component<IProps> {
-	public constructor(props: IProps) {
-		super(props);
-	}
-	public override render(): JSX.Element {
-		return (
-			<>
-				<div className={classNames(classes["root"])}>
-					{this.props.icon && <Image className={classes["icon"]} alt={this.props.icon} src={this.props.icon} />}
-					<input
-						className={classNames(classes["component"], classes[this.props.inputStatus])}
-						ref={this.props.inputRef}
-						type={this.props.type}
-						name={this.props.name}
-						placeholder={this.props.placeholder}
-						value={this.props.value}
-						onChange={this.props.onChange}
-						onBlur={this.props.onBlur}
-						autoComplete={this.props.name}
-					/>
-					<div className={classNames(classes["status"], classes[this.props.inputStatus])}>
-						{this.props.inputStatus === "success" && <Image alt="success icon" src={SuccessIcon} />}
-						{this.props.inputStatus === "error" && <Image alt="error icon" src={ErrorIcon} />}
-					</div>
-				</div>
-				{this.props.errorMsg && <div className={classes["errorMsg"]}>{this.props.errorMsg}</div>}
-			</>
-		);
-	}
-}