Made pages mobile compatible

2025-01-26 14:11:23 +01:00
parent 1a1d49b83f
commit 475c3458df
7 changed files with 46 additions and 6 deletions
--- a/src/Portfolio.Web/Components/Pages/Home.razor.css
+++ b/src/Portfolio.Web/Components/Pages/Home.razor.css
@@ -53,7 +53,6 @@
 }

 .title {
-    font-size: 35px;
    display: inline;
    margin-right: 10px;
 }
@@ -126,3 +125,23 @@ a:not(#main-action):hover::before {
        opacity: 1;
    }
 }
+
+@media screen and (max-width: 750px) {
+    #hero > h2 {
+        font-size: 2rem;
+        line-height: 2.5rem;
+        margin-top: 10vh;
+    }
+
+    .timeline {
+        flex-direction: column-reverse;
+    }
+
+    .timeline ::deep .timestamp:last-of-type {
+        --show-bar: block;
+    }
+
+    .timeline ::deep .timestamp:first-of-type {
+        --show-bar: none;
+    }
+}