TPH styling

src/Layout/MainLayout.razor

@@ -5,11 +5,7 @@
     </div>
 
     <main>
-        <div class="top-row px-4">
+        <article class="content px-4 d-flex row justify-content-center text-center">
-            <a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
-        </div>
-
-        <article class="content px-4">
             @Body
         </article>
     </main>

src/Layout/MainLayout.razor.css

@@ -9,7 +9,7 @@ main {
 }
 
 .sidebar {
-    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
+    background-image: linear-gradient(225deg, #9423fc 0%, #feac70 99%);
 }
 
 .top-row {

src/Pages/Home.razor

@@ -1,7 +1,16 @@
 @page "/"
 
-<PageTitle>Home</PageTitle>
+<PageTitle>TPH Blazor Spotlight Example</PageTitle>
 
-<h1>Hello, world!</h1>
+<h1>Welcome to TPH Blazor Spotlight Example</h1>
+
+<h5 class="text-secondary">For everyone that doesn't know: TPH = The Programmer's Hangout</h5>
+
+<h4 class="mt-5">Links</h4>
+
+<p class="mb-0">Discord Server</p>
+<a href="https://discord.gg/programming">discord.gg/programming</a>
+
+<p class="mt-4 mb-0">GitHub Repository</p>
+<a href="https://github.com/Stone-Red-Code/TPH-Blazor-Spotlight-Example">github.com/Stone-Red-Code/TPH-Blazor-Spotlight-Example</a>
 
-Welcome to your new app.

src/Program.cs

@@ -1,8 +1,9 @@
 using Microsoft.AspNetCore.Components.Web;
 using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
+
 using TphBlazorSpotlightExample;
 
-var builder = WebAssemblyHostBuilder.CreateDefault(args);
+WebAssemblyHostBuilder builder = WebAssemblyHostBuilder.CreateDefault(args);
 builder.RootComponents.Add<App>("#app");
 builder.RootComponents.Add<HeadOutlet>("head::after");
 

src/_Imports.razor

@@ -8,3 +8,4 @@
 @using Microsoft.JSInterop
 @using TphBlazorSpotlightExample
 @using TphBlazorSpotlightExample.Layout
+@using TphBlazorSpotlightExample.Models

src/wwwroot/css/app.css

@@ -1,5 +1,8 @@
 html, body {
     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+    background-color: #121240;
+    color: aliceblue !important;
+    overflow: hidden;
 }
 
 h1:focus {
@@ -7,7 +10,7 @@ h1:focus {
 }
 
 a, .btn-link {
-    color: #0071c1;
+    color: #33AAFF;
 }
 
 .btn-primary {
@@ -82,7 +85,7 @@ a, .btn-link {
     }
 
         .loading-progress circle:last-child {
-            stroke: #1b6ec2;
+            stroke: #9423fc;
             stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
             transition: stroke-dasharray 0.05s ease-in-out;
         }