Style fix (#18)

* Remove gray bg

* readOnly -> disabled

* gray bg for disabled state
This commit is contained in:
Aswin V 2022-03-08 18:51:58 +05:30 committed by GitHub
parent 6fbf36bd7d
commit cfe001ae50
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 5 deletions

View File

@ -41,17 +41,17 @@ const Home: React.FC<{ metadata: IdPMetadata }> = ({ metadata }) => {
<div className='mx-auto mt-5 flex w-full space-x-6 px-8 lg:w-2/3'> <div className='mx-auto mt-5 flex w-full space-x-6 px-8 lg:w-2/3'>
<div className='relative flex-1'> <div className='relative flex-1'>
<label className='text-sm leading-7 text-gray-600'>SSO URL</label> <label className='text-sm leading-7 text-gray-600'>SSO URL</label>
<input readOnly type='text' defaultValue={ssoUrl} className='input w-full' /> <input disabled type='text' defaultValue={ssoUrl} className='input w-full' />
</div> </div>
<div className='relative flex-1'> <div className='relative flex-1'>
<label className='text-sm leading-7 text-gray-600'>Entity ID</label> <label className='text-sm leading-7 text-gray-600'>Entity ID</label>
<input readOnly type='text' defaultValue={entityId} className='input w-full' /> <input disabled type='text' defaultValue={entityId} className='input w-full' />
</div> </div>
</div> </div>
<div className='mx-auto mt-5 flex w-full px-8 lg:w-2/3'> <div className='mx-auto mt-5 flex w-full px-8 lg:w-2/3'>
<div className='relative w-full'> <div className='relative w-full'>
<label className='text-sm leading-7 text-gray-600'>Certificate</label> <label className='text-sm leading-7 text-gray-600'>Certificate</label>
<textarea readOnly rows={5} defaultValue={certificate} className='input w-full'></textarea> <textarea disabled rows={5} defaultValue={certificate} className='input w-full'></textarea>
</div> </div>
</div> </div>
<div className='mx-auto mt-5 flex w-full justify-center px-8 lg:w-2/3'> <div className='mx-auto mt-5 flex w-full justify-center px-8 lg:w-2/3'>

View File

@ -34,10 +34,10 @@ a {
} }
.input { .input {
@apply rounded-md border border-gray-300 bg-gray-100 bg-opacity-50 px-3 py-1 text-base leading-8 text-gray-700 outline-none transition-colors duration-200 ease-in-out focus:border-indigo-500 focus:bg-transparent focus:ring-2 focus:ring-indigo-300; @apply rounded-md border border-gray-300 bg-opacity-50 px-3 py-1 text-base leading-8 text-gray-700 outline-none transition-colors duration-200 ease-in-out focus:border-indigo-500 focus:bg-transparent focus:ring-2 focus:ring-indigo-300 disabled:bg-gray-100;
} }
.select { .select {
@apply rounded-md border border-gray-300 bg-gray-100 bg-opacity-50 px-3 py-2.5 text-base leading-8 text-gray-700 outline-none transition-colors duration-200 ease-in-out focus:border-indigo-500 focus:bg-transparent focus:ring-2 focus:ring-indigo-300; @apply rounded-md border border-gray-300 bg-opacity-50 px-3 py-2.5 text-base leading-8 text-gray-700 outline-none transition-colors duration-200 ease-in-out focus:border-indigo-500 focus:bg-transparent focus:ring-2 focus:ring-indigo-300 disabled:bg-gray-100;
} }
} }