Skip to content
This repository has been archived by the owner on Sep 27, 2024. It is now read-only.

Commit

Permalink
Pr review update
Browse files Browse the repository at this point in the history
  • Loading branch information
@ALBERICLOOS
ALBERICLOOS committed Mar 11, 2024
1 parent 648d133 commit b8c8dcc
Show file tree
Hide file tree
Showing 3 changed files with 76 additions and 112 deletions.
90 changes: 37 additions & 53 deletions frontend/src/components/CreateProject.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import {SelectionBox} from "./SelectionBox.tsx";
import Calendar from "react-calendar";
import 'react-calendar/dist/Calendar.css';
import {FaUpload} from "react-icons/fa";
import "../assets/styles/small_components.css";


export function CreateProject(): JSX.Element {
Expand Down Expand Up @@ -32,20 +33,16 @@ export function CreateProject(): JSX.Element {
<div className="field-label">
<label className="label">Project naam:</label>
</div>
<div className="field-body">
<div className="field">
<Inputfield placeholder="Geef een naam in"/>
</div>
<div className="field-body field">
<Inputfield placeholder="Geef een naam in"/>
</div>
</div>
<div className="field is-horizontal">
<div className="field-label">
<label className="label">Vak:</label>
</div>
<div className="field-body">
<div className="field">
<SelectionBox options={["vak1", "vak2", "vak3"]}/>
</div>
<div className="field-body field">
<SelectionBox options={["vak1", "vak2", "vak3"]}/>
</div>
</div>
<div className="field is-horizontal">
Expand All @@ -58,15 +55,11 @@ export function CreateProject(): JSX.Element {
{showCalender &&
<>
<Calendar onChange={e => deadlineChange(e)} value={deadlineValue}/>
<div className="is-horizontal">
<div className="field">
<SelectionBox options={hours}/>
<label className={"title ml-3 mr-3"}>:</label>
<SelectionBox options={minutes}/>

</div>
<div className="is-horizontal field">
<SelectionBox options={hours}/>
<label className={"title ml-3 mr-3"}>:</label>
<SelectionBox options={minutes}/>
</div>

</>
}
</label>
Expand All @@ -76,47 +69,41 @@ export function CreateProject(): JSX.Element {
<div className="field-label">
<label className="label">Beschrijving:</label>
</div>
<div className="field-body">
<div className="field">
<div style={{width: "33%"}}>
<textarea className="textarea" placeholder="Optionele beschrijving van het project"
value={description}
onChange={e => setDescription(e.target.value)}/>
</div>
<div className="field-body field">
<div style={{width: "33%"}}> {/* Deze moet er blijven, anders doet css raar*/}
<textarea className="textarea" placeholder="Optionele beschrijving van het project"
value={description}
onChange={e => setDescription(e.target.value)}/>
</div>
</div>
</div>
<div className="field is-horizontal">
<div className="field-label">
<label className="label">Docker file:</label>
</div>
<div className="field-body">
<div className="field">
<div className="file has-name">
<label className="file-label">
<input className="file-input" type="file" name="resume"/>
<span className="file-cta">
<span className="file-icon">
<FaUpload/>
</span>
<span className="file-label">
Kies een bestand
</span>
</span>
<span className="file-name">
C:\home\files\docker_file.dockerfile
</span>
</label>
</div>
</div>
<div className="field-body field file has-name">
<label className="file-label">
<input className="file-input" type="file" name="resume"/>
<span className="file-cta">
<span className="file-icon">
<FaUpload/>
</span>
<span className="file-label">
Kies een bestand
</span>
</span>
<span className="file-name">
C:\home\files\docker_file.dockerfile
</span>
</label>
</div>
</div>
<div className="field is-horizontal">
<div className="field-label">
<label className="label">Indiening files:</label>
</div>
<div className="field-body">
<div className="field">
<div className="field-body field">
<div className="field"> {/* Deze moet er blijven, anders doet css raar*/}
<label>Specifieer welke files de ingediende zip moet bevatten. Splits per komma.</label>
<br/>
<Inputfield placeholder="vb: diagram.dgr,verslag.pdf,textbestand.txt"/>
Expand Down Expand Up @@ -155,22 +142,19 @@ export function CreateProject(): JSX.Element {
onderstaande):</label>
</div>
<br/>
<div className="field-body">
<div className="field is-horizontal">
<div className="field-label">
<input type="checkbox"/>
</div>
<div className="field-body">
<label className="label is-fullwidth">random</label>
</div>
<div className="field-body field is-horizontal">
<div className="field-label">
<input type="checkbox"/>
</div>
<div className="field-body">
<label className="label is-fullwidth">random</label>
</div>
</div>
<div className="field is-horizontal">
<div className="field-label">
<input type="checkbox"/>
</div>
<div className="field-body">

<label className="label is-fullwidth">studenten kiezen zelf</label>
</div>
</div>
Expand Down
6 changes: 2 additions & 4 deletions frontend/src/components/FieldWithLabel.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,8 @@ export default function FieldWithLabel(props: { fieldLabel: string, fieldBody: s
<div className="field-label">
<label className="label">{props.arrow && "> "} {props.fieldLabel}: </label>
</div>
<div className="field-body">
<div className="field">
<label>{props.fieldBody}</label>
</div>
<div className="field-body field">
<label>{props.fieldBody}</label>
</div>
</div>
);
Expand Down
92 changes: 37 additions & 55 deletions frontend/src/components/ViewProjectStudent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,8 @@ export default function ViewProjectStudent(): JSX.Element {
<div className="field-label">
<label className="label">{"> "}Status: </label>
</div>
<div className="field-body">
<div className="field">
<label className={"has-text-danger"}>Failed</label>
</div>
<div className="field-body field">
<label className={"has-text-danger"}>Failed</label>
</div>
</div>
<FieldWithLabel fieldLabel={"Beschrijving"}
Expand All @@ -28,7 +26,7 @@ export default function ViewProjectStudent(): JSX.Element {
<label className="label">Indiening moet bevatten:</label>
</div>
<div className="field-body">
<div className="field">
<div className="field"> {/*Deze moet blijven, anders gaan de elementen in elkaar*/}
<li>Diagram.dgr</li>
<li>verslag.pdf</li>
</div>
Expand All @@ -38,45 +36,41 @@ export default function ViewProjectStudent(): JSX.Element {
<div className="field-label">
<label className="label">Groepsleden(3/4): </label>
</div>
<div className="field-body">
<div className="field">
<table className={"table is-fullwidth"}>
<thead>
<tr>
<th>Naam</th>
<th>Email</th>
<th>Laatste indiening</th>
</tr>
</thead>
<tbody>
<tr>
<td>Jan</td>
<td>[email protected]</td>
<td> -</td>
</tr>
<tr>
<td>Peter</td>
<td>[email protected]</td>
<td> -</td>
</tr>
<tr>
<td>Erik</td>
<td>[email protected]</td>
<td><FaCheck/></td>
</tr>

</tbody>
</table>
</div>
<div className="field-body field">
<table className={"table is-fullwidth"}>
<thead>
<tr>
<th>Naam</th>
<th>Email</th>
<th>Laatste indiening</th>
</tr>
</thead>
<tbody>
<tr>
<td>Jan</td>
<td>[email protected]</td>
<td> -</td>
</tr>
<tr>
<td>Peter</td>
<td>[email protected]</td>
<td> -</td>
</tr>
<tr>
<td>Erik</td>
<td>[email protected]</td>
<td><FaCheck/></td>
</tr>
</tbody>
</table>
</div>
</div>
<div className="field is-horizontal">
<div className="field-label">
<label className="label">Indiening(zip)</label>
</div>
<div className="field-body">
<div className="field">

<div className="field"> {/* Deze moet blijven */}
<li className={"mb-3"}>
<label className={"mr-3"}>My_files.zip </label>
<button className="button">
Expand All @@ -89,35 +83,23 @@ export default function ViewProjectStudent(): JSX.Element {
<label className="file-label">
<input className="file-input" type="file" name="resume"/>
<span className="file-cta">
<span className="file-icon">
<FaUpload/>
<span className="file-icon"><FaUpload/></span>
<span className="file-label">Kies een bestand</span>
</span>
<span className="file-label">
Kies een bestand
</span>
</span>
<span className="file-name">
This_is_the_file.zip
</span>
<span className="file-name">This_is_the_file.zip</span>
</label>
</div>
<div className="field-body">
<button className="button">
<FaDownload/>
</button>
<button className="button"><FaDownload/></button>
</div>

</div>
</li>
</div>
</div>
</div>
<div className="columns is-mobile is-centered">
<div className="column is-half">
<button className="button is-medium is-center" style={{backgroundColor: "#9c9afd"}}>Bevestigen
</button>
</div>

<div className="columns is-mobile is-centered column is-half">
<button className="button is-medium is-center" style={{backgroundColor: "#9c9afd"}}>Bevestigen</button>
</div>
</>
);
Expand Down

0 comments on commit b8c8dcc

Please sign in to comment.