From 11b1f9457f3fc2bd3df036fc6ec83204c33f32dd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E2=80=9Caxzilla=E2=80=9D?= Date: Wed, 9 Oct 2024 11:41:16 +0200 Subject: [PATCH] change: improve how to --- internals/ui/pages/howto.templ | 37 +++++++++++++++++++++++++++------- 1 file changed, 30 insertions(+), 7 deletions(-) diff --git a/internals/ui/pages/howto.templ b/internals/ui/pages/howto.templ index b2e5be5..0d3f1bc 100644 --- a/internals/ui/pages/howto.templ +++ b/internals/ui/pages/howto.templ @@ -66,13 +66,36 @@ templ HowToUse() {
  • Using Goilerplate components: -

    - Create a components folder in your project. Copy Goilerplate component code from our - - components documentation - - into .templ files in this folder. -

    +

    You have two options for integrating Goilerplate components:

    +
      +
    1. +

      Option A: Install as a package (Quick and Easy)

      + 
      +									go get github.com/axzilla/goilerplate
+
      +

      Then import and use in your Templ files:

      + 
      +									
+										{ `import "github.com/axzilla/goilerplate/pkg/components"
+
+// In your Templ files
+@components.Button(components.ButtonProps{...})
+@components.Icon(components.IconProps{...})` }
+									
+
      +
      2. +
    2. + Option B: Copy-Paste Method (For full customization) +

      + Create a components folder in your project. Copy desired component code from our + + components documentation + + into .templ files in this folder. For icons, create a separate icons folder and copy the necessary icon files. +

      +
      3. +
    +

    Choose the option that best fits your project needs and customization requirements.

  • Start development: