mate-academy / layout_search-bar-airbnb

Search bar for Airbnb

Here are the Layout Tasks Instructions

---

The task

Create HTML page with two search bars as designed in the mockup. This search bar will be part of big project.

Requirements:

• use images from src/images
• there must be two search bars
• search bar must stretch the full width
• distance between two search bars must be 20px
• the big search bar must have top indent 20px
• follow styles from the mock
• default font-weight must be 300
• a search bar has 3 state default, hover and focus
• don't use JavaScript
• use @font-face for fonts
• add attribute data-qa="big" for big search form, and data-qa="small" for small
• add attribute data-qa="keypress" to input in big search form

---

Checklist

❗️ Replace <your_account> with your Github username and copy the links to Pull Request description:

• DEMO LINK
• TEST REPORT LINK

❗️ Copy this Checklist to the Pull Request description after links, and put - [x] before each point after you checked it.

• Icon implemented using background-image CSS property
• Inputs are written inside of 'form' tag with correctly passed attributes
• All Typical Mistakes from BEM lesson theory are checked.
• Code follows all the Code Style Rules ❗️

layout_search-bar-airbnb's Issues

link

• DEMO LINK
• TEST REPORT LINK

Remarks are taken into account

Remarks are taken into account

Originally posted by @RomanProkopiv in #636 (comment)