- About
-
-
-
- Portfolio.Web
+
-
-
-
-
\ No newline at end of file
diff --git a/src/Portfolio.Web/Components/Layout/NavMenu.razor.css b/src/Portfolio.Web/Components/Layout/NavMenu.razor.css
index a2aeace..038a940 100644
--- a/src/Portfolio.Web/Components/Layout/NavMenu.razor.css
+++ b/src/Portfolio.Web/Components/Layout/NavMenu.razor.css
@@ -1,105 +1,52 @@
-.navbar-toggler {
- appearance: none;
- cursor: pointer;
- width: 3.5rem;
- height: 2.5rem;
- color: white;
- position: absolute;
- top: 0.5rem;
- right: 1rem;
- border: 1px solid rgba(255, 255, 255, 0.1);
- background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
+.navigation {
+ display: flex;
+ height: 50px;
+ justify-content: space-between;
+ align-items: center;
+ background-color: var(--background);
+ border-bottom: 1px solid var(--border-color);
+ padding-inline: 0.5rem;
}
-.navbar-toggler:checked {
- background-color: rgba(255, 255, 255, 0.5);
+.links, .socials {
+ display: flex;
+ gap: 1rem;
}
-.top-row {
- min-height: 3.5rem;
- background-color: rgba(0,0,0,0.4);
+.navigation > a {
+ text-decoration: none;
+ font-size: 1.25rem;
}
-.navbar-brand {
- font-size: 1.1rem;
+.socials a {
+ height: 32px;
}
-.bi {
- display: inline-block;
+.links ::deep a {
+ text-decoration: none;
position: relative;
- width: 1.25rem;
- height: 1.25rem;
- margin-right: 0.75rem;
- top: -1px;
- background-size: cover;
-}
-.bi-house-door-fill-nav-menu {
- background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
-}
-
-.bi-plus-square-fill-nav-menu {
- background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
-}
-
-.bi-list-nested-nav-menu {
- background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
-}
-
-.nav-item {
- font-size: 0.9rem;
- padding-bottom: 0.5rem;
-}
-
- .nav-item:first-of-type {
- padding-top: 1rem;
- }
-
- .nav-item:last-of-type {
- padding-bottom: 1rem;
- }
-
- .nav-item ::deep .nav-link {
- color: #d7d7d7;
- background: none;
- border: none;
- border-radius: 4px;
- height: 3rem;
- display: flex;
- align-items: center;
- line-height: 3rem;
+ &:before {
+ content: "";
+ position: absolute;
width: 100%;
- }
-
-.nav-item ::deep a.active {
- background-color: rgba(255,255,255,0.37);
- color: white;
-}
-
-.nav-item ::deep .nav-link:hover {
- background-color: rgba(255,255,255,0.1);
- color: white;
-}
-
-.nav-scrollable {
- display: none;
-}
-
-.navbar-toggler:checked ~ .nav-scrollable {
- display: block;
-}
-
-@media (min-width: 641px) {
- .navbar-toggler {
- display: none;
- }
-
- .nav-scrollable {
- /* Never collapse the sidebar for wide screens */
- display: block;
-
- /* Allow sidebar to scroll for tall menus */
- height: calc(100vh - 3.5rem);
- overflow-y: auto;
+ height: 2px;
+ bottom: 0;
+ left: 0;
+ background-color: var(--text);
+ visibility: hidden;
+ transform: scaleX(0);
+ transform-origin: left;
+ transition: all 0.3s ease-in-out;
}
}
+
+.links ::deep a.active::before {
+ visibility: visible;
+ transform: scaleX(1);
+}
+
+.links ::deep a:hover::before {
+ visibility: visible;
+ transform: scaleX(1);
+}
diff --git a/src/Portfolio.Web/Components/Pages/Counter.razor b/src/Portfolio.Web/Components/Pages/Counter.razor
deleted file mode 100644
index 15c11c3..0000000
--- a/src/Portfolio.Web/Components/Pages/Counter.razor
+++ /dev/null
@@ -1,19 +0,0 @@
-@page "/counter"
-@rendermode InteractiveServer
-
-Counter
-
-Home
+Portfolio von Leon Hoppe
Weather
-
-
-
-
-}
-
-@code {
- private WeatherForecast[]? forecasts;
-
- protected override async Task OnInitializedAsync() {
- // Simulate asynchronous loading to demonstrate streaming rendering
- await Task.Delay(500);
-
- var startDate = DateOnly.FromDateTime(DateTime.Now);
- var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" };
- forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast {
- Date = startDate.AddDays(index),
- TemperatureC = Random.Shared.Next(-20, 55),
- Summary = summaries[Random.Shared.Next(summaries.Length)]
- }).ToArray();
- }
-
- private class WeatherForecast {
- public DateOnly Date { get; set; }
- public int TemperatureC { get; set; }
- public string? Summary { get; set; }
- public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
- }
-
-}
\ No newline at end of file
diff --git a/src/Portfolio.Web/Components/Routes.razor b/src/Portfolio.Web/Components/Routes.razor
index ae94e9e..090a0f6 100644
--- a/src/Portfolio.Web/Components/Routes.razor
+++ b/src/Portfolio.Web/Components/Routes.razor
@@ -1,6 +1,5 @@
\ No newline at end of file
diff --git a/src/Portfolio.Web/wwwroot/app.css b/src/Portfolio.Web/wwwroot/app.css
index e69de29..e9aa8a2 100644
--- a/src/Portfolio.Web/wwwroot/app.css
+++ b/src/Portfolio.Web/wwwroot/app.css
@@ -0,0 +1,32 @@
+:root {
+ --primary: #8e5bd2;
+ --secondary: #11a8bd;
+
+ --gradient: linear-gradient(90deg, var(--primary), var(--secondary));
+ --gradient-angled: linear-gradient(135deg, var(--primary), var(--secondary));
+ --gradient-straight: linear-gradient(var(--primary), var(--secondary));
+
+ --padding: 12.5vw;
+ --padding-small: 5vw;
+ --mobile-width: 750px;
+
+ --desc-color: #7c8393;
+ --border-color: #2d2d2d;
+
+ --text: #ffffff;
+ --background: #0f1724;
+}
+
+* {
+ box-sizing: border-box;
+ color: var(--text);
+ font-family: "Ubuntu", serif;
+ font-weight: 400;
+ font-style: normal;
+}
+
+html, body {
+ margin: 0;
+ padding: 0;
+ height: 100%;
+}
diff --git a/src/Portfolio.Web/wwwroot/favicon.ico b/src/Portfolio.Web/wwwroot/favicon.ico
new file mode 100644
index 0000000..0073cd5
Binary files /dev/null and b/src/Portfolio.Web/wwwroot/favicon.ico differ
diff --git a/src/Portfolio.Web/wwwroot/favicon.png b/src/Portfolio.Web/wwwroot/favicon.png
deleted file mode 100644
index a1dc44a..0000000
--- a/src/Portfolio.Web/wwwroot/favicon.png
+++ /dev/null
@@ -1,3 +0,0 @@
-version https://git-lfs.github.com/spec/v1
-oid sha256:e265ac0f2dda1e5dfa65b1adf330722bb3ef7789115283604d8cd19f098f1f08
-size 1148
diff --git a/src/Portfolio.Web/wwwroot/socials/gitlab.png b/src/Portfolio.Web/wwwroot/socials/gitlab.png
new file mode 100644
index 0000000..a294eb8
--- /dev/null
+++ b/src/Portfolio.Web/wwwroot/socials/gitlab.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:72a2cad5025aa931d6ea56c3201d1f18e68a8cd39788c7c80d5b2b82aa5143ef
+size 591
diff --git a/src/Portfolio.Web/wwwroot/socials/instagram.png b/src/Portfolio.Web/wwwroot/socials/instagram.png
new file mode 100644
index 0000000..473e499
--- /dev/null
+++ b/src/Portfolio.Web/wwwroot/socials/instagram.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:fdc2ac0085453fedb24be138132b4858add40ec998259ae94fafb9decd459e69
+size 1772
diff --git a/src/Portfolio.Web/wwwroot/socials/mail.png b/src/Portfolio.Web/wwwroot/socials/mail.png
new file mode 100644
index 0000000..f0cb6ba
--- /dev/null
+++ b/src/Portfolio.Web/wwwroot/socials/mail.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:407b558182f98f948d045cd6b4ea62bec3b8a8322cada63b2b07a7ea12393ffe
+size 1459
+ 
+ 
+ Counter
- -Current count: @currentCount
- - - -@code { - private int currentCount = 0; - - private void IncrementCount() { - currentCount++; - } - -} \ No newline at end of file diff --git a/src/Portfolio.Web/Components/Pages/Home.razor b/src/Portfolio.Web/Components/Pages/Home.razor index dfcdf75..8902f34 100644 --- a/src/Portfolio.Web/Components/Pages/Home.razor +++ b/src/Portfolio.Web/Components/Pages/Home.razor @@ -1,6 +1,6 @@ @page "/" -Hello, world!
diff --git a/src/Portfolio.Web/Components/Pages/Weather.razor b/src/Portfolio.Web/Components/Pages/Weather.razor deleted file mode 100644 index f8204c6..0000000 --- a/src/Portfolio.Web/Components/Pages/Weather.razor +++ /dev/null @@ -1,61 +0,0 @@ -@page "/weather" -@attribute [StreamRendering] - -Weather
- -This component demonstrates showing data.
- -@if (forecasts == null) { -- Loading... -
-} -else { -| Date | -Temp. (C) | -Temp. (F) | -Summary | -
|---|---|---|---|
| @forecast.Date.ToShortDateString() | -@forecast.TemperatureC | -@forecast.TemperatureF | -@forecast.Summary | -