1
0
Fork 0

Merge pull request #202 from dansup/frontend-ui-refactor

Frontend ui refactor
This commit is contained in:
daniel 2018-06-04 23:03:25 -06:00 committed by GitHub
commit 197742d0df
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
20 changed files with 314 additions and 253 deletions

View File

@ -94,7 +94,7 @@ class FederationController extends Controller
'outbound' => []
],
'software' => [
'name' => 'PixelFed',
'name' => 'pixelfed',
'version' => config('pixelfed.version')
],
'usage' => [

2
public/css/app.css vendored

File diff suppressed because one or more lines are too long

View File

@ -1,5 +1,5 @@
{
"/js/app.js": "/js/app.js?id=3a0df5c7faec6dfd614c",
"/css/app.css": "/css/app.css?id=a71d46cb03842e63b5d9",
"/css/app.css": "/css/app.css?id=6ebfef0060fc43dee177",
"/js/timeline.js": "/js/timeline.js?id=1ade82addcc153e4ff66"
}

View File

@ -71,9 +71,12 @@ body, button, input, textarea {
margin: auto !important;
}
.card.status-container .status-comments {
overflow-y: scroll;
border-bottom:1px solid rgba(0, 0, 0, 0.1);
@media (min-width: map-get($grid-breakpoints, "md")) {
.card.status-container .status-comments {
overflow-y:scroll;
border-bottom:1px solid rgba(0,0,0,.1);
height: 200px;
}
}
.no-caret.dropdown-toggle {
@ -163,6 +166,12 @@ body, button, input, textarea {
background-position: 50%;
}
@media (max-width: map-get($grid-breakpoints, "md")) {
.border-md-left-0 {
border-left:0!important
}
}
.fas, .far {
font-size: 25px !important;
}
@ -177,4 +186,19 @@ body, button, input, textarea {
}
.fas.fa-heart {
}
}
@media (max-width: map-get($grid-breakpoints, "md")) {
.border-md-left-0 {
border-left:0!important
}
.card.status-container .status-comments {
border-top:1px solid rgba(0,0,0,.1);
}
.sticky-md-bottom {
position:-webkit-sticky;
position:sticky;
bottom:0;
z-index:1020
}
}

View File

@ -0,0 +1,19 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Authentication Language Lines
|--------------------------------------------------------------------------
|
| The following language lines are used during authentication for various
| messages that we need to display to the user. You are free to modify
| these language lines according to your application's requirements.
|
*/
'failed' => 'Nämä kirjautumistiedot eivät vastaa tallennettuja',
'throttle' => 'Liian monta kirjautumisyritystä. Yrityä uudelleen :seconds sekuntin kuluttua.',
];

View File

@ -0,0 +1,8 @@
<?php
return [
'likedPhoto' => 'tykkäsi kuvastasi.',
'startedFollowingYou' => 'alkoi seuraamaan sinua.',
];

View File

@ -0,0 +1,19 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Pagination Language Lines
|--------------------------------------------------------------------------
|
| The following language lines are used by the paginator library to build
| the simple pagination links. You are free to change them to anything
| you want to customize your views to better match your application.
|
*/
'previous' => '&laquo; Edellinen',
'next' => 'Seuraava &raquo;',
];

View File

@ -0,0 +1,22 @@
<?php
return [
/*
|--------------------------------------------------------------------------
| Password Reset Language Lines
|--------------------------------------------------------------------------
|
| The following language lines are the default lines which match reasons
| that are given by the password broker for a password update attempt
| has failed, such as for an invalid token or invalid new password.
|
*/
'password' => 'Salasanan täytyy olla vähintään kuusi merkkiä ja vastata vahvistusta.',
'reset' => 'Salasanasi on nollattu!',
'sent' => 'Olemme lähettäneet salasanan nollauslinkin sähköpostitse!',
'token' => 'Tämä salasanan nollauslinkki ei ole toimiva.',
'user' => "Emme löydä käyttäjää tuolla sähköpostiosoitteella.",
];

View File

@ -0,0 +1,9 @@
<?php
return [
'emptyTimeline' => 'Tällä käyttäjällä ei ole vielä päivityksiä!',
'emptyFollowers' => 'Tällä käyttäjällä ei ole vielä seuraajia!',
'emptyFollowing' => 'Tämä käyttäjä ei vielä seuraa ketään!',
'savedWarning' => 'Only you can see what you\'ve saved',
'savedWarning' => 'Vain sinä voit nähdä, mitä olet tallentanut',
];

