mirror of
https://github.com/axzilla/templui.git
synced 2025-02-19 07:37:54 +00:00
Merge pull request #46 from zyriab/main
Fix card component not compiling properly + docs inconsistencies
This commit is contained in:
commit
2e9d6c64bb
11
assets/img/alpinejs-mark.svg
Normal file
11
assets/img/alpinejs-mark.svg
Normal file
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 8.0 KiB |
1
assets/img/tailwindcss-mark.svg
Normal file
1
assets/img/tailwindcss-mark.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 54 33"><g clip-path="url(#prefix__clip0)"><path fill="#38bdf8" fill-rule="evenodd" d="M27 0c-7.2 0-11.7 3.6-13.5 10.8 2.7-3.6 5.85-4.95 9.45-4.05 2.054.513 3.522 2.004 5.147 3.653C30.744 13.09 33.808 16.2 40.5 16.2c7.2 0 11.7-3.6 13.5-10.8-2.7 3.6-5.85 4.95-9.45 4.05-2.054-.513-3.522-2.004-5.147-3.653C36.756 3.11 33.692 0 27 0zM13.5 16.2C6.3 16.2 1.8 19.8 0 27c2.7-3.6 5.85-4.95 9.45-4.05 2.054.514 3.522 2.004 5.147 3.653C17.244 29.29 20.308 32.4 27 32.4c7.2 0 11.7-3.6 13.5-10.8-2.7 3.6-5.85 4.95-9.45 4.05-2.054-.513-3.522-2.004-5.147-3.653C23.256 19.31 20.192 16.2 13.5 16.2z" clip-rule="evenodd"/></g><defs><clipPath id="prefix__clip0"><path fill="#fff" d="M0 0h54v32.4H0z"/></clipPath></defs></svg>
|
After Width: | Height: | Size: 771 B |
19
assets/img/templ-mark.svg
Normal file
19
assets/img/templ-mark.svg
Normal file
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 41 KiB |
2
go.mod
2
go.mod
@ -4,6 +4,6 @@ go 1.23.3
|
||||
|
||||
require (
|
||||
github.com/Oudwins/tailwind-merge-go v0.2.0
|
||||
github.com/a-h/templ v0.3.819
|
||||
github.com/a-h/templ v0.3.833
|
||||
github.com/joho/godotenv v1.5.1
|
||||
)
|
||||
|
6
go.sum
6
go.sum
@ -1,9 +1,7 @@
|
||||
github.com/Oudwins/tailwind-merge-go v0.2.0 h1:rtVHgYmLwwae4P+K6//ceRuUdyz3Bny6fo4664fOEmo=
|
||||
github.com/Oudwins/tailwind-merge-go v0.2.0/go.mod h1:kkZodgOPvZQ8f7SIrlWkG/w1g9JTbtnptnePIh3V72U=
|
||||
github.com/a-h/templ v0.2.793 h1:Io+/ocnfGWYO4VHdR0zBbf39PQlnzVCVVD+wEEs6/qY=
|
||||
github.com/a-h/templ v0.2.793/go.mod h1:lq48JXoUvuQrU0VThrK31yFwdRjTCnIE5bcPCM9IP1w=
|
||||
github.com/a-h/templ v0.3.819 h1:KDJ5jTFN15FyJnmSmo2gNirIqt7hfvBD2VXVDTySckM=
|
||||
github.com/a-h/templ v0.3.819/go.mod h1:iDJKJktpttVKdWoTkRNNLcllRI+BlpopJc+8au3gOUo=
|
||||
github.com/a-h/templ v0.3.833 h1:L/KOk/0VvVTBegtE0fp2RJQiBm7/52Zxv5fqlEHiQUU=
|
||||
github.com/a-h/templ v0.3.833/go.mod h1:cAu4AiZhtJfBjMY0HASlyzvkrtjnHWPeEsyGK2YYmfk=
|
||||
github.com/davecgh/go-spew v1.1.1 h1:vj9j/u1bqnvCEfJOwUhtlOARqs3+rkHYY13jYWTU97c=
|
||||
github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
|
||||
github.com/google/go-cmp v0.6.0 h1:ofyhxvXcZhMsU5ulbFiLKl/XBFqE1GSq7atu8tAmTRI=
|
||||
|
@ -10,17 +10,17 @@ type SidebarRightLItem struct {
|
||||
|
||||
var SidebarRightLinks = []SidebarRightLItem{
|
||||
{
|
||||
ImageSrc: "https://templ.guide/img/logo.svg",
|
||||
ImageSrc: "/assets/img/templ-mark.svg",
|
||||
Url: "https://templ.guide",
|
||||
Text: "Elevate your Go projects with type-safe, efficient HTML templating.",
|
||||
},
|
||||
{
|
||||
ImageSrc: "https://alpinejs.dev/alpine_long.svg",
|
||||
ImageSrc: "/assets/img/alpinejs-mark.svg",
|
||||
Url: "https://alpinejs.dev",
|
||||
Text: "Simplify your JavaScript with a lightweight, powerful framework.",
|
||||
},
|
||||
{
|
||||
ImageSrc: "https://tailwindcss.com/_next/static/media/tailwindcss-logotype-white.944c5d0ef628083bb316f9b3d643385c86bcdb3d.svg",
|
||||
ImageSrc: "/assets/img/tailwindcss-mark.svg",
|
||||
Url: "https://tailwindcss.com",
|
||||
Text: "Create beautiful, responsive designs with ease.",
|
||||
},
|
||||
@ -58,3 +58,4 @@ templ SidebarRight() {
|
||||
</div>
|
||||
</aside>
|
||||
}
|
||||
|
||||
|
@ -54,7 +54,7 @@ tailwind:
|
||||
dev:
|
||||
make -j3 templ server tailwind`
|
||||
|
||||
var tailwindConfig = `{/** @type {import('tailwindcss').Config} */
|
||||
var tailwindConfig = `/** @type {import('tailwindcss').Config} */
|
||||
const config = {
|
||||
darkMode: ["class"],
|
||||
content: ["./**/*.html", "./**/*.templ", "./**/*.go"],
|
||||
@ -236,10 +236,10 @@ templ HowToUse() {
|
||||
@components.Code(components.CodeProps{Language: "shell", ShowCopyButton: true}) {
|
||||
{ installGo }
|
||||
}
|
||||
<p class="text-sm mt-2">For installation instructions, visit <a href="https://golang.org/dl" class="text-primary underline">golang.org/dl</a>.</p>
|
||||
<p class="text-sm mt-2">For installation instructions, visit <a href="https://golang.org/dl" class="text-primary underline" target="_blank">golang.org/dl</a>.</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-2">2. Templ (v0.3.819 or later)</h3>
|
||||
<h3 class="text-xl font-semibold mb-2">2. Templ (v0.3.833 or later)</h3>
|
||||
<p class="mb-2">Install the Templ CLI:</p>
|
||||
@components.Code(components.CodeProps{Language: "shell", ShowCopyButton: true}) {
|
||||
{ installTempl }
|
||||
@ -386,7 +386,7 @@ templ HowToUse() {
|
||||
<li>Automated file watching and rebuilding</li>
|
||||
</ul>
|
||||
<p class="mt-2 text-sm">
|
||||
The Makefile configuration is based on the <a href="https://templ.guide" class="text-primary underline">Templ documentation</a> and adapted for our use case.
|
||||
The Makefile configuration is based on the <a href="https://templ.guide" class="text-primary underline" target="_blank">Templ documentation</a> and adapted for our use case.
|
||||
While there are many ways to set up your development environment, this configuration provides a solid starting point.
|
||||
</p>
|
||||
</div>
|
||||
@ -441,7 +441,7 @@ templ HowToUse() {
|
||||
<div>
|
||||
<h3 class="text-xl font-semibold mb-2">1. Quickstart Template (Recommended for new projects)</h3>
|
||||
<p class="mb-4">
|
||||
For a ready-to-go setup, check out our <a href="https://github.com/axzilla/templui-quickstart" class="text-primary underline">TemplUI Quickstart</a> template.
|
||||
For a ready-to-go setup, check out our <a href="https://github.com/axzilla/templui-quickstart" class="text-primary underline" target="_blank">TemplUI Quickstart</a> template.
|
||||
It includes all requirements and configurations, using TemplUI as a package library by default but can be easily modified to use copied components or a mix of both approaches.
|
||||
</p>
|
||||
</div>
|
||||
@ -525,9 +525,9 @@ templ HowToUse() {
|
||||
For advanced configuration and best practices, refer to the official documentation:
|
||||
</p>
|
||||
<ul class="list-disc pl-6 space-y-2">
|
||||
<li><a href="https://templ.guide" class="text-primary underline">Templ Guide</a> - Cache configuration, component patterns, etc.</li>
|
||||
<li><a href="https://tailwindcss.com/docs" class="text-primary underline">Tailwind CSS</a> - Custom theming, plugins, optimization</li>
|
||||
<li><a href="https://alpinejs.dev/docs" class="text-primary underline">Alpine.js</a> - Advanced interactivity, state management</li>
|
||||
<li><a href="https://templ.guide" class="text-primary underline" target="_blank">Templ Guide</a> - Cache configuration, component patterns, etc.</li>
|
||||
<li><a href="https://tailwindcss.com/docs" class="text-primary underline" target="_blank">Tailwind CSS</a> - Custom theming, plugins, optimization</li>
|
||||
<li><a href="https://alpinejs.dev/docs" class="text-primary underline" target="_blank">Alpine.js</a> - Advanced interactivity, state management</li>
|
||||
</ul>
|
||||
<p class="text-sm mt-4">Note: Our quickstart template includes recommended configurations for production use.</p>
|
||||
</section>
|
||||
@ -545,3 +545,4 @@ templ HowToUse() {
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -16,9 +16,10 @@ templ Label() {
|
||||
Alpine: true,
|
||||
}) {
|
||||
@modules.ExampleWrapper(modules.ExampleWrapperProps{
|
||||
SectionName: "",
|
||||
ShowcaseFile: showcase.CheckboxWithLabel(),
|
||||
PreviewCodeFile: "checkbox_with_label.templ",
|
||||
SectionName: "",
|
||||
ShowcaseFile: showcase.CheckboxWithLabel(),
|
||||
PreviewCodeFile: "checkbox_with_label.templ",
|
||||
ComponentCodeFile: "label.templ",
|
||||
})
|
||||
<div>
|
||||
@components.Card(components.CardProps{}) {
|
||||
@ -60,3 +61,4 @@ templ Label() {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
@ -174,7 +174,7 @@ func CardImage(props CardImageProps) templ.Component {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var7 string
|
||||
templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs("aspect-ratio: " + props.AspectRatio)
|
||||
templ_7745c5c3_Var7, templ_7745c5c3_Err = templruntime.SanitizeStyleAttributeValues("aspect-ratio: " + props.AspectRatio)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/card.templ`, Line: 70, Col: 47}
|
||||
}
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package components
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.3.819
|
||||
// templ: version: v0.3.833
|
||||
package helpers
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
Loading…
x
Reference in New Issue
Block a user