Feat: Practice HTML and CSS RWD #165
Conversation
devmentor-pl
left a comment
There was a problem hiding this comment.
Żaneto,
Wszystko prezentuje się bardzo dobrze 👍
Zostawiłem Ci uwagę jedną do menu oraz zadanie dodatkowe ;P
| border: 150px solid #dcdcdc; | ||
| border-right-color: transparent; | ||
| border-bottom-color: transparent; | ||
| } |
| .b { | ||
| order: 1; | ||
| } | ||
| } |
| </side> | ||
| </article> | ||
| </body> | ||
| </html> |
| .t { | ||
| grid-column: span 2; | ||
| grid-row: 2; | ||
| } |
| top: 0; | ||
| height: 100%; | ||
| width: 100%; | ||
| } |
| function showSidebar() { | ||
| const sidebar = document.querySelector('.nav'); | ||
| sidebar.style.display = 'flex'; | ||
| } |
There was a problem hiding this comment.
Spróbuj zastąpić to rozwiazanie przez "checkbox" - takie zadanie dodatkowe ;)
| header .nav ul li ul { | ||
| position: relative; | ||
| width: 100%; | ||
| } |
| </div> | ||
| </footer> | ||
|
|
||
| <script> |
There was a problem hiding this comment.
Podobnie jak w poprzednim zadaniu :)
| <div class="rectangle__orange rectangle__3"></div> | ||
| <div class="rectangle__orange rectangle__4"></div> | ||
| <div class="rectangle__orange rectangle__5"></div> |
There was a problem hiding this comment.
Rozumiem, że to tylko drobne zadanko, ale staramy się nie pisać 3, 4, 5... w nazwach klas. Wystarczy, że będziemy musieli zmienić kolejność elementów i wszystko się posypie ;P
| .rectangle__footer { | ||
| grid-column: 3 / span 1; | ||
| } | ||
| } |
devmentor-pl
left a comment
There was a problem hiding this comment.
Żaneto,
Teraz jest super! 👍
| } | ||
|
|
||
| .hamburger::after { | ||
| header input { |
There was a problem hiding this comment.
Na wersji desktopowej też powinno się go ukryć :P
| header input:checked + ul { | ||
| display: flex; | ||
| gap: 20px; | ||
| } |
| <article class="container__blue container__main"> | ||
| <div class="rectangle__orange rectangle__1"></div> | ||
| <div class="rectangle__orange rectangle__2"></div> | ||
| <div class="rectangle__orange rectangle__first-main"></div> |
There was a problem hiding this comment.
Już nie zmieniaj tego, ale zmiana z 1 na first, nie wiele zmienia. Jeśli będziemy chcieli lub musieli zmienić ich kolejność to nazwa klasy będzie wprowadzać naw w błąd. Docelowo lepiej opisywać co zawiera ten element np. opis członków zespół, listą pakietów itp. Wiem, że w tym zadaniu trudno powiedzieć co on zawiera i stąd wynika numeracja ;)
No description provided.