kopia lustrzana https://github.com/nolanlawson/pinafore
43 wiersze
1.1 KiB
HTML
43 wiersze
1.1 KiB
HTML
|
{{#if notification.type === 'mention' || notification.type === 'reblog' || notification.type === 'favourite'}}
|
||
|
<Status :index :length :timelineType :timelineValue
|
||
|
status="{{notification.status}}"
|
||
|
:notification
|
||
|
on:recalculateHeight
|
||
|
/>
|
||
|
{{else}}
|
||
|
<article class="notification-article"
|
||
|
tabindex="0"
|
||
|
aria-posinset="{{index}}" aria-setsize="{{length}}"
|
||
|
>
|
||
|
<div class="follow-notification-offset">
|
||
|
<StatusHeader :status :notification />
|
||
|
</div>
|
||
|
</article>
|
||
|
{{/if}}
|
||
|
<style>
|
||
|
.notification-article {
|
||
|
width: 560px;
|
||
|
max-width: calc(100vw - 40px);
|
||
|
padding: 10px 20px;
|
||
|
border-bottom: 1px solid var(--main-border);
|
||
|
}
|
||
|
.follow-notification-offset {
|
||
|
margin-left: 58px; /* offset for avatar, 48px + 10px */
|
||
|
}
|
||
|
@media (max-width: 767px) {
|
||
|
.notification-article {
|
||
|
padding: 10px 10px;
|
||
|
max-width: calc(100vw - 20px);
|
||
|
}
|
||
|
}
|
||
|
</style>
|
||
|
<script>
|
||
|
import Status from './Status.html'
|
||
|
import StatusHeader from './StatusHeader.html'
|
||
|
export default {
|
||
|
components: {
|
||
|
Status,
|
||
|
StatusHeader
|
||
|
}
|
||
|
}
|
||
|
</script>
|