ztimson/legio-30
ztimson/legio-30
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases Activity

Updated contact form
Some checks failed
Build Website / Tag Version (push) Blocked by required conditions
Details
Build Website / Build & Push Dockerfile (push) Blocked by required conditions
Details
Build Website / Build NPM Project (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Zakary Timson 2024-01-10 10:08:25 -05:00
parent 5d70a86253
commit a50a70199d
4 changed files with 57 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
src/app/components/contact/contact.component.html
View File

@ -0,0 +1,53 @@
<div class="d-flex flex-column-reverse flex-md-row justify-content-center cap-width">
<div style="flex: 2 0 0;">
<form>
<div>
<mat-form-field appearance="fill" class="w-100">
<mat-label>Email</mat-label>
<input matInput>
</mat-form-field>
</div>
<div>
<mat-form-field appearance="fill" class="w-100">
<mat-label>Subject</mat-label>
<mat-select [(value)]="contact">
<mat-option value="general">General Inquiry</mat-option>
<mat-option value="castra">Castra Event</mat-option>
</mat-select>
</mat-form-field>
</div>
<div>
<mat-form-field appearance="fill" class="w-100">
<mat-label>Message</mat-label>
<textarea matInput rows="10"></textarea>
</mat-form-field>
</div>
<div class="d-flex justify-content-between align-items-center">
<div>
<mat-checkbox color="primary">Send me a copy</mat-checkbox>
</div>
<div>
<button mat-raised-button color="primary">Send</button>
</div>
</div>
</form>
</div>
<div class="px-3">
<div class="d-block d-md-none my-5 border-top border-dark" style="height: 1px; width: 100%;"></div>
<div class="d-none d-md-block mx-4 border-end border-dark" style="height: 100%; width: 1px;"></div>
</div>
<div class="d-flex flex-column text-center text-md-start align-self-center" style="flex: 1 1 1;">
<div *ngIf="contact != 'castra'">
<h3>Robert Sacco</h3>
<h4 class="mb-0">Legio XXX President</h4>
<h5>Portrays: Aquilifer Primus Marius Maximus</h5>
<a href="mailto:sacco.c.r@bell.net">sacco.c.r@bell.net</a>
</div>
<div *ngIf="contact == 'castra'">
<h3>Tom Ross</h3>
<h4 class="mb-0">Legio XXX <em>Patronus</em> (Patron)</h4>
<h5>Portrays: Titus Quartinius Saturnalus</h5>
<a href="mailto:tomlongwoods@gmail.com">tomlongwoods@gmail.com</a>
</div>
</div>
</div>

2
src/app/components/contact/contact.component.ts
View File

@ -5,5 +5,5 @@ import {Component} from '@angular/core';
templateUrl: './contact.component.html' templateUrl: './contact.component.html'
}) })
export class ContactComponent { export class ContactComponent {
contact: string = '';
} }

51
src/app/views/home/home.component.html
View File

@ -75,54 +75,7 @@
<!-- Contact --> <!-- Contact -->
<section id="contact" class="d-flex flex-column align-items-center justify-content-center fill"> <section id="contact" class="d-flex flex-column align-items-center justify-content-center fill">
<div class="container"> <div class="container">
<h2 class="text-center">Contact</h2> <h2 class="text-center mb-5">Contact</h2>
<div class="d-flex flex-row"> <app-contact></app-contact>
<form class="pe-3" style="width: min(100%, 600px)">
<div>
<mat-form-field appearance="fill" class="w-100">
<mat-label>Email</mat-label>
<input matInput>
</mat-form-field>
</div>
<div>
<mat-form-field appearance="fill" class="w-100">
<mat-label>Subject</mat-label>
<mat-select [(value)]="contact">
<mat-option value="general">General Inquiry</mat-option>
<mat-option value="castra">Castra Event</mat-option>
</mat-select>
</mat-form-field>
</div>
<div>
<mat-form-field appearance="fill" class="w-100">
<mat-label>Message</mat-label>
<textarea matInput rows="8"></textarea>
</mat-form-field>
</div>
<div class="d-flex justify-content-between align-items-center">
<div>
<mat-checkbox color="primary">Send me a copy</mat-checkbox>
</div>
<div>
<button mat-raised-button color="primary">Send</button>
</div>
</div>
</form>
<mat-divider vertical></mat-divider>
<div class="d-flex flex-column justify-content-center ps-3" style="width: min(100%, 600px)">
<div *ngIf="contact == 'general'">
<h3>Robert Sacco</h3>
<h4 class="mb-0">Legio XXX President</h4>
<h5>Portrays: Aquilifer Primus Marius Maximus</h5>
<a href="mailto:sacco.c.r@bell.net">sacco.c.r@bell.net</a>
</div>
<div *ngIf="contact == 'castra'">
<h3>Tom Ross</h3>
<h4 class="mb-0">Legio XXX <em>Patronus</em> (Patron)</h4>
<h5>Portrays: Titus Quartinius Saturnalus</h5>
<a href="mailto:tomlongwoods@gmail.com">tomlongwoods@gmail.com</a>
</div>
</div>
</div>
</div> </div>
</section> </section>

6
src/app/views/home/home.component.ts
View File

@ -1,12 +1,8 @@
import {Component} from '@angular/core'; import {Component} from '@angular/core';
import {NAVIGATION} from '../../misc/navigation';
@Component({ @Component({
selector: 'xxx-home', selector: 'xxx-home',
templateUrl: './home.component.html', templateUrl: './home.component.html',
styleUrls: ['./home.component.scss'] styleUrls: ['./home.component.scss']
}) })
export class HomeComponent { export class HomeComponent { }
contact: string = '';
navigation = NAVIGATION;
}