diff --git a/assets/landing/social/alex_opensea.webp b/assets/landing/social/alex_opensea.webp new file mode 100644 index 000000000..a4c945b71 Binary files /dev/null and b/assets/landing/social/alex_opensea.webp differ diff --git a/assets/landing/video/preview_video.webp b/assets/landing/video/preview_video.webp new file mode 100644 index 000000000..3fce4b7f4 Binary files /dev/null and b/assets/landing/video/preview_video.webp differ diff --git a/pcweb/components/docpage/navbar/navbar.py b/pcweb/components/docpage/navbar/navbar.py index 1a83ca501..843ade82b 100644 --- a/pcweb/components/docpage/navbar/navbar.py +++ b/pcweb/components/docpage/navbar/navbar.py @@ -553,7 +553,7 @@ def new_component_section() -> rx.Component: "Book a Demo", size="sm", variant="primary", - class_name="font-semibold whitespace-nowrap", + class_name="font-semibold whitespace-nowrap max-xl:hidden", ), ), unstyled=True, diff --git a/pcweb/constants.py b/pcweb/constants.py index 78705c0d7..dd401f5a2 100644 --- a/pcweb/constants.py +++ b/pcweb/constants.py @@ -44,6 +44,7 @@ ENTERPRISE_DOCS_URL = "https://enterprise.reflex.dev" DATABRICKS_NOTION_URL = "https://reflex-dev.notion.site/reflex-x-databricks" DEMO_VIDEO_URL = "https://www.youtube.com/watch?v=lO-N_IRaWhQ" +LAUNCH_VIDEO_URL = "https://www.youtube.com/watch?v=Hy3uhBVRdtk" # Install urls. BUN_URL = "https://bun.sh" @@ -102,6 +103,7 @@ # Pricing PRO_TIERS_TABLE = { + "Pro 25": {"price": 25, "credits": 500}, "Pro 50": {"price": 50, "credits": 1000}, "Pro 100": {"price": 100, "credits": 2000}, "Pro 250": {"price": 250, "credits": 5000}, diff --git a/pcweb/pages/landing/views/social_marquee.py b/pcweb/pages/landing/views/social_marquee.py index 860b42b99..fca5e9c8f 100644 --- a/pcweb/pages/landing/views/social_marquee.py +++ b/pcweb/pages/landing/views/social_marquee.py @@ -21,34 +21,38 @@ class Social: name: str role: str text: str | rx.Component + url: str | None = None + avatar: str | None = None SOCIALS_1 = [ Social( name="vishnudeva", - role="Reddit User", + role="Hacker News", text=get_normal_text( "Been a lurker on Hacker News for years but I created an account just so I could say how excited I am! Love the effort you're putting into ", get_highlight("Reflex"), ". Streamlit felt really painful to use whenever you want to do anything slightly out of the main path.", ), + url="https://news.ycombinator.com/item?id=35140025", ), Social( - name="vikinghckr", - role="Reddit User", + name="Alex", + role="OpenSea Co-founder", text=get_normal_text( - "I'm not exaggerating but this might just be the highest impact library I've seen. As a backend developer who has lots of great project ideas but bail at the thought of having to use JavaScript and HTML, ", + "Have been playing with ", get_highlight("Reflex"), - " is a godsend!", + " since Jan and realized I should just say, from a fellow YC member: love the architecture decisions you guys are making! ❤️", ), + avatar="/landing/social/alex_opensea.webp", ), Social( - name="Alex", - role="OpenSea Co-founder", + name="Andrew", + role="Discord", text=get_normal_text( - "Have been playing with ", + "I've recently started using ", get_highlight("Reflex"), - " since Jan and realized I should just say, from a fellow YC member: love the architecture decisions you guys are making! ❤️", + " and love it. My developer productivity is through the roof. Built a full-stack web app with stripe integration, firebase user authentication all built and looking quite nice and all done in about 2 nights of work.", ), ), ] @@ -56,7 +60,7 @@ class Social: SOCIALS_2 = [ Social( name="PoshoDev", - role="Discord User", + role="Discord", text=get_normal_text( "I'm experimenting with ", get_highlight("Reflex"), @@ -64,17 +68,18 @@ class Social: ), ), Social( - name="Andrew", - role="Discord User", + name="vikinghckr", + role="Hacker News", text=get_normal_text( - "I've recently started using ", + "I'm not exaggerating but this might just be the highest impact library I've seen. As a backend developer who has lots of great project ideas but bail at the thought of having to use JavaScript and HTML, ", get_highlight("Reflex"), - " and love it. My developer productivity is through the roof. Built a full-stack web app with stripe integration, firebase user authentication all built and looking quite nice and all done in about 2 nights of work.", + " is a godsend!", ), + url="https://news.ycombinator.com/item?id=35140025", ), Social( name="Chaumy", - role="Discord User", + role="Discord", text=get_normal_text( "Finally managed to work through the docs - ", get_highlight("Reflex"), @@ -91,6 +96,11 @@ def social_card(social: Social) -> rx.Component: ui.gradient_profile( seed=social.name, class_name="size-9 rounded-full", + ) + if not social.avatar + else rx.image( + src=social.avatar, + class_name="size-9 rounded-full", ), rx.el.div( rx.el.span( @@ -103,15 +113,19 @@ def social_card(social: Social) -> rx.Component: ), class_name="flex flex-row gap-4 mt-auto", ), - # rx.el.a( - # to=social.url, - # target="_blank", - # class_name="absolute inset-0", - # ), - # ui.icon( - # "ArrowUpRight01Icon", - # class_name="group-hover:opacity-100 opacity-0 scale-50 group-hover:scale-100 transition-all duration-100 absolute bottom-4 right-4 size-5 text-primary-11 origin-bottom-left ease-in-out", - # ), + rx.fragment( + rx.el.a( + to=social.url, + target="_blank", + class_name="absolute inset-0", + ), + ui.icon( + "ArrowUpRight01Icon", + class_name="group-hover:opacity-100 opacity-0 scale-50 group-hover:scale-100 transition-all duration-100 absolute bottom-4 right-4 size-5 text-primary-11 origin-bottom-left ease-in-out", + ), + ) + if social.url + else None, class_name="flex flex-col gap-4 bg-slate-1 hover:bg-slate-2 transition-colors relative w-[22.5rem] h-[15rem] flex-shrink-0 p-6 group border-slate-4 py-10", ) diff --git a/pcweb/pages/landing/views/social_stats.py b/pcweb/pages/landing/views/social_stats.py index 752d9ca1a..969d772ac 100644 --- a/pcweb/pages/landing/views/social_stats.py +++ b/pcweb/pages/landing/views/social_stats.py @@ -7,8 +7,8 @@ def stat(icon: str, text: str) -> rx.Component: return rx.el.section( - get_icon(icon, class_name="text-primary-9"), - rx.el.span(text, class_name="font-medium text-sm text-slate-12"), + get_icon(icon, class_name="text-primary-9 [&_svg]:!size-5"), + rx.el.span(text, class_name="font-medium text-lg text-slate-12"), class_name="flex flex-row items-center gap-2", ) diff --git a/pcweb/pages/landing/views/video.py b/pcweb/pages/landing/views/video.py index 88f0e256f..d2fb9fa77 100644 --- a/pcweb/pages/landing/views/video.py +++ b/pcweb/pages/landing/views/video.py @@ -2,7 +2,7 @@ import reflex_ui as ui from pcweb.components.dialog import dialog -from pcweb.constants import DEMO_VIDEO_URL, REFLEX_BUILD_URL +from pcweb.constants import LAUNCH_VIDEO_URL, REFLEX_BUILD_URL def video_demo() -> rx.Component: @@ -14,12 +14,8 @@ def video_demo() -> rx.Component: class_name="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 scale-100 z-[2] group-hover:scale-110 transition-transform duration-300 backdrop rounded-full bg-slate-10 size-10 flex items-center justify-center", ), rx.image( - "/landing/video/dark/video_demo_dark.webp", - class_name="object-cover size-full dark:block hidden scale-110", - ), - rx.image( - "/landing/video/light/video_demo_light.webp", - class_name="object-cover size-full dark:hidden block scale-110", + "/landing/video/preview_video.webp", + class_name="object-cover size-full scale-110", ), rx.el.span( class_name="inset-0 size-full absolute z-[1] bg-[#00000008] backdrop-blur-[0.1px] rounded-lg", @@ -32,7 +28,7 @@ def video_demo() -> rx.Component: class_name="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-10 h-10 z-[-1] rounded-md", ), rx.video( - src=DEMO_VIDEO_URL, + src=LAUNCH_VIDEO_URL, playing=True, controls=False, class_name="size-full z-[1]", diff --git a/pcweb/pages/pricing/plan_cards.py b/pcweb/pages/pricing/plan_cards.py index fbd0ace14..491bdc7d8 100644 --- a/pcweb/pages/pricing/plan_cards.py +++ b/pcweb/pages/pricing/plan_cards.py @@ -24,7 +24,7 @@ class SelectedTier(TypedDict): class ProTierState(rx.State): - credits: rx.Field[int] = rx.field(default=PRO_TIERS_TABLE["Pro 50"]["credits"]) + credits: rx.Field[int] = rx.field(default=PRO_TIERS_TABLE["Pro 25"]["credits"]) @rx.event def redirect_to_billing(self, yearly: bool = False): @@ -42,7 +42,7 @@ def selected_tier(self) -> SelectedTier: for tier_name, tier_data in PRO_TIERS_TABLE.items(): if tier_data["credits"] == self.credits: return SelectedTier(tier=tier_name, price=tier_data["price"]) - return SelectedTier(tier="Pro 50", price=PRO_TIERS_TABLE["Pro 50"]["price"]) + return SelectedTier(tier="Pro 25", price=PRO_TIERS_TABLE["Pro 25"]["price"]) class Feature(NamedTuple):