gmgauthier/mocksaml
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Style fix (#18)

Browse Source 
* 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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
pages/index.tsx
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='relative flex-1'>
<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 className='relative flex-1'>
<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 className='mx-auto mt-5 flex w-full px-8 lg:w-2/3'>
<div className='relative w-full'>
<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 className='mx-auto mt-5 flex w-full justify-center px-8 lg:w-2/3'>

4
styles/globals.css
View File

@ -34,10 +34,10 @@ a {
}
.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 {
@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;
}
}