Added some styles

This commit is contained in:
Arne van Iterson 2019-11-04 23:26:34 +01:00
parent a0c1bd8a37
commit 72b1364857
10 changed files with 68 additions and 21 deletions

1
server/.gitignore vendored Normal file
View File

@ -0,0 +1 @@
secret.js

View File

@ -12,7 +12,7 @@ const transporter = nodemailer.createTransport({
port: 587,
secure: false, // upgrade later with STARTTLS
auth: {
user: "36995@leerling.heerenlanden.nl",
user: "36899@leerling.heerenlanden.nl",
pass: secret
}
});
@ -84,7 +84,7 @@ router.post('/', (req, res, _next) => {
transporter.sendMail(mailOptions, function(error, info){
if (error) {
// Notify the front-end
res.json({result: {success: false, data: err}});
res.json({result: {success: false, data: error}});
} else {
// Add the user's data to the database identified by the id.

View File

@ -1,7 +1,10 @@
<nav>
<!-- nav here -->
<span>Surprise box reserveren</span>
<a routerLink="login"><fa-icon [icon]="faSignInAlt"></fa-icon></a>
<span><a routerLink="">Surprise box reserveren</a></span>
<a *ngIf="!loggedIn" routerLink="login">
<fa-icon [icon]="faSignInAlt"></fa-icon>
<span>Log in</span>
</a>
</nav>
<main>
<div class="overlay" *ngIf="form.visible"></div>

View File

@ -26,7 +26,7 @@ nav {
color: white;
background-color: rgba(0,0,0,0.25);
position: relative;
span {
span > a {
font-family: 'Staatliches', cursive;
position: absolute;
top: 50%;
@ -36,7 +36,7 @@ nav {
width: max-content;
}
a {
text-decoration: none;
// text-decoration: none;
color: white;
cursor: pointer;
position: absolute;
@ -47,10 +47,15 @@ nav {
fa-icon {
padding: 5px;
}
span {
display: none;
}
}
@media screen and (min-width: 600px) {
a::after {
content: "Login";
a {
span {
display: inline;
}
}
}
}
@ -58,7 +63,7 @@ nav {
main {
padding: 16px;
margin: 20px;
height: min-content;
min-height: calc(100vh - 64px - 72px);
border-radius: 1em;
background-color: #ffffff;
text-align: center;

View File

@ -3,9 +3,7 @@
<fa-icon (click)="formService.hideForm()" [icon]="faTimes"></fa-icon>
<form *ngIf="!submitted" [formGroup]="form" (ngSubmit)="onSubmit()">
<h4>Formulier voor surpise box {{ number }}</h4>
<span class="header">Formulier voor surpise box {{ number }}</span>
<label for="name">Naam: </label>
<input type="text" formControlName="name"><br>
@ -20,7 +18,7 @@
</form>
<div *ngIf="submitted">
<h4>Uw aanvraag is ingediend</h4>
<span class="header">Uw aanvraag is ingediend</span>
<p>Check uw mailbox om uw aanvrag te valideren. Als u de mail niet kan vinden, check dan ook uw spam.</p>
</div>

View File

@ -4,13 +4,36 @@
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
padding-bottom: 20px;
padding: 3em 2em 1em 2em;
border-radius: 0.5em;
span.header {
position: absolute;
font-weight: bold;
text-decoration: underline;
top: 0.6em;
left: 1em;
width: calc(100% - 50px);
}
form {
label {
float: left;
margin: 5px;
}
textarea, input {
border: 1px solid grey;
border-radius: 3px;
padding: 0.25em;
margin: 5px;
float: right;
}
}
fa-icon {
position: relative;
float: right;
padding-right: 10px;
padding-top: 10px;
position: absolute;
cursor: pointer;
top: 0.6em;
right: 1em;
}
}

View File

@ -10,7 +10,7 @@
Je kan je box op 28 november ophalen en betalen.
</p>
<div>
<span *ngIf="loggedIn" (click)="logout()">Log uit</span>
<span class="logout" *ngIf="loggedIn" (click)="logout()">Log uit</span>
<div class="container" *ngIf="!loggedIn && (data | async) as data">
<div *ngFor="let item of data.result.data; let i = index">
<!-- [href]="item ? '' : ('mailto:doemiddag.hetheerenlanden@cvo-av.nl?subject=Reservatie Surprise box ' + (i + 1))" -->

View File

@ -88,4 +88,10 @@
}
}
span.logout {
border: 1px solid grey;
border-radius: 3px;
padding: 0.25em;
margin: 5px;
}
}

View File

@ -1,9 +1,12 @@
<h3>Login</h3>
<div class="alert" *ngIf="alert">
De combinatie van de gebruikersnaam en wachtwoord is niet herkend.
</div>
<form [formGroup]="form" (ngSubmit)="onSubmit()">
<input formControlName="username" type="text">
<input formControlName="password" type="password">
<label for="username">Gebruikersnaam:</label><br>
<input formControlName="username" type="text"><br>
<label for="password">Wachtwoord:</label><br>
<input formControlName="password" type="password"><br>
<input type="submit" value="Login!">
</form>

View File

@ -0,0 +1,8 @@
form {
textarea, input {
border: 1px solid grey;
border-radius: 3px;
padding: 0.25em;
margin: 5px;
}
}