210 lines
14 KiB
PHP
210 lines
14 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" class="dark">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<title>{{ config('app.name', 'Embedd HUB') }} - Local embedding workbench</title>
|
|
|
|
@fonts
|
|
@vite(['resources/css/app.css', 'resources/js/app.js'])
|
|
</head>
|
|
<body class="min-h-screen bg-zinc-950 text-zinc-100 antialiased">
|
|
<div class="min-h-screen">
|
|
<header class="border-b border-white/10 bg-zinc-950/95">
|
|
<nav class="mx-auto flex max-w-7xl items-center justify-between gap-4 px-6 py-4 lg:px-8">
|
|
<a href="{{ route('home') }}" class="flex items-center gap-3" aria-label="{{ config('app.name', 'Embedd HUB') }}">
|
|
<span class="flex size-9 items-center justify-center rounded-lg bg-emerald-400 text-zinc-950">
|
|
<x-app-logo-icon class="size-5 fill-current" />
|
|
</span>
|
|
<span class="text-sm font-semibold">{{ config('app.name', 'Embedd HUB') }}</span>
|
|
</a>
|
|
|
|
<div class="flex items-center gap-2">
|
|
@auth
|
|
<a href="{{ route('dashboard') }}" class="rounded-lg bg-white px-4 py-2 text-sm font-medium text-zinc-950 transition hover:bg-zinc-200">
|
|
{{ __('Dashboard') }}
|
|
</a>
|
|
@else
|
|
@if (Route::has('login'))
|
|
<a href="{{ route('login') }}" class="rounded-lg px-4 py-2 text-sm font-medium text-zinc-300 transition hover:bg-white/10 hover:text-white">
|
|
{{ __('Sign in') }}
|
|
</a>
|
|
@endif
|
|
|
|
@if (Route::has('register'))
|
|
<a href="{{ route('register') }}" class="rounded-lg bg-white px-4 py-2 text-sm font-medium text-zinc-950 transition hover:bg-zinc-200">
|
|
{{ __('Create account') }}
|
|
</a>
|
|
@endif
|
|
@endauth
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
|
|
<main>
|
|
<section class="mx-auto grid max-w-7xl gap-10 px-6 py-12 lg:grid-cols-[minmax(0,0.9fr)_minmax(520px,1.1fr)] lg:items-center lg:px-8 lg:py-16">
|
|
<div class="max-w-2xl">
|
|
<p class="inline-flex rounded-lg border border-emerald-300/30 bg-emerald-300/10 px-3 py-1 text-sm font-medium text-emerald-200">
|
|
{{ __('Ollama, pgvector, and Livewire in one local workflow') }}
|
|
</p>
|
|
|
|
<h1 class="mt-6 text-4xl font-semibold tracking-normal text-white md:text-6xl">
|
|
{{ config('app.name', 'Embedd HUB') }}
|
|
</h1>
|
|
|
|
<p class="mt-5 max-w-xl text-lg leading-8 text-zinc-300">
|
|
{{ __('Generate embeddings, search stored phrases, and compare semantic proximity with a local Ollama provider and PostgreSQL vector storage.') }}
|
|
</p>
|
|
|
|
<div class="mt-8 flex flex-col gap-3 sm:flex-row">
|
|
@auth
|
|
<a href="{{ route('embeddings.embed') }}" class="rounded-lg bg-emerald-400 px-5 py-3 text-center text-sm font-semibold text-zinc-950 transition hover:bg-emerald-300">
|
|
{{ __('Open embedding tools') }}
|
|
</a>
|
|
@else
|
|
@if (Route::has('register'))
|
|
<a href="{{ route('register') }}" class="rounded-lg bg-emerald-400 px-5 py-3 text-center text-sm font-semibold text-zinc-950 transition hover:bg-emerald-300">
|
|
{{ __('Start exploring') }}
|
|
</a>
|
|
@endif
|
|
|
|
@if (Route::has('login'))
|
|
<a href="{{ route('login') }}" class="rounded-lg border border-white/15 px-5 py-3 text-center text-sm font-semibold text-white transition hover:bg-white/10">
|
|
{{ __('Sign in') }}
|
|
</a>
|
|
@endif
|
|
@endauth
|
|
</div>
|
|
|
|
<dl class="mt-10 grid max-w-xl grid-cols-3 gap-3">
|
|
<div class="rounded-lg border border-white/10 bg-white/5 p-4">
|
|
<dt class="text-xs font-medium text-zinc-400">{{ __('Tools') }}</dt>
|
|
<dd class="mt-2 text-2xl font-semibold text-white">3</dd>
|
|
</div>
|
|
<div class="rounded-lg border border-white/10 bg-white/5 p-4">
|
|
<dt class="text-xs font-medium text-zinc-400">{{ __('Provider') }}</dt>
|
|
<dd class="mt-2 text-2xl font-semibold text-white">{{ __('Local') }}</dd>
|
|
</div>
|
|
<div class="rounded-lg border border-white/10 bg-white/5 p-4">
|
|
<dt class="text-xs font-medium text-zinc-400">{{ __('Storage') }}</dt>
|
|
<dd class="mt-2 text-2xl font-semibold text-white">{{ __('Vector') }}</dd>
|
|
</div>
|
|
</dl>
|
|
</div>
|
|
|
|
<div class="rounded-lg border border-white/10 bg-zinc-900 shadow-2xl shadow-black/40">
|
|
<div class="flex items-center justify-between gap-4 border-b border-white/10 px-4 py-3">
|
|
<div class="flex items-center gap-2">
|
|
<span class="size-2 rounded-full bg-red-400"></span>
|
|
<span class="size-2 rounded-full bg-amber-300"></span>
|
|
<span class="size-2 rounded-full bg-emerald-300"></span>
|
|
</div>
|
|
<div class="rounded-md border border-emerald-300/20 bg-emerald-300/10 px-2 py-1 text-xs font-medium text-emerald-200">
|
|
{{ __('Ollama online') }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="grid gap-0 lg:grid-cols-[0.85fr_1.15fr]">
|
|
<aside class="border-b border-white/10 p-4 lg:border-b-0 lg:border-r">
|
|
<div class="space-y-3">
|
|
<div class="rounded-lg border border-white/10 bg-zinc-950 p-3">
|
|
<p class="text-xs font-medium text-zinc-400">{{ __('Selected model') }}</p>
|
|
<p class="mt-2 text-sm font-semibold text-white">nomic-embed-text</p>
|
|
<p class="mt-1 text-xs text-zinc-500">768 {{ __('dimensions') }}</p>
|
|
</div>
|
|
|
|
<div class="rounded-lg border border-white/10 bg-zinc-950 p-3">
|
|
<p class="text-xs font-medium text-zinc-400">{{ __('Stored phrases') }}</p>
|
|
<div class="mt-3 flex items-end justify-between gap-3">
|
|
<span class="text-3xl font-semibold text-white">1,284</span>
|
|
<span class="rounded-md bg-sky-400/10 px-2 py-1 text-xs font-medium text-sky-200">{{ __('pgvector') }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-lg border border-white/10 bg-zinc-950 p-3">
|
|
<p class="text-xs font-medium text-zinc-400">{{ __('Recent usage') }}</p>
|
|
<div class="mt-3 grid h-20 grid-cols-7 items-end gap-1">
|
|
<span class="h-6 rounded-t bg-emerald-300/50"></span>
|
|
<span class="h-10 rounded-t bg-sky-300/60"></span>
|
|
<span class="h-8 rounded-t bg-amber-300/60"></span>
|
|
<span class="h-14 rounded-t bg-emerald-300/70"></span>
|
|
<span class="h-11 rounded-t bg-sky-300/60"></span>
|
|
<span class="h-16 rounded-t bg-emerald-300"></span>
|
|
<span class="h-9 rounded-t bg-amber-300/70"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
<section class="p-4">
|
|
<div class="flex flex-wrap items-center gap-2">
|
|
<span class="rounded-md bg-white px-3 py-1 text-xs font-semibold text-zinc-950">{{ __('Embed') }}</span>
|
|
<span class="rounded-md border border-white/10 px-3 py-1 text-xs font-medium text-zinc-300">{{ __('Search') }}</span>
|
|
<span class="rounded-md border border-white/10 px-3 py-1 text-xs font-medium text-zinc-300">{{ __('Compare') }}</span>
|
|
</div>
|
|
|
|
<div class="mt-4 rounded-lg border border-white/10 bg-zinc-950 p-4">
|
|
<p class="text-xs font-medium text-zinc-400">{{ __('Input phrases') }}</p>
|
|
<div class="mt-3 space-y-2 text-sm text-zinc-200">
|
|
<div class="rounded-md border border-white/10 bg-white/5 px-3 py-2">{{ __('fast semantic search') }}</div>
|
|
<div class="rounded-md border border-white/10 bg-white/5 px-3 py-2">{{ __('local vector database') }}</div>
|
|
<div class="rounded-md border border-white/10 bg-white/5 px-3 py-2">{{ __('embedding comparison') }}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-4 overflow-hidden rounded-lg border border-white/10">
|
|
<div class="grid grid-cols-[1fr_auto_auto] gap-3 bg-white/5 px-3 py-2 text-xs font-medium text-zinc-400">
|
|
<span>{{ __('Phrase') }}</span>
|
|
<span>{{ __('Similarity') }}</span>
|
|
<span>{{ __('Distance') }}</span>
|
|
</div>
|
|
<div class="divide-y divide-white/10 text-sm">
|
|
<div class="grid grid-cols-[1fr_auto_auto] gap-3 px-3 py-3">
|
|
<span class="text-white">{{ __('fast semantic search') }}</span>
|
|
<span class="font-medium text-emerald-200">0.982</span>
|
|
<span class="text-zinc-400">0.018</span>
|
|
</div>
|
|
<div class="grid grid-cols-[1fr_auto_auto] gap-3 px-3 py-3">
|
|
<span class="text-white">{{ __('embedding comparison') }}</span>
|
|
<span class="font-medium text-sky-200">0.741</span>
|
|
<span class="text-zinc-400">0.259</span>
|
|
</div>
|
|
<div class="grid grid-cols-[1fr_auto_auto] gap-3 px-3 py-3">
|
|
<span class="text-white">{{ __('local vector database') }}</span>
|
|
<span class="font-medium text-amber-200">0.604</span>
|
|
<span class="text-zinc-400">0.396</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="border-y border-white/10 bg-white text-zinc-950 dark:bg-zinc-900 dark:text-zinc-100">
|
|
<div class="mx-auto grid max-w-7xl gap-4 px-6 py-10 md:grid-cols-3 lg:px-8">
|
|
<article class="rounded-lg border border-zinc-200 bg-zinc-50 p-5 dark:border-white/10 dark:bg-white/5">
|
|
<p class="text-sm font-semibold text-emerald-700 dark:text-emerald-300">{{ __('Generate') }}</p>
|
|
<h2 class="mt-3 text-xl font-semibold">{{ __('Inspect raw embeddings') }}</h2>
|
|
<p class="mt-3 text-sm leading-6 text-zinc-600 dark:text-zinc-300">{{ __('Paste words or phrases, generate vectors, and inspect previews before storing them.') }}</p>
|
|
</article>
|
|
|
|
<article class="rounded-lg border border-zinc-200 bg-zinc-50 p-5 dark:border-white/10 dark:bg-white/5">
|
|
<p class="text-sm font-semibold text-sky-700 dark:text-sky-300">{{ __('Search') }}</p>
|
|
<h2 class="mt-3 text-xl font-semibold">{{ __('Find similar stored text') }}</h2>
|
|
<p class="mt-3 text-sm leading-6 text-zinc-600 dark:text-zinc-300">{{ __('Query your saved embeddings and rank matching phrases by semantic similarity.') }}</p>
|
|
</article>
|
|
|
|
<article class="rounded-lg border border-zinc-200 bg-zinc-50 p-5 dark:border-white/10 dark:bg-white/5">
|
|
<p class="text-sm font-semibold text-amber-700 dark:text-amber-300">{{ __('Compare') }}</p>
|
|
<h2 class="mt-3 text-xl font-semibold">{{ __('Read pairwise proximity') }}</h2>
|
|
<p class="mt-3 text-sm leading-6 text-zinc-600 dark:text-zinc-300">{{ __('Enter multiple phrases and review clear phrase-to-phrase scores in a matrix and sorted pair list.') }}</p>
|
|
</article>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
</div>
|
|
</body>
|
|
</html>
|