mirror of
https://github.com/prurigro/hypothetical.git
synced 2024-11-09 19:26:38 -05:00
Use the same surface to render both the default and active profile image so transparent pngs don't show the default image behind them
This commit is contained in:
parent
6afe85c2d9
commit
d7f3e449fb
3 changed files with 9 additions and 16 deletions
7
resources/assets/js/dashboard.js
vendored
7
resources/assets/js/dashboard.js
vendored
|
@ -630,7 +630,8 @@ function userProfileImageInit() {
|
|||
$upload = $("#profile-image-upload"),
|
||||
$delete = $("#profile-image-delete"),
|
||||
$token = $("#token"),
|
||||
$displayInner = $form.find(".image-display-inner").first();
|
||||
$display = $form.find(".image-display").first(),
|
||||
defaultImage = $display.data("default");
|
||||
|
||||
let file,
|
||||
submitting = false;
|
||||
|
@ -660,7 +661,7 @@ function userProfileImageInit() {
|
|||
submitting = false;
|
||||
|
||||
if (/\.png\?version=/.test(response)) {
|
||||
$displayInner.css({ backgroundImage: `url(${response})` });
|
||||
$display.css({ backgroundImage: `url(${response})` });
|
||||
$delete.removeClass("inactive");
|
||||
} else {
|
||||
showAlert("Failed to upload image");
|
||||
|
@ -687,7 +688,7 @@ function userProfileImageInit() {
|
|||
}
|
||||
}).always(function(response) {
|
||||
if (response === "success") {
|
||||
$displayInner.css({ backgroundImage: "none" });
|
||||
$display.css({ backgroundImage: `url(${defaultImage})` });
|
||||
$delete.addClass("inactive");
|
||||
} else {
|
||||
showAlert("Failed to delete profile image");
|
||||
|
|
11
resources/assets/sass/dashboard.scss
vendored
11
resources/assets/sass/dashboard.scss
vendored
|
@ -820,17 +820,6 @@ body {
|
|||
background-position: center center;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
&-inner {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
}
|
||||
|
||||
.image-buttons {
|
||||
|
|
|
@ -10,9 +10,12 @@
|
|||
<div class="col-12 col-md-8">
|
||||
<form id="user-profile-image" class="edit-item user-profile-image">
|
||||
@set('profile_image', $user->profileImage())
|
||||
@set('default_image', App\User::$default_profile_image)
|
||||
|
||||
<div class="image-display" style="background-image: url('{{ App\User::$default_profile_image }}')">
|
||||
<div class="image-display-inner" style="background-image: url('{{ $profile_image !== null ? $profile_image : App\User::$default_profile_image }}')"></div>
|
||||
<div
|
||||
class="image-display"
|
||||
style="background-image: url('{{ $profile_image !== null ? $profile_image : $default_image }}')"
|
||||
data-default="{{ $default_image }}">
|
||||
</div>
|
||||
|
||||
<div class="image-buttons">
|
||||
|
|
Loading…
Reference in a new issue