Develop branch

[Mr36Tomek]

DEMO LINK
Only mobile version

[Zibi95]

Hey. Good job. Here are my some things that i found to improve

• This photo is cut
  
• It would be good to keep the numbers displayed if I hover over them and also so i can choose the number to trigger call action on selected number
  https://github.com/user-attachments/assets/937d1f5f-c2cc-49aa-a8cc-447a185b1b2a
• Prevent excessive resizing of the textarea as it is disrupting the layout. Also block the submit button. Right now if you submit the form you will redirected to the blank page with error.
  https://github.com/user-attachments/assets/3d0f3341-8727-42e0-b69e-b56a96669e6a

[Zibi95]

This media selector is greate case for mixin

@mixin for-desktop {
  @media (min-width: 744px) {
    @content;
  }
}

and then you can use it like that

@include for-desktop {
    display: grid;
    justify-content: center;
    grid-template-columns: repeat(2, minmax(300px, 510px));
    gap: 24px;
  }

[BogdanMaliuta]

Hello,mobile version looks good, keep working.
Also fix this text, I know that on mobile you cannot hover on button but if someone will make it on PC, your contacts text will be on your h1

[Mr36Tomek]

Nie wiedziałem co mam zrobić za bardzo z tym tekstem skoro stan hover jest przeznaczony wyłącznie dla trybu desktop więc zamiast skalować rozwijaną treść to nadałem jej opacity 0 dla mobilki i tableta a dodatkowo text-wrap: nowrap żeby zapobiedz zwijaniu się tekstu w dla trybu desktop.

[natalia-klonowska]

check one more time all spaces between element because you have a lot of mistakes I just marked some of them

[natalia-klonowska]

When you submit form you are redirected to a page https://mr36tomek.github.io/
checklist: Page shouldn't be reloaded on form submit (https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault)

[Mr36Tomek]

Porobiłem korekty wizualne ale co do przeładowania strony to czytałem ten link pisałem do czata gpt o pomoc i nie wiem jak to dodać ponad to my jeszcze takich rzeczy nie mieliśmy w materiale nawet nie zbliżaliśmy się do takiego poziomu js i w sumie trochę dziwne że jest na egzaminie podsumowywującym HTML i CSS .

[Zibi95]

Hey. Found some issues. There is a some thing to do about typography, the colors of the text don't follow designs from figma. Main color for text is #161616. Go through the designs and fix the spacing of text and elements.

• The typography in this section is off. The font size on the desktop is lower than in designs, letter spacing is off also
  
• look at the subtitle in designs it breaks after "Guides"
  
• this image is in object-position is off for tablets and desktop
  
• Check the typography: letter spacing also color of the text is not following designs.
  
• here also the title is to small on desktop an tablets
  
• In this section there is two colors for text and you are using only black. About blocking the form default behavior. You don't need any JS for this. You can change the type of button or just block it. Figure it out how to do it. 👍
  
• Check the margins its to close and the paragraph is to far from the title.
  

[Mr36Tomek]

Zrobiłem wszytskie zminy poza pozycjonowaniem zdjęcia nwm jak w inny sposób osiągnąć taki efekt.

[BogdanMaliuta]

Hello, here is some things to fix
fix this text according to the mockup on tablet version

fix gap between image and text

fix footer height according to mockup on tablet version

[Mr36Tomek]

Naprawione wszystkie doniesienia wraz z nie przeładowywującym się formularzem udało się naprawić okazało sie, że był po prostu problme ze ścieżką do pliku js

[Zibi95]

Hey, well done you are almost there. Check typography some text is to close you probably have to change letter-spacing property 😁

• on hover hamburger menu disappears

Screen.Recording.2024-07-29.at.19.40.11.mov

• letter spacing on text is off

• these text has different colors on designs - #3E3E3E
  

• This button is to far - button has margin-top, but from what i saw you use margin-bottom in other places. Remember to stick to only one direction of vertical margins
  

[Zibi95]

Final request from me. I think i have already mentioned about it - add min-width and max-width to textarea or block resizing so we can't break layout.

Screen.Recording.2024-07-30.at.19.48.17.mov

[Zibi95]

Good job! Finally, you got it 🥇. Nice approach with the mobile-first solution. I also noticed that you used mostly vertical margins in one direction, which is really good.