mirror of
https://github.com/axzilla/templui.git
synced 2025-02-21 00:12:48 +00:00
docs: improve docs and introduction page
This commit is contained in:
“axzilla”
parent
13aab664a3
commit
e3a19be6d0
@ -7,6 +7,7 @@
|
||||
- Added: Alert component
|
||||
- Added: Accordion component
|
||||
- Added: Datepicker component
|
||||
- Changed: Improve documentation and introduction page
|
||||
- Changed: Add button type prop
|
||||
- Changed: Use own input component on tabs example
|
||||
- Changed: Update all current components with library comments
|
||||
|
||||
15
README.md
15
README.md
@ -1,12 +1,12 @@
|
||||
# Goilerplate
|
||||
|
||||
Modern UI Components for Go & Templ
|
||||
Modern UI Components for Go, Templ, Alpine.js, and Tailwind CSS
|
||||
|
||||
<img src="./assets/img/gopher.svg" alt="Goilerplate Logo" width="200"/>
|
||||
|
||||
## About
|
||||
|
||||
Goilerplate is a growing library of modern UI components designed specifically for Go and Templ. It aims to bridge the gap between Go's server-side efficiency and modern, interactive front-end experiences. Whether you're building a small website or a large web application, Goilerplate provides the tools you need to create sleek, responsive interfaces with ease.
|
||||
Goilerplate is a growing library of modern UI components designed specifically for Go and Templ, with Alpine.js for interactivity and Tailwind CSS for styling. It aims to bridge the gap between Go's server-side efficiency and modern, interactive front-end experiences. Whether you're building a small website or a large web application, Goilerplate provides the tools you need to create sleek, responsive interfaces with ease.
|
||||
|
||||
## Features
|
||||
|
||||
@ -18,8 +18,19 @@ Goilerplate is a growing library of modern UI components designed specifically f
|
||||
- **Accessible Components**: Built with accessibility in mind, following WCAG guidelines.
|
||||
- **TypeSafe**: Utilizing Go's type system for robust, error-resistant development.
|
||||
|
||||
## Inspiration
|
||||
|
||||
Goilerplate draws inspiration from several popular UI libraries and frameworks:
|
||||
|
||||
- [shadcn/ui](https://ui.shadcn.com/)
|
||||
- [Pines UI](https://devdojo.com/pines)
|
||||
- [daisyUI](https://daisyui.com/)
|
||||
|
||||
We're exploring whether to make Goilerplate a strict port of shadcn/ui or to create a unique blend of various inspirations. The project is still evolving, and community feedback will play a crucial role in shaping its direction.
|
||||
|
||||
## Current Status
|
||||
|
||||
- **Heavy Development**: The project is under active development. Expect frequent breaking changes until we reach a stable version.
|
||||
- Actively growing component library
|
||||
- Regular updates and bug fixes
|
||||
- Continuous development based on community feedback
|
||||
|
||||
@ -6,9 +6,9 @@ templ Introduction() {
|
||||
@layouts.DocsLayout() {
|
||||
<div class="text-muted-foreground">
|
||||
<h1 class="text-4xl font-bold mb-6 text-primary">🎉 Goilerplate</h1>
|
||||
<p class="mb-4 text-muted-foreground">Modern UI Components for Go & Templ</p>
|
||||
<p class="mb-4 text-muted-foreground">Modern UI Components for Go, Templ, Alpine.js, and Tailwind CSS</p>
|
||||
<p class="mb-8 text-muted-foreground">
|
||||
Build sleek, interactive web applications with Go and Templ. Seamlessly integrate Alpine.js for enhanced client-side functionality. Where server-side simplicity meets client-side dynamism.
|
||||
Build sleek, interactive web applications with Go and Templ. Seamlessly integrate Alpine.js for enhanced client-side functionality and style it all with Tailwind CSS. Where server-side simplicity meets client-side dynamism.
|
||||
</p>
|
||||
<section class="mb-12">
|
||||
<h2 class="text-2xl font-semibold mb-4 text-primary">What's this madness?</h2>
|
||||
@ -16,10 +16,10 @@ templ Introduction() {
|
||||
Goilerplate is a wild experiment in bringing the joy of modern UI components to the Go ecosystem. It's like a box of LEGO, but for web dev. And yes, we might have had too much coffee while coding this.
|
||||
</p>
|
||||
<p class="mb-4">
|
||||
We've taken Go, sprinkled some Templ magic, added a dash of Alpine.js, and voilà! You've got yourself a UI toolkit that'll make JavaScript developers question their life choices.
|
||||
We've taken Go, sprinkled some Templ magic, added a dash of Alpine.js, topped it with Tailwind CSS, and voilà! You've got yourself a UI toolkit that'll make JavaScript developers question their life choices.
|
||||
</p>
|
||||
<p class="mb-4">
|
||||
Warning: This project is so beta, it makes alpha look stable. Expect bugs, weird behavior, and possibly code that makes you question our sanity. But hey, that's half the fun, right?
|
||||
Warning: This project is under heavy development. Expect frequent breaking changes, weird behavior, and possibly code that makes you question our sanity. But hey, that's half the fun, right?
|
||||
</p>
|
||||
<p class="mb-4">
|
||||
We're constantly evolving. Check out our
|
||||
@ -38,15 +38,26 @@ templ Introduction() {
|
||||
Inspired by
|
||||
<a href="https://ui.shadcn.com/" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">
|
||||
shadcn/ui
|
||||
</a>
|
||||
and
|
||||
</a>,
|
||||
<a href="https://devdojo.com/pines" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">
|
||||
Pines UI
|
||||
</a>
|
||||
, Goilerplate brings the same philosophy of accessible, customizable components to the Go ecosystem. We've taken the best ideas and adapted them for Go, Templ, and Alpine.js enthusiasts.
|
||||
</a>, and
|
||||
<a href="https://daisyui.com/" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">
|
||||
daisyUI
|
||||
</a>,
|
||||
Goilerplate brings the philosophy of accessible, customizable components to the Go ecosystem. We've taken the best ideas and adapted them for Go, Templ, Alpine.js, and Tailwind CSS enthusiasts.
|
||||
</p>
|
||||
<p class="mb-4">
|
||||
Our components are designed with accessibility in mind, ensuring your web applications are usable by everyone. And just like our inspiration, every component is fully customizable - tweak them, break them, remake them. It's your playground!
|
||||
Our components are designed with accessibility in mind, ensuring your web applications are usable by everyone. And just like our inspirations, every component is fully customizable - tweak them, break them, remake them. It's your playground!
|
||||
</p>
|
||||
</section>
|
||||
<section class="mb-12">
|
||||
<h2 class="text-2xl font-semibold mb-4 text-primary">Where are we headed?</h2>
|
||||
<p class="mb-4">
|
||||
Honestly? We're not entirely sure yet! We're exploring whether to make Goilerplate a strict port of shadcn/ui or to create a unique blend of various inspirations. This journey is as much about discovery as it is about development.
|
||||
</p>
|
||||
<p class="mb-4">
|
||||
What we do know is this: We're committed to providing a flexible, powerful toolkit for Go developers who want to create beautiful, interactive web applications without sacrificing the benefits of server-side rendering.
|
||||
</p>
|
||||
</section>
|
||||
<section>
|
||||
@ -59,8 +70,9 @@ templ Introduction() {
|
||||
<li><a href="https://templ.guide" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">Templ</a> - Making templates great again</li>
|
||||
<li><a href="https://alpinejs.dev/" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">Alpine.js</a> - JavaScript's cool, minimalist cousin</li>
|
||||
<li><a href="https://tailwindcss.com/" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">Tailwind CSS</a> - For saving us from actually writing CSS</li>
|
||||
<li><a href="https://devdojo.com/pines" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">Pines UI</a> - Inspiration and eye candy</li>
|
||||
<li><a href="https://ui.shadcn.com/" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">shadcn/ui</a> - More inspiration, because we're magpies for good ideas</li>
|
||||
<li><a href="https://ui.shadcn.com/" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">shadcn/ui</a> - Major inspiration and component ideas</li>
|
||||
<li><a href="https://devdojo.com/pines" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">Pines UI</a> - More inspiration and eye candy</li>
|
||||
<li><a href="https://daisyui.com/" target="_blank" rel="noopener noreferrer" class="text-primary underline underline-offset-4 hover:text-primary/80">daisyUI</a> - For showing us the power of Tailwind components</li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user