# ORC building blocks

> The building blocks of orcwg.org: the solstice-ui module's documentation in ORC's theme

## Documentation Sets

- [ORC building blocks](http://localhost:3000/llms-full.txt): The building blocks of orcwg.org: the solstice-ui module's documentation in ORC's theme

## Docs

Every page below is available as raw markdown.

- [Components](http://localhost:3000/raw/components.md): The blocks pages are made of, by group: page headers, sections, cards and grids, tabs, accordions and lists, text and media, buttons and links, and live data.
- [badge](http://localhost:3000/raw/components/buttons-and-links/badge.md): A small label in a pill (a status, a tag, a short note) with an optional steady or pulsing dot, inline in a sentence or a title, or as a block.
- [button-link](http://localhost:3000/raw/components/buttons-and-links/button-link.md): A button that links to a page, in a colour and a size of the theme's, with an optional icon; a block, or inline in a sentence.
- [icon](http://localhost:3000/raw/components/buttons-and-links/icon.md): An SVG icon of the installed Iconify sets, inline in text, titles and buttons, optionally in a coloured circle.
- [social-links](http://localhost:3000/raw/components/buttons-and-links/social-links.md): The site's social media accounts (its settings' socials, as in the footer) as a row of icon links, with an optional label before them.
- [stack](http://localhost:3000/raw/components/buttons-and-links/stack.md): A row of buttons and links (button-link, text-link) with a gap between them, wrapping on small screens.
- [text-link](http://localhost:3000/raw/components/buttons-and-links/text-link.md): A text link with an optional icon after or before its label (e.g. an arrow), as a block or inline in a sentence.
- [card](http://localhost:3000/raw/components/cards-and-grids/card.md): A box around content (text, lists, buttons or other blocks), its title its first heading, in one of the theme's looks.
- [content-card](http://localhost:3000/raw/components/cards-and-grids/content-card.md): A card with a large title and text, and an optional wider second column beside them (#aside), e.g. for smaller cards.
- [grid](http://localhost:3000/raw/components/cards-and-grids/grid.md): Blocks side by side in 1 to 12 equal columns, stacked on phones, the items of a row sharing its height; a column block spans several columns or stacks blocks in one cell.
- [link-tile](http://localhost:3000/raw/components/cards-and-grids/link-tile.md): A small tile linking to a page, with an icon above its label, to put in a grid.
- [people-list](http://localhost:3000/raw/components/cards-and-grids/people-list.md): A grid of people (person-card blocks) with an optional title, e.g. the chairs of a committee or the leads of a group.
- [staggered-grid](http://localhost:3000/raw/components/cards-and-grids/staggered-grid.md): An intro and cards in two columns on larger screens, the first card below the intro and the others stacked beside them, aligned with its bottom.
- [blog-post-list](http://localhost:3000/raw/components/live-data/blog-post-list.md): The site's blog posts, newest first, as cards or a list, a page at a time; and one post's card.
- [hubspot-form](http://localhost:3000/raw/components/live-data/hubspot-form.md): A HubSpot contact form, loaded with HubSpot's embed script, with a title and a message shown until it loads.
- [members-list](http://localhost:3000/raw/components/live-data/members-list.md): The logos of the working group's members, as a carousel or a grid of logo cards, from the Eclipse membership API.
- [newsroom-event](http://localhost:3000/raw/components/live-data/newsroom-event.md): One event of the Eclipse newsroom with its details and links, the blocks of an event's page, and the site's event pages.
- [newsroom-events](http://localhost:3000/raw/components/live-data/newsroom-events.md): Events of the Eclipse newsroom, upcoming or past, as lists to search and browse, a highlighted event and mentions in a text, read with the page.
- [newsroom-news](http://localhost:3000/raw/components/live-data/newsroom-news.md): News of the Eclipse newsroom, as lists of cards, a highlighted news item, links to the feed and mentions in a text, read with the page.
- [paginated-video-list](http://localhost:3000/raw/components/live-data/paginated-video-list.md): The latest videos of YouTube playlists, newest first, a page at a time, with a filter by playlist.
- [pagination](http://localhost:3000/raw/components/live-data/pagination.md): The page numbers of a list shown a page at a time, placed inside the list.
- [hero](http://localhost:3000/raw/components/page-headers/hero.md): The page header, a large title with its text, buttons and notes, plain or on a background image, opening the page across its full width.
- [hero-split](http://localhost:3000/raw/components/page-headers/hero-split.md): A page header with its text beside an image, opening the page across its full width.
- [page-sidebar](http://localhost:3000/raw/components/page-headers/page-sidebar.md): A second, narrower column beside the page's content, for links or a short summary.
- [call-to-action](http://localhost:3000/raw/components/sections/call-to-action.md): A centred band asking visitors to act, with a title, a short text, buttons and an optional strip of media below.
- [content-fragment](http://localhost:3000/raw/components/sections/content-fragment.md): A section shared by several pages, written once in the site's fragments and shown wherever it is included.
- [media-card](http://localhost:3000/raw/components/sections/media-card.md): A wide horizontal card with an image on one side and a title and text on the other, as a section of the page.
- [page-section](http://localhost:3000/raw/components/sections/page-section.md): A full-width band of the page with a header (eyebrow, title, intro, actions), its content, a footer note and a background of the theme's.
- [testimonial-carousel](http://localhost:3000/raw/components/sections/testimonial-carousel.md): A carousel of the site's testimonials, each quote with the name, role and organisation logo of its author.
- [ticker](http://localhost:3000/raw/components/sections/ticker.md): A band of words scrolling continuously across the page, such as the topics a group works on.
- [accordion](http://localhost:3000/raw/components/tabs-accordions-and-lists/accordion.md): Collapsible panels one under the other, an accordion-item block each, for questions and answers or details on demand.
- [list](http://localhost:3000/raw/components/tabs-accordions-and-lists/list.md): A list of linked resources in one or two columns, a list-item block each with an icon, a title and a description.
- [page-list](http://localhost:3000/raw/components/tabs-accordions-and-lists/page-list.md): Links to the pages below the current page, with their title and description, kept up to date by itself.
- [steps](http://localhost:3000/raw/components/tabs-accordions-and-lists/steps.md): Numbered steps or points one after the other, a step block each, with a title, text, buttons and an image or blocks beside them.
- [styled-list](http://localhost:3000/raw/components/tabs-accordions-and-lists/styled-list.md): A Markdown list typed in the block, its markers styled by one of the theme's looks.
- [tabs](http://localhost:3000/raw/components/tabs-accordions-and-lists/tabs.md): Tabs with one panel shown at a time, a tab block per panel, the chosen tab kept in the page's address.
- [comparison-table](http://localhost:3000/raw/components/text-and-media/comparison-table.md): A feature comparison table written as a Markdown table, with check marks and crosses, that phones show one option at a time.
- [countdown](http://localhost:3000/raw/components/text-and-media/countdown.md): A countdown to a date in the units chosen, each in a box with its label, and a text shown instead once the date has passed.
- [data-table](http://localhost:3000/raw/components/text-and-media/data-table.md): A Markdown table in the site's table style, with an optional title above it.
- [iframe-embed](http://localhost:3000/raw/components/text-and-media/iframe-embed.md): An embedded page (a calendar, a map, a form), as wide as its column at a fixed height.
- [media](http://localhost:3000/raw/components/text-and-media/media.md): An image or a video with its look (corners, crop, focus, size, shadow, link) and an optional caption.
- [media-split](http://localhost:3000/raw/components/text-and-media/media-split.md): Text beside an image or a video, side by side on larger screens and stacked on phones.
- [scrolling-carousel](http://localhost:3000/raw/components/text-and-media/scrolling-carousel.md): A row of photos scrolling continuously from right to left, faded at both edges.
- [typography](http://localhost:3000/raw/components/text-and-media/typography.md): A text style of the theme (variant), an alignment, a colour or a weight, for paragraphs as a block or for a few words inside a sentence or a title.
- [youtube](http://localhost:3000/raw/components/text-and-media/youtube.md): A YouTube video, shown as a thumbnail until the visitor allows cookies, then in YouTube's privacy-enhanced player, with optional structured data for search engines.
- [Markdown and llms.txt](http://localhost:3000/raw/getting-started/agents/markdown.md): Every page of these docs as Markdown, with its examples, options and the theme's values written out, and indexes of them for agents.
- [MCP server](http://localhost:3000/raw/getting-started/agents/mcp-server.md): The documentation as an MCP server: tools to list the pages and read one as Markdown.
- [Skills](http://localhost:3000/raw/getting-started/agents/skills.md): Agent Skills a documentation site serves, e.g. how to build a page of the site from its blocks.
- [Configuration](http://localhost:3000/raw/getting-started/configuration.md): The module's options (solsticeUi in nuxt.config.ts), what it registers in Studio and in the Markdown, and the runtime settings it reads.
- [Features](http://localhost:3000/raw/getting-started/features.md): The optional features (Eclipse services, motion, colour modes), all on by default, and the newsroom's event pages.
- [Installation](http://localhost:3000/raw/getting-started/installation.md): Add the module to a Nuxt Content site, render the pages in its layout, define the collections it reads, and give it a theme.
- [Introduction](http://localhost:3000/raw/getting-started/introduction.md): solstice-ui is a Nuxt module of headless content blocks and a page frame for Eclipse Foundation working group websites on Nuxt Content and Nuxt Studio.
- [Class maps](http://localhost:3000/raw/getting-started/theme/class-maps.md): The components are headless; the site's theme gives each one its classes, by part and option value, as Nuxt UI's themes do.
- [Colour modes](http://localhost:3000/raw/getting-started/theme/colour-modes.md): The components render the same markup in light and dark; the site's theme styles both, and the colorMode feature lets visitors choose.
- [Documenting a theme](http://localhost:3000/raw/getting-started/theme/documenting-a-theme.md): A site's documentation extends the module's (a Nuxt layer for Docus) with its theme, its own pages, its notes on its looks and its own blocks.
- [Layout and frame](http://localhost:3000/raw/getting-started/theme/layout-and-frame.md): The site layout (header, footer) that stays mounted between pages, the page frame around each page, and how a site themes and extends them.
- [Look options](http://localhost:3000/raw/getting-started/theme/look-options.md): A block's look options take their values and defaults from the site's theme; its behaviour options are the module's.
- [Motion](http://localhost:3000/raw/getting-started/theme/motion.md): The blocks' motion as they scroll into view is the site theme's too, run by the motion feature on Motion (motion.dev).
- [Writing components](http://localhost:3000/raw/getting-started/theme/writing-components.md): How the module's components are written (blocks, parts, look and behaviour options, Reka UI behaviour), for a new block of the module or a site's own.
- [ORC's looks](http://localhost:3000/raw/orc/looks.md): Every block's look options and the values ORC's theme gives them, and how to choose and combine them on orcwg.org's pages.
- [ORC's own blocks](http://localhost:3000/raw/orc/site-blocks.md): The blocks only orcwg.org has, for the work of the working group: the CRA deliverables (table, summary, count) and the committees' meeting minutes.
- [ORC's theme](http://localhost:3000/raw/orc/theme.md): The look of orcwg.org's blocks, the ORC redesign on Tailwind CSS: where it lives, its tokens (colours by role, type, corners, shadows), its looks and its motion.
- [Calls to action](http://localhost:3000/raw/recipes/calls-to-action.md): How orcwg.org pages end, and ask people to act. Buttons in a hero or a section, a shared section in a fragment, a closing card on the band, the call-to-action block and the footer's own.
- [Content pages](http://localhost:3000/raw/recipes/content-pages.md): The patterns of orcwg.org's content pages (About, Get involved, the FAQ, the SIGs, the Learning hub). Their headers, steps with images and buttons, numbered points, people, questions and answers, links to resources and tabs.
- [Landing page](http://localhost:3000/raw/recipes/landing-page.md): The home page of orcwg.org, part by part. A hero, a ticker of topics, sections that each make one point, live data, the members and the latest news, then a shared call to action.
- [Listing pages](http://localhost:3000/raw/recipes/listing-pages.md): orcwg.org's pages of live data. News, events, the blog, the CRA resources, the meeting minutes and the videos, each a small hero and a section holding blocks that work together.
- [Section patterns](http://localhost:3000/raw/recipes/section-patterns.md): The page sections orcwg.org is made of. Cards under a title, a split or side title, text beside media, a centred countdown, the dark band with glass cards, courses side by side and a video.
- [Composing blocks](http://localhost:3000/raw/writing-pages/composing-blocks.md): How blocks combine into pages: sections and what goes in them, with examples to start from.
- [MDC syntax](http://localhost:3000/raw/writing-pages/mdc-syntax.md): How pages are written: Markdown with blocks, their slots and options, nested blocks and inline components.
- [Nuxt Studio](http://localhost:3000/raw/writing-pages/nuxt-studio.md): Editing pages made of blocks in Nuxt Studio: the block menu, the options panel, slots, inline components, images, and what Studio does to a file.
- [Page structure](http://localhost:3000/raw/writing-pages/page-structure.md): A page's file, its front matter and the parts of its body: a header, sections, a sidebar, shared fragments.
- [Rules](http://localhost:3000/raw/writing-pages/rules.md): The checklist for a page that renders well and survives a save in Nuxt Studio: content, nesting, options and text.
- [Slots and options](http://localhost:3000/raw/writing-pages/slots-and-options.md): The conventions all blocks share: one name for one meaning, in slots and in options.

## Landing

Every page below is available as raw markdown.

- [ORC building blocks](http://localhost:3000/raw/index.md): The blocks orcwg.org pages are made of, in ORC's theme. How to write them in MDC, their options and slots, and how the site combines them, for editors, developers and AI agents.