UIAngular/Client/src/app/components/balloon/balloon.component.html

49 lines
2.4 KiB
HTML

<secondary-page-component [hideSideBarOnMobile]="true" >
<div mainContent>
<br>
<p class="bold">
We are so glad you found one of our balloons. We would love to hear from you
and where you found it!
</p>
<p class="margin-top-space">
Click <a routerLink="/whoweare">here</a> to learn more about us.
</p>
<p class="margin-top-space">
Click <a routerLink="/salvation">here</a> to learn more about <span class="bold">Jesus</span>.
</p>
<br>
<div *ngIf="!formSubmitted">
<form class="form" #contactForm="ngForm" (ngSubmit)="onSubmit()">
<mat-form-field class="full-width">
<input matInput type="text" placeholder="Name" required value="" [(ngModel)]="name" name="name" >
</mat-form-field>
<mat-form-field class="full-width">
<input matInput type="text" placeholder="City, State" required value="" [(ngModel)]="location" name="location" >
</mat-form-field>
<mat-form-field class="full-width">
<input matInput type="email" placeholder="Email" value="" [(ngModel)]="email" name="email" pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$">
</mat-form-field>
<mat-form-field class="full-width">
<input matInput type="tel" placeholder="Phone" value="" [(ngModel)]="phone" name="phone">
</mat-form-field>
<mat-form-field class="full-width">
<textarea matInput type="text" placeholder="Other Information or Questions" value="" [(ngModel)]="body" name="body" rows="5" ></textarea>
</mat-form-field>
<mat-form-field class="hide">
<input matInput type="text" placeholder="hp" required value="" [(ngModel)]="hp" name="subject">
</mat-form-field>
<div class="errorMessages" *ngIf="errorMessages.length > 0">
<p *ngFor="let error of errorMessages">{{error}}</p>
</div>
<button mat-raised-button type="submit" [disabled]="!contactForm.form.valid || submitButtonDisabled">{{submitButtonText}}</button>
</form>
</div>
<div *ngIf="formSubmitted">
<p><b>Thank You!</b></p>
<p>Your message has been sent.</p>
</div>
</div>
<div sideBar ofbFadeInOnScroll>
</div>
</secondary-page-component>