frishi/threetwo
1
0
Fork 0
Code Issues 9 Pull Requests 6 Actions Packages Projects Releases 2 Wiki Activity

🖌️ Styling tweaks to the side panel

Browse Source
This commit is contained in:
Rishi Ghan
2024-01-04 09:03:01 -05:00
parent 9bbb066c38
commit 4b40f7e9c2
1 changed files with 11 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/client/components/ComicDetail/ComicVineSearchForm.tsx
View File

@@ -64,25 +64,26 @@ export const ComicVineSearchForm = (data) => {
</Field> </Field>
</div> </div>
<div> <div>
<label className="block py-1">Issue Number</label> <label className="block py-1">Year</label>
<Field name="issueYear"> <Field name="issueYear">
{(props) => ( {(props) => (
<input <input
{...props.input} {...props.input}
className="appearance-none dark:bg-slate-400 bg-slate-100 h-10 rounded-md border-none text-gray-700 dark:text-slate-200 py-1 pr-7 pl-3 sm:text-md sm:leading-5 focus:outline-none focus:shadow-outline-blue focus:border-blue-300" className="appearance-none dark:bg-slate-400 bg-slate-100 h-10 w-20 rounded-md border-none text-gray-700 dark:text-slate-200 py-1 pr-7 pl-3 sm:text-md sm:leading-5 focus:outline-none focus:shadow-outline-blue focus:border-blue-300"
placeholder="Type the issue year" placeholder="Type the issue year"
/> />
)} )}
</Field> </Field>
</div> </div>
</div>
<div className="flex justify-end"> <div className="flex justify-end mt-5">
<button <button
type="submit" type="submit"
className="flex space-x-1 sm:mt-3 sm:flex-row sm:items-center rounded-lg border border-green-400 dark:border-green-200 bg-green-200 px-4 py-2 text-gray-500 hover:bg-transparent hover:text-red-600 focus:outline-none focus:ring active:text-indigo-500" className="flex h-10 sm:mt-3 sm:flex-row sm:items-center rounded-lg border border-green-400 dark:border-green-200 bg-green-200 px-4 py-2 text-gray-500 hover:bg-transparent hover:text-red-600 focus:outline-none focus:ring active:text-indigo-500"
> >
Search Search
</button> </button>
</div>
</div> </div>
</form> </form>
)} )}