Conversation
devmentor-pl
left a comment
devmentor-pl
left a comment
There was a problem hiding this comment.
Dario,
Strona prezentuje się bardzo dobrze! 👍
Zostawiłem parę uwag oraz odpowiedziałem na Twoje pytania :)
index.html
Outdated
| <link rel="stylesheet" href="main.css" /> | ||
| </head> | ||
| <body> | ||
| <header class="header"> |
There was a problem hiding this comment.
Aby mieć jeden gradient wystarczy znaczniki header oraz main wrzucić do jednego znacznika np. section i do niego przerzucić gradient a z tych 2 go usunać.
index.html
Outdated
| </div> | ||
| </section> | ||
|
|
||
| <section class="partners"> |
There was a problem hiding this comment.
Osobiście dałbym aside jako coś dodatkowego (reklama).
index.html
Outdated
|
|
||
| <section class="about"> | ||
| <div class="container"> | ||
| <article class="about-image"> |
There was a problem hiding this comment.
Raczej znacznika article nie dawałbym dla samego obrazka - może lepiej użyć figure?
index.html
Outdated
| <p class="pricing__details"> | ||
| Up to 7 Projects<br /> | ||
| 2 Additional Developers | ||
| </p> |
There was a problem hiding this comment.
Mamy tutaj listę cech więc pewnie bym dał ul > li
| </p> | ||
| <button class="cta-button">Get Started</button> | ||
| </article> | ||
| <article class="pricing-item--details"> |
There was a problem hiding this comment.
Zwróć uwagę, że dla tego elementu zmieniłaś klasę, a dla przycisku definiowaliśmy zależność tj.
.pricing-item .cta-button { ... }
Dlatego teraz on nie zachowuje się jak pozostałe.
PS1. Klasa pricing-item--details nie zawiera też position: relative, która jest niezbędna do pozycjonowania absolutnego przycisku.
PS2. Padding też może być problematyczny - tutaj nadałaś 50px, możę wystarczy ustawić dla każdej ceny szerokość na 25%?
PS3. Poczytaj o metodologi BEM do nadawania nazw klasom: https://devmentor.pl/b/metodologia-bem-w-css-i-sass
devmentor-pl
left a comment
devmentor-pl
left a comment
There was a problem hiding this comment.
Dario,
Super, o to chodziło! :)
| </article> | ||
| </div> | ||
| </main> | ||
| <section class="hero"> |
| <img src="./images/logos.png" alt="Partner Logos" /> | ||
| </div> | ||
| </section> | ||
| </aside> |
| <figure class="about-image"> | ||
| <img src="./images/imac.png" alt="iMac" /> | ||
| </article> | ||
| </figure> |
| <li>Up to 25 Projects</li> | ||
| <li>2 Additional Developers</li> | ||
| <li>Unlimited Support</li> | ||
| </ul> |
| <li>2 Additional Developers</li> | ||
| <li>Unlimited Support</li> | ||
| </ul> | ||
| <button class="cta-button">Get Started</button> |
There was a problem hiding this comment.
Dodałbym jeszce jakiś odstęp od dolnej krawędzi i przyciskiem :)
| <li>2 Additional Developers</li> | ||
| <li>Unlimited Support</li> | ||
| <li>1.5GB Disk Space</li> | ||
| </ul> |
2 participants
Nie wiem jak zmienić kod aby środkowy przycisk z ceną po dodaniu obramowania nie zmieniał swojej pozycji oraz jak zmienić tło na początku strony by było jak na przykładowej stronie.