From fcd2d7eb9788e07777a4a4e85e6c3fef9166b147 Mon Sep 17 00:00:00 2001 From: axzilla Date: Thu, 28 Nov 2024 14:59:38 +0700 Subject: [PATCH] fix: set correct file names on some showcase examples --- assets/css/output.css | 4 -- internals/ui/modules/example_wrapper.templ | 48 ++++++++++++++-------- internals/ui/pages/card.templ | 4 +- internals/ui/pages/dropdown_menu.templ | 12 +++--- internals/ui/pages/icon.templ | 35 +++++++--------- 5 files changed, 54 insertions(+), 49 deletions(-) diff --git a/assets/css/output.css b/assets/css/output.css index 60e6045..7f133de 100644 --- a/assets/css/output.css +++ b/assets/css/output.css @@ -653,10 +653,6 @@ body { visibility: hidden; } -.static { - position: static; -} - .fixed { position: fixed; } diff --git a/internals/ui/modules/example_wrapper.templ b/internals/ui/modules/example_wrapper.templ index eba1500..776fcf9 100644 --- a/internals/ui/modules/example_wrapper.templ +++ b/internals/ui/modules/example_wrapper.templ @@ -34,25 +34,39 @@ templ ExampleWrapper(p ExampleWrapperProps) {

{ p.SectionName }

@components.Tabs(components.TabsProps{ - Tabs: []components.Tab{ - { - ID: "preview", - Title: "Preview", - Content: showcaseWrapper(showcaseWrapperProps{Content: p.ShowcaseFile, Class: p.ShowcaseClass}), - }, - { - ID: "code", - Title: "Code", - Content: CodeSnippetFromEmbedded(p.PreviewCodeFile, "go", showcase.TemplFiles), - }, - { - ID: "component", - Title: "Component", - Content: CodeSnippetFromEmbedded(p.ComponentCodeFile, "go", components.TemplFiles), - }, - }, + Tabs: generateTabs(p), // Extrahiere Logik in separate Funktion TabsContainerClass: "md:w-1/2", ContentContainerClass: "w-full", })
} + +// generateTabs erstellt die Tabs basierend auf den Props +func generateTabs(p ExampleWrapperProps) []components.Tab { + tabs := []components.Tab{ + { + ID: "preview", + Title: "Preview", + Content: showcaseWrapper(showcaseWrapperProps{ + Content: p.ShowcaseFile, + Class: p.ShowcaseClass, + }), + }, + { + ID: "code", + Title: "Code", + Content: CodeSnippetFromEmbedded(p.PreviewCodeFile, "go", showcase.TemplFiles), + }, + } + + // Füge Component Tab nur hinzu wenn gewünscht + if p.ComponentCodeFile != "" { + tabs = append(tabs, components.Tab{ + ID: "component", + Title: "Component", + Content: CodeSnippetFromEmbedded(p.ComponentCodeFile, "go", components.TemplFiles), + }) + } + + return tabs +} diff --git a/internals/ui/pages/card.templ b/internals/ui/pages/card.templ index d7048b2..ecf2663 100644 --- a/internals/ui/pages/card.templ +++ b/internals/ui/pages/card.templ @@ -15,8 +15,8 @@ templ Card() { @modules.ExampleWrapper(modules.ExampleWrapperProps{ SectionName: "Default", ShowcaseFile: showcase.CardDefault(), - PreviewCodeFile: "button_default.templ", - ComponentCodeFile: "button.templ", + PreviewCodeFile: "card_default.templ", + ComponentCodeFile: "card.templ", }) @modules.ExampleWrapper(modules.ExampleWrapperProps{ SectionName: "With Image Left", diff --git a/internals/ui/pages/dropdown_menu.templ b/internals/ui/pages/dropdown_menu.templ index e0ae5e4..430916a 100644 --- a/internals/ui/pages/dropdown_menu.templ +++ b/internals/ui/pages/dropdown_menu.templ @@ -15,20 +15,20 @@ templ DropdownMenu() { @modules.ExampleWrapper(modules.ExampleWrapperProps{ SectionName: "Default", ShowcaseFile: showcase.DropdownMenuDefault(), - PreviewCodeFile: "dropdownmenu.templ", - ComponentCodeFile: "dropdownmenu.templ", + PreviewCodeFile: "dropdown_menu_default.templ", + ComponentCodeFile: "dropdown_menu.templ", }) @modules.ExampleWrapper(modules.ExampleWrapperProps{ SectionName: "With Icons", ShowcaseFile: showcase.DropdownMenuWithIcons(), - PreviewCodeFile: "dropdownmenu_with_icons.templ", - ComponentCodeFile: "dropdownmenu.templ", + PreviewCodeFile: "dropdown_menu_with_icons.templ", + ComponentCodeFile: "dropdown_menu.templ", }) @modules.ExampleWrapper(modules.ExampleWrapperProps{ SectionName: "Advanced", ShowcaseFile: showcase.DropdownMenuAdvanced(), - PreviewCodeFile: "dropdownmenu_advanced.templ", - ComponentCodeFile: "dropdownmenu.templ", + PreviewCodeFile: "dropdown_menu_advanced.templ", + ComponentCodeFile: "dropdown_menu.templ", }) } } diff --git a/internals/ui/pages/icon.templ b/internals/ui/pages/icon.templ index 5a95c90..3ec2a7a 100644 --- a/internals/ui/pages/icon.templ +++ b/internals/ui/pages/icon.templ @@ -13,34 +13,29 @@ templ Icon() { Description: templ.Raw(`A wrapper for Lucide Icons with optional settings for size, color, fill, stroke, and custom classes. Browse available icons in the Lucide library to see what you can use.`), }) { @modules.ExampleWrapper(modules.ExampleWrapperProps{ - SectionName: "Default", - ShowcaseFile: showcase.IconDefault(), - PreviewCodeFile: "icon_default.templ", - ComponentCodeFile: "icon.templ", + SectionName: "Default", + ShowcaseFile: showcase.IconDefault(), + PreviewCodeFile: "icon_default.templ", }) @modules.ExampleWrapper(modules.ExampleWrapperProps{ - SectionName: "Colored", - ShowcaseFile: showcase.IconColored(), - PreviewCodeFile: "icon_colored.templ", - ComponentCodeFile: "icon.templ", + SectionName: "Colored", + ShowcaseFile: showcase.IconColored(), + PreviewCodeFile: "icon_colored.templ", }) @modules.ExampleWrapper(modules.ExampleWrapperProps{ - SectionName: "Filled", - ShowcaseFile: showcase.IconFilled(), - PreviewCodeFile: "icon_filled.templ", - ComponentCodeFile: "icon.templ", + SectionName: "Filled", + ShowcaseFile: showcase.IconFilled(), + PreviewCodeFile: "icon_filled.templ", }) @modules.ExampleWrapper(modules.ExampleWrapperProps{ - SectionName: "Sizes", - ShowcaseFile: showcase.IconSizes(), - PreviewCodeFile: "icon_sizes.templ", - ComponentCodeFile: "icon.templ", + SectionName: "Sizes", + ShowcaseFile: showcase.IconSizes(), + PreviewCodeFile: "icon_sizes.templ", }) @modules.ExampleWrapper(modules.ExampleWrapperProps{ - SectionName: "Custom Classes", - ShowcaseFile: showcase.IconCustomClasses(), - PreviewCodeFile: "icon_custom_classes.templ", - ComponentCodeFile: "icon.templ", + SectionName: "Custom Classes", + ShowcaseFile: showcase.IconCustomClasses(), + PreviewCodeFile: "icon_custom_classes.templ", }) } }