diff --git a/next.config.ts b/next.config.ts
index e9ffa30..6c19289 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -1,7 +1,20 @@
import type { NextConfig } from "next";
const nextConfig: NextConfig = {
- /* config options here */
+ images: {
+ remotePatterns: [
+ {
+ protocol: "https",
+ hostname: "meshkee-templates.sas.amin.parminstorage.ir",
+ pathname: "/**",
+ },
+ {
+ protocol: "https",
+ hostname: "www.meshkee.com",
+ pathname: "/**",
+ },
+ ],
+ },
};
export default nextConfig;
diff --git a/package.json b/package.json
index 44ad535..9ad2872 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
{
- "name": "meshkee-tmp",
+ "name": "meshkee",
"version": "0.1.0",
"private": true,
"scripts": {
diff --git a/public/images/blog/ab.jpg b/public/images/blog/ab.jpg
new file mode 100644
index 0000000..9e3aca0
Binary files /dev/null and b/public/images/blog/ab.jpg differ
diff --git a/public/images/blog/crawl.jpg b/public/images/blog/crawl.jpg
new file mode 100644
index 0000000..930ba9b
Binary files /dev/null and b/public/images/blog/crawl.jpg differ
diff --git a/public/images/blog/cta.jpg b/public/images/blog/cta.jpg
new file mode 100644
index 0000000..f750424
Binary files /dev/null and b/public/images/blog/cta.jpg differ
diff --git a/public/images/blog/funnel.jpg b/public/images/blog/funnel.jpg
new file mode 100644
index 0000000..e65fb2c
Binary files /dev/null and b/public/images/blog/funnel.jpg differ
diff --git a/public/images/blog/prototype.jpg b/public/images/blog/prototype.jpg
new file mode 100644
index 0000000..d7db828
Binary files /dev/null and b/public/images/blog/prototype.jpg differ
diff --git a/public/images/blog/saas.jpg b/public/images/blog/saas.jpg
new file mode 100644
index 0000000..d99f79b
Binary files /dev/null and b/public/images/blog/saas.jpg differ
diff --git a/public/images/brand/logo-black.png b/public/images/brand/logo-black.png
new file mode 100755
index 0000000..83f8536
Binary files /dev/null and b/public/images/brand/logo-black.png differ
diff --git a/public/images/brand/logo-white.png b/public/images/brand/logo-white.png
new file mode 100755
index 0000000..4246ac7
Binary files /dev/null and b/public/images/brand/logo-white.png differ
diff --git a/public/images/brand/mark-black.png b/public/images/brand/mark-black.png
new file mode 100755
index 0000000..ee9f056
Binary files /dev/null and b/public/images/brand/mark-black.png differ
diff --git a/public/images/brand/mark-white.png b/public/images/brand/mark-white.png
new file mode 100755
index 0000000..8fd5f62
Binary files /dev/null and b/public/images/brand/mark-white.png differ
diff --git a/public/images/brand/mark.svg b/public/images/brand/mark.svg
new file mode 100644
index 0000000..b046db7
--- /dev/null
+++ b/public/images/brand/mark.svg
@@ -0,0 +1,3 @@
+
+
+
diff --git a/public/images/hero/app.webp b/public/images/hero/app.webp
new file mode 100644
index 0000000..2b19735
Binary files /dev/null and b/public/images/hero/app.webp differ
diff --git a/public/images/hero/cms.webp b/public/images/hero/cms.webp
new file mode 100644
index 0000000..b79ec80
Binary files /dev/null and b/public/images/hero/cms.webp differ
diff --git a/public/images/hero/hero.webp b/public/images/hero/hero.webp
new file mode 100644
index 0000000..d87372a
Binary files /dev/null and b/public/images/hero/hero.webp differ
diff --git a/public/images/hero/main.webp b/public/images/hero/main.webp
new file mode 100644
index 0000000..d87372a
Binary files /dev/null and b/public/images/hero/main.webp differ
diff --git a/public/images/media/1.jpg b/public/images/media/1.jpg
new file mode 100644
index 0000000..5a81360
Binary files /dev/null and b/public/images/media/1.jpg differ
diff --git a/public/images/media/2.jpg b/public/images/media/2.jpg
new file mode 100644
index 0000000..fd61765
Binary files /dev/null and b/public/images/media/2.jpg differ
diff --git a/public/images/media/3.jpg b/public/images/media/3.jpg
new file mode 100644
index 0000000..c347503
Binary files /dev/null and b/public/images/media/3.jpg differ
diff --git a/public/images/media/4.webp b/public/images/media/4.webp
new file mode 100644
index 0000000..d52803a
Binary files /dev/null and b/public/images/media/4.webp differ
diff --git a/public/images/media/5.jpg b/public/images/media/5.jpg
new file mode 100644
index 0000000..ccb1c2a
Binary files /dev/null and b/public/images/media/5.jpg differ
diff --git a/public/images/media/6.jpg b/public/images/media/6.jpg
new file mode 100644
index 0000000..3b5a256
Binary files /dev/null and b/public/images/media/6.jpg differ
diff --git a/public/images/media/7.jpg b/public/images/media/7.jpg
new file mode 100644
index 0000000..7f6f976
Binary files /dev/null and b/public/images/media/7.jpg differ
diff --git a/public/images/media/8.jpg b/public/images/media/8.jpg
new file mode 100644
index 0000000..93e01b8
Binary files /dev/null and b/public/images/media/8.jpg differ
diff --git a/public/images/media/9.jpg b/public/images/media/9.jpg
new file mode 100644
index 0000000..4773850
Binary files /dev/null and b/public/images/media/9.jpg differ
diff --git a/public/images/portfolio/alma.webp b/public/images/portfolio/alma.webp
new file mode 100644
index 0000000..4f02146
Binary files /dev/null and b/public/images/portfolio/alma.webp differ
diff --git a/public/images/portfolio/bakery.webp b/public/images/portfolio/bakery.webp
new file mode 100644
index 0000000..b39b78b
Binary files /dev/null and b/public/images/portfolio/bakery.webp differ
diff --git a/public/images/portfolio/beauty.jpg b/public/images/portfolio/beauty.jpg
new file mode 100644
index 0000000..4526a3e
Binary files /dev/null and b/public/images/portfolio/beauty.jpg differ
diff --git a/public/images/portfolio/building.webp b/public/images/portfolio/building.webp
new file mode 100644
index 0000000..646d240
Binary files /dev/null and b/public/images/portfolio/building.webp differ
diff --git a/public/images/portfolio/mirror.webp b/public/images/portfolio/mirror.webp
new file mode 100644
index 0000000..4990461
Binary files /dev/null and b/public/images/portfolio/mirror.webp differ
diff --git a/public/images/portfolio/watch.webp b/public/images/portfolio/watch.webp
new file mode 100644
index 0000000..a1b070d
Binary files /dev/null and b/public/images/portfolio/watch.webp differ
diff --git a/public/images/services/app.png b/public/images/services/app.png
new file mode 100644
index 0000000..71d255c
Binary files /dev/null and b/public/images/services/app.png differ
diff --git a/public/images/services/cms.png b/public/images/services/cms.png
new file mode 100644
index 0000000..57e4232
Binary files /dev/null and b/public/images/services/cms.png differ
diff --git a/public/images/services/graphic.png b/public/images/services/graphic.png
new file mode 100644
index 0000000..8a71b8f
Binary files /dev/null and b/public/images/services/graphic.png differ
diff --git a/public/images/services/seo.png b/public/images/services/seo.png
new file mode 100644
index 0000000..186fa26
Binary files /dev/null and b/public/images/services/seo.png differ
diff --git a/public/images/services/web.png b/public/images/services/web.png
new file mode 100644
index 0000000..293465b
Binary files /dev/null and b/public/images/services/web.png differ
diff --git a/src/app/apple-icon.png b/src/app/apple-icon.png
new file mode 100755
index 0000000..ee9f056
Binary files /dev/null and b/src/app/apple-icon.png differ
diff --git a/src/app/dedicated-application/page.tsx b/src/app/dedicated-application/page.tsx
new file mode 100644
index 0000000..522371d
--- /dev/null
+++ b/src/app/dedicated-application/page.tsx
@@ -0,0 +1,98 @@
+import type { Metadata } from "next";
+import { ServicePageLayout } from "@/components/ServicePageLayout";
+import { WebsiteCountries, applicationCountries } from "@/components/WebsiteCountries";
+import {
+ ProjectsShowcase,
+ applicationProjects,
+} from "@/components/WebsiteProjects";
+import { images } from "@/data/assets";
+
+const CDN =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets/files";
+
+export const metadata: Metadata = {
+ title: "طراحی اختصاصی اپلیکیشن | مشکی",
+ description: "طراحی و توسعه اپلیکیشن موبایل iOS و Android توسط تیم اختصاصی مشکی.",
+};
+
+export default function DedicatedApplicationPage() {
+ return (
+
+ }
+ >
+
+
+ );
+}
diff --git a/src/app/globals.css b/src/app/globals.css
index a2dc41e..336fcc5 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -1,26 +1,258 @@
@import "tailwindcss";
:root {
- --background: #ffffff;
- --foreground: #171717;
+ --ink: #0e1116;
+ --ink-soft: #2a313c;
+ --muted: #5c6672;
+ --line: #d5dbe3;
+ --paper: #eef1f4;
+ --paper-deep: #e2e7ee;
+ --surface: #fafafa;
+ --accent-from: #ff5a7a;
+ --accent-to: #9c4dff;
+ --accent: #c44db8;
+ --accent-deep: #8b3adb;
+ --glow: rgba(196, 77, 184, 0.16);
+ --brand-gradient: linear-gradient(135deg, var(--accent-from), var(--accent-to));
+ --background: var(--paper);
+ --foreground: var(--ink);
}
@theme inline {
--color-background: var(--background);
--color-foreground: var(--foreground);
- --font-sans: var(--font-geist-sans);
- --font-mono: var(--font-geist-mono);
+ --color-ink: var(--ink);
+ --color-ink-soft: var(--ink-soft);
+ --color-muted: var(--muted);
+ --color-line: var(--line);
+ --color-paper: var(--paper);
+ --color-paper-deep: var(--paper-deep);
+ --color-surface: var(--surface);
+ --color-accent: var(--accent);
+ --color-accent-deep: var(--accent-deep);
+ --color-accent-from: var(--accent-from);
+ --color-accent-to: var(--accent-to);
+ --font-sans: var(--font-vazirmatn);
+ --font-display: var(--font-montserrat);
}
-@media (prefers-color-scheme: dark) {
- :root {
- --background: #0a0a0a;
- --foreground: #ededed;
+* {
+ box-sizing: border-box;
+}
+
+html {
+ scroll-behavior: smooth;
+}
+
+/* Rule: all interactive elements animate smoothly on hover */
+button,
+a {
+ transition:
+ background 0.25s ease,
+ background-color 0.25s ease,
+ color 0.25s ease,
+ border-color 0.25s ease,
+ box-shadow 0.25s ease,
+ transform 0.2s ease,
+ opacity 0.2s ease;
+}
+
+/* Headings: consistent weight matching hero h1 — titles stay on one row */
+h1,
+h2 {
+ font-weight: 400;
+ white-space: nowrap;
+}
+
+h3,
+h4 {
+ font-weight: 400;
+}
+
+::selection {
+ background: color-mix(in srgb, var(--accent) 28%, white);
+ color: var(--ink);
+}
+
+.latin {
+ font-family: var(--font-montserrat), var(--font-vazirmatn), sans-serif;
+ letter-spacing: 0.04em;
+}
+
+.text-body {
+ text-align: justify;
+ text-justify: inter-word;
+}
+
+/* Gradient hover utilities */
+.btn-primary {
+ background: var(--ink);
+ color: var(--surface);
+ transition:
+ background 0.25s ease,
+ color 0.25s ease,
+ box-shadow 0.25s ease;
+}
+
+.btn-primary:hover {
+ background: var(--brand-gradient);
+ color: #fff;
+}
+
+.link-hover {
+ transition: color 0.25s ease;
+}
+
+.link-hover:hover {
+ color: var(--accent);
+ background: var(--brand-gradient);
+ background-clip: text;
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+}
+
+.border-hover {
+ transition:
+ border-color 0.25s ease,
+ box-shadow 0.25s ease;
+}
+
+.border-hover:hover,
+.group:hover .border-hover {
+ border-color: transparent;
+ background:
+ linear-gradient(#fff, #fff) padding-box,
+ var(--brand-gradient) border-box;
+ box-shadow: 0 0 0 1px transparent;
+}
+
+.group-border-hover {
+ transition:
+ border-color 0.25s ease,
+ box-shadow 0.25s ease;
+}
+
+.group-border-hover:hover,
+.group:hover.group-border-hover,
+.group:hover .group-border-hover,
+a.group-border-hover:hover {
+ border-color: color-mix(in srgb, var(--accent) 55%, white);
+}
+
+.group-text-hover {
+ transition: color 0.25s ease;
+}
+
+.group:hover .group-text-hover {
+ color: var(--accent);
+}
+
+.carousel-mask {
+ -ms-overflow-style: none;
+ scrollbar-width: none;
+}
+
+.carousel-mask::-webkit-scrollbar {
+ display: none;
+}
+
+.carousel-track {
+ animation: carousel-scroll 48s linear infinite;
+ will-change: transform;
+}
+
+.carousel-track:hover {
+ animation-play-state: paused;
+}
+
+@keyframes carousel-scroll {
+ 0% {
+ transform: translateX(0);
+ }
+ 100% {
+ transform: translateX(-50%);
}
}
-body {
- background: var(--background);
- color: var(--foreground);
- font-family: Arial, Helvetica, sans-serif;
+.mesh-grid {
+ background-image:
+ linear-gradient(rgba(14, 17, 22, 0.035) 1px, transparent 1px),
+ linear-gradient(90deg, rgba(14, 17, 22, 0.035) 1px, transparent 1px);
+ background-size: 48px 48px;
+ mask-image: radial-gradient(ellipse 70% 60% at 50% 30%, black 20%, transparent 75%);
+}
+
+.mesh-glow {
+ background:
+ radial-gradient(ellipse 55% 45% at 78% 35%, var(--glow), transparent 70%),
+ radial-gradient(ellipse 40% 35% at 12% 70%, rgba(42, 49, 60, 0.08), transparent 65%),
+ linear-gradient(165deg, #f5f7fa 0%, #e8edf3 48%, #eef2f6 100%);
+}
+
+@keyframes float-y {
+ 0%,
+ 100% {
+ transform: translateY(0);
+ }
+ 50% {
+ transform: translateY(-12px);
+ }
+}
+
+@keyframes rise-in {
+ from {
+ opacity: 0;
+ transform: translateY(28px);
+ }
+ to {
+ opacity: 1;
+ transform: translateY(0);
+ }
+}
+
+@keyframes fade-in {
+ from {
+ opacity: 0;
+ }
+ to {
+ opacity: 1;
+ }
+}
+
+.animate-float {
+ animation: float-y 7s ease-in-out infinite;
+}
+
+.reveal {
+ opacity: 0;
+ transform: translateY(28px);
+ transition:
+ opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
+ transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
+}
+
+.reveal.is-visible {
+ opacity: 1;
+ transform: translateY(0);
+}
+
+.reveal-delay-1 {
+ transition-delay: 0.12s;
+}
+.reveal-delay-2 {
+ transition-delay: 0.24s;
+}
+.reveal-delay-3 {
+ transition-delay: 0.36s;
+}
+
+@media (prefers-reduced-motion: reduce) {
+ .animate-float,
+ .reveal,
+ .carousel-track {
+ animation: none !important;
+ transition: none !important;
+ opacity: 1 !important;
+ transform: none !important;
+ }
}
diff --git a/src/app/graphic-designer/page.tsx b/src/app/graphic-designer/page.tsx
new file mode 100644
index 0000000..5a25ec2
--- /dev/null
+++ b/src/app/graphic-designer/page.tsx
@@ -0,0 +1,146 @@
+import type { Metadata } from "next";
+import { ServicePageLayout } from "@/components/ServicePageLayout";
+import { GraphicBrands } from "@/components/GraphicBrands";
+import {
+ ProjectsShowcase,
+ graphicCatalogProjects,
+ graphicIdentityProjects,
+ graphicLogoProjects,
+} from "@/components/WebsiteProjects";
+import { images } from "@/data/assets";
+
+const CDN =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets/files";
+const ASSETS =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets";
+
+export const metadata: Metadata = {
+ title: "طراحی گرافیک و هویت بصری | مشکی",
+ description: "طراحی لوگو، هویت بصری، کاتالوگ، بروشور و گرافیک شبکههای اجتماعی توسط تیم مشکی.",
+};
+
+export default function GraphicDesignerPage() {
+ return (
+
+ ),
+ },
+ {
+ after: 2,
+ node: (
+ <>
+
+
+ >
+ ),
+ },
+ {
+ after: 3,
+ node: (
+
+ ),
+ },
+ ]}
+ />
+ );
+}
diff --git a/src/app/icon.png b/src/app/icon.png
new file mode 100755
index 0000000..ee9f056
Binary files /dev/null and b/src/app/icon.png differ
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 976eb90..de76373 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,20 +1,27 @@
import type { Metadata } from "next";
-import { Geist, Geist_Mono } from "next/font/google";
+import { Montserrat, Vazirmatn } from "next/font/google";
import "./globals.css";
-const geistSans = Geist({
- variable: "--font-geist-sans",
- subsets: ["latin"],
+const vazirmatn = Vazirmatn({
+ variable: "--font-vazirmatn",
+ subsets: ["arabic", "latin"],
+ display: "swap",
});
-const geistMono = Geist_Mono({
- variable: "--font-geist-mono",
+const montserrat = Montserrat({
+ variable: "--font-montserrat",
subsets: ["latin"],
+ display: "swap",
});
export const metadata: Metadata = {
- title: "Create Next App",
- description: "Generated by create next app",
+ title: "تیم برنامهنویسی و تجارت الکترونیک مشکی | Meshkee",
+ description:
+ "راهکارهای مدرن برای تجارت شما — طراحی وبسایت، اپلیکیشن، سیستمهای مدیریتی، سئو و گرافیک توسط تیم مشکی.",
+ icons: {
+ icon: "/images/brand/mark-black.png",
+ apple: "/images/brand/mark-black.png",
+ },
};
export default function RootLayout({
@@ -24,10 +31,11 @@ export default function RootLayout({
}>) {
return (
-
{children}
+ {children}
);
}
diff --git a/src/app/meshkee-cms/page.tsx b/src/app/meshkee-cms/page.tsx
new file mode 100644
index 0000000..d57f209
--- /dev/null
+++ b/src/app/meshkee-cms/page.tsx
@@ -0,0 +1,328 @@
+import type { Metadata } from "next";
+import { ServicePageLayout } from "@/components/ServicePageLayout";
+import { GraphicBrands, cmsBrands } from "@/components/GraphicBrands";
+import { images } from "@/data/assets";
+
+const CDN =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets/files";
+const ASSETS =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets";
+
+export const metadata: Metadata = {
+ title: "سیستم مدیریت یکپارچه مشکی | Meshkee CMS",
+ description:
+ "سیستم مدیریت یکپارچه مشکی شامل فروشگاه، مالی، انبار، باشگاه مشتریان و محتوا.",
+};
+
+export default function MeshkeeCmsPage() {
+ return (
+ ,
+ },
+ ]}
+ />
+ );
+}
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 3f36f7c..8333cff 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,65 +1,31 @@
-import Image from "next/image";
+import { AppSection } from "@/components/AppSection";
+import { BlogSection } from "@/components/BlogSection";
+import { CmsSection } from "@/components/CmsSection";
+import { ContactSection } from "@/components/ContactSection";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { Hero } from "@/components/Hero";
+import { MediaSection } from "@/components/MediaSection";
+import { Portfolio } from "@/components/Portfolio";
+import { RevealObserver } from "@/components/RevealObserver";
+import { Services } from "@/components/Services";
-export default function Home() {
+export default function HomePage() {
return (
-
-
-
-
-
- To get started, edit the page.tsx file.
-
-
- Looking for a starting point or more instructions? Head over to{" "}
-
- Templates
- {" "}
- or the{" "}
-
- Learning
- {" "}
- center.
-
-
-
+ <>
+
+
+
+
+
+
+
+
+
+
+
-
+
+ >
);
}
diff --git a/src/app/seo/page.tsx b/src/app/seo/page.tsx
new file mode 100644
index 0000000..9a3dd79
--- /dev/null
+++ b/src/app/seo/page.tsx
@@ -0,0 +1,75 @@
+import type { Metadata } from "next";
+import { ServicePageLayout } from "@/components/ServicePageLayout";
+import { SeoCities } from "@/components/SeoCities";
+import { ProjectsShowcase, seoProjects } from "@/components/WebsiteProjects";
+import { images } from "@/data/assets";
+
+const CDN =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets/files";
+
+export const metadata: Metadata = {
+ title: "سئو و مدیریت وبسایت | مشکی",
+ description: "خدمات سئو حرفهای، بهینهسازی موتور جستجو و مدیریت وبسایت توسط تیم مشکی.",
+};
+
+export default function SeoPage() {
+ return (
+
+ ),
+ },
+ {
+ after: 2,
+ node: ,
+ },
+ ]}
+ />
+ );
+}
diff --git a/src/app/website/page.tsx b/src/app/website/page.tsx
new file mode 100644
index 0000000..6e64eef
--- /dev/null
+++ b/src/app/website/page.tsx
@@ -0,0 +1,120 @@
+import type { Metadata } from "next";
+import { ServicePageLayout } from "@/components/ServicePageLayout";
+import { WebsiteProjects } from "@/components/WebsiteProjects";
+import { WebsiteCountries } from "@/components/WebsiteCountries";
+import { images } from "@/data/assets";
+
+const CDN =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets/files";
+const ICONS =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets/img/icons";
+
+export const metadata: Metadata = {
+ title: "طراحی اختصاصی وبسایت | مشکی",
+ description: "طراحی و توسعه وبسایت اختصاصی، فروشگاهی، شرکتی و خاص توسط تیم مشکی.",
+};
+
+export default function WebsitePage() {
+ return (
+ }
+ >
+
+
+ );
+}
diff --git a/src/assets/logo/Meshkee Logo (No BG) - White -2.png b/src/assets/logo/Meshkee Logo (No BG) - White -2.png
new file mode 100755
index 0000000..8fd5f62
Binary files /dev/null and b/src/assets/logo/Meshkee Logo (No BG) - White -2.png differ
diff --git a/src/assets/logo/Meshkee Logo (With Text) - Black -1.png b/src/assets/logo/Meshkee Logo (With Text) - Black -1.png
new file mode 100755
index 0000000..83f8536
Binary files /dev/null and b/src/assets/logo/Meshkee Logo (With Text) - Black -1.png differ
diff --git a/src/assets/logo/Meshkee Logo (With Text) - White -1.png b/src/assets/logo/Meshkee Logo (With Text) - White -1.png
new file mode 100755
index 0000000..4246ac7
Binary files /dev/null and b/src/assets/logo/Meshkee Logo (With Text) - White -1.png differ
diff --git a/src/assets/logo/Meshkee Logo - Black.png b/src/assets/logo/Meshkee Logo - Black.png
new file mode 100755
index 0000000..ee9f056
Binary files /dev/null and b/src/assets/logo/Meshkee Logo - Black.png differ
diff --git a/src/components/AppSection.tsx b/src/components/AppSection.tsx
new file mode 100644
index 0000000..f9645ef
--- /dev/null
+++ b/src/components/AppSection.tsx
@@ -0,0 +1,47 @@
+import { images } from "@/data/assets";
+
+export function AppSection() {
+ return (
+
+
+
+
+ طراحی و توسعهی اپلیکیشن
+
+
+ Application Develop
+
+
+ فکر میکنید وقتش هست برند شما در تلفن همراه مخاطبان باشد؟
+
+
+ برای بعضی مقاصد، اپلیکیشن فوقالعاده است؛ مثلاً وقتی میخواهید کاربر در
+ سریعترین زمان به خدمات یا محصولات شما دسترسی پیدا کند، یا به ابزارهایی
+ مثل موقعیت و دوربین گوشی نیاز دارید. یک اپلیکیشن خوب، راحتی و وفاداری
+ بیشتر کاربران را به همراه دارد.
+
+
+ با ما تماس بگیرید
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/components/BlogSection.tsx b/src/components/BlogSection.tsx
new file mode 100644
index 0000000..e357b63
--- /dev/null
+++ b/src/components/BlogSection.tsx
@@ -0,0 +1,52 @@
+import { posts } from "@/data/home";
+
+export function BlogSection() {
+ return (
+
+
+
+
+
+ رشدنامه، آموزشی و انگیزشی
+
+
+ Our Blog
+
+
+
+ با محتوای مشکی همیشه بهروز باشید.
+
+
+
+
+
+
+ );
+}
diff --git a/src/components/CmsSection.tsx b/src/components/CmsSection.tsx
new file mode 100644
index 0000000..381f7d2
--- /dev/null
+++ b/src/components/CmsSection.tsx
@@ -0,0 +1,54 @@
+import { images } from "@/data/assets";
+
+export function CmsSection() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+ سیستمهای مدیریت یکپارچه
+
+
+ Integrated Management System
+
+
+ سیستم مدیریت یکپارچه ترکیبی از سیستمهایی است که برای مدیریت سازمان
+ نیاز دارید؛ از فروش و صندوق فروشگاهی، حسابداری و امور مالی، باشگاه
+ مشتریان تا مدیریت انبار. Meshkee.cms طوری طراحی شده که سیستم مدیریت
+ داخلی شما با وبسایت و اپلیکیشن یکپارچه عمل کند — مثلاً موجودی یا قیمت
+ کالا بهصورت خودکار در محیط آنلاین هم اعمال میشود.
+
+
+ سیستمهای مدیریتی منسجم میتوانند در نظم و کارآمدی سازمانتان کنار شما
+ باشند.
+
+
+
+
+
+ );
+}
diff --git a/src/components/ContactSection.tsx b/src/components/ContactSection.tsx
new file mode 100644
index 0000000..1104430
--- /dev/null
+++ b/src/components/ContactSection.tsx
@@ -0,0 +1,70 @@
+"use client";
+
+import { site } from "@/data/home";
+
+export function ContactSection() {
+ return (
+
+ );
+}
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
new file mode 100644
index 0000000..52a76bc
--- /dev/null
+++ b/src/components/Footer.tsx
@@ -0,0 +1,45 @@
+import Link from "next/link";
+import { nav, site } from "@/data/home";
+
+export function Footer() {
+ return (
+
+ );
+}
diff --git a/src/components/FramedImage.tsx b/src/components/FramedImage.tsx
new file mode 100644
index 0000000..2a68499
--- /dev/null
+++ b/src/components/FramedImage.tsx
@@ -0,0 +1,31 @@
+export function FramedImage({
+ src,
+ alt = "",
+ aspect = "natural",
+ offset = false,
+}: {
+ src: string;
+ alt?: string;
+ aspect?: "square" | "natural";
+ offset?: boolean;
+}) {
+ return (
+
+ {offset ? (
+
+ ) : null}
+
+
+ );
+}
diff --git a/src/components/GraphicBrands.tsx b/src/components/GraphicBrands.tsx
new file mode 100644
index 0000000..638658e
--- /dev/null
+++ b/src/components/GraphicBrands.tsx
@@ -0,0 +1,183 @@
+"use client";
+
+import { useCallback, useEffect, useRef, useState } from "react";
+
+const CDN =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets";
+
+export const graphicBrands = [
+ {
+ nameFa: "فرخ وین",
+ nameEn: "FARROKH WIN",
+ logo: `${CDN}/files/tUNXxKZYdG.png`,
+ },
+ {
+ nameFa: "رستوران نمونه",
+ nameEn: "NEMOONEH RESTAURANT",
+ logo: `${CDN}/files/HUMX0LgwBX.png`,
+ },
+ {
+ nameFa: "رستوران پرالین",
+ nameEn: "PERALIN",
+ logo: `${CDN}/files/pmrx1c9FZL.png`,
+ },
+ {
+ nameFa: "فروشگاه کارنو",
+ nameEn: "CARNOW",
+ logo: `${CDN}/files/ZQY2e6T3iC.png`,
+ },
+ {
+ nameFa: "رستوران خاش پز",
+ nameEn: "KHASH PAZ",
+ logo: `${CDN}/files/ZDRTPm468U.png`,
+ },
+ {
+ nameFa: "قنادی بلوط",
+ nameEn: "BALOUT",
+ logo: `${CDN}/files/kp7mWiDY7m.png`,
+ },
+];
+
+export const cmsBrands = [
+ {
+ nameFa: "طلا و جواهرات ایوبی فخیم",
+ nameEn: "AYOUBIFAKHIM",
+ logo: `${CDN}/img/brands/2.png`,
+ },
+ {
+ nameFa: "وبسایت لیوتل",
+ nameEn: "LIOTELL",
+ logo: `${CDN}/files/gNtiIymDQa.png`,
+ },
+ {
+ nameFa: "وبسایت دکتر سیف",
+ nameEn: "DR SAFE",
+ logo: `${CDN}/files/xbxAHqiJrm.png`,
+ },
+ {
+ nameFa: "وبسایت صنیع خانی",
+ nameEn: "SANI KHANI",
+ logo: `${CDN}/files/rdLLonb3et.png`,
+ },
+ {
+ nameFa: "وبسایت عسل جهانیان",
+ nameEn: "ASAL JAHANIAN",
+ logo: `${CDN}/files/Lkhnnnh7Zs.png`,
+ },
+];
+
+interface BrandItem {
+ nameFa: string;
+ nameEn: string;
+ logo: string;
+}
+
+interface GraphicBrandsProps {
+ brands?: BrandItem[];
+ eyebrow?: string;
+ title?: string;
+ titleEn?: string;
+}
+
+export function GraphicBrands({
+ brands = graphicBrands,
+ eyebrow = "همکاری با سازمانهای معتبر",
+ title = "سازمانهایی که با آنها همکاری کردهایم",
+ titleEn = "OUR CUSTOMERS",
+}: GraphicBrandsProps) {
+ const [active, setActive] = useState(0);
+ const containerRef = useRef(null);
+ const trackRef = useRef(null);
+
+ const centerSlide = useCallback(() => {
+ const container = containerRef.current;
+ const track = trackRef.current;
+ if (!container || !track) return;
+
+ const slide = track.children[active] as HTMLElement | undefined;
+ if (!slide) return;
+
+ const containerCenter = container.offsetWidth / 2;
+ const slideCenter = slide.offsetLeft + slide.offsetWidth / 2;
+ track.style.transform = `translateX(${containerCenter - slideCenter}px)`;
+ }, [active]);
+
+ useEffect(() => {
+ centerSlide();
+ window.addEventListener("resize", centerSlide);
+ return () => window.removeEventListener("resize", centerSlide);
+ }, [centerSlide]);
+
+ useEffect(() => {
+ if (brands.length === 0) return;
+ const timer = window.setInterval(() => {
+ setActive((prev) => (prev + 1) % brands.length);
+ }, 2000);
+
+ return () => window.clearInterval(timer);
+ }, [brands.length]);
+
+ useEffect(() => {
+ setActive(0);
+ }, [brands]);
+
+ return (
+
+
+
+
{eyebrow}
+
+ {title}
+
+
+ {titleEn}
+
+
+
+
+
+
+ {brands.map((brand, index) => (
+
+
+
+ {brand.nameFa}
+
+ {brand.nameEn}
+
+
+
+ ))}
+
+
+
+
+ {brands.map((brand, index) => (
+ setActive(index)}
+ className={`h-2 rounded-full transition-all duration-300 ${
+ index === active ? "w-6 bg-[#5c5c5c]" : "w-2 bg-[#777]"
+ }`}
+ />
+ ))}
+
+
+ );
+}
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
new file mode 100644
index 0000000..aa4a5af
--- /dev/null
+++ b/src/components/Header.tsx
@@ -0,0 +1,163 @@
+"use client";
+
+import Link from "next/link";
+import { useState } from "react";
+import { nav, site } from "@/data/home";
+import { images } from "@/data/assets";
+
+const socials = [
+ { label: "اینستاگرام", href: "https://instagram.com", icon: "M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 100 12.324 6.162 6.162 0 000-12.324zM12 16a4 4 0 110-8 4 4 0 010 8zm6.406-11.845a1.44 1.44 0 100 2.881 1.44 1.44 0 000-2.881z" },
+ { label: "یوتیوب", href: "https://youtube.com", icon: "M23.498 6.186a3.016 3.016 0 00-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 00.502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 002.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 002.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z" },
+ { label: "لینکدین", href: "https://linkedin.com", icon: "M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" },
+ { label: "فیسبوک", href: "https://facebook.com", icon: "M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z" },
+ { label: "آپارات", href: "https://aparat.com", icon: "M12 0C5.373 0 0 5.373 0 12s5.373 12 12 12 12-5.373 12-12S18.627 0 12 0zm0 4a8 8 0 110 16A8 8 0 0112 4zm0 2a6 6 0 100 12A6 6 0 0012 6zm-1 3l5 3-5 3V9z" },
+];
+
+export function Header() {
+ const [open, setOpen] = useState(false);
+
+ return (
+
+ {/* Top bar: social icons + quick links */}
+
+
+
+ {socials.map((s) => (
+
+
+
+
+
+ ))}
+
+
+
+
+
+
+ {/* Main nav */}
+
+
+ {/* Logo + nav grouped on the right (RTL) */}
+
+
+
+
+
+
+ {nav.map((item) => (
+
+ {item.label}
+
+ ))}
+
+
+
+
+
+ {/* Login + CTA on the left */}
+
+
+
setOpen((v) => !v)}
+ >
+ منو
+
+
+
+
+
+
+
+
+
+ {open && (
+
+
+ {nav.map((item) => (
+ setOpen(false)}
+ >
+ {item.label}
+
+ ))}
+
+
+
+ )}
+
+ );
+}
diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx
new file mode 100644
index 0000000..c1460ec
--- /dev/null
+++ b/src/components/Hero.tsx
@@ -0,0 +1,68 @@
+import { site } from "@/data/home";
+import { images } from "@/data/assets";
+
+export function Hero() {
+ return (
+
+
+
+
+ راهکارهای مدرن برای تجارت شما
+
+
+
+ {site.fullTitle}
+
+
+
+ {site.taglineEn}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/components/MediaSection.tsx b/src/components/MediaSection.tsx
new file mode 100644
index 0000000..47b8f71
--- /dev/null
+++ b/src/components/MediaSection.tsx
@@ -0,0 +1,46 @@
+import { mediaItems } from "@/data/home";
+
+export function MediaSection() {
+ return (
+
+ );
+}
diff --git a/src/components/Portfolio.tsx b/src/components/Portfolio.tsx
new file mode 100644
index 0000000..c279d27
--- /dev/null
+++ b/src/components/Portfolio.tsx
@@ -0,0 +1,55 @@
+import { portfolio } from "@/data/home";
+
+const loopItems = [...portfolio, ...portfolio];
+
+export function Portfolio() {
+ return (
+
+
+
+
+ نمونههایی از وبسایتهای طراحیشده
+
+
+ Website Design
+
+
+ وبسایت بستری برای معرفی شما، فروش محصولات، خبررسانی و ارتباط بهتر با
+ مشتریان است؛ مهمتر از همه، استراتژی استفاده از آن است.
+
+
+
+
+
+
+ {loopItems.map((item, index) => (
+
+
+
+
+
+ ))}
+
+
+
+
+
+ );
+}
diff --git a/src/components/RevealObserver.tsx b/src/components/RevealObserver.tsx
new file mode 100644
index 0000000..5566ed2
--- /dev/null
+++ b/src/components/RevealObserver.tsx
@@ -0,0 +1,27 @@
+"use client";
+
+import { useEffect } from "react";
+
+export function RevealObserver() {
+ useEffect(() => {
+ const elements = document.querySelectorAll(".reveal");
+ if (!elements.length) return;
+
+ const observer = new IntersectionObserver(
+ (entries) => {
+ for (const entry of entries) {
+ if (entry.isIntersecting) {
+ entry.target.classList.add("is-visible");
+ observer.unobserve(entry.target);
+ }
+ }
+ },
+ { threshold: 0.16, rootMargin: "0px 0px -8% 0px" },
+ );
+
+ elements.forEach((el) => observer.observe(el));
+ return () => observer.disconnect();
+ }, []);
+
+ return null;
+}
diff --git a/src/components/SeoCities.tsx b/src/components/SeoCities.tsx
new file mode 100644
index 0000000..dc8f05b
--- /dev/null
+++ b/src/components/SeoCities.tsx
@@ -0,0 +1,83 @@
+const CDN =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets/files";
+
+const cities = [
+ {
+ nameFa: "تهران",
+ nameEn: "tehran",
+ image: `${CDN}/0tvhyuFDLP.webp`,
+ cols: "lg:col-span-8",
+ },
+ {
+ nameFa: "قم",
+ nameEn: "qom",
+ image: `${CDN}/9xJXfsbuxO.webp`,
+ cols: "lg:col-span-4",
+ },
+ {
+ nameFa: "مشهد",
+ nameEn: "mashhad",
+ image: `${CDN}/inzY9vuguj.webp`,
+ cols: "lg:col-span-4",
+ },
+ {
+ nameFa: "بوشهر",
+ nameEn: "booshehr",
+ image: `${CDN}/Gm0XROiWuC.webp`,
+ cols: "lg:col-span-4",
+ },
+ {
+ nameFa: "ساری",
+ nameEn: "sari",
+ image: `${CDN}/C5UA21d0NM.webp`,
+ cols: "lg:col-span-4",
+ },
+];
+
+export function SeoCities() {
+ return (
+
+
+
+
+ مشتریان ما از تمام ایران میباشند
+
+
+ COOPERATION
+
+
+
+
+ {cities.map((city, index) => (
+
+
+
+
+
+ {city.nameFa}
+
+
+ {city.nameEn}
+
+
+
+
+ ))}
+
+
+
+ );
+}
diff --git a/src/components/ServicePageLayout.tsx b/src/components/ServicePageLayout.tsx
new file mode 100644
index 0000000..93f38ae
--- /dev/null
+++ b/src/components/ServicePageLayout.tsx
@@ -0,0 +1,320 @@
+import Link from "next/link";
+import { FramedImage } from "@/components/FramedImage";
+import { Header } from "@/components/Header";
+import { Footer } from "@/components/Footer";
+import { RevealObserver } from "@/components/RevealObserver";
+import { site } from "@/data/home";
+
+interface Feature {
+ title: string;
+ titleEn?: string;
+ description: string;
+ icon?: string;
+}
+
+interface Section {
+ tag?: string;
+ title: string;
+ titleEn?: string;
+ body: string;
+ image?: string;
+ imageFrame?: boolean;
+ eyebrow?: string;
+ headline?: string;
+ features?: Feature[];
+ featureLayout?: "horizontal" | "team";
+ featureColumns?: 2 | 3;
+}
+
+interface ServicePageProps {
+ metaTitle: string;
+ tag: string;
+ title: string;
+ titleEn: string;
+ lead: string;
+ heroImage?: string;
+ sections: Section[];
+ injectAfter?: number;
+ inject?: React.ReactNode;
+ injections?: { after: number; node: React.ReactNode }[];
+ children?: React.ReactNode;
+}
+
+function SolutionFeatureCard({ feature }: { feature: Feature }) {
+ return (
+
+ {feature.icon ? (
+
+ ) : null}
+
+
+ {feature.title}
+
+ {feature.titleEn && (
+
+ {feature.titleEn}
+
+ )}
+
+ {feature.description}
+
+
+
+ );
+}
+
+function TeamFeatureCard({ feature }: { feature: Feature }) {
+ return (
+
+
+ {feature.icon ? (
+
+ ) : null}
+
+
+ {feature.title}
+
+ {feature.titleEn && (
+
+ {feature.titleEn}
+
+ )}
+
+
+
+ {feature.description}
+
+
+ );
+}
+
+function FeatureCard({
+ feature,
+ layout = "horizontal",
+}: {
+ feature: Feature;
+ layout?: "horizontal" | "team";
+}) {
+ if (layout === "team") {
+ return ;
+ }
+
+ return ;
+}
+
+export function ServicePageLayout({
+ tag,
+ title,
+ titleEn,
+ lead,
+ heroImage,
+ sections,
+ injectAfter,
+ inject,
+ injections,
+ children,
+}: ServicePageProps) {
+ const sectionInjections =
+ injections ??
+ (injectAfter !== undefined && inject
+ ? [{ after: injectAfter, node: inject }]
+ : []);
+
+ return (
+ <>
+
+
+
+
+
+
+
+
+ {heroImage && (
+
+
+
+
+
+
+ )}
+
+
+
+
+ {sections.map((sec, i) => (
+
+
+
+ {sec.image ? (
+
+
+ {sec.eyebrow ? (
+
{sec.eyebrow}
+ ) : null}
+
+ {sec.title}
+
+ {sec.titleEn && (
+
+ {sec.titleEn}
+
+ )}
+ {sec.headline ? (
+
+ {sec.headline}
+
+ ) : null}
+
+ {sec.body}
+
+
+
+ {sec.imageFrame ? (
+
+ ) : (
+
+ )}
+
+
+ ) : (
+
+
+ {sec.title}
+
+ {sec.titleEn && (
+
+ {sec.titleEn}
+
+ )}
+
+ {sec.body}
+
+
+ )}
+
+ {sec.features && sec.features.length > 0 && (
+
+ {sec.features.map((f, fi) => (
+
+
+
+ ))}
+
+ )}
+
+
+ {sectionInjections
+ .filter((item) => item.after === i)
+ .map((item, injectionIndex) => (
+
{item.node}
+ ))}
+
+ ))}
+
+ {children}
+
+
+
+
+ آمادهاید شروع کنیم؟
+
+
+ با تیم مشکی تماس بگیرید تا درباره پروژهتان صحبت کنیم.
+
+
+
+
+
+
+ >
+ );
+}
diff --git a/src/components/Services.tsx b/src/components/Services.tsx
new file mode 100644
index 0000000..7e3b8e3
--- /dev/null
+++ b/src/components/Services.tsx
@@ -0,0 +1,58 @@
+import Link from "next/link";
+import { services } from "@/data/home";
+
+export function Services() {
+ return (
+
+
+
+
+ خدمات ما
+
+
+ Our Solutions
+
+
+
+
+
+
+ );
+}
diff --git a/src/components/WebsiteCountries.tsx b/src/components/WebsiteCountries.tsx
new file mode 100644
index 0000000..78e7e98
--- /dev/null
+++ b/src/components/WebsiteCountries.tsx
@@ -0,0 +1,144 @@
+const CDN =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets";
+
+export const websiteCountries = [
+ {
+ nameFa: "ایران",
+ nameEn: "iran",
+ image: `${CDN}/files/XV96o9YJXK.webp`,
+ flag: `${CDN}/img/cities/iran-flag.png`,
+ cols: "lg:col-span-8",
+ },
+ {
+ nameFa: "استرالیا",
+ nameEn: "australia",
+ image: `${CDN}/files/NEa3xsnLkf.webp`,
+ flag: `${CDN}/img/cities/australia-flag.png`,
+ cols: "lg:col-span-4",
+ },
+ {
+ nameFa: "امارات",
+ nameEn: "enirates",
+ image: `${CDN}/files/X0Y7csP5LY.webp`,
+ flag: `${CDN}/img/cities/emirates-flag.png`,
+ cols: "lg:col-span-6",
+ },
+ {
+ nameFa: "ژاپن",
+ nameEn: "japan",
+ image: `${CDN}/files/fVx6q5vfUA.webp`,
+ flag: `${CDN}/img/cities/japan-flag.png`,
+ cols: "lg:col-span-6",
+ },
+];
+
+export const applicationCountries = [
+ {
+ nameFa: "ایران",
+ nameEn: "iran",
+ image: `${CDN}/files/MrKwuNTRVI.webp`,
+ flag: `${CDN}/img/cities/iran-flag.png`,
+ cols: "lg:col-span-8",
+ },
+ {
+ nameFa: "استرالیا",
+ nameEn: "australia",
+ image: `${CDN}/img/cities/australia.png`,
+ flag: `${CDN}/img/cities/australia-flag.png`,
+ cols: "lg:col-span-4",
+ },
+ {
+ nameFa: "امارات",
+ nameEn: "enirates",
+ image: `${CDN}/img/cities/emirates.png`,
+ flag: `${CDN}/img/cities/emirates-flag.png`,
+ cols: "lg:col-span-6",
+ },
+ {
+ nameFa: "ژاپن",
+ nameEn: "japan",
+ image: `${CDN}/img/cities/japan.png`,
+ flag: `${CDN}/img/cities/japan-flag.png`,
+ cols: "lg:col-span-6",
+ },
+];
+
+interface CountryItem {
+ nameFa: string;
+ nameEn: string;
+ image: string;
+ flag: string;
+ cols: string;
+}
+
+interface WebsiteCountriesProps {
+ title?: string;
+ titleEn?: string;
+ body?: string;
+ countries?: CountryItem[];
+}
+
+export function WebsiteCountries({
+ title = "انجام پروژه در کشورها",
+ titleEn = "COOPERATION",
+ body,
+ countries = websiteCountries,
+}: WebsiteCountriesProps) {
+ return (
+
+
+
+
+ {title}
+
+
+ {titleEn}
+
+ {body ? (
+
+ {body}
+
+ ) : null}
+
+
+
+ {countries.map((country, index) => (
+
+
+
+
+
+
+
+ {country.nameFa}
+
+
+
+ {country.nameEn}
+
+
+
+
+ ))}
+
+
+
+ );
+}
diff --git a/src/components/WebsiteProjects.tsx b/src/components/WebsiteProjects.tsx
new file mode 100644
index 0000000..74622a6
--- /dev/null
+++ b/src/components/WebsiteProjects.tsx
@@ -0,0 +1,148 @@
+import { FramedImage } from "@/components/FramedImage";
+
+const CDN =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets/files";
+
+export const websiteProjects = [
+ { src: `${CDN}/FmXwLrTfoV.webp` },
+ { src: `${CDN}/aNkJKqDchY.webp` },
+ { src: `${CDN}/AqWe2zfGLb.jpg` },
+ { src: `${CDN}/ifnT6QdNsr.webp` },
+];
+
+export const applicationProjects = [
+ { src: `${CDN}/vVBied8Og6.webp` },
+ { src: `${CDN}/pXvH3hqSdS.jpg` },
+ { src: `${CDN}/9RT7qexPXH.jpg` },
+ { src: `${CDN}/HP72QvIPPU.jpg` },
+];
+
+export const seoProjects = [
+ { src: `${CDN}/B5lPbimKui.webp` },
+ { src: `${CDN}/4j1aVADzm8.webp` },
+ { src: `${CDN}/4sgg4zQsTc.webp` },
+];
+
+export const graphicLogoProjects = [
+ { src: `${CDN}/ATolOFILtk.jpg` },
+ { src: `${CDN}/8xlSNcn8cL.webp` },
+ { src: `${CDN}/FRhOrUDQxK.webp` },
+ { src: `${CDN}/Z6Xu9fMGjL.jpg` },
+ { src: `${CDN}/8eNAfUtFNo.jpg` },
+];
+
+export const graphicIdentityProjects = [
+ { src: `${CDN}/EGRdN6bXU2.jpg` },
+ { src: `${CDN}/OfPtIOoudd.webp` },
+ { src: `${CDN}/nX5EqK3OtS.jpg` },
+ { src: `${CDN}/A2iAd7kEhm.webp` },
+ { src: `${CDN}/U9VRzvYjIf.webp` },
+];
+
+export const graphicCatalogProjects = [
+ { src: `${CDN}/ItCvr2jXRu.webp` },
+ { src: `${CDN}/hbfVqlZi18.webp` },
+ { src: `${CDN}/gTsPVWqh24.webp` },
+];
+
+interface ProjectItem {
+ src: string;
+}
+
+interface ProjectsShowcaseProps {
+ title?: string;
+ titleEn?: string;
+ subtitle?: string;
+ projects?: ProjectItem[];
+ moreHref?: string;
+ variant?: "grid" | "carousel";
+}
+
+export function ProjectsShowcase({
+ title = "انجام ۱۰ پروژهی اختصاصی بزرگ در طول این سالها",
+ titleEn = "WEBSITE DESIGN",
+ subtitle,
+ projects = websiteProjects,
+ moreHref = "/#portfolio",
+ variant = "grid",
+}: ProjectsShowcaseProps) {
+ const loopProjects = [...projects, ...projects];
+
+ return (
+
+
+
+
+ {subtitle ? (
+
{subtitle}
+ ) : null}
+
+ {title}
+
+
+ {titleEn}
+
+
+
+
+ مشاهده بیشتر
+ ↓
+
+
+
+
+ {variant === "carousel" ? (
+
+
+ {loopProjects.map((project, index) => (
+
+
+
+ ))}
+
+
+ ) : (
+
+
+ {projects.map((project, index) => (
+
+
+
+
+
+ ))}
+
+
+ )}
+
+ );
+}
+
+export function WebsiteProjects() {
+ return ;
+}
diff --git a/src/data/assets.ts b/src/data/assets.ts
new file mode 100644
index 0000000..5af87aa
--- /dev/null
+++ b/src/data/assets.ts
@@ -0,0 +1,53 @@
+const CDN =
+ "https://meshkee-templates.sas.amin.parminstorage.ir/sites/user_themes/meshkee_SEEpb1zypk/assets";
+
+export const images = {
+ hero: `${CDN}/files/BUUvn1ssFu.webp`,
+ heroApp: `${CDN}/files/Z8yZ4ZGj5f.webp`,
+ heroCms: `${CDN}/files/F4qO7A8vsU.webp`,
+ brandLogo: "/images/brand/logo-black.png",
+ brandLogoWhite: "/images/brand/logo-white.png",
+ brandMark: "/images/brand/mark-black.png",
+ brandMarkWhite: "/images/brand/mark-white.png",
+ services: {
+ web: `${CDN}/files/ecXmIxV0te.png`,
+ app: `${CDN}/files/L3esyJkRFC.png`,
+ cms: `${CDN}/files/ScJdqzoK18.png`,
+ seo: `${CDN}/files/W5V2j5WwJb.png`,
+ graphic: `${CDN}/files/n98K6K9jyG.png`,
+ },
+ pages: {
+ website: `${CDN}/files/Rp3QX3m8FE.webp`,
+ app: `${CDN}/files/tdRtWz7Q2l.webp`,
+ cms: `${CDN}/files/SwYRnHKWPd.png`,
+ seo: `${CDN}/files/JXLo625dyC.webp`,
+ graphic: `${CDN}/files/zJZkmuK6tr.webp`,
+ },
+ portfolio: [
+ `${CDN}/files/3xXv8TLPsX.jpg`,
+ `${CDN}/files/gyG38oiy8O.webp`,
+ `${CDN}/files/fvJfINwpLk.webp`,
+ `${CDN}/files/AV8xufJxJG.webp`,
+ `${CDN}/files/TMSkameY2t.webp`,
+ `${CDN}/files/LIWk9CwaR5.webp`,
+ ],
+ media: [
+ `${CDN}/img/portfolios/6.jpg`,
+ `${CDN}/img/portfolios/5.jpg`,
+ `${CDN}/img/portfolios/7.jpg`,
+ `${CDN}/files/TzK4ghgvjU.webp`,
+ `${CDN}/img/portfolios/9.jpg`,
+ `${CDN}/img/portfolios/10.jpg`,
+ `${CDN}/img/portfolios/11.jpg`,
+ `${CDN}/img/portfolios/12.jpg`,
+ `${CDN}/img/portfolios/13.jpg`,
+ ],
+ blog: [
+ `${CDN}/files/3xXv8TLPsX.jpg`,
+ `${CDN}/files/gyG38oiy8O.webp`,
+ `${CDN}/files/fvJfINwpLk.webp`,
+ `${CDN}/files/AV8xufJxJG.webp`,
+ `${CDN}/files/TMSkameY2t.webp`,
+ `${CDN}/files/LIWk9CwaR5.webp`,
+ ],
+};
diff --git a/src/data/home.ts b/src/data/home.ts
new file mode 100644
index 0000000..d2d8db9
--- /dev/null
+++ b/src/data/home.ts
@@ -0,0 +1,126 @@
+import { images } from "./assets";
+
+export const site = {
+ nameFa: "مشکی",
+ fullTitle: "تیم برنامهنویسی و تجارت الکترونیک مشکی",
+ nameEn: "Meshkee",
+ tagline: "تیم تجارت الکترونیک مشکی",
+ taglineEn: "MESHKEE E-COMMERCE TEAM",
+ phone: "0902 4200 240",
+ phoneHref: "tel:+989024200240",
+ email: "info@meshkee.com",
+ address: "قم، بلوار امام رضا، مجتمع فردوس، طبقهٔ اول تجاری، واحد ۳۰۹ و ۳۱۰",
+};
+
+export const nav = [
+ { label: "وبسایت", href: "/website" },
+ { label: "سئو", href: "/seo" },
+ { label: "اپلیکیشن", href: "/dedicated-application" },
+ { label: "سیستمهای مدیریتی", href: "/meshkee-cms" },
+ { label: "گرافیک و رسانه", href: "/graphic-designer" },
+ { label: "نمونهکارها", href: "/#portfolio" },
+ { label: "مقالات", href: "/#blog" },
+];
+
+export const services = [
+ {
+ title: "طراحی و توسعهی وبسایت",
+ titleEn: "WEBSITE DESIGN & DEVELOPMENT",
+ description:
+ "طراحی و توسعهی انواع وبسایتهای فروشگاهی، خبری، شرکتی، گالری، ورزشی و همینطور وبسایت با مقاصد خاص. این کار بهصورت تیمی انجام میشود و برای هر یک از بخشهای گرافیک، برنامهنویسی، سرور، سئو و … متخصص جداگانهای روی وبسایت شما فعالیت خواهد کرد.",
+ icon: images.services.web,
+ href: "/website",
+ },
+ {
+ title: "طراحی و توسعهی اپلیکیشن",
+ titleEn: "APPLICATION DESIGN & DEVELOPMENT",
+ description:
+ "همانند وبسایت، ما صفر تا صد اپلیکیشن را برای شما انجام میدهیم. انواع اپلیکیشنهای فروشگاهی، خبری و همینطور با مقاصد خاص. این اپلیکیشنها به دو صورت استفاده از Meshkee.cms و همینطور اختصاصی طراحی میشوند.",
+ icon: images.services.app,
+ href: "/dedicated-application",
+ },
+ {
+ title: "سیستمهای مدیریتی",
+ titleEn: "MESHKEE.CMS",
+ description:
+ "سیستم مدیریتی Meshkee.cms دارای امکاناتی از قبیل سیستم فروشگاهی و صندوق، سیستم مدیریت مالی، باشگاه مشتریان، انبار و … میباشد. این بخشها همگی به وبسایت و اپلیکیشن شما متصل هستند.",
+ icon: images.services.cms,
+ href: "/meshkee-cms",
+ },
+ {
+ title: "بهینهسازی وبسایت و سئو",
+ titleEn: "WEBSITE MANAGEMENT & SEO",
+ description:
+ "ما میتوانیم مدیریت کامل وبسایت شما را در دست بگیریم؛ از تولید محتوا و امور گرافیکی، مسائل تکنیکال، مدیریت تبلیغات و کمپینها تا مهمترین موضوع که حضور در جستجوها و سئو است.",
+ icon: images.services.seo,
+ href: "/seo",
+ },
+ {
+ title: "گرافیک و رسانه",
+ titleEn: "GRAPHIC & MEDIA",
+ description:
+ "طراحی رابط کاربری وبسایت و اپلیکیشن (UI & UX)، لوگو، هویت بصری و بهطور کلی برند بوک (Brand Book) از تخصصهای ماست.",
+ icon: images.services.graphic,
+ href: "/graphic-designer",
+ },
+];
+
+export const portfolio = [
+ { image: images.portfolio[0] },
+ { image: images.portfolio[1] },
+ { image: images.portfolio[2] },
+ { image: images.portfolio[3] },
+ { image: images.portfolio[4] },
+ { image: images.portfolio[5] },
+];
+
+export const mediaItems = [
+ { title: "عکاسی صنعتی محصول", image: images.media[0] },
+ { title: "طراحی رابط کاربری اپلیکیشن", image: images.media[1] },
+ { title: "عکاسی معماری داخلی", image: images.media[2] },
+ { title: "وبسایت و سئو", image: images.media[3] },
+ { title: "طراحی هویت بصری", image: images.media[4] },
+ { title: "عکاسی صنعتی محصول — جزئیات", image: images.media[5] },
+ { title: "طراحی لوگو", image: images.media[6] },
+ { title: "عکاسی معماری — بیرونی", image: images.media[7] },
+ { title: "طراحی لوگو", image: images.media[8] },
+];
+
+export const posts = [
+ {
+ title: "SaaS چیست و چرا شرکتهای بزرگ به آن مهاجرت میکنند؟",
+ excerpt:
+ "SaaS چیست و چگونه مدل نرمافزارهای اشتراکی هزینهها را کاهش و رشد کسبوکار را سریعتر میکند؟",
+ image: images.blog[0],
+ },
+ {
+ title: "طراحی پروتوتایپ تعاملی چیست و چرا فروش شما را متحول میکند؟",
+ excerpt:
+ "نقش طراحی پروتوتایپ تعاملی در کاهش ریسک و افزایش فروش را اینجا بررسی کردهایم.",
+ image: images.blog[1],
+ },
+ {
+ title: "تست A/B چیست؟ راهنمای کامل افزایش نرخ تبدیل و بهبود UX",
+ excerpt:
+ "چگونه با تحلیل دادهها، تجربه کاربری و نرخ تبدیل سایت یا اپلیکیشن را بهبود دهیم؟",
+ image: images.blog[2],
+ },
+ {
+ title: "اشتباهات رایج در طراحی دکمه CTA",
+ excerpt:
+ "اشتباهات رایج در طراحی دکمه CTA را بشناسید و نرخ تبدیل سایت را بهبود دهید.",
+ image: images.blog[3],
+ },
+ {
+ title: "بودجه خزش (Crawl Budget)",
+ excerpt:
+ "با مدیریت هوشمندانه بودجه خزش، ایندکس سریعتر صفحات و بهبود رتبه سایت را تجربه کنید.",
+ image: images.blog[4],
+ },
+ {
+ title: "۴ مرحله طلایی قیف فروش دیجیتال",
+ excerpt:
+ "قیف فروش دیجیتال مسیر کاربران را از آگاهی تا مشتری وفادار نشان میدهد.",
+ image: images.blog[5],
+ },
+];