Feature/informationcard #5
Conversation
src/App.css
Outdated
| @@ -12,6 +12,13 @@ | |||
| margin: 0 auto; | |||
| } | |||
|
|
|||
| .info-card-wrapper { | |||
| display: flex; | |||
| /*justify-content: space-evenly;*/ | |||
There was a problem hiding this comment.
Als het uitgecommend is, kan het ook weg 🤓
| @@ -0,0 +1,32 @@ | |||
| .infoCard { | |||
| flex: 0 1 calc(50% - 30px); | |||
There was a problem hiding this comment.
We missen nog een media-query voor mobiel die ervoor zorgt dat de kaarten 100% breed worden :)
There was a problem hiding this comment.
Als volgt opgelost:
@media screen and (max-width: 768px) {
/*this screen width includes larger phones*/
.info-card {
flex: 0 1 calc(100% - 1.4rem);
}
}
|
Ik heb de veranderingen verwerkt, n.a.v. onderzoek naar de originele Novi website heb ik nog wat andere wijzigingen gedaan:
Dank voor alle feedback, ik heb er veel van geleerd! |
…ay out that do not impact overall look
|
Hallo Nova, Ik heb het component klaar, officiele tekst vanuit Novi website geïmporteerd. Ik ben benieuwd of het component zo goed is en op de juiste manier in de website is ingebouwd. Ik heb nog niks met de links gedaan naar andere pagina's, misschien iets leuks om te doen voor aankomende coding wednesday! Groetjes, Marieke |
src/App.jsx
Outdated
| @@ -2,6 +2,7 @@ import './App.css' | |||
| import SectionContentWrapper from './components/sectionContentWrapper/SectionContentWrapper.jsx'; | |||
| import novilogo from './assets/novi-logo-color-transparent.png'; | |||
| import Navbar from './components/navbar/Navbar.jsx'; | |||
| import InformationCard from "./components/informationCard/InformationCard.jsx"; | |||
| <h3 className="info-card-title">{infoCardTitle}</h3> | ||
| <p className="info-card-content">{infoCardContent}</p> | ||
| {experienceNeeded && <p className="info-card-experience-tag"><em>Enige IT-ervaring vereist</em></p>} | ||
| <button |
…ria labels for every button in components
Hee Nova,
Ik heb het component werkend, het is nog niet helemaal klaar.
Groetjes,
Marieke
hidden banana 🍌