Merge pull request #107 from dot-agent/my-portfolio-new

Added a portfolio app example

app-examples/portfolio/.gitignore

@@ -0,0 +1,5 @@
+*.db
+*.py[cod]
+*.web
+.web
+__pycache__/

app-examples/portfolio/portfolio/components/contact.py

@@ -0,0 +1,57 @@
+import nextpy as xt
+
+
+def contact():
+    return xt.box(
+        xt.box(
+            xt.text(
+                "Lets work together",
+                class_name="md:mb-8 mb-4 font-bold text-base md:text-2xl lg:text-3xl",
+            ),
+            xt.text(
+                "This is a template Figma file, turned into code using Anima. Learn more at AnimaApp.com This is a template Figma file, turned into code using Anima. Learn more at AnimaApp.com",
+                class_name="md:mb-8 mb-4 text-sm lg:text-base max-w-lg",
+            ),
+            xt.box(
+                xt.image(
+                    src="/discord.svg",
+                    class_name="w-7 h-7 object-cover md:w-9 md:h-9",
+                ),
+                xt.image(
+                    src="/facebook.svg",
+                    class_name="w-7 h-7 object-cover md:w-9 md:h-9",
+                ),
+                xt.image(
+                    src="/dribbble.svg",
+                    class_name="w-7 h-7 object-cover md:w-9 md:h-9",
+                ),
+                xt.image(
+                    src="/instagram.svg",
+                    class_name="w-7 h-7 object-cover md:w-9 md:h-9",
+                ),
+                xt.image(
+                    src="/behance.svg",
+                    class_name="w-7 h-7 object-cover md:w-9 md:h-9",
+                ),
+                class_name="flex items-center gap-4 ",
+            ),
+        ),
+        xt.box(
+            xt.input(
+                placeholder="Name",
+                class_name="mb-2",
+            ),
+            xt.input(
+                placeholder="Email",
+            ),
+            xt.button(
+                "Submit",
+                class_name="mt-6 py-8 text-base md:text-lg",
+            ),
+            variant="unstyled",
+            spacing="0.5em",
+            align_items="left",
+            font_size="2em",
+        ),
+        class_name="flex flex-col md:flex-row items-center justify-evenly gap-4 md:gap-8 mx-5  md:mx-8  pt-2 md:pt-12 lg:pt-14 pb-12 md:pb-20",
+    )

app-examples/portfolio/portfolio/components/hero.py

@@ -0,0 +1,41 @@
+import nextpy as xt
+
+
+def hero():
+    return xt.fragment(
+        # xt.color_mode_button(xt.color_mode_icon(), float="right"),
+        xt.box(
+            xt.box(
+                xt.text(
+                    "Branding | Image making ",
+                    class_name="md:mb-8 mb-4 font-bold text-base md:text-lg",
+                ),
+                xt.text(
+                    "Visual Designer",
+                    class_name="md:text-7xl font-bold text-3xl",
+                ),
+                xt.text(
+                    "This is a template Figma file, turned into code using Anima. Learn more at AnimaApp.com",
+                    class_name="pt-2 md:text-sm max-w-md text-xs",
+                ),
+                xt.button(
+                    "Contact",
+                    class_name="py-8 mt-6  text-base md:text-lg",
+                ),
+                variant="unstyled",
+                spacing="0.5em",
+                align_items="left",
+                font_size="2em",
+            ),
+            xt.box(
+                xt.image(
+                    src="/image.png",
+                    class_name="w-4/6",
+                ),
+                font_size="15.25px",
+                color="#E3E3E3",
+                class_name="flex justify-center items-center",
+            ),
+            class_name="flex flex-col md:flex-row  items-center justify-evenly mx-5  md:mx-8 mt-16  md:mt-24    ",
+        ),
+    )

app-examples/portfolio/portfolio/components/navbar.py

@@ -0,0 +1,15 @@
+import nextpy as xt
+
+def navbar():
+    return xt.box(
+        xt.text(
+            "Logo",
+        ),
+        xt.box(
+            xt.text("About", cursor="pointer"),
+            xt.text("Work", cursor="pointer"),
+            xt.text("Contact", cursor="pointer"),
+            class_name="flex items-center gap-5 ",
+        ),
+        class_name="flex items-center justify-between mt-5 mx-5 md:mx-10",
+    )