Graphic fixes & mobile navigation
All checks were successful
Build Website / Build NPM Project (push) Successful in 1m43s
Build Website / Tag Version (push) Successful in 11s
Build Website / Build & Push Dockerfile (push) Successful in 2m40s

This commit is contained in:
2024-01-09 11:45:37 -05:00
parent 5ec05c0f27
commit 1ab563ca96
18 changed files with 93 additions and 59 deletions

View File

@ -1,10 +1,10 @@
<div class="invert">
<div class="banner d-print-none"></div>
<div class="container py-4 px-3">
<div class="container">
<div>
<div class="d-flex align-items-end justify-content-between mb-2">
<h1 class="mb-0">About</h1>
<a class="d-flex d-print-none justify-content-center text-muted" href="javascript:window.print()">
<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
<mat-icon class="me-1">print</mat-icon>
Print
</a>

View File

@ -1,6 +1,6 @@
.banner {
width: 100%;
height: max(300px, 30vh);
height: 50vh;
background: white url("/assets/img/castra.jpg") center 35% no-repeat;
background-size: cover;
}

View File

@ -1,10 +1,10 @@
<div class="invert">
<div class="banner d-print-none"></div>
<div class="container py-4 px-3">
<div class="container">
<div>
<div class="d-flex align-items-end justify-content-between mb-2">
<h1 class="mb-0"><em>Castra Aestiva</em> (Summer Camp)</h1>
<a class="d-flex d-print-none justify-content-center text-muted" href="javascript:window.print()">
<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
<mat-icon class="me-1">print</mat-icon>
Print
</a>
@ -21,7 +21,7 @@
<h2 class="mb-2">Details</h2>
<p>
Tom Ross hosts a Castra Aestiva event every Memorial Day weekend (in May) near Tillsonburg Ontario. It's a private multi-day training event involving Romans and their enemies and is the perfect opportunity for new Roman reenactors. Participants
sleep in <em>sub pellibus</em> (tents) within the protective walls of the <em>castrum</em> (fort). If May doesn't work for you, consider coming to <a routerLink="/events/hiberna">Castra Hiberna</a> in September.
sleep in <em>sub pellibus</em> (tents) within the protective walls of the <em>castrum</em> (fort). If May doesn't work for you, consider coming to <a routerLink="/events/castra-hiberna">Castra Hiberna</a> in September.
</p>
<h3 class="mb-0">Activities</h3>
<ul class="mt-0">

View File

@ -1,6 +1,6 @@
.banner {
width: 100%;
height: max(300px, 30vh);
height: 50vh;
background: white url("/assets/img/interior.jpg") center 35% no-repeat;
background-size: cover;
}

View File

@ -1,8 +1,14 @@
<div class="invert">
<div class="banner d-print-none"></div>
<div class="container py-4 px-3">
<div class="container">
<div>
<h1 class="mb-2"><em>Agonium</em> (Janus Festival)</h1>
<div class="d-flex align-items-end justify-content-between mb-2">
<h1 class="mb-0"><em>Agonium</em> (Janus Festival)</h1>
<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
<mat-icon class="me-1">print</mat-icon>
Print
</a>
</div>
<mat-divider></mat-divider>
<br>
</div>

View File

@ -1,6 +1,6 @@
.banner {
width: 100%;
height: max(300px, 30vh);
height: 50vh;
background: white url("/assets/img/agonium.png") center center no-repeat;
background-size: cover;
}

View File

@ -1,6 +1,12 @@
<div class="invert">
<div class="container py-4 px-3">
<h1 class="mb-2">Calendar</h1>
<div class="container">
<div class="d-flex align-items-end justify-content-between mb-2">
<h1 class="mb-0">Calendar</h1>
<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
<mat-icon class="me-1">print</mat-icon>
Print
</a>
</div>
<mat-divider class="mb-4"></mat-divider>
<iframe src="https://calendar.google.com/calendar/embed?height=600&wkst=1&bgcolor=%23ffffff&ctz=America%2FToronto&showTitle=0&showNav=1&showPrint=1&showTabs=0&showCalendars=0&src=Y18wYTIxNTM3ZDgwMWMzNTQ0MTUwYzk5YTUwNjI5Yjc5MjM0MjYyYjY0YzYyNzZiZTQ3OWJlMzA4OWU0MmM3NTQ5QGdyb3VwLmNhbGVuZGFyLmdvb2dsZS5jb20&color=%23D50000" style="border-width:0" width="100%" height="600" frameborder="0" scrolling="no"></iframe>
</div>

