(landing) added Closets section
This commit is contained in:
@@ -6,21 +6,21 @@
|
|||||||
<div>
|
<div>
|
||||||
<span class="eyebrow">the method of loci, updated</span>
|
<span class="eyebrow">the method of loci, updated</span>
|
||||||
<h2 class="display">
|
<h2 class="display">
|
||||||
Wings. Rooms. <em>Drawers.</em>
|
Wings. Rooms. Closets. <em>Drawers.</em>
|
||||||
</h2>
|
</h2>
|
||||||
</div>
|
</div>
|
||||||
<p class="lede">
|
<p class="lede">
|
||||||
An ancient memory technique, reworked for a machine. Broad categories
|
An ancient memory technique, reworked for a machine. Broad categories
|
||||||
nest time-based groupings; time-based groupings hold verbatim drawers.
|
nest time-based groupings; time-based groupings bundle topics; topics
|
||||||
A symbolic index lets the model scan thousands of drawers in a single
|
hold verbatim drawers. A symbolic index lets the model scan thousands
|
||||||
pass and open only the ones it needs.
|
of drawers in a single pass and open only the ones it needs.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="anatomy-diagram">
|
<div class="anatomy-diagram">
|
||||||
<article class="stratum">
|
<article class="stratum">
|
||||||
<span class="n">W — wing</span>
|
<span class="n">W — wing</span>
|
||||||
<h3>The <em>Wing</em></h3>
|
<h3>The <em>Wings</em></h3>
|
||||||
<p class="sub">people · projects · topics</p>
|
<p class="sub">people · projects · topics</p>
|
||||||
<p>A broad region of the palace, keyed to a real entity — a person by name, a project by codename, a domain of your life. Entity-first, always.</p>
|
<p>A broad region of the palace, keyed to a real entity — a person by name, a project by codename, a domain of your life. Entity-first, always.</p>
|
||||||
<div class="diagram">
|
<div class="diagram">
|
||||||
@@ -36,7 +36,7 @@
|
|||||||
|
|
||||||
<article class="stratum">
|
<article class="stratum">
|
||||||
<span class="n">R — room</span>
|
<span class="n">R — room</span>
|
||||||
<h3>The <em>Room</em></h3>
|
<h3>The <em>Rooms</em></h3>
|
||||||
<p class="sub">days · sessions · threads</p>
|
<p class="sub">days · sessions · threads</p>
|
||||||
<p>Inside a wing sit rooms — discrete units of time. One room per day, or one per session. Walk the corridor and the palace unfolds chronologically, room by room.</p>
|
<p>Inside a wing sit rooms — discrete units of time. One room per day, or one per session. Walk the corridor and the palace unfolds chronologically, room by room.</p>
|
||||||
<div class="diagram">
|
<div class="diagram">
|
||||||
@@ -50,9 +50,32 @@
|
|||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
|
<article class="stratum">
|
||||||
|
<span class="n">C — closet</span>
|
||||||
|
<h3>The <em>Closets</em></h3>
|
||||||
|
<p class="sub">topics · threads · bundles</p>
|
||||||
|
<p>Inside a room, closets group related drawers by topic or thread. Open one closet and you see every drawer on that subject together — no need to walk the whole room.</p>
|
||||||
|
<div class="diagram">
|
||||||
|
<svg viewBox="0 0 200 80" fill="none" stroke="currentColor" stroke-width="1" style="color:var(--prism);">
|
||||||
|
<rect x="10" y="14" width="54" height="52" />
|
||||||
|
<rect x="73" y="14" width="54" height="52" />
|
||||||
|
<rect x="136" y="14" width="54" height="52" />
|
||||||
|
<line x1="37" y1="14" x2="37" y2="66" opacity="0.5"/>
|
||||||
|
<line x1="100" y1="14" x2="100" y2="66" opacity="0.5"/>
|
||||||
|
<line x1="163" y1="14" x2="163" y2="66" opacity="0.5"/>
|
||||||
|
<circle cx="33" cy="40" r="1.2" fill="currentColor"/>
|
||||||
|
<circle cx="41" cy="40" r="1.2" fill="currentColor"/>
|
||||||
|
<circle cx="96" cy="40" r="1.2" fill="currentColor"/>
|
||||||
|
<circle cx="104" cy="40" r="1.2" fill="currentColor"/>
|
||||||
|
<circle cx="159" cy="40" r="1.2" fill="currentColor"/>
|
||||||
|
<circle cx="167" cy="40" r="1.2" fill="currentColor"/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
<article class="stratum">
|
<article class="stratum">
|
||||||
<span class="n">D — drawer</span>
|
<span class="n">D — drawer</span>
|
||||||
<h3>The <em>Drawer</em></h3>
|
<h3>The <em>Drawers</em></h3>
|
||||||
<p class="sub">verbatim · permanent · exact</p>
|
<p class="sub">verbatim · permanent · exact</p>
|
||||||
<p>Each room holds drawers. A drawer is a single chunk of verbatim content — the exact words, untouched. The palace's promise is kept here.</p>
|
<p>Each room holds drawers. A drawer is a single chunk of verbatim content — the exact words, untouched. The palace's promise is kept here.</p>
|
||||||
<div class="diagram">
|
<div class="diagram">
|
||||||
|
|||||||
@@ -31,7 +31,7 @@ body.mempalace-active { overflow-x: hidden; }
|
|||||||
--hair: rgba(158, 216, 255, 0.14);
|
--hair: rgba(158, 216, 255, 0.14);
|
||||||
--hair-strong: rgba(158, 216, 255, 0.28);
|
--hair-strong: rgba(158, 216, 255, 0.28);
|
||||||
--ice: #EAF4FF;
|
--ice: #EAF4FF;
|
||||||
--ice-dim: #B8C7D9;
|
--ice-dim: #aabbcf;
|
||||||
--ice-ghost: rgba(234, 244, 255, 0.56);
|
--ice-ghost: rgba(234, 244, 255, 0.56);
|
||||||
--prism: #9ED8FF;
|
--prism: #9ED8FF;
|
||||||
--prism-core: #4AA3FF;
|
--prism-core: #4AA3FF;
|
||||||
@@ -156,8 +156,8 @@ body.mempalace-active { overflow-x: hidden; }
|
|||||||
.mempalace-landing .display em { font-style: italic; color: var(--prism); }
|
.mempalace-landing .display em { font-style: italic; color: var(--prism); }
|
||||||
.mempalace-landing .lede {
|
.mempalace-landing .lede {
|
||||||
font-family: var(--f-display);
|
font-family: var(--f-display);
|
||||||
font-style: italic;
|
/* font-style: italic; */
|
||||||
font-weight: 300;
|
font-weight: 400;
|
||||||
color: var(--ice-dim);
|
color: var(--ice-dim);
|
||||||
font-size: clamp(1.2rem, 1.8vw, 1.55rem);
|
font-size: clamp(1.2rem, 1.8vw, 1.55rem);
|
||||||
line-height: 1.45;
|
line-height: 1.45;
|
||||||
@@ -813,16 +813,19 @@ body.mempalace-active { overflow-x: hidden; }
|
|||||||
.mempalace-landing .anatomy-diagram {
|
.mempalace-landing .anatomy-diagram {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(3, 1fr);
|
grid-template-columns: repeat(4, 1fr);
|
||||||
gap: clamp(1rem, 3vw, 2.5rem);
|
gap: clamp(1rem, 2.2vw, 1.75rem);
|
||||||
padding: 2rem 0;
|
padding: 2rem 0;
|
||||||
}
|
}
|
||||||
|
@media (max-width: 1200px) {
|
||||||
|
.mempalace-landing .anatomy-diagram { grid-template-columns: repeat(2, 1fr); }
|
||||||
|
}
|
||||||
.mempalace-landing .stratum {
|
.mempalace-landing .stratum {
|
||||||
position: relative;
|
position: relative;
|
||||||
border: var(--rule) solid var(--hair);
|
border: var(--rule) solid var(--hair);
|
||||||
padding: 2rem 1.5rem;
|
padding: 1.75rem 1.25rem;
|
||||||
background: linear-gradient(180deg, rgba(17,21,28,0.6), rgba(10,13,18,0.2));
|
background: linear-gradient(180deg, rgba(17,21,28,0.6), rgba(10,13,18,0.2));
|
||||||
min-height: 360px;
|
min-height: 340px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
transition: border-color 0.4s ease, transform 0.4s ease;
|
transition: border-color 0.4s ease, transform 0.4s ease;
|
||||||
@@ -845,9 +848,9 @@ body.mempalace-active { overflow-x: hidden; }
|
|||||||
.mempalace-landing .stratum h3 {
|
.mempalace-landing .stratum h3 {
|
||||||
font-family: var(--f-display);
|
font-family: var(--f-display);
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 2.4rem;
|
font-size: clamp(1.75rem, 2vw, 2.1rem);
|
||||||
letter-spacing: -0.01em;
|
letter-spacing: -0.01em;
|
||||||
margin: 1.5rem 0 0.25rem;
|
margin: 1.25rem 0 0.25rem;
|
||||||
color: var(--ice);
|
color: var(--ice);
|
||||||
}
|
}
|
||||||
.mempalace-landing .stratum h3 em { font-style: italic; color: var(--prism); font-weight: 300; }
|
.mempalace-landing .stratum h3 em { font-style: italic; color: var(--prism); font-weight: 300; }
|
||||||
|
|||||||
@@ -50,7 +50,7 @@ onMounted(() => {
|
|||||||
try { data = await res.json() } catch (_) { /* no body */ }
|
try { data = await res.json() } catch (_) { /* no body */ }
|
||||||
|
|
||||||
if (res.ok) {
|
if (res.ok) {
|
||||||
setState('success', (data && data.message) || "You're on the list! We'll be in touch.")
|
setState('success', (data && data.message) || "Success! You're on the list for updates.")
|
||||||
// keep inputs disabled so they can't resubmit accidentally
|
// keep inputs disabled so they can't resubmit accidentally
|
||||||
input.value = email
|
input.value = email
|
||||||
return
|
return
|
||||||
|
|||||||
Reference in New Issue
Block a user