View File

@ -0,0 +1,7 @@
<?php
return [
'emptyPersonalTimeline' => 'Aikajanasi on tyhjä.'
];

View File

@ -1,4 +1,5 @@
<?php
return [
'likedPhoto' => 'a aimé votre photo.',
'startedFollowingYou' => 'a commencé à vous suivre.',
];

View File

@ -1,4 +1,7 @@
<?php
return [
'emptyTimeline' => 'Cet utilisateur n\'a pas encore de messages !',
'emptyFollowers' => 'Cet utilisateur n`\'a pas encore d\'abonné-e-s!',
'emptyFollowing' => 'Cet utilisateur ne suit pas encore quelqu\'un!',
'savedWarning' => 'Vous seul pouvez voir ce que vous avez enregistré',
];

View File

@ -0,0 +1,4 @@
<?php
return [
'emptyPersonalTimeline' => 'Votre chronologie est vide.'
];

View File

@ -13,7 +13,7 @@ return [
|
*/
'failed' => 'Dessa autentiseringsuppgifter matchar inte de i vårt register.',
'failed' => 'Dessa autentiseringsuppgifter matchar inte vårt register.',
'throttle' => 'För många inloggningsförsök. Var god försök igen om :seconds sekunder.',
];

View File

@ -17,9 +17,9 @@ return [
'active_url' => ':attribute är inte en giltig URL.',
'after' => ':attribute måste vara ett datum efter :date.',
'after_or_equal' => ':attribute måste vara ett datum efter eller samma som :date.',
'alpha' => ':attribute får endast intehålla bokstäver.',
'alpha_dash' => ':attribute får endast intehålla bokstäver, nummer, och bindestreck.',
'alpha_num' => ':attribute får endast intehålla bokstäver och nummer.',
'alpha' => ':attribute får endast innehålla bokstäver.',
'alpha_dash' => ':attribute får endast innehålla bokstäver, nummer, och bindestreck.',
'alpha_num' => ':attribute får endast innehålla bokstäver och nummer.',
'array' => ':attribute måste vara en array.',
'before' => ':attribute måste vara ett datum före :date.',
'before_or_equal' => ':attribute måste vara ett datum före eller samma som :date.',
@ -51,10 +51,10 @@ return [
'ipv6' => ':attribute måste vara en giltig IPv6 adress.',
'json' => ':attribute måste vara en giltig JSON string.',
'max' => [
'numeric' => ':attribute får inte vara större than :max.',
'file' => ':attribute får inte vara större than :max kilobyte.',
'string' => ':attribute får inte vara större than :max tecken.',
'array' => ':attribute får inte ha mer än :max objekt.',
'numeric' => ':attribute får inte vara större än :max.',
'file' => ':attribute får inte vara större än :max kilobyte.',
'string' => ':attribute får inte vara större än :max tecken.',
'array' => ':attribute får inte ha fler än :max objekt.',
],
'mimes' => ':attribute måste vara en fil av typ: :values.',
'mimetypes' => ':attribute måste vara en fil av typ: :values.',
@ -62,7 +62,7 @@ return [
'numeric' => ':attribute måste vara åtminstone :min.',
'file' => ':attribute måste vara åtminstone :min kilobyte.',
'string' => ':attribute måste vara åtminstone :min tecken.',
'array' => ':attribute måste have åtminstone :min objekt.',
'array' => ':attribute måste innehålla åtminstone :min objekt.',
],
'not_in' => 'vald :attribute är ogiltig.',
'not_regex' => ':attribute formatet är ogiltigt.',
@ -74,7 +74,7 @@ return [
'required_unless' => ':attribute fält krävs om inte :other är i :values.',
'required_with' => ':attribute fält krävs när :values finns.',
'required_with_all' => ':attribute fält krävs när :values finns.',
'required_without' => ':attribute fält krvävs när :values inte finns.',
'required_without' => ':attribute fält krävs när :values inte finns.',
'required_without_all' => ':attribute fält krävs när inga av :values finns.',
'same' => ':attribute och :other måste matcha.',
'size' => [

View File

@ -2,46 +2,9 @@
@section('content')
@include('profile.partial.user-info')
<div class="container following-page" style="min-height: 60vh;">
<div class="profile-header row my-5">
<div class="col-12 col-md-4 d-flex">
<div class="profile-avatar mx-auto">
<img class="img-thumbnail" src="{{$profile->avatarUrl()}}" style="border-radius:100%;" width="172px">
</div>
</div>
<div class="col-12 col-md-8 d-flex align-items-center">
<div class="profile-details">
<div class="username-bar pb-2 d-flex align-items-center">
<span class="font-weight-ultralight h1">{{$profile->username}}</span>
</div>
<div class="profile-stats pb-3 d-inline-flex lead">
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$profile->url()}}">
<span class="font-weight-bold">{{$profile->statuses()->whereNull('in_reply_to_id')->count()}}</span>
Posts
</a>
</div>
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$profile->url('/followers')}}">
<span class="font-weight-bold">{{$profile->followerCount(true)}}</span>
Followers
</a>
</div>
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$profile->url('/following')}}">
<span class="font-weight-bold">{{$profile->followingCount(true)}}</span>
Following
</a>
</div>
</div>
<p class="lead font-weight-bold">
{{$profile->name}}
</p>
</div>
</div>
</div>
<div class="col-12 col-md-8 offset-md-2">
@if($followers->count() !== 0)
<ul class="list-group mt-4">

