xevion/runnerspace
1
0
Fork 0
mirror of https://github.com/Xevion/runnerspace.git synced 2025-12-10 16:08:30 -06:00
Code Issues Packages Projects Releases Wiki Activity

Develop essential user profile template

Browse Source
This commit is contained in:
Xevion
2022-03-27 01:29:18 -05:00
parent 99a6bcec87
commit 3f7403ef80
4 changed files with 133 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
static/styles.css
View File

@@ -123,4 +123,54 @@ form button {
margin: 0 auto; margin: 0 auto;
} }
.profile-title {
display: block;
border-bottom: 1px solid grey;
width: 100%;
}
.profile-title .profile-username {
font-size: 1.5em;
font-weight: bold;
}
.profile-title .profile-timestamp {
padding-left: 1em;
font-size: 0.9em;
}
.profile-title .profile-timestamp.offline {
color: dimgrey;
}
.profile-title .profile-timestamp.online {
color: #0C8C00;
font-weight: 600;
}
.profile-left {
padding: 0.8em;
width: fit-content;
border-right: 1px solid grey;
}
.profile-left .profile-details {
font-size: 0.7em;
text-align: center;
}
.profile-left .profile-picture {
margin: 0.8em;
max-width: 10em;
max-height: 10em;
filter: drop-shadow(5px 7px 6px rgba(0, 0, 0, 0.1));
}
.profile-bio, .profile-left {
display: inline-block;
}
.profile-lower {
display: flex;
white-space: nowrap;
}
.profile-lower .profile-bio {
margin: 0.5em 1em;
white-space: normal;
}
/*# sourceMappingURL=styles.css.map */ /*# sourceMappingURL=styles.css.map */

2
static/styles.css.map
View File

@@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["styles.scss"],"names":[],"mappings":"AAAA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EAOE;;AALA;EAEE;;;AAON;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIA;EACE;EACA;;AAEA;EACE;;AAEA;EACE;;;AAMR;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAIA;EACE;EACA;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA","file":"styles.css"} {"version":3,"sourceRoot":"","sources":["styles.scss"],"names":[],"mappings":"AAAA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EAOE;;AALA;EAEE;;;AAON;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIA;EACE;EACA;;AAEA;EACE;;AAEA;EACE;;;AAMR;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAIA;EACE;EACA;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;;AAIF;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;;AAIJ;EACE;;;AAGJ;EACE;EACA;;AAEA;EACE;EACA","file":"styles.css"}

57
static/styles.scss
View File

@@ -140,3 +140,60 @@ form {
margin: 0 auto; 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;
}
}

25
templates/pages/user.html
View File

@@ -1 +1,26 @@
{% extends 'layouts/index.html' %} {% extends 'layouts/index.html' %}
{% block content %}
<div class="content-inner">
<div class="profile-title">
<span class="profile-username">{{ user.username }}</span>
<span class="profile-timestamp online">Online Now!</span>
</div>
<div class="profile-lower">
<div class="profile-left">
<img class="profile-picture" src="{{ url_for('static', filename='default_photo.png') }}" alt="{{ user.username }}'s Profile Picture">
<div class="profile-details">
Registered 33 days ago<br>
67 likes<br>
14 posts<br>
</div>
</div>
<div class="profile-bio">
<p>
This user hasn't written a bio yet.
</p>
</div>
</div>
</div>
{% endblock %}