This is a test article written in Markdown using Astro’s content collections. The first paragraph automatically receives lead styling to draw readers into the content.
Why Content Collections?
Content collections provide several benefits over plain Markdown files in the pages folder:
- Type safety for frontmatter with Zod validation
- Better organization with content separate from routing
- Powerful querying to filter, sort, and transform content
- Automatic TypeScript types for better editor support
Here’s an example of inline code: const greeting = "Hello". And a link to Astro’s documentation.
Code Blocks
Code blocks get special styling with a dark background:
function greet(name) {
return `Hello, ${name}!`;
}
const message = greet('World');
console.log(message);
Lists and Quotes
Unordered lists use sandstone-colored markers:
- First item in the list
- Second item with more text to demonstrate wrapping behavior
- Third item
- Fourth item
Ordered lists for sequential content:
- Discovery phase
- Direction setting
- Development work
- Delivery and launch
Blockquotes
A blockquote for highlighting important ideas. The serif font adds elegance and distinction from body text.
With attribution:
Design is not just what it looks like and feels like. Design is how it works. — Steve Jobs
Conclusion
This test article demonstrates all the typographic elements available in the article styling system. Content collections make it easy to add more posts while maintaining consistent structure.