Welkom bij mijn project van CSS to the Rescue. Bij dit vak van de Minor 'Webdesign and development' is het de bedoeling dat we een interactieve webpagina met alleen CSS. Ik heb ervoor gekozen om hiervoor een vuurwerkshow te maken.
De website is hier te zien.
Het procesverslag is te vinden in de wiki.
Mijn uitdaging hierbij is dat ik veel verschillende aanpassingen mogelijk wil make voor de gebruiker. De gebruiker kan bijvoorbeeld de kleur en het aantal vuurpijlen aanpassen door middel van checkboxes en radiobuttons. Ik verwacht dat dit een flike klus gaat worden, aangezien er geen JavaScript gebruikt mag worden.
Om de app lokaal te laten draaien moet het project eerst lokaal worden gecloned. Als dit stukje code gerunt wordt in de terminal wordt de repository lokaal gecloned:
gh repo clone tomvandenberg11/fireworks
Ga eerst naar de folder waarin je wilt dat het project gecloned wordt. Je kan in de terminal navigeren met cd met daar achter de map waar je heen wilt.
Hierna kan het bestand gewoon geopend worden in de browser door dubbel te klikken op de index.html.
| To do | Done? |
|---|---|
| Pijl maken | ✅ |
| Reload knop | ✅ |
| Dark mode | ✅ |
| Explosie | ✅ |
| Onnodige classes, id's en 'absolute' uit het project | ✅ |
| Optie verschillende kleuren explosie | ✅ |
| Rook toevoegen aan pijl | ⏳ |
| Aansteker als knop | ✅ |
| Vuur als aansteker wordt gehovered | ✅ |
| Explosie gemixte kleuren | ✅ |
| Responsive maken | ✅ |
| Realistische vuurpijl | ✅ |
| Automatisch darkmode wanneer systeem is dark | ✅ |
| Realistische wolken | |
| Klap menu voor kleur opties | |
| Optie meerdere vuurpijlen | |
| Realistische vuur animatie aansteker |
Het procesverslag is te vinden in de wiki.
Dit project is voorzien van een MIT licence. Zie de pagina LICENCE voor meer informatie.
Ik wil graag als eerste de docenten bedanken voor al hun inzet, uitleg en lesstof. Ten tweede wil ik mijn supportgroepje bedanken voor de mentale en functionele support. Ten derde wil ik Stackoverflow bedanken voor al hun antwoorden op mijn vragen.