forked from cybrespace/pinafore
43 lines
814 B
HTML
43 lines
814 B
HTML
<a class="status-sidebar size-{size}"
|
|
href="/accounts/{originalAccountId}"
|
|
focus-key={focusKey}
|
|
aria-hidden="true"
|
|
>
|
|
<Avatar account={originalAccount}
|
|
isLink="true"
|
|
{size} />
|
|
</a>
|
|
<style>
|
|
.status-sidebar {
|
|
grid-area: sidebar;
|
|
margin-right: 15px;
|
|
}
|
|
|
|
.status-sidebar.size-small {
|
|
width: 48px;
|
|
height: 48px;
|
|
}
|
|
|
|
.status-sidebar.size-medium {
|
|
width: 64px;
|
|
height: 64px;
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.status-sidebar {
|
|
margin-right: 5px;
|
|
}
|
|
}
|
|
</style>
|
|
<script>
|
|
import Avatar from '../Avatar.html'
|
|
export default {
|
|
components: {
|
|
Avatar
|
|
},
|
|
computed: {
|
|
focusKey: ({ uuid }) => `status-author-avatar-${uuid}`,
|
|
size: ({ isStatusInOwnThread }) => isStatusInOwnThread ? 'medium' : 'small'
|
|
}
|
|
}
|
|
</script> |