From b1b796e3f9972c381e4f7ba7b1a36d5c5e65937c Mon Sep 17 00:00:00 2001 From: MuslemRahimi Date: Fri, 12 Jul 2024 01:11:54 +0200 Subject: [PATCH] update ui --- src/app.css | 1 - src/routes/+layout.svelte | 16 ++++----- src/routes/+page.svelte | 73 ++++++++++++++++++++++++++++----------- tailwind.config.cjs | 4 +-- 4 files changed, 63 insertions(+), 31 deletions(-) diff --git a/src/app.css b/src/app.css index 016555b4..8d3c2720 100644 --- a/src/app.css +++ b/src/app.css @@ -59,7 +59,6 @@ - .shake-ticker:hover img { animation-name: shake; animation-duration: 0.5s; diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index a9a22333..f3d74485 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -356,14 +356,14 @@ $: { -
+
{#if !data?.user}
+ class="sticky {$screenWidth < 640 && hideHeader ? 'invisible -mt-20' : ''} inset-x-0 top-0 z-30 mx-auto w-full max-w-screen-md border border-[#202020] py-3 sm:py-4 shadow-lg sm:backdrop-blur-sm bg-[#202020] sm:bg-opacity-80 md:top-3 md:rounded-2xl lg:max-w-screen-lg">
@@ -377,25 +377,25 @@ $: {
- Start Trial - Login
{:else } -
+
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 4bd1f7fe..5dd680c6 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -3,6 +3,7 @@ import Marquee from '$lib/components/Marquee.svelte'; import Discount from '$lib/components/Discount.svelte'; + import { intersect } from 'svelte-intersection-observer-action'; export let data; @@ -11,6 +12,19 @@ const frontendStars = data?.getFrontendStars; const backendStars = data?.getBackendStars; + +const threshold = 0.4 // change the threshold value to 0.4 for 40% +const rootMargin = '-0px 0px' +const intersectOptions = { callback, threshold, rootMargin } +function callback(entry: IntersectionObserverEntry) { + if (entry.intersectionRatio > threshold) { + entry.target.classList.remove('invisible') + entry.target.classList.add('animate-fade-in-once') + } +} + + + @@ -48,7 +62,6 @@ class="hidden sm:block [mask-image:linear-gradient(to_bottom_right,white,transpa /> -
@@ -157,7 +170,7 @@ class="hidden sm:block [mask-image:linear-gradient(to_bottom_right,white,transpa
- +

Explore High Quality Datasets @@ -178,20 +191,19 @@ class="hidden sm:block [mask-image:linear-gradient(to_bottom_right,white,transpa
- -
-
-

- - Dark Pool -

- - Access high-volume, privately negotiated trades from exclusive exchanges, typically used by institutional investors. This data is now available to you! - + -
-
+ -
+ -
+ -
+ -
+