0x2620/phantasma
2
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

ensure play icon gradients aren't random on about

Browse source
This commit is contained in:
imohkay 2021-10-27 22:17:05 +05:30
parent 9ffb421ba3
commit ab3cf2934b
3 changed files with 11 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
app/static/css/partials/_about.scss
View file

@ -60,7 +60,6 @@
} }
.about-bios { .about-bios {
//max-width: 670px;
padding: var(--spacing-2) 0; padding: var(--spacing-2) 0;
} }
@ -72,6 +71,10 @@
display: flex; display: flex;
align-items: center; align-items: center;
.text-about {
background-image: linear-gradient(to right, var(--animated-title-color-2), var(--animated-title-color-3), var(--animated-title-color-4), var(--animated-title-color-1));
}
@media screen and (min-width: 800px) { @media screen and (min-width: 800px) {
width: 50%; width: 50%;
} }

4
app/static/css/partials/_titleanimation.scss
View file

@ -15,8 +15,8 @@
} }
.animated-title { .animated-title {
.text { .text, .text-about {
background: linear-gradient(to right, var(--animated-title-color-1), var(--animated-title-color-2) , var(--animated-title-color-3), var(--animated-title-color-4)); background-image: linear-gradient(to right, var(--animated-title-color-1), var(--animated-title-color-2) , var(--animated-title-color-3), var(--animated-title-color-4));
-webkit-background-clip: text; -webkit-background-clip: text;
background-clip: text; background-clip: text;
color: transparent; color: transparent;

10
app/templates/about.html
View file

@ -44,7 +44,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">&#xe901;</span></span> <span class="accordion-caret animated-title"><span class="text-about">&#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">
@ -63,7 +63,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">&#xe901;</span></span> <span class="accordion-caret animated-title"><span class="text-about">&#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">
@ -90,7 +90,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">&#xe901;</span></span> <span class="accordion-caret animated-title"><span class="text-about">&#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">
@ -109,7 +109,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">&#xe901;</span></span> <span class="accordion-caret animated-title"><span class="text-about">&#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">
@ -126,7 +126,7 @@
<li> <li>
<label for="bio-contact" class="accordion-title"> <label for="bio-contact" class="accordion-title">
<h3>Contact 聯絡</h3> <h3>Contact 聯絡</h3>
<span class="accordion-caret animated-title"><span class="text">&#xe901;</span></span> <span class="accordion-caret animated-title"><span class="text-about">&#xe901;</span></span>
</label> </label>
<input type="checkbox" id="bio-contact" class="accordion-checkbox"> <input type="checkbox" id="bio-contact" class="accordion-checkbox">
<div class="accordion-content"> <div class="accordion-content">