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

Updates

Browse Source
This commit is contained in:
Zakary Timson
2022-09-14 22:07:17 -04:00
parent 5c685bee4c
commit ea6bf2d09a
99 changed files with 21064 additions and 60266 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/app/app.module.ts Normal file
View File

@ -0,0 +1,29 @@
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRouting } from './app.routing';
import {FooterComponent} from './components/footer/footer.component';
import {NavbarComponent} from './components/navbar/navbar.component';
import { AppComponent } from './containers/app/app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import {MaterialModule} from './material.module';
import {HomeComponent} from './views/home/home.component';
export const APP_COMPONENTS = [
AppComponent,
HomeComponent,
FooterComponent,
NavbarComponent
]
@NgModule({
declarations: APP_COMPONENTS,
imports: [
BrowserModule,
AppRouting,
BrowserAnimationsModule,
MaterialModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

13
src/app/app.routing.ts Normal file
View File

@ -0,0 +1,13 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {HomeComponent} from './views/home/home.component';
const routes: Routes = [
{path: '', pathMatch: 'full', component: HomeComponent}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRouting { }

0
src/app/components/banner/banner.component.html Normal file
View File

0
src/app/components/banner/banner.component.ts Normal file
View File

51
src/app/components/footer/footer.component.html Normal file
View File

@ -0,0 +1,51 @@
<footer>
<div class="p-2" style="background: #333">
<div class="mx-auto d-flex justify-content-around" style="max-width: 800px">
<div>
<h2 class="sitemap-header">Home</h2>
<ul class="m-0">
<li><a routerLink="/">About</a></li>
<li><a routerLink="/">Gallery</a></li>
<li><a routerLink="/">Contact</a></li>
</ul>
</div>
<div>
<h2 class="sitemap-header">Learn</h2>
<ul class="m-0">
<li><a routerLink="/">Legio XXX</a></li>
<li><a routerLink="/">Legion Structure</a></li>
<li><a routerLink="/">Legion Camp</a></li>
<li><a routerLink="/">Legion Headquarters</a></li>
<li><a routerLink="/">Legionairy Equipment</a></li>
<li><a routerLink="/">Legionairy Training</a></li>
<li><a routerLink="/">Resources</a></li>
</ul>
</div>
<div>
<h2 class="sitemap-header">Events</h2>
<ul class="m-0">
<li><a routerLink="/">Castra Aestiva</a></li>
<li><a routerLink="/">Castra Hiberna</a></li>
<li><a routerLink="/">Callendar</a></li>
</ul>
</div>
<div>
<h2 class="sitemap-header">Members</h2>
<ul class="m-0">
<li><a routerLink="/">Getting Started</a></li>
<li><a routerLink="/">Rules & Regulations</a></li>
<li><a routerLink="/">Approved Vendors</a></li>
<li><a routerLink="/">Kit Assembly</a></li>
<li><a routerLink="/">Kit Maintinance</a></li>
<li><a routerLink="/">Login/Register</a></li>
</ul>
</div>
</div>
</div>
<div class="py-2 text-center">
<p class="m-0">
Copyright &copy; Legio XXX 2022 | All Rights Reserved<br>
Created by <a href="https://zakscode.com" target="_blank">Zak Timson</a>
</p>
</div>
</footer>

16
src/app/components/footer/footer.component.scss Normal file
View File

@ -0,0 +1,16 @@
.sitemap-header {
color: rgba(255, 255, 255, 0.8);
margin: 0;
}
ul {
list-style: none;
padding: 0;
a {
text-decoration: none;
color: rgba(255, 255, 255, 0.55);
}
a:visited:hover, a:hover { color: rgba(255, 255, 255, 0.75); }
a:visited { color: rgba(255, 255, 255, 0.55); }
}

8
src/app/components/footer/footer.component.ts Normal file
View File

@ -0,0 +1,8 @@
import {Component} from '@angular/core';
@Component({
selector: 'xxx-footer',
templateUrl: './footer.component.html',
styleUrls: ['./footer.component.scss']
})
export class FooterComponent { }

55
src/app/components/navbar/navbar.component.html Normal file
View File

@ -0,0 +1,55 @@
<mat-toolbar>
<mat-toolbar-row>
<div>
<a class="navbar-brand d-flex align-items-center" href="#">
<img src="assets/img/capricorn.png" alt="Capricorn" height="45" width="45">
<div class="px-2">LEGIO · XXX</div>
</a>
</div>
<div class="flex-grow-1"></div>
<div *ngIf="!hamburger">
<a href="#about"><button mat-button class="navbar-button">About</button></a>
<a href="#gallery"><button mat-button class="navbar-button">Gallery</button></a>
<a href="#contact"><button mat-button class="navbar-button">Contact</button></a>
<button mat-button [matMenuTriggerFor]="learnMenu" class="navbar-button">
Learn <mat-icon>expand_more</mat-icon>
</button>
<mat-menu #learnMenu="matMenu">
<button mat-menu-item>Legio XXX</button>
<button mat-menu-item>Legion Structure</button>
<button mat-menu-item>Legion Camp</button>
<button mat-menu-item>Legion Headquarters</button>
<button mat-menu-item>Legionary Equipment</button>
<button mat-menu-item>Legionairy Training</button>
<mat-divider></mat-divider>
<button mat-menu-item>Resources</button>
</mat-menu>
<button mat-button [matMenuTriggerFor]="eventsMenu" class="navbar-button">
Events <mat-icon>expand_more</mat-icon>
</button>
<mat-menu #eventsMenu="matMenu">
<button mat-menu-item>Castra Aestiva</button>
<button mat-menu-item>Castra Hiberna</button>
<mat-divider></mat-divider>
<button mat-menu-item>Calendar</button>
</mat-menu>
<button mat-button [matMenuTriggerFor]="membersMenu" class="navbar-button">
Members <mat-icon>expand_more</mat-icon>
</button>
<mat-menu #membersMenu="matMenu">
<button mat-menu-item>Getting Started</button>
<mat-divider></mat-divider>
<button mat-menu-item>Rules & Regulations</button>
<button mat-menu-item>Approved Vendors</button>
<button mat-menu-item>Kit Assembly</button>
<button mat-menu-item>Kit Maintinance</button>
<mat-divider></mat-divider>
<button mat-menu-item>Login/Register</button>
</mat-menu>
</div>
<button *ngIf="hamburger" mat-icon-button class="mr-3">
<mat-icon (click)="hamburgerClick.emit()">menu</mat-icon>
</button>
</mat-toolbar-row>
</mat-toolbar>
<div class="navbar-spacing"><!-- Spacing --></div>

55
src/app/components/navbar/navbar.component.scss Normal file
View File

@ -0,0 +1,55 @@
.navbar-spacing {
height: 64px;
width: 100%;
}
::ng-deep mat-toolbar {
background: #000 !important;
border-bottom: #fff solid 1px;
height: 64px;
position: fixed;
top: 0;
z-index: 100;
.mat-toolbar-row {
height: 100%;
}
.navbar-brand {
color: #fff;
text-decoration: none;
font-weight: lighter;
}
.navbar-button {
color: rgba(255, 255, 255, 0.55);
font-weight: normal;
padding: 0 8px 0 8px;
&:hover {
color: rgba(255, 255, 255, 0.75);
}
}
}
::ng-deep .mat-menu-content {
background: #000;
border: #fff solid 1px;
padding: 0 !important;
border-radius: 0.25rem;
mat-divider {
border-color: white;
margin-top: 0.2rem;
padding-bottom: 0.1rem;
}
button {
height: 36px;
line-height: 36px;
&:hover {
background: rgba(255, 255, 255, 0.15) !important;
}
}
}

12
src/app/components/navbar/navbar.component.ts Normal file
View File

@ -0,0 +1,12 @@
import {Component, EventEmitter, Input, Output} from '@angular/core';
@Component({
selector: 'xxx-navbar',
templateUrl: './navbar.component.html',
styleUrls: ['./navbar.component.scss']
})
export class NavbarComponent {
@Input() hamburger = true;
@Output() hamburgerClick = new EventEmitter<void>();
}

3
src/app/containers/app/app.component.html Normal file
View File

@ -0,0 +1,3 @@
<xxx-navbar [hamburger]="mobile"></xxx-navbar>
<router-outlet></router-outlet>
<xxx-footer></xxx-footer>

0
src/app/containers/app/app.component.scss Normal file
View File

25
src/app/containers/app/app.component.ts Normal file
View File

@ -0,0 +1,25 @@
import {BreakpointObserver, Breakpoints} from '@angular/cdk/layout';
import { Component } from '@angular/core';
import {ActivatedRoute, NavigationEnd, Router} from '@angular/router';
import {filter} from 'rxjs';
import { LocalStorage } from 'webstorage-decorators';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
mobile = false;
open = false;
constructor(private router: Router, route: ActivatedRoute, breakpointObserver: BreakpointObserver) {
router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe(() => this.open = false);
breakpointObserver.observe(['(max-width: 750px)']).subscribe(result => {
console.log(result)
this.mobile = result.matches;
this.open = !this.mobile;
})
}
}

20
src/app/material.module.ts Normal file
View File

@ -0,0 +1,20 @@
import {NgModule} from '@angular/core';
import {MatButtonModule} from '@angular/material/button';
import {MatDividerModule} from '@angular/material/divider';
import {MatIconModule} from '@angular/material/icon';
import {MatMenuModule} from '@angular/material/menu';
import {MatToolbarModule} from '@angular/material/toolbar';
export const MATERIAL_MODULES = [
MatButtonModule,
MatDividerModule,
MatIconModule,
MatMenuModule,
MatToolbarModule
];
@NgModule({
imports: MATERIAL_MODULES,
exports: MATERIAL_MODULES,
})
export class MaterialModule {}

1
src/app/views/events/.gitkeep Normal file
View File

@ -0,0 +1 @@
Z^C5kgHKfYgy

77
src/app/views/home/home.component.html Normal file
View File

@ -0,0 +1,77 @@
<header class="fill">
<div class="fill d-flex flex-column align-items-center justify-content-center">
<img src="/assets/img/spqr.png" class="mt-5" alt="SPQR" height="250" width="250" style="filter: drop-shadow(2px 4px 6px black);">
<div>
<a href="#about" class="text-white">
<i class="fa fa-angle-double-down fa-4x" style="filter: drop-shadow(2px 4px 6px black);"></i>
</a>
</div>
</div>
</header>
<section id="about" class="d-flex flex-column align-items-center bg-black text-white" style="height: 100vh">
<div class="mb-5 py-5"><!-- Spacer --></div>
<h2>About</h2>
<div class="container">
<div class="d-flex align-items-center justify-content-around">
<div class="">
<img src="/assets/img/trajan-bust.png" height="auto" width="275px">
</div>
<div class="text-center">
<h4>Legio XXX Vlpia Victrix</h4>
<h4 class="mb-4">(Trajan's Victorious Thirtieth Legion)</h4>
<p>Legio XXX is a North American Roman re-enactment group that has been active since 2004.</p>
<p>It's members represent a cross between living history enthusiasts and edutainers</p>
<p>recreating the lives of LEGIO XXX, founded by emperor Trajan in the 2nd centery AD.</p>
</div>
<div class="ps-4">
<div class="p-1 text-center" style="border: solid 5px white;">
<div class="p-1" style="border: dashed 5px white;">
<div class="p-3" style="border: solid 5px white;">
<h3 class="text-nowrap" style="font-size: 2em">LEGIO · XXX</h3>
<img src="/assets/img/capricorn.png" class="my-3" alt="capricorn" height="140em" width="140em">
<h4 class="text-nowrap" style="font-size: 1.5em">VLPIA · VICTRIX</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="gallery" class="d-flex flex-column align-items-center" style="height: 100vh; background: #fff; color: #000;">
<div class="mb-5 py-5"><!-- Spacer --></div>
<h2>Gallery</h2>
</section>
<section style="background: #fff">
<img src="/assets/img/formation.png" width="100%" height="auto">
</section>
<section id="contact" class="d-flex flex-column align-items-center py-5 bg-black text-white" style="min-height: 100vh">
<div class="mb-5 py-5"><!-- Spacer --></div>
<h2>Contact</h2>
<div class="w-100 px-5" style="max-width: 600px">
<form class="text-start">
<div class="mb-3">
<label class="text-white w-100" for="email">Email</label>
<input id="email" class="form-control w-100.0" type="email" placeholder="username@example.com">
</div>
<div class="mb-3">
<label class="text-white w-100" for="subject">Subject</label>
<select id="subject" class="form-control w-100.0">
<option>Castra Aestiva/Castra Hiberna</option>
<option>Re-enactment Inqueries</option>
<option>Other</option>
</select>
</div>
<div class="mb-3">
<label class="text-white w-100" for="message">Message</label>
<textarea id="message" class="form-control w-100" rows="5"></textarea>
</div>
<div class="d-flex justify-content-between align-items-center">
<div class="d-inline">
<input type="checkbox" class="form-check-input" id="copy">
<label class="form-check-label" for="copy">Send me a copy</label>
</div>
<button class="btn btn-primary">Send</button>
</div>
</form>
</div>
</section>

4
src/app/views/home/home.component.scss Normal file
View File

@ -0,0 +1,4 @@
header {
background: black url("/assets/img/colosseum.jpg") no-repeat top center;
background-size: cover;
}

10
src/app/views/home/home.component.ts Normal file
View File

@ -0,0 +1,10 @@
import {Component} from '@angular/core';
@Component({
selector: 'xxx-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.scss']
})
export class HomeComponent {
}

1
src/app/views/members/.gitkeep Normal file
View File

@ -0,0 +1 @@
Z^C5kgHKfYgy

1
src/app/views/resources/.gitkeep Normal file
View File

@ -0,0 +1 @@
Z^C5kgHKfYgy