initial commit for Dia landing page

[tania-kuzmenko]

https://tania-kuzmenko.github.io/layout_dia/

[anastasiia-tilikina]

Please look closer again to design and check again your implementation.These are fixes that I have already noticed. But I'd suggested you to double check the entire landing.

1. This link in header is broken. Usually logo link leads to home. So lets jus add href='#'

2. Check gaps between nav links on desktop
   Your landing:
   

Figma:

3. This should be link as well

4. Let's make this button a link that leads to Who we are section

5. Add some hover effects on pictures here

6. These two sections have different background color
   Your landing:
   
   Figma:
   

7. Add hover effects on cards and buttons (check in Figma)

8. Reset default styles for learn more link texts

9. paragraph here should have different font-weight
   Your landing:
   

Figma:

10. Add some hover effects on these cards

11. This section looks different than in Figma. There is no task to make it pixel perfect but it should be implemented as close to design as possible

• height is different,
• the next section overlaps background elements

Your landing:

Figma:

12. This style should be on focus not hover

13. Reset default focus styles of inputs

14. First input shows style of input's text not placeholder. But second and 3rd inputs show how placeholders should look.
15. The placeholder of first input should be Email

16. User shouldn't be able to resize textarea

17. email input should have type=email

18. shouldn't be submitted and shouldn't reload page. It only has to reset inputs

19. Social media links should have hover styles (check Figma)

20. add some hover style to address link

21. This small underscore on slider buttons is default link style. it should be reseted.

22. If you're not going to implement slider, I'd suggest you to remove these buttons, since it looks a bit confusing for user

23. who we are section also has different background color
    Your landing:
    

Figma:

24. These texts in testimonial card should always be on the same level despite on screen width and card width and amount of text.

Your landing:

Figma:

25. I believe this title should always be divided by two rows
    Your landing:
    

Figma:

26. This button on mobile devices should open hamburger menu

27. Look closer on grid layout of this section (width 640px) It looks a bit different comparing with Figma

Your landing:

Figma:

28. I believe title here should fit in on one row (width 640px)
    Your landing:
    

Figma:

29. The same here:
    

30. Cards should have paddings (check design)
    

31. Text shouldn't be aligned on center here

[anastasiia-tilikina]

Much better)
but we still have some issues to fix)

1. This link is still broken(
   

2. These cards have box-shadow (check Figma)
   

3. this paragraph is still has different font-weight
   

4. this link is broken in the footer
   

5. placeholders should have different styles (check Figma)
   

6. this text has different color (check Figma)
   

7. your form still reloads page on submit while it shouldn't

8. this link in mob menu is broken
   

9. as well as here
   

[maxim2310]

Great job overall! Just couple things needs to be fixed before approval)

1. try to remove outofill background
   input:-webkit-autofill,
   input:-webkit-autofill:hover,
   input:-webkit-autofill:focus,
   input:-webkit-autofill:active{
   -webkit-box-shadow: 0 0 0 30px white inset !important;
   }
   
2. on my laptop screen it looks like. Try to contain all element inside that they do not overlap each other
   

[maxim2310]

Well done!!!