expandable images in submit forms

master
Aevann 2024-04-05 10:43:44 +02:00
parent 8de8a60df6
commit db8b38cbb2
4 changed files with 7 additions and 7 deletions

View File

@ -27,7 +27,7 @@
<div id="image-upload-block">
<div><label>New Image</label></div>
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid">
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid" data-nonce="{{g.nonce}}" data-onclick="expandImage()">
<label class="btn btn-secondary m-0" for="file-upload">
<div>Select Image<br>(optional)</div>
<input autocomplete="off" id="file-upload" accept="image/*" type="file" name="image" {% if g.is_tor %}disabled{% endif %} hidden>

View File

@ -13,7 +13,7 @@
<div id="image-upload-block">
<div><label class="mt-3">Image</label></div>
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid">
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid" data-nonce="{{g.nonce}}" data-onclick="expandImage()">
<label class="btn btn-secondary m-0" for="file-upload">
<div>Select Image</div>
<input autocomplete="off" id="file-upload" accept="image/*" type="file" name="image" {% if g.is_tor %}disabled{% endif %} hidden>
@ -50,7 +50,7 @@
<input hidden value="{{v|formkey}}" class="notranslate" translate="no">
<div><label class="mt-3">Image</label></div>
<img loading="lazy" src="{{SITE_FULL_IMAGES}}/asset_submissions/art/{{entry.id}}.webp?s={{range(1, 10000000)|random}}" style="max-width:50%;border:5px white solid">
<img loading="lazy" src="{{SITE_FULL_IMAGES}}/asset_submissions/art/{{entry.id}}.webp?s={{range(1, 10000000)|random}}" style="max-width:50%;border:5px white solid" data-nonce="{{g.nonce}}" data-onclick="expandImage()">
<div><label class="mt-3" for="{{entry.id}}-submitter">Submitter</label></div>
<input autocomplete="off" type="text" id="{{entry.id}}-submitter" class="form-control" maxlength="30" value="{{entry.submitter}}" readonly>

View File

@ -12,7 +12,7 @@
<div id="image-upload-block">
<div><label class="mt-3">Image</label></div>
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid">
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid" data-nonce="{{g.nonce}}" data-onclick="expandImage()">
<label class="btn btn-secondary m-0" for="file-upload">
<div>Select Image</div>
<input autocomplete="off" id="file-upload" accept="image/*" type="file" name="image" {% if g.is_tor %}disabled{% endif %} hidden>
@ -70,7 +70,7 @@
<input hidden value="{{v|formkey}}" class="notranslate" translate="no">
<div><label class="mt-3">Image</label></div>
<img loading="lazy" src="{{SITE_FULL_IMAGES}}/asset_submissions/emojis/{{emoji.name}}.webp?s={{range(1, 10000000)|random}}" style="max-width:50%;border:5px white solid">
<img loading="lazy" src="{{SITE_FULL_IMAGES}}/asset_submissions/emojis/{{emoji.name}}.webp?s={{range(1, 10000000)|random}}" style="max-width:50%;border:5px white solid" data-nonce="{{g.nonce}}" data-onclick="expandImage()">
<div><label class="mt-3" for="{{emoji.name}}-kind">Kind</label></div>
<div class="input-group">

View File

@ -12,7 +12,7 @@
<div id="image-upload-block">
<div><label class="mt-3">Image</label></div>
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid">
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid" data-nonce="{{g.nonce}}" data-onclick="expandImage()">
<label class="btn btn-secondary m-0" for="file-upload">
<div>Select Image</div>
<input autocomplete="off" id="file-upload" accept="image/*" type="file" name="image" {% if g.is_tor %}disabled{% endif %} hidden>
@ -53,7 +53,7 @@
<input hidden name="formkey" value="{{v|formkey}}" class="notranslate" translate="no">
<div><label class="mt-3">Image</label></div>
<img loading="lazy" src="{{SITE_FULL_IMAGES}}/asset_submissions/hats/{{hat.name}}.webp?s={{range(1, 10000000)|random}}" style="max-width:50%;border:5px white solid">
<img loading="lazy" src="{{SITE_FULL_IMAGES}}/asset_submissions/hats/{{hat.name}}.webp?s={{range(1, 10000000)|random}}" style="max-width:50%;border:5px white solid" data-nonce="{{g.nonce}}" data-onclick="expandImage()">
<div class="profile-pic-100-wrapper ml-4 mt-4">
<img loading="lazy" alt="avatar" src="{{v.profile_url}}" class="profile-pic-100">