View File

@ -2,46 +2,9 @@
@section('content')
@include('profile.partial.user-info')
<div class="container following-page" style="min-height: 60vh;">
<div class="profile-header row my-5">
<div class="col-12 col-md-4 d-flex">
<div class="profile-avatar mx-auto">
<img class="img-thumbnail" src="{{$profile->avatarUrl()}}" style="border-radius:100%;" width="172px">
</div>
</div>
<div class="col-12 col-md-8 d-flex align-items-center">
<div class="profile-details">
<div class="username-bar pb-2 d-flex align-items-center">
<span class="font-weight-ultralight h1">{{$profile->username}}</span>
</div>
<div class="profile-stats pb-3 d-inline-flex lead">
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$profile->url()}}">
<span class="font-weight-bold">{{$profile->statuses()->whereNull('in_reply_to_id')->count()}}</span>
Posts
</a>
</div>
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$profile->url('/followers')}}">
<span class="font-weight-bold">{{$profile->followerCount(true)}}</span>
Followers
</a>
</div>
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$profile->url('/following')}}">
<span class="font-weight-bold">{{$profile->followingCount(true)}}</span>
Following
</a>
</div>
</div>
<p class="lead font-weight-bold">
{{$profile->name}}
</p>
</div>
</div>
</div>
<div class="col-12 col-md-8 offset-md-2">
@if($following->count() !== 0)
<ul class="list-group mt-4">

View File

@ -0,0 +1,79 @@
<div class="bg-white py-5">
<div class="container">
<div class="row">
<div class="col-12 col-md-4 d-flex">
<div class="profile-avatar mx-auto">
<img class="img-thumbnail" src="{{$user->avatarUrl()}}" style="border-radius:100%;" width="172px">
</div>
</div>
<div class="col-12 col-md-8 d-flex align-items-center">
<div class="profile-details">
<div class="username-bar pb-2 d-flex align-items-center">
<span class="font-weight-ultralight h1">{{$user->username}}</span>
@if($owner == true)
<span class="h5 pl-2 b-0">
<a class="icon-settings text-muted" href="{{route('settings')}}"></a>
</span>
@elseif ($following == true)
<span class="pl-4">
<form class="follow-form" method="post" action="/i/follow" style="display: inline;" data-id="{{$user->id}}" data-action="unfollow">
@csrf
<input type="hidden" name="item" value="{{$user->id}}">
<button class="btn btn-outline-secondary font-weight-bold px-4 py-0" type="submit">Unfollow</button>
</form>
</span>
@elseif ($following == false)
<span class="pl-4">
<form class="follow-form" method="post" action="/i/follow" style="display: inline;" data-id="{{$user->id}}" data-action="follow">
@csrf
<input type="hidden" name="item" value="{{$user->id}}">
<button class="btn btn-primary font-weight-bold px-4 py-0" type="submit">Follow</button>
</form>
</span>
@endif
{{-- TODO: Implement action dropdown
<span class="pl-4">
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle py-0" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="icon-options"></i>
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#">Report User</a>
<a class="dropdown-item" href="#">Block User</a>
</div>
</div>
</span>
--}}
</div>
<div class="profile-stats pb-3 d-inline-flex lead">
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$user->url()}}">
<span class="font-weight-bold">{{$user->statuses()->whereNull('in_reply_to_id')->count()}}</span>
Posts
</a>
</div>
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$user->url('/followers')}}">
<span class="font-weight-bold">{{$user->followerCount(true)}}</span>
Followers
</a>
</div>
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$user->url('/following')}}">
<span class="font-weight-bold">{{$user->followingCount(true)}}</span>
Following
</a>
</div>
</div>
<p class="lead">
<span class="font-weight-bold">{{$user->name}}</span>
@if($user->remote_url)
<span class="badge badge-info">REMOTE PROFILE</span>
@endif
{{$user->bio}}
</p>
</div>
</div>
</div>
</div>
</div>

