Fix no opacity transition issue of image viewer when first click (#374)

This commit is contained in:
TAKAHASHI Shuuji 2023-01-09 04:20:33 +09:00 committed by GitHub
parent d51f2883aa
commit c5c0e2bfe5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 5 additions and 4 deletions

View file

@ -1706,6 +1706,7 @@ form .post {
/* Image viewer */
#image-viewer {
display: none;
flex-direction: column;
justify-content: center;
align-items: center;
@ -1715,8 +1716,8 @@ form .post {
margin: 0;
width: 100dvw;
height: 100dvh;
opacity: 0;
background: rgb(0 0 0 / 75%);
transition: opacity 350ms;
z-index: 100;
}

View file

@ -23,7 +23,7 @@
set <#image-viewer figcaption />'s textContent to ''
end
</script>
<figure id="image-viewer" style="display: none" _="on click imageviewer.close()">
<figure id="image-viewer" _="on click imageviewer.close()">
<picture>
<img src="" alt=""/>
</picture>

View file

@ -73,7 +73,7 @@
</header>
{% block full_content %}
{% include 'activities/_modal_image.html' %}
{% include 'activities/_image_viewer.html' %}
{% block pre_content %}
{% endblock %}
<div class="columns">

View file

@ -27,7 +27,7 @@
</header>
<div id="main-content">
{% include "activities/_modal_image.html" %}
{% include "activities/_image_viewer.html" %}
{% block content %}
{% endblock %}
</div>