ehsan-minadd/peikarband
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

[DESIGN-001] Update branding colors and focus on WordPress Cloud (feat)
Some checks failed
CD - Build & Deploy / build-and-push (push) Has been cancelled
Details
CD - Build & Deploy / package-helm (push) Has been cancelled
Details
CD - Build & Deploy / deploy-staging (push) Has been cancelled
Details
CD - Build & Deploy / deploy-production (push) Has been cancelled
Details
CD - Build & Deploy / release (push) Has been cancelled
Details
CI / test (3.11) (push) Has been cancelled
Details
CI / test (3.12) (push) Has been cancelled
Details
CI / security (push) Has been cancelled
Details

Browse Source 
- Applied brand colors from logo (Navy Blue, Teal, Cyan)
- Updated all color schemes across the site
- Focused content on WordPress Cloud hosting
- Removed cPanel references
- Updated service cards to highlight WordPress Cloud
- Added company logo to navbar
- Improved messaging and value propositions
This commit is contained in:
Ehsan.Asadi
2025-12-26 16:17:45 +03:30
parent c8c9b7a6eb
commit 167c25c943
7 changed files with 144 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
.gitignore vendored
View File

@@ -1,3 +1,7 @@
assets/external/
.states
.web
*.db
# Python # Python
__pycache__/ __pycache__/
*.py[cod] *.py[cod]

4
Makefile
View File

@@ -42,7 +42,7 @@ install:
pre-commit install pre-commit install
dev: dev:
python -m reflex run python33 -m reflex run
test: test:
pytest tests/ -v --cov=src --cov-report=html pytest tests/ -v --cov=src --cov-report=html
@@ -122,5 +122,5 @@ migrate:
alembic upgrade head alembic upgrade head
seed: seed:
python scripts/seed_database.py python3 scripts/seed_database.py

6
assets/custom.css
View File

