Conversation
update git-ignore; normalize styles; add assets; create Container-Component
create first test of component
small changes of component
…ny_komponent_#4 # Conflicts: # src/styles/styles.scss
src/components/gameMode/GameMode.ts
Outdated
| parentId?: string, | ||
| className?: string | ||
| ): HTMLElement => { | ||
| const component: HTMLElement = document.createElement('button')! |
There was a problem hiding this comment.
Myślę że div byłby lepszym wyborem, z tego względu że po kliknięciu nie będzie "odciśnięty" oraz jest blokowy.
src/components/gameMode/GameMode.ts
Outdated
| const component: HTMLElement = document.createElement('button')! | ||
|
|
||
| label = HTMLElement | ||
| ? (component.innerHTML = `${label}`) |
There was a problem hiding this comment.
Metoda appendChild będzie tutaj chyba bardziej wydajna.
src/components/gameMode/GameMode.ts
Outdated
| label = HTMLElement | ||
| ? (component.innerHTML = `${label}`) | ||
| : /(jpg|gif|png|JPG|GIF|PNG|JPEG|jpeg)$/.test(`${label}`) | ||
| ? (component.style.backgroundImage = `url(${label})`) |
There was a problem hiding this comment.
Wydaje mi się że podwójna ternary operation nie jest zbyt dobrze czytelna.
src/components/gameMode/GameMode.ts
Outdated
|
|
||
| label = HTMLElement | ||
| ? (component.innerHTML = `${label}`) | ||
| : /(jpg|gif|png|JPG|GIF|PNG|JPEG|jpeg)$/.test(`${label}`) |
There was a problem hiding this comment.
Sprawdzenie czy string jest obrazkiem zrobiłam już w moim komponencie. Przeniosę tę funkcję gdzieś indziej żebyśmy obie mogły z niej korzystać.
src/components/gameMode/GameMode.ts
Outdated
| component.addEventListener('click', onClick) | ||
|
|
||
| const parentEl = document.getElementById(`${parentId}`) | ||
| component.classList.add(`${className}`) |
There was a problem hiding this comment.
Parametry parentId oraz className masz zaznaczone jako niewymagane parametry, więc najlepiej byłoby najpierw sprawdzić czy taka zmienna istnieje zanim ją wywołasz.. w każdym razie na pewno dla className, bo nie jest przypisana do osobnej zmiennej.
src/components/gameMode/GameMode.ts
Outdated
| label: ContainerComponentLabel, | ||
| onClick: () => void, | ||
| parentId?: string, | ||
| className?: string |
There was a problem hiding this comment.
Proponuję odwrócić kolejność: className a następnie parentId. Najprawdopodobniej częściej będzie używana klasa bez podania odnośnika rodzica więc będzie można podać wówczas mniej parametrów przy wywołaniu komponentu.
…t_#4' into UI-Komponent-Kafel-trybu-gry
…t styles added and imported to overal styles
| @@ -0,0 +1,35 @@ | |||
| .game-mode_container { | |||
| box-sizing: border-box; | |||
There was a problem hiding this comment.
Tego nie musisz pisać, bo to jest w resecie Mirona dla wszystkich elementów.
No description provided.