Vytvořte si repozitář ze šablony letenky-zadani se stránkou, která se tváří, že zobrazuje výsledky vyhledávání letů. Vaším úkolem bude vytvořit dle tohoto vzoru komponentu Flight
, která bude zobrazovat jeden let.
- Spusťte si připravenou stránku a prohlédněte si strukturu HTML. Do tohoto repozitáře nebudeme nic vkládat, je to pouze ukázka.
- Založte si úplně nový JSX projekt pomocí již známého postupu.
- Vytvořte v projektu komponentu
Flight
. Ta bude na vstupu očekávat takovétoprops
:
Komponenta nechť vytvoří HTML pro jeden let dle vzoru, který najdete ve vzorovém projektu v{ cityFrom: 'Praha', cityTo: 'Londýn', timeFrom: '3. srpna 2022, 13:30', timeTo: '3. srpna 2022, 14:00', }
index.html
. - Ze vzorového projektu vykraďte CSS styly. Ty, které patří ke komponentě
Flight
, vložte do souborustyle.css
ve složce komponenty a správně je importujte. Styly pro celou stránku nechte v hlavním souboru stránkyindex.css
. - Už známým postupem vložte pomocí komponenty
Flight
do stránky jeden vyhledaný let. Stránka by měla vypadat úplně stejně jako v původním projektu.