@@ -13,9 +13,9 @@ body {
} }
@keyframes glow { @keyframes glow {
0% { box-shadow: 0 12px 40px rgba(30, 64, 175, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.2); } 0% { box-shadow: 0 12px 40px rgba(27, 75, 127, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.2); }
50% { box-shadow: 0 18px 50px rgba(30, 64, 175, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.3); } 50% { box-shadow: 0 18px 50px rgba(27, 75, 127, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.3); }
100% { box-shadow: 0 12px 40px rgba(30, 64, 175, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.2); } 100% { box-shadow: 0 12px 40px rgba(27, 75, 127, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.2); }
} }
@keyframes pulse { @keyframes pulse {

BIN
assets/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 796 KiB

BIN
logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 796 KiB

6
src/presentation/web/assets/custom.css
View File

@@ -13,9 +13,9 @@ body {
} }
@keyframes glow { @keyframes glow {
0% { box-shadow: 0 12px 40px rgba(30, 64, 175, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.2); } 0% { box-shadow: 0 12px 40px rgba(27, 75, 127, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.2); }
50% { box-shadow: 0 18px 50px rgba(30, 64, 175, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.3); } 50% { box-shadow: 0 18px 50px rgba(27, 75, 127, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.3); }
100% { box-shadow: 0 12px 40px rgba(30, 64, 175, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.2); } 100% { box-shadow: 0 12px 40px rgba(27, 75, 127, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.2); }
} }
@keyframes pulse { @keyframes pulse {

264
src/presentation/web/pages/landing/index.py
View File

@@ -11,9 +11,9 @@ def navbar() -> rx.Component:
return rx.box( return rx.box(
rx.hstack( rx.hstack(
rx.hstack( rx.hstack(
rx.image(src="https://i.imgur.com/YOUR_LOGO.png", width="45px", height="45px"), rx.image(src="/logo.png", width="50px", height="50px"),
rx.heading("پیکربند", size="7", rx.heading("پیکربند", size="7",
background="linear-gradient(135deg, #1e40af, #3b82f6, #06b6d4)", background="linear-gradient(135deg, #1B4B7F, #4DB8C4, #6DD7E5)",
background_clip="text", background_clip="text",
style={"-webkit-background-clip": "text", "-webkit-text-fill-color": "transparent"}, style={"-webkit-background-clip": "text", "-webkit-text-fill-color": "transparent"},
letter_spacing="1px", letter_spacing="1px",
@@ -23,11 +23,11 @@ def navbar() -> rx.Component:
), ),
rx.spacer(), rx.spacer(),
rx.hstack( rx.hstack(
rx.link("خدمات", href="#services", color="#E2E8F0", font_weight="600", font_size="16px", _hover={"color": "#22d3ee", "transform": "translateY(-2px)"}, transition="all 0.2s"), rx.link("خدمات", href="#services", color="#E2E8F0", font_weight="600", font_size="16px", _hover={"color": "#6DD7E5", "transform": "translateY(-2px)"}, transition="all 0.2s"),
rx.link("قیمت‌ها", href="#pricing", color="#E2E8F0", font_weight="600", font_size="16px", _hover={"color": "#22d3ee", "transform": "translateY(-2px)"}, transition="all 0.2s"), rx.link("قیمت‌ها", href="#pricing", color="#E2E8F0", font_weight="600", font_size="16px", _hover={"color": "#6DD7E5", "transform": "translateY(-2px)"}, transition="all 0.2s"),
rx.link("سرورها", href="#servers", color="#E2E8F0", font_weight="600", font_size="16px", _hover={"color": "#22d3ee", "transform": "translateY(-2px)"}, transition="all 0.2s"), rx.link("سرورها", href="#servers", color="#E2E8F0", font_weight="600", font_size="16px", _hover={"color": "#6DD7E5", "transform": "translateY(-2px)"}, transition="all 0.2s"),
rx.link("نظرات", href="#testimonials", color="#E2E8F0", font_weight="600", font_size="16px", _hover={"color": "#22d3ee", "transform": "translateY(-2px)"}, transition="all 0.2s"), rx.link("نظرات", href="#testimonials", color="#E2E8F0", font_weight="600", font_size="16px", _hover={"color": "#6DD7E5", "transform": "translateY(-2px)"}, transition="all 0.2s"),
rx.link("تماس", href="#contact", color="#E2E8F0", font_weight="600", font_size="16px", _hover={"color": "#22d3ee", "transform": "translateY(-2px)"}, transition="all 0.2s"), rx.link("تماس", href="#contact", color="#E2E8F0", font_weight="600", font_size="16px", _hover={"color": "#6DD7E5", "transform": "translateY(-2px)"}, transition="all 0.2s"),
rx.button( rx.button(
rx.hstack( rx.hstack(
rx.text("شروع رایگان", font_weight="800"), rx.text("شروع رایگان", font_weight="800"),
@@ -35,15 +35,15 @@ def navbar() -> rx.Component:
spacing="2", spacing="2",
align="center", align="center",
), ),
background="linear-gradient(135deg, #1e40af 0%, #3b82f6 50%, #06b6d4 100%)", background="linear-gradient(135deg, #1B4B7F 0%, #4DB8C4 50%, #6DD7E5 100%)",
color="white", color="white",
border_radius="full", border_radius="full",
padding="16px 36px", padding="16px 36px",
font_size="16px", font_size="16px",
box_shadow="0 12px 35px rgba(59, 130, 246, 0.7), 0 0 60px rgba(6, 182, 212, 0.3)", box_shadow="0 12px 35px rgba(77, 184, 196, 0.7), 0 0 60px rgba(109, 215, 229, 0.3)",
_hover={ _hover={
"transform": "translateY(-4px) scale(1.08)", "transform": "translateY(-4px) scale(1.08)",
"box_shadow": "0 18px 50px rgba(6, 182, 212, 0.9), 0 0 80px rgba(6, 182, 212, 0.5)" "box_shadow": "0 18px 50px rgba(109, 215, 229, 0.9), 0 0 80px rgba(109, 215, 229, 0.5)"
}, },
transition="all 0.4s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.4s cubic-bezier(0.4, 0, 0.2, 1)",
style={"animation": "glow 3s ease-in-out infinite"}, style={"animation": "glow 3s ease-in-out infinite"},
@@ -58,7 +58,7 @@ def navbar() -> rx.Component:
width="100%", width="100%",
backdrop_filter="blur(20px) saturate(180%)", backdrop_filter="blur(20px) saturate(180%)",
background="rgba(5, 10, 20, 0.92)", background="rgba(5, 10, 20, 0.92)",
border_bottom="1px solid rgba(6, 182, 212, 0.3)", border_bottom="1px solid rgba(109, 215, 229, 0.3)",
padding="20px 8%", padding="20px 8%",
z_index="1000", z_index="1000",
box_shadow="0 8px 32px rgba(0, 0, 0, 0.4)", box_shadow="0 8px 32px rgba(0, 0, 0, 0.4)",
@@ -87,7 +87,7 @@ def hero() -> rx.Component:
), ),
# rx.badge( # rx.badge(
# rx.hstack( # rx.hstack(
# rx.icon("sparkles", size=16, color="#06b6d4"), # rx.icon("sparkles", size=16, color="#6DD7E5"),
# rx.text("هاستینگ، دامین و DevOps", font_weight="600"), # rx.text("هاستینگ، دامین و DevOps", font_weight="600"),
# spacing="2", # spacing="2",
# align="center", # align="center",
@@ -95,16 +95,16 @@ def hero() -> rx.Component:
# variant="outline", # variant="outline",
# padding="12px 24px", # padding="12px 24px",
# border_radius="full", # border_radius="full",
# background="linear-gradient(135deg, rgba(59, 130, 246, 0.15), rgba(6, 182, 212, 0.15))", # background="linear-gradient(135deg, rgba(77, 184, 196, 0.15), rgba(109, 215, 229, 0.15))",
# border="2px solid rgba(59, 130, 246, 0.5)", # border="2px solid rgba(77, 184, 196, 0.5)",
# font_size="15px", # font_size="15px",
# box_shadow="0 8px 24px rgba(59, 130, 246, 0.3)", # box_shadow="0 8px 24px rgba(77, 184, 196, 0.3)",
# ), # ),
rx.heading( rx.heading(
"میزبانی وب و زیرساخت ابری ", "میزبانی وب و زیرساخت ابری ",
rx.el.span("حرفه‌ای", rx.el.span("حرفه‌ای",
style={ style={
"background": "linear-gradient(135deg, #1e40af, #3b82f6, #06b6d4, #22d3ee)", "background": "linear-gradient(135deg, #1B4B7F, #4DB8C4, #6DD7E5, #7CE3F2)",
"background-clip": "text", "background-clip": "text",
"-webkit-background-clip": "text", "-webkit-background-clip": "text",
"-webkit-text-fill-color": "transparent", "-webkit-text-fill-color": "transparent",
@@ -118,8 +118,8 @@ def hero() -> rx.Component:
margin_top="16px", margin_top="16px",
), ),
rx.text( rx.text(
"از هاست وردپرس تا سرورهای اختصاصی، دامین و خدمات DevOps, DataOps و MlOps.", "اولین و تخصصی‌ترین ارائه‌دهنده کلود اختصاصی وردپرس در ایران.",
rx.el.span(" برای حضور قدرتمند شما در اینترنت", style={"color": "#94A3B8"}), rx.el.span(" مدیریت پیشرفته و هوشمند سایت‌های وردپرسی شما", style={"color": "#94A3B8"}),
color="#E2E8F0", color="#E2E8F0",
font_size="23px", font_size="23px",
line_height="1.9", line_height="1.9",
@@ -137,14 +137,14 @@ def hero() -> rx.Component:
align="center", align="center",
), ),
size="4", size="4",
background="linear-gradient(135deg, #1e40af, #3b82f6, #06b6d4)", background="linear-gradient(135deg, #1B4B7F, #4DB8C4, #6DD7E5)",
color="white", color="white",
border_radius="16px", border_radius="16px",
padding="28px 56px", padding="28px 56px",
box_shadow="0 15px 50px rgba(30, 64, 175, 0.7), 0 0 80px rgba(6, 182, 212, 0.4), inset 0 2px 0 rgba(255, 255, 255, 0.3)", box_shadow="0 15px 50px rgba(27, 75, 127, 0.7), 0 0 80px rgba(109, 215, 229, 0.4), inset 0 2px 0 rgba(255, 255, 255, 0.3)",
_hover={ _hover={
"transform": "translateY(-6px) scale(1.03)", "transform": "translateY(-6px) scale(1.03)",
"box_shadow": "0 25px 70px rgba(30, 64, 175, 0.9), 0 0 120px rgba(6, 182, 212, 0.6)" "box_shadow": "0 25px 70px rgba(27, 75, 127, 0.9), 0 0 120px rgba(109, 215, 229, 0.6)"
}, },
transition="all 0.5s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.5s cubic-bezier(0.4, 0, 0.2, 1)",
style={"animation": "glow 4s ease-in-out infinite"}, style={"animation": "glow 4s ease-in-out infinite"},
@@ -158,18 +158,18 @@ def hero() -> rx.Component:
), ),
size="4", size="4",
variant="outline", variant="outline",
border="3px solid #1e40af", border="3px solid #1B4B7F",
color="white", color="white",
border_radius="16px", border_radius="16px",
padding="28px 56px", padding="28px 56px",
background="rgba(30, 64, 175, 0.08)", background="rgba(27, 75, 127, 0.08)",
backdrop_filter="blur(10px)", backdrop_filter="blur(10px)",
box_shadow="0 10px 40px rgba(30, 64, 175, 0.3)", box_shadow="0 10px 40px rgba(27, 75, 127, 0.3)",
_hover={ _hover={
"background": "rgba(30, 64, 175, 0.2)", "background": "rgba(27, 75, 127, 0.2)",
"transform": "translateY(-6px) scale(1.03)", "transform": "translateY(-6px) scale(1.03)",
"border": "3px solid #06b6d4", "border": "3px solid #6DD7E5",
"box_shadow": "0 20px 60px rgba(6, 182, 212, 0.5)" "box_shadow": "0 20px 60px rgba(109, 215, 229, 0.5)"
}, },
transition="all 0.5s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.5s cubic-bezier(0.4, 0, 0.2, 1)",
), ),
@@ -207,7 +207,7 @@ def hero() -> rx.Component:
src="https://illustrations.popsy.co/amber/web-design.svg", src="https://illustrations.popsy.co/amber/web-design.svg",
width="600px", width="600px",
height="auto", height="auto",
filter="drop-shadow(0 20px 60px rgba(30, 64, 175, 0.3))", filter="drop-shadow(0 20px 60px rgba(27, 75, 127, 0.3))",
), ),
display=["none", "none", "none", "block"], display=["none", "none", "none", "block"],
), ),
@@ -260,7 +260,7 @@ def wordpress_cloud_highlight() -> rx.Component:
text_align=["center", "center", "right"], text_align=["center", "center", "right"],
), ),
rx.text( rx.text(
"مدیریت پیشرفته و هوشمند وردپرس بر بستر کلود. با تکنولوژی‌های روز دنیا، سایت شما را به سطح بعدی می‌بریم", "با کلود اختصاصی وردپرس، سایت شما را با سرعت، امنیت و مدیریت هوشمند تجربه کنید. بدون نگرانی از فنی‌ها، فقط روی کسب‌وکارتان تمرکز کنید",
color="#CBD5E1", color="#CBD5E1",
font_size="20px", font_size="20px",
line_height="1.8", line_height="1.8",
@@ -311,10 +311,10 @@ def wordpress_cloud_highlight() -> rx.Component:
), ),
rx.hstack( rx.hstack(
rx.box( rx.box(
rx.icon("shield", size=24, color="#3b82f6"), rx.icon("shield", size=24, color="#4DB8C4"),
width="48px", width="48px",
height="48px", height="48px",
background="linear-gradient(135deg, rgba(59, 130, 246, 0.2), rgba(6, 182, 212, 0.2))", background="linear-gradient(135deg, rgba(77, 184, 196, 0.2), rgba(109, 215, 229, 0.2))",
border_radius="12px", border_radius="12px",
display="flex", display="flex",
align_items="center", align_items="center",
@@ -392,12 +392,12 @@ def wordpress_cloud_highlight() -> rx.Component:
spacing="2", spacing="2",
), ),
rx.vstack( rx.vstack(
rx.text("10x", font_size="36px", font_weight="900", color="#3b82f6", line_height="1"), rx.text("10x", font_size="36px", font_weight="900", color="#4DB8C4", line_height="1"),
rx.text("سریع‌تر", font_size="14px", color="#94A3B8", font_weight="600"), rx.text("سریع‌تر", font_size="14px", color="#94A3B8", font_weight="600"),
align="center", align="center",
padding="24px", padding="24px",
background="rgba(30, 30, 50, 0.8)", background="rgba(30, 30, 50, 0.8)",
border="2px solid rgba(59, 130, 246, 0.3)", border="2px solid rgba(77, 184, 196, 0.3)",
border_radius="20px", border_radius="20px",
spacing="2", spacing="2",
), ),
@@ -443,7 +443,7 @@ def about_card(icon: str, title: str, desc: str, gradient: str, glow_color: str)
rx.text(desc, color="#94A3B8", text_align="center", font_size="17px", line_height="1.7", font_weight="500"), rx.text(desc, color="#94A3B8", text_align="center", font_size="17px", line_height="1.7", font_weight="500"),
padding="60px 40px", padding="60px 40px",
background="linear-gradient(135deg, rgba(30, 30, 50, 0.9), rgba(20, 20, 40, 0.7))", background="linear-gradient(135deg, rgba(30, 30, 50, 0.9), rgba(20, 20, 40, 0.7))",
border="2px solid rgba(30, 64, 175, 0.3)", border="2px solid rgba(27, 75, 127, 0.3)",
border_radius="32px", border_radius="32px",
align="center", align="center",
min_height="420px", min_height="420px",
@@ -457,9 +457,9 @@ def about_section() -> rx.Component:
rx.vstack( rx.vstack(
rx.badge( rx.badge(
"✨ چرا ما؟", "✨ چرا ما؟",
background="linear-gradient(135deg, rgba(30, 64, 175, 0.2), rgba(59, 130, 246, 0.2))", background="linear-gradient(135deg, rgba(27, 75, 127, 0.2), rgba(77, 184, 196, 0.2))",
border="2px solid rgba(30, 64, 175, 0.4)", border="2px solid rgba(27, 75, 127, 0.4)",
color="#3b82f6", color="#4DB8C4",
font_weight="700", font_weight="700",
font_size="16px", font_size="16px",
padding="10px 24px", padding="10px 24px",
@@ -474,9 +474,9 @@ def about_section() -> rx.Component:
font_weight="500", font_weight="500",
), ),
rx.hstack( rx.hstack(
about_card("zap", "سرعت فوق‌العاده", "سرورهای بهینه‌شده با SSD NVMe و CDN جهانی برای بارگذاری آنی", "linear-gradient(135deg, #1e40af, #4F46E5)", "rgba(30, 64, 175, 0.5)"), about_card("zap", "سرعت فوق‌العاده", "سرورهای بهینه‌شده با SSD NVMe و CDN جهانی برای بارگذاری آنی", "linear-gradient(135deg, #1B4B7F, #4F46E5)", "rgba(27, 75, 127, 0.5)"),
about_card("clock", "پشتیبانی 24/7", "تیم پشتیبانی حرفه‌ای و با تجربه، آماده کمک در هر لحظه", "linear-gradient(135deg, #3b82f6, #7C3AED)", "rgba(59, 130, 246, 0.5)"), about_card("clock", "پشتیبانی 24/7", "تیم پشتیبانی حرفه‌ای و با تجربه، آماده کمک در هر لحظه", "linear-gradient(135deg, #4DB8C4, #7C3AED)", "rgba(77, 184, 196, 0.5)"),
about_card("shield-check", "امنیت پیشرفته", "SSL رایگان، بکاپ اتوماتیک روزانه و محافظت DDoS", "linear-gradient(135deg, #06b6d4, #9333EA)", "rgba(6, 182, 212, 0.5)"), about_card("shield-check", "امنیت پیشرفته", "SSL رایگان، بکاپ اتوماتیک روزانه و محافظت DDoS", "linear-gradient(135deg, #6DD7E5, #9333EA)", "rgba(109, 215, 229, 0.5)"),
spacing="9", spacing="9",
width="100%", width="100%",
), ),
@@ -515,7 +515,7 @@ def service_card(title: str, desc: str, icon: str, features: list, color: str) -
), ),
padding="48px 40px", padding="48px 40px",
background="linear-gradient(135deg, rgba(30, 30, 50, 0.95), rgba(20, 20, 40, 0.8))", background="linear-gradient(135deg, rgba(30, 30, 50, 0.95), rgba(20, 20, 40, 0.8))",
border="2px solid rgba(30, 64, 175, 0.25)", border="2px solid rgba(27, 75, 127, 0.25)",
border_radius="32px", border_radius="32px",
align="center", align="center",
min_height="520px", min_height="520px",
@@ -533,9 +533,9 @@ def services_section() -> rx.Component:
rx.vstack( rx.vstack(
rx.badge( rx.badge(
"🚀 خدمات ما", "🚀 خدمات ما",
background="linear-gradient(135deg, rgba(59, 130, 246, 0.2), rgba(6, 182, 212, 0.2))", background="linear-gradient(135deg, rgba(77, 184, 196, 0.2), rgba(109, 215, 229, 0.2))",
border="2px solid rgba(59, 130, 246, 0.4)", border="2px solid rgba(77, 184, 196, 0.4)",
color="#06b6d4", color="#6DD7E5",
font_weight="700", font_weight="700",
font_size="16px", font_size="16px",
padding="10px 24px", padding="10px 24px",
@@ -550,12 +550,12 @@ def services_section() -> rx.Component:
font_weight="500", font_weight="500",
), ),
rx.grid( rx.grid(
service_card("هاستینگ وردپرس", "میزبانی بهینه‌شده وردپرس با کنترل پنل cPanel", "globe", ["نصب خودکار وردپرس", "SSL رایگان", "بکاپ روزانه", "پشتیبانی فنی"], "#1e40af"), service_card("وردپرس کلود", "کلود اختصاصی وردپرس با مدیریت هوشمند و پیشرفته", "cloud", ["نصب خودکار وردپرس", "مدیریت چند سایتی", "بکاپ اتوماتیک", "SSL رایگان", "بهینه‌سازی خودکار"], "#1B4B7F"),
service_card("فروش دامین", "ثبت دامین‌های بین‌المللی و ایرانی", "tag", [".com, .ir, .net و...", "قیمت‌های رقابتی", "تحویل فوری", "مدیریت DNS"], "#3b82f6"), service_card("سرورهای ابری", "سرورهای اختصاصی از بهترین دیتاسنترهای دنیا", "server", ["DigitalOcean", "Hetzner", "AWS", "Google Cloud"], "#4DB8C4"),
service_card("سرور اختصاصی", "VPS و Dedicated Server از بهترین دیتاسنترها", "server", ["DigitalOcean", "Hetzner", "OVH", "Hostinger"], "#06b6d4"), service_card("مهاجرت به کلود", "انتقال سایت وردپرسی شما به کلود اختصاصی", "cloud-upload", ["مهاجرت بدون توقف", "تست قبل از انتقال", "بهینه‌سازی کامل", "مشاوره رایگان"], "#6DD7E5"),
service_card("DevOps & CI/CD", "اتوماسیون و مدیریت زیرساخت", "code", ["Kubernetes", "Docker", "GitLab/GitHub CI", "Terraform"], "#1e40af"), service_card("DevOps حرفه‌ای", "اتوماسیون و مدیریت زیرساخت کلود", "code", ["Kubernetes", "Docker", "CI/CD Pipeline", "Infrastructure as Code"], "#1B4B7F"),
service_card("انتقال به کلود", "مهاجرت سایت به محیط ابری", "cloud-upload", ["AWS Migration", "Google Cloud", "Azure", "مشاوره رایگان"], "#3b82f6"), service_card("فروش دامین", "ثبت دامین‌های بین‌المللی و ایرانی", "tag", [".com, .ir, .net", "قیمت رقابتی", "تحویل فوری", "مدیریت DNS"], "#4DB8C4"),
service_card("مشاوره فنی", "راهنمایی و طراحی معماری", "settings", ["بررسی زیرساخت", "بهینه‌سازی", "امن‌سازی", "پشتیبانی مداوم"], "#06b6d4"), service_card("پشتیبانی 24/7", "پشتیبانی تخصصی وردپرس و سرور", "headset", ["تیم متخصص", "پاسخگویی سریع", "مشاوره رایگان", "پشتیبانی فارسی"], "#6DD7E5"),
columns="3", columns="3",
spacing="9", spacing="9",
width="100%", width="100%",
@@ -568,13 +568,13 @@ def services_section() -> rx.Component:
id="services", id="services",
) )
def pricing_card(name: str, price: str, features: list, popular: bool = False, badge_color: str = "#1e40af") -> rx.Component: def pricing_card(name: str, price: str, features: list, popular: bool = False, badge_color: str = "#1B4B7F") -> rx.Component:
return rx.vstack( return rx.vstack(
rx.cond( rx.cond(
popular, popular,
rx.badge( rx.badge(
"⭐ محبوب‌ترین", "⭐ محبوب‌ترین",
background="linear-gradient(135deg, #1e40af, #3b82f6)", background="linear-gradient(135deg, #1B4B7F, #4DB8C4)",
color="white", color="white",
padding="10px 24px", padding="10px 24px",
border_radius="full", border_radius="full",
@@ -582,7 +582,7 @@ def pricing_card(name: str, price: str, features: list, popular: bool = False, b
font_size="15px", font_size="15px",
position="absolute", position="absolute",
top="-18px", top="-18px",
box_shadow="0 8px 30px rgba(30, 64, 175, 0.7)", box_shadow="0 8px 30px rgba(27, 75, 127, 0.7)",
), ),
rx.box(), rx.box(),
), ),
@@ -593,7 +593,7 @@ def pricing_card(name: str, price: str, features: list, popular: bool = False, b
align="baseline", align="baseline",
spacing="3", spacing="3",
), ),
rx.divider(background="rgba(30, 64, 175, 0.3)", margin_y="32px"), rx.divider(background="rgba(27, 75, 127, 0.3)", margin_y="32px"),
rx.vstack( rx.vstack(
*[rx.hstack( *[rx.hstack(
rx.icon("check", size=24, color="#10B981"), rx.icon("check", size=24, color="#10B981"),
@@ -610,24 +610,24 @@ def pricing_card(name: str, price: str, features: list, popular: bool = False, b
"انتخاب پلن", "انتخاب پلن",
width="100%", width="100%",
padding="20px", padding="20px",
background="linear-gradient(135deg, #1e40af, #3b82f6)" if popular else "transparent", background="linear-gradient(135deg, #1B4B7F, #4DB8C4)" if popular else "transparent",
border="2.5px solid #1e40af" if not popular else "none", border="2.5px solid #1B4B7F" if not popular else "none",
color="white", color="white",
border_radius="16px", border_radius="16px",
font_weight="800", font_weight="800",
font_size="18px", font_size="18px",
box_shadow="0 10px 35px rgba(30, 64, 175, 0.6)" if popular else "none", box_shadow="0 10px 35px rgba(27, 75, 127, 0.6)" if popular else "none",
_hover={"transform": "translateY(-4px)", "box_shadow": "0 15px 50px rgba(30, 64, 175, 0.8)"}, _hover={"transform": "translateY(-4px)", "box_shadow": "0 15px 50px rgba(27, 75, 127, 0.8)"},
transition="all 0.4s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.4s cubic-bezier(0.4, 0, 0.2, 1)",
), ),
padding="56px 48px", padding="56px 48px",
background="linear-gradient(135deg, rgba(30, 64, 175, 0.3), rgba(59, 130, 246, 0.3))" if popular else "linear-gradient(135deg, rgba(30, 30, 50, 0.95), rgba(20, 20, 40, 0.8))", background="linear-gradient(135deg, rgba(27, 75, 127, 0.3), rgba(77, 184, 196, 0.3))" if popular else "linear-gradient(135deg, rgba(30, 30, 50, 0.95), rgba(20, 20, 40, 0.8))",
border=f"3px solid #3b82f6" if popular else "2px solid rgba(30, 64, 175, 0.3)", border=f"3px solid #4DB8C4" if popular else "2px solid rgba(27, 75, 127, 0.3)",
border_radius="32px", border_radius="32px",
position="relative", position="relative",
min_height="620px", min_height="620px",
box_shadow="0 25px 80px rgba(30, 64, 175, 0.5)" if popular else "0 15px 50px rgba(0, 0, 0, 0.4)", box_shadow="0 25px 80px rgba(27, 75, 127, 0.5)" if popular else "0 15px 50px rgba(0, 0, 0, 0.4)",
_hover={"transform": "translateY(-16px) scale(1.04)", "box_shadow": "0 35px 100px rgba(30, 64, 175, 0.7)"}, _hover={"transform": "translateY(-16px) scale(1.04)", "box_shadow": "0 35px 100px rgba(27, 75, 127, 0.7)"},
transition="all 0.5s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.5s cubic-bezier(0.4, 0, 0.2, 1)",
align="center", align="center",
) )
@@ -637,9 +637,9 @@ def pricing_section() -> rx.Component:
rx.vstack( rx.vstack(
rx.badge( rx.badge(
"💎 پلن‌های قیمتی", "💎 پلن‌های قیمتی",
background="linear-gradient(135deg, rgba(30, 64, 175, 0.2), rgba(59, 130, 246, 0.2))", background="linear-gradient(135deg, rgba(27, 75, 127, 0.2), rgba(77, 184, 196, 0.2))",
border="2px solid rgba(30, 64, 175, 0.4)", border="2px solid rgba(27, 75, 127, 0.4)",
color="#1e40af", color="#1B4B7F",
font_weight="700", font_weight="700",
font_size="16px", font_size="16px",
padding="10px 24px", padding="10px 24px",
@@ -674,7 +674,7 @@ def server_table_row(provider: str, price: str, cpu: str, ram: str, location: st
align="center", align="center",
) )
), ),
rx.table.cell(rx.text(price, color="#3b82f6", font_weight="700", font_size="17px")), rx.table.cell(rx.text(price, color="#4DB8C4", font_weight="700", font_size="17px")),
rx.table.cell(rx.text(cpu, font_weight="600", font_size="16px")), rx.table.cell(rx.text(cpu, font_weight="600", font_size="16px")),
rx.table.cell(rx.text(ram, font_weight="600", font_size="16px")), rx.table.cell(rx.text(ram, font_weight="600", font_size="16px")),
rx.table.cell(rx.text(location, color="#94A3B8", font_weight="600")), rx.table.cell(rx.text(location, color="#94A3B8", font_weight="600")),
@@ -682,11 +682,11 @@ def server_table_row(provider: str, price: str, cpu: str, ram: str, location: st
rx.button( rx.button(
"سفارش", "سفارش",
size="3", size="3",
background="linear-gradient(135deg, #1e40af, #3b82f6)", background="linear-gradient(135deg, #1B4B7F, #4DB8C4)",
color="white", color="white",
border_radius="10px", border_radius="10px",
font_weight="700", font_weight="700",
_hover={"transform": "scale(1.08)", "box_shadow": "0 8px 25px rgba(30, 64, 175, 0.6)"}, _hover={"transform": "scale(1.08)", "box_shadow": "0 8px 25px rgba(27, 75, 127, 0.6)"},
transition="all 0.3s", transition="all 0.3s",
) )
), ),
@@ -697,9 +697,9 @@ def server_comparison() -> rx.Component:
rx.vstack( rx.vstack(
rx.badge( rx.badge(
"🌐 ارائه‌دهندگان", "🌐 ارائه‌دهندگان",
background="linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(59, 130, 246, 0.2))", background="linear-gradient(135deg, rgba(109, 215, 229, 0.2), rgba(77, 184, 196, 0.2))",
border="2px solid rgba(6, 182, 212, 0.4)", border="2px solid rgba(109, 215, 229, 0.4)",
color="#06b6d4", color="#6DD7E5",
font_weight="700", font_weight="700",
font_size="16px", font_size="16px",
padding="10px 24px", padding="10px 24px",
@@ -711,12 +711,12 @@ def server_comparison() -> rx.Component:
rx.table.root( rx.table.root(
rx.table.header( rx.table.header(
rx.table.row( rx.table.row(
rx.table.column_header_cell("ارائه‌دهنده", color="#3b82f6", font_weight="800", font_size="17px"), rx.table.column_header_cell("ارائه‌دهنده", color="#4DB8C4", font_weight="800", font_size="17px"),
rx.table.column_header_cell("قیمت", color="#3b82f6", font_weight="800", font_size="17px"), rx.table.column_header_cell("قیمت", color="#4DB8C4", font_weight="800", font_size="17px"),
rx.table.column_header_cell("CPU", color="#3b82f6", font_weight="800", font_size="17px"), rx.table.column_header_cell("CPU", color="#4DB8C4", font_weight="800", font_size="17px"),
rx.table.column_header_cell("RAM", color="#3b82f6", font_weight="800", font_size="17px"), rx.table.column_header_cell("RAM", color="#4DB8C4", font_weight="800", font_size="17px"),
rx.table.column_header_cell("مکان", color="#3b82f6", font_weight="800", font_size="17px"), rx.table.column_header_cell("مکان", color="#4DB8C4", font_weight="800", font_size="17px"),
rx.table.column_header_cell("", color="#3b82f6", font_weight="800"), rx.table.column_header_cell("", color="#4DB8C4", font_weight="800"),
), ),
), ),
rx.table.body( rx.table.body(
@@ -730,11 +730,11 @@ def server_comparison() -> rx.Component:
width="100%", width="100%",
), ),
background="linear-gradient(135deg, rgba(30, 30, 50, 0.9), rgba(20, 20, 40, 0.7))", background="linear-gradient(135deg, rgba(30, 30, 50, 0.9), rgba(20, 20, 40, 0.7))",
border="2px solid rgba(30, 64, 175, 0.3)", border="2px solid rgba(27, 75, 127, 0.3)",
border_radius="28px", border_radius="28px",
padding="40px", padding="40px",
box_shadow="0 20px 70px rgba(0, 0, 0, 0.6)", box_shadow="0 20px 70px rgba(0, 0, 0, 0.6)",
_hover={"box_shadow": "0 25px 90px rgba(30, 64, 175, 0.3)"}, _hover={"box_shadow": "0 25px 90px rgba(27, 75, 127, 0.3)"},
transition="all 0.4s", transition="all 0.4s",
), ),
max_width="1500px", max_width="1500px",
@@ -757,7 +757,7 @@ def testimonial_card(name: str, role: str, text: str, initial: str, gradient: st
display="flex", display="flex",
align_items="center", align_items="center",
justify_content="center", justify_content="center",
box_shadow="0 12px 40px rgba(30, 64, 175, 0.6)", box_shadow="0 12px 40px rgba(27, 75, 127, 0.6)",
), ),
rx.vstack( rx.vstack(
rx.text(name, font_weight="800", color="white", font_size="20px"), rx.text(name, font_weight="800", color="white", font_size="20px"),
@@ -777,12 +777,12 @@ def testimonial_card(name: str, role: str, text: str, initial: str, gradient: st
rx.text(text, color="#CBD5E1", line_height="1.8", font_size="17px", font_weight="500"), rx.text(text, color="#CBD5E1", line_height="1.8", font_size="17px", font_weight="500"),
padding="48px", padding="48px",
background="linear-gradient(135deg, rgba(30, 30, 50, 0.95), rgba(20, 20, 40, 0.8))", background="linear-gradient(135deg, rgba(30, 30, 50, 0.95), rgba(20, 20, 40, 0.8))",
border="2px solid rgba(30, 64, 175, 0.25)", border="2px solid rgba(27, 75, 127, 0.25)",
border_radius="28px", border_radius="28px",
align="start", align="start",
min_height="320px", min_height="320px",
box_shadow="0 15px 50px rgba(0, 0, 0, 0.5)", box_shadow="0 15px 50px rgba(0, 0, 0, 0.5)",
_hover={"transform": "translateY(-10px) scale(1.02)", "border": "2px solid #1e40af", "box_shadow": "0 25px 70px rgba(30, 64, 175, 0.5)"}, _hover={"transform": "translateY(-10px) scale(1.02)", "border": "2px solid #1B4B7F", "box_shadow": "0 25px 70px rgba(27, 75, 127, 0.5)"},
transition="all 0.5s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.5s cubic-bezier(0.4, 0, 0.2, 1)",
) )
@@ -791,9 +791,9 @@ def testimonials_section() -> rx.Component:
rx.vstack( rx.vstack(
rx.badge( rx.badge(
"💬 نظرات مشتریان", "💬 نظرات مشتریان",
background="linear-gradient(135deg, rgba(30, 64, 175, 0.2), rgba(59, 130, 246, 0.2))", background="linear-gradient(135deg, rgba(27, 75, 127, 0.2), rgba(77, 184, 196, 0.2))",
border="2px solid rgba(30, 64, 175, 0.4)", border="2px solid rgba(27, 75, 127, 0.4)",
color="#1e40af", color="#1B4B7F",
font_weight="700", font_weight="700",
font_size="16px", font_size="16px",
padding="10px 24px", padding="10px 24px",
@@ -807,21 +807,21 @@ def testimonials_section() -> rx.Component:
"مدیر فنی شرکت آریا", "مدیر فنی شرکت آریا",
"سرویس عالی با پشتیبانی فوق‌العاده. مهاجرت سایتمان به VPS خیلی روان انجام شد. کاملا راضی هستیم.", "سرویس عالی با پشتیبانی فوق‌العاده. مهاجرت سایتمان به VPS خیلی روان انجام شد. کاملا راضی هستیم.",
"A", "A",
"linear-gradient(135deg, #1e40af, #4F46E5)" "linear-gradient(135deg, #1B4B7F, #4F46E5)"
), ),
testimonial_card( testimonial_card(
"مریم حسینی", "مریم حسینی",
"مدیر محصول فروشگاه آنلاین", "مدیر محصول فروشگاه آنلاین",
"هاست وردپرسمون خیلی سریع شد. تیم پشتیبانی هم خیلی دلسوز و حرفه‌ای هستند. پیشنهاد می‌کنم.", "هاست وردپرسمون خیلی سریع شد. تیم پشتیبانی هم خیلی دلسوز و حرفه‌ای هستند. پیشنهاد می‌کنم.",
"M", "M",
"linear-gradient(135deg, #3b82f6, #7C3AED)" "linear-gradient(135deg, #4DB8C4, #7C3AED)"
), ),
testimonial_card( testimonial_card(
"رضا کریمی", "رضا کریمی",
"توسعه‌دهنده نرم‌افزار", "توسعه‌دهنده نرم‌افزار",
"خدمات DevOps و راه‌اندازی CI/CD عالی بود. تیم خیلی با تجربه و کارشناس هستند. ممنونم.", "خدمات DevOps و راه‌اندازی CI/CD عالی بود. تیم خیلی با تجربه و کارشناس هستند. ممنونم.",
"R", "R",
"linear-gradient(135deg, #06b6d4, #9333EA)" "linear-gradient(135deg, #6DD7E5, #9333EA)"
), ),
spacing="9", spacing="9",
width="100%", width="100%",
@@ -840,9 +840,9 @@ def contact_section() -> rx.Component:
rx.vstack( rx.vstack(
rx.badge( rx.badge(
"📞 تماس با ما", "📞 تماس با ما",
background="linear-gradient(135deg, rgba(59, 130, 246, 0.2), rgba(6, 182, 212, 0.2))", background="linear-gradient(135deg, rgba(77, 184, 196, 0.2), rgba(109, 215, 229, 0.2))",
border="2px solid rgba(59, 130, 246, 0.4)", border="2px solid rgba(77, 184, 196, 0.4)",
color="#3b82f6", color="#4DB8C4",
font_weight="700", font_weight="700",
font_size="16px", font_size="16px",
padding="10px 24px", padding="10px 24px",
@@ -861,12 +861,12 @@ def contact_section() -> rx.Component:
width="100%", width="100%",
padding="18px", padding="18px",
background="rgba(30, 30, 50, 0.8)", background="rgba(30, 30, 50, 0.8)",
border="2px solid rgba(30, 64, 175, 0.3)", border="2px solid rgba(27, 75, 127, 0.3)",
border_radius="14px", border_radius="14px",
color="white", color="white",
font_size="17px", font_size="17px",
font_weight="600", font_weight="600",
_focus={"border": "2px solid #1e40af", "box_shadow": "0 0 0 3px rgba(30, 64, 175, 0.2)"}, _focus={"border": "2px solid #1B4B7F", "box_shadow": "0 0 0 3px rgba(27, 75, 127, 0.2)"},
), ),
rx.input( rx.input(
placeholder="ایمیل", placeholder="ایمیل",
@@ -876,12 +876,12 @@ def contact_section() -> rx.Component:
width="100%", width="100%",
padding="18px", padding="18px",
background="rgba(30, 30, 50, 0.8)", background="rgba(30, 30, 50, 0.8)",
border="2px solid rgba(30, 64, 175, 0.3)", border="2px solid rgba(27, 75, 127, 0.3)",
border_radius="14px", border_radius="14px",
color="white", color="white",
font_size="17px", font_size="17px",
font_weight="600", font_weight="600",
_focus={"border": "2px solid #1e40af", "box_shadow": "0 0 0 3px rgba(30, 64, 175, 0.2)"}, _focus={"border": "2px solid #1B4B7F", "box_shadow": "0 0 0 3px rgba(27, 75, 127, 0.2)"},
), ),
rx.select( rx.select(
["هاست وردپرس", "دامین", "سرور اختصاصی", "DevOps", "مشاوره", "سایر"], ["هاست وردپرس", "دامین", "سرور اختصاصی", "DevOps", "مشاوره", "سایر"],
@@ -898,12 +898,12 @@ def contact_section() -> rx.Component:
min_height="160px", min_height="160px",
padding="18px", padding="18px",
background="rgba(30, 30, 50, 0.8)", background="rgba(30, 30, 50, 0.8)",
border="2px solid rgba(30, 64, 175, 0.3)", border="2px solid rgba(27, 75, 127, 0.3)",
border_radius="14px", border_radius="14px",
color="white", color="white",
font_size="17px", font_size="17px",
font_weight="600", font_weight="600",
_focus={"border": "2px solid #1e40af", "box_shadow": "0 0 0 3px rgba(30, 64, 175, 0.2)"}, _focus={"border": "2px solid #1B4B7F", "box_shadow": "0 0 0 3px rgba(27, 75, 127, 0.2)"},
), ),
rx.button( rx.button(
rx.hstack( rx.hstack(
@@ -915,11 +915,11 @@ def contact_section() -> rx.Component:
type="submit", type="submit",
width="100%", width="100%",
padding="22px", padding="22px",
background="linear-gradient(135deg, #1e40af, #3b82f6)", background="linear-gradient(135deg, #1B4B7F, #4DB8C4)",
color="white", color="white",
border_radius="16px", border_radius="16px",
box_shadow="0 12px 40px rgba(30, 64, 175, 0.6)", box_shadow="0 12px 40px rgba(27, 75, 127, 0.6)",
_hover={"transform": "translateY(-4px)", "box_shadow": "0 18px 60px rgba(30, 64, 175, 0.8)"}, _hover={"transform": "translateY(-4px)", "box_shadow": "0 18px 60px rgba(27, 75, 127, 0.8)"},
transition="all 0.4s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.4s cubic-bezier(0.4, 0, 0.2, 1)",
), ),
spacing="7", spacing="7",
@@ -936,24 +936,24 @@ def contact_section() -> rx.Component:
rx.icon("mail", size=44, color="white"), rx.icon("mail", size=44, color="white"),
width="80px", width="80px",
height="80px", height="80px",
background="linear-gradient(135deg, #1e40af, #4F46E5)", background="linear-gradient(135deg, #1B4B7F, #4F46E5)",
border_radius="20px", border_radius="20px",
display="flex", display="flex",
align_items="center", align_items="center",
justify_content="center", justify_content="center",
margin_bottom="24px", margin_bottom="24px",
box_shadow="0 12px 40px rgba(30, 64, 175, 0.6)", box_shadow="0 12px 40px rgba(27, 75, 127, 0.6)",
), ),
rx.heading("ایمیل", size="6", font_weight="800"), rx.heading("ایمیل", size="6", font_weight="800"),
rx.text("info@peikarband.ir", color="#3b82f6", font_size="18px", font_weight="700"), rx.text("info@peikarband.ir", color="#4DB8C4", font_size="18px", font_weight="700"),
rx.text("پاسخ در کمتر از ۲ ساعت", font_size="15px", color="#64748B", font_weight="600"), rx.text("پاسخ در کمتر از ۲ ساعت", font_size="15px", color="#64748B", font_weight="600"),
padding="40px", padding="40px",
background="linear-gradient(135deg, rgba(30, 30, 50, 0.9), rgba(20, 20, 40, 0.7))", background="linear-gradient(135deg, rgba(30, 30, 50, 0.9), rgba(20, 20, 40, 0.7))",
border="2px solid rgba(30, 64, 175, 0.3)", border="2px solid rgba(27, 75, 127, 0.3)",
border_radius="24px", border_radius="24px",
align="center", align="center",
width="100%", width="100%",
_hover={"border": "2px solid #1e40af", "transform": "translateY(-8px)", "box_shadow": "0 20px 60px rgba(30, 64, 175, 0.4)"}, _hover={"border": "2px solid #1B4B7F", "transform": "translateY(-8px)", "box_shadow": "0 20px 60px rgba(27, 75, 127, 0.4)"},
transition="all 0.4s", transition="all 0.4s",
), ),
rx.vstack( rx.vstack(
@@ -961,24 +961,24 @@ def contact_section() -> rx.Component:
rx.icon("message-circle", size=44, color="white"), rx.icon("message-circle", size=44, color="white"),
width="80px", width="80px",
height="80px", height="80px",
background="linear-gradient(135deg, #3b82f6, #7C3AED)", background="linear-gradient(135deg, #4DB8C4, #7C3AED)",
border_radius="20px", border_radius="20px",
display="flex", display="flex",
align_items="center", align_items="center",
justify_content="center", justify_content="center",
margin_bottom="24px", margin_bottom="24px",
box_shadow="0 12px 40px rgba(59, 130, 246, 0.6)", box_shadow="0 12px 40px rgba(77, 184, 196, 0.6)",
), ),
rx.heading("تلگرام", size="6", font_weight="800"), rx.heading("تلگرام", size="6", font_weight="800"),
rx.text("@peikarband", color="#06b6d4", font_size="18px", font_weight="700"), rx.text("@peikarband", color="#6DD7E5", font_size="18px", font_weight="700"),
rx.text("پشتیبانی آنلاین", font_size="15px", color="#64748B", font_weight="600"), rx.text("پشتیبانی آنلاین", font_size="15px", color="#64748B", font_weight="600"),
padding="40px", padding="40px",
background="linear-gradient(135deg, rgba(30, 30, 50, 0.9), rgba(20, 20, 40, 0.7))", background="linear-gradient(135deg, rgba(30, 30, 50, 0.9), rgba(20, 20, 40, 0.7))",
border="2px solid rgba(59, 130, 246, 0.3)", border="2px solid rgba(77, 184, 196, 0.3)",
border_radius="24px", border_radius="24px",
align="center", align="center",
width="100%", width="100%",
_hover={"border": "2px solid #3b82f6", "transform": "translateY(-8px)", "box_shadow": "0 20px 60px rgba(59, 130, 246, 0.4)"}, _hover={"border": "2px solid #4DB8C4", "transform": "translateY(-8px)", "box_shadow": "0 20px 60px rgba(77, 184, 196, 0.4)"},
transition="all 0.4s", transition="all 0.4s",
), ),
rx.vstack( rx.vstack(
@@ -986,24 +986,24 @@ def contact_section() -> rx.Component:
rx.icon("phone", size=44, color="white"), rx.icon("phone", size=44, color="white"),
width="80px", width="80px",
height="80px", height="80px",
background="linear-gradient(135deg, #06b6d4, #9333EA)", background="linear-gradient(135deg, #6DD7E5, #9333EA)",
border_radius="20px", border_radius="20px",
display="flex", display="flex",
align_items="center", align_items="center",
justify_content="center", justify_content="center",
margin_bottom="24px", margin_bottom="24px",
box_shadow="0 12px 40px rgba(6, 182, 212, 0.6)", box_shadow="0 12px 40px rgba(109, 215, 229, 0.6)",
), ),
rx.heading("تلفن", size="6", font_weight="800"), rx.heading("تلفن", size="6", font_weight="800"),
rx.text("۰۲۱-۱۲۳۴۵۶۷۸", color="#22d3ee", font_size="18px", font_weight="700"), rx.text("۰۲۱-۱۲۳۴۵۶۷۸", color="#7CE3F2", font_size="18px", font_weight="700"),
rx.text("شنبه تا پنجشنبه ۹-۱۸", font_size="15px", color="#64748B", font_weight="600"), rx.text("شنبه تا پنجشنبه ۹-۱۸", font_size="15px", color="#64748B", font_weight="600"),
padding="40px", padding="40px",
background="linear-gradient(135deg, rgba(30, 30, 50, 0.9), rgba(20, 20, 40, 0.7))", background="linear-gradient(135deg, rgba(30, 30, 50, 0.9), rgba(20, 20, 40, 0.7))",
border="2px solid rgba(6, 182, 212, 0.3)", border="2px solid rgba(109, 215, 229, 0.3)",
border_radius="24px", border_radius="24px",
align="center", align="center",
width="100%", width="100%",
_hover={"border": "2px solid #06b6d4", "transform": "translateY(-8px)", "box_shadow": "0 20px 60px rgba(6, 182, 212, 0.4)"}, _hover={"border": "2px solid #6DD7E5", "transform": "translateY(-8px)", "box_shadow": "0 20px 60px rgba(109, 215, 229, 0.4)"},
transition="all 0.4s", transition="all 0.4s",
), ),
spacing="7", spacing="7",
@@ -1023,12 +1023,12 @@ def contact_section() -> rx.Component:
def footer() -> rx.Component: def footer() -> rx.Component:
return rx.box( return rx.box(
rx.vstack( rx.vstack(
rx.divider(background="rgba(30, 64, 175, 0.4)", margin_y="10"), rx.divider(background="rgba(27, 75, 127, 0.4)", margin_y="10"),
rx.hstack( rx.hstack(
rx.vstack( rx.vstack(
rx.hstack( rx.hstack(
rx.icon("cloud", size=32, color="#3b82f6"), rx.icon("cloud", size=32, color="#4DB8C4"),
rx.heading("پیکربند", size="7", color="#3b82f6", font_weight="900"), rx.heading("پیکربند", size="7", color="#4DB8C4", font_weight="900"),
spacing="3", spacing="3",
), ),
rx.text( rx.text(
@@ -1049,13 +1049,13 @@ def footer() -> rx.Component:
rx.icon("facebook", size=24), rx.icon("facebook", size=24),
width="52px", width="52px",
height="52px", height="52px",
background="rgba(30, 64, 175, 0.15)", background="rgba(27, 75, 127, 0.15)",
border="2px solid rgba(30, 64, 175, 0.4)", border="2px solid rgba(27, 75, 127, 0.4)",
border_radius="14px", border_radius="14px",
display="flex", display="flex",
align_items="center", align_items="center",
justify_content="center", justify_content="center",
_hover={"background": "#1e40af", "border": "2px solid #1e40af", "transform": "translateY(-5px) scale(1.1)"}, _hover={"background": "#1B4B7F", "border": "2px solid #1B4B7F", "transform": "translateY(-5px) scale(1.1)"},
transition="all 0.3s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
), ),
href="#", href="#",
@@ -1066,13 +1066,13 @@ def footer() -> rx.Component:
rx.icon("twitter", size=24), rx.icon("twitter", size=24),
width="52px", width="52px",
height="52px", height="52px",
background="rgba(59, 130, 246, 0.15)", background="rgba(77, 184, 196, 0.15)",
border="2px solid rgba(59, 130, 246, 0.4)", border="2px solid rgba(77, 184, 196, 0.4)",
border_radius="14px", border_radius="14px",
display="flex", display="flex",
align_items="center", align_items="center",
justify_content="center", justify_content="center",
_hover={"background": "#3b82f6", "border": "2px solid #3b82f6", "transform": "translateY(-5px) scale(1.1)"}, _hover={"background": "#4DB8C4", "border": "2px solid #4DB8C4", "transform": "translateY(-5px) scale(1.1)"},
transition="all 0.3s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
), ),
href="#", href="#",
@@ -1083,13 +1083,13 @@ def footer() -> rx.Component:
rx.icon("message-circle", size=24), rx.icon("message-circle", size=24),
width="52px", width="52px",
height="52px", height="52px",
background="rgba(6, 182, 212, 0.15)", background="rgba(109, 215, 229, 0.15)",
border="2px solid rgba(6, 182, 212, 0.4)", border="2px solid rgba(109, 215, 229, 0.4)",
border_radius="14px", border_radius="14px",
display="flex", display="flex",
align_items="center", align_items="center",
justify_content="center", justify_content="center",
_hover={"background": "#06b6d4", "border": "2px solid #06b6d4", "transform": "translateY(-5px) scale(1.1)"}, _hover={"background": "#6DD7E5", "border": "2px solid #6DD7E5", "transform": "translateY(-5px) scale(1.1)"},
transition="all 0.3s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
), ),
href="https://t.me/peikarband", href="https://t.me/peikarband",
@@ -1101,7 +1101,7 @@ def footer() -> rx.Component:
align="center", align="center",
padding_y="40px", padding_y="40px",
), ),
rx.divider(background="rgba(30, 64, 175, 0.3)", margin_y="8"), rx.divider(background="rgba(27, 75, 127, 0.3)", margin_y="8"),
rx.text( rx.text(
"© ۱۴۰۳ پیکربند. تمامی حقوق محفوظ است.", "© ۱۴۰۳ پیکربند. تمامی حقوق محفوظ است.",
color="#64748B", color="#64748B",
@@ -1115,7 +1115,7 @@ def footer() -> rx.Component:
), ),
width="100%", width="100%",
background="linear-gradient(180deg, rgba(10, 10, 26, 0.95) 0%, rgba(5, 5, 16, 1) 100%)", background="linear-gradient(180deg, rgba(10, 10, 26, 0.95) 0%, rgba(5, 5, 16, 1) 100%)",
border_top="2px solid rgba(30, 64, 175, 0.4)", border_top="2px solid rgba(27, 75, 127, 0.4)",
) )
def floating_chat() -> rx.Component: def floating_chat() -> rx.Component:
@@ -1124,13 +1124,13 @@ def floating_chat() -> rx.Component:
rx.icon("message-circle", size=40, color="white"), rx.icon("message-circle", size=40, color="white"),
width="76px", width="76px",
height="76px", height="76px",
background="linear-gradient(135deg, #1e40af, #3b82f6)", background="linear-gradient(135deg, #1B4B7F, #4DB8C4)",
border_radius="full", border_radius="full",
display="flex", display="flex",
align_items="center", align_items="center",
justify_content="center", justify_content="center",
box_shadow="0 18px 60px rgba(30, 64, 175, 0.7)", box_shadow="0 18px 60px rgba(27, 75, 127, 0.7)",
_hover={"transform": "scale(1.2) rotate(10deg)", "box_shadow": "0 25px 80px rgba(30, 64, 175, 0.9)"}, _hover={"transform": "scale(1.2) rotate(10deg)", "box_shadow": "0 25px 80px rgba(27, 75, 127, 0.9)"},
transition="all 0.4s cubic-bezier(0.4, 0, 0.2, 1)", transition="all 0.4s cubic-bezier(0.4, 0, 0.2, 1)",
), ),
href="https://t.me/peikarband", href="https://t.me/peikarband",