Conversation
devmentor-pl
left a comment
devmentor-pl
left a comment
There was a problem hiding this comment.
Fryderyku,
Całość idzie w dobrym kierunku, ale sporo rzeczy jest niedopracowanych.
Nie zostawiłeś mi komentarza więc nie wiem dlaczego tak jest :P
Proponuję dokończyć całość :)
| <Col> | ||
| <Alert>Uwaga! <em>Styled Components</em> nadchodzi!</Alert> | ||
| <Alert variant="primary">Uwaga! <em>Styled Components</em> nadchodzi!</Alert> | ||
| <Alert variant="secondary">Uwaga! <em>Styled Components</em> nadchodzi!</Alert> |
| <Col> | ||
| Button! | ||
| <Button variant="primary" size="lg" active>Button!</Button> | ||
| <Button variant="secondary" size="sm" disabled>Button!</Button> |
| <Breadcrumb.Item href='#'>Home</Breadcrumb.Item> | ||
| <Breadcrumb.Item href="https://getbootstrap.com/docs/4.0/components/breadcrumb/">Library</Breadcrumb.Item> | ||
| <Breadcrumb.Item active>Data</Breadcrumb.Item> | ||
| </Breadcrumb> |
| </Col> | ||
| </Row> | ||
| ); | ||
| }; |
| </Col> | ||
| </Row> | ||
| ); | ||
| }; |
| const [isActive, setIsActive] = useState(false); | ||
|
|
||
| return ( | ||
| <ThemeProvider theme={theme}> |
There was a problem hiding this comment.
Motyw najlepiej zdefiniować jak najwyżej w strukturze komponentów (np. w App), aby nie trzeba było go definiować wielokrotnie dla każdego elementu. Rozumiem, że w tym zadaniu było tak wygodniej, ale już w projekcie nalezy to zrobić inaczej ;)
|
|
||
|
|
||
|
|
||
| const theme = { |
There was a problem hiding this comment.
Docelowo w projekcie mamy 1 motyw. Ewentualnie można definiować wartości domyślne tutaj.
Pamiętaj, że motyw to ma być rozwiązanie, które pozwoli Ci nadać kompletnie nowe "kolory i wielkości" bez potrzeby modyfikowania plików "standardowych"
| href="#" | ||
| > | ||
| {title} | ||
| <div className="tab__content">{isActive && children}</div> |
There was a problem hiding this comment.
Zdecydowanie lepiej byłoby zdefiniować kontent poza element a - aby nie odziedziczyć stylu po nim ;)
| }; | ||
| return ( | ||
| <> | ||
| <StyledTab |
There was a problem hiding this comment.
Gdzie odpowiednie ramki dla "zakładek"? :>
|
|
||
| const Card = ({children}) => { | ||
| return ( | ||
| <div>{children}</div> |
There was a problem hiding this comment.
Dlaczego ten div nie ma odpowiedniego obramowania jak i img nie wypełnia jego zawartości?
2 participants
No description provided.