ensure play icon gradients aren't random on about

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

View file

@ -60,7 +60,6 @@
}
.about-bios {
//max-width: 670px;
padding: var(--spacing-2) 0;
}
@ -72,6 +71,10 @@
display: flex;
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) {
width: 50%;
}

View file

@ -15,8 +15,8 @@
}
.animated-title {
.text {
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));
.text, .text-about {
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;
background-clip: text;
color: transparent;

View file

@ -44,7 +44,7 @@
<li>
<label for="bio-anushka" class="accordion-title">
<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>
<input type="checkbox" id="bio-anushka" class="accordion-checkbox">
<div class="accordion-content">
@ -63,7 +63,7 @@
<li>
<label for="bio-padma" class="accordion-title">
<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>
<input type="checkbox" id="bio-padma" class="accordion-checkbox">
<div class="accordion-content">
@ -90,7 +90,7 @@
<li>
<label for="bio-annotation" class="accordion-title">
<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>
<input type="checkbox" id="bio-annotation" class="accordion-checkbox">
<div class="accordion-content">
@ -109,7 +109,7 @@
<li>
<label for="bio-acknowledgements" class="accordion-title">
<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>
<input type="checkbox" id="bio-acknowledgements" class="accordion-checkbox">
<div class="accordion-content">
@ -126,7 +126,7 @@
<li>
<label for="bio-contact" class="accordion-title">
<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>
<input type="checkbox" id="bio-contact" class="accordion-checkbox">
<div class="accordion-content">