pinafore/routes/_components/status/StatusSidebar.html

43 lines
814 B
HTML
Raw Normal View History

<a class="status-sidebar size-{size}"
href="/accounts/{originalAccountId}"
focus-key={focusKey}
2018-03-22 07:22:18 +00:00
aria-hidden="true"
>
<Avatar account={originalAccount}
isLink="true"
{size} />
</a>
2018-02-04 18:50:39 +00:00
<style>
.status-sidebar {
2018-02-10 04:07:48 +00:00
grid-area: sidebar;
2018-02-22 17:30:37 +00:00
margin-right: 15px;
}
.status-sidebar.size-small {
width: 48px;
height: 48px;
}
.status-sidebar.size-medium {
width: 64px;
height: 64px;
}
2018-02-22 17:30:37 +00:00
@media (max-width: 767px) {
.status-sidebar {
2018-02-22 17:30:37 +00:00
margin-right: 5px;
}
2018-02-04 18:50:39 +00:00
}
</style>
<script>
2018-02-09 01:56:20 +00:00
import Avatar from '../Avatar.html'
2018-02-04 18:50:39 +00:00
export default {
components: {
Avatar
},
computed: {
focusKey: ({ uuid }) => `status-author-avatar-${uuid}`,
size: ({ isStatusInOwnThread }) => isStatusInOwnThread ? 'medium' : 'small'
2018-02-04 18:50:39 +00:00
}
}
</script>