Changes to mdq1.scroll.pub

root
root
16 days ago
Initial commit
index.scroll
Changed around line 1
+ buildHtml
+ baseUrl https://mdq.scroll.pub
+ metaTags
+ editButton /edit.html
+ title mdq: jq for Markdown
+ style.css
+ header
+ class hero
+ div
+ class hero-content
+ div
+ class badges
+ a
+ href https://github.com/yshavit/mdq/actions/workflows/coverage.yml
+ img
+ alt Code Coverage
+ src https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2F53901a0115b596e015a891c41fb0f256%2Fraw%2Fmdq-coverage.json
+ a
+ href https://github.com/yshavit/mdq/actions/workflows/rust.yml
+ img
+ alt Build status
+ src https://github.com/yshavit/mdq/actions/workflows/rust.yml/badge.svg
+ a
+ href https://github.com/search?q=repo%3Ayshavit%2Fmdq+NOT+path%3A.github%2Fworkflows%2Fcoverage.yml+NOT+path%3AREADME.md+todo&type=code
+ img
+ alt Pending TODOs
+ src https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2Fe7a9e9e72651da0d7d2b1fbbe56237d0%2Fraw%2Fmdq-todos.json
+ a
+ href https://github.com/search?q=repo%3Ayshavit%2Fmdq+%28%28path%3A%2F%5C.rs%24%2F+%22%23%5Bignore%5D%22%29+OR+%28path%3Atests%2Fmd_cases+%2F%5Eignore%2F%29%29&type=code
+ img
+ alt Ignored tests
+ src https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2F782a8dc5f77d2cf4b1c774da72636f00%2Fraw%2Fmdq-ignoreds.json
+ h1 mdq
+ p class tagline jq for Markdown
+ main
+ section
+ class intro
+ h2 What is mdq?
+ p mdq lets you query Markdown documents like jq queries JSON. Extract sections, lists, tables and more with intuitive syntax.
+ pre
+ code
+ | cat example.md | mdq '# usage | -'
+ section
+ class features
+ div
+ class feature-grid
+ div
+ class feature-card
+ h3 📖 Semantic Queries
+ p Use Markdown-like syntax to match document structure
+ div
+ class feature-card
+ h3 🔗 Piped Filters
+ p Chain filters with | operator for precise targeting
+ div
+ class feature-card
+ h3 🛠️ Rich Output
+ p Get results as plain text, JSON, or formatted Markdown
+ section
+ class installation
+ h2 Installation
+ div
+ class code-group
+ pre
+ code lang shell
+ | cargo install --git https://github.com/yshavit/mdq
+ div
+ class install-options
+ p Or download binaries from
+ a
+ href https://github.com/yshavit/mdq/releases/latest
+ latest release
+ section
+ class examples
+ h2 Examples
+ div
+ class example-grid
+ div
+ class example-card
+ h3 Extract Checklists
+ pre
+ code lang shell
+ | mdq '- [ ]' issues.md
+ p Find all incomplete tasks
+ div
+ class example-card
+ h3 Parse Tables
+ pre
+ code lang shell
+ | mdq ':-: * :-: 2024-01-15' schedule.md
+ p Filter table rows by date
+ div
+ class example-card
+ h3 Find Links
+ pre
+ code lang shell
+ | mdq '[Ticket](^https://tickets/.*)' pr.md | jq .url
+ p Extract ticket URLs as JSON
+ footer
+ class footer
+ div
+ class footer-content
+ div
+ class footer-links
+ a
+ href https://github.com/yshavit/mdq/wiki
+ Documentation
+ a
+ href https://github.com/yshavit/mdq
+ GitHub
+ a
+ href https://github.com/yshavit/mdq/issues
+ Issues
+ p Licensed under Apache 2.0 or MIT
+ script.js
prompt.json
Changed around line 1
+ {
+ "id": "00a58617-0334-43d2-9311-b55e83eee77b",
+ "object": "chat.completion",
+ "created": 1740488413,
+ "model": "deepseek-reasoner",
+ "choices": [
+ {
+ "index": 0,
+ "message": {
+ "role": "assistant",
+ "content": "---domain---\nmdq.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://mdq.scroll.pub\nmetaTags\neditButton /edit.html\ntitle mdq: jq for Markdown\nstyle.css\nheader\n class hero\n div\n class hero-content\n div\n class badges\n a\n href https://github.com/yshavit/mdq/actions/workflows/coverage.yml\n img\n alt Code Coverage\n src https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2F53901a0115b596e015a891c41fb0f256%2Fraw%2Fmdq-coverage.json\n a\n href https://github.com/yshavit/mdq/actions/workflows/rust.yml\n img\n alt Build status\n src https://github.com/yshavit/mdq/actions/workflows/rust.yml/badge.svg\n a\n href https://github.com/search?q=repo%3Ayshavit%2Fmdq+NOT+path%3A.github%2Fworkflows%2Fcoverage.yml+NOT+path%3AREADME.md+todo&type=code\n img\n alt Pending TODOs\n src https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2Fe7a9e9e72651da0d7d2b1fbbe56237d0%2Fraw%2Fmdq-todos.json\n a\n href https://github.com/search?q=repo%3Ayshavit%2Fmdq+%28%28path%3A%2F%5C.rs%24%2F+%22%23%5Bignore%5D%22%29+OR+%28path%3Atests%2Fmd_cases+%2F%5Eignore%2F%29%29&type=code\n img\n alt Ignored tests\n src https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2F782a8dc5f77d2cf4b1c774da72636f00%2Fraw%2Fmdq-ignoreds.json\n h1 mdq\n p class tagline jq for Markdown\nmain\n section\n class intro\n h2 What is mdq?\n p mdq lets you query Markdown documents like jq queries JSON. Extract sections, lists, tables and more with intuitive syntax.\n pre\n code\n | cat example.md | mdq '# usage | -'\n section\n class features\n div\n class feature-grid\n div\n class feature-card\n h3 📖 Semantic Queries\n p Use Markdown-like syntax to match document structure\n div\n class feature-card\n h3 🔗 Piped Filters\n p Chain filters with | operator for precise targeting\n div\n class feature-card\n h3 🛠️ Rich Output\n p Get results as plain text, JSON, or formatted Markdown\n section\n class installation\n h2 Installation\n div\n class code-group\n pre\n code lang shell\n | cargo install --git https://github.com/yshavit/mdq\n div\n class install-options\n p Or download binaries from \n a\n href https://github.com/yshavit/mdq/releases/latest\n latest release\n section\n class examples\n h2 Examples\n div\n class example-grid\n div\n class example-card\n h3 Extract Checklists\n pre\n code lang shell\n | mdq '- [ ]' issues.md\n p Find all incomplete tasks\n div\n class example-card\n h3 Parse Tables\n pre\n code lang shell\n | mdq ':-: * :-: 2024-01-15' schedule.md\n p Filter table rows by date\n div\n class example-card\n h3 Find Links\n pre\n code lang shell\n | mdq '[Ticket](^https://tickets/.*)' pr.md | jq .url\n p Extract ticket URLs as JSON\nfooter\n class footer\n div\n class footer-content\n div\n class footer-links\n a\n href https://github.com/yshavit/mdq/wiki\n Documentation\n a\n href https://github.com/yshavit/mdq\n GitHub\n a\n href https://github.com/yshavit/mdq/issues\n Issues\n p Licensed under Apache 2.0 or MIT\nscript.js\n---style.css---\n:root {\n --primary: #2F495E;\n --secondary: #2978A0;\n --accent: #4FB477;\n --light: #F4F4F9;\n --dark: #1A2B3C;\n}\n\nbody {\n font-family: 'Inter', system-ui, sans-serif;\n line-height: 1.6;\n color: var(--dark);\n margin: 0;\n}\n\n.hero {\n background: linear-gradient(135deg, var(--primary), var(--secondary));\n color: white;\n padding: 4rem 1rem;\n text-align: center;\n}\n\n.hero-content {\n max-width: 800px;\n margin: 0 auto;\n}\n\nh1 {\n font-size: 4rem;\n margin: 2rem 0;\n letter-spacing: -0.05em;\n}\n\n.tagline {\n font-size: 1.5rem;\n opacity: 0.9;\n}\n\n.badges {\n display: flex;\n gap: 0.5rem;\n justify-content: center;\n flex-wrap: wrap;\n margin-bottom: 2rem;\n}\n\nsection {\n padding: 4rem 1rem;\n}\n\n.feature-grid, .example-grid {\n display: grid;\n gap: 2rem;\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n margin-top: 2rem;\n}\n\n.feature-card, .example-card {\n background: white;\n border-radius: 12px;\n padding: 2rem;\n box-shadow: 0 4px 6px rgba(0,0,0,0.1);\n transition: transform 0.2s;\n}\n\n.feature-card:hover {\n transform: translateY(-5px);\n}\n\npre {\n background: var(--dark);\n color: var(--light);\n padding: 1.5rem;\n border-radius: 8px;\n overflow-x: auto;\n}\n\ncode {\n font-family: 'Fira Code', monospace;\n font-size: 0.9rem;\n}\n\n.install-options {\n margin-top: 1.5rem;\n text-align: center;\n}\n\n.footer {\n background: var(--light);\n padding: 2rem 1rem;\n margin-top: 4rem;\n}\n\n.footer-content {\n max-width: 1200px;\n margin: 0 auto;\n text-align: center;\n}\n\n.footer-links {\n display: flex;\n gap: 1.5rem;\n justify-content: center;\n margin-bottom: 1rem;\n}\n\n@media (max-width: 768px) {\n h1 {\n font-size: 2.5rem;\n }\n \n .feature-grid, .example-grid {\n grid-template-columns: 1fr;\n }\n}\n---script.js---\ndocument.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\n anchor.addEventListener('click', function (e) {\n e.preventDefault();\n document.querySelector(this.getAttribute('href')).scrollIntoView({\n behavior: 'smooth'\n });\n });\n});\n\ndocument.querySelectorAll('pre code').forEach(block => {\n block.innerHTML = block.innerHTML.trim()\n .replace(/&/g, '&')\n .replace(//g, '>')\n .replace(/\"/g, '"')\n .replace(/'/g, ''');\n});\n---end---",
+ "reasoning_content": "Okay, I need to create a website for mdq2, which is a tool similar to jq but for Markdown. The user provided a detailed README, so I should extract the key information and present it clearly on the site.\n\nFirst, the domain name. It should be short, memorable, and end with scroll.pub. Since the tool is called mdq and it's for Markdown, maybe something like mdq.scroll.pub? That's straightforward and easy to remember.\n\nNext, the structure of the website. The user wants a clean, semantic HTML5 with Scroll syntax. Let's break down the content from the README into sections: a hero section explaining what mdq is, installation instructions, basic usage, examples, and maybe a features section. Also, include badges for coverage, build status, todos, and ignored tests.\n\nFor the design, use CSS variables for colors to make it consistent. The hero section should have a gradient background to make it stand out. Use cards for features or examples to make the information digestible. Code snippets are important here, so style them with a dark background and monospace font.\n\nResponsive design is crucial. Ensure the layout adjusts for mobile, maybe using media queries. Flexbox and grid can help with responsive grids for features and examples.\n\nAccessibility: Use proper heading hierarchy, alt texts for images (though there aren't many here), and ensure color contrast is good. The navigation should be accessible, maybe a simple nav bar at the top.\n\nThe user mentioned no external resources, so all CSS and JS must be inline or local. Since Scroll is used, the HTML structure will follow the Scroll syntax with indentation for hierarchy.\n\nBadges are images linked from shields.io. Even though they're external, the user specified relative links and no external resources. Wait, but the badges are hosted externally. Hmm, the user's request says to use only relative links and no external resources. That's a conflict because the badges are external. But looking back, the original README uses these badges, so maybe they're okay. However, the user's requirement says no external resources. So perhaps omit the badges or find another way. But the user included them in the request, so maybe they're essential. I'll include them as they are, using absolute URLs since they're necessary for the badges.\n\nFor the installation section, use code blocks with shell commands. Make sure code blocks are styled properly with syntax highlighting. Since we can't use external libraries, maybe simulate a code block with a pre element and some CSS styling.\n\nExamples should be in tabs or accordions to save space. But since we need to keep it simple, maybe use a vertical layout with each example in a card. The JavaScript can handle switching between examples if needed, but keep it minimal.\n\nThe footer should have links to documentation, GitHub, etc., but no copyright symbol. Use a simple footer with links and a tagline.\n\nNow, translating all this into Scroll syntax. The header will have a hero section with the title and a brief description. Then sections for what is mdq, installation, basic usage, examples. Each section uses appropriate classes for styling.\n\nCSS should define variables for colors, use grid for feature cards, and ensure responsiveness. JavaScript might be minimal, perhaps for copying code snippets or handling example tabs, but the user didn't specify interactivity, so maybe just some smooth scrolling for anchor links.\n\nTesting the layout on mobile: the navigation should collapse, sections stack vertically, and text remains readable.\n\nPutting it all together: the Scroll structure starts with the buildHtml directive, sets the base URL, includes meta tags, the title, and links to the style.css and script.js. The body content is structured with header, main sections, and footer.\n\nFor the CSS, use a modern font stack, define gradients for the hero, style code blocks with background and padding, and ensure cards have shadows and hover effects for interactivity.\n\nJavaScript can handle smooth scrolling for anchor links and maybe a mobile menu toggle if needed, but keep it simple as per requirements.\n\nDouble-check that all links are relative, no external resources except the badges (which are necessary), and that the design is clean and professional. Ensure the code examples are correctly formatted and the badges are displayed properly."
+ },
+ "logprobs": null,
+ "finish_reason": "stop"
+ }
+ ],
+ "usage": {
+ "prompt_tokens": 4745,
+ "completion_tokens": 2708,
+ "total_tokens": 7453,
+ "prompt_tokens_details": {
+ "cached_tokens": 0
+ },
+ "completion_tokens_details": {
+ "reasoning_tokens": 873
+ },
+ "prompt_cache_hit_tokens": 0,
+ "prompt_cache_miss_tokens": 4745
+ },
+ "system_fingerprint": "fp_5417b77867_prod0225"
+ }
readme.scroll
Changed around line 1
+ # mdq1.scroll.pub
+
+ Prompt: website
+ Agent: deepseekreasoner
+ Model: deepseek-reasoner
+
+ ## User prompt
+ A website called mdq2 # mdq: jq for Markdown [![Code Coverage][coverage-shield]][coverage-link] [![Build status][build-shield]][build-link] [![Pending TODOs][todos-shield]][todos-link] [![Ignored tests][ignoreds-shield]][ignoreds-link] [coverage-shield]: https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2F53901a0115b596e015a891c41fb0f256%2Fraw%2Fmdq-coverage.json [coverage-link]: https://github.com/yshavit/mdq/actions/workflows/coverage.yml?query=branch%3Amain [build-shield]: https://github.com/yshavit/mdq/actions/workflows/rust.yml/badge.svg [build-link]: https://github.com/yshavit/mdq/actions/workflows/rust.yml?query=branch%3Amain [todos-shield]: https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2Fe7a9e9e72651da0d7d2b1fbbe56237d0%2Fraw%2Fmdq-todos.json [todos-link]: https://github.com/search?q=repo%3Ayshavit%2Fmdq+NOT+path%3A.github%2Fworkflows%2Fcoverage.yml+NOT+path%3AREADME.md+todo&type=code [ignoreds-shield]: https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2F782a8dc5f77d2cf4b1c774da72636f00%2Fraw%2Fmdq-ignoreds.json [ignoreds-link]: https://github.com/search?q=repo%3Ayshavit%2Fmdq+%28%28path%3A%2F%5C.rs%24%2F+%22%23%5Bignore%5D%22%29+OR+%28path%3Atests%2Fmd_cases+%2F%5Eignore%2F%29%29&type=code ## What is mdq? mdq aims to do for Markdown what jq does for JSON: provide an easy way to zero in on specific parts of a document. For example, GitHub PRs are Markdown documents, and some organizations have specific templates with checklists for all reviewers to complete. Enforcing these often requires ugly regexes that are a pain to write and worse to debug. Instead, you can (for example) ask mdq for all uncompleted tasks: ```shell mdq '- [ ]' ``` mdq is available under the Apache 2.0 or MIT licenses, at your option. I am open to other permissive licenses, if you have one you prefer. # Installation Any of these will work: 1. ```shell cargo install --git https://github.com/yshavit/mdq ``` 2. Download binaries from [the latest release] (or any other release, of course). 3. You can also grab the binaries from the latest [build-release] workflow run. You must be logged into GitHub to do that (this is GitHub's limitation, not mine). You'll have to `chmod +x` them before you can run them.
Security concerns The release and latest-workflow binaries are built on GitHub's servers, so if you trust my code (and dependencies), and you trust GitHub, you can trust the binaries. See https://github.com/yshavit/mdq/wiki/Release-binaries for information on how to verify them.
[the latest release]: https://github.com/yshavit/mdq/releases/latest [build-release]: https://github.com/yshavit/mdq/actions/workflows/build-release.yml # Basic Usage Simple example to select sections containing "usage": ```shell cat example.md | mdq '# usage' ``` Use pipe (`|`) to chain filters together. For example, to select sections containing "usage", and within those find all unordered list items: ```shell cat example.md | mdq '# usage | -' ``` The filter syntax is designed to mirror Markdown syntax. You can select... | Element | Syntax | |------------------|----------------------------------| | Sections | `# title text` | | Lists | `- unordered list item text` | | " | `1. ordered list item text` | | " | `- [ ] uncompleted task` | | " | `- [x] completed task` | | " | `- [?] any task` | | Links | `[display text](url)` | | Images | `![alt text](url)` | | Block quotes | `> block quote text` | | Code blocks | ` ```language ` | | Raw HTML | ` html_tag` | | Plain paragraphs | `P: paragraph text ` | | Tables | `:-: header text :-: row text` | (Tables selection differs from other selections in that you can actually select only certain headers and rows, such that the resulting element is of a different shape than the original. See the example below, or the wiki for more detail.) In any of the above, the text may be: - an `unquoted string` that starts with a letter; this is case-insensitive - a `"quoted string"` (either single or double quotes); this is case-sensitive - a string (quoted or unquoted) anchored by `^` or `$` (for start and end of string, respectively) - a `/regex/` - omitted or `*`, to mean "any" See the [tutorial] for a bit more detail, and [user manual] for the full picture. [tutorial]: https://github.com/yshavit/mdq/wiki/Tutorial [user manual]: https://github.com/yshavit/mdq/wiki/Full-User-Manual ## Examples ### Ensuring that people have searched existing issues before submitting a bug report Many projects have bug report templates that ask the submitter to attest that they've checked existing issues for possible duplicates. In mdq, you can do: ```bash if echo "$ISSUE_TEXT" | mdq -q '- [x] I have searched for existing issues' ; then ... ``` (The `-q` option is like grep's: it doesn't output anything to stdout, but exits 0 if any items were found, or non-0 otherwise.) This will match: > - [x] I have searched for existing issues ... but will fail if the checkbox is unchecked: > - [ ] I have searched for existing issues ### Extracting a referenced ticket Some organizations use GitHub Actions to update their ticket tracker, if a PR mentions a ticket. You can use mdq to extract the link from Markdown as JSON, and then use jq to get the URL: ```bash TICKET_URL="$(echo "$PR_TEXT" | mdq --output json '# Ticket | [](^https://tickets.example.com/[A-Z]+-\d+$)' | jq -r '.items[].link.url')" ``` This will match Markdown like: > #### Ticket > > https://tickets.example.com/PROJ-1234 ### Whittling down a big table Let's say you have a table whose columns reference people in an on-call schedule, rows correspond to weeks in `YYYY-MM-DD` format: > | On-Call | Alice | Bob | Sam | Pat | > |:----------:|:-----:|:---:|:---:|:---:| > | 2024-01-08 | x | | | | > | 2024-01-15 | | | x | | > | 2024-01-22 | | x | | | To find out when Alice is on call: ```bash cat oncall.md | mdq ':-: /On-Call|Alice/:-: *' ``` ```markdown | On-Call | Alice | |:----------:|:-----:| | 2024-01-08 | x | | 2024-01-15 | | | 2024-01-22 | | ``` Or, to find out who's on call for the week of Jan 15: ```bash cat oncall.md | mdq ':-: * :-: 2024-01-15' ``` ```markdown | On-Call | Alice | Bob | Sam | Pat | |:----------:|:-----:|:---:|:---:|----:| | 2024-01-15 | | | x | | ```
+
+ ## System prompt
+ You are an expert web developer. Create a website based on this request: "A website called mdq2 # mdq: jq for Markdown [![Code Coverage][coverage-shield]][coverage-link] [![Build status][build-shield]][build-link] [![Pending TODOs][todos-shield]][todos-link] [![Ignored tests][ignoreds-shield]][ignoreds-link] [coverage-shield]: https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2F53901a0115b596e015a891c41fb0f256%2Fraw%2Fmdq-coverage.json [coverage-link]: https://github.com/yshavit/mdq/actions/workflows/coverage.yml?query=branch%3Amain [build-shield]: https://github.com/yshavit/mdq/actions/workflows/rust.yml/badge.svg [build-link]: https://github.com/yshavit/mdq/actions/workflows/rust.yml?query=branch%3Amain [todos-shield]: https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2Fe7a9e9e72651da0d7d2b1fbbe56237d0%2Fraw%2Fmdq-todos.json [todos-link]: https://github.com/search?q=repo%3Ayshavit%2Fmdq+NOT+path%3A.github%2Fworkflows%2Fcoverage.yml+NOT+path%3AREADME.md+todo&type=code [ignoreds-shield]: https://img.shields.io/endpoint?url=https%3A%2F%2Fgist.githubusercontent.com%2Fyshavit%2F782a8dc5f77d2cf4b1c774da72636f00%2Fraw%2Fmdq-ignoreds.json [ignoreds-link]: https://github.com/search?q=repo%3Ayshavit%2Fmdq+%28%28path%3A%2F%5C.rs%24%2F+%22%23%5Bignore%5D%22%29+OR+%28path%3Atests%2Fmd_cases+%2F%5Eignore%2F%29%29&type=code ## What is mdq? mdq aims to do for Markdown what jq does for JSON: provide an easy way to zero in on specific parts of a document. For example, GitHub PRs are Markdown documents, and some organizations have specific templates with checklists for all reviewers to complete. Enforcing these often requires ugly regexes that are a pain to write and worse to debug. Instead, you can (for example) ask mdq for all uncompleted tasks: ```shell mdq '- [ ]' ``` mdq is available under the Apache 2.0 or MIT licenses, at your option. I am open to other permissive licenses, if you have one you prefer. # Installation Any of these will work: 1. ```shell cargo install --git https://github.com/yshavit/mdq ``` 2. Download binaries from [the latest release] (or any other release, of course). 3. You can also grab the binaries from the latest [build-release] workflow run. You must be logged into GitHub to do that (this is GitHub's limitation, not mine). You'll have to `chmod +x` them before you can run them.
Security concerns The release and latest-workflow binaries are built on GitHub's servers, so if you trust my code (and dependencies), and you trust GitHub, you can trust the binaries. See https://github.com/yshavit/mdq/wiki/Release-binaries for information on how to verify them.
[the latest release]: https://github.com/yshavit/mdq/releases/latest [build-release]: https://github.com/yshavit/mdq/actions/workflows/build-release.yml # Basic Usage Simple example to select sections containing "usage": ```shell cat example.md | mdq '# usage' ``` Use pipe (`|`) to chain filters together. For example, to select sections containing "usage", and within those find all unordered list items: ```shell cat example.md | mdq '# usage | -' ``` The filter syntax is designed to mirror Markdown syntax. You can select... | Element | Syntax | |------------------|----------------------------------| | Sections | `# title text` | | Lists | `- unordered list item text` | | " | `1. ordered list item text` | | " | `- [ ] uncompleted task` | | " | `- [x] completed task` | | " | `- [?] any task` | | Links | `[display text](url)` | | Images | `![alt text](url)` | | Block quotes | `> block quote text` | | Code blocks | ` ```language ` | | Raw HTML | ` html_tag` | | Plain paragraphs | `P: paragraph text ` | | Tables | `:-: header text :-: row text` | (Tables selection differs from other selections in that you can actually select only certain headers and rows, such that the resulting element is of a different shape than the original. See the example below, or the wiki for more detail.) In any of the above, the text may be: - an `unquoted string` that starts with a letter; this is case-insensitive - a `"quoted string"` (either single or double quotes); this is case-sensitive - a string (quoted or unquoted) anchored by `^` or `You are an expert web developer. Create a website based on this request: " (for start and end of string, respectively) - a `/regex/` - omitted or `*`, to mean "any" See the [tutorial] for a bit more detail, and [user manual] for the full picture. [tutorial]: https://github.com/yshavit/mdq/wiki/Tutorial [user manual]: https://github.com/yshavit/mdq/wiki/Full-User-Manual ## Examples ### Ensuring that people have searched existing issues before submitting a bug report Many projects have bug report templates that ask the submitter to attest that they've checked existing issues for possible duplicates. In mdq, you can do: ```bash if echo "$ISSUE_TEXT" | mdq -q '- [x] I have searched for existing issues' ; then ... ``` (The `-q` option is like grep's: it doesn't output anything to stdout, but exits 0 if any items were found, or non-0 otherwise.) This will match: > - [x] I have searched for existing issues ... but will fail if the checkbox is unchecked: > - [ ] I have searched for existing issues ### Extracting a referenced ticket Some organizations use GitHub Actions to update their ticket tracker, if a PR mentions a ticket. You can use mdq to extract the link from Markdown as JSON, and then use jq to get the URL: ```bash TICKET_URL="$(echo "$PR_TEXT" | mdq --output json '# Ticket | [](^https://tickets.example.com/[A-Z]+-\d+$)' | jq -r '.items[].link.url')" ``` This will match Markdown like: > #### Ticket > > https://tickets.example.com/PROJ-1234 ### Whittling down a big table Let's say you have a table whose columns reference people in an on-call schedule, rows correspond to weeks in `YYYY-MM-DD` format: > | On-Call | Alice | Bob | Sam | Pat | > |:----------:|:-----:|:---:|:---:|:---:| > | 2024-01-08 | x | | | | > | 2024-01-15 | | | x | | > | 2024-01-22 | | x | | | To find out when Alice is on call: ```bash cat oncall.md | mdq ':-: /On-Call|Alice/:-: *' ``` ```markdown | On-Call | Alice | |:----------:|:-----:| | 2024-01-08 | x | | 2024-01-15 | | | 2024-01-22 | | ``` Or, to find out who's on call for the week of Jan 15: ```bash cat oncall.md | mdq ':-: * :-: 2024-01-15' ``` ```markdown | On-Call | Alice | Bob | Sam | Pat | |:----------:|:-----:|:---:|:---:|----:| | 2024-01-15 | | | x | | ```"
+
+ Requirements:
+ - Use only Scroll, CSS, and JavaScript (NO frameworks, NO external dependencies)
+ - Create clean, semantic HTML5
+ - Make it mobile-responsive
+ - Follow modern best practices and accessibility guidelines
+ - Keep it simple but professional
+ - Use only relative links and no external resources
+ - Do not put a copyright symbol or all rights reserved in the footer.
+ - Make it beautiful. Dazzling. Advanced used of CSS.
+
+ As a refresher, for doing the html body, Scroll is a whitespace based language that uses a single indented space to mark a line (aka particle) as a subparticle of a parent line.
+
+ For example:
+
+ header
+ class hero
+ nav
+ div Scroll
+ class logo
+ div
+ class nav-links
+ a Features
+ href #features
+ a Examples
+ href #examples
+ a Edit
+ href edit.html
+ a GitHub
+ class cta-button
+ href https://github.com/breck7/scroll
+ div
+ class hero-content
+ h1 Write Better with Scroll
+ p The extendible markup language that makes source beautiful and compiles to anything
+ a Get Started
+ class primary-button
+ href https://hub.scroll.pub/
+ main
+ section
+ id features
+ class features
+ h2 Why Scroll?
+ div
+ class feature-grid
+ div
+ class feature-card
+ div ⚡
+ class feature-icon
+ h3 Simple Syntax
+ p Like Markdown, but more powerful. No parentheses needed.
+ div
+ class feature-card
+ div 🧩
+ class feature-icon
+ h3 Extendible
+ p Build your own custom parsers.
+ div
+ class feature-card
+ div 🎨
+ class feature-icon
+ h3 Beautiful Output
+ p Create stunning documents with minimal effort.
+ div
+ class feature-card
+ div 🚀
+ class feature-icon
+ h3 Fast & Light
+ p Built on the efficient PPS Stack.
+ section
+ id examples
+ class code-demo
+ h2 See It In Action
+ div
+ class code-container
+ pre
+ class code-example
+ div
+ class code-output
+ footer
+ div
+ class footer-content
+ div
+ class footer-links
+ a Documentation
+ href https://scroll.pub/tutorial.html
+ a Community
+ href https://www.reddit.com/r/WorldWideScroll/
+ a Blog
+ href https://scroll.pub/blog
+ p Started by Breck Yunits. Evolved by a community.
+ https://twitter.com/breckyunits Breck Yunits
+ https://github.com/breck7/scroll/graphs/contributors community
+
+
+ First suggest a short, memorable domain name ending in scroll.pub that represents this website. Then provide the website files. Use this exact format:
+
+ ---domain---
+ (domainscroll.pub here)
+ ---index.scroll---
+ buildHtml
+ baseUrl https://(domainscroll.pub here)
+ metaTags
+ editButton /edit.html
+ title (Title here)
+ style.css
+
+ (body content here. no blank lines please.)
+
+ script.js
+ ---style.css---
+ (CSS content here)
+ ---script.js---
+ (JavaScript content here)
+ ---end---
script.js
Changed around line 1
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+ anchor.addEventListener('click', function (e) {
+ e.preventDefault();
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
+ behavior: 'smooth'
+ });
+ });
+ });
+
+ document.querySelectorAll('pre code').forEach(block => {
+ block.innerHTML = block.innerHTML.trim()
+ .replace(/&/g, '&')
+ .replace(/
+ .replace(/>/g, '>')
+ .replace(/"/g, '"')
+ .replace(/'/g, ''');
+ });
style.css
Changed around line 1
+ :root {
+ --primary: #2F495E;
+ --secondary: #2978A0;
+ --accent: #4FB477;
+ --light: #F4F4F9;
+ --dark: #1A2B3C;
+ }
+
+ body {
+ font-family: 'Inter', system-ui, sans-serif;
+ line-height: 1.6;
+ color: var(--dark);
+ margin: 0;
+ }
+
+ .hero {
+ background: linear-gradient(135deg, var(--primary), var(--secondary));
+ color: white;
+ padding: 4rem 1rem;
+ text-align: center;
+ }
+
+ .hero-content {
+ max-width: 800px;
+ margin: 0 auto;
+ }
+
+ h1 {
+ font-size: 4rem;
+ margin: 2rem 0;
+ letter-spacing: -0.05em;
+ }
+
+ .tagline {
+ font-size: 1.5rem;
+ opacity: 0.9;
+ }
+
+ .badges {
+ display: flex;
+ gap: 0.5rem;
+ justify-content: center;
+ flex-wrap: wrap;
+ margin-bottom: 2rem;
+ }
+
+ section {
+ padding: 4rem 1rem;
+ }
+
+ .feature-grid, .example-grid {
+ display: grid;
+ gap: 2rem;
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+ margin-top: 2rem;
+ }
+
+ .feature-card, .example-card {
+ background: white;
+ border-radius: 12px;
+ padding: 2rem;
+ box-shadow: 0 4px 6px rgba(0,0,0,0.1);
+ transition: transform 0.2s;
+ }
+
+ .feature-card:hover {
+ transform: translateY(-5px);
+ }
+
+ pre {
+ background: var(--dark);
+ color: var(--light);
+ padding: 1.5rem;
+ border-radius: 8px;
+ overflow-x: auto;
+ }
+
+ code {
+ font-family: 'Fira Code', monospace;
+ font-size: 0.9rem;
+ }
+
+ .install-options {
+ margin-top: 1.5rem;
+ text-align: center;
+ }
+
+ .footer {
+ background: var(--light);
+ padding: 2rem 1rem;
+ margin-top: 4rem;
+ }
+
+ .footer-content {
+ max-width: 1200px;
+ margin: 0 auto;
+ text-align: center;
+ }
+
+ .footer-links {
+ display: flex;
+ gap: 1.5rem;
+ justify-content: center;
+ margin-bottom: 1rem;
+ }
+
+ @media (max-width: 768px) {
+ h1 {
+ font-size: 2.5rem;
+ }
+
+ .feature-grid, .example-grid {
+ grid-template-columns: 1fr;
+ }
+ }