Skip to content

Commit 9fb8856

Browse files
LineIndentLineIndent
committed
more ui stuff
1 parent b0048b5 commit 9fb8856

File tree

1 file changed

+51
-12
lines changed

1 file changed

+51
-12
lines changed

‎pcweb/pages/affiliates/affiliates.py‎

Lines changed: 51 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,36 @@
33
from pcweb.components.button import button
44
from pcweb.templates.webpage import webpage
55

6+
numbers = {
7+
"1": """
8+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#000000" fill="none">
9+
<path d="M10.5 8.5L12.5 7V17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
10+
<path d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
11+
</svg>
12+
""",
13+
"2": """
14+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#000000" fill="none" class="text-purple-10">
15+
<path d="M9 10C9 8.34315 10.3431 7 12 7C13.6569 7 15 8.34315 15 10C15 12.0786 12.1196 13.9172 10.3503 14.8505C9.54685 15.2743 9 16.0917 9 17H15" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
16+
<path d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
17+
</svg>
18+
19+
""",
20+
"3": """
21+
22+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#000000" fill="none">
23+
<path d="M12.5 12H11.5M12.5 12C13.8807 12 15 10.8807 15 9.5C15 8.11929 13.8807 7 12.5 7H11.5C10.1193 7 9 8.11929 9 9.5M12.5 12C13.8807 12 15 13.1193 15 14.5C15 15.8807 13.8807 17 12.5 17H11.5C10.1193 17 9 15.8807 9 14.5" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
24+
<path d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
25+
</svg>
26+
""",
27+
"4": """
28+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#000000" fill="none">
29+
<path d="M15 7V12.5M15 12.5V17M15 12.5H9.43601C9.19521 12.5 9 12.3048 9 12.064C9 12.0216 9.00619 11.9794 9.01839 11.9387L10.5 7" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
30+
<path d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
31+
</svg>
32+
33+
""",
34+
}
35+
636

737
def affiliates_title():
838
return rx.box(
@@ -11,7 +41,7 @@ def affiliates_title():
1141
class_name="gradient-heading font-x-large lg:font-xxx-large text-start text-transparent lg:text-center",
1242
),
1343
rx.text(
14-
"Earn 50% of your referrals’ subscription revenue for their first six months—start earning today!",
44+
"Become a Reflex partner in under 5 minutes and start earning 50% of your referrals’ subscription revenue for their first six months—join today!",
1545
class_name="font-md text-balance text-slate-9",
1646
),
1747
class_name="section-header",
@@ -29,7 +59,7 @@ def feature_card(icon: str, title: str, description: str) -> rx.Component:
2959
rx.text(
3060
description, class_name="text-slate-9 font-medium text-sm text-start"
3161
),
32-
class_name="flex flex-col gap-2 w-[22rem] h-[9rem] px-8 py-6",
62+
class_name="flex flex-col gap-2 w-[22rem] h-[9rem] px-1 lg:px-8 py-6",
3363
),
3464
class_name="border-slate-3 border-b box-border",
3565
)
@@ -38,12 +68,21 @@ def feature_card(icon: str, title: str, description: str) -> rx.Component:
3868
def step_box(step_number: str) -> rx.Component:
3969
"""Helper function to create a step number box with consistent styling."""
4070
return rx.box(
41-
rx.text(
42-
f"Step {step_number}",
43-
class_name="text-md font-semibold text-center text-slate-10",
71+
rx.box(
72+
# rx.text(
73+
# f"Step {step_number}",
74+
# class_name="text-md text-center text-slate-10",
75+
# ),
76+
# rx.html(
77+
# numbers[step_number],
78+
# filter=rx.color_mode_cond("", "invert(0.85)"),
79+
# ),
80+
color=rx.color("accent", 5),
81+
class_name="w-full h-[5rem] flex items-center justify-center p-3 col-start-2 row-span-full row-start-1 bg-[size:10px_10px] bg-fixed bg-[image:repeating-linear-gradient(315deg,currentColor_0,currentColor_1px,_transparent_0,_transparent_50%)]",
4482
),
45-
color=rx.color("accent", 5),
46-
class_name="h-[5rem] flex items-center justify-center p-3 col-start-2 row-span-full row-start-1 bg-[size:10px_10px] bg-fixed bg-[image:repeating-linear-gradient(315deg,currentColor_0,currentColor_1px,_transparent_0,_transparent_50%)]",
83+
display=["none" if i <= 3 else "flex" for i in range(6)],
84+
color=rx.color("accent", 4),
85+
class_name="w-full h-[5rem] flex items-center justify-center py-3 col-start-2 row-span-full row-start-1 bg-[size:10px_10px] bg-fixed bg-[image:repeating-linear-gradient(-315deg,currentColor_0,currentColor_1px,_transparent_0,_transparent_50%)]",
4786
)
4887

4988

@@ -59,13 +98,13 @@ def features() -> rx.Component:
5998
# Left column with steps 2 and 4
6099
feature_card(
61100
"backend_db",
62-
"Submit Your Application",
101+
"1. Submit Your Application",
63102
"Provide your basic info to get a unique affiliate link.",
64103
),
65104
step_box("2"),
66105
feature_card(
67106
"infinity",
68-
"Track Your Referrals",
107+
"3. Track Your Referrals",
69108
"Log in to your Affiliate Dashboard to see clicks, sign‑ups, and revenue data.",
70109
),
71110
step_box("4"),
@@ -78,13 +117,13 @@ def features() -> rx.Component:
78117
step_box("1"),
79118
feature_card(
80119
"backend_auth",
81-
"Share Reflex",
120+
"2. Share Reflex",
82121
"Post your link anywhere—blog posts, social media, email newsletters, even your YouTube channel.",
83122
),
84123
step_box("3"),
85124
feature_card(
86125
"analytics",
87-
"Get Paid",
126+
"4. Get Paid",
88127
"We'll send you 50% of each referred user's subscription revenue for their first six months.",
89128
),
90129
class_name="flex flex-col -mt-[32px]",
@@ -97,7 +136,7 @@ def features() -> rx.Component:
97136
is_external=True,
98137
class_name="p-2 border border-slate-3 rounded-[1.375rem] border-solid lg:mt-0 mt-4",
99138
),
100-
class_name="flex flex-col justify-center items-center max-w-[64.19rem] lg:border-x border-slate-3 w-full mx-auto lg:pb-[5.5rem] pb-4 relative overflow-hidden pt-6",
139+
class_name="flex flex-col justify-center items-center max-w-[64.19rem] lg:border-x border-slate-3 w-full mx-auto lg:pb-[5.5rem] pb-4 relative overflow-hidden pt-10",
101140
)
102141

103142

0 commit comments

Comments
 (0)