From 43d111cb0eae429609d25f715667db35ff30d03e Mon Sep 17 00:00:00 2001 From: Preston Baxter Date: Sat, 28 Oct 2023 10:15:42 -0500 Subject: [PATCH] landing page start --- ui/main.go | 2 +- ui/templates/content.templ | 319 ++++++++++++------ .../{home.templ => landing_page.templ} | 5 +- ui/templates/nav.templ | 127 ++++--- ui/templates/script.templ | 4 +- 5 files changed, 287 insertions(+), 170 deletions(-) rename ui/templates/{home.templ => landing_page.templ} (93%) diff --git a/ui/main.go b/ui/main.go index 6bb408d..e5a440d 100644 --- a/ui/main.go +++ b/ui/main.go @@ -12,7 +12,7 @@ func main() { r.GET("/", func(c *gin.Context) { raw := []byte{} buf := bytes.NewBuffer(raw) - templates.Hello("str").Render(c.Request.Context(), buf) + templates.LandingPage(false).Render(c.Request.Context(), buf) c.Data(200, "text/html", []byte(buf.String())) diff --git a/ui/templates/content.templ b/ui/templates/content.templ index 8bff1e5..a33c5bf 100644 --- a/ui/templates/content.templ +++ b/ui/templates/content.templ @@ -3,8 +3,10 @@ package templates templ Content() {
-
+
@@ -23,10 +25,19 @@ templ Content() {
-
- +
+
@@ -36,10 +47,12 @@ templ Content() {
+ class="relative flex flex-col min-w-0 break-words bg-white w-full mb-8 shadow-lg rounded-lg" + >
+ class="text-white p-3 text-center inline-flex items-center justify-center w-12 h-12 mb-5 shadow-lg rounded-full bg-red-400" + >
Awarded Agency
@@ -52,10 +65,12 @@ templ Content() {
+ class="relative flex flex-col min-w-0 break-words bg-white w-full mb-8 shadow-lg rounded-lg" + >
+ class="text-white p-3 text-center inline-flex items-center justify-center w-12 h-12 mb-5 shadow-lg rounded-full bg-blue-400" + >
Free Revisions
@@ -68,10 +83,12 @@ templ Content() {
+ class="relative flex flex-col min-w-0 break-words bg-white w-full mb-8 shadow-lg rounded-lg" + >
+ class="text-white p-3 text-center inline-flex items-center justify-center w-12 h-12 mb-5 shadow-lg rounded-full bg-green-400" + >
Verified Company
@@ -86,7 +103,8 @@ templ Content() {
+ class="text-gray-600 p-3 text-center inline-flex items-center justify-center w-16 h-16 mb-6 shadow-lg rounded-full bg-gray-100" + >

@@ -102,18 +120,28 @@ templ Content() { faster. You can change the text and images and you're good to go. Just make sure you enable them first via JavaScript.

- Check Tailwind Starter Kit! + Check Tailwind Starter Kit!

- ... + class="relative flex flex-col min-w-0 break-words bg-white w-full mb-6 shadow-lg rounded-lg bg-pink-600" + > + ...
- +

@@ -131,23 +159,36 @@ templ Content() {

-
- +
+
- ... + ...
+ class="text-pink-600 p-3 text-center inline-flex items-center justify-center w-16 h-16 mb-6 shadow-lg rounded-full bg-pink-300" + >

A growing company

@@ -161,8 +202,12 @@ templ Content() {
+ class="text-xs font-semibold inline-block py-1 px-2 uppercase rounded-full text-pink-600 bg-pink-200 mr-3" + > + +

@@ -175,8 +220,12 @@ templ Content() {
+ class="text-xs font-semibold inline-block py-1 px-2 uppercase rounded-full text-pink-600 bg-pink-200 mr-3" + > + +

Amazing page examples

@@ -187,8 +236,12 @@ templ Content() {
+ class="text-xs font-semibold inline-block py-1 px-2 uppercase rounded-full text-pink-600 bg-pink-200 mr-3" + > + +

Dynamic components

@@ -216,8 +269,12 @@ templ Content() {
- ... + ...
Ryan Tompson

@@ -225,14 +282,21 @@ templ Content() {

+ +
@@ -241,8 +305,12 @@ templ Content() {
- ... + ...
Romina Hadid

@@ -250,11 +318,15 @@ templ Content() {

+
@@ -263,8 +335,12 @@ templ Content() {
- ... + ...
Alexa Smith

@@ -272,14 +348,21 @@ templ Content() {

+ +
@@ -288,8 +371,12 @@ templ Content() {
- ... + ...
Jenna Kardi

@@ -297,17 +384,27 @@ templ Content() {

+ + +
@@ -318,10 +415,19 @@ templ Content() {

-
- +
+
@@ -339,7 +445,8 @@ templ Content() {
+ class="text-gray-900 p-3 w-12 h-12 shadow-lg rounded-full bg-white inline-flex items-center justify-center" + >
@@ -352,7 +459,8 @@ templ Content() {
+ class="text-gray-900 p-3 w-12 h-12 shadow-lg rounded-full bg-white inline-flex items-center justify-center" + >
@@ -365,7 +473,8 @@ templ Content() {
+ class="text-gray-900 p-3 w-12 h-12 shadow-lg rounded-full bg-white inline-flex items-center justify-center" + >
Launch time
@@ -382,34 +491,52 @@ templ Content() {
+ class="relative flex flex-col min-w-0 break-words w-full mb-6 shadow-lg rounded-lg bg-gray-300" + >

Want to work with us?

Complete this form and we will get back to you in 24 hours.

- +
- +
- +
diff --git a/ui/templates/home.templ b/ui/templates/landing_page.templ similarity index 93% rename from ui/templates/home.templ rename to ui/templates/landing_page.templ index 8ee87b9..c5e3dbd 100644 --- a/ui/templates/home.templ +++ b/ui/templates/landing_page.templ @@ -29,13 +29,14 @@ templ Head() { } -templ Hello(name string) { +templ LandingPage(auth bool) { @Head() - @Nav() + @Nav(auth) @Content() + @toggleNavBar() } diff --git a/ui/templates/nav.templ b/ui/templates/nav.templ index 27ca713..2848e77 100644 --- a/ui/templates/nav.templ +++ b/ui/templates/nav.templ @@ -1,86 +1,73 @@ package templates -templ Nav() { +templ navTitle(title string) { + + { title } + + +} + +templ navItem(name string, link string) { +
  • + + { name } + +
    • +} + +templ navActionItem(auth bool) { +
  • + if auth { + + + } else { + + + + } +
    • +} + +templ Nav(auth bool) {