View File

@ -2,134 +2,59 @@
@section('content')
@include('profile.partial.user-info')
@if($owner == true)
<div>
<ul class="nav nav-topbar d-flex justify-content-center">
<li class="nav-item">
<a class="nav-link {{request()->is('*/saved') ? '':'active'}} font-weight-bold text-uppercase" href="{{$user->url()}}">Posts</a>
</li>
<li class="nav-item">
<a class="nav-link {{request()->is('*/saved') ? 'active':''}} font-weight-bold text-uppercase" href="{{$user->url('/saved')}}">Saved</a>
</li>
</ul>
</div>
@endif
<div class="container">
<div class="profile-header row my-5">
<div class="col-12 col-md-4 d-flex">
<div class="profile-avatar mx-auto">
<img class="img-thumbnail" src="{{$user->avatarUrl()}}" style="border-radius:100%;" width="172px">
</div>
</div>
<div class="col-12 col-md-8 d-flex align-items-center">
<div class="profile-details">
<div class="username-bar pb-2 d-flex align-items-center">
<span class="font-weight-ultralight h1">{{$user->username}}</span>
@if($owner == true)
<span class="h5 pl-2 b-0">
<a class="icon-settings text-muted" href="{{route('settings')}}"></a>
</span>
@elseif ($following == true)
<span class="pl-4">
<form class="follow-form" method="post" action="/i/follow" style="display: inline;" data-id="{{$user->id}}" data-action="unfollow">
@csrf
<input type="hidden" name="item" value="{{$user->id}}">
<button class="btn btn-outline-secondary font-weight-bold px-4 py-0" type="submit">Unfollow</button>
</form>
</span>
@elseif ($following == false)
<span class="pl-4">
<form class="follow-form" method="post" action="/i/follow" style="display: inline;" data-id="{{$user->id}}" data-action="follow">
@csrf
<input type="hidden" name="item" value="{{$user->id}}">
<button class="btn btn-primary font-weight-bold px-4 py-0" type="submit">Follow</button>
</form>
</span>
@endif
{{-- TODO: Implement action dropdown
<span class="pl-4">
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle py-0" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="icon-options"></i>
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#">Report User</a>
<a class="dropdown-item" href="#">Block User</a>
</div>
</div>
</span>--}}
</div>
<div class="profile-stats pb-3 d-inline-flex lead">
<div class="font-weight-light pr-5">
<span class="font-weight-bold">{{$user->statuses()->whereNull('in_reply_to_id')->count()}}</span>
Posts
</div>
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$user->url('/followers')}}">
<span class="font-weight-bold">{{$user->followerCount(true)}}</span>
Followers
</a>
</div>
<div class="font-weight-light pr-5">
<a class="text-dark" href="{{$user->url('/following')}}">
<span class="font-weight-bold">{{$user->followingCount(true)}}</span>
Following
</a>
</div>
</div>
<p class="lead">
<span class="font-weight-bold">{{$user->name}}</span>
@if($user->remote_url)
<span class="badge badge-info">REMOTE PROFILE</span>
@endif
{{$user->bio}}
</p>
</div>
</div>
</div>
<div class="profile-timeline mt-5 row">
@if($owner == true)
<div class="col-12 mb-5">
<ul class="nav nav-topbar d-flex justify-content-center">
<li class="nav-item">
<a class="nav-link {{request()->is('*/saved') ? '':'active'}} font-weight-bold text-uppercase" href="{{$user->url()}}">Posts</a>
</li>
<li class="nav-item">
<a class="nav-link {{request()->is('*/saved') ? 'active':''}} font-weight-bold text-uppercase" href="{{$user->url('/saved')}}">Saved</a>
</li>
</ul>
</div>
@endif
@if($owner && request()->is('*/saved'))
<div class="col-12">
<p class="text-muted font-weight-bold small">{{__('profile.savedWarning')}}</p>
</div>
@endif
@if($timeline->count() > 0)
@foreach($timeline as $status)
<div class="col-12 col-md-4 mb-4">
<a class="card info-overlay" href="{{$status->url()}}">
<div class="square">
<div class="square-content" style="background-image: url('{{$status->thumb()}}')"></div>
<div class="info-overlay-text">
<h5 class="text-white m-auto font-weight-bold">
<span class="pr-4">
<span class="icon-heart pr-1"></span> {{$status->likes_count}}
</span>
<span>
<span class="icon-speech pr-1"></span> {{$status->comments_count}}
</span>
</h5>
</div>
@foreach($timeline as $status)
<div class="col-12 col-md-4 mb-4">
<a class="card info-overlay" href="{{$status->url()}}">
<div class="square">
<div class="square-content" style="background-image: url('{{$status->thumb()}}')"></div>
<div class="info-overlay-text">
<h5 class="text-white m-auto font-weight-bold">
<span class="pr-4">
<span class="icon-heart pr-1"></span> {{$status->likes_count}}
</span>
<span>
<span class="icon-speech pr-1"></span> {{$status->comments_count}}
</span>
</h5>
</div>
</a>
</div>
@endforeach
</div>
</a>
</div>
@endforeach
@else
<div class="col-12">
<div class="card">
<div class="card-body py-5 my-5">
<div class="d-flex my-5 py-5 justify-content-center align-items-center">
<p class="lead font-weight-bold">{{ __('profile.emptyTimeline') }}</p>
</div>
<div class="col-12">
<div class="card">
<div class="card-body py-5 my-5">
<div class="d-flex my-5 py-5 justify-content-center align-items-center">
<p class="lead font-weight-bold">{{ __('profile.emptyTimeline') }}</p>
</div>
</div>
</div>
</div>
@endif
</div>
</div>
@endsection

