http-nu 0.17.2

The surprisingly performant, Nushell-scriptable, cross.stream-powered, Datastar-ready HTTP server that fits in your back pocket.
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149

/* /design viewer layout. 2-col: sidebar list + focused preview. */

/* The page column caps at the site's 900px (set on body) by default; the
   palette rows (16 tiles, up to 64K) want more room to read like real
   tiles, so widen the whole /design page. */
body.design { max-width: 1200px; }

.design-main {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 1.5rem;
}

.design-nav {
  border-right: 1px solid rgba(255, 255, 255, 0.15);
  padding: 1rem 0;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  /* Reserve scrollbar space so design pages don't shift width when
     the preview's overflow toggles. */
  scrollbar-gutter: stable;
}
.design-nav a {
  display: grid;
  gap: 0.1rem;
  padding: 0.6rem 1.5rem;
  text-decoration: none;
  border-left: 3px solid transparent;
}
.design-nav a:hover { background: rgba(0, 0, 0, 0.2); color: inherit; }
.design-nav a.current {
  background: rgba(0, 0, 0, 0.3);
  border-left-color: var(--brand);
  color: var(--fg-header);
}
.design-nav .title { font-weight: 700; }
.design-nav .desc { font-size: var(--text-sm); opacity: 0.7; }

.design-preview {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.story {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.story .label {
  font-size: var(--text-sm);
  opacity: 0.7;
  font-family: var(--font-mono);
}
.story .render {
  position: relative;  /* anchors absolutely-positioned children (.badge) */
  padding: 1.5rem;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 0.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
}

/* /design/palettes: one row of tile-like swatches per progression, one per
   tile value (2 -> 64K), plus a muted note. Each swatch carries its own
   bg/fg inline; grid-auto-flow keeps the whole ladder on a single row
   regardless of how many values there are. Rounding matches the game board
   so they read as tiles, not just color chips. */
.swatch-row {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  /* Frame the row exactly like the game board: same wood-colored
     backing, 6px padding + 6px gaps showing through, 6px outer radius.
     The tiles then read as a single row lifted off a real board. */
  gap: 6px;
  padding: 6px;
  background: #bbada0;
  border-radius: 6px;
  width: 100%;
}
.swatch-row .sw {
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3px;  /* match .tile in game-board.js */
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  font-size: clamp(9px, 1.1vw, 15px);
}
.story .note {
  font-size: var(--text-sm);
  opacity: 0.8;
  line-height: 1.5;
  max-width: 65ch;
}

/* /design/board playground. Two columns: the WC on the left,
   scenario controls on the right. */
.wc-playground {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 1.25rem;
  /* Pin the playground to fill from its top down to the viewport
     bottom. The 14rem subtract is the height of everything above the
     playground (site-header + breadcrumb + story label + body padding);
     tune if that chrome changes. Controls scroll inside their column;
     the board stays in view. */
  height: calc(100dvh - 14rem);
}
.wc-playground .wc-controls {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  min-width: 0;
  min-height: 0;     /* let the flex column shrink below content height */
  overflow-y: auto;
  /* Reserve scrollbar space so the column width doesn't jump when the
     overflow toggles between visible and present. */
  scrollbar-gutter: stable;
}
.wc-scenario {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.wc-scenario-label {
  font-size: var(--text-sm);
  opacity: 0.85;
  font-family: var(--font-mono);
}
.wc-btn {
  align-self: flex-start;
  margin-right: 0.5rem;
}

/* Static badge stories on /design/badges. Plain sized container for
   the WC so the board renders at a useful size without needing the
   full wc-playground grid (no controls beside it). */
.badge-board {
  width: 260px;
}