Merge pull request #275 from hellcp/patch-23

Make mobile view profile more compact
This commit is contained in:
daniel 2018-08-10 19:28:09 -06:00 committed by GitHub
commit 5b4f080da7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 5 deletions

View file

@ -189,6 +189,10 @@ body, button, input, textarea {
} }
@media (max-width: map-get($grid-breakpoints, "sm")) { @media (max-width: map-get($grid-breakpoints, "sm")) {
.card-md-border-0 {
border-width: 0!important;
border-radius: 0!important;
}
.card-md-rounded-0 { .card-md-rounded-0 {
border-width: 1px 0; border-width: 1px 0;
border-radius:0 !important; border-radius:0 !important;
@ -289,4 +293,4 @@ details summary::-webkit-details-marker {
.details-animated[open] > summary { .details-animated[open] > summary {
display: none!important; display: none!important;
} }

View file

@ -16,18 +16,18 @@
</ul> </ul>
</div> </div>
@endif @endif
<div class="container mt-5"> <div class="container">
@if($owner && request()->is('*/saved')) @if($owner && request()->is('*/saved'))
<div class="col-12"> <div class="col-12">
<p class="text-muted font-weight-bold small">{{__('profile.savedWarning')}}</p> <p class="text-muted font-weight-bold small">{{__('profile.savedWarning')}}</p>
</div> </div>
@endif @endif
<div class="profile-timeline"> <div class="profile-timeline mt-2 mt-md-4">
<div class="row"> <div class="row">
@if($timeline->count() > 0) @if($timeline->count() > 0)
@foreach($timeline as $status) @foreach($timeline as $status)
<div class="col-12 col-md-4 mb-4"> <div class="col-4 p-0 p-sm-2 p-md-3">
<a class="card info-overlay" href="{{$status->url()}}"> <a class="card info-overlay card-md-border-0" href="{{$status->url()}}">
<div class="square {{$status->firstMedia()->filter_class}}"> <div class="square {{$status->firstMedia()->filter_class}}">
<div class="square-content" style="background-image: url('{{$status->thumb()}}')"></div> <div class="square-content" style="background-image: url('{{$status->thumb()}}')"></div>
<div class="info-overlay-text"> <div class="info-overlay-text">