mirror_php/LinkAce
1
0
Fork 0
mirror of https://github.com/Kovah/LinkAce.git synced 2025-04-20 23:11:56 +02:00
Code Issues Releases Wiki Activity

Add a detailed card display for links (#305)

Browse Source
This commit is contained in:
Kovah 2022-04-03 23:15:30 +02:00
parent da24beddb1
commit 53405ab80d
No known key found for this signature in database
GPG Key ID: AAAA031BA9830D7B
8 changed files with 123 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/Models/Link.php
View File

@ -75,6 +75,7 @@ class Link extends Model
public const STATUS_BROKEN = 3;
public const DISPLAY_CARDS = 1;
public const DISPLAY_CARDS_DETAILED = 3;
public const DISPLAY_LIST_SIMPLE = 2;
public const DISPLAY_LIST_DETAILED = 0;

26
resources/assets/sass/custom/_app.scss vendored
View File

@ -192,6 +192,14 @@ code {
transform: rotate(45deg);
}
.link-thumbnail-placeholder-detailed {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
.link-thumbnail-detail {
width: 100%;
height: auto;
@ -207,6 +215,24 @@ code {
}
}
.link-thumbnail-list-holder-detailed {
position: relative;
width: 100%;
padding-top: 56.25%;
.link-thumbnail-list-detailed {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
border-top-left-radius: $border-radius-sm;
border-top-right-radius: $border-radius-sm;
background-position: center center;
background-size: cover;
}
}
.link-thumbnail-list-holder {
display: flex;
flex-shrink: 0;

3
resources/lang/en_US/settings.php
View File

@ -36,8 +36,9 @@ return [
'display_mode' => 'Display links as',
'display_mode_list_detailed' => 'list with many details',
'display_mode_list_simple' => 'list with few details',
'display_mode_list_simple' => 'list with less details',
'display_mode_cards' => 'cards with less details',
'display_mode_cards_detailed' => 'cards with many details',
'sharing' => 'Link Sharing',
'sharing_help' => 'Enable all services you want to display for links, to be able to share them easily with one click.',

6
resources/views/app/settings/partials/user/app-settings.blade.php
View File

@ -155,6 +155,12 @@
@endif>
@lang('settings.display_mode_cards')
</option>
<option value="{{ Link::DISPLAY_CARDS_DETAILED }}"
@if((int)$user->settings()->get('link_display_mode') === Link::DISPLAY_CARDS_DETAILED)
selected
@endif>
@lang('settings.display_mode_cards_detailed')
</option>
</select>
@if ($errors->has('link_display_mode'))
<p class="invalid-feedback" role="alert">

2
resources/views/models/links/index.blade.php
View File

@ -23,6 +23,8 @@
<div class="link-wrapper">
@if((int)usersettings('link_display_mode') === Link::DISPLAY_CARDS)
@include('models.links.partials.list-cards')
@elseif((int)usersettings('link_display_mode') === Link::DISPLAY_CARDS_DETAILED)
@include('models.links.partials.list-cards-detailed')
@elseif((int)usersettings('link_display_mode') === Link::DISPLAY_LIST_SIMPLE)
@include('models.links.partials.list-simple')
@else

5
resources/views/models/links/partials/list-cards-detailed.blade.php Normal file
View File

@ -0,0 +1,5 @@
<div class="row gy-4">
@foreach($links as $link)
@include('models.links.partials.single-card-detailed')
@endforeach
</div>

79
resources/views/models/links/partials/single-card-detailed.blade.php Normal file
View File

@ -0,0 +1,79 @@
<div class="col-12 col-md-6 col-lg-4">
<div class="h-100 card">
<div class="link-thumbnail-list-holder-detailed">
<a href="{{ $link->url }}" {!! linkTarget() !!} class="link-thumbnail-list-detailed"
@if($link->thumbnail)
style="background-image: url('{{ $link->thumbnail }}');"
@endif>
@if(!$link->thumbnail)
<span class="link-thumbnail-placeholder link-thumbnail-placeholder-detailed">
<x-icon.linkace-icon/>
</span>
@endif
</a>
</div>
<div class="card-body h-100 border-bottom-0">
<div class="d-flex">
<div class="me-2">
{!! $link->getIcon() !!}
@if($link->is_private)
<br>
<x-icon.lock title="@lang('link.private')"/>
<span class="visually-hidden">@lang('link.private')</span>
@endif
</div>
<div>
<a href="{{ $link->url }}" {!! linkTarget() !!}>{{ $link->shortTitle() }}</a>
<br>
<small class="text-muted">{{ $link->shortUrl() }}</small>
</div>
</div>
</div>
<div class="px-3">
@if($link->tags->count() > 0)
@foreach($link->tags as $tag)
<a href="{{ route('tags.show', [$tag]) }}" class="btn btn-light btn-xs">
{{ $tag->name }}
</a>
@endforeach
@else
<span class="small text-muted">@lang('tag.no_tags')</span>
@endif
</div>
<div class="d-flex align-items-center my-1">
<div class="text-muted text-xs me-3 ps-3">
@lang('linkace.added') {!! $link->addedAt() !!}
</div>
<div class="btn-group ms-auto me-2">
<a href="{{ route('links.show', [$link->id]) }}" class="btn btn-sm btn-link" title="@lang('link.show')">
<x-icon.info class="fw"/>
<span class="visually-hidden">@lang('link.show')</span>
</a>
<a href="{{ route('links.edit', [$link->id]) }}" class="btn btn-sm btn-link" title="@lang('link.edit')">
<x-icon.edit class="fw"/>
<span class="visually-hidden">@lang('link.edit')</span>
</a>
<button type="submit" form="link-delete-{{ $link->id }}" title="@lang('link.delete')"
class="btn btn-sm btn-link">
<x-icon.trash class="fw"/>
<span class="visually-hidden">@lang('link.delete')</span>
</button>
</div>
<form id="link-delete-{{ $link->id }}" method="POST" style="display: none;"
action="{{ route('links.destroy', [$link->id]) }}">
@method('DELETE')
@csrf
<input type="hidden" name="link_id" value="{{ $link->id }}">
</form>
</div>
</div>
</div>

4
resources/views/models/links/partials/single-card.blade.php
View File

@ -1,4 +1,4 @@
<div class="col-12 col-sm-6 col-md-4">
<div class="col-12 col-md-6 col-lg-4">
<div class="h-100 card">
<div class="card-body h-100 border-bottom-0">
<div class="d-flex">
@ -18,7 +18,7 @@
</div>
</div>
<div class="d-flex align-items-center">
<div class="d-flex align-items-center my-1">
<div class="text-muted text-xs me-3 ps-3">
@lang('linkace.added') {!! $link->addedAt() !!}
</div>