Develop essential user profile template

2025-12-15 02:13:03 -06:00 · 2022-03-27 01:29:18 -05:00
parent 99a6bcec87
commit 3f7403ef80
4 changed files with 133 additions and 1 deletions
--- a/static/styles.scss
+++ b/static/styles.scss
@@ -140,3 +140,60 @@ form {
    margin: 0 auto;
  }
 }
+
+  .profile-title {
+    display: block;
+    border-bottom: 1px solid grey;
+    width: 100%;
+
+    .profile-username {
+      font-size: 1.5em;
+      font-weight: bold;
+    }
+
+    .profile-timestamp {
+      padding-left: 1em;
+      font-size: 0.9em;
+
+      &.offline {
+        color: dimgrey;
+      }
+
+      &.online {
+        color: #0C8C00;
+        font-weight: 600;
+      }
+    }
+  }
+
+  .profile-left {
+    padding: 0.8em;
+    width: fit-content;
+    border-right: 1px solid grey;
+
+    .profile-details {
+      font-size: 0.7em;
+      text-align: center;
+    }
+
+    .profile-picture {
+      margin: 0.8em;
+      max-width: 10em;
+      max-height: 10em;
+      filter: drop-shadow(5px 7px 6px rgb(0 0 0 / 0.1));;
+    }
+  }
+
+  .profile-bio, .profile-left {
+    display: inline-block;
+  }
+
+.profile-lower {
+  display: flex;
+  white-space: nowrap;
+
+  .profile-bio {
+    margin: 0.5em 1em;
+    white-space: normal;
+  }
+}