assignment no. 1, 2 ,3 4 ,5 done! #149
Conversation
devmentor-pl
left a comment
devmentor-pl
left a comment
There was a problem hiding this comment.
Sebastianie,
Zadanka są ok 👍
Zostawiłem parę drobnych uwag :)
| border-right-color: transparent; | ||
| border-bottom-color: transparent; | ||
| shape-outside: polygon(0 0, -5px 300px, 600px -300px); | ||
| } |
|
|
||
| .a { | ||
| border-color: #ffffba | ||
| height: 50%; |
| height: 50%; | ||
| border-color: #baffc9; | ||
| } | ||
| @media (max-width: 601px) { |
There was a problem hiding this comment.
Raczej odwrotnie - jak przekroczy czyli jak ma min-width: 601 to wtedy mają być 2 kolumny :)
| <p class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Enim deserunt praesentium id hic cupiditate nihil tempora asperiores voluptates, itaque, delectus rem vitae, corporis placeat ea magni maxime consequuntur voluptas. Provident error perspiciatis dolore quibusdam recusandae dignissimos itaque maxime inventore? Blanditiis accusamus culpa hic adipisci, iste cumque! Assumenda, odit distinctio aspernatur hic possimus culpa eius nemo ipsum eveniet cumque iusto odio, molestiae commodi nesciunt nobis doloribus magni. Tempora odio ducimus perferendis, dolorum est beatae quisquam incidunt omnis aliquid nobis veniam, obcaecati soluta, debitis fugiat quis quod? Corporis, nostrum eligendi. Neque pariatur minus est necessitatibus suscipit sapiente. Quasi officiis ducimus hic est. Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolore, harum. Sed animi, deleniti officiis nobis vitae rem inventore. Enim et eveniet adipisci ad temporibus similique dignissimos, voluptatum ut vitae? Nihil labore numquam recusandae vel vero nam nesciunt dicta veniam error pariatur consectetur soluta necessitatibus ad sequi quam vitae, cupiditate id aliquam modi ducimus! Itaque debitis dolorum odio sapiente eaque molestiae neque sunt, ea a! Asperiores error eligendi eveniet eius numquam harum illum hic, cumque molestias quis, doloribus amet sit officia officiis quam, quibusdam reiciendis distinctio. Fugit, tempora. Tenetur, ipsum amet itaque esse porro et libero tempora doloribus maxime voluptatem vel? </p> | ||
| </main> | ||
| <header class="p"> | ||
| <picture class="img"></picture> |
There was a problem hiding this comment.
Brakuje różnych rozmiarów - należało użyć source + img: https://www.w3schools.com/tags/tag_picture.asp
| <li class="nav__list--item menu__display"> | ||
| <a href="#items">oferta<span class="arrow-right">▶</span></a> | ||
|
|
||
| <ul class="nav__under"> |
There was a problem hiding this comment.
Na wersji mobilne zagnieżdżenie powinno pokazać się poniżej. Inaczej przy małych ekranach kolejny poziom menu może być przesłonięty, a nawet w skrajnym przypadku niewidoczne:
| <a href="#home">Start</a> | ||
| </li> | ||
|
|
||
| <li class="nav__list--item menu__display"> |
There was a problem hiding this comment.
Pamiętaj, że w BEM Modyfikator występuje (nav__list--item) razem z Elementem (nav__list) tj. <li class="nav__list nav__list--item menu__display">
Tutaj znajdziesz więcej informacji: https://devmentor.pl/b/metodologia-bem-w-css-i-sass
| .nav__under { | ||
| width: 250px; | ||
| top: 6%; | ||
| left: 140px; |
There was a problem hiding this comment.
Lepiej posiłkować się % lub odliczać od prawej krawędzi tj. right - wtedy zmiana rozmiaru elementu rodzica, nie powinna zmuszać nasz do zmiany tej wartości :)
| top: 0px; | ||
| left: 0%; |
There was a problem hiding this comment.
Jeśli mamy 0 to nie musimy pisać jednostki bo 0 to 0 w każdej użytej jednostce ;)
| <body> | ||
| <header class="header"> | ||
| <nav class="header__nav wrapper"> | ||
| <div class="header__nav--logo"></div> |
There was a problem hiding this comment.
Tutaj zdecydowanie nie powinny występować Modyfikatory, a raczej Elementy z BEM. Modyfikator to specjalny przypadek wyglądu dla Elementu - dlatego on sam nie występuje. Przykład: Mamy elementy oferty i jeden z nich jest oznaczony jako wybrany. Wtedy ten wybrany może mieć Modyfikator, który styluje ten "wybór".
2 participants
No description provided.