forked from Mirrors/keyoxide-web
Redesign profile, include avatar
This commit is contained in:
parent
c76fad6ecf
commit
b2af1b38b1
5 changed files with 24 additions and 1 deletions
BIN
assets/img/avatar_placeholder.png
Normal file
BIN
assets/img/avatar_placeholder.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.7 KiB |
|
@ -194,6 +194,8 @@ async function displayProfile(opts) {
|
|||
let userData = keyData.user.user.userId;
|
||||
|
||||
document.body.querySelector('#profileName').innerHTML = userData.name;
|
||||
document.body.querySelector('#profileAvatar').style = "";
|
||||
document.body.querySelector('#profileAvatar').src = `https://www.gravatar.com/avatar/${SparkMD5.hash(userData.email)}?s=128&d=mm`;
|
||||
document.title = `${userData.name} - Keyoxide`;
|
||||
|
||||
for (var i = 0; i < keyData.notations.length; i++) {
|
||||
|
|
1
assets/spark-md5.min.js
vendored
Normal file
1
assets/spark-md5.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
|
@ -118,6 +118,21 @@ input[type="submit"] {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
#profileHeader {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
#profileAvatar {
|
||||
border-radius: 100%;
|
||||
margin-right: 32px;
|
||||
}
|
||||
#profileName {
|
||||
font-size: 1.6em;
|
||||
font-weight: bold;
|
||||
}
|
||||
.profileDataItem {
|
||||
position: relative;
|
||||
display: flex;
|
||||
|
|
|
@ -9,10 +9,14 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="container container--profile">
|
||||
<h1 id="profileName"></h1>
|
||||
<!-- <h1 id="profileName"></h1> -->
|
||||
<div class="content">
|
||||
<span id="profileUid" style="display: none;">%UID%</span>
|
||||
<span id="profileMode" style="display: none;">%MODE%</span>
|
||||
<div id="profileHeader">
|
||||
<img id="profileAvatar" src="/assets/img/avatar_placeholder.png" alt="avatar" style="display: none">
|
||||
<p id="profileName"></p>
|
||||
</div>
|
||||
<div id="profileData"><p>Loading keys & verifying proofs…</p></div>
|
||||
</div>
|
||||
|
||||
|
@ -24,5 +28,6 @@
|
|||
</div>
|
||||
</body>
|
||||
<script src="/assets/openpgp.min.js"></script>
|
||||
<script src="/assets/spark-md5.min.js"></script>
|
||||
<script type="text/javascript" src="/assets/scripts.js" charset="utf-8"></script>
|
||||
</html>
|
||||
|
|
Loading…
Reference in a new issue