View File

@ -5,11 +5,24 @@
<div class="container px-0 mt-md-4">
<div class="card status-container orientation-{{$status->firstMedia()->orientation ?? 'unknown'}}">
<div class="row mx-0">
<div class="d-flex d-md-none align-items-center justify-content-between card-header w-100">
<div class="d-flex align-items-center status-username">
<div class="status-avatar mr-2">
<img class="img-thumbnail" src="{{$user->avatarUrl()}}" width="24px" height="24px" style="border-radius:12px;">
</div>
<div class="username">
<a href="{{$user->url()}}" class="username-link font-weight-bold text-dark">{{$user->username}}</a>
</div>
</div>
<div class="timestamp mb-0">
<p class="small text-uppercase mb-0"><a href="{{$status->url()}}" class="text-muted">{{$status->created_at->diffForHumans(null, true, true, true)}}</a></p>
</div>
</div>
<div class="col-12 col-md-8 status-photo px-0">
<img src="{{$status->mediaUrl()}}" width="100%">
</div>
<div class="col-12 col-md-4 px-0 d-flex flex-column">
<div class="d-flex align-items-center justify-content-between card-header">
<div class="col-12 col-md-4 px-0 d-flex flex-column border-left border-md-left-0">
<div class="d-md-flex d-none align-items-center justify-content-between card-header">
<div class="d-flex align-items-center status-username">
<div class="status-avatar mr-2">
<img class="img-thumbnail" src="{{$user->avatarUrl()}}" width="24px" height="24px" style="border-radius:12px;">
@ -22,59 +35,61 @@
<p class="small text-uppercase mb-0"><a href="{{$status->url()}}" class="text-muted">{{$status->created_at->diffForHumans(null, true, true, true)}}</a></p>
</div>
</div>
<div class="card-body status-comments">
<div class="status-comment">
<p class="mb-1">
<span class="font-weight-bold pr-1">{{$status->profile->username}}</span>
<span class="comment-text">{!! $status->rendered ?? e($status->caption) !!}</span>
</p>
<div class="comments">
@foreach($status->comments->reverse()->take(10) as $item)
<p class="mb-0">
<span class="font-weight-bold pr-1"><bdi><a class="text-dark" href="{{$item->profile->url()}}">{{$item->profile->username}}</a></bdi></span>
<span class="comment-text">{!!$item->rendered!!} <a href="{{$item->url()}}" class="text-dark small font-weight-bold float-right">{{$item->created_at->diffForHumans(null, true, true ,true)}}</a></span>
<div class="d-flex flex-md-column flex-column-reverse h-100">
<div class="card-body status-comments">
<div class="status-comment">
<p class="mb-1">
<span class="font-weight-bold pr-1">{{$status->profile->username}}</span>
<span class="comment-text">{!! $status->rendered ?? e($status->caption) !!}</span>
</p>
@endforeach
<div class="comments">
@foreach($status->comments->reverse()->take(10) as $item)
<p class="mb-0">
<span class="font-weight-bold pr-1"><bdi><a class="text-dark" href="{{$item->profile->url()}}">{{$item->profile->username}}</a></bdi></span>
<span class="comment-text">{!!$item->rendered!!} <a href="{{$item->url()}}" class="text-dark small font-weight-bold float-right">{{$item->created_at->diffForHumans(null, true, true ,true)}}</a></span>
</p>
@endforeach
</div>
</div>
</div>
</div>
<div class="card-body flex-grow-0">
<div class="reactions h3 mb-0">
<form class="d-inline-flex like-form pr-3" method="post" action="/i/like" style="display: inline;" data-id="{{$status->id}}" data-action="like">
@csrf
<input type="hidden" name="item" value="{{$status->id}}">
<button class="btn btn-link text-dark p-0" type="submit">
<span class="far fa-heart fa-lg mb-0"></span>
</button>
</form>
<span class="far fa-comment fa-lg pt-1 pr-3"></span>
@if(Auth::check())
@if(Auth::user()->profile->id === $status->profile->id || Auth::user()->is_admin == true)
<form method="post" action="/i/delete" class="d-inline-flex">
@csrf
<input type="hidden" name="type" value="post">
<input type="hidden" name="item" value="{{$status->id}}">
<button type="submit" class="btn btn-link text-dark p-0">
<span class="far fa-trash-alt fa-lg mb-0"></span>
</button>
</form>
@endif
@endif
<span class="float-right">
<form class="d-inline-flex bookmark-form" method="post" action="/i/bookmark" style="display: inline;" data-id="{{$status->id}}" data-action="bookmark">
<div class="card-body flex-grow-0">
<div class="reactions h3 mb-0">
<form class="d-inline-flex like-form pr-3" method="post" action="/i/like" style="display: inline;" data-id="{{$status->id}}" data-action="like">
@csrf
<input type="hidden" name="item" value="{{$status->id}}">
<button class="btn btn-link text-dark p-0" type="submit">
<span class="far fa-bookmark fa-lg mb-0"></span>
<span class="far fa-heart fa-lg mb-0"></span>
</button>
</form>
</span>
</div>
<div class="likes font-weight-bold mb-0">
<span class="like-count" data-count="{{$status->likes_count}}">{{$status->likes_count}}</span> likes
<span class="far fa-comment fa-lg pt-1 pr-3"></span>
@if(Auth::check())
@if(Auth::user()->profile->id === $status->profile->id || Auth::user()->is_admin == true)
<form method="post" action="/i/delete" class="d-inline-flex">
@csrf
<input type="hidden" name="type" value="post">
<input type="hidden" name="item" value="{{$status->id}}">
<button type="submit" class="btn btn-link text-dark p-0">
<span class="far fa-trash-alt fa-lg mb-0"></span>
</button>
</form>
@endif
@endif
<span class="float-right">
<form class="d-inline-flex bookmark-form" method="post" action="/i/bookmark" style="display: inline;" data-id="{{$status->id}}" data-action="bookmark">
@csrf
<input type="hidden" name="item" value="{{$status->id}}">
<button class="btn btn-link text-dark p-0" type="submit">
<span class="far fa-bookmark fa-lg mb-0"></span>
</button>
</form>
</span>
</div>
<div class="likes font-weight-bold mb-0">
<span class="like-count" data-count="{{$status->likes_count}}">{{$status->likes_count}}</span> likes
</div>
</div>
</div>
<div class="card-footer">
<div class="card-footer bg-light sticky-md-bottom">
<form class="comment-form" method="post" action="/i/comment" data-id="{{$status->id}}" data-truncate="false">
@csrf
<input type="hidden" name="item" value="{{$status->id}}">