forked from mirror/pixelfed
200 lines
7.9 KiB
PHP
200 lines
7.9 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('content')
|
|
|
|
<div class="container reply-container">
|
|
<div class="col-12 col-md-8 offset-md-2 mt-4">
|
|
<div class="card shadow-none border">
|
|
@php($gp = $status->parent()->parent())
|
|
@if($gp)
|
|
<div class="card-body p-0 m-0 bg-light border-bottom">
|
|
@if($gp->scope == 'archived')
|
|
<p class="text-center mb-0 py-5 font-weight-bold">This status cannot be viewed at this time.</p>
|
|
@else
|
|
<div class="d-flex p-0 m-0 align-items-center">
|
|
@if($gp->media()->count())
|
|
<img src="{{$gp->thumb()}}" width="150px" height="150px" class="post-thumbnail" onerror="this.onerror=null;this.src='/storage/no-preview.png?v=0';">
|
|
@endif
|
|
<div class="p-4 w-100">
|
|
<div class="">
|
|
<div class="media">
|
|
<img src="{{$gp->profile->avatarUrl()}}" class="rounded-circle img-thumbnail mb-1 mr-3" width="30px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=0';">
|
|
<div class="media-body">
|
|
<span class="font-weight-bold" v-pre>{{$gp->profile->username}}</span>
|
|
<div class="">
|
|
<p class="w-100 text-break" v-pre>{!!$gp->rendered!!}</p>
|
|
</div>
|
|
<div class="mb-0 small">
|
|
<a href="{{$gp->url()}}" class="text-muted">
|
|
{{$gp->created_at->diffForHumans()}}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<a class="float-right" href="{{$gp->url()}}"><i class="far fa-share-square"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
@endif
|
|
|
|
@php($parent = $status->parent())
|
|
<div class="card-body p-0 m-0 bg-light border-bottom">
|
|
|
|
@if($parent->scope == 'archived')
|
|
<p class="text-center mb-0 py-5 font-weight-bold">This status cannot be viewed at this time.</p>
|
|
@else
|
|
<div class="d-flex p-0 m-0 align-items-center">
|
|
@if($parent->media()->count())
|
|
<img src="{{$parent->thumb()}}" width="150px" height="150px" class="post-thumbnail" onerror="this.onerror=null;this.src='/storage/no-preview.png?v=0';">
|
|
@endif
|
|
<div class="p-4 w-100">
|
|
<div class="">
|
|
<div class="media">
|
|
<img src="{{$parent->profile->avatarUrl()}}" class="rounded-circle img-thumbnail mb-1 mr-3" width="30px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=0';">
|
|
<div class="media-body">
|
|
<span class="font-weight-bold" v-pre>{{$parent->profile->username}}</span>
|
|
<div class="">
|
|
<p class="w-100 text-break" v-pre>{!!$parent->rendered!!}</p>
|
|
</div>
|
|
<div class="mb-0 small">
|
|
<a href="{{$parent->url()}}" class="text-muted">
|
|
{{$parent->created_at->diffForHumans()}}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<a class="float-right" href="{{$parent->url()}}"><i class="far fa-share-square"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
|
|
<div class="card-body border-bottom">
|
|
@if($status->is_nsfw)
|
|
<details class="cw">
|
|
<summary class="px-3 px-md-5">
|
|
<p class="py-5 mb-0 text-center">This comment may contain sensitive content. <span class="float-right font-weight-bold text-primary">Show</span></p>
|
|
</summary>
|
|
<div class="media py-5">
|
|
<img class="mr-3 rounded-circle img-thumbnail" src="{{$status->profile->avatarUrl()}}" width="60px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=0';">
|
|
<div class="media-body">
|
|
<h5 class="mt-0 font-weight-bold" v-pre>{{$status->profile->username}}</h5>
|
|
<p class="" v-pre>{!! $status->rendered !!}</p>
|
|
<div class="mb-0 small">
|
|
<a href="{{$status->url()}}" class="text-muted">
|
|
{{$status->created_at->diffForHumans()}}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</details>
|
|
@else
|
|
<div class="media py-5">
|
|
<img class="mr-3 rounded-circle img-thumbnail" src="{{$status->profile->avatarUrl()}}" width="60px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=0';">
|
|
<div class="media-body">
|
|
<h5 class="mt-0 font-weight-bold" v-pre>{{$status->profile->username}}</h5>
|
|
<p class="" v-pre>{!! $status->rendered !!}</p>
|
|
<div class="mb-0 small">
|
|
<a href="{{$status->url()}}" class="text-muted">
|
|
{{$status->created_at->diffForHumans()}}
|
|
</a>
|
|
@if(Auth::check() && $status->profile_id == Auth::user()->profile->id)
|
|
<form class="float-right" method="POST" action="/i/delete">
|
|
@csrf
|
|
<input type="hidden" name="item" value="{{$status->id}}">
|
|
<input type="hidden" name="type" value="status">
|
|
<button class="btn btn-outline-danger small font-weight-bold btn-sm py-1">Delete</button>
|
|
</form>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
@if($status->comments->count())
|
|
<div class="card-body p-0 m-0 bg-light border-bottom">
|
|
<div class="d-flex p-0 m-0 align-items-center">
|
|
@if($status->comments()->first()->media()->count())
|
|
<img src="{{$status->comments()->first()->thumb()}}" width="150px" height="150px" class="post-thumbnail" onerror="this.onerror=null;this.src='/storage/no-preview.png?v=0';">
|
|
@endif
|
|
<div class="p-4 w-100">
|
|
<div class="">
|
|
<div class="media">
|
|
<img src="{{$status->comments()->first()->profile->avatarUrl()}}" class="rounded-circle img-thumbnail mb-1 mr-3" width="30px" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=0';">
|
|
<div class="media-body">
|
|
<span class="font-weight-bold" v-pre>{{$status->comments()->first()->profile->username}}</span>
|
|
<div class="">
|
|
<p class="w-100 text-break" v-pre>{!!$status->comments()->first()->rendered!!}</p>
|
|
</div>
|
|
<div class="mb-0 small">
|
|
<a href="{{$status->comments()->first()->url()}}" class="text-muted">
|
|
{{$status->comments()->first()->created_at->diffForHumans()}}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<a class="float-right" href="{{$status->comments()->first()->url()}}"><i class="far fa-share-square"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@endsection
|
|
|
|
@push('styles')
|
|
<style type="text/css">
|
|
@keyframes fadeInDown {
|
|
0% {
|
|
opacity: 0;
|
|
transform: translateY(-1.25em);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
.cw[open] {
|
|
animation-name: fadeInDown;
|
|
animation-duration: 0.5s;
|
|
}
|
|
|
|
.cw>summary {
|
|
display: flex;
|
|
flex-flow: column;
|
|
justify-content: center;
|
|
border: 0;
|
|
background-color: #fff;
|
|
padding-top: 50px;
|
|
padding-bottom: 50px;
|
|
text-align: center;
|
|
}
|
|
|
|
.cw[open] > summary {
|
|
display: none!important;
|
|
}
|
|
</style>
|
|
@endpush
|
|
|
|
@push('scripts')
|
|
<script type="text/javascript">
|
|
$(document).ready(function() {
|
|
$('.reactions').hide();
|
|
$('.more-comments').hide();
|
|
$('.card-footer').hide();
|
|
new Vue({
|
|
el: '#content'
|
|
});
|
|
});
|
|
</script>
|
|
@endpush
|