Profile page CSS fix

src/Interlinked.Core/Pages/UserProfile.razor

@@ -1,15 +1,20 @@
-@page "/userprofile"
+@page "/user/{username}"
 
 @code {
-    private string UserName = "John Doe";
+    [Parameter]
+    public string Username { get; set; } = "johndoeUwU";
+    private string FullName = "meow uwu";
     private string Bio = "Software Developer";
     private List<string> Skills = new List<string> { "C#", "ASP.NET Core", "Blazor" };
 }
 
-<div class="profile">
+<div class="user-profile">
     <img class="background" src="images/background.jpg" alt="Background" />
-    <img class="userprofileimage" src="images/kuba.jpg" alt="Profile Picture" />
+    <img class="profile-img" src="images/kuba.jpg" alt="Profile Picture" />
-    <h1>@UserName</h1>
+    <div class="profile-names">
+        <h1 class="profile-username">@($"@{Username}")</h1>
+        <h3 class="profile-fullname">(@FullName)</h3>
+    </div>
     <p>@Bio</p>
     <h2>Skills</h2>
     <ul>
@@ -19,6 +24,3 @@
         }
     </ul>
 </div>
-
-
-

src/Interlinked.Core/Properties/launchSettings.json

@@ -8,12 +8,22 @@
     }
   },
   "profiles": {
+    "http": {
+      "commandName": "Project",
+      "dotnetRunMessages": true,
+      "launchBrowser": true,
+      "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
+      "applicationUrl": "http://localhost:5162",
+      "environmentVariables": {
+        "ASPNETCORE_ENVIRONMENT": "Development"
+      }
+    },
     "https": {
       "commandName": "Project",
       "dotnetRunMessages": true,
       "launchBrowser": true,
-      "inspectUri": "{wsProtocol}://catboy.men/_framework/debug/ws-proxy?browser={browserInspectUri}",
+      "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
-      "applicationUrl": "http://0.0.0.0:2137",
+      "applicationUrl": "https://localhost:7047;http://localhost:5162",
       "environmentVariables": {
         "ASPNETCORE_ENVIRONMENT": "Development"
       }

src/Interlinked.Core/wwwroot/css/app.css

@@ -87,16 +87,6 @@ a,
   animation-timing-function: linear;
 }
 
-.userprofileimage {
-  position: absolute;
-  top: 22rem; /* Adjust as needed */
-  left: 15rem; /* Adjust as needed */
-  z-index: 1; /* Place the profile picture above the background image */
-  max-width: 200px;
-  max-height: 200px;
-  border-radius: 200px;
-}
-
 @keyframes spin {
   0% {
     transform: rotate(0deg);
@@ -106,3 +96,29 @@ a,
     transform: rotate(360deg);
   }
 }
+
+.profile-img {
+  position: absolute;
+  top: 22rem; /* Adjust as needed */
+  left: 15rem; /* Adjust as needed */
+  z-index: 1; /* Place the profile picture above the background image */
+  max-width: 200px;
+  max-height: 200px;
+  border-radius: 200px;
+}
+
+.profile-names {
+  width: fit-content;
+  margin-top: 0.5rem;
+}
+
+.profile-username {
+  font-size: 2.5rem;
+  margin-bottom: 0;
+}
+
+.profile-fullname {
+  font-size: 1.2rem;
+  margin-top: 0;
+  color: gray;
+}