gitea-admin/lti-web-client
1
0
Fork 0
mirror of https://gitlab.com/mbugroup/lti-web-client.git synced 2026-05-25 15:55:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(FE-Storyless): update input components to ensure consistent background styling

Browse Source
This commit is contained in:
rstubryan
2025-10-22 15:31:59 +07:00
parent bdb3ab1a50
commit 575a317eed
3 changed files with 35 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/input/NumberInput.tsx
+17 -9
View File
@@ -397,20 +397,24 @@ const NumberInput = ({
<div className='relative flex'> <div className='relative flex'>
{/* Prefix Block */} {/* Prefix Block */}
{inputPrefix && ( {inputPrefix && (
<div className={cn( <div
className={cn(
'inline-flex items-center px-4 py-2 border border-r-0 rounded-l-md transition-all duration-200', 'inline-flex items-center px-4 py-2 border border-r-0 rounded-l-md transition-all duration-200',
{ {
'bg-gray-100 border-gray-300': !disabled, 'bg-gray-100 border-gray-300': !disabled,
'bg-gray-50 border-gray-200': disabled, 'bg-gray-50 border-gray-200': disabled,
} }
)}> )}
<span className={cn( >
<span
className={cn(
'text-sm font-medium select-none whitespace-nowrap', 'text-sm font-medium select-none whitespace-nowrap',
{ {
'text-gray-600': !disabled, 'text-gray-600': !disabled,
'text-gray-400': disabled, 'text-gray-400': disabled,
} }
)}> )}
>
{inputPrefix} {inputPrefix}
</span> </span>
</div> </div>
@@ -419,7 +423,7 @@ const NumberInput = ({
{/* Input Wrapper */} {/* Input Wrapper */}
<div <div
className={cn( className={cn(
'input h-12 text-base font-normal leading-6 flex-1 rounded-lg! outline-none! transition-all duration-200 flex items-center', 'input h-12 text-base font-normal leading-6 flex-1 rounded-lg! outline-none! transition-all duration-200 flex items-center bg-white',
{ {
'border-error': isError, 'border-error': isError,
'border-success!': isValid, 'border-success!': isValid,
@@ -505,20 +509,24 @@ const NumberInput = ({
{/* Suffix Block */} {/* Suffix Block */}
{inputSuffix && ( {inputSuffix && (
<div className={cn( <div
className={cn(
'inline-flex items-center px-4 py-2 border border-l-0 rounded-r-md transition-all duration-200', 'inline-flex items-center px-4 py-2 border border-l-0 rounded-r-md transition-all duration-200',
{ {
'bg-gray-100 border-gray-300': !disabled, 'bg-gray-100 border-gray-300': !disabled,
'bg-gray-50 border-gray-200': disabled, 'bg-gray-50 border-gray-200': disabled,
} }
)}> )}
<span className={cn( >
<span
className={cn(
'text-sm font-medium select-none whitespace-nowrap', 'text-sm font-medium select-none whitespace-nowrap',
{ {
'text-gray-600': !disabled, 'text-gray-600': !disabled,
'text-gray-400': disabled, 'text-gray-400': disabled,
} }
)}> )}
>
{inputSuffix} {inputSuffix}
</span> </span>
</div> </div>
src/components/input/TextArea.tsx
+1 -1
View File
@@ -87,7 +87,7 @@ const TextArea = ({
<textarea <textarea
className={cn( className={cn(
'input h-auto px-4 py-2 text-base font-normal leading-6 w-full rounded-lg! outline-none! transition-all', 'input h-auto px-4 py-2 text-base font-normal leading-6 w-full rounded-lg! outline-none! transition-all bg-white',
{ {
'border-error': isError, 'border-error': isError,
'border-success!': isValid, 'border-success!': isValid,
src/components/input/TextInput.tsx
+1 -1
View File
@@ -91,7 +91,7 @@ const TextInput = ({
<div <div
className={cn( className={cn(
'input h-12 px-4 py-2 text-base font-normal leading-6 w-full rounded-lg! outline-none! transition-all duration-200', 'input h-12 px-4 py-2 text-base font-normal leading-6 w-full rounded-lg! outline-none! transition-all duration-200 bg-white',
{ {
'border-error': isError, 'border-error': isError,
'border-success!': isValid, 'border-success!': isValid,