badge docs (#1171)

* badge docs

* more badge content

* add docs to pricing cards

* add final pricing docs

---------

Co-authored-by: Tom Gotsman <[email protected]>

Author: tgberkeley

docs/hosting/reflex-branding.md

@@ -0,0 +1,24 @@
+```python exec
+from pcweb.pages.docs import hosting
+from pcweb.pages.pricing.pricing import pricing_path
+```
+
+# Reflex Branding
+
+Remove Reflex branding from your exported or deployed sites. 
+
+By default, Reflex branding, such as the "Made in Reflex" badge, will appear on all your published sites.
+
+
+## How to remove the Reflex branding from your app
+
+You can turn off the Reflex branding, when deploying to Reflex Cloud, by adding the `--badge` flag to the `reflex deploy` command. 
+
+In order for this to work a user hosting with Reflex Cloud must be logged in and on a [paid plan]({pricing_path}) (at least pro tier). 
+
+
+```md alert info
+# A paid plan is required to remove the Reflex branding.
+```
+
+If you are self-hosting check out these instructions on [how to remove the Reflex branding from your self-hosted app]({hosting.self_hosting.path}#remove-reflex-branding-from-your-self-hosted-app).

docs/hosting/self-hosting.md

@@ -2,6 +2,7 @@
 import reflex as rx
 
 from pcweb.pages.docs import getting_started
+from pcweb.pages.pricing.pricing import pricing_path
 ```
 
 # Self Hosting
@@ -118,3 +119,14 @@ Finally, you can start your Reflex container service as follows.
 ```bash
 docker run -d -p 3000:3000 -p 8000:8000 --name app reflex-project:latest
 ```
+
+
+## Remove Reflex branding from your self-hosted app
+
+To remove the Reflex branding, such as the "Made in Reflex" badge, from your self-hosted app, you must add the `--badge` flag to the export command `reflex export --badge` or the run command `reflex run --env prod --badge`. 
+
+
+
+```md alert info
+# A paid [team plan]({pricing_path}) is required to remove the Reflex branding for self-hosted apps.
+```

pcweb/components/docpage/sidebar/sidebar_items/learn.py

@@ -209,6 +209,7 @@ def get_sidebar_items_hosting():
                 hosting.secrets_environment_vars,
                 hosting.tokens,
                 hosting.custom_domains,
+                hosting.reflex_branding,
                 hosting.deploy_with_github_actions,
             ],
         ),

pcweb/pages/pricing/plan_cards.py

@@ -198,6 +198,10 @@ def popular_card(
                     rx.el.li(
                         rx.icon(feature[0], class_name="!text-violet-9", size=16),
                         feature[1],
+                        rx.tooltip(
+                            rx.icon("info", class_name="!text-slate-9", size=12),
+                            content=feature[2],
+                        ) if len(feature) == 3 else "",
                         class_name="text-sm font-medium text-slate-11 flex items-center gap-3",
                     )
                     for feature in features
@@ -249,6 +253,7 @@ def plan_cards() -> rx.Component:
                 ("clock", "30 days log retention"),
                 ("globe", "Multi-region"),
                 ("brush", "Custom domains"),
+                ("file-badge", "Remove Branding with Reflex Cloud", "Check out the Reflex Branding doc page to learn how to remove the 'Made in Reflex' badge from your app.")
             ],
             "Start with Pro plan",
             price="$20/mo + compute",
@@ -264,6 +269,7 @@ def plan_cards() -> rx.Component:
                 ("git-branch", "Create multiple projects"),
                 ("signal", "Full Website Analytics"),
                 ("lock-keyhole", "One Click Auth"),
+                ("file-badge", "Remove Branding for Self-Hosting", "Check out the Remove Reflex Branding section in the Self Hosting doc page to learn how to remove the 'Made in Reflex' badge from your app."),
                 ("circle-plus", "Everything in Pro"),
             ],
             "Contact sales",

pcweb/pages/pricing/pricing.py

@@ -10,8 +10,8 @@
 from pcweb.pages.pricing.calculator import calculator_section
 from pcweb.meta.meta import hosting_meta_tags
 
-
-@rx.page(route="/pricing", title="Reflex · Pricing", meta=hosting_meta_tags)
+pricing_path = "/pricing"
+@rx.page(route=pricing_path, title="Reflex · Pricing", meta=hosting_meta_tags)
 def pricing() -> rx.Component:
     """Get the Pricing landing page."""
     from pcweb.components.docpage.navbar import navbar

pcweb/pages/pricing/table.py

@@ -41,6 +41,10 @@
     ("Built-in Testing", False, False, True, True),
 ]
 
+REFLEX_BRANDING_SECTION = [
+    ("Remove Reflex Branding", "", "On Reflex Cloud", "Everywhere *", "Everywhere *"),
+]
+
 REFLEX_AI_SECTION = [
     ("Number of Generations", "5/month", "100/month/seat", "250/month/seat", "Custom"),
 ]
@@ -102,6 +106,9 @@
     ("Contact sales", "secondary", "!text-slate-11 !w-fit"),
 ]
 
+ASTERIX_SECTION = [
+    ("* Everywhere: This includes removing the 'Made in Reflex' badge for self hosted apps.", "", "", "", "")
+]
 
 def glow() -> rx.Component:
     return rx.table.row(
@@ -264,6 +271,7 @@ def table_body_oss() -> rx.Component:
                 create_checkmark_row(feature, checks)
                 for feature, *checks in FRAMEWORK_SECTION
             ],
+            *[create_table_row(row) for row in REFLEX_BRANDING_SECTION],
         ),
         rx.table.header(
             create_table_row_header("Database"),
@@ -292,6 +300,9 @@ def table_body_oss() -> rx.Component:
                 class_name="w-full [&>*:not(:first-child)]:text-center bg-slate-1 !py-[1.25rem] border-y border-slate-4 !h-[76px] relative",
             ),
         ),
+        create_table_body(
+            *[create_table_row(row) for row in ASTERIX_SECTION],
+        ),
         class_name="w-full overflow-x-auto max-w-[69.125rem] -mt-[2rem]",
     )