alihan/mermaid-live-editor
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid-live-editor.git synced 2025-03-18 17:16:21 +03:00
Code Issues Packages Projects Releases Wiki Activity

chore: Simplify promotion

Browse Source
This commit is contained in:
Sidharth Vinod
2024-08-07 10:22:45 +05:30
parent 9dc4f5773c
commit 2916eaedaa
2 changed files with 19 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/lib/util/promos/August2024.svelte
View File

@@ -1,5 +1,6 @@
<script lang="ts"> <script lang="ts">
import { onDestroy } from 'svelte'; import { onDestroy } from 'svelte';
import { fade } from 'svelte/transition';
interface Taglines { interface Taglines {
label: string; label: string;
@@ -23,16 +24,10 @@
let index = Math.floor(Math.random() * taglines.length); let index = Math.floor(Math.random() * taglines.length);
let currentTagline = taglines[index]; let currentTagline = taglines[index];
let isFadingOut = false;
const interval = setInterval(() => { const interval = setInterval(() => {
isFadingOut = true; index = (index + 1) % taglines.length;
currentTagline = taglines[index];
setTimeout(() => {
isFadingOut = false;
index = (index + 1) % taglines.length;
currentTagline = taglines[index];
}, 1000);
}, 60_000); }, 60_000);
onDestroy(() => { onDestroy(() => {
@@ -40,15 +35,18 @@
}); });
</script> </script>
{#key currentTagline} <div class="grid w-full">
<a {#key currentTagline}
href={currentTagline.url} <a
target="_blank" href={currentTagline.url}
class="flex-grow animate-fadeIn no-underline {isFadingOut ? 'animate-fadeOut' : ''}"> target="_blank"
<span class="text-surface-50 dark:text-surface-50 text-sm tracking-wider transition-opacity" class="col-start-1 row-start-1 flex items-center justify-center gap-4 no-underline"
>{currentTagline.label}</span> in:fade={{ delay: 750 }}
<button out:fade={{ duration: 1000 }}>
class="border:surface-50 dark:hover:surface-50 dark:white text-surface-50 ml-4 rounded border px-3 py-1 text-sm tracking-wide hover:border-[#00237A] hover:bg-[#00237A]" <span class="text-sm tracking-wider">{currentTagline.label}</span>
>Try it now</button> <button
</a> class="border:surface-50 dark:hover:surface-50 dark:white text-surface-50 rounded border px-3 py-1 text-sm tracking-wide hover:border-[#00237A] hover:bg-[#00237A]"
{/key} >Try it now</button>
</a>
{/key}
</div>

17
tailwind.config.cjs
View File

@@ -2,22 +2,7 @@ module.exports = {
plugins: [require('daisyui')], plugins: [require('daisyui')],
content: ['./src/**/*.{html,js,svelte,ts}'], content: ['./src/**/*.{html,js,svelte,ts}'],
theme: { theme: {
extend: { extend: {}
keyframes: {
fadeIn: {
'0%': { opacity: '0' },
'100%': { opacity: '1' }
},
fadeOut: {
'0%': { opacity: '1' },
'100%': { opacity: '0' }
}
},
animation: {
fadeIn: 'fadeIn 1s ease-in',
fadeOut: 'fadeOut 1s ease-in'
}
}
}, },
variants: { variants: {
extend: {} extend: {}