Merge branch 'main' into add-about-page

.github/workflows/azure-static-web-apps-victorious-tree-0b68b6103.yml

@@ -23,7 +23,7 @@ jobs:
         id: builddeploy
         uses: Azure/static-web-apps-deploy@v1
         with:
-          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_MANGO_PEBBLE_07630D403 }}
+          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_VICTORIOUS_TREE_0B68B6103 }}
           repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)
           action: "upload"
           ###### Repository/Build Configurations - These values can be configured to match your app requirements. ######
@@ -42,5 +42,5 @@ jobs:
         id: closepullrequest
         uses: Azure/static-web-apps-deploy@v1
         with:
-          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_MANGO_PEBBLE_07630D403 }}
+          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_VICTORIOUS_TREE_0B68B6103 }}
           action: "close"

BeauFindlay/src/BeauFindlay.Client/Layout/Footer.razor

@@ -7,9 +7,13 @@
                     <i class="fa-brands fa-github fa-xl"></i>
                 </a>
                 <a href="https://www.linkedin.com/in/beau-findlay/" class="text-slate-200 hover:text-slate-500">
-                    <span class="sr-only">YouTube</span>
+                    <span class="sr-only">LinkedIn</span>
                     <i class="fa-brands fa-linkedin fa-xl"></i>
                 </a>
+                <a href="mailto:me@beaufindlay.com" class="text-slate-200 hover:text-slate-500">
+                    <span class="sr-only">Email</span>
+                    <i class="fa-regular fa-envelope fa-xl"></i>
+                </a>
             </div>
             <p class="mt-8 text-xs leading-5 text-slate-100 md:order-1 md:mt-0">
                 &copy; @DateTime.UtcNow.Year Beau Findlay. All rights reserved.

BeauFindlay/src/BeauFindlay.Client/Layout/MainLayout.razor

@@ -3,7 +3,7 @@
 <div class="flex flex-col min-h-screen fade-in">
     <NavBar/>
     
-    <div class="px-4 md:px-12 py-4">
+    <div class="flex-1 px-4 md:px-12 py-4">
         @Body
     </div>
 

BeauFindlay/src/BeauFindlay.Client/Pages/About.razor

@@ -2,6 +2,16 @@
 
 @inject IJSRuntime JSRuntime
 
+<PageTitle>About - Beau Findlay</PageTitle>
+
+@if (comingSoon)
+{
+    <div class="text-center">
+        <h1 class="text-4xl">Coming soon...</h1>
+    </div>
+}
+else
+{
     @if (!hasPreviouslyRendered)
     {
         <h1 class="text-4xl">
@@ -35,6 +45,8 @@ else
         <h2 class="text-2xl pb-4">Hosting</h2>
         <p></p>
     </section>
+}
+
 
 <AnchorNavigation/>
 
@@ -45,6 +57,7 @@ else
     private const string HostingSection = "hosting";
 
     private bool hasPreviouslyRendered;
+    private bool comingSoon = true;
 
     protected override async Task OnAfterRenderAsync(bool firstRender)
     {
@@ -71,4 +84,5 @@ else
     {
         await JSRuntime.InvokeVoidAsync("scrollToElement", elementId);
     }
+
 }

BeauFindlay/src/BeauFindlay.Client/Pages/Contact.razor

@@ -3,6 +3,8 @@
 @inject HttpClient HttpClient
 @inject IJSRuntime JSRuntime
 
+<PageTitle>Contact - Beau Findlay</PageTitle>
+
 <div class="text-center">
     <h1 class="text-4xl">Contact</h1>
     
@@ -19,14 +21,14 @@
             <div class="sm:col-span-2">
                 <label for="name" class="block font-semibold leading-6">Name</label>
                 <div class="mt-2.5">
-                    <InputText id="name" @bind-Value="contactInput.Name" class="block w-full text-lg border-0 px-3.5 py-2 bg-black shadow ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-gray-600"/>
+                    <InputText id="name" @bind-Value="contactInput.Name" class="block w-full text-lg border-0 px-3.5 py-2 bg-black shadow ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-gray-600" autocomplete="given-name"/>
                     <ValidationMessage For="() => contactInput.Name" class="text-red-600"/>
                 </div>
             </div>
             <div class="sm:col-span-2">
                 <label for="email" class="block font-semibold leading-6">Email</label>
                 <div class="mt-2.5">
-                    <InputText id="email" @bind-Value="contactInput.Email" class="block w-full text-lg border-0 px-3.5 py-2 bg-black shadow ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-gray-600"/>
+                    <InputText id="email" @bind-Value="contactInput.Email" class="block w-full text-lg border-0 px-3.5 py-2 bg-black shadow ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-gray-600" autocomplete="email"/>
                     <ValidationMessage For="() => contactInput.Email" class="text-red-600"/>
                 </div>
             </div>

BeauFindlay/src/BeauFindlay.Client/wwwroot/css/app.min.css

@@ -666,6 +666,10 @@ video {
   max-width: 36rem;
 }
 
+.flex-1 {
+  flex: 1 1 0%;
+}
+
 .flex-shrink-0 {
   flex-shrink: 0;
 }

BeauFindlay/src/BeauFindlay.Client/wwwroot/index.html

@@ -2,11 +2,24 @@
 <html lang="en">
 
 <head>
+    <script id="cookieyes"
+            type="text/javascript"
+            src="https://cdn-cookieyes.com/client_data/a05e8ecc917e725a2226b46a/script.js"></script>
     <meta charset="utf-8"/>
     <meta name="viewport"
           content="width=device-width, initial-scale=1.0"/>
+    <meta property="description" content="A Software Developer">
+    <meta property="og:title" content="Beau Findlay" />
+    <meta property="og:description" content="A Software Developer">
+    <meta property="og:type" content="website" />
+    <meta property="og:image" content="images/beaufindlay-logo.png" />
+    <meta property="og:url" content="https://beaufindlay.com" />
     <title>Beau Findlay</title>
     <base href="/"/>
+    <link rel="apple-touch-icon" sizes="180x180" href="images/apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="images/favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="images/favicon-16x16.png">
+    <link rel="manifest" href="/site.webmanifest">
     <link rel="stylesheet"
           href="css/app.min.css"/>
     <link rel="stylesheet"
@@ -17,16 +30,19 @@
 </head>
 
 <body class="bg-black font-mono text-slate-50 min-h-screen antialiased">
-<div id="app" class="h-full">
+<div id="app"
+     class="h-full">
     <div class="flex items-center justify-center text-2xl">
         <p class="py-10">
-            Loading beaufindlay.com<span class="blinking-cursor">|</span>
+            Loading
+            beaufindlay.com<span class="blinking-cursor">|</span>
         </p>
     </div>
 </div>
 <script src="js/smoothScroll.js"></script>
 <script src="_framework/blazor.webassembly.js"></script>
-<script src="https://www.google.com/recaptcha/api.js?render=6LcvxZIpAAAAAOIP5L6kGngwDZRpwkTdMezPn06x" async
+<script src="https://www.google.com/recaptcha/api.js?render=6LcvxZIpAAAAAOIP5L6kGngwDZRpwkTdMezPn06x"
+        async
         defer></script>
 <script src="js/recaptcha.js"></script>
 </body>

BeauFindlay/src/BeauFindlay.Client/wwwroot/site.webmanifest

@@ -0,0 +1,19 @@
+{
+  "name": "",
+  "short_name": "",
+  "icons": [
+    {
+      "src": "images/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "images/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}