kevin/hypothetical
1
0
Fork 0
mirror of https://github.com/prurigro/hypothetical.git synced 2024-09-19 18:14:22 -04:00
Code Issues Projects Releases Packages Wiki Activity

Use the same surface to render both the default and active profile image so transparent pngs don't show the default image behind them

Browse source
This commit is contained in:
Kevin MacMartin 2018-04-25 01:33:17 -04:00
parent 6afe85c2d9
commit d7f3e449fb
3 changed files with 9 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
resources/assets/js/dashboard.js vendored
View file

@ -630,7 +630,8 @@ function userProfileImageInit() {
$upload = $("#profile-image-upload"), $upload = $("#profile-image-upload"),
$delete = $("#profile-image-delete"), $delete = $("#profile-image-delete"),
$token = $("#token"), $token = $("#token"),
$displayInner = $form.find(".image-display-inner").first(); $display = $form.find(".image-display").first(),
defaultImage = $display.data("default");
let file, let file,
submitting = false; submitting = false;
@ -660,7 +661,7 @@ function userProfileImageInit() {
submitting = false; submitting = false;
if (/\.png\?version=/.test(response)) { if (/\.png\?version=/.test(response)) {
$displayInner.css({ backgroundImage: `url(${response})` }); $display.css({ backgroundImage: `url(${response})` });
$delete.removeClass("inactive"); $delete.removeClass("inactive");
} else { } else {
showAlert("Failed to upload image"); showAlert("Failed to upload image");
@ -687,7 +688,7 @@ function userProfileImageInit() {
} }
}).always(function(response) { }).always(function(response) {
if (response === "success") { if (response === "success") {
$displayInner.css({ backgroundImage: "none" }); $display.css({ backgroundImage: `url(${defaultImage})` });
$delete.addClass("inactive"); $delete.addClass("inactive");
} else { } else {
showAlert("Failed to delete profile image"); showAlert("Failed to delete profile image");

11
resources/assets/sass/dashboard.scss vendored
View file

@ -820,17 +820,6 @@ body {
background-position: center center; background-position: center center;
background-size: cover; background-size: cover;
background-repeat: no-repeat; 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 { .image-buttons {

7
resources/views/dashboard/pages/settings.blade.php
View file

@ -10,9 +10,12 @@
<div class="col-12 col-md-8"> <div class="col-12 col-md-8">
<form id="user-profile-image" class="edit-item user-profile-image"> <form id="user-profile-image" class="edit-item user-profile-image">
@set('profile_image', $user->profileImage()) @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
<div class="image-display-inner" style="background-image: url('{{ $profile_image !== null ? $profile_image : App\User::$default_profile_image }}')"></div> class="image-display"
style="background-image: url('{{ $profile_image !== null ? $profile_image : $default_image }}')"
data-default="{{ $default_image }}">
</div> </div>
<div class="image-buttons"> <div class="image-buttons">