For a React Webapp : a 1-page Design Guide and a 1-page Search Form

I require a React web application, empty except for 2 pages: - Page 1: A Design Guide page, which shows the usual things: typography, colour palette, a UI component library for building forms, pages, etc. The design guide does Not need not be original at all. We prefer something based on a modern, freely available react component library that is well supported. - Page 2: A search page as per the attached file, “Wireframe Page 1 Search Page”, which obeys your design guide. It should show that your design guide and components are easy to work with. # CONSTRAINTS 1. Your design guide and search page will be used as the basis of a simple job tracking application. It must be very simple, clear and clean. UI elements must be **quite large, not small** — for instance 50% taller and wider than components in the freelancer.com web interface – so that they can be seen by someone with poor vision and clicked on by someone who has difficulty with a computer mouse. 2. It will be hosted in the browser and is for desktops and laptops with 1920x1080 screens. It should be responsive so that it still works well if the window is reduced to 768px wide. 3. The design guide must specify the usual things such as what font face and what font size to use for elements; a colour palette including primary and alternate colours and colours for errors, warning and information; form controls for text entry, number entry, dropdown choices, radio button choices, buttons, etc etc. The design guide does Not have to be original at all. You should use a freely available react component library that is well supported. 4. The colour palette must use the dark blue, orange, grey, black and white colours in the attached file, AscotWebsiteHeader.png. 5. The guide should use the Roboto Slab 700 https://fonts.google.com/specimen/Roboto+Slab for H1, H2 tags and other display headings. The font for body text should be any font that is clear and easy to read. Raleway [login to view URL] may an acceptable choice, but your choice must be easy to read. 6. The design guide and components must be easy for a React developer to work with. 7. Your search page must use the design guide and components and show that they are simple to use. 8. You should provide as *little* code as possible. The point is to show that the components and style work with minimum coding. 9. Your components should work well with the current version of React and up-to-date coding guidelines for React. 10. It must be possible to change simple design choices such as typography and colour palette by editing one style variables file. 11. It should be possible to change design choices such as font size and form control size by editing as few style variables as possible. ## Functionality The only functionality required is 1) When someone types into the search box, the two results lists are populated with dummy data. 2) It must be possible to navigate to both pages. ### Optional Alternatives It is acceptable for you to provide the design guide in figma.com. If you do, I will provide export from figma to React components and you must be able to still deliver the 2 pages. # MILESTONES I suggest 4 milestones, I think small milestones give us both more certainty? • Milestone 1. A 50% finished design guide page in either [login to view URL] or in a React web app • Milestone 2. A Finished design guide page in either [login to view URL] or in a React web app • Milestone 3. A Finished Search page in React which conforms to your design guide and matches the attached wireframe “Wireframe Page 1 Search [login to view URL]” • Milestone 4. Late change requests