chris
/
pixelfed
forked from mirror/pixelfed
1
0
Fork 0
Code Pull Requests Activity

Apply content-box box-sizing to avatars images; add object-fit: cover to post thumbnail image on comment pages

This commit is contained in:
Carly Ho 2018-12-30 10:41:07 -06:00
parent 1d07c4a72e
commit 036c31141f
2 changed files with 17 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
resources/assets/sass/custom.scss vendored
View File

@ -319,7 +319,7 @@ details summary::-webkit-details-marker {
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.08); box-shadow: 0 2px 4px 0 rgba(0,0,0,0.08);
border-radius: 5px; border-radius: 5px;
padding: .5em 1em .5em .5em; padding: .5em 1em .5em .5em;
} }
.input-elevated::placeholder { .input-elevated::placeholder {
color: #838D99; color: #838D99;
@ -417,7 +417,7 @@ details summary::-webkit-details-marker {
background: rgba(0,0,0,0.04); background: rgba(0,0,0,0.04);
} }
.timeline-sidenav.nav-pills .nav-link.active, .timeline-sidenav.nav-pills .nav-link.active,
.timeline-sidenav.nav-pills .show > .nav-link { .timeline-sidenav.nav-pills .show > .nav-link {
color: #08d; color: #08d;
background: transparent; background: transparent;
@ -434,4 +434,14 @@ details summary::-webkit-details-marker {
.notification-tooltip .arrow::before { .notification-tooltip .arrow::before {
border-bottom-color:#dc3545 !important; border-bottom-color:#dc3545 !important;
} }
.img-thumbnail {
box-sizing: content-box;
}
.reply-container {
.post-thumbnail {
object-fit: cover;
}
}

8
resources/views/status/reply.blade.php
View File

@ -2,12 +2,12 @@
@section('content') @section('content')
<div class="container"> <div class="container reply-container">
<div class="col-12 col-md-8 offset-md-2 mt-4"> <div class="col-12 col-md-8 offset-md-2 mt-4">
<div class="card"> <div class="card">
<div class="card-body p-0 m-0 bg-light"> <div class="card-body p-0 m-0 bg-light">
<div class="d-flex p-0 m-0 align-items-center"> <div class="d-flex p-0 m-0 align-items-center">
<img src="{{$status->parent()->thumb()}}" width="150px" height="150px"> <img src="{{$status->parent()->thumb()}}" width="150px" height="150px" class="post-thumbnail">
<div class="p-4"> <div class="p-4">
<div> <div>
<img src="{{$status->parent()->profile->avatarUrl()}}" class="rounded-circle img-thumbnail mb-1 mr-1" width="30px"> <img src="{{$status->parent()->profile->avatarUrl()}}" class="rounded-circle img-thumbnail mb-1 mr-1" width="30px">
@ -54,6 +54,6 @@
$('.reactions').hide(); $('.reactions').hide();
$('.more-comments').hide(); $('.more-comments').hide();
$('.card-footer').hide(); $('.card-footer').hide();
}); });
</script> </script>
@endpush @endpush