Skip to content

refactor(www): SDK-first website refresh #627

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
MaanavD wants to merge 3 commits into
base: main
Choose a base branch
from
Open

refactor(www): SDK-first website refresh #627

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
82bf30c
refactor(www): SDK-first website refresh
MaanavD Apr 10, 2026
c728e9c
Update www/src/lib/components/install-command.svelte
MaanavD Apr 11, 2026
c1457eb
fix(www): fix C# and Rust code snippets per review
MaanavD Apr 11, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
91 changes: 89 additions & 2 deletions www/src/lib/components/download-dropdown.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,9 +39,13 @@
windows: 'winget install Microsoft.FoundryLocal',
macos: 'brew install microsoft/foundrylocal/foundrylocal',
python: 'pip install foundry-local-sdk',
python_winml: 'pip install foundry-local-sdk-winml',
javascript: 'npm install foundry-local-sdk',
javascript_winml: 'npm install foundry-local-sdk-winml',
csharp: 'dotnet add package Microsoft.AI.Foundry.Local',
rust: 'cargo add foundry-local'
csharp_winml: 'dotnet add package Microsoft.AI.Foundry.Local.WinML',
rust: 'cargo add foundry-local-sdk',
rust_winml: 'cargo add foundry-local-sdk --features winml'
};

let copiedItem = $state<string | null>(null);
Expand Down Expand Up @@ -122,7 +126,7 @@

<DropdownMenu.Separator />
<DropdownMenu.Label class="text-muted-foreground text-xs font-normal">
Install SDK
Install SDK (Cross-Platform)
</DropdownMenu.Label>

<DropdownMenu.Group>
Expand Down Expand Up @@ -203,6 +207,89 @@
</button>
</DropdownMenu.Group>

<DropdownMenu.Separator />
<DropdownMenu.Label class="text-muted-foreground text-xs font-normal">
Install SDK (Windows + WinML hardware acceleration)
</DropdownMenu.Label>

