jaculabilis/danbooru
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

media assets: show placeholder thumbnail when image is missing.

Browse Source 
Make media assets show a placeholder thumbnail when the image is
missing. This can happen if the upload is still processing, or if the
media asset's image was expunged, or if the asset failed during upload
(usually because of some temporary network failure when trying to
distribute thumbnails to the backend image servers).

Fixes a problem where new images on the My Uploads or All Uploads pages
could have broken thumbnails if they were still in the uploading phase.
This commit is contained in:
evazion
2022-02-13 12:27:25 -06:00
parent eb032d54c1
commit 879363b585
7 changed files with 67 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/javascript/src/styles/base/040_colors.css
View File

@@ -163,6 +163,8 @@ html {
--preview-icon-color: var(--inverse-text-color);
--preview-icon-background: rgba(0, 0, 0, 0.7);
--media-asset-placeholder-background-color: var(--grey-1);
--modqueue-tag-warning-color: var(--red-1);
--file-upload-component-background-color: var(--body-background-color);
@@ -374,6 +376,8 @@ body[data-current-user-theme="dark"] {
--preview-has-parent-color: var(--orange-3);
--preview-selected-color: rgba(255, 255, 255, 0.25);
--media-asset-placeholder-background-color: var(--grey-8);
--modqueue-tag-warning-color: var(--red-7);
--file-upload-component-background-color: var(--grey-8);

12
app/javascript/src/styles/common/utilities.scss
View File

@@ -116,10 +116,17 @@ $spacer: 0.25rem; /* 4px */
.pr-4 { padding-right: 4 * $spacer; }
.w-auto { width: auto; }
.w-min { width: min-content; }
.w-max { width: max-content; }
.w-sm { width: 24rem; }
.w-md { width: 28rem; }
.w-1\/4 { width: 25%; }
.w-full { width: 100%; }
.w-150px { width: 150px; }
.w-180px { width: 180px; }
.w-225px { width: 225px; }
.w-270px { width: 270px; }
.w-360px { width: 360px; }
.max-w-full { max-width: 100%; }
@@ -130,6 +137,11 @@ $spacer: 0.25rem; /* 4px */
.h-8 { height: 8 * $spacer; }
.h-10 { height: 10 * $spacer; }
.h-12 { height: 12 * $spacer; }
.h-150px { height: 150px; }
.h-180px { height: 180px; }
.h-225px { height: 225px; }
.h-270px { height: 270px; }
.h-360px { height: 360px; }
.max-h-150px { max-height: 150px; }
.max-h-180px { max-height: 180px; }