Skip to content

Latest commit

 

History

History
73 lines (46 loc) · 2.41 KB

README.en.md

File metadata and controls

73 lines (46 loc) · 2.41 KB
Raw

Read in other languages: Ukrainian, English.

Homework

  • Create a repository goit-markup-hw-06.
  • Clone the created repository and copy the previous work files into it.
  • Add markup and form design to layout pages of homework #6.
  • Set up GitHub Pages and add a link to the live page in the header of the GitHub repository.

Criteria for work acceptance by the tutor

Project

«A1» All styles are contained in one styles.css file in the css folder.

«A2» Source code is formatted with Prettier.

«A3» All images and text content are taken from the layout.

«A4» All HTML pages have a style normalizer modern-nomalize.

«A5» The code is in line with the guide.

Markup

«B1» HTML-markup is done for all layout elements.

«B2» Tags are used according to their semantics.

«B3» The markup of the newsletter subscription form and all its elements in the footer is done.

«B4» The markup of the order form and all its elements in the modal window is done.

«B5» All inputs in forms have the name attribute.

«B6» The values of the name attribute are descriptive, describing exactly what the form field is used for.

«B7» All inputs have a bound <label> element.

«B8» The placeholder attribute is set on the inputs if there is a hint text for it in the layout.

«B9» Form "submit" buttons have the type ="submit" attribute.

«B10» All new form icons are added to the icons.svg SVG sprite.

Styling

«C1» The styling of elements of the newsletter subscription form in the footer is done.

«C2» The styling of elements of the order form in the modal window is done.

«C3» When an input is in focus, its border and icon change color (as shown on the layout).

«C4» The original checkbox with acceptance of the license agreement in the order form is hidden.

«C5» The checkbox with acceptance of the license agreement is designed manually, using a vector checkmark image from the SVG sprite.

«C6» For all hover and focus effects (color, background, shadow), transitions are made. Time is set to 250ms, and the timing function is cubic-bezier(0.4, 0, 0.2, 1).