avatars.html

<!-- `Screenshot: https://imgur.com/Lc9SDaT -->
<template id="ly_avatar">
    <div
        :style="{
            'background-image': `url(http://avatars.kiwiirc.com/robohash/${message.nick})`,
            'background-size': 'contain',
        }"
        :data-nick="message.nick"
        class="kiwi-messagelist-avatar"
    ></div>
</template>

<style>
.kiwi-messagelist-avatar {
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-top: 3px;
}
</style>

<script>
kiwi.plugin('avatars', function(kiwi, log) {
  // The new avatar component
  var avatar = {
    template: '#ly_avatar',
    props: ['message'],
  };

  kiwi.replaceModule('components/MessageListAvatar', avatar);
});
</script>