Add functional requirement description dialog

src/Components/AchievementDescriptionCard.js

@@ -7,7 +7,10 @@ import RequirementDialog from './RequirementsDialog.js';
 
 export default function AchievementDescriptionCard(props) {
     var teste = [
-        {name: "Casas", description: "Construa três casas"}
+        {name: "Casas", description: "Construa três casas"},
+        {name: "Carros", description: "Dirija três carros"},
+        {name: "Esportes", description: "Pratique três esportes"},
+        {name: "Noites", description: "Sobreviva a três noites"}
     ];
     return (
             <Paper elevation={3}>

src/Components/RequirementsDialog.js

@@ -55,11 +55,22 @@ export default function MaxWidthDialog(props) {
         onClose={handleClose}
         aria-labelledby="max-width-dialog-title"
       >
-        <DialogTitle id="max-width-dialog-title">Detalhes - {props.title}</DialogTitle>
+        <DialogTitle id="max-width-dialog-title">{props.title}</DialogTitle>
         <DialogContent>
           <DialogContentText>
             {props.description}
             <h4>Requisitos</h4>
+            <dl>
+              {props.requirements.map(
+                (r) => {
+                return(
+                  <div>
+                    <dt>{r.name}</dt>
+                    <dd>{r.description}</dd>
+                  </div>
+                );
+                })}
+            </dl>
           </DialogContentText>
         </DialogContent>
         <DialogActions>