{% extends "base.html" %}
{% block title %}About — WebFind{% endblock %}
{% block content %}
<div class="flex-1 px-4 py-16">
<div class="max-w-3xl mx-auto">
<h1 class="text-4xl font-extrabold mb-6">
<span class="bg-clip-text text-transparent bg-gradient-to-r from-cyan-400 to-blue-500">About WebFind</span>
</h1>
<div class="space-y-6 text-slate-300 leading-relaxed">
<p>
WebFind is a self-hosted, native search engine designed for AI agents and privacy-conscious users.
Unlike cloud search APIs, WebFind runs entirely on your infrastructure: it crawls the web, builds a local
knowledge graph in SurrealDB, indexes content with BM25 + vector search, and ranks pages using
freshness, quality, and graph signals.
</p>
<p>
The GUI you are using is a Google-style search experience powered by
<a href="https://htmx.org" target="_blank" rel="noopener" class="text-cyan-400 hover:underline">HTMX</a> and
<a href="https://tailwindcss.com" target="_blank" rel="noopener" class="text-cyan-400 hover:underline">Tailwind CSS v4</a>.
There is no AI in the search box itself; every query researches the live web behind the scenes and stores
the results for future recall.
</p>
<p>
WebFind is open source. You host it, you control it, you own the data.
</p>
</div>
<div class="mt-10 p-6 rounded-2xl border border-slate-800 bg-slate-900/50">
<h2 class="text-xl font-semibold text-white mb-4">Connect with the creator</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<a href="https://www.gauravwankhede.com" target="_blank" rel="noopener" class="flex items-center gap-3 p-4 rounded-xl bg-slate-900 border border-slate-800 hover:border-cyan-500/50 transition">
<span class="text-2xl">🌐</span>
<div>
<p class="font-medium text-slate-100">Portfolio</p>
<p class="text-xs text-slate-500">gauravwankhede.com</p>
</div>
</a>
<a href="https://x.com/GauravWankhedeX" target="_blank" rel="noopener" class="flex items-center gap-3 p-4 rounded-xl bg-slate-900 border border-slate-800 hover:border-cyan-500/50 transition">
<span class="text-2xl">𝕏</span>
<div>
<p class="font-medium text-slate-100">X / Twitter</p>
<p class="text-xs text-slate-500">@GauravWankhedeX</p>
</div>
</a>
<a href="https://www.youtube.com/@GauravWankhede-TECHVERSE" target="_blank" rel="noopener" class="flex items-center gap-3 p-4 rounded-xl bg-slate-900 border border-slate-800 hover:border-cyan-500/50 transition">
<span class="text-2xl">▶️</span>
<div>
<p class="font-medium text-slate-100">YouTube</p>
<p class="text-xs text-slate-500">@GauravWankhede-TECHVERSE</p>
</div>
</a>
<a href="https://www.linkedin.com/in/wankhede-gaurav/" target="_blank" rel="noopener" class="flex items-center gap-3 p-4 rounded-xl bg-slate-900 border border-slate-800 hover:border-cyan-500/50 transition">
<span class="text-2xl">in</span>
<div>
<p class="font-medium text-slate-100">LinkedIn</p>
<p class="text-xs text-slate-500">in/wankhede-gaurav</p>
</div>
</a>
</div>
</div>
<p class="mt-8 text-center text-lg text-cyan-400 font-medium">
Hire me if You could afford me.
</p>
</div>
</div>
{% endblock %}