fix(web): animations

This commit is contained in:
wanhose 2022-05-23 21:53:31 +02:00
parent 7f6b1d4a80
commit 9aa40f9d09
3 changed files with 10 additions and 7 deletions

View File

@ -10,7 +10,7 @@
@layer components { @layer components {
.button { .button {
@apply font-bold md:bg-2x md:hover:animate-gradient md:hover:shadow-md rounded-lg text-white px-8 py-4; @apply font-bold md:bg-2x md:hover:shadow-md rounded-lg text-white px-8 py-4;
} }
.icon-box { .icon-box {

View File

@ -135,7 +135,10 @@
automatically automatically
</p> </p>
<div class="flex flex-col gap-4 justify-center md:flex-row md:gap-8 mt-16"> <div class="flex flex-col gap-4 justify-center md:flex-row md:gap-8 mt-16">
<a class="bg-gradient-to-r button from-primary to-blue-500 px-8 py-4" href="#downloads"> <a
class="bg-gradient-to-r button from-primary md:hover:animate-gradient to-blue-500"
href="#downloads"
>
Download now Download now
<svg <svg
aria-hidden="true" aria-hidden="true"
@ -309,7 +312,7 @@
<h2>Available now on</h2> <h2>Available now on</h2>
<div class="flex flex-col gap-4 justify-center md:flex-row md:gap-8 mt-16"> <div class="flex flex-col gap-4 justify-center md:flex-row md:gap-8 mt-16">
<a <a
class="bg-gradient-to-r button from-chrome-1 to-chrome-3 via-chrome-2" class="bg-gradient-to-r button from-chrome-1 md:hover:animate-gradient to-chrome-3 via-chrome-2"
href="https://chrome.google.com/webstore/detail/djcbfpkdhdkaflcigibkbpboflaplabg" href="https://chrome.google.com/webstore/detail/djcbfpkdhdkaflcigibkbpboflaplabg"
target="_blank" target="_blank"
> >
@ -329,7 +332,7 @@
</svg> </svg>
</a> </a>
<a <a
class="bg-gradient-to-r button from-edge-1 to-edge-3 via-edge-2" class="bg-gradient-to-r button from-edge-1 md:hover:animate-gradient to-edge-3 via-edge-2"
href="https://microsoftedge.microsoft.com/addons/detail/hbogodfciblakeneadpcolhmfckmjcii" href="https://microsoftedge.microsoft.com/addons/detail/hbogodfciblakeneadpcolhmfckmjcii"
target="_blank" target="_blank"
> >
@ -349,7 +352,7 @@
</svg> </svg>
</a> </a>
<a <a
class="bg-gradient-to-r button from-firefox-1 to-firefox-3 via-firefox-2" class="bg-gradient-to-r button from-firefox-1 md:hover:animate-gradient to-firefox-3 via-firefox-2"
href="https://addons.mozilla.org/firefox/addon/cookie-dialog-monster" href="https://addons.mozilla.org/firefox/addon/cookie-dialog-monster"
target="_blank" target="_blank"
> >

View File

@ -12,9 +12,9 @@ module.exports = {
gradient: 'gradient 3s ease infinite', gradient: 'gradient 3s ease infinite',
}, },
colors: { colors: {
'chrome-1': '#fe4e40', 'chrome-1': '#01a258',
'chrome-2': '#008cf8', 'chrome-2': '#008cf8',
'chrome-3': '#01a258', 'chrome-3': '#fe4e40',
'edge-1': '#197bc4', 'edge-1': '#197bc4',
'edge-2': '#2ec2e0', 'edge-2': '#2ec2e0',
'edge-3': '#52dc6c', 'edge-3': '#52dc6c',