Updating little things; font, color. Added a cute wave. Nothing major

PortfolioPage/Pages/Index.razor

@@ -5,9 +5,17 @@
 <div class="page-layout">
 
     <div class="blurb">
-        <h1 class="title">Hello, World!</h1>
+        <div class="blurb-title">
+            <h1 class="title">
+                Hello, World!
+            </h1>
+                <img src="..\..\Media\wave.png" class="img-thumbnail wave" >
+
+        </div>
         <h5 class="subtitle">Welcome to my corner of the Internet! </h5>
         <h5 class="text">My name is Kira Jiroux. I am a graduate of OSU - Oregon State University - with a Bachelor of Science in Computer Science, with an emphasis on VR/AR and Computer Graphics.</h5>
+
+
     </div>
 
 </div>

PortfolioPage/Pages/Index.razor.css

@@ -4,6 +4,11 @@
     #ffffe8 - pale yellow
     #cde990 - light green
     #aacb73 - green
+
+    #313866 - dark navy
+    #504099 - dark purple
+    #974ec3 - purple
+    #fe7be5 - pink
 */
 
 body {
@@ -19,21 +24,42 @@ body {
 }
 
 .blurb {
-    width: 60%;
-    background-color: #cde990;
+    width: 80%;
+    background-color: #504099;
     padding: 15px;
     border-radius: 25px;
-    border: 2px solid #3b5249;
+    border: 2px solid #974ec3;
 }
 
 .title {
-    color: #aacb73;
+    color: #9cf196;
+    font-family: "Megrim", sans-serif;
+    margin-bottom: 0;
+    padding-bottom: 0;
 }
 
 .subtitle {
     font-weight: 100;
+    font-size: .9em;
+    margin-top: 0;
+    margin-bottom: 13px;
+    color: #6dc885;
 }
 
 .text {
     color: white;
 }
+
+.wave {
+    width: 6%;
+    height: 6%;
+    background-color: transparent;
+    border: 1px solid transparent;
+    padding: 0;
+    padding-left: 3px;
+    margin: 0;
+}
+
+.blurb-title {
+    display: flex;
+}

PortfolioPage/Shared/MainLayout.razor.css

@@ -4,7 +4,14 @@
     #ffffe8 - pale yellow
     #cde990 - light green
     #aacb73 - green
+
+    #313866 - dark navy
+    #504099 - dark purple
+    #974ec3 - purple
+    #fe7be5 - pink
+
 */
+
 .page {
     position: relative;
     display: flex;
@@ -14,7 +21,7 @@
 
 main {
     flex: 1;
-    background-color: #ffffe8;
+    background-color: #313866;
 }
 
 .sidebar {
@@ -22,8 +29,8 @@ main {
 }
 
 .top-row {
-    background-color: #f7f7f7;
-    border-bottom: 1px solid #d6d5d5;
+    background-color: #504099;
+    border-bottom: 1px solid #974ec3;
     justify-content: flex-end;
     height: 3.5rem;
     display: flex;

PortfolioPage/Shared/NavMenu_v2.razor.css

@@ -1,7 +1,13 @@
-.navbar {
-    background-color: #cde990;
-    box-shadow: inset 0 -30px 0px -13px #aacb73;
+/*
+    #313866 - dark navy
+    #504099 - dark purple
+    #974ec3 - purple
+    #fe7be5 - pink
+*/
 
+.navbar {
+    background-color: #504099;
+    box-shadow: inset 0 -30px 0px -13px #974ec3;
 }
 
 .inline {
@@ -10,14 +16,14 @@
 }
 
 a.override-brand {
-    color: white;
+    color: #fe7be5;
     font-size: 3em;
     font-family: "Megrim", sans-serif;
 }
 
 
 .nav-item ::deep a {
-    color: white;
+    color: #fe7be5;
     font-size: 1em;
     text-decoration: none;
     margin-left: 10px;
@@ -27,11 +33,11 @@ a.override-brand {
     border-radius: 30px;
 }
 
-.nav-item ::deep a:hover {
-    background-color: #aacb73;
-    color: #ffd4d4;
-    font-size: 1.2em;
-    border-radius: 30px;
-}
+    .nav-item ::deep a:hover {
+        background: radial-gradient(circle at 50% 50%, #FE7BE5 0%, #EE82EE00 100%);
+        color: white;
+        font-size: 1.1em;
+        border-radius: 30px;
+    }
 
 

PortfolioPage/Shared/PhotoBanner.razor.css

@@ -8,6 +8,7 @@
     padding: 0;
     top: 0;
     max-width: 100vw;
+
 }
 
 
@@ -20,4 +21,6 @@
     transform: translate(-50%, -50%);
     font-size: 100px;
     color: white;
+    font-family: "Megrim", sans-serif;
+    font-weight:bold;
 }