checkbox register rules
This commit is contained in:
parent
5d94f865ce
commit
ce32f6c28a
@ -3,10 +3,6 @@
|
||||
<logo>
|
||||
<a class="logo navbar-brand waves-light" mdbWavesEffect href="#"><strong>SupFile</strong></a>
|
||||
</logo>
|
||||
<links>
|
||||
<ul class="navbar-nav mr-auto">
|
||||
</ul>
|
||||
</links>
|
||||
</mdb-navbar>
|
||||
|
||||
<section class="view intro-2 mask rgba-gradient">
|
||||
|
@ -114,9 +114,88 @@
|
||||
<label for="form4">Your password</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check white-text">
|
||||
<input class="form-check-input" type="checkbox" id="checkbox11" (click)='toggleCheckbox()' mdbInputDirective>
|
||||
<label class="form-check-label" for="checkbox11">I agree to the terms of this website</label>
|
||||
<button class="btn btn-sm btn-outline-white waves-light" id="rules" data-toggle="modal" data-target="#basicExample" (click)="rules.show()" mdbWavesEffect>Rules</button>
|
||||
</div>
|
||||
|
||||
<!--Modal-->
|
||||
<div mdbModal #rules="mdb-modal" class="modal fade" id="basicExample" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="overflow: auto;">
|
||||
<div class="modal-dialog modal-lg" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title w-100" id="myModalLabel">Rules</h4>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close" (click)="rules.hide()">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>
|
||||
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
|
||||
<br>
|
||||
<br>
|
||||
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
|
||||
<br>
|
||||
<br>
|
||||
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
|
||||
<br>
|
||||
<br>
|
||||
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
|
||||
<br>
|
||||
<br>
|
||||
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
|
||||
<br>
|
||||
<br>
|
||||
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
|
||||
<br>
|
||||
<br>
|
||||
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
|
||||
<br>
|
||||
<br>
|
||||
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
|
||||
<br>
|
||||
<br>
|
||||
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
|
||||
<br>
|
||||
<br>
|
||||
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
|
||||
<br>
|
||||
<br>
|
||||
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
|
||||
<br>
|
||||
<br>
|
||||
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
|
||||
<br>
|
||||
<br>
|
||||
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
|
||||
<br>
|
||||
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
|
||||
<br>
|
||||
<br>
|
||||
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
|
||||
<br>
|
||||
<br>
|
||||
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
|
||||
<br>
|
||||
<br>
|
||||
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
|
||||
<br>
|
||||
<br>
|
||||
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
|
||||
</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary waves-light" data-dismiss="modal" (click)="rules.hide()" mdbWavesEffect>Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Modal-->
|
||||
|
||||
<div class="text-center">
|
||||
<button class="btn btn-primary waves-light" (click)="signup()" mdbWavesEffect>Sign up</button>
|
||||
<button class="btn btn-secondary waves-light" mdbWavesEffect (click)="showregister()">Log In</button>
|
||||
<button class="btn btn-primary waves-light" [disabled]='!toggleButton' (click)="signup()" mdbWavesEffect>Register</button>
|
||||
<button class="btn btn-secondary waves-light" mdbWavesEffect (click)="showregister()">Back to log in</button>
|
||||
<hr class="hr-light mb-3 mt-4">
|
||||
|
||||
<div class="inline-ul text-center d-flex justify-content-center">
|
||||
|
@ -43,9 +43,19 @@ h6 {
|
||||
}
|
||||
}
|
||||
|
||||
.form-check {
|
||||
padding-left: 0;
|
||||
padding-top: 1.2rem;
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
|
||||
|
||||
.priceList {
|
||||
padding: 10%;
|
||||
padding-top: 0%;
|
||||
padding-bottom: 5%;
|
||||
}
|
||||
|
||||
#rules {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
@ -11,6 +11,7 @@ import { of } from 'rxjs/observable/of';
|
||||
})
|
||||
export class HomeComponent implements OnInit {
|
||||
registerbool: boolean;
|
||||
toggleButton: boolean
|
||||
signupData = { username:'', password:'' };
|
||||
loginData = { username: '', password: '' };
|
||||
message = '';
|
||||
@ -19,12 +20,17 @@ export class HomeComponent implements OnInit {
|
||||
|
||||
constructor(private http: HttpClient, private router: Router) {
|
||||
this.registerbool = false;
|
||||
this.toggleButton = false;
|
||||
}
|
||||
|
||||
showregister() {
|
||||
this.registerbool = !this.registerbool
|
||||
}
|
||||
|
||||
toggleCheckbox() {
|
||||
this.toggleButton = !this.toggleButton;
|
||||
}
|
||||
|
||||
login() {
|
||||
this.http.post('/api/signin', this.loginData).subscribe(resp => {
|
||||
this.data = resp;
|
||||
|
Loading…
Reference in New Issue
Block a user