mirror/processwire
1
0
Fork 0
mirror of https://github.com/processwire/processwire.git synced 2025-08-12 09:44:38 +02:00
Code Issues Releases Wiki Activity

Update for display of SVG thumbnails in admin InputfieldImage

Browse Source
This commit is contained in:
Toutouwai
2023-09-20 09:40:29 -04:00
committed by Ryan Cramer
parent c6844af963
commit 17d6def379
3 changed files with 25 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
wire/modules/Inputfield/InputfieldImage/InputfieldImage.css Executable file → Normal file
View File

File diff suppressed because one or more lines are too long

10
wire/modules/Inputfield/InputfieldImage/InputfieldImage.module
View File

@@ -59,7 +59,7 @@ class InputfieldImage extends InputfieldFile implements InputfieldItemList, Inpu
return array(
'title' => __('Images', __FILE__), // Module Title
'summary' => __('One or more image uploads (sortable)', __FILE__), // Module Summary
'version' => 126,
'version' => 127,
'permanent' => true,
);
}
@@ -658,9 +658,13 @@ class InputfieldImage extends InputfieldFile implements InputfieldItemList, Inpu
foreach($pagefile->extras() as $name => $extra) {
if($extra->exists()) $fileStats .= " • $extra->filesizeStr $name ($extra->savingsPct)";
}
$class = 'gridImage__overflow';
if($pagefile->ext() === 'svg') {
$class .= ' ' . ($pagefile->ratio < 1 ? 'portrait' : 'landscape');
}
$out = $this->getTooltip($pagefile) . "
<div class='gridImage__overflow'>
<div class='$class'>
$thumb[markup]
</div>
";

17
wire/modules/Inputfield/InputfieldImage/InputfieldImage.scss
View File

@@ -942,6 +942,23 @@ $focusPointCircleSize: 40px;
white-space: nowrap;
}
.InputfieldImageList {
// for .svg images
.gridImage__overflow.landscape {
img { height: 100%; }
}
.gridImage__overflow.portrait {
img { width: 100%; }
}
}
.InputfieldImageList[data-ragged="1"] {
// for .svg images
.gridImage__overflow.portrait {
img { width: auto; height: 100%; }
}
}
/* todo: 3.0.190 improves touch support but needs further testing
.gridImage__edit { display:block !important; }
.gridImage__edit span { display:none; }