View File

@ -1,10 +1,10 @@
<div class="invert">
<div class="banner d-print-none"></div>
<div class="container py-4 px-3">
<div class="container">
<div>
<div class="d-flex align-items-end justify-content-between mb-2">
<h1 class="mb-0"><em>Castra Hiberna</em> (Winter Camp)</h1>
<a class="d-flex d-print-none justify-content-center text-muted" href="javascript:window.print()">
<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
<mat-icon class="me-1">print</mat-icon>
Print
</a>
@ -22,7 +22,7 @@
<h2 class="mb-2">Details</h2>
<p>
Tom Ross hosts a Castra Hiberna event every September near Tillsonburg Ontario. It's a private single day event between Romans and their adversaries. It's an excellent opportunity for new Roman reenactors. If May doesn't work for you, consider coming to
<a routerLink="/events/aestiva">Castra Aestiva</a> in May.
<a routerLink="/events/castra-aestiva">Castra Aestiva</a> in May.
</p>
<h3 class="mb-0">Activities</h3>
<ul class="mt-0">

View File

@ -1,6 +1,6 @@
.banner {
width: 100%;
height: max(300px, 30vh);
height: 50vh;
background: white url("/assets/img/morning-mist.jpg") center center no-repeat;
background-size: cover;
}

View File

@ -50,7 +50,7 @@
</section>
<!-- Recruitment -->
<section id="recruitment" class="d-flex flex-column flex-md-row align-items-center justify-content-center fill invert">
<div class="flex-grow-1 p-5 pb-0 text-center text-md-end" style="flex-basis: 0">
<div class="flex-grow-1 mt-5 mt-md-0 p-5 pb-0 text-center text-md-end" style="flex-basis: 0">
<img src="/assets/img/recruitment.png" alt="I want you for Legio XXX" style="max-width: min(90%, 400px)">
</div>
<div class="d-flex flex-grow-1 justify-content-start align-items-center" style="flex-basis: 0">
@ -74,7 +74,7 @@
</section>
<!-- Contact -->
<section id="contact" class="d-flex flex-column align-items-center justify-content-center fill">
<div>
<div class="container">
<h2 class="text-center">Contact</h2>
<div class="d-flex flex-row">
<form class="pe-3" style="width: min(100%, 600px)">

View File

@ -1,9 +1,9 @@
<div class="invert">
<div class="container py-4 px-3">
<div class="container">
<div>
<div class="d-flex align-items-end justify-content-between mb-2">
<h1 class="mb-0">Drill Commands</h1>
<a class="d-flex d-print-none justify-content-center text-muted" href="javascript:window.print()">
<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
<mat-icon class="me-1">print</mat-icon>
Print
</a>

View File

@ -1,9 +1,9 @@
<div class="invert">
<div class="container py-4 px-3">
<div class="container">
<div>
<div class="d-flex align-items-end justify-content-between mb-2">
<h1 class="mb-0">Getting Started</h1>
<a class="d-flex d-print-none justify-content-center text-muted" href="javascript:window.print()">
<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
<mat-icon class="me-1">print</mat-icon>
Print
</a>

View File

@ -1,9 +1,9 @@
<div class="invert">
<div class="container py-4 px-3">
<div class="container">
<div>
<div class="d-flex align-items-end justify-content-between mb-2">
<h1 class="mb-0">Equipment Maintenance</h1>
<a class="d-flex d-print-none justify-content-center text-muted" href="javascript:window.print()">
<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
<mat-icon class="me-1">print</mat-icon>
Print
</a>

View File

@ -1,9 +1,9 @@
<div class="invert">
<div class="container py-4 px-3">
<div class="container">
<div>
<div class="d-flex align-items-end justify-content-between mb-2">
<h1 class="mb-0">Rules & Regulations</h1>
<a class="d-flex d-print-none justify-content-center text-muted" href="javascript:window.print()">
<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
<mat-icon class="me-1">print</mat-icon>
Print
</a>