mirror of
https://github.com/Kovah/LinkAce.git
synced 2025-04-14 03:32:01 +02:00
Minor styling changes for link thumbnails
This commit is contained in:
parent
9caeadfddb
commit
39ed05e1a1
35
resources/assets/sass/custom/_app.scss
vendored
35
resources/assets/sass/custom/_app.scss
vendored
@ -166,21 +166,38 @@ code {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.link-thumbnail {
|
||||
box-shadow: inset 0 0 1px $secondary;
|
||||
}
|
||||
|
||||
.link-thumbnail-detail {
|
||||
width: 180px;
|
||||
height: 100px;
|
||||
background-size: cover !important;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding-bottom: 52.5%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
|
||||
@include media-breakpoint-up('lg') {
|
||||
width: 180px;
|
||||
height: 93px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.link-thumbnail-list-holder {
|
||||
width: 100%;
|
||||
@include media-breakpoint-up('md') {
|
||||
width: auto;
|
||||
}
|
||||
width: 180px;
|
||||
height: 93px;
|
||||
|
||||
//@include media-breakpoint-up('lg') {
|
||||
// width: 180px;
|
||||
//}
|
||||
|
||||
.link-thumbnail-list {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-size: cover !important;
|
||||
}
|
||||
}
|
||||
|
@ -4,7 +4,8 @@
|
||||
<div class="d-flex align-items-top flex-wrap flex-md-nowrap">
|
||||
@if($link->thumbnail)
|
||||
<div class="d-flex justify-content-center mr-2 mb-2 mb-md-0 link-thumbnail-list-holder">
|
||||
<a href="{{ $link->url }}" {!! linkTarget() !!} class="border rounded d-block link-thumbnail-list" style="background: url('{{ $link->thumbnail }}') no-repeat center;">
|
||||
<a href="{{ $link->url }}" {!! linkTarget() !!} class="rounded d-block link-thumbnail link-thumbnail-list"
|
||||
style="background-image: url('{{ $link->thumbnail }}');">
|
||||
</a>
|
||||
</div>
|
||||
@endif
|
||||
|
@ -9,12 +9,10 @@
|
||||
<div class="card-body">
|
||||
<div class="d-flex flex-column flex-lg-row mb-3">
|
||||
@if($link->thumbnail)
|
||||
<div class="mt-1 mr-2 align-self-center">
|
||||
<a href="{{ $link->url }}" {!! linkTarget() !!}
|
||||
class="border rounded d-block link-thumbnail-detail" style="background: url('{{ $link->thumbnail }}') no-repeat center;">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<a href="{{ $link->url }}" {!! linkTarget() !!}
|
||||
class="rounded d-block mt-lg-1 mr-lg-2 align-self-center link-thumbnail link-thumbnail-detail"
|
||||
style="background-image: url('{{ $link->thumbnail }}') ;">
|
||||
</a>
|
||||
@endif
|
||||
<div class="d-sm-inline-block mt-1 mb-2 mb-sm-0">
|
||||
{!! $link->getIcon('mr-1 mr-sm-2') !!}
|
||||
|
Loading…
x
Reference in New Issue
Block a user