Skip to content

Commit 06e71ff

Browse files
robertDurstrobertDurst
committed
init notes
1 parent a96991d commit 06e71ff

9 files changed

Lines changed: 306 additions & 6 deletions

File tree

‎.github/workflows/scribble.yml‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,14 @@ jobs:
3737
cp *.html ../_site/
3838
cp *.css *.png *.svg ../_site/ 2>/dev/null || true
3939
cp -r slides ../_site/ 2>/dev/null || true
40+
# Notes: html + any image/video assets dropped alongside entries
41+
mkdir -p ../_site/notes
42+
cp notes/*.html ../_site/notes/ 2>/dev/null || true
43+
find notes -mindepth 1 -type f \
44+
\( -name '*.jpg' -o -name '*.jpeg' -o -name '*.png' \
45+
-o -name '*.gif' -o -name '*.webp' -o -name '*.svg' \
46+
-o -name '*.mp4' -o -name '*.webm' \) \
47+
-exec cp --parents {} ../_site/ \; 2>/dev/null || true
4048
cp ../CNAME ../_site/
4149
4250
- name: Setup Pages

‎docs/index.html.pm‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,14 @@ Founded by ◊link["https://www.linkedin.com/in/robertdurst/"]{Rob Durst} in 202
1010

1111
◊project["https://caffeine-lang.run/" "Caffeine" "Active Development" "https://caffeine-lang.run/images/temp_caffeine_icon.png" "Gleam" "https://gleam.run/"]{A programming language for generating reliability artifacts from service expectation definitions. Grounded in assume/guarantee contracts, Caffeine helps developers and AI agents assert reasonable system construction at design time ◊em{and} in production. We ◊link["/status"]{dogfood it} here.}
1212

13+
◊h2{Notes}
14+
15+
◊note-list{
16+
◊note["2026-05-31" "/notes/2026-05-31-caffeine-relays.html"]{New Caffeine Feature: Relays}
17+
}
18+
19+
◊small{◊link["/notes"]{all notes →}}
20+
1321
◊h2{Speaking}
1422

1523
◊ul{

‎docs/index.ptree‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,5 @@
33
index.html
44
manifesto.html
55
status.html
6+
notes/index.html
7+
notes/2026-05-31-hello.html

‎docs/notes/2026-05-31-caffeine-relays.html.pm‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
#lang pollen
2+
3+
◊(define-meta title "A New Feature Coming Soon to Caffeine: Relays")
4+
◊(define-meta body-class "notebook")
5+
6+
◊note-meta["2026-05-31"]
7+
8+
◊h2{Two Birds One Stone}
9+
10+
As we have been using Caffeine the past few months, a couple challenges have come up. ◊aside{Rob actually changed jobs at the end of April, so we now know of two companies using Caffeine!}
11+
12+
◊ol{
13+
◊li{Datadog query syntax is not formally defined}
14+
◊li{The "integrate the metric" and then use it with Caffeine is likely a common scenario.}
15+
}
16+
17+
We believe that if we actually shift left and introduce Caffeine earlier in the observability operations process, we can solve both of these. Thus, we introduce ◊pink{relays}: an artifact that connects metrics from one system to another and serves as the measurement within Caffeine.
18+
19+
The specific relay we are starting with is Langfuse to Datadog. By setting this up, we would then know what the Datadog query looks like ahead of time and thus the user would not actually need to write a query themselves, just their intent!
20+
21+
◊h2{Syntax}
22+
23+
◊code-block{
24+
"langfuse_to_datadog" (Relay):
25+
from "langfuse"
26+
to "datadog"
27+
every 15m
28+
metric_prefix "langfuse.scores"
29+
scorers {
30+
"helpfulness": Numeric,
31+
"safe": Boolean
32+
}
33+
}
34+
35+
◊h2{The Artifact}
36+
37+
◊h2{A Full Example}
38+
39+
More soon.

‎docs/notes/index.html.pm‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
#lang pollen
2+
3+
◊(define-meta title "Notes")
4+
5+
◊cyan{Lab notebook — short, frequent, in-progress. Build-in-public energy: raw sketches, things I'm currently figuring out.}
6+
7+
◊note-list{
8+
◊note["2026-05-31" "/notes/2026-05-31-caffeine-relays.html"]{New Caffeine Feature: Relays}
9+
}

‎docs/notes/index.ptree‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
#lang pollen
2+
3+
2026-05-31-hello.html

‎docs/pollen.rkt‎

Lines changed: 63 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
#lang racket/base
22

3-
(require pollen/decode pollen/tag txexpr)
3+
(require pollen/decode pollen/tag txexpr racket/string)
44
(provide (all-defined-out))
55

66
(module setup racket/base
@@ -52,3 +52,65 @@
5252
(iframe ((src ,src)
5353
(title "Brickell Research status dashboard")
5454
(loading "lazy")))))
55+
56+
;; -------- Notebook tags --------
57+
58+
;; Right-margin aside (becomes inline callout on narrow screens)
59+
(define (aside . body)
60+
`(aside ,@body))
61+
62+
;; Aside with vertical alignment to a nearby paragraph: ◊aside-up[2]{...}
63+
(define (aside-up n . body)
64+
`(aside ((class "move-up") (style ,(format "--move-up: ~a" n))) ,@body))
65+
66+
;; Figure — clean cyan-framed media. Use for diagrams, screenshots, charts.
67+
(define (figure src . caption)
68+
`(figure (img ((src ,src) (alt "")))
69+
(figcaption ,@caption)))
70+
71+
;; Sketch — "photo of paper" variant with offset pink-tinted shadow.
72+
(define (sketch src . caption)
73+
`(figure ((class "sketch"))
74+
(img ((src ,src) (alt "")))
75+
(figcaption ,@caption)))
76+
77+
;; Video demo — autoplays muted, loops, playsinline. Use for screen recordings.
78+
(define (video src)
79+
`(figure (video ((src ,src) (controls "") (playsinline "")
80+
(preload "metadata") (muted "") (loop "")))))
81+
82+
;; Per-note byline + backlink, dropped at the top of every entry.
83+
(define (note-meta date)
84+
`(p ((class "note-meta"))
85+
(time ((datetime ,date)) ,date)
86+
" · "
87+
(a ((href "/notes")) "← all notes")))
88+
89+
;; A single entry in a dated note list — used on both /notes and the home page.
90+
(define (note date href . title)
91+
`(li ((class "note-item"))
92+
(time ((datetime ,date)) ,date)
93+
(a ((href ,href)) ,@title)))
94+
95+
;; Container for a list of notes.
96+
(define (note-list . items)
97+
`(ul ((class "note-index")) ,@items))
98+
99+
;; Inline code — for tag names, types, identifiers in prose.
100+
(define (code . body)
101+
`(code ,@body))
102+
103+
;; Code block — preserves whitespace and indentation literally.
104+
;; CONVENTION: write the body with leading + trailing newlines, like:
105+
;; ◊code-block{
106+
;; first line of code
107+
;; indented line
108+
;; }
109+
;; This bypasses Scribble's leading-line dedent (which strips a variable
110+
;; amount based on the first content line's shape). The function trims the
111+
;; sentinel newlines back off.
112+
(define (code-block . body)
113+
(let* ([raw (apply string-append
114+
(map (lambda (x) (if (string? x) x "")) body))]
115+
[trimmed (string-trim raw "\n" #:repeat? #t)])
116+
`(pre ((class "code-block")) (code ,trimmed))))

‎docs/styles.css‎

Lines changed: 169 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -320,4 +320,173 @@ footer {
320320
width: 40px;
321321
height: 40px;
322322
}
323+
}
324+
325+
/* ==== NOTEBOOK =============================================== */
326+
327+
/* Dated list of notes, used on home and /notes */
328+
.note-index {
329+
list-style: none;
330+
margin-left: 0;
331+
margin-bottom: 0.5em;
332+
}
333+
334+
.note-index .note-item {
335+
display: flex;
336+
gap: 1rem;
337+
align-items: baseline;
338+
font-family: 'JetBrains Mono', monospace;
339+
font-size: 0.9em;
340+
border-bottom: 1px dashed #1a1a2e;
341+
padding: 0.55rem 0;
342+
margin-bottom: 0;
343+
}
344+
345+
.note-index .note-item time {
346+
color: #FF1493;
347+
flex: 0 0 6.5rem;
348+
font-size: 0.85em;
349+
}
350+
351+
.note-index .note-item a {
352+
color: #E0FFFF;
353+
text-decoration: none;
354+
}
355+
356+
.note-index .note-item a:hover {
357+
color: #00CED1;
358+
text-decoration: underline;
359+
}
360+
361+
/* Per-note byline + backlink */
362+
.note-meta {
363+
font-family: 'JetBrains Mono', monospace;
364+
font-size: 0.85em;
365+
color: #8892a0;
366+
margin-bottom: 1.8em;
367+
}
368+
369+
.note-meta time {
370+
color: #FF1493;
371+
}
372+
373+
.note-meta a {
374+
color: #8892a0;
375+
text-decoration: none;
376+
}
377+
378+
.note-meta a:hover {
379+
color: #00CED1;
380+
}
381+
382+
/* Single-note wider layout */
383+
body.notebook {
384+
max-width: 58rem;
385+
}
386+
387+
/* Figures: cyan frame; sketch variant adds an offset pink shadow */
388+
body.notebook figure {
389+
margin: 1.4rem 0;
390+
border: 1px solid #1a3a3c;
391+
border-radius: 4px;
392+
background: #050510;
393+
padding: 0.5rem;
394+
}
395+
396+
body.notebook figure.sketch {
397+
border-color: #2a1a3a;
398+
box-shadow: 4px 4px 0 -1px #1a0a24;
399+
}
400+
401+
body.notebook figure img,
402+
body.notebook figure video {
403+
display: block;
404+
width: 100%;
405+
border-radius: 2px;
406+
}
407+
408+
body.notebook figure figcaption {
409+
color: #8892a0;
410+
font-family: 'JetBrains Mono', monospace;
411+
font-size: 0.78em;
412+
margin-top: 0.5rem;
413+
padding: 0 0.3rem;
414+
}
415+
416+
/* Right-margin asides on wide screens */
417+
@media (min-width: 50rem) {
418+
body.notebook main > div {
419+
position: relative;
420+
padding-right: 15rem;
421+
}
422+
423+
body.notebook main > div > aside {
424+
position: absolute;
425+
right: 0;
426+
width: 13rem;
427+
font-family: 'JetBrains Mono', monospace;
428+
font-size: 0.78em;
429+
line-height: 1.5;
430+
color: #7dd3d6;
431+
border-left: 1px solid #1a3a3c;
432+
padding-left: 0.8rem;
433+
margin: 0 0 1rem;
434+
}
435+
436+
body.notebook main > div > aside.move-up {
437+
margin-top: calc(-1.6em * var(--move-up, 0) - 0.5em);
438+
}
439+
}
440+
441+
/* Narrow: asides become inline cyan-bar callouts */
442+
@media (max-width: 50rem) {
443+
body.notebook aside {
444+
display: block;
445+
margin: 0.9em 0 0.9em 1rem;
446+
border-left: 2px solid #00CED1;
447+
padding-left: 0.8rem;
448+
font-family: 'JetBrains Mono', monospace;
449+
font-size: 0.85em;
450+
color: #7dd3d6;
451+
}
452+
}
453+
454+
/* Inline code — tag names, types, identifiers inside prose */
455+
code {
456+
font-family: 'JetBrains Mono', monospace;
457+
font-size: 0.85em;
458+
background: #0a0a14;
459+
color: #E0FFFF;
460+
padding: 0.1em 0.35em;
461+
border-radius: 3px;
462+
border: 1px solid #1a1a2e;
463+
}
464+
465+
/* Code block — cyan-framed terminal panel */
466+
pre.code-block {
467+
background: #050510;
468+
border: 1px solid #1a3a3c;
469+
border-radius: 4px;
470+
padding: 1em 1.1em;
471+
margin: 1.3em 0;
472+
overflow-x: auto;
473+
font-family: 'JetBrains Mono', monospace;
474+
font-size: 0.82em;
475+
line-height: 1.55;
476+
color: #c8d4dc;
477+
}
478+
479+
pre.code-block code {
480+
background: none;
481+
border: none;
482+
padding: 0;
483+
color: inherit;
484+
font-size: inherit;
485+
white-space: pre;
486+
}
487+
488+
/* Inside notebook, keep code blocks confined to the reading column
489+
(don't extend into the aside gutter) */
490+
body.notebook pre.code-block {
491+
max-width: 100%;
323492
}

