[{"categories":[],"content":"This page exists to be looked at, not read — every element CyberLavandaTea styles, rendered once, in order, so a change to _tokens.scss or _components.scss shows up here first. It also proves the small stuff still works: footnotes,1 for instance.\nThis is a heading level one ¶ Rendered with the display face at its largest, an anchor id from its slug, and a pilcrow (¶) that fades in on hover — the same render hook handles every level below. Each level has its own voice rather than just a smaller size, so the hierarchy reads at a glance.\nThis is a heading level two ¶ Still the display face, a step down, with a hairline underneath and a short Primary segment at its start — in prose it opens a section, so it doubles as a divider. Also the level this page uses for its own section headers, which is why it shows up nested under “Heading level one” in the table of contents above.\nThis is a heading level three ¶ Drops to the body face, bold, in Primary green: a sub-section title that stands out from the paragraph without competing with the h2 above it.\nThis is a heading level four ¶ A mono, uppercase, letter-spaced label in Inactive grey, prefixed with a Primary // — like a comment tag in a config file.\nBody text ¶ This theme renders Goldmark’s Markdown plus a handful of render hooks of its own. Inline styles work as expected: emphasis, strong emphasis, inline code, and a link to Hugo ↗ — external, so it picks up the outbound arrow.\nLists ¶ An unordered list, nested one level, in the tree-triangle marker:\nStatic site generators Hugo (Go — this site) Eleventy (Node) Zola (Rust) Build tooling Tailwind CSS v4 Dart Sass And an ordered list, in zero-padded mono indices, because sequence matters here:\nWrite Markdown in content/. Hugo compiles templates and Markdown into static HTML. Tailwind processes assets/css/main.css and purges unused utilities. public/ ships to a static host. Links ¶ An unvisited link is Link-blue, like the one to Hugo ↗ above. This link back to the Lists section turns Visited-sage once you’ve clicked it. On :hover or :focus any link switches to Primary green, with a focus ring for keyboard navigation.\nImages ¶ A lone image becomes a \u003cfigure\u003e with a caption, centered:\nA placeholder photo, because every style guide needs one Quote ¶ The full layout is written in plain CSS, so the theme renders correctly even without Tailwind’s content detection.\nTables ¶ Format Path Consumed by RSS /index.xml most feed readers Atom /atom.xml feed readers, PubSubHubbub JSON Feed /index.json JSON Feed readers SearchIndex /search.json this site’s own client-side search Code ¶ // buildIndex writes the search index used by /search. const maxResults = 40 func buildIndex(posts []Post) (string, error) { count := 0 for _, p := range posts { if p.Draft { continue } count++ } return fmt.Sprintf(\"indexed %d posts\", count), nil } Buttons ¶ Try the search →\nColor \u0026 type reference ¶ The same six roles, read directly from assets/scss/_tokens.scss:\nRole Hex Primary #5FD88F Content #E6E6EC Background #14151A Link #4D9FFF Visited #7EA88E Inactive #8B8F9A And the typefaces that carry it:\nRole Typeface Display Audiowide — h1, h2 Body Rajdhani — body text, h3 Mono JetBrains Mono (stack) — code, list markers, h4 Signature Sig Font, cursive fallback Goldmark’s footnote extension, rendered automatically below — and yes, it’s an \u003col\u003e, so it gets the same zero-padded markers as every other numbered list on this page. ↩︎\n","date":"13 September 2026","description":"Every element the theme styles, on one page: headings, lists, links, images, quotes, tables, code and the color/type reference.","tags":["design","reference"],"title":"Style Guide","uri":"/cyberlavandatea/style-guide/"},{"categories":["dev"],"content":"Hugo can emit a custom output format: a search.json file with every page. The client downloads the index once and then queries lunr ↗ locally.\nThe index template ¶ // build the index from the rendered pages const index = lunr(function () { this.ref(\"uri\"); this.field(\"title\"); this.field(\"content\"); for (const doc of request.response) { this.add(doc); lookup[doc.uri] = doc; } return 200; }); Note: the index is rebuilt on every build. With a few hundred posts the file stays under 200 KB.1\nResults are rendered from a \u003ctemplate\u003e cloned per match, with the same summary truncation Hugo itself uses.\nMeasured on this site’s own search.json at ~70 posts; size grows roughly linearly with the number of indexed fields, not just post count. ↩︎\n","date":"8 September 2026","description":"A custom output format that emits search.json, queried client-side with Lunr.","tags":["hugo","search","javascript"],"title":"Build a search index with Lunr in Hugo","uri":"/cyberlavandatea/post/build-a-lunr-search-index/"},{"categories":[],"content":"First test micropost: an IndieWeb response plus h-entry markup.\n","date":"7 September 2026","description":"","tags":["meta"],"title":"2026-09-07 12:00","uri":"/cyberlavandatea/micro/2026-09-07-1200/"},{"categories":["dev"],"content":"The theme uses six roles: Primary (green), Content, Links (blue), Visited, Background, Inactive. Surfaces and borders are mixes of Content over Background, so no extra hue enters the chrome.\nAn unvisited link is blue; a visited link is sage; on :hover it turns green. Every text pairing clears WCAG AA, and body text and code reach AAA.1\nPrimary on Background measures ~10.2:1, well past the 7:1 AAA threshold for normal text — see the style guide for the full contrast table. ↩︎\n","date":"5 September 2026","description":"Six semantic roles, two accent hues, everything else derived by opacity.","tags":["design","css","accessibility"],"title":"A blue + green dark palette","uri":"/cyberlavandatea/post/a-blue-green-dark-palette/"},{"categories":[],"content":" Writing the CyberLavandaTea theme. Reading up on Hugo output formats and render hooks. Drinking lavender tea. ","date":"1 September 2026","description":"","tags":[],"title":"Now — September 2026","uri":"/cyberlavandatea/now/2026-09/"},{"categories":[],"content":"KaTeX can be used to generate complex math formulas server-side.\n$$ \\phi = \\frac{(1+\\sqrt{5})}{2} = 1.6180339887\\cdots $$\nAdditional details can be found on GitHub ↗ or on the Wiki ↗ .\nExample 1 ¶ If the text between $$ contains newlines it will rendered in display mode:\n$$ f(x) = \\int_{-\\infty}^\\infty\\hat f(\\xi)\\,e^{2 \\pi i \\xi x}\\,d\\xi $$ $$ f(x) = \\int_{-\\infty}^\\infty\\hat f(\\xi),e^{2 \\pi i \\xi x},d\\xi $$\nExample 2 ¶ $$ \\frac{1}{\\Bigl(\\sqrt{\\phi \\sqrt{5}}-\\phi\\Bigr) e^{\\frac25 \\pi}} = 1+\\frac{e^{-2\\pi}} {1+\\frac{e^{-4\\pi}} {1+\\frac{e^{-6\\pi}} {1+\\frac{e^{-8\\pi}} {1+\\cdots} } } } $$ ​​$$ \\frac{1}{\\Bigl(\\sqrt{\\phi \\sqrt{5}}-\\phi\\Bigr) e^{\\frac25 \\pi}} = 1+\\frac{e^{-2\\pi}} {1+\\frac{e^{-4\\pi}} {1+\\frac{e^{-6\\pi}} {1+\\frac{e^{-8\\pi}} {1+\\cdots} } } } $$ ​​\nExample 3 ¶ $$ 1 + \\frac{q^2}{(1-q)}+\\frac{q^6}{(1-q)(1-q^2)}+\\cdots = \\prod_{j=0}^{\\infty}\\frac{1}{(1-q^{5j+2})(1-q^{5j+3})}, \\quad\\quad \\text{for }\\lvert q\\rvert\u003c1. $$ $$ 1 + \\frac{q^2}{(1-q)}+\\frac{q^6}{(1-q)(1-q^2)}+\\cdots = \\prod_{j=0}^{\\infty}\\frac{1}{(1-q^{5j+2})(1-q^{5j+3})}, \\quad\\quad \\text{for }\\lvert q\\rvert\u003c1. $$\n","date":"5 March 2017","description":"","tags":["example","math"],"title":"Math Sample","uri":"/cyberlavandatea/post/2017-03-05-math-sample/"},{"categories":[],"content":"The following are two code samples using syntax highlighting.\nThe following is a code sample using triple backticks ( ``` ) code fencing provided in Hugo. This is client side highlighting and does not require any special installation.\nvar num1, num2, sum num1 = prompt(\"Enter first number\") num2 = prompt(\"Enter second number\") sum = parseInt(num1) + parseInt(num2) // \"+\" means \"add\" alert(\"Sum = \" + sum) // \"+\" means combine into a string The following is a code sample using the “highlight” shortcode provided in Hugo. This is server side highlighting and requires Python and Pygments to be installed.\nvar num1, num2, sum num1 = prompt(\"Enter first number\") num2 = prompt(\"Enter second number\") sum = parseInt(num1) + parseInt(num2) // \"+\" means \"add\" alert(\"Sum = \" + sum) // \"+\" means combine into a string And here is the same code with line numbers:\n1 var num1, num2, sum 2 num1 = prompt(\"Enter first number\") 3 num2 = prompt(\"Enter second number\") 4 sum = parseInt(num1) + parseInt(num2) // \"+\" means \"add\" 5 alert(\"Sum = \" + sum) // \"+\" means combine into a string ","date":"8 March 2016","description":"","tags":["example","code"],"title":"Code Sample","uri":"/cyberlavandatea/post/2016-03-08-code-sample/"},{"categories":[],"content":"You can write regular markdown ↗ here and Jekyll will automatically convert it to a nice webpage. I strongly encourage you to take 5 minutes to learn how to write in markdown ↗ - it’ll teach you how to transform regular text into bold/italics/headings/tables/etc.\nHere is some bold text\nHere is a secondary heading ¶ Here’s a useless table:\nNumber Next number Previous number Five Six Four Ten Eleven Nine Seven Eight Six Two Three One How about a yummy crepe?\nHere’s a code chunk with syntax highlighting:\nvar foo = function(x) { return(x + 5); } foo(3) ","date":"20 February 2015","description":"","tags":["example","markdown"],"title":"Test markdown","uri":"/cyberlavandatea/post/2015-02-20-test-markdown/"},{"categories":[],"content":"To be, or not to be–that is the question: Whether ’tis nobler in the mind to suffer The slings and arrows of outrageous fortune Or to take arms against a sea of troubles And by opposing end them. To die, to sleep– No more–and by a sleep to say we end The heartache, and the thousand natural shocks That flesh is heir to. ‘Tis a consummation Devoutly to be wished. To die, to sleep– To sleep–perchance to dream: ay, there’s the rub, For in that sleep of death what dreams may come When we have shuffled off this mortal coil, Must give us pause. There’s the respect That makes calamity of so long life. For who would bear the whips and scorns of time, Th’ oppressor’s wrong, the proud man’s contumely The pangs of despised love, the law’s delay, The insolence of office, and the spurns That patient merit of th’ unworthy takes, When he himself might his quietus make With a bare bodkin? Who would fardels bear, To grunt and sweat under a weary life, But that the dread of something after death, The undiscovered country, from whose bourn No traveller returns, puzzles the will, And makes us rather bear those ills we have Than fly to others that we know not of? Thus conscience does make cowards of us all, And thus the native hue of resolution Is sicklied o’er with the pale cast of thought, And enterprise of great pitch and moment With this regard their currents turn awry And lose the name of action. – Soft you now, The fair Ophelia! – Nymph, in thy orisons Be all my sins remembered.\n","date":"13 February 2015","description":"","tags":[],"title":"To be","uri":"/cyberlavandatea/post/2015-02-13-hamlet-monologue/"},{"categories":[],"content":"What is it with that Mary girl? Dragging me to school every day. As if I had a choice. What you don’t hear in those nursery rhymes is that she starves me if I don’t go to school with her; it’s the only way I can stay alive! I’m thinking about being adopted by Little Bo Peep, sure I may get lost, but anything is better than being with Mary and those little brats at school (shudder, shudder).\n","date":"27 January 2015","description":"","tags":[],"title":"Dear diary","uri":"/cyberlavandatea/post/2015-01-27-dear-diary/"},{"categories":[],"content":"From Wikipedia:\nAssociation football, more commonly known as football or soccer,[2] is a sport played between two teams of eleven players with a spherical ball. It is played by 250 million players in over 200 countries, making it the world’s most popular sport.[3][4][5][6] The game is played on a rectangular field with a goal at each end. The object of the game is to score by getting the ball into the opposing goal.\nThe goalkeepers are the only players allowed to touch the ball with their hands or arms while it is in play and then only in their penalty area. Outfield players mostly use their feet to strike or pass the ball, but may use their head or torso to strike the ball instead. The team that scores the most goals by the end of the match wins. If the score is level at the end of the game, either a draw is declared or the game goes into extra time and/or a penalty shootout depending on the format of the competition. The Laws of the Game were originally codified in England by The Football Association in 1863. Association football is governed internationally by the International Federation of Association Football (FIFA; French: Fédération Internationale de Football Association) which organises a World Cup every four years.[7]\n","date":"19 January 2015","description":"","tags":[],"title":"Soccer","uri":"/cyberlavandatea/post/2015-01-19-soccer/"},{"categories":[],"content":"Piracy is typically an act of robbery or criminal violence at sea. The term can include acts committed on land, in the air, or in other major bodies of water or on a shore. It does not normally include crimes committed against persons traveling on the same vessel as the perpetrator (e.g. one passenger stealing from others on the same vessel). The term has been used throughout history to refer to raids across land borders by non-state agents.\n","date":"15 January 2015","description":"","tags":[],"title":"Pirates arrrr","uri":"/cyberlavandatea/post/2015-01-15-pirates/"},{"categories":[],"content":"This is my first post, how exciting!\n","date":"5 January 2015","description":"","tags":[],"title":"First post!","uri":"/cyberlavandatea/post/2015-01-04-first-post/"}]