pinafore/routes/_components/status/StatusSidebar.html

43 lines
815 B
HTML
Raw Normal View History

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