fix play icons being squares on iPhone for about page

This commit is contained in:
imohkay 2021-10-25 16:36:09 +05:30
parent 7fb6fcea4a
commit 8d5109bbf4
3 changed files with 12 additions and 11 deletions

View file

@ -88,7 +88,8 @@
} }
.accordion-caret { .accordion-caret {
font-size: 21px; font-size: 34px;
font-family: "icomoon";
margin-left: auto; margin-left: auto;
} }

4
app/static/js/about.js Normal file → Executable file
View file

@ -3,9 +3,9 @@ document.querySelectorAll('.accordion-checkbox').forEach(cbox => {
const label = this.previousElementSibling const label = this.previousElementSibling
const caret = label.querySelector('.text') const caret = label.querySelector('.text')
if (cbox.checked) { if (cbox.checked) {
caret.innerHTML = '▼' caret.innerHTML = ''
} else { } else {
caret.innerHTML = '▶' caret.innerHTML = ''
} }
}) })
}) })

View file

@ -47,7 +47,7 @@
<li> <li>
<label for="bio-anushka" class="accordion-title"> <label for="bio-anushka" class="accordion-title">
<h3>Anushka Rajendran</h3> <h3>Anushka Rajendran</h3>
<span class="accordion-caret animated-title"><span class="text">&#x25b6;</span></span> <span class="accordion-caret animated-title"><span class="text">&#xe901;</span></span>
</label> </label>
<input type="checkbox" id="bio-anushka" class="accordion-checkbox"> <input type="checkbox" id="bio-anushka" class="accordion-checkbox">
<div class="accordion-content"> <div class="accordion-content">
@ -58,7 +58,7 @@
<li> <li>
<label for="bio-padma" class="accordion-title"> <label for="bio-padma" class="accordion-title">
<h3>Pad.ma</h3> <h3>Pad.ma</h3>
<span class="accordion-caret animated-title"><span class="text">&#x25b6;<!-- &#9660; --></span></span> <span class="accordion-caret animated-title"><span class="text">&#xe901;</span></span>
</label> </label>
<input type="checkbox" id="bio-padma" class="accordion-checkbox"> <input type="checkbox" id="bio-padma" class="accordion-checkbox">
<div class="accordion-content"> <div class="accordion-content">
@ -72,7 +72,7 @@
<li> <li>
<label for="bio-annotation" class="accordion-title"> <label for="bio-annotation" class="accordion-title">
<h3>Annotation Collaborators</h3> <h3>Annotation Collaborators</h3>
<span class="accordion-caret animated-title"><span class="text">&#x25b6;</span></span> <span class="accordion-caret animated-title"><span class="text">&#xe901;</span></span>
</label> </label>
<input type="checkbox" id="bio-annotation" class="accordion-checkbox"> <input type="checkbox" id="bio-annotation" class="accordion-checkbox">
<div class="accordion-content"> <div class="accordion-content">
@ -83,7 +83,7 @@
<li> <li>
<label for="bio-acknowledgements" class="accordion-title"> <label for="bio-acknowledgements" class="accordion-title">
<h3>Acknowledgements</h3> <h3>Acknowledgements</h3>
<span class="accordion-caret animated-title"><span class="text">&#x25b6;</span></span> <span class="accordion-caret animated-title"><span class="text">&#xe901;</span></span>
</label> </label>
<input type="checkbox" id="bio-acknowledgements" class="accordion-checkbox"> <input type="checkbox" id="bio-acknowledgements" class="accordion-checkbox">
<div class="accordion-content"> <div class="accordion-content">
@ -100,7 +100,7 @@
<li> <li>
<label for="bio-anushka-zh" class="accordion-title"> <label for="bio-anushka-zh" class="accordion-title">
<h3>安努舒卡.拉堅德蘭</h3> <h3>安努舒卡.拉堅德蘭</h3>
<span class="accordion-caret animated-title"><span class="text js-accordion-icon-toggle">&#x25b6;</span></span> <span class="accordion-caret animated-title"><span class="text js-accordion-icon-toggle">&#xe901;</span></span>
</label> </label>
<input type="checkbox" id="bio-anushka-zh" class="accordion-checkbox"> <input type="checkbox" id="bio-anushka-zh" class="accordion-checkbox">
<div class="accordion-content"> <div class="accordion-content">
@ -111,7 +111,7 @@
<li> <li>
<label for="bio-padma-zh" class="accordion-title"> <label for="bio-padma-zh" class="accordion-title">
<h3>Pad.ma</h3> <h3>Pad.ma</h3>
<span class="accordion-caret animated-title"><span class="text js-accordion-icon-toggle">&#x25b6;</span></span> <span class="accordion-caret animated-title"><span class="text js-accordion-icon-toggle">&#xe901;</span></span>
</label> </label>
<input type="checkbox" id="bio-padma-zh" class="accordion-checkbox"> <input type="checkbox" id="bio-padma-zh" class="accordion-checkbox">
<div class="accordion-content"> <div class="accordion-content">
@ -128,7 +128,7 @@
<li> <li>
<label for="bio-annotation-zh" class="accordion-title"> <label for="bio-annotation-zh" class="accordion-title">
<h3>影片評論共筆</h3> <h3>影片評論共筆</h3>
<span class="accordion-caret animated-title"><span class="text js-accordion-icon-toggle">&#x25b6;</span></span> <span class="accordion-caret animated-title"><span class="text js-accordion-icon-toggle">&#xe901;</span></span>
</label> </label>
<input type="checkbox" id="bio-annotation-zh" class="accordion-checkbox"> <input type="checkbox" id="bio-annotation-zh" class="accordion-checkbox">
<div class="accordion-content"> <div class="accordion-content">
@ -139,7 +139,7 @@
<li> <li>
<label for="bio-acknowledgements-zh" class="accordion-title"> <label for="bio-acknowledgements-zh" class="accordion-title">
<h3>Acknowledgements</h3> <h3>Acknowledgements</h3>
<span class="accordion-caret animated-title"><span class="text js-accordion-icon-toggle">&#x25b6;</span></span> <span class="accordion-caret animated-title"><span class="text js-accordion-icon-toggle">&#xe901;</span></span>
</label> </label>
<input type="checkbox" id="bio-acknowledgements-zh" class="accordion-checkbox"> <input type="checkbox" id="bio-acknowledgements-zh" class="accordion-checkbox">
<div class="accordion-content"> <div class="accordion-content">