‎docs/template.html.p‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -33,18 +33,18 @@
3333
"logo": "https://brickellresearch.org/brickell_research_logo.png"
3434
}
3535
</script>
36-
<link rel="icon" type="image/png" href="brickell_research_logo.png">
36+
<link rel="icon" type="image/png" href="/brickell_research_logo.png">
3737
<link rel="preconnect" href="https://fonts.googleapis.com">
3838
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
3939
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600&display=swap" rel="stylesheet">
40-
<link rel="stylesheet" href="styles.css">
40+
<link rel="stylesheet" href="/styles.css">
4141
</head>
42-
<body>
42+
<body class="◊(or (select-from-metas 'body-class metas) "")">
4343
<header>
44-
<a href="/"><img src="brickell_research_logo.png" alt="Brickell Research" class="logo"></a>
44+
<a href="/"><img src="/brickell_research_logo.png" alt="Brickell Research" class="logo"></a>
4545
<h1><a href="/">Brickell Research</a></h1>
4646
<p class="tagline">Systems thinking, without the thinking.</p>
47-
◊(if (select-from-metas 'title metas) "" "<p class=\"manifesto-comment\"><a href=\"manifesto.html\"># our manifesto</a></p>")
47+
◊(if (select-from-metas 'title metas) "" "<p class=\"manifesto-comment\"><a href=\"/manifesto\"># our manifesto</a></p>")
4848
</header>
4949
<main>
5050
◊(->html doc)

0 commit comments

Comments
 (0)