mirror of
https://github.com/sonr-io/sonr.git
synced 2026-08-03 01:41:44 +00:00
feature/1114 implement account interface (#1167)
- **refactor: move session-related code to middleware package** - **refactor: update PKL build process and adjust related configurations** - **feat: integrate base.cosmos.v1 Genesis module** - **refactor: pass session context to modal rendering functions** - **refactor: move nebula package to app directory and update templ version** - **refactor: Move home section video view to dedicated directory** - **refactor: remove unused views file** - **refactor: move styles and UI components to global scope** - **refactor: Rename images.go to cdn.go** - **feat: Add Empty State Illustrations** - **refactor: Consolidate Vault Index Logic** - **fix: References to App.wasm and remove Vault Directory embedded CDN files** - **refactor: Move CDN types to Models** - **fix: Correct line numbers in templ error messages for arch_templ.go** - **refactor: use common types for peer roles** - **refactor: move common types and ORM to a shared package** - **fix: Config import dwn** - **refactor: move nebula directory to app** - **feat: Rebuild nebula** - **fix: correct file paths in panels templates** - **feat: Remove duplicate types** - **refactor: Move dwn to pkg/core** - **refactor: Binary Structure** - **feat: Introduce Crypto Pkg** - **fix: Broken Process Start** - **feat: Update pkg/* structure** - **feat: Refactor PKL Structure** - **build: update pkl build process** - **chore: Remove Empty Files** - **refactor: remove unused macaroon package** - **feat: Add WebAwesome Components** - **refactor: consolidate build and generation tasks into a single taskfile, remove redundant makefile targets** - **refactor: refactor server and move components to pkg/core/dwn** - **build: update go modules** - **refactor: move gateway logic into dedicated hway command** - **feat: Add KSS (Krawczyk-Song-Song) MPC cryptography module** - **feat: Implement MPC-based JWT signing and UCAN token generation** - **feat: add support for MPC-based JWT signing** - **feat: Implement MPC-based UCAN capabilities for smart accounts** - **feat: add address field to keyshareSource** - **feat: Add comprehensive MPC test suite for keyshares, UCAN tokens, and token attenuations** - **refactor: improve MPC keyshare management and signing process** - **feat: enhance MPC capability hierarchy documentation** - **refactor: rename GenerateKeyshares function to NewKeyshareSource for clarity** - **refactor: remove unused Ethereum address computation** - **feat: Add HasHandle and IsAuthenticated methods to HTTPContext** - **refactor: Add context.Context support to session HTTPContext** - **refactor: Resolve context interface conflicts in HTTPContext** - **feat: Add session ID context key and helper functions** - **feat: Update WebApp Page Rendering** - **refactor: Simplify context management by using single HTTPContext key** - **refactor: Simplify HTTPContext creation and context management in session middleware** - **refactor: refactor session middleware to use a single data structure** - **refactor: Simplify HTTPContext implementation and session data handling** - **refactor: Improve session context handling and prevent nil pointer errors** - **refactor: Improve session context handling with nil safety and type support** - **refactor: improve session data injection** - **feat: add full-screen modal component and update registration flow** - **chore: add .air.toml to .gitignore** - **feat: add Air to devbox and update dependencies**
This commit is contained in:
Prad Nukala
@@ -0,0 +1,254 @@
|
||||
package landing
|
||||
|
||||
import models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Data Model │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// architecture is the (4th) home page architecture section
|
||||
var arch = &models.Architecture{
|
||||
Heading: "Onchain Security with Offchain Privacy",
|
||||
Subtitle: "Whenever you are ready, just hit publish to turn your site sketches into an actual designs. No creating, no skills, no reshaping.",
|
||||
Primary: &models.Technology{
|
||||
Title: "Decentralized Identity",
|
||||
Desc: "Sonr leverages the latest specifications from W3C, DIF, and ICF to essentially have an Interchain-Connected, Smart Account System - seamlessly authenticated with PassKeys.",
|
||||
Image: &models.Image{
|
||||
Src: models.HardwareWallet.Src(),
|
||||
Width: "721",
|
||||
Height: "280",
|
||||
},
|
||||
},
|
||||
Secondary: &models.Technology{
|
||||
Title: "IPFS Vaults",
|
||||
Desc: "Completely distributed, encrypted, and decentralized storage for your data.",
|
||||
Image: &models.Image{
|
||||
Src: models.DecentralizedNetwork.Src(),
|
||||
Width: "342",
|
||||
Height: "280",
|
||||
},
|
||||
},
|
||||
Tertiary: &models.Technology{
|
||||
Title: "Service Records",
|
||||
Desc: "On-chain validated services created by Developers for secure transmission of user data.",
|
||||
Image: &models.Image{
|
||||
Src: models.DefiDashboard.Src(),
|
||||
Width: "342",
|
||||
Height: "280",
|
||||
},
|
||||
},
|
||||
Quaternary: &models.Technology{
|
||||
Title: "Authentication & Authorization",
|
||||
Desc: "Sonr leverages decentralized Macaroons and Multi-Party Computation to provide a secure and decentralized authentication and authorization system.",
|
||||
Image: &models.Image{
|
||||
Src: models.PrivateKey.Src(),
|
||||
Width: "342",
|
||||
Height: "280",
|
||||
},
|
||||
},
|
||||
Quinary: &models.Technology{
|
||||
Title: "First-Class Exchange",
|
||||
Desc: "Sonr integrates with the IBC protocol allowing for seamless integration with popular exchanges such as OKX, Binance, and Osmosis.",
|
||||
Image: &models.Image{
|
||||
Src: models.CrossChainBridge.Src(),
|
||||
Width: "342",
|
||||
Height: "280",
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Render Section View │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// Architecture is the (4th) home page architecture section
|
||||
templ Architecture() {
|
||||
<!-- Features #2 -->
|
||||
<section>
|
||||
<div class="py-12 md:py-20">
|
||||
<div class="max-w-5xl mx-auto px-4 sm:px-6">
|
||||
<div
|
||||
class="relative max-w-3xl mx-auto text-center pb-12 md:pb-20"
|
||||
>
|
||||
<h2
|
||||
class="font-inter-tight text-3xl md:text-4xl font-bold text-zinc-900 mb-4"
|
||||
>
|
||||
{ arch.Heading }
|
||||
</h2>
|
||||
<p class="text-lg text-zinc-500">
|
||||
{ arch.Subtitle }
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
class="max-w-xs mx-auto sm:max-w-none grid sm:grid-cols-2 md:grid-cols-3 gap-8 sm:gap-4 lg:gap-8"
|
||||
>
|
||||
<article
|
||||
class="sm:col-span-2 flex flex-col border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg"
|
||||
>
|
||||
<div class="grow flex flex-col p-5 pt-6">
|
||||
<div class="flex items-center space-x-3 mb-1">
|
||||
<svg
|
||||
class="inline-flex fill-zinc-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
>
|
||||
<path
|
||||
d="M17 9c.6 0 1 .4 1 1v6a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h6c.6 0 1 .4 1 1s-.4 1-1 1H4v12h12v-6c0-.6.4-1 1-1Zm-.7-6.7c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4l-8 8c-.2.2-.4.3-.7.3-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l8-8Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-900">
|
||||
{ arch.Primary.Title }
|
||||
</h3>
|
||||
</div>
|
||||
<p class="grow max-w-md text-sm text-zinc-500">
|
||||
{ arch.Primary.Desc }
|
||||
</p>
|
||||
</div>
|
||||
<figure>
|
||||
<img
|
||||
class="h-[280px] object-cover object-left mx-auto sm:object-contain sm:h-auto"
|
||||
src={ arch.Primary.Image.Src }
|
||||
width="721"
|
||||
height="280"
|
||||
alt="Feature Post 01"
|
||||
/>
|
||||
</figure>
|
||||
</article>
|
||||
<article
|
||||
class="flex flex-col border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg"
|
||||
>
|
||||
<div class="grow flex flex-col p-5 pt-6">
|
||||
<div class="flex items-center space-x-3 mb-1">
|
||||
<svg
|
||||
class="inline-flex fill-zinc-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
>
|
||||
<path
|
||||
d="m6.035 17.335-4-14c-.2-.8.5-1.5 1.3-1.3l14 4c.9.3 1 1.5.1 1.9l-6.6 2.9-2.8 6.6c-.5.9-1.7.8-2-.1Zm-1.5-12.8 2.7 9.5 1.9-4.4c.1-.2.3-.4.5-.5l4.4-1.9-9.5-2.7Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-900">
|
||||
{ arch.Secondary.Title }
|
||||
</h3>
|
||||
</div>
|
||||
<p class="grow max-w-md text-sm text-zinc-500">
|
||||
{ arch.Secondary.Desc }
|
||||
</p>
|
||||
</div>
|
||||
<figure>
|
||||
<img
|
||||
class="h-[280px] object-cover object-left mx-auto sm:object-contain sm:h-auto"
|
||||
src={ arch.Secondary.Image.Src }
|
||||
width="342"
|
||||
height="280"
|
||||
alt="Feature Post 02"
|
||||
/>
|
||||
</figure>
|
||||
</article>
|
||||
<article
|
||||
class="flex flex-col border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg"
|
||||
>
|
||||
<div class="grow flex flex-col p-5 pt-6">
|
||||
<div class="flex items-center space-x-3 mb-1">
|
||||
<svg
|
||||
class="inline-flex fill-zinc-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
>
|
||||
<path
|
||||
d="M8.974 16c-.3 0-.7-.2-.9-.5l-2.2-3.7-2.1 2.8c-.3.4-1 .5-1.4.2-.4-.3-.5-1-.2-1.4l3-4c.2-.3.5-.4.9-.4.3 0 .6.2.8.5l2 3.3 3.3-8.1c0-.4.4-.7.8-.7s.8.2.9.6l4 8c.2.5 0 1.1-.4 1.3-.5.2-1.1 0-1.3-.4l-3-6-3.2 7.9c-.2.4-.6.6-1 .6Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-900">
|
||||
{ arch.Tertiary.Title }
|
||||
</h3>
|
||||
</div>
|
||||
<p class="grow max-w-md text-sm text-zinc-500">
|
||||
{ arch.Tertiary.Desc }
|
||||
</p>
|
||||
</div>
|
||||
<figure>
|
||||
<img
|
||||
class="h-[280px] object-cover object-left mx-auto sm:object-contain sm:h-auto"
|
||||
src={ arch.Tertiary.Image.Src }
|
||||
width="342"
|
||||
height="280"
|
||||
alt="Feature Post 03"
|
||||
/>
|
||||
</figure>
|
||||
</article>
|
||||
<article
|
||||
class="flex flex-col border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg"
|
||||
>
|
||||
<div class="grow flex flex-col p-5 pt-6">
|
||||
<div class="flex items-center space-x-3 mb-1">
|
||||
<svg
|
||||
class="inline-flex fill-zinc-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
>
|
||||
<path
|
||||
d="M9.3 11.7c-.4-.4-.4-1 0-1.4l7-7c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4l-7 7c-.4.4-1 .4-1.4 0ZM9.3 17.7c-.4-.4-.4-1 0-1.4l7-7c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4l-7 7c-.4.4-1 .4-1.4 0ZM2.3 12.7c-.4-.4-.4-1 0-1.4l7-7c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4l-7 7c-.4.4-1 .4-1.4 0Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-900">
|
||||
{ arch.Quaternary.Title }
|
||||
</h3>
|
||||
</div>
|
||||
<p class="grow max-w-md text-sm text-zinc-500">
|
||||
{ arch.Quaternary.Desc }
|
||||
</p>
|
||||
</div>
|
||||
<figure>
|
||||
<img
|
||||
class="h-[280px] object-cover object-left mx-auto sm:object-contain sm:h-auto"
|
||||
src={ arch.Quaternary.Image.Src }
|
||||
width="342"
|
||||
height="280"
|
||||
alt="Feature Post 04"
|
||||
/>
|
||||
</figure>
|
||||
</article>
|
||||
<article
|
||||
class="flex flex-col border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg"
|
||||
>
|
||||
<div class="grow flex flex-col p-5 pt-6">
|
||||
<div class="flex items-center space-x-3 mb-1">
|
||||
<svg
|
||||
class="inline-flex fill-zinc-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
>
|
||||
<path
|
||||
d="M16 2H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h8.667l3.733 2.8A1 1 0 0 0 18 17V4a2 2 0 0 0-2-2Zm0 13-2.4-1.8a1 1 0 0 0-.6-.2H4V4h12v11Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-900">
|
||||
{ arch.Quinary.Title }
|
||||
</h3>
|
||||
</div>
|
||||
<p class="grow max-w-md text-sm text-zinc-500">
|
||||
{ arch.Quinary.Desc }
|
||||
</p>
|
||||
</div>
|
||||
<figure>
|
||||
<img
|
||||
class="h-[280px] object-cover object-left mx-auto sm:object-contain sm:h-auto"
|
||||
src={ arch.Quinary.Image.Src }
|
||||
width="342"
|
||||
height="280"
|
||||
alt="Feature Post 05"
|
||||
/>
|
||||
</figure>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
@@ -0,0 +1,323 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.2.793
|
||||
package landing
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
||||
import "github.com/a-h/templ"
|
||||
import templruntime "github.com/a-h/templ/runtime"
|
||||
|
||||
import models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Data Model │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// architecture is the (4th) home page architecture section
|
||||
var arch = &models.Architecture{
|
||||
Heading: "Onchain Security with Offchain Privacy",
|
||||
Subtitle: "Whenever you are ready, just hit publish to turn your site sketches into an actual designs. No creating, no skills, no reshaping.",
|
||||
Primary: &models.Technology{
|
||||
Title: "Decentralized Identity",
|
||||
Desc: "Sonr leverages the latest specifications from W3C, DIF, and ICF to essentially have an Interchain-Connected, Smart Account System - seamlessly authenticated with PassKeys.",
|
||||
Image: &models.Image{
|
||||
Src: models.HardwareWallet.Src(),
|
||||
Width: "721",
|
||||
Height: "280",
|
||||
},
|
||||
},
|
||||
Secondary: &models.Technology{
|
||||
Title: "IPFS Vaults",
|
||||
Desc: "Completely distributed, encrypted, and decentralized storage for your data.",
|
||||
Image: &models.Image{
|
||||
Src: models.DecentralizedNetwork.Src(),
|
||||
Width: "342",
|
||||
Height: "280",
|
||||
},
|
||||
},
|
||||
Tertiary: &models.Technology{
|
||||
Title: "Service Records",
|
||||
Desc: "On-chain validated services created by Developers for secure transmission of user data.",
|
||||
Image: &models.Image{
|
||||
Src: models.DefiDashboard.Src(),
|
||||
Width: "342",
|
||||
Height: "280",
|
||||
},
|
||||
},
|
||||
Quaternary: &models.Technology{
|
||||
Title: "Authentication & Authorization",
|
||||
Desc: "Sonr leverages decentralized Macaroons and Multi-Party Computation to provide a secure and decentralized authentication and authorization system.",
|
||||
Image: &models.Image{
|
||||
Src: models.PrivateKey.Src(),
|
||||
Width: "342",
|
||||
Height: "280",
|
||||
},
|
||||
},
|
||||
Quinary: &models.Technology{
|
||||
Title: "First-Class Exchange",
|
||||
Desc: "Sonr integrates with the IBC protocol allowing for seamless integration with popular exchanges such as OKX, Binance, and Osmosis.",
|
||||
Image: &models.Image{
|
||||
Src: models.CrossChainBridge.Src(),
|
||||
Width: "342",
|
||||
Height: "280",
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Render Section View │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// Architecture is the (4th) home page architecture section
|
||||
func Architecture() 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_Var1 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var1 == nil {
|
||||
templ_7745c5c3_Var1 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!-- Features #2 --><section><div class=\"py-12 md:py-20\"><div class=\"max-w-5xl mx-auto px-4 sm:px-6\"><div class=\"relative max-w-3xl mx-auto text-center pb-12 md:pb-20\"><h2 class=\"font-inter-tight text-3xl md:text-4xl font-bold text-zinc-900 mb-4\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var2 string
|
||||
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Heading)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 76, Col: 20}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h2><p class=\"text-lg text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var3 string
|
||||
templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Subtitle)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 79, Col: 21}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p></div><div class=\"max-w-xs mx-auto sm:max-w-none grid sm:grid-cols-2 md:grid-cols-3 gap-8 sm:gap-4 lg:gap-8\"><article class=\"sm:col-span-2 flex flex-col border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg\"><div class=\"grow flex flex-col p-5 pt-6\"><div class=\"flex items-center space-x-3 mb-1\"><svg class=\"inline-flex fill-zinc-400\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"><path d=\"M17 9c.6 0 1 .4 1 1v6a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h6c.6 0 1 .4 1 1s-.4 1-1 1H4v12h12v-6c0-.6.4-1 1-1Zm-.7-6.7c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4l-8 8c-.2.2-.4.3-.7.3-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l8-8Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-900\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var4 string
|
||||
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Primary.Title)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 101, Col: 29}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h3></div><p class=\"grow max-w-md text-sm text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var5 string
|
||||
templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Primary.Desc)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 105, Col: 27}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p></div><figure><img class=\"h-[280px] object-cover object-left mx-auto sm:object-contain sm:h-auto\" src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var6 string
|
||||
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Primary.Image.Src)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 111, Col: 36}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" width=\"721\" height=\"280\" alt=\"Feature Post 01\"></figure></article><article class=\"flex flex-col border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg\"><div class=\"grow flex flex-col p-5 pt-6\"><div class=\"flex items-center space-x-3 mb-1\"><svg class=\"inline-flex fill-zinc-400\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"><path d=\"m6.035 17.335-4-14c-.2-.8.5-1.5 1.3-1.3l14 4c.9.3 1 1.5.1 1.9l-6.6 2.9-2.8 6.6c-.5.9-1.7.8-2-.1Zm-1.5-12.8 2.7 9.5 1.9-4.4c.1-.2.3-.4.5-.5l4.4-1.9-9.5-2.7Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-900\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var7 string
|
||||
templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Secondary.Title)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 134, Col: 31}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h3></div><p class=\"grow max-w-md text-sm text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var8 string
|
||||
templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Secondary.Desc)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 138, Col: 29}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p></div><figure><img class=\"h-[280px] object-cover object-left mx-auto sm:object-contain sm:h-auto\" src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var9 string
|
||||
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Secondary.Image.Src)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 144, Col: 38}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" width=\"342\" height=\"280\" alt=\"Feature Post 02\"></figure></article><article class=\"flex flex-col border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg\"><div class=\"grow flex flex-col p-5 pt-6\"><div class=\"flex items-center space-x-3 mb-1\"><svg class=\"inline-flex fill-zinc-400\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"><path d=\"M8.974 16c-.3 0-.7-.2-.9-.5l-2.2-3.7-2.1 2.8c-.3.4-1 .5-1.4.2-.4-.3-.5-1-.2-1.4l3-4c.2-.3.5-.4.9-.4.3 0 .6.2.8.5l2 3.3 3.3-8.1c0-.4.4-.7.8-.7s.8.2.9.6l4 8c.2.5 0 1.1-.4 1.3-.5.2-1.1 0-1.3-.4l-3-6-3.2 7.9c-.2.4-.6.6-1 .6Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-900\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var10 string
|
||||
templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Tertiary.Title)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 167, Col: 30}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h3></div><p class=\"grow max-w-md text-sm text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var11 string
|
||||
templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Tertiary.Desc)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 171, Col: 28}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p></div><figure><img class=\"h-[280px] object-cover object-left mx-auto sm:object-contain sm:h-auto\" src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var12 string
|
||||
templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Tertiary.Image.Src)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 177, Col: 37}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" width=\"342\" height=\"280\" alt=\"Feature Post 03\"></figure></article><article class=\"flex flex-col border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg\"><div class=\"grow flex flex-col p-5 pt-6\"><div class=\"flex items-center space-x-3 mb-1\"><svg class=\"inline-flex fill-zinc-400\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"><path d=\"M9.3 11.7c-.4-.4-.4-1 0-1.4l7-7c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4l-7 7c-.4.4-1 .4-1.4 0ZM9.3 17.7c-.4-.4-.4-1 0-1.4l7-7c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4l-7 7c-.4.4-1 .4-1.4 0ZM2.3 12.7c-.4-.4-.4-1 0-1.4l7-7c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4l-7 7c-.4.4-1 .4-1.4 0Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-900\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var13 string
|
||||
templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Quaternary.Title)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 200, Col: 32}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h3></div><p class=\"grow max-w-md text-sm text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var14 string
|
||||
templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Quaternary.Desc)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 204, Col: 30}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p></div><figure><img class=\"h-[280px] object-cover object-left mx-auto sm:object-contain sm:h-auto\" src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var15 string
|
||||
templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Quaternary.Image.Src)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 210, Col: 39}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" width=\"342\" height=\"280\" alt=\"Feature Post 04\"></figure></article><article class=\"flex flex-col border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg\"><div class=\"grow flex flex-col p-5 pt-6\"><div class=\"flex items-center space-x-3 mb-1\"><svg class=\"inline-flex fill-zinc-400\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"><path d=\"M16 2H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h8.667l3.733 2.8A1 1 0 0 0 18 17V4a2 2 0 0 0-2-2Zm0 13-2.4-1.8a1 1 0 0 0-.6-.2H4V4h12v11Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-900\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var16 string
|
||||
templ_7745c5c3_Var16, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Quinary.Title)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 233, Col: 29}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var16))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h3></div><p class=\"grow max-w-md text-sm text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var17 string
|
||||
templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Quinary.Desc)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 237, Col: 27}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p></div><figure><img class=\"h-[280px] object-cover object-left mx-auto sm:object-contain sm:h-auto\" src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var18 string
|
||||
templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(arch.Quinary.Image.Src)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/arch.templ`, Line: 243, Col: 36}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" width=\"342\" height=\"280\" alt=\"Feature Post 05\"></figure></article></div></div></div></section>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
var _ = templruntime.GeneratedTemplate
|
||||
@@ -0,0 +1,91 @@
|
||||
package landing
|
||||
|
||||
import models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Data Model │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
var cta = &models.CallToAction{
|
||||
Logo: &models.Image{
|
||||
Src: "https://cdn.sonr.id/logo-zinc.svg",
|
||||
Width: "60",
|
||||
Height: "60",
|
||||
},
|
||||
Heading: "Take control of your Identity",
|
||||
Subtitle: "Sonr is a decentralized, permissionless, and censorship-resistant identity network.",
|
||||
Primary: &models.Button{
|
||||
Href: "request-demo.html",
|
||||
Text: "Register",
|
||||
},
|
||||
Secondary: &models.Button{
|
||||
Href: "#0",
|
||||
Text: "Learn More",
|
||||
},
|
||||
}
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Render Section View │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
templ CallToAction() {
|
||||
<section>
|
||||
<div class="py-12 md:py-20">
|
||||
<div class="max-w-5xl mx-auto px-4 sm:px-6">
|
||||
<div class="relative max-w-3xl mx-auto text-center pb-12 md:pb-16">
|
||||
<div class="inline-flex items-center justify-center w-20 h-20 bg-white rounded-xl shadow-md mb-8 relative before:absolute before:-top-12 before:w-52 before:h-52 before:bg-zinc-900 before:opacity-[.08] before:rounded-full before:blur-3xl before:-z-10">
|
||||
<a href="index.html">
|
||||
<img src="https://cdn.sonr.id/logo-zinc.svg" width="60" height="60" alt="Logo"/>
|
||||
</a>
|
||||
</div>
|
||||
<h2 class="font-inter-tight text-3xl md:text-4xl font-bold text-zinc-900 mb-4">
|
||||
Take control of your Identity
|
||||
<em class="relative not-italic inline-flex justify-center items-end">
|
||||
today
|
||||
<svg class="absolute fill-zinc-300 w-[calc(100%+1rem)] -z-10" xmlns="http://www.w3.org/2000/svg" width="120" height="10" viewBox="0 0 120 10" aria-hidden="true" preserveAspectRatio="none">
|
||||
<path d="M118.273 6.09C79.243 4.558 40.297 5.459 1.305 9.034c-1.507.13-1.742-1.521-.199-1.81C39.81-.228 79.647-1.568 118.443 4.2c1.63.233 1.377 1.943-.17 1.89Z"></path>
|
||||
</svg>
|
||||
</em>
|
||||
</h2>
|
||||
<p class="text-lg text-zinc-500 mb-8">Sonr removes creative distances by connecting beginners, pros, and every team in between. Are you ready to start your journey?</p>
|
||||
<div class="max-w-xs mx-auto sm:max-w-none sm:inline-flex sm:justify-center space-y-4 sm:space-y-0 sm:space-x-4">
|
||||
<div>
|
||||
<a class="btn text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow" href="request-demo.html">Register</a>
|
||||
</div>
|
||||
<div>
|
||||
<a class="btn text-zinc-600 bg-white hover:text-zinc-900 w-full shadow" href="#0">Log in</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Clients -->
|
||||
<div class="text-center">
|
||||
<ul class="inline-flex flex-wrap items-center justify-center -m-2 [mask-image:linear-gradient(to_right,transparent_8px,_theme(colors.white/.7)_64px,_theme(colors.white)_50%,_theme(colors.white/.7)_calc(100%-64px),_transparent_calc(100%-8px))]">
|
||||
<li class="m-2 p-4 relative rounded-lg border border-transparent [background:linear-gradient(theme(colors.zinc.50),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box]">
|
||||
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-label="Fido Alliance" height="40" width="40"><path d="M7.849 7.513a1.085 1.085 0 1 0 1.085 1.086v-.001c0-.599-.486-1.085-1.085-1.085zM4.942 10.553v1.418H6.89v4.793h.704V14.04h.509v2.724h.71v-6.211H4.941zM14.122 11.089H14.1c-.287-.416-.862-.702-1.639-.702-1.489 0-2.797 1.224-2.786 3.319 0 1.936 1.181 3.201 2.659 3.201.797 0 1.56-.361 1.935-1.04l.117.893h1.669V7.651h-1.934zm0 2.904c0 .158-.012.313-.034.465l.002-.017c-.11.532-.574.925-1.13.925h-.014.001c-.797 0-1.318-.659-1.318-1.723 0-.978.446-1.767 1.329-1.767.606 0 1.022.437 1.138.947.014.09.023.194.023.3l-.001.054v-.003zM4.802 8.89l.475-1.6a2.914 2.914 0 0 0-.384-.101l-.019-.003a3.654 3.654 0 0 0-.829-.092 3.73 3.73 0 0 0-1.084.159l.027-.007a2.022 2.022 0 0 0-.38.153l.011-.005a2.624 2.624 0 0 0-.663.475c-.5.49-.754 1.155-.754 1.975v.708H-.001v1.418h1.199v4.793h1.921V11.97h1.199v-1.416H3.119v-.75a1.019 1.019 0 0 1 .23-.713l-.001.002a.736.736 0 0 1 .063-.062l.001-.001s.414-.41 1.389-.14zM20.306 10.388c-2.01 0-3.327 1.286-3.327 3.307s1.393 3.212 3.213 3.212c1.664 0 3.276-1.04 3.276-3.327-.002-1.874-1.267-3.192-3.162-3.192zm-.063 5.126c-.832 0-1.276-.797-1.276-1.871 0-.915.361-1.861 1.276-1.861.871 0 1.234.936 1.234 1.851 0 1.137-.482 1.882-1.234 1.882zM22.493 9.761h.232v.589h.14v-.589h.231v-.117h-.603v.117zM23.799 9.644l-.182.505-.181-.505h-.203v.707h.13V9.78l.198.571h.113l.195-.571v.571h.13v-.707h-.201z"></path></svg>
|
||||
<!-- <svg role="img" viewBox="0 0 24 24" width="40" height="40" aria-label="IPFS" xmlns="http://www.w3.org/2000/svg"><path d="M12 0L1.608 6v12L12 24l10.392-6V6zm-1.073 1.445h.001a1.8 1.8 0 002.138 0l7.534 4.35a1.794 1.794 0 000 .403l-7.535 4.35a1.8 1.8 0 00-2.137 0l-7.536-4.35a1.795 1.795 0 000-.402zM21.324 7.4c.109.08.226.147.349.201v8.7a1.8 1.8 0 00-1.069 1.852l-7.535 4.35a1.8 1.8 0 00-.349-.2l-.009-8.653a1.8 1.8 0 001.07-1.851zm-18.648.048l7.535 4.35a1.8 1.8 0 001.069 1.852v8.7c-.124.054-.24.122-.349.202l-7.535-4.35a1.8 1.8 0 00-1.069-1.852v-8.7c.124-.054.24-.122.35-.202z"></path></svg> -->
|
||||
</li>
|
||||
<li class="m-2 p-4 relative rounded-lg border border-transparent [background:linear-gradient(theme(colors.zinc.50),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box]">
|
||||
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" height="40" width="40" aria-label="Ethereum"><path d="M11.944 17.97L4.58 13.62 11.943 24l7.37-10.38-7.372 4.35h.003zM12.056 0L4.69 12.223l7.365 4.354 7.365-4.35L12.056 0z"></path></svg>
|
||||
</li>
|
||||
<li class="m-2 p-4 relative rounded-lg border border-transparent [background:linear-gradient(theme(colors.zinc.50),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box]">
|
||||
<svg role="img" viewBox="0 0 24 24" width="40" height="40" aria-label="Bitcoin" xmlns="http://www.w3.org/2000/svg"><path d="M23.638 14.904c-1.602 6.43-8.113 10.34-14.542 8.736C2.67 22.05-1.244 15.525.362 9.105 1.962 2.67 8.475-1.243 14.9.358c6.43 1.605 10.342 8.115 8.738 14.548v-.002zm-6.35-4.613c.24-1.59-.974-2.45-2.64-3.03l.54-2.153-1.315-.33-.525 2.107c-.345-.087-.705-.167-1.064-.25l.526-2.127-1.32-.33-.54 2.165c-.285-.067-.565-.132-.84-.2l-1.815-.45-.35 1.407s.975.225.955.236c.535.136.63.486.615.766l-1.477 5.92c-.075.166-.24.406-.614.314.015.02-.96-.24-.96-.24l-.66 1.51 1.71.426.93.242-.54 2.19 1.32.327.54-2.17c.36.1.705.19 1.05.273l-.51 2.154 1.32.33.545-2.19c2.24.427 3.93.257 4.64-1.774.57-1.637-.03-2.58-1.217-3.196.854-.193 1.5-.76 1.68-1.93h.01zm-3.01 4.22c-.404 1.64-3.157.75-4.05.53l.72-2.9c.896.23 3.757.67 3.33 2.37zm.41-4.24c-.37 1.49-2.662.735-3.405.55l.654-2.64c.744.18 3.137.524 2.75 2.084v.006z"></path></svg>
|
||||
</li>
|
||||
<li class="m-2 p-4 relative rounded-lg border border-transparent [background:linear-gradient(theme(colors.zinc.50),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box]">
|
||||
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="40" height="40" aria-label="Solana"><path d="m23.8764 18.0313-3.962 4.1393a.9201.9201 0 0 1-.306.2106.9407.9407 0 0 1-.367.0742H.4599a.4689.4689 0 0 1-.2522-.0733.4513.4513 0 0 1-.1696-.1962.4375.4375 0 0 1-.0314-.2545.4438.4438 0 0 1 .117-.2298l3.9649-4.1393a.92.92 0 0 1 .3052-.2102.9407.9407 0 0 1 .3658-.0746H23.54a.4692.4692 0 0 1 .2523.0734.4531.4531 0 0 1 .1697.196.438.438 0 0 1 .0313.2547.4442.4442 0 0 1-.1169.2297zm-3.962-8.3355a.9202.9202 0 0 0-.306-.2106.941.941 0 0 0-.367-.0742H.4599a.4687.4687 0 0 0-.2522.0734.4513.4513 0 0 0-.1696.1961.4376.4376 0 0 0-.0314.2546.444.444 0 0 0 .117.2297l3.9649 4.1394a.9204.9204 0 0 0 .3052.2102c.1154.049.24.0744.3658.0746H23.54a.469.469 0 0 0 .2523-.0734.453.453 0 0 0 .1697-.1961.4382.4382 0 0 0 .0313-.2546.4444.4444 0 0 0-.1169-.2297zM.46 6.7225h18.7815a.9411.9411 0 0 0 .367-.0742.9202.9202 0 0 0 .306-.2106l3.962-4.1394a.4442.4442 0 0 0 .117-.2297.4378.4378 0 0 0-.0314-.2546.453.453 0 0 0-.1697-.196.469.469 0 0 0-.2523-.0734H4.7596a.941.941 0 0 0-.3658.0745.9203.9203 0 0 0-.3052.2102L.1246 5.9687a.4438.4438 0 0 0-.1169.2295.4375.4375 0 0 0 .0312.2544.4512.4512 0 0 0 .1692.196.4689.4689 0 0 0 .2518.0739z"></path></svg>
|
||||
<!-- <svg width="40" height="40" viewBox="0 0 164 164" xmlns="http://www.w3.org/2000/svg" aria-label="Sonr"> -->
|
||||
<!-- <path d="M71.8077 133.231C74.5054 135.928 78.1636 137.443 81.978 137.443C85.7924 137.443 89.4506 135.928 92.1483 133.231L133.219 92.1638C135.909 89.4654 137.42 85.8102 137.42 81.9998C137.42 78.1895 135.909 74.5345 133.219 71.8361L112.886 51.5272L131.665 32.7499L152.031 53.1143C159.696 60.7963 164 71.2046 164 82.0559C164 92.9072 159.696 103.315 152.031 110.997L110.95 152.065C107.154 155.869 102.642 158.883 97.6739 160.931C92.7059 162.98 87.3809 164.023 82.0071 164L82.0052 164C76.622 164.019 71.2886 162.969 66.3145 160.91C61.3405 158.852 56.8247 155.826 53.0294 152.009L53.0289 152.008L48.7187 147.699L67.4974 128.921L71.8077 133.231Z"></path> -->
|
||||
<!-- <path d="M110.95 11.9912L115.26 16.3011L96.481 35.0785L92.1707 30.7685C89.4731 28.072 85.8148 26.5572 82.0004 26.5572C78.186 26.5572 74.5277 28.072 71.8301 30.7685L30.7597 71.8359C29.4247 73.1706 28.3658 74.7552 27.6433 76.4991C26.9208 78.2431 26.549 80.1122 26.549 81.9999C26.549 83.8876 26.9208 85.7567 27.6433 87.5007C28.3658 89.2446 29.4247 90.8292 30.7597 92.1639L51.1256 112.528L32.3138 131.306L11.9923 110.941C8.19043 107.141 5.17433 102.629 3.1167 97.6635C1.05907 92.6976 0 87.3751 0 81.9999C0 76.6247 1.05907 71.3022 3.1167 66.3363C5.17433 61.3705 8.19021 56.8587 11.9921 53.0586L53.0625 11.9912C56.8629 8.18964 61.3751 5.17395 66.3413 3.11647C71.3075 1.05899 76.6304 0 82.006 0C87.3816 0 92.7045 1.05899 97.6707 3.11647C102.637 5.17395 107.149 8.18964 110.95 11.9912Z"></path> -->
|
||||
<!-- <path d="M55.603 76.6744L76.6993 55.5798C79.6327 52.6465 84.3888 52.6465 87.3223 55.5797L108.419 76.6744C111.352 79.6077 111.352 84.3634 108.419 87.2966L87.3223 108.391C84.3888 111.325 79.6327 111.325 76.6993 108.391L55.603 87.2966C52.6696 84.3634 52.6696 79.6077 55.603 76.6744Z"></path> -->
|
||||
<!-- </svg> -->
|
||||
</li>
|
||||
<li class="m-2 p-4 relative rounded-lg border border-transparent [background:linear-gradient(theme(colors.zinc.50),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box]">
|
||||
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="40" height="40" aria-label="Meta"><path d="M6.915 4.03c-1.968 0-3.683 1.28-4.871 3.113C.704 9.208 0 11.883 0 14.449c0 .706.07 1.369.21 1.973a6.624 6.624 0 0 0 .265.86 5.297 5.297 0 0 0 .371.761c.696 1.159 1.818 1.927 3.593 1.927 1.497 0 2.633-.671 3.965-2.444.76-1.012 1.144-1.626 2.663-4.32l.756-1.339.186-.325c.061.1.121.196.183.3l2.152 3.595c.724 1.21 1.665 2.556 2.47 3.314 1.046.987 1.992 1.22 3.06 1.22 1.075 0 1.876-.355 2.455-.843a3.743 3.743 0 0 0 .81-.973c.542-.939.861-2.127.861-3.745 0-2.72-.681-5.357-2.084-7.45-1.282-1.912-2.957-2.93-4.716-2.93-1.047 0-2.088.467-3.053 1.308-.652.57-1.257 1.29-1.82 2.05-.69-.875-1.335-1.547-1.958-2.056-1.182-.966-2.315-1.303-3.454-1.303zm10.16 2.053c1.147 0 2.188.758 2.992 1.999 1.132 1.748 1.647 4.195 1.647 6.4 0 1.548-.368 2.9-1.839 2.9-.58 0-1.027-.23-1.664-1.004-.496-.601-1.343-1.878-2.832-4.358l-.617-1.028a44.908 44.908 0 0 0-1.255-1.98c.07-.109.141-.224.211-.327 1.12-1.667 2.118-2.602 3.358-2.602zm-10.201.553c1.265 0 2.058.791 2.675 1.446.307.327.737.871 1.234 1.579l-1.02 1.566c-.757 1.163-1.882 3.017-2.837 4.338-1.191 1.649-1.81 1.817-2.486 1.817-.524 0-1.038-.237-1.383-.794-.263-.426-.464-1.13-.464-2.046 0-2.221.63-4.535 1.66-6.088.454-.687.964-1.226 1.533-1.533a2.264 2.264 0 0 1 1.088-.285z"></path></svg>
|
||||
</li>
|
||||
<li class="m-2 p-4 relative rounded-lg border border-transparent [background:linear-gradient(theme(colors.zinc.50),theme(colors.zinc.50))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box]">
|
||||
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="40" height="40" aria-label="Apple"><path d="M12.152 6.896c-.948 0-2.415-1.078-3.96-1.04-2.04.027-3.91 1.183-4.961 3.014-2.117 3.675-.546 9.103 1.519 12.09 1.013 1.454 2.208 3.09 3.792 3.039 1.52-.065 2.09-.987 3.935-.987 1.831 0 2.35.987 3.96.948 1.637-.026 2.676-1.48 3.676-2.948 1.156-1.688 1.636-3.325 1.662-3.415-.039-.013-3.182-1.221-3.22-4.857-.026-3.04 2.48-4.494 2.597-4.559-1.429-2.09-3.623-2.324-4.39-2.376-2-.156-3.675 1.09-4.61 1.09zM15.53 3.83c.843-1.012 1.4-2.427 1.245-3.83-1.207.052-2.662.805-3.532 1.818-.78.896-1.454 2.338-1.273 3.714 1.338.104 2.715-.688 3.559-1.701"></path></svg>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,79 @@
|
||||
|
||||
package landing
|
||||
|
||||
templ Footer() {
|
||||
<!-- Site footer -->
|
||||
<footer>
|
||||
<div class="max-w-5xl mx-auto px-4 sm:px-6">
|
||||
<!-- Top area: Blocks -->
|
||||
<div class="grid sm:grid-cols-12 gap-8 py-8 md:py-12 border-t border-zinc-200">
|
||||
<!-- 1st block -->
|
||||
<div class="sm:col-span-6 md:col-span-3 lg:col-span-6 max-sm:order-1 flex flex-col">
|
||||
<div class="mb-4">
|
||||
<!-- Logo -->
|
||||
<a class="flex items-center justify-center bg-white w-8 h-8 rounded shadow-sm shadow-zinc-950/20" href="/">
|
||||
<img src="https://cdn.sonr.id/logo-zinc.svg" width="24" height="24" alt="Logo"/>
|
||||
</a>
|
||||
</div>
|
||||
<div class="grow text-sm text-zinc-500">© diDAO DUNA. All rights reserved.</div>
|
||||
<!-- Social links -->
|
||||
<ul class="flex space-x-4 mt-4 mb-1">
|
||||
<li>
|
||||
<a class="flex justify-center items-center text-zinc-700 hover:text-zinc-900 transition" href="#0" aria-label="Twitter">
|
||||
<svg class="fill-current" xmlns="http://www.w3.org/2000/svg" width="20" height="20">
|
||||
<path d="m7.063 3 3.495 4.475L14.601 3h2.454l-5.359 5.931L18 17h-4.938l-3.866-4.893L4.771 17H2.316l5.735-6.342L2 3h5.063Zm-.74 1.347H4.866l8.875 11.232h1.36L6.323 4.347Z"></path>
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="flex justify-center items-center text-zinc-700 hover:text-zinc-900 transition" href="#0" aria-label="Medium">
|
||||
<svg class="fill-current" xmlns="http://www.w3.org/2000/svg" width="20" height="20">
|
||||
<path d="M17 2H3a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1Zm-1.708 3.791-.858.823a.251.251 0 0 0-.1.241V12.9a.251.251 0 0 0 .1.241l.838.823v.181h-4.215v-.181l.868-.843c.085-.085.085-.11.085-.241V7.993L9.6 14.124h-.329l-2.81-6.13V12.1a.567.567 0 0 0 .156.472l1.129 1.37v.181h-3.2v-.181l1.129-1.37a.547.547 0 0 0 .146-.472V7.351A.416.416 0 0 0 5.683 7l-1-1.209V5.61H7.8l2.4 5.283 2.122-5.283h2.971l-.001.181Z"></path>
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="flex justify-center items-center text-zinc-700 hover:text-zinc-900 transition" href="#0" aria-label="Telegram">
|
||||
<svg class="fill-current" xmlns="http://www.w3.org/2000/svg" width="20" height="20">
|
||||
<path d="M17.968 3.276a.338.338 0 0 0-.232-.253 1.192 1.192 0 0 0-.63.045S3.087 8.106 2.286 8.664c-.172.121-.23.19-.259.272-.138.4.293.573.293.573l3.613 1.177a.388.388 0 0 0 .183-.011c.822-.519 8.27-5.222 8.7-5.38.068-.02.118 0 .1.049-.172.6-6.606 6.319-6.64 6.354a.138.138 0 0 0-.05.118l-.337 3.528s-.142 1.1.956 0a30.66 30.66 0 0 1 1.9-1.738c1.242.858 2.58 1.806 3.156 2.3a1 1 0 0 0 .732.283.825.825 0 0 0 .7-.622S17.894 5.292 17.98 3.909c.008-.135.021-.217.021-.317a1.177 1.177 0 0 0-.032-.316Z"></path>
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- 2nd block -->
|
||||
<div class="sm:col-span-6 md:col-span-3 lg:col-span-2"></div>
|
||||
<!-- 3rd block -->
|
||||
<div class="sm:col-span-6 md:col-span-3 lg:col-span-2">
|
||||
<h6 class="text-sm text-zinc-800 font-medium mb-2">Resources</h6>
|
||||
<ul class="text-sm space-y-2">
|
||||
<li>
|
||||
<a class="text-zinc-500 hover:text-zinc-900 transition" href="#0">Community</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-zinc-500 hover:text-zinc-900 transition" href="#0">Documentation</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-zinc-500 hover:text-zinc-900 transition" href="#0">Privacy policy</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- 4th block -->
|
||||
<div class="sm:col-span-6 md:col-span-3 lg:col-span-2">
|
||||
<h6 class="text-sm text-zinc-800 font-medium mb-2">Legals</h6>
|
||||
<ul class="text-sm space-y-2">
|
||||
<li>
|
||||
<a class="text-zinc-500 hover:text-zinc-900 transition" href="#0">About the DAO</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-zinc-500 hover:text-zinc-900 transition" href="#0">Privacy policy</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-zinc-500 hover:text-zinc-900 transition" href="https://brandfetch.io/sonr.io">Brand Kit</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
}
|
||||
@@ -0,0 +1,41 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.2.793
|
||||
|
||||
package landing
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
||||
import "github.com/a-h/templ"
|
||||
import templruntime "github.com/a-h/templ/runtime"
|
||||
|
||||
func Footer() 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_Var1 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var1 == nil {
|
||||
templ_7745c5c3_Var1 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!-- Site footer --><footer><div class=\"max-w-5xl mx-auto px-4 sm:px-6\"><!-- Top area: Blocks --><div class=\"grid sm:grid-cols-12 gap-8 py-8 md:py-12 border-t border-zinc-200\"><!-- 1st block --><div class=\"sm:col-span-6 md:col-span-3 lg:col-span-6 max-sm:order-1 flex flex-col\"><div class=\"mb-4\"><!-- Logo --><a class=\"flex items-center justify-center bg-white w-8 h-8 rounded shadow-sm shadow-zinc-950/20\" href=\"/\"><img src=\"https://cdn.sonr.id/logo-zinc.svg\" width=\"24\" height=\"24\" alt=\"Logo\"></a></div><div class=\"grow text-sm text-zinc-500\">© diDAO DUNA. All rights reserved.</div><!-- Social links --><ul class=\"flex space-x-4 mt-4 mb-1\"><li><a class=\"flex justify-center items-center text-zinc-700 hover:text-zinc-900 transition\" href=\"#0\" aria-label=\"Twitter\"><svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"><path d=\"m7.063 3 3.495 4.475L14.601 3h2.454l-5.359 5.931L18 17h-4.938l-3.866-4.893L4.771 17H2.316l5.735-6.342L2 3h5.063Zm-.74 1.347H4.866l8.875 11.232h1.36L6.323 4.347Z\"></path></svg></a></li><li><a class=\"flex justify-center items-center text-zinc-700 hover:text-zinc-900 transition\" href=\"#0\" aria-label=\"Medium\"><svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"><path d=\"M17 2H3a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1Zm-1.708 3.791-.858.823a.251.251 0 0 0-.1.241V12.9a.251.251 0 0 0 .1.241l.838.823v.181h-4.215v-.181l.868-.843c.085-.085.085-.11.085-.241V7.993L9.6 14.124h-.329l-2.81-6.13V12.1a.567.567 0 0 0 .156.472l1.129 1.37v.181h-3.2v-.181l1.129-1.37a.547.547 0 0 0 .146-.472V7.351A.416.416 0 0 0 5.683 7l-1-1.209V5.61H7.8l2.4 5.283 2.122-5.283h2.971l-.001.181Z\"></path></svg></a></li><li><a class=\"flex justify-center items-center text-zinc-700 hover:text-zinc-900 transition\" href=\"#0\" aria-label=\"Telegram\"><svg class=\"fill-current\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"><path d=\"M17.968 3.276a.338.338 0 0 0-.232-.253 1.192 1.192 0 0 0-.63.045S3.087 8.106 2.286 8.664c-.172.121-.23.19-.259.272-.138.4.293.573.293.573l3.613 1.177a.388.388 0 0 0 .183-.011c.822-.519 8.27-5.222 8.7-5.38.068-.02.118 0 .1.049-.172.6-6.606 6.319-6.64 6.354a.138.138 0 0 0-.05.118l-.337 3.528s-.142 1.1.956 0a30.66 30.66 0 0 1 1.9-1.738c1.242.858 2.58 1.806 3.156 2.3a1 1 0 0 0 .732.283.825.825 0 0 0 .7-.622S17.894 5.292 17.98 3.909c.008-.135.021-.217.021-.317a1.177 1.177 0 0 0-.032-.316Z\"></path></svg></a></li></ul></div><!-- 2nd block --><div class=\"sm:col-span-6 md:col-span-3 lg:col-span-2\"></div><!-- 3rd block --><div class=\"sm:col-span-6 md:col-span-3 lg:col-span-2\"><h6 class=\"text-sm text-zinc-800 font-medium mb-2\">Resources</h6><ul class=\"text-sm space-y-2\"><li><a class=\"text-zinc-500 hover:text-zinc-900 transition\" href=\"#0\">Community</a></li><li><a class=\"text-zinc-500 hover:text-zinc-900 transition\" href=\"#0\">Documentation</a></li><li><a class=\"text-zinc-500 hover:text-zinc-900 transition\" href=\"#0\">Privacy policy</a></li></ul></div><!-- 4th block --><div class=\"sm:col-span-6 md:col-span-3 lg:col-span-2\"><h6 class=\"text-sm text-zinc-800 font-medium mb-2\">Legals</h6><ul class=\"text-sm space-y-2\"><li><a class=\"text-zinc-500 hover:text-zinc-900 transition\" href=\"#0\">About the DAO</a></li><li><a class=\"text-zinc-500 hover:text-zinc-900 transition\" href=\"#0\">Privacy policy</a></li><li><a class=\"text-zinc-500 hover:text-zinc-900 transition\" href=\"https://brandfetch.io/sonr.io\">Brand Kit</a></li></ul></div></div></div></footer>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
var _ = templruntime.GeneratedTemplate
|
||||
@@ -0,0 +1,76 @@
|
||||
package landing
|
||||
|
||||
import models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
|
||||
var header = &models.NavHeader{
|
||||
Logo: &models.Image{
|
||||
Src: "https://cdn.sonr.id/logo-ivory.svg",
|
||||
Width: "20",
|
||||
Height: "20",
|
||||
},
|
||||
Primary: &models.NavItem{
|
||||
Text: "Get Access",
|
||||
Href: "/register",
|
||||
},
|
||||
Items: []*models.NavItem{
|
||||
{
|
||||
Text: "Docs",
|
||||
Href: "#",
|
||||
},
|
||||
{
|
||||
Text: "Blog",
|
||||
Href: "#",
|
||||
},
|
||||
{
|
||||
Text: "Changelog",
|
||||
Href: "#",
|
||||
},
|
||||
{
|
||||
Text: "About",
|
||||
Href: "#",
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
templ Header() {
|
||||
<!-- Site header -->
|
||||
<header class="absolute top-2 md:top-6 w-full z-30">
|
||||
<div class="px-4 sm:px-6">
|
||||
<div class="max-w-3xl mx-auto">
|
||||
<div class="flex items-center justify-between h-14 border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.white))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg px-3">
|
||||
<!-- Site branding -->
|
||||
<div class="shrink-0 mr-4">
|
||||
<!-- Logo -->
|
||||
<a class="flex items-center justify-center bg-zinc-800 border-zinc-600 border-1 w-8 h-8 rounded shadow-sm shadow-zinc-950/20" href="/">
|
||||
<img src={ header.Logo.Src } width={ header.Logo.Width } height={ header.Logo.Height } alt="Logo"/>
|
||||
</a>
|
||||
</div>
|
||||
<!-- Desktop navigation -->
|
||||
<nav class="flex grow">
|
||||
<!-- Desktop sign in links -->
|
||||
<ul class="flex grow justify-end flex-wrap items-center">
|
||||
<ul class="flex grow justify-center items-center">
|
||||
for _, item := range header.Items {
|
||||
<li class="ml-1 px-2">
|
||||
@navButton(item, false)
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
<li>
|
||||
@navButton(header.Primary, true)
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
}
|
||||
|
||||
templ navButton(item *models.NavItem, isPrimary bool) {
|
||||
if isPrimary {
|
||||
<div class="btn-sm text-zinc-100 cursor-pointer bg-zinc-900 hover:bg-zinc-800 w-full shadow" hx-swap="afterend" hx-get={ item.Href }>{ item.Text }</div>
|
||||
} else {
|
||||
<a class="text-sm cursor-pointer font-medium text-zinc-500 hover:text-zinc-900 px-3 lg:px-5 py-2 flex items-center transition" hx-swap="afterend" href={ templ.URL(item.Href) }>{ item.Text }</a>
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,221 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.2.793
|
||||
package landing
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
||||
import "github.com/a-h/templ"
|
||||
import templruntime "github.com/a-h/templ/runtime"
|
||||
|
||||
import models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
|
||||
var header = &models.NavHeader{
|
||||
Logo: &models.Image{
|
||||
Src: "https://cdn.sonr.id/logo-ivory.svg",
|
||||
Width: "20",
|
||||
Height: "20",
|
||||
},
|
||||
Primary: &models.NavItem{
|
||||
Text: "Get Access",
|
||||
Href: "/register",
|
||||
},
|
||||
Items: []*models.NavItem{
|
||||
{
|
||||
Text: "Docs",
|
||||
Href: "#",
|
||||
},
|
||||
{
|
||||
Text: "Blog",
|
||||
Href: "#",
|
||||
},
|
||||
{
|
||||
Text: "Changelog",
|
||||
Href: "#",
|
||||
},
|
||||
{
|
||||
Text: "About",
|
||||
Href: "#",
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
func Header() 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_Var1 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var1 == nil {
|
||||
templ_7745c5c3_Var1 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!-- Site header --><header class=\"absolute top-2 md:top-6 w-full z-30\"><div class=\"px-4 sm:px-6\"><div class=\"max-w-3xl mx-auto\"><div class=\"flex items-center justify-between h-14 border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.white))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg px-3\"><!-- Site branding --><div class=\"shrink-0 mr-4\"><!-- Logo --><a class=\"flex items-center justify-center bg-zinc-800 border-zinc-600 border-1 w-8 h-8 rounded shadow-sm shadow-zinc-950/20\" href=\"/\"><img src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var2 string
|
||||
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(header.Logo.Src)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/header.templ`, Line: 45, Col: 33}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" width=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var3 string
|
||||
templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(header.Logo.Width)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/header.templ`, Line: 45, Col: 61}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" height=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var4 string
|
||||
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(header.Logo.Height)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/header.templ`, Line: 45, Col: 91}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" alt=\"Logo\"></a></div><!-- Desktop navigation --><nav class=\"flex grow\"><!-- Desktop sign in links --><ul class=\"flex grow justify-end flex-wrap items-center\"><ul class=\"flex grow justify-center items-center\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
for _, item := range header.Items {
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<li class=\"ml-1 px-2\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = navButton(item, false).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</li>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</ul><li>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = navButton(header.Primary, true).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</li></ul></nav></div></div></div></header>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
func navButton(item *models.NavItem, isPrimary bool) 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_Var5 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var5 == nil {
|
||||
templ_7745c5c3_Var5 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
if isPrimary {
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"btn-sm text-zinc-100 cursor-pointer bg-zinc-900 hover:bg-zinc-800 w-full shadow\" hx-swap=\"afterend\" hx-get=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var6 string
|
||||
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(item.Href)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/header.templ`, Line: 72, Col: 132}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
|
||||
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
|
||||
}
|
||||
var templ_7745c5c3_Var7 string
|
||||
templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(item.Text)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/header.templ`, Line: 72, Col: 146}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
} else {
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<a class=\"text-sm cursor-pointer font-medium text-zinc-500 hover:text-zinc-900 px-3 lg:px-5 py-2 flex items-center transition\" hx-swap=\"afterend\" href=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var8 templ.SafeURL = templ.URL(item.Href)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(string(templ_7745c5c3_Var8)))
|
||||
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
|
||||
}
|
||||
var templ_7745c5c3_Var9 string
|
||||
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(item.Text)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/header.templ`, Line: 74, Col: 189}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</a>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
var _ = templruntime.GeneratedTemplate
|
||||
@@ -0,0 +1,158 @@
|
||||
package landing
|
||||
|
||||
import (
|
||||
"fmt"
|
||||
"github.com/onsonr/sonr/pkg/webapp/components/ui"
|
||||
models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
)
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Data Model │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// hero is the (1st) home page hero section
|
||||
var hero = &models.Hero{
|
||||
TitleFirst: "Simplified",
|
||||
TitleEmphasis: "self-custody",
|
||||
TitleSecond: "for everyone",
|
||||
Subtitle: "Sonr is a modern re-imagination of online user identity, empowering users to take ownership of their digital footprint and unlocking a new era of self-sovereignty.",
|
||||
PrimaryButton: &models.Button{Text: "Get Started", Href: "/register"},
|
||||
SecondaryButton: &models.Button{Text: "Learn More", Href: "/about"},
|
||||
Image: &models.Image{
|
||||
Src: "https://cdn.sonr.id/img/hero-clipped.svg",
|
||||
Width: "500",
|
||||
Height: "500",
|
||||
},
|
||||
Stats: []*models.Stat{
|
||||
{Value: "476", Label: "Tradeable Crypto Assets", Denom: "+"},
|
||||
{Value: "1.44", Label: "Verified Identities", Denom: "K"},
|
||||
{Value: "1.5", Label: "Encrypted Messages Sent", Denom: "M+"},
|
||||
{Value: "50", Label: "Decentralized Global Nodes", Denom: "+"},
|
||||
},
|
||||
}
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Render Section View │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// Hero Section
|
||||
templ Hero() {
|
||||
<!-- Hero -->
|
||||
<section class="relative before:absolute before:inset-0 before:h-80 before:pointer-events-none before:bg-gradient-to-b before:from-zinc-100 before:-z-10">
|
||||
<div class="pt-32 pb-12 md:pt-40 md:pb-20">
|
||||
<!-- Section content -->
|
||||
<div class="px-4 sm:px-6">
|
||||
<div class="max-w-3xl mx-auto">
|
||||
<div class="text-center pb-12 md:pb-16">
|
||||
@heroTitle(hero.TitleFirst, hero.TitleEmphasis, hero.TitleSecond)
|
||||
<p class="text-lg text-zinc-500 mb-8">
|
||||
{ hero.Subtitle }
|
||||
</p>
|
||||
<div class="max-w-xs mx-auto sm:max-w-none sm:inline-flex sm:justify-center space-y-4 sm:space-y-0 sm:space-x-4">
|
||||
@ui.PrimaryButton("/register", "Get Started")
|
||||
@ui.SecondaryButton("/about", "Learn More")
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@heroImage(hero)
|
||||
@stats(hero.Stats)
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
|
||||
templ heroTitle(first string, emphasis string, second string) {
|
||||
<h1 class="font-inter-tight text-4xl md:text-5xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-zinc-500 via-zinc-900 to-zinc-900 pb-4">
|
||||
{ first }
|
||||
<em class="italic relative inline-flex justify-center items-center text-zinc-900">
|
||||
{ emphasis }
|
||||
<svg class="absolute fill-zinc-300 w-[calc(100%+1rem)] -z-10" xmlns="http://www.w3.org/2000/svg" width="223" height="62" viewBox="0 0 223 62" aria-hidden="true" preserveAspectRatio="none">
|
||||
<path d="M45.654 53.62c17.666 3.154 35.622 4.512 53.558 4.837 17.94.288 35.91-.468 53.702-2.54 8.89-1.062 17.742-2.442 26.455-4.352 8.684-1.945 17.338-4.3 25.303-7.905 3.94-1.81 7.79-3.962 10.634-6.777 1.38-1.41 2.424-2.994 2.758-4.561.358-1.563-.078-3.143-1.046-4.677-.986-1.524-2.43-2.96-4.114-4.175a37.926 37.926 0 0 0-5.422-3.32c-3.84-1.977-7.958-3.563-12.156-4.933-8.42-2.707-17.148-4.653-25.95-6.145-8.802-1.52-17.702-2.56-26.622-3.333-17.852-1.49-35.826-1.776-53.739-.978-8.953.433-17.898 1.125-26.79 2.22-8.887 1.095-17.738 2.541-26.428 4.616-4.342 1.037-8.648 2.226-12.853 3.676-4.197 1.455-8.314 3.16-12.104 5.363-1.862 1.13-3.706 2.333-5.218 3.829-1.52 1.47-2.79 3.193-3.285 5.113-.528 1.912-.127 3.965.951 5.743 1.07 1.785 2.632 3.335 4.348 4.68 2.135 1.652 3.2 2.672 2.986 3.083-.18.362-1.674.114-4.08-1.638-1.863-1.387-3.63-3.014-4.95-5.09C.94 35.316.424 34.148.171 32.89c-.275-1.253-.198-2.579.069-3.822.588-2.515 2.098-4.582 3.76-6.276 1.673-1.724 3.612-3.053 5.57-4.303 3.96-2.426 8.177-4.278 12.457-5.868 4.287-1.584 8.654-2.89 13.054-4.036 8.801-2.292 17.74-3.925 26.716-5.19C70.777 2.131 79.805 1.286 88.846.723c18.087-1.065 36.236-.974 54.325.397 9.041.717 18.07 1.714 27.042 3.225 8.972 1.485 17.895 3.444 26.649 6.253 4.37 1.426 8.697 3.083 12.878 5.243a42.11 42.11 0 0 1 6.094 3.762c1.954 1.44 3.823 3.2 5.283 5.485a12.515 12.515 0 0 1 1.63 3.88c.164.706.184 1.463.253 2.193-.063.73-.094 1.485-.247 2.195-.652 2.886-2.325 5.141-4.09 6.934-3.635 3.533-7.853 5.751-12.083 7.688-8.519 3.778-17.394 6.09-26.296 7.998-8.917 1.86-17.913 3.152-26.928 4.104-18.039 1.851-36.17 2.295-54.239 1.622-18.062-.713-36.112-2.535-53.824-6.23-5.941-1.31-5.217-2.91.361-1.852"></path>
|
||||
</svg>
|
||||
</em>
|
||||
{ second }
|
||||
</h1>
|
||||
}
|
||||
|
||||
templ heroImage(hero *models.Hero) {
|
||||
<!-- Image -->
|
||||
<div class="max-w-5xl motion-preset-slide-up motion-opacity-in-0 motion-scale-in-50 mx-auto px-4 sm:px-6 flex justify-center pb-12 md:pb-20 relative before:absolute before:-top-12 before:w-96 before:h-96 before:bg-zinc-900 before:opacity-[.15] before:rounded-full before:blur-3xl before:-z-10 from-zinc-100 to-white">
|
||||
<img
|
||||
class="rounded-lg "
|
||||
src={ hero.Image.Src }
|
||||
width={ hero.Image.Width }
|
||||
height={ hero.Image.Height }
|
||||
alt="Hero"
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ stats(stats []*models.Stat) {
|
||||
<!-- Stats -->
|
||||
<div class="max-w-4xl mx-auto px-4 sm:px-6 justify-center items-center">
|
||||
<div class="max-w-sm mx-auto grid gap-12 sm:grid-cols-2 md:grid-cols-4 md:-mx-5 md:gap-0 items-end md:max-w-none">
|
||||
for _, item := range stats {
|
||||
<div class="relative text-center md:px-5 after:hidden md:after:block after:absolute after:right-0 after:top-1/2 after:-translate-y-1/2 after:w-px after:h-8 after:border-l after:border-zinc-300 after:border-dashed last:after:hidden">
|
||||
<h4 class="font-inter-tight text-2xl md:text-3xl font-bold tabular-nums mb-2"><span x-data={ counterXData(item.Value) } x-text="counterValue">{ item.Value }</span>{ item.Denom }</h4>
|
||||
<p class="text-sm text-zinc-500">{ item.Label }</p>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
@counterAnimation()
|
||||
</div>
|
||||
}
|
||||
|
||||
func counterXData(value string) string {
|
||||
return fmt.Sprintf("counter(%s)", value)
|
||||
}
|
||||
|
||||
script counterAnimation() {
|
||||
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()
|
||||
},
|
||||
}))
|
||||
})
|
||||
}
|
||||
@@ -0,0 +1,417 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.2.793
|
||||
package landing
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
||||
import "github.com/a-h/templ"
|
||||
import templruntime "github.com/a-h/templ/runtime"
|
||||
|
||||
import (
|
||||
"fmt"
|
||||
"github.com/onsonr/sonr/pkg/webapp/components/ui"
|
||||
models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
)
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Data Model │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// hero is the (1st) home page hero section
|
||||
var hero = &models.Hero{
|
||||
TitleFirst: "Simplified",
|
||||
TitleEmphasis: "self-custody",
|
||||
TitleSecond: "for everyone",
|
||||
Subtitle: "Sonr is a modern re-imagination of online user identity, empowering users to take ownership of their digital footprint and unlocking a new era of self-sovereignty.",
|
||||
PrimaryButton: &models.Button{Text: "Get Started", Href: "/register"},
|
||||
SecondaryButton: &models.Button{Text: "Learn More", Href: "/about"},
|
||||
Image: &models.Image{
|
||||
Src: "https://cdn.sonr.id/img/hero-clipped.svg",
|
||||
Width: "500",
|
||||
Height: "500",
|
||||
},
|
||||
Stats: []*models.Stat{
|
||||
{Value: "476", Label: "Tradeable Crypto Assets", Denom: "+"},
|
||||
{Value: "1.44", Label: "Verified Identities", Denom: "K"},
|
||||
{Value: "1.5", Label: "Encrypted Messages Sent", Denom: "M+"},
|
||||
{Value: "50", Label: "Decentralized Global Nodes", Denom: "+"},
|
||||
},
|
||||
}
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Render Section View │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// Hero Section
|
||||
func Hero() 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_Var1 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var1 == nil {
|
||||
templ_7745c5c3_Var1 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!-- Hero --><section class=\"relative before:absolute before:inset-0 before:h-80 before:pointer-events-none before:bg-gradient-to-b before:from-zinc-100 before:-z-10\"><div class=\"pt-32 pb-12 md:pt-40 md:pb-20\"><!-- Section content --><div class=\"px-4 sm:px-6\"><div class=\"max-w-3xl mx-auto\"><div class=\"text-center pb-12 md:pb-16\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = heroTitle(hero.TitleFirst, hero.TitleEmphasis, hero.TitleSecond).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<p class=\"text-lg text-zinc-500 mb-8\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var2 string
|
||||
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(hero.Subtitle)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 49, Col: 22}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p><div class=\"max-w-xs mx-auto sm:max-w-none sm:inline-flex sm:justify-center space-y-4 sm:space-y-0 sm:space-x-4\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = ui.PrimaryButton("/register", "Get Started").Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = ui.SecondaryButton("/about", "Learn More").Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></div>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = heroImage(hero).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = stats(hero.Stats).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></section>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
func heroTitle(first string, emphasis string, second string) 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_Var3 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var3 == nil {
|
||||
templ_7745c5c3_Var3 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<h1 class=\"font-inter-tight text-4xl md:text-5xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-zinc-500 via-zinc-900 to-zinc-900 pb-4\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var4 string
|
||||
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(first)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 66, Col: 9}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" <em class=\"italic relative inline-flex justify-center items-center text-zinc-900\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var5 string
|
||||
templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(emphasis)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 68, Col: 13}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" <svg class=\"absolute fill-zinc-300 w-[calc(100%+1rem)] -z-10\" xmlns=\"http://www.w3.org/2000/svg\" width=\"223\" height=\"62\" viewBox=\"0 0 223 62\" aria-hidden=\"true\" preserveAspectRatio=\"none\"><path d=\"M45.654 53.62c17.666 3.154 35.622 4.512 53.558 4.837 17.94.288 35.91-.468 53.702-2.54 8.89-1.062 17.742-2.442 26.455-4.352 8.684-1.945 17.338-4.3 25.303-7.905 3.94-1.81 7.79-3.962 10.634-6.777 1.38-1.41 2.424-2.994 2.758-4.561.358-1.563-.078-3.143-1.046-4.677-.986-1.524-2.43-2.96-4.114-4.175a37.926 37.926 0 0 0-5.422-3.32c-3.84-1.977-7.958-3.563-12.156-4.933-8.42-2.707-17.148-4.653-25.95-6.145-8.802-1.52-17.702-2.56-26.622-3.333-17.852-1.49-35.826-1.776-53.739-.978-8.953.433-17.898 1.125-26.79 2.22-8.887 1.095-17.738 2.541-26.428 4.616-4.342 1.037-8.648 2.226-12.853 3.676-4.197 1.455-8.314 3.16-12.104 5.363-1.862 1.13-3.706 2.333-5.218 3.829-1.52 1.47-2.79 3.193-3.285 5.113-.528 1.912-.127 3.965.951 5.743 1.07 1.785 2.632 3.335 4.348 4.68 2.135 1.652 3.2 2.672 2.986 3.083-.18.362-1.674.114-4.08-1.638-1.863-1.387-3.63-3.014-4.95-5.09C.94 35.316.424 34.148.171 32.89c-.275-1.253-.198-2.579.069-3.822.588-2.515 2.098-4.582 3.76-6.276 1.673-1.724 3.612-3.053 5.57-4.303 3.96-2.426 8.177-4.278 12.457-5.868 4.287-1.584 8.654-2.89 13.054-4.036 8.801-2.292 17.74-3.925 26.716-5.19C70.777 2.131 79.805 1.286 88.846.723c18.087-1.065 36.236-.974 54.325.397 9.041.717 18.07 1.714 27.042 3.225 8.972 1.485 17.895 3.444 26.649 6.253 4.37 1.426 8.697 3.083 12.878 5.243a42.11 42.11 0 0 1 6.094 3.762c1.954 1.44 3.823 3.2 5.283 5.485a12.515 12.515 0 0 1 1.63 3.88c.164.706.184 1.463.253 2.193-.063.73-.094 1.485-.247 2.195-.652 2.886-2.325 5.141-4.09 6.934-3.635 3.533-7.853 5.751-12.083 7.688-8.519 3.778-17.394 6.09-26.296 7.998-8.917 1.86-17.913 3.152-26.928 4.104-18.039 1.851-36.17 2.295-54.239 1.622-18.062-.713-36.112-2.535-53.824-6.23-5.941-1.31-5.217-2.91.361-1.852\"></path></svg></em> ")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var6 string
|
||||
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(second)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 73, Col: 10}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h1>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
func heroImage(hero *models.Hero) 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_Var7 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var7 == nil {
|
||||
templ_7745c5c3_Var7 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!-- Image --><div class=\"max-w-5xl motion-preset-slide-up motion-opacity-in-0 motion-scale-in-50 mx-auto px-4 sm:px-6 flex justify-center pb-12 md:pb-20 relative before:absolute before:-top-12 before:w-96 before:h-96 before:bg-zinc-900 before:opacity-[.15] before:rounded-full before:blur-3xl before:-z-10 from-zinc-100 to-white\"><img class=\"rounded-lg \" src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var8 string
|
||||
templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(hero.Image.Src)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 82, Col: 23}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" width=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var9 string
|
||||
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(hero.Image.Width)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 83, Col: 27}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" height=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var10 string
|
||||
templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(hero.Image.Height)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 84, Col: 29}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" alt=\"Hero\"></div>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
func stats(stats []*models.Stat) 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("<!-- Stats --><div class=\"max-w-4xl mx-auto px-4 sm:px-6 justify-center items-center\"><div class=\"max-w-sm mx-auto grid gap-12 sm:grid-cols-2 md:grid-cols-4 md:-mx-5 md:gap-0 items-end md:max-w-none\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
for _, item := range stats {
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"relative text-center md:px-5 after:hidden md:after:block after:absolute after:right-0 after:top-1/2 after:-translate-y-1/2 after:w-px after:h-8 after:border-l after:border-zinc-300 after:border-dashed last:after:hidden\"><h4 class=\"font-inter-tight text-2xl md:text-3xl font-bold tabular-nums mb-2\"><span x-data=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var12 string
|
||||
templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(counterXData(item.Value))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 96, Col: 122}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" x-text=\"counterValue\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var13 string
|
||||
templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(item.Value)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 96, Col: 159}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</span>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var14 string
|
||||
templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(item.Denom)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 96, Col: 180}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h4><p class=\"text-sm text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var15 string
|
||||
templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(item.Label)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/hero.templ`, Line: 97, Col: 50}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p></div>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div>")
|
||||
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("</div>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
func counterXData(value string) string {
|
||||
return fmt.Sprintf("counter(%s)", value)
|
||||
}
|
||||
|
||||
func counterAnimation() templ.ComponentScript {
|
||||
return templ.ComponentScript{
|
||||
Name: `__templ_counterAnimation_cac3`,
|
||||
Function: `function __templ_counterAnimation_cac3(){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_cac3`),
|
||||
CallInline: templ.SafeScriptInline(`__templ_counterAnimation_cac3`),
|
||||
}
|
||||
}
|
||||
|
||||
var _ = templruntime.GeneratedTemplate
|
||||
@@ -0,0 +1,137 @@
|
||||
package landing
|
||||
|
||||
import (
|
||||
"fmt"
|
||||
models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
)
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Data Model │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// highlights is the (2nd) home page highlights section
|
||||
var highlights = &models.Highlights{
|
||||
Heading: "The Internet Rebuilt for You",
|
||||
Subtitle: "Sonr is a comprehensive system for Identity Management which proteects users across their digital personas while providing Developers a cost-effective solution for decentralized authentication.",
|
||||
Features: []*models.Feature{
|
||||
{
|
||||
Title: "∞ Factor Auth",
|
||||
Desc: "Sonr is designed to work across all platforms and devices, building a encrypted and anonymous identity layer for each user on the internet.",
|
||||
Icon: nil,
|
||||
},
|
||||
{
|
||||
Title: "Control Your Data",
|
||||
Desc: "Sonr leverages advanced cryptography to permit facilitating Wallet Operations directly on-chain, without the need for a centralized server.",
|
||||
Icon: nil,
|
||||
},
|
||||
{
|
||||
Title: "Crypto Enabled",
|
||||
Desc: "Sonr follows the latest specifications from W3C, DIF, and ICF to essentially have an Interchain-Connected, Smart Account System - seamlessly authenticated with PassKeys.",
|
||||
Icon: nil,
|
||||
},
|
||||
{
|
||||
Title: "Works Everywhere",
|
||||
Desc: "Sonr anonymously associates your online identities with a Quantum-Resistant Vault which only you can access.",
|
||||
Icon: nil,
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Render Section View │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
templ Highlights() {
|
||||
<!-- Features -->
|
||||
<section class="relative bg-zinc-50">
|
||||
<div class="py-12 md:py-20">
|
||||
<div class="max-w-5xl mx-auto px-4 sm:px-6">
|
||||
<div class="max-w-3xl mx-auto text-center pb-12">
|
||||
<h2
|
||||
class="font-inter-tight text-3xl md:text-4xl font-bold text-zinc-900 mb-4"
|
||||
>
|
||||
{ highlights.Heading }
|
||||
</h2>
|
||||
<p class="text-lg text-zinc-500">
|
||||
{ highlights.Subtitle }
|
||||
</p>
|
||||
</div>
|
||||
<div x-data="{ tab: '1' }">
|
||||
<!-- Tabs buttons -->
|
||||
<div class="grid grid-cols-2 md:grid-cols-4 gap-4 md:gap-6">
|
||||
@highlightTab(1, highlights.Features[0])
|
||||
@highlightTab(2, highlights.Features[1])
|
||||
@highlightTab(3, highlights.Features[2])
|
||||
@highlightTab(4, highlights.Features[3])
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
|
||||
templ highlightTab(index int, highlight *models.Feature) {
|
||||
<button
|
||||
:class={ getSelectedClass(index) }
|
||||
class="text-left px-4 py-5 border border-transparent rounded"
|
||||
@click.prevent={ getClickPrevent(index) }
|
||||
>
|
||||
<div class="flex items-center justify-between mb-1">
|
||||
<div class="font-inter-tight font-semibold text-zinc-900">
|
||||
{ highlight.Title }
|
||||
</div>
|
||||
<svg
|
||||
:class={ getShowBorder(index) }
|
||||
class="fill-zinc-400 shrink-0 ml-2"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="10"
|
||||
height="10"
|
||||
>
|
||||
<path
|
||||
d="M8.667.186H2.675a.999.999 0 0 0 0 1.998h3.581L.971 7.469a.999.999 0 1 0 1.412 1.412l5.285-5.285v3.58a.999.999 0 1 0 1.998 0V1.186a.999.999 0 0 0-.999-.999Z"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="text-sm text-zinc-500">
|
||||
{ highlight.Desc }
|
||||
</div>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ highlightCard(index int, highlight *models.Feature) {
|
||||
<div
|
||||
class="w-full text-center"
|
||||
x-show={ getXShow(index) }
|
||||
x-transition:enter="transition ease-in-out duration-700 transform order-first"
|
||||
x-transition:enter-start="opacity-0 -translate-y-4"
|
||||
x-transition:enter-end="opacity-100 translate-y-0"
|
||||
x-transition:leave="transition ease-in-out duration-300 transform absolute"
|
||||
x-transition:leave-start="opacity-100 translate-y-0"
|
||||
x-transition:leave-end="opacity-0 translate-y-4"
|
||||
>
|
||||
<div class="inline-flex relative align-top">
|
||||
<img
|
||||
class="rounded-t-lg border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.white))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] box-content shadow-2xl"
|
||||
src={ highlight.Image.Src }
|
||||
width={ highlight.Image.Width }
|
||||
height={ highlight.Image.Height }
|
||||
alt={ highlight.Title }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
func getSelectedClass(index int) string {
|
||||
return fmt.Sprintf("tab === '%d' ? 'bg-zinc-100 opacity-60 hover:opacity-100 transition' : '[background:linear-gradient(theme(colors.white),theme(colors.white))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] shadow-sm rotate-1'", index+1)
|
||||
}
|
||||
|
||||
func getShowBorder(index int) string {
|
||||
return fmt.Sprintf("tab === '%d' ? 'hidden' : ''", index+1)
|
||||
}
|
||||
|
||||
func getClickPrevent(index int) string {
|
||||
return fmt.Sprintf("tab = '%d'", index+1)
|
||||
}
|
||||
|
||||
func getXShow(index int) string {
|
||||
return fmt.Sprintf("tab === '%d'", index+1)
|
||||
}
|
||||
@@ -0,0 +1,330 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.2.793
|
||||
package landing
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
||||
import "github.com/a-h/templ"
|
||||
import templruntime "github.com/a-h/templ/runtime"
|
||||
|
||||
import (
|
||||
"fmt"
|
||||
models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
)
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Data Model │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// highlights is the (2nd) home page highlights section
|
||||
var highlights = &models.Highlights{
|
||||
Heading: "The Internet Rebuilt for You",
|
||||
Subtitle: "Sonr is a comprehensive system for Identity Management which proteects users across their digital personas while providing Developers a cost-effective solution for decentralized authentication.",
|
||||
Features: []*models.Feature{
|
||||
{
|
||||
Title: "∞ Factor Auth",
|
||||
Desc: "Sonr is designed to work across all platforms and devices, building a encrypted and anonymous identity layer for each user on the internet.",
|
||||
Icon: nil,
|
||||
},
|
||||
{
|
||||
Title: "Control Your Data",
|
||||
Desc: "Sonr leverages advanced cryptography to permit facilitating Wallet Operations directly on-chain, without the need for a centralized server.",
|
||||
Icon: nil,
|
||||
},
|
||||
{
|
||||
Title: "Crypto Enabled",
|
||||
Desc: "Sonr follows the latest specifications from W3C, DIF, and ICF to essentially have an Interchain-Connected, Smart Account System - seamlessly authenticated with PassKeys.",
|
||||
Icon: nil,
|
||||
},
|
||||
{
|
||||
Title: "Works Everywhere",
|
||||
Desc: "Sonr anonymously associates your online identities with a Quantum-Resistant Vault which only you can access.",
|
||||
Icon: nil,
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Render Section View │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
func Highlights() 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_Var1 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var1 == nil {
|
||||
templ_7745c5c3_Var1 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!-- Features --><section class=\"relative bg-zinc-50\"><div class=\"py-12 md:py-20\"><div class=\"max-w-5xl mx-auto px-4 sm:px-6\"><div class=\"max-w-3xl mx-auto text-center pb-12\"><h2 class=\"font-inter-tight text-3xl md:text-4xl font-bold text-zinc-900 mb-4\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var2 string
|
||||
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(highlights.Heading)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 52, Col: 26}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h2><p class=\"text-lg text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var3 string
|
||||
templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(highlights.Subtitle)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 55, Col: 27}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p></div><div x-data=\"{ tab: '1' }\"><!-- Tabs buttons --><div class=\"grid grid-cols-2 md:grid-cols-4 gap-4 md:gap-6\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = highlightTab(1, highlights.Features[0]).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = highlightTab(2, highlights.Features[1]).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = highlightTab(3, highlights.Features[2]).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = highlightTab(4, highlights.Features[3]).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></div></div></section>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
func highlightTab(index int, highlight *models.Feature) 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_Var4 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var4 == nil {
|
||||
templ_7745c5c3_Var4 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<button :class=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var5 string
|
||||
templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(getSelectedClass(index))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 74, Col: 34}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"text-left px-4 py-5 border border-transparent rounded\" @click.prevent=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var6 string
|
||||
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(getClickPrevent(index))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 76, Col: 41}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\"><div class=\"flex items-center justify-between mb-1\"><div class=\"font-inter-tight font-semibold text-zinc-900\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var7 string
|
||||
templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(highlight.Title)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 80, Col: 21}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><svg :class=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var8 string
|
||||
templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(getShowBorder(index))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 83, Col: 33}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" class=\"fill-zinc-400 shrink-0 ml-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\"><path d=\"M8.667.186H2.675a.999.999 0 0 0 0 1.998h3.581L.971 7.469a.999.999 0 1 0 1.412 1.412l5.285-5.285v3.58a.999.999 0 1 0 1.998 0V1.186a.999.999 0 0 0-.999-.999Z\"></path></svg></div><div class=\"text-sm text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var9 string
|
||||
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(highlight.Desc)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 95, Col: 19}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></button>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
func highlightCard(index int, highlight *models.Feature) 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("<div class=\"w-full text-center\" x-show=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var11 string
|
||||
templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(getXShow(index))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 103, Col: 26}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" x-transition:enter=\"transition ease-in-out duration-700 transform order-first\" x-transition:enter-start=\"opacity-0 -translate-y-4\" x-transition:enter-end=\"opacity-100 translate-y-0\" x-transition:leave=\"transition ease-in-out duration-300 transform absolute\" x-transition:leave-start=\"opacity-100 translate-y-0\" x-transition:leave-end=\"opacity-0 translate-y-4\"><div class=\"inline-flex relative align-top\"><img class=\"rounded-t-lg border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.white))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] box-content shadow-2xl\" src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var12 string
|
||||
templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(highlight.Image.Src)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 114, Col: 29}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" width=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var13 string
|
||||
templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(highlight.Image.Width)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 115, Col: 33}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" height=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var14 string
|
||||
templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(highlight.Image.Height)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 116, Col: 35}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" alt=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var15 string
|
||||
templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(highlight.Title)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/highlights.templ`, Line: 117, Col: 25}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\"></div></div>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
func getSelectedClass(index int) string {
|
||||
return fmt.Sprintf("tab === '%d' ? 'bg-zinc-100 opacity-60 hover:opacity-100 transition' : '[background:linear-gradient(theme(colors.white),theme(colors.white))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] shadow-sm rotate-1'", index+1)
|
||||
}
|
||||
|
||||
func getShowBorder(index int) string {
|
||||
return fmt.Sprintf("tab === '%d' ? 'hidden' : ''", index+1)
|
||||
}
|
||||
|
||||
func getClickPrevent(index int) string {
|
||||
return fmt.Sprintf("tab = '%d'", index+1)
|
||||
}
|
||||
|
||||
func getXShow(index int) string {
|
||||
return fmt.Sprintf("tab === '%d'", index+1)
|
||||
}
|
||||
|
||||
var _ = templruntime.GeneratedTemplate
|
||||
@@ -0,0 +1,165 @@
|
||||
package landing
|
||||
|
||||
import models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Data Model │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
var lowlights = &models.Lowlights{
|
||||
Heading: "The Fragmentation Problem in the Existing Web is seeping into Crypto",
|
||||
UpperQuotes: []*models.Testimonial{
|
||||
{
|
||||
FullName: "0xDesigner",
|
||||
Username: "@0xDesigner",
|
||||
Avatar: &models.Image{
|
||||
Src: models.Avatar0xDesigner.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "what if the wallet ui appeared next to the click instead of in a new browser window?",
|
||||
},
|
||||
{
|
||||
FullName: "Alex Recouso",
|
||||
Username: "@alexrecouso",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarAlexRecouso.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "2024 resembles 1984, but it doesn't have to be that way for you",
|
||||
},
|
||||
{
|
||||
FullName: "Chjango Unchained",
|
||||
Username: "@chjango",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarChjango.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "IBC is the inter-blockchain highway of @cosmos. While not very cypherpunk, charging a 1.5 basis pt fee would go a long way if priced in $ATOM.",
|
||||
},
|
||||
{
|
||||
FullName: "Gwart",
|
||||
Username: "@GwartyGwart",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarGwart.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: " Base is incredible. Most centralized l2. Least details about their plans to decentralize. Keeps OP cabal quiet by pretending to care about quadratic voting and giving 10% tithe. Pays Ethereum mainnet virtually nothing. Runs yuppie granola ad campaigns.",
|
||||
},
|
||||
},
|
||||
LowerQuotes: []*models.Testimonial{
|
||||
{
|
||||
FullName: "winnie",
|
||||
Username: "@winnielaux_",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarWinnieLaux.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "the ability to download apps directly from the web or from “crypto-only” app stores will be a massive unlock for web3",
|
||||
},
|
||||
{
|
||||
FullName: "Jelena",
|
||||
Username: "@jelena_noble",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarJelenaNoble.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "Excited for all the @cosmos nerds to be vindicated in the next bull run",
|
||||
},
|
||||
{
|
||||
FullName: "accountless",
|
||||
Username: "@alexanderchopan",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarAccountless.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "sounds like webThree. Single key pair Requires the same signer At risk of infinite approvals Public history of all transactions different account on each chain different addresses for each account",
|
||||
},
|
||||
{
|
||||
FullName: "Unusual Whales",
|
||||
Username: "@unusual_whales",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarUnusualWhales.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "BREAKING: Fidelity & Fidelity Investments has confirmed that over 77,000 customers had personal information compromised, including Social Security numbers and driver’s licenses.",
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Render Section View │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// Lowlights is the (4th) home page lowlights section
|
||||
templ Lowlights() {
|
||||
<section class="bg-zinc-800">
|
||||
<div class="py-12 md:py-20">
|
||||
<div class="max-w-5xl mx-auto px-4 sm:px-6">
|
||||
<div class="max-w-3xl mx-auto text-center pb-12 md:pb-20">
|
||||
<h2 class="font-inter-tight text-3xl md:text-4xl font-bold text-zinc-200">
|
||||
{ lowlights.Heading }
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="max-w-[94rem] mx-auto space-y-6">
|
||||
<!-- Row #1 -->
|
||||
<div
|
||||
x-data="{}"
|
||||
x-init="$nextTick(() => {
|
||||
let ul = $refs.testimonials;
|
||||
ul.insertAdjacentHTML('afterend', ul.outerHTML);
|
||||
ul.nextSibling.setAttribute('aria-hidden', 'true');
|
||||
})"
|
||||
class="w-full inline-flex flex-nowrap overflow-hidden [mask-image:_linear-gradient(to_right,transparent_0,_black_28%,_black_calc(100%-28%),transparent_100%)] group"
|
||||
>
|
||||
<div x-ref="testimonials" class="flex items-start justify-center md:justify-start [&>div]:mx-3 animate-infinite-scroll group-hover:[animation-play-state:paused]">
|
||||
for _,quote := range lowlights.UpperQuotes {
|
||||
@quoteItem(quote)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<!-- Row #2 -->
|
||||
<div
|
||||
x-data="{}"
|
||||
x-init="$nextTick(() => {
|
||||
let ul = $refs.testimonials;
|
||||
ul.insertAdjacentHTML('afterend', ul.outerHTML);
|
||||
ul.nextSibling.setAttribute('aria-hidden', 'true');
|
||||
})"
|
||||
class="w-full inline-flex flex-nowrap overflow-hidden [mask-image:_linear-gradient(to_right,transparent_0,_black_28%,_black_calc(100%-28%),transparent_100%)] group"
|
||||
>
|
||||
<div x-ref="testimonials" class="flex items-start justify-center md:justify-start [&>div]:mx-3 animate-infinite-scroll-inverse group-hover:[animation-play-state:paused] [animation-delay:-7.5s]">
|
||||
for _,quote := range lowlights.LowerQuotes {
|
||||
@quoteItem(quote)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
|
||||
templ quoteItem(quote *models.Testimonial) {
|
||||
<div class="rounded h-full w-[22rem] border border-transparent [background:linear-gradient(#323237,#323237)_padding-box,linear-gradient(120deg,theme(colors.zinc.700),theme(colors.zinc.700/0),theme(colors.zinc.700))_border-box] p-5">
|
||||
<div class="flex items-center mb-4">
|
||||
<img class="shrink-0 rounded-full mr-3" src={ quote.Avatar.Src } width={ quote.Avatar.Width } height={ quote.Avatar.Height } alt="Testimonial 01"/>
|
||||
<div>
|
||||
<div class="font-inter-tight font-bold text-zinc-200">{ quote.FullName }</div>
|
||||
<div>
|
||||
<a class="text-sm font-medium text-zinc-500 hover:text-zinc-300 transition" href="#0">{ quote.Username }</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-zinc-500 before:content-['\0022'] after:content-['\0022']">
|
||||
{ quote.Quote }
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -0,0 +1,279 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.2.793
|
||||
package landing
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
||||
import "github.com/a-h/templ"
|
||||
import templruntime "github.com/a-h/templ/runtime"
|
||||
|
||||
import models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Data Model │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
var lowlights = &models.Lowlights{
|
||||
Heading: "The Fragmentation Problem in the Existing Web is seeping into Crypto",
|
||||
UpperQuotes: []*models.Testimonial{
|
||||
{
|
||||
FullName: "0xDesigner",
|
||||
Username: "@0xDesigner",
|
||||
Avatar: &models.Image{
|
||||
Src: models.Avatar0xDesigner.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "what if the wallet ui appeared next to the click instead of in a new browser window?",
|
||||
},
|
||||
{
|
||||
FullName: "Alex Recouso",
|
||||
Username: "@alexrecouso",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarAlexRecouso.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "2024 resembles 1984, but it doesn't have to be that way for you",
|
||||
},
|
||||
{
|
||||
FullName: "Chjango Unchained",
|
||||
Username: "@chjango",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarChjango.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "IBC is the inter-blockchain highway of @cosmos. While not very cypherpunk, charging a 1.5 basis pt fee would go a long way if priced in $ATOM.",
|
||||
},
|
||||
{
|
||||
FullName: "Gwart",
|
||||
Username: "@GwartyGwart",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarGwart.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: " Base is incredible. Most centralized l2. Least details about their plans to decentralize. Keeps OP cabal quiet by pretending to care about quadratic voting and giving 10% tithe. Pays Ethereum mainnet virtually nothing. Runs yuppie granola ad campaigns.",
|
||||
},
|
||||
},
|
||||
LowerQuotes: []*models.Testimonial{
|
||||
{
|
||||
FullName: "winnie",
|
||||
Username: "@winnielaux_",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarWinnieLaux.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "the ability to download apps directly from the web or from “crypto-only” app stores will be a massive unlock for web3",
|
||||
},
|
||||
{
|
||||
FullName: "Jelena",
|
||||
Username: "@jelena_noble",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarJelenaNoble.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "Excited for all the @cosmos nerds to be vindicated in the next bull run",
|
||||
},
|
||||
{
|
||||
FullName: "accountless",
|
||||
Username: "@alexanderchopan",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarAccountless.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "sounds like webThree. Single key pair Requires the same signer At risk of infinite approvals Public history of all transactions different account on each chain different addresses for each account",
|
||||
},
|
||||
{
|
||||
FullName: "Unusual Whales",
|
||||
Username: "@unusual_whales",
|
||||
Avatar: &models.Image{
|
||||
Src: models.AvatarUnusualWhales.Src(),
|
||||
Width: "44",
|
||||
Height: "44",
|
||||
},
|
||||
Quote: "BREAKING: Fidelity & Fidelity Investments has confirmed that over 77,000 customers had personal information compromised, including Social Security numbers and driver’s licenses.",
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
// ╭───────────────────────────────────────────────────────────╮
|
||||
// │ Render Section View │
|
||||
// ╰───────────────────────────────────────────────────────────╯
|
||||
|
||||
// Lowlights is the (4th) home page lowlights section
|
||||
func Lowlights() 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_Var1 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var1 == nil {
|
||||
templ_7745c5c3_Var1 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<section class=\"bg-zinc-800\"><div class=\"py-12 md:py-20\"><div class=\"max-w-5xl mx-auto px-4 sm:px-6\"><div class=\"max-w-3xl mx-auto text-center pb-12 md:pb-20\"><h2 class=\"font-inter-tight text-3xl md:text-4xl font-bold text-zinc-200\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var2 string
|
||||
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(lowlights.Heading)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/lowlights.templ`, Line: 108, Col: 25}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h2></div></div><div class=\"max-w-[94rem] mx-auto space-y-6\"><!-- Row #1 --><div x-data=\"{}\" x-init=\"$nextTick(() => {\n let ul = $refs.testimonials;\n ul.insertAdjacentHTML('afterend', ul.outerHTML);\n ul.nextSibling.setAttribute('aria-hidden', 'true');\n })\" class=\"w-full inline-flex flex-nowrap overflow-hidden [mask-image:_linear-gradient(to_right,transparent_0,_black_28%,_black_calc(100%-28%),transparent_100%)] group\"><div x-ref=\"testimonials\" class=\"flex items-start justify-center md:justify-start [&>div]:mx-3 animate-infinite-scroll group-hover:[animation-play-state:paused]\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
for _, quote := range lowlights.UpperQuotes {
|
||||
templ_7745c5c3_Err = quoteItem(quote).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div><!-- Row #2 --><div x-data=\"{}\" x-init=\"$nextTick(() => {\n let ul = $refs.testimonials;\n ul.insertAdjacentHTML('afterend', ul.outerHTML);\n ul.nextSibling.setAttribute('aria-hidden', 'true');\n })\" class=\"w-full inline-flex flex-nowrap overflow-hidden [mask-image:_linear-gradient(to_right,transparent_0,_black_28%,_black_calc(100%-28%),transparent_100%)] group\"><div x-ref=\"testimonials\" class=\"flex items-start justify-center md:justify-start [&>div]:mx-3 animate-infinite-scroll-inverse group-hover:[animation-play-state:paused] [animation-delay:-7.5s]\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
for _, quote := range lowlights.LowerQuotes {
|
||||
templ_7745c5c3_Err = quoteItem(quote).Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></div></div></section>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
func quoteItem(quote *models.Testimonial) 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_Var3 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var3 == nil {
|
||||
templ_7745c5c3_Var3 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"rounded h-full w-[22rem] border border-transparent [background:linear-gradient(#323237,#323237)_padding-box,linear-gradient(120deg,theme(colors.zinc.700),theme(colors.zinc.700/0),theme(colors.zinc.700))_border-box] p-5\"><div class=\"flex items-center mb-4\"><img class=\"shrink-0 rounded-full mr-3\" src=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var4 string
|
||||
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(quote.Avatar.Src)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/lowlights.templ`, Line: 153, Col: 65}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" width=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var5 string
|
||||
templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(quote.Avatar.Width)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/lowlights.templ`, Line: 153, Col: 94}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" height=\"")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var6 string
|
||||
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(quote.Avatar.Height)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/lowlights.templ`, Line: 153, Col: 125}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" alt=\"Testimonial 01\"><div><div class=\"font-inter-tight font-bold text-zinc-200\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var7 string
|
||||
templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(quote.FullName)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/lowlights.templ`, Line: 155, Col: 74}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><div><a class=\"text-sm font-medium text-zinc-500 hover:text-zinc-300 transition\" href=\"#0\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var8 string
|
||||
templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(quote.Username)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/lowlights.templ`, Line: 157, Col: 107}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</a></div></div></div><div class=\"text-zinc-500 before:content-['\\0022'] after:content-['\\0022']\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var9 string
|
||||
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(quote.Quote)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/lowlights.templ`, Line: 162, Col: 16}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
var _ = templruntime.GeneratedTemplate
|
||||
@@ -0,0 +1,357 @@
|
||||
package landing
|
||||
|
||||
import models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
|
||||
// mission is the (3rd) home page mission section
|
||||
var mission = &models.Mission{
|
||||
Eyebrow: "L1 Blockchain",
|
||||
Heading: "The Protocol for Decentralized Identity & Authentication",
|
||||
Subtitle: "We're creating the Global Standard for Decentralized Identity. Authenticate users with PassKeys, Issue Crypto Wallets, Build Payment flows, Send Encrypted Messages - all on a single platform.",
|
||||
Experience: &models.Feature{
|
||||
Title: "UX First Approach",
|
||||
Desc: "Sonr is a comprehensive system for Identity Management which proteects users across their digital personas while providing Developers a cost-effective solution for decentralized authentication.",
|
||||
Icon: nil,
|
||||
},
|
||||
Compliance: &models.Feature{
|
||||
Title: "Universal Interoperability",
|
||||
Desc: "Sonr is designed to work across all platforms and devices, building a encrypted and anonymous identity layer for each user on the internet.",
|
||||
Icon: nil,
|
||||
},
|
||||
Interoperability: &models.Feature{
|
||||
Title: "Made in the USA",
|
||||
Desc: "Sonr follows the latest specifications from W3C, DIF, and ICF to essentially have an Interchain-Connected, Smart Account System - seamlessly authenticated with PassKeys.",
|
||||
Icon: nil,
|
||||
},
|
||||
}
|
||||
|
||||
templ Mission() {
|
||||
<!-- Features #3 -->
|
||||
<section
|
||||
class="relative bg-zinc-800 after:absolute after:top-0 after:right-0 after:h-full after:w-96 after:pointer-events-none after:bg-gradient-to-l after:from-zinc-800 max-lg:after:hidden"
|
||||
>
|
||||
<div class="py-12 md:py-20">
|
||||
<!-- Carousel -->
|
||||
<div class="max-w-xl lg:max-w-6xl mx-auto px-8 sm:px-6">
|
||||
<div
|
||||
class="lg:flex space-y-12 lg:space-y-0 lg:space-x-12 xl:space-x-24"
|
||||
x-data="{ tab: '1' }"
|
||||
>
|
||||
<!-- Content -->
|
||||
<div class="lg:max-w-none lg:min-w-[524px]">
|
||||
<div class="mb-8">
|
||||
<div
|
||||
class="inline-flex text-sm font-medium text-zinc-400 px-4 py-0.5 border border-transparent [background:linear-gradient(theme(colors.zinc.800),theme(colors.zinc.800))_padding-box,linear-gradient(120deg,theme(colors.zinc.700),theme(colors.zinc.700/0),theme(colors.zinc.700))_border-box] rounded-full mb-4"
|
||||
>
|
||||
{ mission.Eyebrow }
|
||||
</div>
|
||||
<h3
|
||||
class="font-inter-tight text-3xl font-bold text-zinc-200 mb-4"
|
||||
>
|
||||
{ mission.Heading }
|
||||
</h3>
|
||||
<p class="text-lg text-zinc-500">
|
||||
{ mission.Subtitle }
|
||||
</p>
|
||||
</div>
|
||||
<!-- Tabs buttons -->
|
||||
<div class="mb-8 md:mb-0 space-y-2">
|
||||
<button
|
||||
:class="tab !== '1' ? '' : '[background:linear-gradient(#2E2E32,#2E2E32)_padding-box,linear-gradient(120deg,theme(colors.zinc.700),theme(colors.zinc.700/0),theme(colors.zinc.700))_border-box]'"
|
||||
class="text-left flex items-center px-6 py-4 rounded border border-transparent"
|
||||
@click.prevent="tab = '1'"
|
||||
>
|
||||
<svg
|
||||
class="shrink-0 fill-zinc-400 mr-3"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
>
|
||||
<path
|
||||
d="m7.951 14.537 6.296-7.196 1.506 1.318-7.704 8.804-3.756-3.756 1.414-1.414 2.244 2.244Zm11.296-7.196 1.506 1.318-7.704 8.804-1.756-1.756 1.414-1.414.244.244 6.296-7.196Z"
|
||||
></path>
|
||||
</svg>
|
||||
<div>
|
||||
<div
|
||||
class="font-inter-tight text-lg font-semibold text-zinc-200 mb-1"
|
||||
>
|
||||
{ mission.Experience.Title }
|
||||
</div>
|
||||
<div class="text-zinc-500">
|
||||
{ mission.Experience.Desc }
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
<button
|
||||
:class="tab !== '2' ? '' : '[background:linear-gradient(#2E2E32,#2E2E32)_padding-box,linear-gradient(120deg,theme(colors.zinc.700),theme(colors.zinc.700/0),theme(colors.zinc.700))_border-box]'"
|
||||
class="text-left flex items-center px-6 py-4 rounded border border-transparent"
|
||||
@click.prevent="tab = '2'"
|
||||
>
|
||||
<svg
|
||||
class="shrink-0 fill-zinc-400 mr-3"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
>
|
||||
<path
|
||||
d="m16.997 19.056-1.78-.912A13.91 13.91 0 0 0 16.75 11.8c0-2.206-.526-4.38-1.533-6.344l1.78-.912A15.91 15.91 0 0 1 18.75 11.8c0 2.524-.602 5.01-1.753 7.256Zm-3.616-1.701-1.77-.93A9.944 9.944 0 0 0 12.75 11.8c0-1.611-.39-3.199-1.14-4.625l1.771-.93c.9 1.714 1.37 3.62 1.369 5.555 0 1.935-.47 3.841-1.369 5.555Zm-3.626-1.693-1.75-.968c.49-.885.746-1.881.745-2.895a5.97 5.97 0 0 0-.745-2.893l1.75-.968a7.968 7.968 0 0 1 .995 3.861 7.97 7.97 0 0 1-.995 3.863Zm-3.673-1.65-1.664-1.11c.217-.325.333-.709.332-1.103 0-.392-.115-.776-.332-1.102L6.082 9.59c.437.655.67 1.425.668 2.21a3.981 3.981 0 0 1-.668 2.212Z"
|
||||
></path>
|
||||
</svg>
|
||||
<div>
|
||||
<div
|
||||
class="font-inter-tight text-lg font-semibold text-zinc-200 mb-1"
|
||||
>
|
||||
{ mission.Compliance.Title }
|
||||
</div>
|
||||
<div class="text-zinc-500">
|
||||
{ mission.Compliance.Desc }
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
<button
|
||||
:class="tab !== '3' ? '' : '[background:linear-gradient(#2E2E32,#2E2E32)_padding-box,linear-gradient(120deg,theme(colors.zinc.700),theme(colors.zinc.700/0),theme(colors.zinc.700))_border-box]'"
|
||||
class="text-left flex items-center px-6 py-4 rounded border border-transparent"
|
||||
@click.prevent="tab = '3'"
|
||||
>
|
||||
<svg
|
||||
class="shrink-0 fill-zinc-400 mr-3"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
>
|
||||
<path
|
||||
d="m11.293 5.293 1.414 1.414-8 8-1.414-1.414 8-8Zm7-1 1.414 1.414-8 8-1.414-1.414 8-8Zm0 6 1.414 1.414-8 8-1.414-1.414 8-8Z"
|
||||
></path>
|
||||
</svg>
|
||||
<div>
|
||||
<div
|
||||
class="font-inter-tight text-lg font-semibold text-zinc-200 mb-1"
|
||||
>
|
||||
{ mission.Interoperability.Title }
|
||||
</div>
|
||||
<div class="text-zinc-500">
|
||||
{ mission.Interoperability.Desc }
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Tabs items -->
|
||||
<div class="relative lg:max-w-none">
|
||||
<div class="relative flex flex-col">
|
||||
<!-- Item 1 -->
|
||||
<div
|
||||
class="w-full"
|
||||
x-show="tab === '1'"
|
||||
x-transition:enter="transition ease-in-out duration-700 transform order-first"
|
||||
x-transition:enter-start="opacity-0 translate-x-8"
|
||||
x-transition:enter-end="opacity-100 translate-x-0"
|
||||
x-transition:leave="transition ease-in-out duration-300 transform absolute"
|
||||
x-transition:leave-start="opacity-100 translate-x-0"
|
||||
x-transition:leave-end="opacity-0 -translate-x-8"
|
||||
>
|
||||
<div>
|
||||
<iframe
|
||||
class="lg:max-w-none mx-auto rounded-lg shadow-2xl"
|
||||
src="https://customer-rexp70scd8jht8wt.cloudflarestream.com/cc55547777cec7e044cedda239a89aaa/iframe?muted=true&preload=true&loop=true&autoplay=true&poster=https%3A%2F%2Fcustomer-rexp70scd8jht8wt.cloudflarestream.com%2Fcc55547777cec7e044cedda239a89aaa%2Fthumbnails%2Fthumbnail.jpg%3Ftime%3D%26height%3D600&controls=false"
|
||||
loading="lazy"
|
||||
style="border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;"
|
||||
allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;"
|
||||
allowfullscreen="true"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Item 2 -->
|
||||
<div
|
||||
class="w-full"
|
||||
x-show="tab === '2'"
|
||||
x-transition:enter="transition ease-in-out duration-700 transform order-first"
|
||||
x-transition:enter-start="opacity-0 translate-x-8"
|
||||
x-transition:enter-end="opacity-100 translate-x-0"
|
||||
x-transition:leave="transition ease-in-out duration-300 transform absolute"
|
||||
x-transition:leave-start="opacity-100 translate-x-0"
|
||||
x-transition:leave-end="opacity-0 -translate-x-8"
|
||||
>
|
||||
<div>
|
||||
<iframe
|
||||
class="lg:max-w-none mx-auto rounded-lg shadow-2xl"
|
||||
src="https://customer-rexp70scd8jht8wt.cloudflarestream.com/c1b8fc6a34e9cf0541c13751ab26c1fa/iframe?muted=true&preload=true&loop=true&autoplay=true&poster=https%3A%2F%2Fcustomer-rexp70scd8jht8wt.cloudflarestream.com%2Fc1b8fc6a34e9cf0541c13751ab26c1fa%2Fthumbnails%2Fthumbnail.jpg%3Ftime%3D%26height%3D600&controls=false"
|
||||
loading="lazy"
|
||||
style="border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;"
|
||||
allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;"
|
||||
allowfullscreen="true"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Item 3 -->
|
||||
<div
|
||||
class="w-full"
|
||||
x-show="tab === '3'"
|
||||
x-transition:enter="transition ease-in-out duration-700 transform order-first"
|
||||
x-transition:enter-start="opacity-0 translate-x-8"
|
||||
x-transition:enter-end="opacity-100 translate-x-0"
|
||||
x-transition:leave="transition ease-in-out duration-300 transform absolute"
|
||||
x-transition:leave-start="opacity-100 translate-x-0"
|
||||
x-transition:leave-end="opacity-0 -translate-x-8"
|
||||
>
|
||||
<div>
|
||||
<iframe
|
||||
class="lg:max-w-none mx-auto rounded-lg shadow-2xl"
|
||||
src="https://customer-rexp70scd8jht8wt.cloudflarestream.com/ff33ff3ee922f5826a0392bb3cda66ca/iframe?muted=true&preload=true&loop=true&autoplay=true&poster=https%3A%2F%2Fcustomer-rexp70scd8jht8wt.cloudflarestream.com%2Fff33ff3ee922f5826a0392bb3cda66ca%2Fthumbnails%2Fthumbnail.jpg%3Ftime%3D%26height%3D600&controls=false"
|
||||
loading="lazy"
|
||||
style="border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;"
|
||||
allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;"
|
||||
allowfullscreen="true"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Gear illustration -->
|
||||
<img
|
||||
class="absolute left-0 bottom-0 -translate-x-1/2 translate-y-1/3 mix-blend-exclusion max-lg:w-32"
|
||||
src="https://cdn.sonr.id/img/secure-vault.svg"
|
||||
alt="Features 02 illustration"
|
||||
width="224"
|
||||
height="224"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@featuresBlocks()
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
|
||||
templ featuresBlocks() {
|
||||
<div class="max-w-6xl mx-auto px-4 sm:px-6 mt-24 lg:mt-32">
|
||||
<div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-8 lg:gap-16">
|
||||
<!-- Block #1 -->
|
||||
<div>
|
||||
<div class="flex items-center mb-1">
|
||||
<svg
|
||||
class="fill-zinc-400 mr-2"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
>
|
||||
<path
|
||||
d="M15 9a1 1 0 0 1 0 2c-.441 0-1.243.92-1.89 1.716.319 1.005.529 1.284.89 1.284a1 1 0 0 1 0 2 2.524 2.524 0 0 1-2.339-1.545A3.841 3.841 0 0 1 9 16a1 1 0 0 1 0-2c.441 0 1.243-.92 1.89-1.716C10.57 11.279 10.361 11 10 11a1 1 0 0 1 0-2 2.524 2.524 0 0 1 2.339 1.545A3.841 3.841 0 0 1 15 9Zm-5-1H7.51l-.02.142C6.964 11.825 6.367 16 3 16a3 3 0 0 1-3-3 1 1 0 0 1 2 0 1 1 0 0 0 1 1c1.49 0 1.984-2.48 2.49-6H3a1 1 0 1 1 0-2h2.793c.52-3.1 1.4-6 4.207-6a3 3 0 0 1 3 3 1 1 0 0 1-2 0 1 1 0 0 0-1-1C8.808 2 8.257 3.579 7.825 6H10a1 1 0 0 1 0 2Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-200">
|
||||
Multi-party Computation
|
||||
</h3>
|
||||
</div>
|
||||
<p class="text-sm text-zinc-500">
|
||||
Eliminate the need for seed-phrases, and browser extensions for crypto wallets.
|
||||
</p>
|
||||
</div>
|
||||
<!-- Block #2 -->
|
||||
<div>
|
||||
<div class="flex items-center mb-1">
|
||||
<svg
|
||||
class="fill-zinc-400 mr-2"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
>
|
||||
<path
|
||||
d="M13 16c-.153 0-.306-.035-.447-.105l-3.851-1.926c-.231.02-.465.031-.702.031-4.411 0-8-3.14-8-7s3.589-7 8-7 8 3.14 8 7c0 1.723-.707 3.351-2 4.63V15a1.003 1.003 0 0 1-1 1Zm-4.108-4.054c.155 0 .308.036.447.105L12 13.382v-2.187c0-.288.125-.562.341-.752C13.411 9.506 14 8.284 14 7c0-2.757-2.691-5-6-5S2 4.243 2 7s2.691 5 6 5c.266 0 .526-.02.783-.048a1.01 1.01 0 0 1 .109-.006Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-200">
|
||||
Matrix Protocol
|
||||
</h3>
|
||||
</div>
|
||||
<p class="text-sm text-zinc-500">
|
||||
End-to-end encrypted messaging with <a class="text-zinc-500 hover:text-zinc-300 transition" href="https://sonr.chat">sonr.chat</a>.
|
||||
</p>
|
||||
</div>
|
||||
<!-- Block #3 -->
|
||||
<div>
|
||||
<div class="flex items-center mb-1">
|
||||
<svg
|
||||
class="fill-zinc-400 mr-2"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="14"
|
||||
height="16"
|
||||
>
|
||||
<path
|
||||
d="M13 0H1C.4 0 0 .4 0 1v14c0 .6.4 1 1 1h8l5-5V1c0-.6-.4-1-1-1ZM2 2h10v8H8v4H2V2Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-200">
|
||||
OpenID Connect
|
||||
</h3>
|
||||
</div>
|
||||
<p class="text-sm text-zinc-500">
|
||||
Seamless integration with Web2 Applications with the OpenID Standard.
|
||||
</p>
|
||||
</div>
|
||||
<!-- Block #4 -->
|
||||
<div>
|
||||
<div class="flex items-center mb-1">
|
||||
<svg
|
||||
class="fill-zinc-400 mr-2"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
>
|
||||
<path
|
||||
d="M7 14c-3.86 0-7-3.14-7-7s3.14-7 7-7 7 3.14 7 7-3.14 7-7 7ZM7 2C4.243 2 2 4.243 2 7s2.243 5 5 5 5-2.243 5-5-2.243-5-5-5Zm8.707 12.293a.999.999 0 1 1-1.414 1.414L11.9 13.314a8.019 8.019 0 0 0 1.414-1.414l2.393 2.393Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-200">
|
||||
Native ETH & BTC
|
||||
</h3>
|
||||
</div>
|
||||
<p class="text-sm text-zinc-500">
|
||||
Keep workflows efficient with tools that give teams
|
||||
visibility throughout the process.
|
||||
</p>
|
||||
</div>
|
||||
<!-- Block #5 -->
|
||||
<div>
|
||||
<div class="flex items-center mb-1">
|
||||
<svg
|
||||
class="fill-zinc-400 mr-2"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
>
|
||||
<path
|
||||
d="M14.6.085 8 2.885 1.4.085c-.5-.2-1.4-.1-1.4.9v11c0 .4.2.8.6.9l7 3c.3.1.5.1.8 0l7-3c.4-.2.6-.5.6-.9v-11c0-1-.9-1.1-1.4-.9ZM2 2.485l5 2.1v8.8l-5-2.1v-8.8Zm12 8.8-5 2.1v-8.7l5-2.1v8.7Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-200">
|
||||
Developer Integrations
|
||||
</h3>
|
||||
</div>
|
||||
<p class="text-sm text-zinc-500">
|
||||
Quickly integrate with Sonr by leveraging modern web APIs.
|
||||
</p>
|
||||
</div>
|
||||
<!-- Block #6 -->
|
||||
<div>
|
||||
<div class="flex items-center mb-1">
|
||||
<svg
|
||||
class="fill-zinc-400 mr-2"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="14"
|
||||
height="16"
|
||||
>
|
||||
<path
|
||||
d="M13 14a1 1 0 0 1 0 2H1a1 1 0 0 1 0-2h12Zm-6.707-2.293-5-5a1 1 0 0 1 1.414-1.414L6 8.586V1a1 1 0 1 1 2 0v7.586l3.293-3.293a1 1 0 1 1 1.414 1.414l-5 5a1 1 0 0 1-1.414 0Z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="font-inter-tight font-semibold text-zinc-200">
|
||||
Secure Backups
|
||||
</h3>
|
||||
</div>
|
||||
<p class="text-sm text-zinc-500">
|
||||
Uniformly accessible user keyshare access on/off network.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -0,0 +1,218 @@
|
||||
// Code generated by templ - DO NOT EDIT.
|
||||
|
||||
// templ: version: v0.2.793
|
||||
package landing
|
||||
|
||||
//lint:file-ignore SA4006 This context is only used if a nested component is present.
|
||||
|
||||
import "github.com/a-h/templ"
|
||||
import templruntime "github.com/a-h/templ/runtime"
|
||||
|
||||
import models "github.com/onsonr/sonr/pkg/webapp/models"
|
||||
|
||||
// mission is the (3rd) home page mission section
|
||||
var mission = &models.Mission{
|
||||
Eyebrow: "L1 Blockchain",
|
||||
Heading: "The Protocol for Decentralized Identity & Authentication",
|
||||
Subtitle: "We're creating the Global Standard for Decentralized Identity. Authenticate users with PassKeys, Issue Crypto Wallets, Build Payment flows, Send Encrypted Messages - all on a single platform.",
|
||||
Experience: &models.Feature{
|
||||
Title: "UX First Approach",
|
||||
Desc: "Sonr is a comprehensive system for Identity Management which proteects users across their digital personas while providing Developers a cost-effective solution for decentralized authentication.",
|
||||
Icon: nil,
|
||||
},
|
||||
Compliance: &models.Feature{
|
||||
Title: "Universal Interoperability",
|
||||
Desc: "Sonr is designed to work across all platforms and devices, building a encrypted and anonymous identity layer for each user on the internet.",
|
||||
Icon: nil,
|
||||
},
|
||||
Interoperability: &models.Feature{
|
||||
Title: "Made in the USA",
|
||||
Desc: "Sonr follows the latest specifications from W3C, DIF, and ICF to essentially have an Interchain-Connected, Smart Account System - seamlessly authenticated with PassKeys.",
|
||||
Icon: nil,
|
||||
},
|
||||
}
|
||||
|
||||
func Mission() 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_Var1 := templ.GetChildren(ctx)
|
||||
if templ_7745c5c3_Var1 == nil {
|
||||
templ_7745c5c3_Var1 = templ.NopComponent
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<!-- Features #3 --><section class=\"relative bg-zinc-800 after:absolute after:top-0 after:right-0 after:h-full after:w-96 after:pointer-events-none after:bg-gradient-to-l after:from-zinc-800 max-lg:after:hidden\"><div class=\"py-12 md:py-20\"><!-- Carousel --><div class=\"max-w-xl lg:max-w-6xl mx-auto px-8 sm:px-6\"><div class=\"lg:flex space-y-12 lg:space-y-0 lg:space-x-12 xl:space-x-24\" x-data=\"{ tab: '1' }\"><!-- Content --><div class=\"lg:max-w-none lg:min-w-[524px]\"><div class=\"mb-8\"><div class=\"inline-flex text-sm font-medium text-zinc-400 px-4 py-0.5 border border-transparent [background:linear-gradient(theme(colors.zinc.800),theme(colors.zinc.800))_padding-box,linear-gradient(120deg,theme(colors.zinc.700),theme(colors.zinc.700/0),theme(colors.zinc.700))_border-box] rounded-full mb-4\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var2 string
|
||||
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(mission.Eyebrow)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/mission.templ`, Line: 45, Col: 25}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><h3 class=\"font-inter-tight text-3xl font-bold text-zinc-200 mb-4\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var3 string
|
||||
templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(mission.Heading)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/mission.templ`, Line: 50, Col: 25}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</h3><p class=\"text-lg text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var4 string
|
||||
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(mission.Subtitle)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/mission.templ`, Line: 53, Col: 26}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</p></div><!-- Tabs buttons --><div class=\"mb-8 md:mb-0 space-y-2\"><button :class=\"tab !== '1' ? '' : '[background:linear-gradient(#2E2E32,#2E2E32)_padding-box,linear-gradient(120deg,theme(colors.zinc.700),theme(colors.zinc.700/0),theme(colors.zinc.700))_border-box]'\" class=\"text-left flex items-center px-6 py-4 rounded border border-transparent\" @click.prevent=\"tab = '1'\"><svg class=\"shrink-0 fill-zinc-400 mr-3\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\"><path d=\"m7.951 14.537 6.296-7.196 1.506 1.318-7.704 8.804-3.756-3.756 1.414-1.414 2.244 2.244Zm11.296-7.196 1.506 1.318-7.704 8.804-1.756-1.756 1.414-1.414.244.244 6.296-7.196Z\"></path></svg><div><div class=\"font-inter-tight text-lg font-semibold text-zinc-200 mb-1\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var5 string
|
||||
templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(mission.Experience.Title)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/mission.templ`, Line: 77, Col: 36}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><div class=\"text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var6 string
|
||||
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(mission.Experience.Desc)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/mission.templ`, Line: 80, Col: 35}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></button> <button :class=\"tab !== '2' ? '' : '[background:linear-gradient(#2E2E32,#2E2E32)_padding-box,linear-gradient(120deg,theme(colors.zinc.700),theme(colors.zinc.700/0),theme(colors.zinc.700))_border-box]'\" class=\"text-left flex items-center px-6 py-4 rounded border border-transparent\" @click.prevent=\"tab = '2'\"><svg class=\"shrink-0 fill-zinc-400 mr-3\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\"><path d=\"m16.997 19.056-1.78-.912A13.91 13.91 0 0 0 16.75 11.8c0-2.206-.526-4.38-1.533-6.344l1.78-.912A15.91 15.91 0 0 1 18.75 11.8c0 2.524-.602 5.01-1.753 7.256Zm-3.616-1.701-1.77-.93A9.944 9.944 0 0 0 12.75 11.8c0-1.611-.39-3.199-1.14-4.625l1.771-.93c.9 1.714 1.37 3.62 1.369 5.555 0 1.935-.47 3.841-1.369 5.555Zm-3.626-1.693-1.75-.968c.49-.885.746-1.881.745-2.895a5.97 5.97 0 0 0-.745-2.893l1.75-.968a7.968 7.968 0 0 1 .995 3.861 7.97 7.97 0 0 1-.995 3.863Zm-3.673-1.65-1.664-1.11c.217-.325.333-.709.332-1.103 0-.392-.115-.776-.332-1.102L6.082 9.59c.437.655.67 1.425.668 2.21a3.981 3.981 0 0 1-.668 2.212Z\"></path></svg><div><div class=\"font-inter-tight text-lg font-semibold text-zinc-200 mb-1\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var7 string
|
||||
templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(mission.Compliance.Title)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/mission.templ`, Line: 103, Col: 36}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><div class=\"text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var8 string
|
||||
templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(mission.Compliance.Desc)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/mission.templ`, Line: 106, Col: 35}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></button> <button :class=\"tab !== '3' ? '' : '[background:linear-gradient(#2E2E32,#2E2E32)_padding-box,linear-gradient(120deg,theme(colors.zinc.700),theme(colors.zinc.700/0),theme(colors.zinc.700))_border-box]'\" class=\"text-left flex items-center px-6 py-4 rounded border border-transparent\" @click.prevent=\"tab = '3'\"><svg class=\"shrink-0 fill-zinc-400 mr-3\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\"><path d=\"m11.293 5.293 1.414 1.414-8 8-1.414-1.414 8-8Zm7-1 1.414 1.414-8 8-1.414-1.414 8-8Zm0 6 1.414 1.414-8 8-1.414-1.414 8-8Z\"></path></svg><div><div class=\"font-inter-tight text-lg font-semibold text-zinc-200 mb-1\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var9 string
|
||||
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(mission.Interoperability.Title)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/mission.templ`, Line: 129, Col: 42}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><div class=\"text-zinc-500\">")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
var templ_7745c5c3_Var10 string
|
||||
templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(mission.Interoperability.Desc)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/webapp/components/landing/mission.templ`, Line: 132, Col: 41}
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></div></button></div></div><!-- Tabs items --><div class=\"relative lg:max-w-none\"><div class=\"relative flex flex-col\"><!-- Item 1 --><div class=\"w-full\" x-show=\"tab === '1'\" x-transition:enter=\"transition ease-in-out duration-700 transform order-first\" x-transition:enter-start=\"opacity-0 translate-x-8\" x-transition:enter-end=\"opacity-100 translate-x-0\" x-transition:leave=\"transition ease-in-out duration-300 transform absolute\" x-transition:leave-start=\"opacity-100 translate-x-0\" x-transition:leave-end=\"opacity-0 -translate-x-8\"><div><iframe class=\"lg:max-w-none mx-auto rounded-lg shadow-2xl\" src=\"https://customer-rexp70scd8jht8wt.cloudflarestream.com/cc55547777cec7e044cedda239a89aaa/iframe?muted=true&preload=true&loop=true&autoplay=true&poster=https%3A%2F%2Fcustomer-rexp70scd8jht8wt.cloudflarestream.com%2Fcc55547777cec7e044cedda239a89aaa%2Fthumbnails%2Fthumbnail.jpg%3Ftime%3D%26height%3D600&controls=false\" loading=\"lazy\" style=\"border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;\" allow=\"accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;\" allowfullscreen=\"true\"></iframe></div></div><!-- Item 2 --><div class=\"w-full\" x-show=\"tab === '2'\" x-transition:enter=\"transition ease-in-out duration-700 transform order-first\" x-transition:enter-start=\"opacity-0 translate-x-8\" x-transition:enter-end=\"opacity-100 translate-x-0\" x-transition:leave=\"transition ease-in-out duration-300 transform absolute\" x-transition:leave-start=\"opacity-100 translate-x-0\" x-transition:leave-end=\"opacity-0 -translate-x-8\"><div><iframe class=\"lg:max-w-none mx-auto rounded-lg shadow-2xl\" src=\"https://customer-rexp70scd8jht8wt.cloudflarestream.com/c1b8fc6a34e9cf0541c13751ab26c1fa/iframe?muted=true&preload=true&loop=true&autoplay=true&poster=https%3A%2F%2Fcustomer-rexp70scd8jht8wt.cloudflarestream.com%2Fc1b8fc6a34e9cf0541c13751ab26c1fa%2Fthumbnails%2Fthumbnail.jpg%3Ftime%3D%26height%3D600&controls=false\" loading=\"lazy\" style=\"border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;\" allow=\"accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;\" allowfullscreen=\"true\"></iframe></div></div><!-- Item 3 --><div class=\"w-full\" x-show=\"tab === '3'\" x-transition:enter=\"transition ease-in-out duration-700 transform order-first\" x-transition:enter-start=\"opacity-0 translate-x-8\" x-transition:enter-end=\"opacity-100 translate-x-0\" x-transition:leave=\"transition ease-in-out duration-300 transform absolute\" x-transition:leave-start=\"opacity-100 translate-x-0\" x-transition:leave-end=\"opacity-0 -translate-x-8\"><div><iframe class=\"lg:max-w-none mx-auto rounded-lg shadow-2xl\" src=\"https://customer-rexp70scd8jht8wt.cloudflarestream.com/ff33ff3ee922f5826a0392bb3cda66ca/iframe?muted=true&preload=true&loop=true&autoplay=true&poster=https%3A%2F%2Fcustomer-rexp70scd8jht8wt.cloudflarestream.com%2Fff33ff3ee922f5826a0392bb3cda66ca%2Fthumbnails%2Fthumbnail.jpg%3Ftime%3D%26height%3D600&controls=false\" loading=\"lazy\" style=\"border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;\" allow=\"accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;\" allowfullscreen=\"true\"></iframe></div></div></div><!-- Gear illustration --><img class=\"absolute left-0 bottom-0 -translate-x-1/2 translate-y-1/3 mix-blend-exclusion max-lg:w-32\" src=\"https://cdn.sonr.id/img/secure-vault.svg\" alt=\"Features 02 illustration\" width=\"224\" height=\"224\" aria-hidden=\"true\"></div></div></div>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
templ_7745c5c3_Err = featuresBlocks().Render(ctx, templ_7745c5c3_Buffer)
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></section>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
func featuresBlocks() 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("<div class=\"max-w-6xl mx-auto px-4 sm:px-6 mt-24 lg:mt-32\"><div class=\"grid sm:grid-cols-2 lg:grid-cols-3 gap-8 lg:gap-16\"><!-- Block #1 --><div><div class=\"flex items-center mb-1\"><svg class=\"fill-zinc-400 mr-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"><path d=\"M15 9a1 1 0 0 1 0 2c-.441 0-1.243.92-1.89 1.716.319 1.005.529 1.284.89 1.284a1 1 0 0 1 0 2 2.524 2.524 0 0 1-2.339-1.545A3.841 3.841 0 0 1 9 16a1 1 0 0 1 0-2c.441 0 1.243-.92 1.89-1.716C10.57 11.279 10.361 11 10 11a1 1 0 0 1 0-2 2.524 2.524 0 0 1 2.339 1.545A3.841 3.841 0 0 1 15 9Zm-5-1H7.51l-.02.142C6.964 11.825 6.367 16 3 16a3 3 0 0 1-3-3 1 1 0 0 1 2 0 1 1 0 0 0 1 1c1.49 0 1.984-2.48 2.49-6H3a1 1 0 1 1 0-2h2.793c.52-3.1 1.4-6 4.207-6a3 3 0 0 1 3 3 1 1 0 0 1-2 0 1 1 0 0 0-1-1C8.808 2 8.257 3.579 7.825 6H10a1 1 0 0 1 0 2Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-200\">Multi-party Computation</h3></div><p class=\"text-sm text-zinc-500\">Eliminate the need for seed-phrases, and browser extensions for crypto wallets.</p></div><!-- Block #2 --><div><div class=\"flex items-center mb-1\"><svg class=\"fill-zinc-400 mr-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"><path d=\"M13 16c-.153 0-.306-.035-.447-.105l-3.851-1.926c-.231.02-.465.031-.702.031-4.411 0-8-3.14-8-7s3.589-7 8-7 8 3.14 8 7c0 1.723-.707 3.351-2 4.63V15a1.003 1.003 0 0 1-1 1Zm-4.108-4.054c.155 0 .308.036.447.105L12 13.382v-2.187c0-.288.125-.562.341-.752C13.411 9.506 14 8.284 14 7c0-2.757-2.691-5-6-5S2 4.243 2 7s2.691 5 6 5c.266 0 .526-.02.783-.048a1.01 1.01 0 0 1 .109-.006Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-200\">Matrix Protocol</h3></div><p class=\"text-sm text-zinc-500\">End-to-end encrypted messaging with <a class=\"text-zinc-500 hover:text-zinc-300 transition\" href=\"https://sonr.chat\">sonr.chat</a>.</p></div><!-- Block #3 --><div><div class=\"flex items-center mb-1\"><svg class=\"fill-zinc-400 mr-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"16\"><path d=\"M13 0H1C.4 0 0 .4 0 1v14c0 .6.4 1 1 1h8l5-5V1c0-.6-.4-1-1-1ZM2 2h10v8H8v4H2V2Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-200\">OpenID Connect</h3></div><p class=\"text-sm text-zinc-500\">Seamless integration with Web2 Applications with the OpenID Standard.</p></div><!-- Block #4 --><div><div class=\"flex items-center mb-1\"><svg class=\"fill-zinc-400 mr-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"><path d=\"M7 14c-3.86 0-7-3.14-7-7s3.14-7 7-7 7 3.14 7 7-3.14 7-7 7ZM7 2C4.243 2 2 4.243 2 7s2.243 5 5 5 5-2.243 5-5-2.243-5-5-5Zm8.707 12.293a.999.999 0 1 1-1.414 1.414L11.9 13.314a8.019 8.019 0 0 0 1.414-1.414l2.393 2.393Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-200\">Native ETH & BTC</h3></div><p class=\"text-sm text-zinc-500\">Keep workflows efficient with tools that give teams visibility throughout the process.</p></div><!-- Block #5 --><div><div class=\"flex items-center mb-1\"><svg class=\"fill-zinc-400 mr-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"><path d=\"M14.6.085 8 2.885 1.4.085c-.5-.2-1.4-.1-1.4.9v11c0 .4.2.8.6.9l7 3c.3.1.5.1.8 0l7-3c.4-.2.6-.5.6-.9v-11c0-1-.9-1.1-1.4-.9ZM2 2.485l5 2.1v8.8l-5-2.1v-8.8Zm12 8.8-5 2.1v-8.7l5-2.1v8.7Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-200\">Developer Integrations</h3></div><p class=\"text-sm text-zinc-500\">Quickly integrate with Sonr by leveraging modern web APIs.</p></div><!-- Block #6 --><div><div class=\"flex items-center mb-1\"><svg class=\"fill-zinc-400 mr-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"16\"><path d=\"M13 14a1 1 0 0 1 0 2H1a1 1 0 0 1 0-2h12Zm-6.707-2.293-5-5a1 1 0 0 1 1.414-1.414L6 8.586V1a1 1 0 1 1 2 0v7.586l3.293-3.293a1 1 0 1 1 1.414 1.414l-5 5a1 1 0 0 1-1.414 0Z\"></path></svg><h3 class=\"font-inter-tight font-semibold text-zinc-200\">Secure Backups</h3></div><p class=\"text-sm text-zinc-500\">Uniformly accessible user keyshare access on/off network.</p></div></div></div>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
return templ_7745c5c3_Err
|
||||
})
|
||||
}
|
||||
|
||||
var _ = templruntime.GeneratedTemplate
|
||||
Reference in New Issue
Block a user