add contact form to accordion

This commit is contained in:
imohkay 2021-10-27 18:30:05 +05:30
parent 84c80ab632
commit 6e13ac13b2
2 changed files with 33 additions and 20 deletions

View file

@ -1,7 +1,7 @@
main > .contact { .contact {
max-width: var(--container-lg-width); max-width: var(--container-lg-width);
margin: 0 auto; margin: 0 auto;
padding: var(--spacing-2); padding: var(--spacing) 0;
h1 { h1 {
font-size: 22px; font-size: 22px;
@ -26,8 +26,11 @@ main > .contact {
border: 0; border: 0;
line-height: 1.3; line-height: 1.3;
display: block; display: block;
max-width: 500px;
width: 100%; width: 100%;
@media screen and (min-width: 800px) {
width: 50%;
}
} }
textarea { textarea {
@ -43,6 +46,8 @@ main > .contact {
font-weight: 700; font-weight: 700;
padding: var(--spacing) var(--spacing-2); padding: var(--spacing) var(--spacing-2);
display: block; display: block;
background-size: 400% 100%;
animation: background_animation 60s ease-in-out infinite, text_animation 60s ease-in-out infinite;
} }
} }

View file

@ -128,20 +128,17 @@
</div> </div>
</div> </div>
</li> </li>
</ul> <li>
</div> <label for="bio-contact" class="accordion-title">
<br> <h3>Contact 聯絡</h3>
</div> <span class="accordion-caret animated-title"><span class="text">&#xe901;</span></span>
<br> </label>
<p>Project "<a href="/polis">Phantas.ma/polis</a>" is organized by National Taiwan Museum of Fine Arts, supervised by the Ministry of Culture, and is co-organized by the Cultural Taiwan Foundation and in partnership with SEA Plateau.</p> <input type="checkbox" id="bio-contact" class="accordion-checkbox">
<div class="accordion-content">
<p>本計畫由國立臺灣美術館策劃文化部指導、財團法人文化臺灣基金會支持、SEA plateaus協力。</p>
</div>
<div class="contact"> <div class="contact">
{% if submitted %} {% if submitted %}
Thanks for your message Thanks for your message
{% else %} {% else %}
<h1>Contact 聯絡</h1>
<form method="post"> <form method="post">
<label for="input-email">Your Email</label> <label for="input-email">Your Email</label>
<input name="email" type="email" id="input-email" required> <input name="email" type="email" id="input-email" required>
@ -154,6 +151,17 @@
</form> </form>
{% endif %} {% endif %}
</div> </div>
</div>
</li>
</ul>
</div>
<br>
</div>
<br>
<p>Project "<a href="/polis">Phantas.ma/polis</a>" is organized by National Taiwan Museum of Fine Arts, supervised by the Ministry of Culture, and is co-organized by the Cultural Taiwan Foundation and in partnership with SEA Plateau.</p>
<p>本計畫由國立臺灣美術館策劃文化部指導、財團法人文化臺灣基金會支持、SEA plateaus協力。</p>
</div>
{% endblock %} {% endblock %}
{% block end %} {% block end %}