From ce4e15eeed0720f992ae039fb0d4d8e17b8ae5b5 Mon Sep 17 00:00:00 2001 From: Cadence Ember Date: Tue, 20 Oct 2020 13:37:23 +1300 Subject: [PATCH] Larger user avatars, fix avatar background --- build/index.html | 2 +- build/static/Timeline.js | 4 ++-- build/static/main.css | 6 ++++-- src/js/Timeline.js | 4 ++-- src/sass/components/messages.sass | 6 ++++-- 5 files changed, 13 insertions(+), 9 deletions(-) diff --git a/build/index.html b/build/index.html index 1304e78..fa53161 100644 --- a/build/index.html +++ b/build/index.html @@ -2,7 +2,7 @@ - + diff --git a/build/static/Timeline.js b/build/static/Timeline.js index 0adce82..035c37b 100644 --- a/build/static/Timeline.js +++ b/build/static/Timeline.js @@ -81,11 +81,11 @@ class Sender { this.avatar.clearChildren() if (this.sender.value().content.avatar_url) { this.avatar.child( - ejs("img").class("c-message-group__icon").attribute("src", resolveMxc(this.sender.value().content.avatar_url, 32, "crop")) + ejs("img").class("c-message-group__icon").attribute("src", resolveMxc(this.sender.value().content.avatar_url, 96, "crop")) ) } else { this.avatar.child( - ejs("div").class("c-message-group__icon") + ejs("div").class("c-message-group__icon", "c-message-group__icon--no-icon") ) } } diff --git a/build/static/main.css b/build/static/main.css index a813b7e..e78cd1a 100644 --- a/build/static/main.css +++ b/build/static/main.css @@ -155,9 +155,11 @@ body { cursor: pointer; } .c-message-group__icon { - width: 32px; - height: 32px; + width: 40px; + height: 40px; border-radius: 50%; +} +.c-message-group__icon--no-icon { background-color: #48d; } .c-message-group__intro { diff --git a/src/js/Timeline.js b/src/js/Timeline.js index 0adce82..035c37b 100644 --- a/src/js/Timeline.js +++ b/src/js/Timeline.js @@ -81,11 +81,11 @@ class Sender { this.avatar.clearChildren() if (this.sender.value().content.avatar_url) { this.avatar.child( - ejs("img").class("c-message-group__icon").attribute("src", resolveMxc(this.sender.value().content.avatar_url, 32, "crop")) + ejs("img").class("c-message-group__icon").attribute("src", resolveMxc(this.sender.value().content.avatar_url, 96, "crop")) ) } else { this.avatar.child( - ejs("div").class("c-message-group__icon") + ejs("div").class("c-message-group__icon", "c-message-group__icon--no-icon") ) } } diff --git a/src/sass/components/messages.sass b/src/sass/components/messages.sass index 6284254..3b49265 100644 --- a/src/sass/components/messages.sass +++ b/src/sass/components/messages.sass @@ -17,11 +17,13 @@ cursor: pointer &__icon - $size: 32px + $size: 40px width: $size height: $size border-radius: 50% - background-color: #48d + + &--no-icon + background-color: #48d &__intro display: flex