Dimentorin auth login responsive and implementation (#23)

* feat: responsive

* fix: success register

* feat: auth login responsive && auth login implementation
This commit is contained in:
Naufal Azmi
2025-04-09 12:59:33 +07:00
committed by GitHub
parent b1a53df4a9
commit 240e684b53
7 changed files with 77 additions and 35 deletions
+4 -1
View File
@@ -11,6 +11,7 @@ import { Button } from '../button';
type TInputType = 'text' | 'email' | 'number' | 'password' | 'file';
type TInputSize = 'sm' | 'md' | 'lg';
type Width = 'standard' | 'custom'
type TInputProps = Omit<
DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>,
@@ -18,6 +19,7 @@ type TInputProps = Omit<
> & {
type?: TInputType;
size?: TInputSize;
widthform?: Width;
disabled?: boolean;
};
@@ -34,6 +36,7 @@ export const Input: FC<TInputProps> = ({
type = 'text',
size = 'md',
placeholder = 'Placeholder',
widthform='standard',
disabled,
className,
...rest
@@ -46,7 +49,7 @@ export const Input: FC<TInputProps> = ({
};
const mergedClassName = cn(
'px-[12px] py-[8px] text-neutral-800 bg-white placeholder:text-neutral-300 border border-neutral-200 hover:border-blue-300 focus:outline-1 focus:outline-blue-500 rounded-md font-bai-jamjuree min-w-70',
`px-[12px] py-[8px] text-neutral-800 bg-white placeholder:text-neutral-300 border border-neutral-200 hover:border-blue-300 focus:outline-1 focus:outline-blue-500 rounded-md font-bai-jamjuree ${widthform === "standard" ? "min-w-70" : ""}`,
sizeClasses[size].textSize,
disabled && disabledClass,
className
@@ -5,7 +5,7 @@ import { FC, ReactElement } from "react";
function AuthBanner({text, href}: {text: string, href: string}){
return (
<div className='relative rounded-md'>
<div className='hidden xl:block relative rounded-md'>
<img src="/image/95319c4f9953dfe6180200e529dfcea5.webp" alt="Banner" className='w-[420px] h-[632px] object-[80%] object-cover rounded-lg' />
<div className='absolute top-0 bg-gradient-to-b from-primary-500 to-transparent w-full rounded-t-lg h-[163px] py-5 px-5'>
<Button variant='secondary' className='gap-2' onClick={() => document.location.href = `${href}`}>