-
Notifications
You must be signed in to change notification settings - Fork 3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Large UX updates, replaced banner, moved analytics, linted everything (…
…#20004) https://maanavd.github.io/onnxruntime/ ### Description Many changes, most small, but quite a few. Listed here: - Infinitely scrolling testimonial banner on homepage - New Microsoft-approved cookie consent banner (only shows up in correct regions, here's a screen of it working): ![image](https://github.com/microsoft/onnxruntime/assets/24942306/b210b55f-d0cb-413a-a5c7-7156e003414a) You can duplicate this behavior if you want using: [this link](https://eng.ms/docs/cloud-ai-platform/devdiv/one-engineering-system-1es/1es-docs/wcp/privacy/wcp-cookie-consent-api#cookie-consent-library---javascript:~:text=siteConsent.manageConsent()%3B%0A%20%20%20%20%7D-,How%20to%20test%20if%20banner%20is%20loading%20for%20EU%20visitors,-You%20can%20use) - removed SAOS animations, relying on native tailwind animations - ran a linting pass - easter egg for hovering onnxruntime pinwheel --------- Co-authored-by: MaanavD <[email protected]>
- Loading branch information
Showing
36 changed files
with
1,088 additions
and
842 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
80 changes: 80 additions & 0 deletions
80
src/lib/components/ui/InfiniteMovingCards/InfiniteMovingCards.svelte
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,80 @@ | ||
<script lang="ts"> | ||
import { cn } from '$lib/utils/cn'; | ||
import { onMount } from 'svelte'; | ||
export let items: { | ||
href: string; | ||
src: any; | ||
alt: string; | ||
}[]; | ||
export let direction: 'left' | 'right' | undefined = 'left'; | ||
export let speed: 'fast' | 'normal' | 'slow' | undefined = 'fast'; | ||
export let pauseOnHover: boolean | undefined = true; | ||
export let className: string | undefined = undefined; | ||
let containerRef: HTMLDivElement; | ||
let scrollerRef: HTMLUListElement; | ||
onMount(() => { | ||
addAnimation(); | ||
}); | ||
let start = false; | ||
function addAnimation() { | ||
if (containerRef && scrollerRef) { | ||
const scrollerContent = Array.from(scrollerRef.children); | ||
scrollerContent.forEach((item) => { | ||
const duplicatedItem = item.cloneNode(true); | ||
if (scrollerRef) { | ||
scrollerRef.appendChild(duplicatedItem); | ||
} | ||
}); | ||
getDirection(); | ||
getSpeed(); | ||
start = true; | ||
} | ||
} | ||
const getDirection = () => { | ||
if (containerRef) { | ||
if (direction === 'left') { | ||
containerRef.style.setProperty('--animation-direction', 'forwards'); | ||
} else { | ||
containerRef.style.setProperty('--animation-direction', 'reverse'); | ||
} | ||
} | ||
}; | ||
const getSpeed = () => { | ||
if (containerRef) { | ||
if (speed === 'fast') { | ||
containerRef.style.setProperty('--animation-duration', '20s'); | ||
} else if (speed === 'normal') { | ||
containerRef.style.setProperty('--animation-duration', '40s'); | ||
} else { | ||
containerRef.style.setProperty('--animation-duration', '80s'); | ||
} | ||
} | ||
}; | ||
</script> | ||
|
||
<div bind:this={containerRef} class={cn('scroller relative z-2 overflow-hidden ', className)}> | ||
<ul | ||
bind:this={scrollerRef} | ||
class={cn( | ||
' flex w-max min-w-full shrink-0 flex-nowrap gap-4 py-4', | ||
start && 'animate-scroll ', | ||
pauseOnHover && 'hover:[animation-play-state:paused]' | ||
)} | ||
> | ||
{#each items as item, idx (item.alt)} | ||
<a | ||
href={item.href} | ||
class="bg-slate-300 m-auto relative h-28 w-[200px] max-w-full flex-shrink-0 hover:scale-105 transition duration-200 rounded-md border border-2 border-secondary md:w-[200px]" | ||
> | ||
<img class="h-28 p-2 m-auto" src={item.src} alt={item.alt} /> | ||
</a> | ||
{/each} | ||
</ul> | ||
</div> |
3 changes: 3 additions & 0 deletions
3
src/lib/components/ui/InfiniteMovingCards/InfiniteMovingCards.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
import InfiniteMovingCards from './InfiniteMovingCards.svelte'; | ||
|
||
export { InfiniteMovingCards }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
import { type ClassValue, clsx } from 'clsx'; | ||
import { twMerge } from 'tailwind-merge'; | ||
|
||
export function cn(...inputs: ClassValue[]) { | ||
return twMerge(clsx(inputs)); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.