Skip to content

Commit eecf254

Browse files
jamestheakstonjamestheakston
authored
Create vaultapi.pages.dev
1 parent 6172ee4 commit eecf254

File tree

1 file changed

+145
-0
lines changed

1 file changed

+145
-0
lines changed

‎blog/vaultapi.pages.dev‎

Lines changed: 145 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>The Vault is Live: Portable Identity Across the Web | Blog</title>
7+
<meta name="description" content="LinkStack Vault is officially live. Learn how we are building the foundation for websites to display your data across the internet after our rebrand.">
8+
<meta name="author" content="James Theakston">
9+
<meta name="robots" content="index, follow">
10+
11+
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polygon points='12 2 2 7 12 12 22 7 12 2'/><polyline points='2 17 12 22 22 17'/><polyline points='2 12 12 17 22 12'/></svg>">
12+
13+
<script src="https://cdn.tailwindcss.com"></script>
14+
<script src="https://unpkg.com/feather-icons"></script>
15+
<style>
16+
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;700;800&display=swap');
17+
body { font-family: 'Plus Jakarta Sans', sans-serif; }
18+
.glass { background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, 0.1); }
19+
.gradient-text { background: linear-gradient(135deg, #6366f1 0%, #a855f7 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
20+
</style>
21+
</head>
22+
<body class="bg-slate-50 text-slate-900 antialiased">
23+
24+
<nav class="fixed top-0 w-full z-50 glass border-b border-slate-200 py-4 px-8 flex justify-between items-center">
25+
<div class="flex items-center gap-2 font-black text-2xl text-indigo-600 cursor-pointer" onclick="location.href='/dashboard/backup.html'">
26+
<i data-feather="layers"></i><span>LinkStack</span>
27+
</div>
28+
<div class="flex items-center gap-4">
29+
<button onclick="location.href='/dashboard/backup.html'" class="px-6 py-2 bg-indigo-600 text-white rounded-xl text-sm font-bold shadow-lg shadow-indigo-100 hover:scale-105 transition">Back to Vault</button>
30+
</div>
31+
</nav>
32+
33+
<main class="pt-32 pb-20 px-6">
34+
<article class="max-w-3xl mx-auto">
35+
<header class="mb-12">
36+
<div class="flex items-center gap-3 mb-6">
37+
<span class="px-3 py-1 rounded-full bg-emerald-50 text-emerald-600 text-xs font-black uppercase tracking-widest">Live Today</span>
38+
<span class="text-slate-400 text-xs font-bold">February 7, 2026</span>
39+
</div>
40+
<h1 class="text-5xl md:text-6xl font-black mb-8 tracking-tighter leading-tight">
41+
The Vault is <span class="gradient-text">Open.</span> Your identity is now portable.
42+
</h1>
43+
<p class="text-xl text-slate-500 font-medium leading-relaxed mb-8">
44+
Today we launch the LinkStack Vault, giving you total ownership of your data. But this is just the beginning of a truly connected ecosystem.
45+
</p>
46+
</header>
47+
48+
<div class="aspect-video w-full bg-indigo-600 rounded-[2.5rem] mb-12 flex items-center justify-center text-white overflow-hidden relative shadow-2xl shadow-indigo-200">
49+
<div class="absolute inset-0 opacity-20">
50+
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
51+
<defs>
52+
<pattern id="grid" width="40" height="40" patternUnits="userSpaceOnUse">
53+
<path d="M 40 0 L 0 0 0 40" fill="none" stroke="currentColor" stroke-width="1"/>
54+
</pattern>
55+
</defs>
56+
<rect width="100%" height="100%" fill="url(#grid)" />
57+
</svg>
58+
</div>
59+
<div class="relative flex flex-col items-center gap-4 text-center px-4">
60+
<div class="w-20 h-20 bg-white text-indigo-600 rounded-3xl flex items-center justify-center shadow-2xl mb-2">
61+
<i data-feather="share-2" class="w-10 h-10"></i>
62+
</div>
63+
<h2 class="text-3xl font-black tracking-tight">Vault Protocol V1</h2>
64+
<p class="font-bold text-indigo-100 tracking-widest uppercase text-xs">Portable Data • Decoupled Identity</p>
65+
</div>
66+
</div>
67+
68+
<div class="prose prose-slate prose-lg max-w-none space-y-8 text-slate-600 leading-relaxed">
69+
<p>
70+
Ownership of data is more than just having a backup; it's about the ability to move that data wherever you need it. Today's launch of the <strong>LinkStack Vault</strong> provides the security layer for your digital identity, but the future we are building is much larger.
71+
</p>
72+
73+
<h2 class="text-3xl font-black text-slate-900 tracking-tight">Beyond the Dashboard</h2>
74+
<p>
75+
We believe your LinkStack profile should live everywhere you do. We are currently developing a suite of upcoming protocols—<strong>GET and POST</strong>—that will allow external websites to request authorization from you directly.
76+
</p>
77+
78+
<p>
79+
Imagine landing on a personal portfolio site or a new social tool and being able to "Connect with LinkStack." Once authorized, that website can programmatically export your public data from the Vault and display your links, bio, and social graph natively within their own design.
80+
</p>
81+
82+
<div class="bg-white p-8 rounded-[2rem] border border-slate-100 shadow-sm my-12">
83+
<h3 class="text-xl font-bold text-slate-900 mb-6">Upcoming Architecture Features</h3>
84+
<ul class="space-y-6">
85+
<li class="flex gap-4">
86+
<div class="w-10 h-10 rounded-2xl bg-indigo-50 text-indigo-600 flex-shrink-0 flex items-center justify-center">
87+
<i data-feather="repeat" class="w-5 h-5"></i>
88+
</div>
89+
<div>
90+
<span class="block font-black text-slate-900 uppercase text-xs tracking-widest">Post-Rebrand Release</span>
91+
<span class="text-sm"><strong>The API & Auth Layer:</strong> Programmatic access will officially launch following our transition to LinkLayer. <a href="../blog/rebrand.html" class="text-indigo-600 font-bold hover:underline underline-offset-4 ml-1 inline-flex items-center gap-1">Learn more <i data-feather="arrow-right" class="w-3 h-3"></i></a></span>
92+
</div>
93+
</li>
94+
<li class="flex gap-4">
95+
<div class="w-10 h-10 rounded-2xl bg-emerald-50 text-emerald-600 flex-shrink-0 flex items-center justify-center">
96+
<i data-feather="external-link" class="w-5 h-5"></i>
97+
</div>
98+
<div>
99+
<span class="block font-black text-slate-900 uppercase text-xs tracking-widest">Interoperability</span>
100+
<span class="text-sm"><strong>Cross-Site Display:</strong> Developers will soon be able to fetch your data via GET requests to build custom integrations that showcase your identity anywhere on the web.</span>
101+
</div>
102+
</li>
103+
</ul>
104+
</div>
105+
106+
<h2 class="text-3xl font-black text-slate-900 tracking-tight">Wait for the Key</h2>
107+
<p>
108+
While the full API suite isn't out yet, the infrastructure is being laid today. By using the Vault now, you are readying your identity for the next generation of the web—one where you are the sole gatekeeper of your information.
109+
</p>
110+
111+
<p>
112+
For now, explore the new manual export and restore features in your dashboard. Your data is officially in your hands.
113+
</p>
114+
115+
<div class="pt-12 border-t border-slate-100 flex items-center gap-6">
116+
<div class="relative">
117+
<div class="w-16 h-16 rounded-2xl bg-slate-100 flex items-center justify-center text-slate-400 border border-slate-200">
118+
<i data-feather="user" class="w-8 h-8"></i>
119+
</div>
120+
</div>
121+
<div>
122+
<h4 class="font-black text-lg text-slate-900 leading-none mb-1">James Theakston</h4>
123+
<p class="text-xs text-indigo-600 font-bold uppercase tracking-wider">Founder & CEO, LinkStack</p>
124+
</div>
125+
</div>
126+
</div>
127+
</article>
128+
</main>
129+
130+
<footer class="bg-white border-t border-slate-200 py-12 px-8">
131+
<div class="max-w-3xl mx-auto flex flex-col md:flex-row justify-between items-center gap-6">
132+
<div class="flex items-center gap-2 font-black text-xl text-indigo-600">
133+
<i data-feather="layers"></i><span>LinkStack</span>
134+
</div>
135+
<p class="text-slate-400 text-sm font-bold">© 2026 James Theakston</p>
136+
</div>
137+
</footer>
138+
139+
<script>
140+
window.onload = () => {
141+
feather.replace();
142+
};
143+
</script>
144+
</body>
145+
</html>

0 commit comments

Comments
 (0)