<DropdownMenu.Group>
<button
type="button"
class="hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground relative flex min-h-[44px] w-full cursor-pointer select-none items-start justify-between rounded-sm px-2 py-2.5 text-left text-sm outline-none transition-colors"
onclick={() => copyToClipboard(commands.python_winml, 'python_winml')}
aria-label="Copy Python WinML SDK installation command"
>
<span class="mt-0.5 inline-flex shrink-0" aria-hidden="true">{@html PythonIcon}</span>
<div class="flex flex-1 flex-col gap-1 px-2">
<span class="font-medium">Python SDK <span class="text-xs text-muted-foreground">(WinML)</span></span>
<code class="text-muted-foreground break-all text-xs">{commands.python_winml}</code>
</div>
{#if copiedItem === 'python_winml'}
<Check class="size-4 shrink-0 text-green-600" aria-hidden="true" />
<span class="sr-only">Copied</span>
{:else}
<Copy class="size-4 shrink-0 opacity-50" aria-hidden="true" />
{/if}
</button>

<button
type="button"
class="hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground relative flex min-h-[44px] w-full cursor-pointer select-none items-start justify-between rounded-sm px-2 py-2.5 text-left text-sm outline-none transition-colors"
onclick={() => copyToClipboard(commands.javascript_winml, 'javascript_winml')}
aria-label="Copy JavaScript WinML SDK installation command"
>
<span class="mt-0.5 inline-flex shrink-0" aria-hidden="true">{@html JavaScriptIcon}</span>
<div class="flex flex-1 flex-col gap-1 px-2">
<span class="font-medium">JavaScript SDK <span class="text-xs text-muted-foreground">(WinML)</span></span>
<code class="text-muted-foreground break-all text-xs">{commands.javascript_winml}</code>
</div>
{#if copiedItem === 'javascript_winml'}
<Check class="size-4 shrink-0 text-green-600" aria-hidden="true" />
<span class="sr-only">Copied</span>
{:else}
<Copy class="size-4 shrink-0 opacity-50" aria-hidden="true" />
{/if}
</button>

<button
type="button"
class="hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground relative flex min-h-[44px] w-full cursor-pointer select-none items-start justify-between rounded-sm px-2 py-2.5 text-left text-sm outline-none transition-colors"
onclick={() => copyToClipboard(commands.csharp_winml, 'csharp_winml')}
aria-label="Copy C# WinML SDK installation command"
>
<span class="mt-0.5 inline-flex shrink-0" aria-hidden="true">{@html CSharpIcon}</span>
<div class="flex flex-1 flex-col gap-1 px-2">
<span class="font-medium">C# SDK <span class="text-xs text-muted-foreground">(WinML)</span></span>
<code class="text-muted-foreground break-all text-xs">{commands.csharp_winml}</code>
</div>
{#if copiedItem === 'csharp_winml'}
<Check class="size-4 shrink-0 text-green-600" aria-hidden="true" />
<span class="sr-only">Copied</span>
{:else}
<Copy class="size-4 shrink-0 opacity-50" aria-hidden="true" />
{/if}
</button>

<button
type="button"
class="hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground relative flex min-h-[44px] w-full cursor-pointer select-none items-start justify-between rounded-sm px-2 py-2.5 text-left text-sm outline-none transition-colors"
onclick={() => copyToClipboard(commands.rust_winml, 'rust_winml')}
aria-label="Copy Rust WinML SDK installation command"
>
<span class="mt-0.5 inline-flex shrink-0" aria-hidden="true">{@html RustIcon}</span>
<div class="flex flex-1 flex-col gap-1 px-2">
<span class="font-medium">Rust SDK <span class="text-xs text-muted-foreground">(WinML)</span></span>
<code class="text-muted-foreground break-all text-xs">{commands.rust_winml}</code>
</div>
{#if copiedItem === 'rust_winml'}
<Check class="size-4 shrink-0 text-green-600" aria-hidden="true" />
<span class="sr-only">Copied</span>
{:else}
<Copy class="size-4 shrink-0 opacity-50" aria-hidden="true" />
{/if}
</button>
</DropdownMenu.Group>

<DropdownMenu.Separator />

<DropdownMenu.Group>
Expand Down
28 changes: 17 additions & 11 deletions www/src/lib/components/home/features.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -98,23 +98,26 @@
<div
class="mt-auto overflow-hidden rounded-xl bg-gray-900 p-4 font-mono text-xs text-gray-300 dark:bg-black/40"
>
<div class="mb-1 text-emerald-400">// Initialize & Load</div>
<div class="mb-1 text-emerald-400">// Initialize, download, load & chat</div>
<div class="code-line code-line-1">
<span class="text-purple-400">const</span> manager =
<span class="text-purple-400">const</span> mgr =
<span class="text-blue-400">FoundryLocalManager</span>.<span class="text-yellow-300"
>create</span
>(config)
>({'{'} appName: <span class="text-amber-300">'my-app'</span> {'}'})
</div>
<div class="code-line code-line-2">
<span class="text-purple-400">const</span> model = manager.<span
class="text-yellow-300">getCatalog</span
>().<span class="text-yellow-300">getModel</span>(<span class="text-amber-300"
>'gpt-oss-20b'</span
<span class="text-purple-400">const</span> model = <span class="text-purple-400">await</span> mgr.<span
class="text-yellow-300">catalog</span
>.<span class="text-yellow-300">getModel</span>(<span class="text-amber-300"
>'qwen2.5-0.5b'</span
>)
</div>
<div class="code-line code-line-3">
<span class="text-purple-400">await</span>
model.<span class="text-yellow-300">load</span>()<span class="typing-cursor">|</span>
model.<span class="text-yellow-300">download</span>(); <span class="text-purple-400">await</span> model.<span class="text-yellow-300">load</span>()
</div>
<div class="code-line code-line-4">
<span class="text-purple-400">const</span> res = <span class="text-purple-400">await</span> model.<span class="text-yellow-300">createChatClient</span>().<span class="text-yellow-300">completeChat</span>(msgs)<span class="typing-cursor">|</span>
</div>
</div>
<style>
Expand All @@ -131,6 +134,9 @@
.code-line-3 {
animation-delay: 1.5s;
}
.code-line-4 {
animation-delay: 2.1s;
}
@keyframes typeIn {
from {
opacity: 0;
Expand Down Expand Up @@ -171,7 +177,7 @@
</div>
<h3 class="mb-2 text-2xl font-bold text-gray-900 dark:text-white">Hardware Optimized</h3>
<p class="mb-6 text-lg text-gray-600 dark:text-neutral-400">
We work directly with hardware vendors for maximum performance
Automatic execution provider management for maximum performance
</p>
<!-- Hardware acceleration visual with glowing cards -->
<div class="mt-auto grid grid-cols-3 gap-3">
Expand Down Expand Up @@ -235,7 +241,7 @@
</div>
<h3 class="mb-2 text-xl font-semibold text-gray-900 dark:text-white">Edge-Ready</h3>
<p class="text-gray-600 dark:text-neutral-400">
Works fully offline with no cloud dependencies
Works fully offline. ~20 MB runtime, no cloud dependencies
</p>
</div>
<!-- Dramatic wifi disconnect animation -->
Expand Down Expand Up @@ -429,7 +435,7 @@
OpenAI Compatible
</h3>
<p class="text-gray-600 dark:text-neutral-400">
Drop-in API replacement for easy integration
Native SDK API plus optional OpenAI-compatible REST server
</p>
</div>
<!-- Animated API comparison -->
Expand Down
4 changes: 2 additions & 2 deletions www/src/lib/components/home/footer.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
/>
</a>
<p class="max-w-xs text-sm text-muted-foreground">
Run AI models locally with the power of Microsoft's Azure AI technology.
Ship AI-powered applications with on-device inference. No cloud required.
</p>
<div class="mt-6">
<SocialMedia />
Expand All @@ -36,7 +36,7 @@
<ul class="space-y-3 text-sm">
<li>
<a
href="https://learn.microsoft.com/en-us/azure/ai-foundry/foundry-local/get-started"
href="https://learn.microsoft.com/en-us/azure/foundry-local/get-started"
target="_blank"
rel="noopener noreferrer"
class="text-muted-foreground transition-colors hover:text-foreground"
Expand Down
2 changes: 1 addition & 1 deletion www/src/lib/components/home/hero.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,7 @@
>
<Button
variant="outline"
href="https://learn.microsoft.com/en-us/azure/ai-foundry/foundry-local/get-started"
href="https://learn.microsoft.com/en-us/azure/foundry-local/get-started"
target="_blank"
rel="noopener noreferrer"
size="lg"
Expand Down
Loading
Loading