aboutsummaryrefslogtreecommitdiff
path: root/src/components/avatar_list/avatar_list.vue
diff options
context:
space:
mode:
authorHenry Jameson <me@hjkos.com>2019-06-16 20:24:03 +0300
committerHenry Jameson <me@hjkos.com>2019-06-16 20:24:03 +0300
commitb00da1778830853e0bed4cb1d0fa93ca09a82167 (patch)
tree8072f743384b45dc2b4a62e619bb0b1db3e3ebf9 /src/components/avatar_list/avatar_list.vue
parent6c7cf7d9b5f2faec03fe75881b5ec81e0ac851fd (diff)
parent1db3c785d805bfe1e7bb09f2d85875448cb03f9a (diff)
Merge remote-tracking branch 'upstream/develop' into docs
* upstream/develop: (374 commits) fix typo rename mutations according to actual property names fix fix fix logged out post-update fix user banner fix AMERICA comments No longer sending extra data, renamed some properties Revert "add TOTP/Recovery Form for mobile version" Apply suggestion to src/services/entity_normalizer/entity_normalizer.service.js i18n/Update Japanese translation render modal at the root level using portal install portal vue Small improve of the who to follow panel layout Fix/Small fix in the who to follow page remove console spam i18n wire up user.description with masto api data ...
Diffstat (limited to 'src/components/avatar_list/avatar_list.vue')
-rw-r--r--src/components/avatar_list/avatar_list.vue38
1 files changed, 38 insertions, 0 deletions
diff --git a/src/components/avatar_list/avatar_list.vue b/src/components/avatar_list/avatar_list.vue
new file mode 100644
index 00000000..c0238570
--- /dev/null
+++ b/src/components/avatar_list/avatar_list.vue
@@ -0,0 +1,38 @@
+<template>
+ <div class="avatars">
+ <router-link :to="userProfileLink(user)" class="avatars-item" v-for="user in slicedUsers">
+ <UserAvatar :user="user" class="avatar-small" />
+ </router-link>
+ </div>
+</template>
+
+<script src="./avatar_list.js" ></script>
+
+<style lang="scss">
+@import '../../_variables.scss';
+
+.avatars {
+ display: flex;
+ margin: 0;
+ padding: 0;
+
+ // For hiding overflowing elements
+ flex-wrap: wrap;
+ height: 24px;
+
+ .avatars-item {
+ margin: 0 0 5px 5px;
+
+ &:first-child {
+ padding-left: 5px;
+ }
+
+ .avatar-small {
+ border-radius: $fallback--avatarAltRadius;
+ border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius);
+ height: 24px;
+ width: 24px;
+ }
+ }
+}
+</style>