About Mini Snippets

• Mini Snippets are copy-paste-able code snippets designed to be used for common UI patterns - they use Static Tailwind for styling and Mini for interactivity.
• Mini is a library extension for HTML which lets you add interactivity to your app without needing a full blown frontend framework.

Principles

• HTML First: These snippets have been put together by the same people behind Mini JS, Static Tailwind, and HTML First. Therefore, the components you find here will follow HTML First Principles.
• No Build: Because both Mini & Static Tailwind are #NoBuild, you do not need a bundler like npm in order to use any of the snippets you see here. You can simply copy and paste the HTML directly into your codebase, and it will ✨just work ✨.
• Moddable: Because there is no "hidden" code (all styling and interactivity is included), mini snippets are extremely moddable. You can remove parts, change behaviour, and change styling - just by finding the relevant code in the snippet.
• Copy-Pasteable: All of the recipes are designed for maximum compatibility with your existing codebase. If your codebase supports HTML, you can simply pick them up and slap them down - no integration or configuration required.

FAQ

I already know Tailwind. Is this plug and play?

• If you have an existing codebase with Tailwind set up - yes.
• If you're use our setup instructions and recipes as-is - yes.
• If you want to tweak the recipes with tailwind classes that aren't included in static tailwind, you'll have to have tailwind set up in your codebase using the standard npx bundling.

How long will it take me to learn Mini?

If you already know HTML and JS, you have the conceptual building blocks required (as Mini is mainly just adding javascript in your HTML attributes). Most of the examples can be understand with one or two references. So this will range from 2 minutes for intermediates (yes really) to a couple of hours for complete beginners.

Why Snippets and not components?
"Components" has connotations of tight control, minor modifiability, and the expectation that a user supplies arguments and gets an output. "Recipes" are flexible, require the user to have some understanding of the ingredients and processes that underpin them, and can be tweaked by the user in order to get a desired result.