beau/my-portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

Add navbar and move typewriter to components namespace

Browse Source
This commit is contained in:
Beau Findlay
2024-03-07 20:43:17 +00:00
parent 48a78dd241
commit a1418072dd
9 changed files with 67 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
BeauFindlay/BeauFindlay/Features/Typewriter/ITypewriterNotificationService.cs → BeauFindlay/BeauFindlay/Components/Typewriter/ITypewriterNotificationService.cs
View File

@@ -1,4 +1,4 @@
namespace BeauFindlay.Features.Typewriter;
namespace BeauFindlay.Components.Typewriter;
public interface ITypewriterNotificationService
{

0
BeauFindlay/BeauFindlay/Features/Typewriter/Typewriter.razor → BeauFindlay/BeauFindlay/Components/Typewriter/Typewriter.razor
View File

2
BeauFindlay/BeauFindlay/Features/Typewriter/TypewriterConstants.cs → BeauFindlay/BeauFindlay/Components/Typewriter/TypewriterConstants.cs
View File

@@ -1,4 +1,4 @@
namespace BeauFindlay.Features.Typewriter;
namespace BeauFindlay.Components.Typewriter;
public static class TypewriterConstants
{

2
BeauFindlay/BeauFindlay/Features/Typewriter/TypewriterNotificationService.cs → BeauFindlay/BeauFindlay/Components/Typewriter/TypewriterNotificationService.cs
View File

@@ -1,4 +1,4 @@
namespace BeauFindlay.Features.Typewriter;
namespace BeauFindlay.Components.Typewriter;
public class TypewriterNotificationService : ITypewriterNotificationService
{

13
BeauFindlay/BeauFindlay/Layout/MainLayout.razor
View File

@@ -1,13 +1,7 @@
@inherits LayoutComponentBase
@inject ITypewriterNotificationService TypingNotification
<div class="flex flex-col min-h-screen">
<nav class="flex items-center justify-center h-20 space-x-6">
<NavLink href="/" Match="NavLinkMatch.All" ActiveClass="border-l-2 border-r-2 px-2 rounded">Home</NavLink>
<NavLink href="/this" Match="NavLinkMatch.All" ActiveClass="border-l-2 border-r-2 px-2 rounded">This App</NavLink>
<NavLink href="/contact" Match="NavLinkMatch.All" ActiveClass="border-l-2 border-r-2 px-2 rounded">Contact</NavLink>
</nav>
<NavBar/>
<div class="px-4 md:px-8">
@Body
@@ -15,8 +9,3 @@
<Footer></Footer>
</div>
@code {
}

11
BeauFindlay/BeauFindlay/Layout/NavBar.razor Normal file
View File

@@ -0,0 +1,11 @@
<nav class="flex items-center justify-center py-12 space-x-8 fade-in">
<NavLink href="/" Match="NavLinkMatch.All" ActiveClass="border-l-2 border-r-2 px-2 rounded">
Home
</NavLink>
<NavLink href="/contact" Match="NavLinkMatch.All" ActiveClass="border-l-2 border-r-2 px-2 rounded">
Contact
</NavLink>
<NavLink href="/this" Match="NavLinkMatch.All" ActiveClass="border-l-2 border-r-2 px-2 rounded">
This App
</NavLink>
</nav>

2
BeauFindlay/BeauFindlay/Program.cs
View File

@@ -1,5 +1,5 @@
using BeauFindlay;
using BeauFindlay.Features.Typewriter;
using BeauFindlay.Components.Typewriter;
using Microsoft.AspNetCore.Components.Web;
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;

2
BeauFindlay/BeauFindlay/_Imports.razor
View File

@@ -8,4 +8,4 @@
@using Microsoft.JSInterop
@using BeauFindlay
@using BeauFindlay.Layout
@using BeauFindlay.Features.Typewriter
@using BeauFindlay.Components.Typewriter

102
BeauFindlay/BeauFindlay/wwwroot/css/app.min.css vendored
View File

@@ -581,22 +581,22 @@ video {
margin-top: auto;
}
.mt-10 {
margin-top: 2.5rem;
}
.flex {
display: flex;
}
.h-full {
height: 100%;
}
.h-10 {
height: 2.5rem;
}
.h-20 {
height: 5rem;
}
.h-full {
height: 100%;
}
.min-h-screen {
min-height: 100vh;
}
@@ -619,12 +619,14 @@ video {
margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse)));
}
.rounded {
border-radius: 0.25rem;
.space-x-8 > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0;
margin-right: calc(2rem * var(--tw-space-x-reverse));
margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
}
.border {
border-width: 1px;
.rounded {
border-radius: 0.25rem;
}
.border-l-2 {
@@ -635,11 +637,6 @@ video {
border-right-width: 2px;
}
.border-black {
--tw-border-opacity: 1;
border-color: rgb(0 0 0 / var(--tw-border-opacity));
}
.bg-black {
--tw-bg-opacity: 1;
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
@@ -649,13 +646,9 @@ video {
padding: 2rem;
}
.p-4 {
padding: 1rem;
}
.py-10 {
padding-top: 2.5rem;
padding-bottom: 2.5rem;
.px-2 {
padding-left: 0.5rem;
padding-right: 0.5rem;
}
.px-4 {
@@ -663,9 +656,24 @@ video {
padding-right: 1rem;
}
.px-2 {
padding-left: 0.5rem;
padding-right: 0.5rem;
.py-10 {
padding-top: 2.5rem;
padding-bottom: 2.5rem;
}
.py-28 {
padding-top: 7rem;
padding-bottom: 7rem;
}
.py-20 {
padding-top: 5rem;
padding-bottom: 5rem;
}
.py-12 {
padding-top: 3rem;
padding-bottom: 3rem;
}
.font-mono {
@@ -677,14 +685,9 @@ video {
line-height: 2rem;
}
.text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
}
.text-sm {
font-size: 0.875rem;
line-height: 1.25rem;
.text-4xl {
font-size: 2.25rem;
line-height: 2.5rem;
}
.text-xl {
@@ -697,15 +700,24 @@ video {
line-height: 1rem;
}
.text-4xl {
font-size: 2.25rem;
line-height: 2.5rem;
.text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
}
.font-semibold {
font-weight: 600;
}
.leading-5 {
line-height: 1.25rem;
}
.text-slate-100 {
--tw-text-opacity: 1;
color: rgb(241 245 249 / var(--tw-text-opacity));
}
.text-slate-200 {
--tw-text-opacity: 1;
color: rgb(226 232 240 / var(--tw-text-opacity));
@@ -716,11 +728,6 @@ video {
color: rgb(248 250 252 / var(--tw-text-opacity));
}
.text-slate-100 {
--tw-text-opacity: 1;
color: rgb(241 245 249 / var(--tw-text-opacity));
}
.underline {
text-decoration-line: underline;
}
@@ -734,11 +741,6 @@ video {
-moz-osx-font-smoothing: grayscale;
}
.subpixel-antialiased {
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: auto;
}
@keyframes blink {
from, to {
opacity: 1
@@ -799,10 +801,6 @@ video {
justify-content: space-between;
}
.md\:p-8 {
padding: 2rem;
}
.md\:px-8 {
padding-left: 2rem;
padding-right: 2rem;