Something went wrong. Try again.
very fast at protocol indexer with flexible filtering, xrpc queries, cursor-backed event stream, and more, built on fjall
rust fjall at-protocol atproto indexer
Something went wrong. Try again.
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859/* the column beside the paper (Tree.astro): the page's title, then a list with a raised header per section and its entries folded under it. prose pages and configuration share it. */
.side { position: sticky; top: var(--head-h); min-width: 0; display: flex; flex-direction: column; gap: 6px; max-height: calc(100vh - var(--head-h) - var(--foot-h));}.side-title { flex: none; display: flex; align-items: center; gap: 10px; padding: 4px 8px 4px 4px; font-size: 16px; font-weight: 700; line-height: 1.2; color: var(--text); text-decoration: none; text-shadow: var(--emboss); border-radius: var(--r-box);}.side-title .icon { filter: var(--icon-rim) drop-shadow(1px 1px 0 var(--icon-shadow)); }.side-title .k { min-width: 0; overflow-wrap: anywhere; }.side-title:hover { background: var(--chrome-hover); }
.list { min-height: 0; overflow: auto; overflow-x: hidden; padding: 2px; background: var(--sheet); border: 1px solid var(--edge); border-radius: var(--r-box); box-shadow: var(--well-edge);}
.tree { padding: 0; outline: none; }.tree:focus-visible { box-shadow: var(--well-edge), 0 0 0 1px var(--focus); }.tree a, .tree .gh { display: flex; align-items: baseline; gap: 8px; color: var(--text); text-decoration: none; }.tree a { padding: 2px 8px 2px 14px; font-size: 12.5px; }.tree a:hover { background: var(--hover); }.tree .k { min-width: 0; overflow-wrap: anywhere; }.tree .d { flex: 1; min-width: 0; text-align: right; font-size: 11px; color: var(--faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.tree.mono .kids .k { flex: none; max-width: 62%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--mono); font-size: 11.5px; }
/* section headers */.tree .gh { align-items: center; gap: 0; text-shadow: var(--emboss); background: var(--grad-header); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);}.tree .gh a { flex: 1; min-width: 0; padding: 3px 8px 3px 4px; font-weight: 700; }.tree .gh .t { flex: 1; min-width: 0; overflow-wrap: anywhere; }.tree .n { font-weight: 400; font-size: 11px; color: var(--faint); }.tree .tri { all: unset; flex: none; width: 16px; align-self: stretch; display: grid; place-items: center; cursor: pointer; }.tree .tri::before { content: ""; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 6px solid var(--glyph); transition: transform 0.12s; }.tree .tri:focus-visible { outline: 1px dotted var(--text); outline-offset: -3px; }.tree .tri.none::before { display: none; }.tree .grp.open .tri::before { transform: rotate(90deg); }:root[data-js] .tree .grp .kids { display: none; }:root[data-js] .tree .grp.open .kids { display: block; }:root:not([data-js]) .tree .tri { display: none; }
/* the selection; a selected header lights its whole row, triangle included */.tree .sel, .tree .sel:hover { background: var(--grad-select); color: var(--on-select); text-shadow: var(--emboss-select); }.tree .sel .d, .tree .sel .n { color: var(--on-select); }.tree .gh:has(> .sel) { background: var(--grad-select); border-color: var(--select-end); }.tree .gh > a.sel { background: none; }.tree .gh:has(> .sel) .tri::before { border-left-color: var(--on-select); }