diff --git a/pkg/nebula/components/blocks/layout.templ b/pkg/nebula/components/blocks/layout.templ index 7840db804..0de7860c7 100644 --- a/pkg/nebula/components/blocks/layout.templ +++ b/pkg/nebula/components/blocks/layout.templ @@ -39,7 +39,11 @@ templ LayoutNoBody(title string, remote bool) {
- { children... } + +
+ { children... } +
+
} diff --git a/pkg/nebula/components/blocks/layout_templ.go b/pkg/nebula/components/blocks/layout_templ.go index 8fac4dac5..e6bbb9414 100644 --- a/pkg/nebula/components/blocks/layout_templ.go +++ b/pkg/nebula/components/blocks/layout_templ.go @@ -124,7 +124,7 @@ func LayoutNoBody(title string, remote bool) templ.Component { if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
") + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -132,7 +132,7 @@ func LayoutNoBody(title string, remote bool) templ.Component { if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
") + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } diff --git a/pkg/nebula/components/sections/hero.templ b/pkg/nebula/components/sections/hero.templ index 7badb9372..4f6531064 100644 --- a/pkg/nebula/components/sections/hero.templ +++ b/pkg/nebula/components/sections/hero.templ @@ -44,41 +44,50 @@ templ SectionHero(hero Hero) { - - -
- Hero -
- -
-
- -
-

0K

-

Assets packed with power beyond your imagination.

-
- -
-

0K

-

Assets packed with power beyond your imagination.

-
- -
-

0M+

-

Assets packed with power beyond your imagination.

-
- -
-

0K

-

Assets packed with power beyond your imagination.

-
-
- @counterAnimation() + @heroImage() + @stats()
} +templ heroImage() { + +
+ Hero +
+} + +templ stats() { + +
+
+ +
+

0K

+

Assets packed with power beyond your imagination.

+
+ +
+

0K

+

Assets packed with power beyond your imagination.

+
+ +
+

0M+

+

Assets packed with power beyond your imagination.

+
+
+ @counterAnimation() +
+} + script counterAnimation() { document.addEventListener('alpine:init', () => { Alpine.data('counter', (target = 0, duration = 3000) => ({ diff --git a/pkg/nebula/components/sections/hero_templ.go b/pkg/nebula/components/sections/hero_templ.go index 949c313b5..c6c21bd58 100644 --- a/pkg/nebula/components/sections/hero_templ.go +++ b/pkg/nebula/components/sections/hero_templ.go @@ -138,11 +138,15 @@ func SectionHero(hero Hero) templ.Component { if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
\"Hero\"

0K

Assets packed with power beyond your imagination.

0K

Assets packed with power beyond your imagination.

0M+

Assets packed with power beyond your imagination.

0K

Assets packed with power beyond your imagination.

") + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = counterAnimation().Render(ctx, templ_7745c5c3_Buffer) + templ_7745c5c3_Err = heroImage().Render(ctx, templ_7745c5c3_Buffer) + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = stats().Render(ctx, templ_7745c5c3_Buffer) if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -154,60 +158,126 @@ func SectionHero(hero Hero) templ.Component { }) } +func heroImage() templ.Component { + return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { + templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context + if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { + return templ_7745c5c3_CtxErr + } + templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W) + if !templ_7745c5c3_IsBuffer { + defer func() { + templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer) + if templ_7745c5c3_Err == nil { + templ_7745c5c3_Err = templ_7745c5c3_BufErr + } + }() + } + ctx = templ.InitializeContext(ctx) + templ_7745c5c3_Var10 := templ.GetChildren(ctx) + if templ_7745c5c3_Var10 == nil { + templ_7745c5c3_Var10 = templ.NopComponent + } + ctx = templ.ClearChildren(ctx) + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
\"Hero\"
") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + return templ_7745c5c3_Err + }) +} + +func stats() templ.Component { + return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { + templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context + if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { + return templ_7745c5c3_CtxErr + } + templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W) + if !templ_7745c5c3_IsBuffer { + defer func() { + templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer) + if templ_7745c5c3_Err == nil { + templ_7745c5c3_Err = templ_7745c5c3_BufErr + } + }() + } + ctx = templ.InitializeContext(ctx) + templ_7745c5c3_Var11 := templ.GetChildren(ctx) + if templ_7745c5c3_Var11 == nil { + templ_7745c5c3_Var11 = templ.NopComponent + } + ctx = templ.ClearChildren(ctx) + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("

0K

Assets packed with power beyond your imagination.

0K

Assets packed with power beyond your imagination.

0M+

Assets packed with power beyond your imagination.

") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = counterAnimation().Render(ctx, templ_7745c5c3_Buffer) + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("
") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + return templ_7745c5c3_Err + }) +} + func counterAnimation() templ.ComponentScript { return templ.ComponentScript{ - Name: `__templ_counterAnimation_57a0`, - Function: `function __templ_counterAnimation_57a0(){document.addEventListener('alpine:init', () => { - Alpine.data('counter', (target = 0, duration = 3000) => ({ - startTimestamp: null, - step: null, - rawValue: 0, - counterValue: 0, - target: target, - precision: (target % 1 === 0) ? 0 : (target.toString().split('.')[1] || []).length, - animationRequestId: null, - animationCompleted: false, - observer: null, - init() { - // Intersection observer to watch visibility - this.observer = new IntersectionObserver(entries => { - entries.forEach(entry => { - // Check if element is in view - if (entry.isIntersecting && !this.animationCompleted) { - this.startAnimation() - } - }) - }) - this.observer.observe(this.$el) - }, - startAnimation() { - this.step = (timestamp) => { - if (!this.startTimestamp) this.startTimestamp = timestamp - const progress = Math.min((timestamp - this.startTimestamp) / duration, 1) - const easedProgress = this.easeOut(progress) - this.rawValue = parseFloat((easedProgress * this.target).toFixed(this.precision)) - this.counterValue = this.rawValue.toFixed(this.precision) - if (progress < 1) { - this.animationRequestId = window.requestAnimationFrame(this.step) - } else { - this.animationCompleted = true - } - } - this.animationRequestId = window.requestAnimationFrame(this.step); - }, - easeOut(t) { - return 1 - Math.pow(1 - t, 5) - }, - destroy() { - // Detach the handler, avoiding memory and side-effect leakage - this.animationRequestId && window.cancelAnimationFrame(this.step) - this.observer && this.observer.disconnect() - }, - })) - }) + Name: `__templ_counterAnimation_524d`, + Function: `function __templ_counterAnimation_524d(){document.addEventListener('alpine:init', () => { + Alpine.data('counter', (target = 0, duration = 3000) => ({ + startTimestamp: null, + step: null, + rawValue: 0, + counterValue: 0, + target: target, + precision: (target % 1 === 0) ? 0 : (target.toString().split('.')[1] || []).length, + animationRequestId: null, + animationCompleted: false, + observer: null, + init() { + // Intersection observer to watch visibility + this.observer = new IntersectionObserver(entries => { + entries.forEach(entry => { + // Check if element is in view + if (entry.isIntersecting && !this.animationCompleted) { + this.startAnimation() + } + }) + }) + this.observer.observe(this.$el) + }, + startAnimation() { + this.step = (timestamp) => { + if (!this.startTimestamp) this.startTimestamp = timestamp + const progress = Math.min((timestamp - this.startTimestamp) / duration, 1) + const easedProgress = this.easeOut(progress) + this.rawValue = parseFloat((easedProgress * this.target).toFixed(this.precision)) + this.counterValue = this.rawValue.toFixed(this.precision) + if (progress < 1) { + this.animationRequestId = window.requestAnimationFrame(this.step) + } else { + this.animationCompleted = true + } + } + this.animationRequestId = window.requestAnimationFrame(this.step); + }, + easeOut(t) { + return 1 - Math.pow(1 - t, 5) + }, + destroy() { + // Detach the handler, avoiding memory and side-effect leakage + this.animationRequestId && window.cancelAnimationFrame(this.step) + this.observer && this.observer.disconnect() + }, + })) + }) }`, - Call: templ.SafeScript(`__templ_counterAnimation_57a0`), - CallInline: templ.SafeScriptInline(`__templ_counterAnimation_57a0`), + Call: templ.SafeScript(`__templ_counterAnimation_524d`), + CallInline: templ.SafeScriptInline(`__templ_counterAnimation_524d`), } }