This commit is contained in:
2026-07-23 09:45:21 +00:00
parent e388dc2cf4
commit 08816695c9
405 changed files with 13784 additions and 686 deletions

View File

@@ -32,14 +32,19 @@ export function FeatureRow({ img, title, body, reverse, Icon }: { img: string; t
export function CTA() {
return (
<section className="bg-foreground text-background">
<div className="container-page py-16 flex flex-wrap items-center justify-between gap-6">
<section className="bg-brand-blue text-white">
<div className="container-page py-12 flex flex-wrap items-center justify-between gap-6">
<div>
<div className="text-xs uppercase tracking-widest text-brand-red">Ready when you are</div>
<h3 className="mt-2 font-display text-3xl font-black">Let's design your misting system.</h3>
<div className="text-xl md:text-2xl font-bold leading-tight">
Questions? Call Now:{" "}
<span className="text-3xl md:text-4xl font-black whitespace-nowrap">+971 4 320 3552</span>
</div>
</div>
<Link to="/enquiry" className="inline-flex items-center gap-2 bg-brand-red text-white px-6 py-3.5 rounded-md text-sm font-semibold">
Request a quote <ArrowUpRight className="h-4 w-4" />
<Link
to="/enquiry"
className="inline-flex items-center gap-2 bg-white text-brand-blue px-8 py-4 rounded-md text-lg font-bold hover:opacity-90 transition-opacity"
>
BOOK NOW <ArrowUpRight className="h-5 w-5" />
</Link>
</div>
</section>

View File

@@ -0,0 +1,70 @@
import { useState } from "react";
import { MessageSquare } from "lucide-react";
export function QuickContact() {
const [open, setOpen] = useState(false);
const [name, setName] = useState("");
const [email, setEmail] = useState("");
const [message, setMessage] = useState("");
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
const subject = encodeURIComponent(`Quick Contact from ${name}`);
const body = encodeURIComponent(`${message}\n\nFrom: ${name}\nEmail: ${email}`);
window.open(`mailto:sales@promistcool.com?subject=${subject}&body=${body}`, "_blank");
setOpen(false);
setName("");
setEmail("");
setMessage("");
};
return (
<>
<button
onClick={() => setOpen(!open)}
className="fixed bottom-6 left-6 z-50 bg-brand-blue text-white h-12 w-12 rounded-full shadow-lg flex items-center justify-center hover:opacity-90 transition-opacity"
aria-label="Quick contact"
>
<MessageSquare className="h-5 w-5" />
</button>
{open && (
<div className="fixed bottom-20 left-6 z-50 w-80 bg-white rounded-xl shadow-2xl border p-5">
<h3 className="font-display text-lg font-bold mb-3">Quick Contact</h3>
<form onSubmit={handleSubmit} className="space-y-3">
<input
type="text"
placeholder="Name"
value={name}
onChange={(e) => setName(e.target.value)}
required
className="border rounded-lg px-3 py-2 w-full text-sm"
/>
<input
type="email"
placeholder="Email"
value={email}
onChange={(e) => setEmail(e.target.value)}
required
className="border rounded-lg px-3 py-2 w-full text-sm"
/>
<textarea
placeholder="Message"
value={message}
onChange={(e) => setMessage(e.target.value)}
required
rows={3}
className="border rounded-lg px-3 py-2 w-full text-sm resize-none"
/>
<button
type="submit"
className="bg-brand-red text-white px-4 py-2 rounded-lg text-sm font-medium hover:opacity-90 w-full"
>
Send Message
</button>
</form>
</div>
)}
</>
);
}

View File

@@ -0,0 +1,24 @@
import { useState, useEffect } from "react";
import { ArrowUp } from "lucide-react";
export function ScrollToTop() {
const [show, setShow] = useState(false);
useEffect(() => {
const onScroll = () => setShow(window.scrollY > 300);
window.addEventListener("scroll", onScroll, { passive: true });
return () => window.removeEventListener("scroll", onScroll);
}, []);
if (!show) return null;
return (
<button
onClick={() => window.scrollTo({ top: 0, behavior: "smooth" })}
className="fixed bottom-6 right-6 z-50 bg-brand-red text-white h-12 w-12 rounded-full shadow-lg flex items-center justify-center hover:opacity-90 transition-opacity"
aria-label="Scroll to top"
>
<ArrowUp className="h-5 w-5" />
</button>
);
}

View File

@@ -0,0 +1,27 @@
import { type ReactNode } from "react";
import { PageHero, CTA } from "@/components/page-shell";
import { SubPageSidebar } from "@/components/sub-page-sidebar";
interface SubPageLayoutProps {
eyebrow: string;
title: string;
lede?: string;
children: ReactNode;
}
export function SubPageLayout({ eyebrow, title, lede, children }: SubPageLayoutProps) {
return (
<>
<PageHero eyebrow={eyebrow} title={title} lede={lede} />
<div className="container-page py-8 md:py-12">
<div className="grid grid-cols-1 md:grid-cols-[1fr_280px] gap-8 items-start">
<div className="min-w-0">{children}</div>
<div className="sticky top-24">
<SubPageSidebar />
</div>
</div>
</div>
<CTA />
</>
);
}

View File

@@ -0,0 +1,127 @@
import { useLocation, Link } from "@tanstack/react-router";
import { useState } from "react";
import { ChevronRight } from "lucide-react";
interface NavItem {
label: string;
to: string;
}
const APPLICATIONS: NavItem[] = [
{ label: "Humidification", to: "/applications/humidification" },
{ label: "Commercial Outdoor Cooling", to: "/applications/commercial-outdoor-cooling" },
{ label: "Industrial Outdoor Cooling", to: "/applications/industrial-outdoor-cooling" },
{ label: "Residential Outdoor Cooling", to: "/applications/residential-outdoor-cooling" },
{ label: "Dust Suppression", to: "/applications/dust-suppression" },
{ label: "Animal Cooling", to: "/applications/animal-cooling" },
{ label: "Air Cooler", to: "/applications/air-cooler" },
{ label: "Professional Pre-Cooling", to: "/applications/professional-pre-cooling" },
];
const PRODUCTS: NavItem[] = [
{ label: "Sanitization Booth", to: "/products/sanitization-booth" },
{ label: "Misting Nozzles", to: "/products/nozzles" },
{ label: "Misting Pumps", to: "/products/misting-pumps" },
{ label: "Portable Misting Fans", to: "/products/portable-misting-fans" },
{ label: "Satellite Misting Fans", to: "/products/satellite-misting-fans" },
{ label: "Fittings & Tubings", to: "/products/misting-fittings-tubings" },
{ label: "Parts & Accessories", to: "/products/misting-systems-accessories" },
];
const SOLUTIONS: NavItem[] = [
{ label: "Misting Technology", to: "/solutions/misting-technology" },
{ label: "Misting Systems Design", to: "/solutions/misting-systems-design" },
{ label: "FAQ", to: "/solutions/faq" },
];
function SidebarNavSection({ title, items, currentPath }: { title: string; items: NavItem[]; currentPath: string }) {
return (
<div>
<h4 className="text-xs uppercase tracking-widest text-brand-red font-semibold mb-2">{title}</h4>
<ul className="space-y-1">
{items.map((item) => {
const isActive = currentPath === item.to;
return (
<li key={item.to}>
<Link
to={item.to}
className={`flex items-center gap-1.5 text-sm px-3 py-2 rounded-md transition-colors ${
isActive
? "bg-brand-red/10 text-brand-red font-semibold"
: "text-muted-foreground hover:text-foreground hover:bg-muted"
}`}
>
<ChevronRight className="h-3 w-3 text-brand-red shrink-0" />
{item.label}
</Link>
</li>
);
})}
</ul>
</div>
);
}
export function SubPageSidebar() {
const location = useLocation();
const currentPath = location.pathname;
const [name, setName] = useState("");
const [email, setEmail] = useState("");
const [message, setMessage] = useState("");
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
const subject = encodeURIComponent(`Quick Contact from ${name}`);
const body = encodeURIComponent(`${message}\n\nFrom: ${name}\nEmail: ${email}`);
window.open(`mailto:sales@promistcool.com?subject=${subject}&body=${body}`, "_blank");
setName("");
setEmail("");
setMessage("");
};
return (
<aside className="space-y-8">
{/* Quick Contact Form */}
<div className="bg-muted/50 rounded-lg p-5 border">
<h3 className="font-display text-lg font-bold mb-3">Quick Contact</h3>
<form onSubmit={handleSubmit} className="space-y-3">
<input
type="text"
placeholder="Name"
value={name}
onChange={(e) => setName(e.target.value)}
required
className="border rounded-lg px-3 py-2 w-full text-sm"
/>
<input
type="email"
placeholder="Email"
value={email}
onChange={(e) => setEmail(e.target.value)}
required
className="border rounded-lg px-3 py-2 w-full text-sm"
/>
<textarea
placeholder="Message"
value={message}
onChange={(e) => setMessage(e.target.value)}
required
rows={3}
className="border rounded-lg px-3 py-2 w-full text-sm resize-none"
/>
<button
type="submit"
className="bg-brand-red text-white px-4 py-2 rounded-lg text-sm font-medium hover:opacity-90 w-full"
>
Send Message
</button>
</form>
</div>
{/* Nav Sections */}
<SidebarNavSection title="Applications" items={APPLICATIONS} currentPath={currentPath} />
<SidebarNavSection title="Products" items={PRODUCTS} currentPath={currentPath} />
<SidebarNavSection title="Solutions" items={SOLUTIONS} currentPath={currentPath} />
</aside>
);
}

3390
src/data/wp-images.json Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -1,57 +0,0 @@
type LovableErrorOptions = {
mechanism?: "manual" | "onerror" | "unhandledrejection" | "react_error_boundary";
handled?: boolean;
severity?: "error" | "warning" | "info";
};
type LovableEvents = {
captureException?: (
error: unknown,
context?: Record<string, unknown>,
options?: LovableErrorOptions,
) => void;
};
declare global {
interface Window {
__lovableEvents?: LovableEvents;
__lovableReportRuntimeError?: (payload: {
message: string;
stack?: string;
filename?: string;
}) => void;
}
}
export function reportLovableError(error: unknown, context: Record<string, unknown> = {}) {
if (typeof window === "undefined") return;
window.__lovableEvents?.captureException?.(
error,
{
source: "react_error_boundary",
route: window.location.pathname,
...context,
},
{
mechanism: "react_error_boundary",
handled: false,
severity: "error",
},
);
// Prod React does not rethrow boundary-caught errors to window.onerror, so the
// editor's telemetry never sees them. Forward to lovable.js's reporting hook,
// which is present only inside the editor preview.
// Loaders and server fns commonly throw a raw Response; String(it) is the
// opaque "[object Response]", so pull out the status and URL instead.
const message =
error instanceof Response
? `Response ${error.status}${error.url ? ` at ${error.url}` : ""}`
: error instanceof Error
? error.message
: String(error);
window.__lovableReportRuntimeError?.({
message,
stack: error instanceof Error ? error.stack : undefined,
filename: window.location.pathname,
});
}

View File

@@ -9,49 +9,34 @@
// Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.
import { Route as rootRouteImport } from './routes/__root'
import { Route as SolutionsRouteImport } from './routes/solutions'
import { Route as RentalRouteImport } from './routes/rental'
import { Route as ProjectsRouteImport } from './routes/projects'
import { Route as ProductsRouteImport } from './routes/products'
import { Route as EnquiryRouteImport } from './routes/enquiry'
import { Route as ContactRouteImport } from './routes/contact'
import { Route as ApplicationsRouteImport } from './routes/applications'
import { Route as AboutRouteImport } from './routes/about'
import { Route as IndexRouteImport } from './routes/index'
import { Route as AboutRouteImport } from './routes/about'
import { Route as AirCoolerRouteImport } from './routes/air-cooler'
import { Route as AnimalCoolingRouteImport } from './routes/animal-cooling'
import { Route as CommercialOutdoorCoolingRouteImport } from './routes/commercial-outdoor-cooling'
import { Route as ContactRouteImport } from './routes/contact'
import { Route as DustSuppressionRouteImport } from './routes/dust-suppression'
import { Route as EnquiryRouteImport } from './routes/enquiry'
import { Route as FaqRouteImport } from './routes/faq'
import { Route as HumidificationRouteImport } from './routes/humidification'
import { Route as IndustrialOutdoorCoolingRouteImport } from './routes/industrial-outdoor-cooling'
import { Route as MistingFittingsTubingsRouteImport } from './routes/misting-fittings-tubings'
import { Route as MistingPumpsRouteImport } from './routes/misting-pumps'
import { Route as MistingSystemsAccessoriesRouteImport } from './routes/misting-systems-accessories'
import { Route as MistingSystemsDesignRouteImport } from './routes/misting-systems-design'
import { Route as MistingTechnologyRouteImport } from './routes/misting-technology'
import { Route as NozzlesRouteImport } from './routes/nozzles'
import { Route as PortableMistingFansRouteImport } from './routes/portable-misting-fans'
import { Route as ProfessionalPreCoolingRouteImport } from './routes/professional-pre-cooling'
import { Route as ProjectsRouteImport } from './routes/projects'
import { Route as RentalRouteImport } from './routes/rental'
import { Route as ResidentialOutdoorCoolingRouteImport } from './routes/residential-outdoor-cooling'
import { Route as SanitizationBoothRouteImport } from './routes/sanitization-booth'
import { Route as SatelliteMistingFansRouteImport } from './routes/satellite-misting-fans'
const SolutionsRoute = SolutionsRouteImport.update({
id: '/solutions',
path: '/solutions',
getParentRoute: () => rootRouteImport,
} as any)
const RentalRoute = RentalRouteImport.update({
id: '/rental',
path: '/rental',
getParentRoute: () => rootRouteImport,
} as any)
const ProjectsRoute = ProjectsRouteImport.update({
id: '/projects',
path: '/projects',
getParentRoute: () => rootRouteImport,
} as any)
const ProductsRoute = ProductsRouteImport.update({
id: '/products',
path: '/products',
getParentRoute: () => rootRouteImport,
} as any)
const EnquiryRoute = EnquiryRouteImport.update({
id: '/enquiry',
path: '/enquiry',
getParentRoute: () => rootRouteImport,
} as any)
const ContactRoute = ContactRouteImport.update({
id: '/contact',
path: '/contact',
getParentRoute: () => rootRouteImport,
} as any)
const ApplicationsRoute = ApplicationsRouteImport.update({
id: '/applications',
path: '/applications',
const IndexRoute = IndexRouteImport.update({
id: '/',
path: '/',
getParentRoute: () => rootRouteImport,
} as any)
const AboutRoute = AboutRouteImport.update({
@@ -59,143 +44,315 @@ const AboutRoute = AboutRouteImport.update({
path: '/about',
getParentRoute: () => rootRouteImport,
} as any)
const IndexRoute = IndexRouteImport.update({
id: '/',
path: '/',
const AirCoolerRoute = AirCoolerRouteImport.update({
id: '/air-cooler',
path: '/air-cooler',
getParentRoute: () => rootRouteImport,
} as any)
const AnimalCoolingRoute = AnimalCoolingRouteImport.update({
id: '/animal-cooling',
path: '/animal-cooling',
getParentRoute: () => rootRouteImport,
} as any)
const CommercialOutdoorCoolingRoute =
CommercialOutdoorCoolingRouteImport.update({
id: '/commercial-outdoor-cooling',
path: '/commercial-outdoor-cooling',
getParentRoute: () => rootRouteImport,
} as any)
const ContactRoute = ContactRouteImport.update({
id: '/contact',
path: '/contact',
getParentRoute: () => rootRouteImport,
} as any)
const DustSuppressionRoute = DustSuppressionRouteImport.update({
id: '/dust-suppression',
path: '/dust-suppression',
getParentRoute: () => rootRouteImport,
} as any)
const EnquiryRoute = EnquiryRouteImport.update({
id: '/enquiry',
path: '/enquiry',
getParentRoute: () => rootRouteImport,
} as any)
const FaqRoute = FaqRouteImport.update({
id: '/faq',
path: '/faq',
getParentRoute: () => rootRouteImport,
} as any)
const HumidificationRoute = HumidificationRouteImport.update({
id: '/humidification',
path: '/humidification',
getParentRoute: () => rootRouteImport,
} as any)
const IndustrialOutdoorCoolingRoute =
IndustrialOutdoorCoolingRouteImport.update({
id: '/industrial-outdoor-cooling',
path: '/industrial-outdoor-cooling',
getParentRoute: () => rootRouteImport,
} as any)
const MistingFittingsTubingsRoute = MistingFittingsTubingsRouteImport.update({
id: '/misting-fittings-tubings',
path: '/misting-fittings-tubings',
getParentRoute: () => rootRouteImport,
} as any)
const MistingPumpsRoute = MistingPumpsRouteImport.update({
id: '/misting-pumps',
path: '/misting-pumps',
getParentRoute: () => rootRouteImport,
} as any)
const MistingSystemsAccessoriesRoute =
MistingSystemsAccessoriesRouteImport.update({
id: '/misting-systems-accessories',
path: '/misting-systems-accessories',
getParentRoute: () => rootRouteImport,
} as any)
const MistingSystemsDesignRoute = MistingSystemsDesignRouteImport.update({
id: '/misting-systems-design',
path: '/misting-systems-design',
getParentRoute: () => rootRouteImport,
} as any)
const MistingTechnologyRoute = MistingTechnologyRouteImport.update({
id: '/misting-technology',
path: '/misting-technology',
getParentRoute: () => rootRouteImport,
} as any)
const NozzlesRoute = NozzlesRouteImport.update({
id: '/nozzles',
path: '/nozzles',
getParentRoute: () => rootRouteImport,
} as any)
const PortableMistingFansRoute = PortableMistingFansRouteImport.update({
id: '/portable-misting-fans',
path: '/portable-misting-fans',
getParentRoute: () => rootRouteImport,
} as any)
const ProfessionalPreCoolingRoute = ProfessionalPreCoolingRouteImport.update({
id: '/professional-pre-cooling',
path: '/professional-pre-cooling',
getParentRoute: () => rootRouteImport,
} as any)
const ProjectsRoute = ProjectsRouteImport.update({
id: '/projects',
path: '/projects',
getParentRoute: () => rootRouteImport,
} as any)
const RentalRoute = RentalRouteImport.update({
id: '/rental',
path: '/rental',
getParentRoute: () => rootRouteImport,
} as any)
const ResidentialOutdoorCoolingRoute =
ResidentialOutdoorCoolingRouteImport.update({
id: '/residential-outdoor-cooling',
path: '/residential-outdoor-cooling',
getParentRoute: () => rootRouteImport,
} as any)
const SanitizationBoothRoute = SanitizationBoothRouteImport.update({
id: '/sanitization-booth',
path: '/sanitization-booth',
getParentRoute: () => rootRouteImport,
} as any)
const SatelliteMistingFansRoute = SatelliteMistingFansRouteImport.update({
id: '/satellite-misting-fans',
path: '/satellite-misting-fans',
getParentRoute: () => rootRouteImport,
} as any)
export interface FileRoutesByFullPath {
'/': typeof IndexRoute
'/about': typeof AboutRoute
'/applications': typeof ApplicationsRoute
'/air-cooler': typeof AirCoolerRoute
'/animal-cooling': typeof AnimalCoolingRoute
'/commercial-outdoor-cooling': typeof CommercialOutdoorCoolingRoute
'/contact': typeof ContactRoute
'/dust-suppression': typeof DustSuppressionRoute
'/enquiry': typeof EnquiryRoute
'/products': typeof ProductsRoute
'/faq': typeof FaqRoute
'/humidification': typeof HumidificationRoute
'/industrial-outdoor-cooling': typeof IndustrialOutdoorCoolingRoute
'/misting-fittings-tubings': typeof MistingFittingsTubingsRoute
'/misting-pumps': typeof MistingPumpsRoute
'/misting-systems-accessories': typeof MistingSystemsAccessoriesRoute
'/misting-systems-design': typeof MistingSystemsDesignRoute
'/misting-technology': typeof MistingTechnologyRoute
'/nozzles': typeof NozzlesRoute
'/portable-misting-fans': typeof PortableMistingFansRoute
'/professional-pre-cooling': typeof ProfessionalPreCoolingRoute
'/projects': typeof ProjectsRoute
'/rental': typeof RentalRoute
'/solutions': typeof SolutionsRoute
'/residential-outdoor-cooling': typeof ResidentialOutdoorCoolingRoute
'/sanitization-booth': typeof SanitizationBoothRoute
'/satellite-misting-fans': typeof SatelliteMistingFansRoute
}
export interface FileRoutesByTo {
'/': typeof IndexRoute
'/about': typeof AboutRoute
'/applications': typeof ApplicationsRoute
'/air-cooler': typeof AirCoolerRoute
'/animal-cooling': typeof AnimalCoolingRoute
'/commercial-outdoor-cooling': typeof CommercialOutdoorCoolingRoute
'/contact': typeof ContactRoute
'/dust-suppression': typeof DustSuppressionRoute
'/enquiry': typeof EnquiryRoute
'/products': typeof ProductsRoute
'/faq': typeof FaqRoute
'/humidification': typeof HumidificationRoute
'/industrial-outdoor-cooling': typeof IndustrialOutdoorCoolingRoute
'/misting-fittings-tubings': typeof MistingFittingsTubingsRoute
'/misting-pumps': typeof MistingPumpsRoute
'/misting-systems-accessories': typeof MistingSystemsAccessoriesRoute
'/misting-systems-design': typeof MistingSystemsDesignRoute
'/misting-technology': typeof MistingTechnologyRoute
'/nozzles': typeof NozzlesRoute
'/portable-misting-fans': typeof PortableMistingFansRoute
'/professional-pre-cooling': typeof ProfessionalPreCoolingRoute
'/projects': typeof ProjectsRoute
'/rental': typeof RentalRoute
'/solutions': typeof SolutionsRoute
'/residential-outdoor-cooling': typeof ResidentialOutdoorCoolingRoute
'/sanitization-booth': typeof SanitizationBoothRoute
'/satellite-misting-fans': typeof SatelliteMistingFansRoute
}
export interface FileRoutesById {
__root__: typeof rootRouteImport
'/': typeof IndexRoute
'/about': typeof AboutRoute
'/applications': typeof ApplicationsRoute
'/air-cooler': typeof AirCoolerRoute
'/animal-cooling': typeof AnimalCoolingRoute
'/commercial-outdoor-cooling': typeof CommercialOutdoorCoolingRoute
'/contact': typeof ContactRoute
'/dust-suppression': typeof DustSuppressionRoute
'/enquiry': typeof EnquiryRoute
'/products': typeof ProductsRoute
'/faq': typeof FaqRoute
'/humidification': typeof HumidificationRoute
'/industrial-outdoor-cooling': typeof IndustrialOutdoorCoolingRoute
'/misting-fittings-tubings': typeof MistingFittingsTubingsRoute
'/misting-pumps': typeof MistingPumpsRoute
'/misting-systems-accessories': typeof MistingSystemsAccessoriesRoute
'/misting-systems-design': typeof MistingSystemsDesignRoute
'/misting-technology': typeof MistingTechnologyRoute
'/nozzles': typeof NozzlesRoute
'/portable-misting-fans': typeof PortableMistingFansRoute
'/professional-pre-cooling': typeof ProfessionalPreCoolingRoute
'/projects': typeof ProjectsRoute
'/rental': typeof RentalRoute
'/solutions': typeof SolutionsRoute
'/residential-outdoor-cooling': typeof ResidentialOutdoorCoolingRoute
'/sanitization-booth': typeof SanitizationBoothRoute
'/satellite-misting-fans': typeof SatelliteMistingFansRoute
}
export interface FileRouteTypes {
fileRoutesByFullPath: FileRoutesByFullPath
fullPaths:
| '/'
| '/about'
| '/applications'
| '/air-cooler'
| '/animal-cooling'
| '/commercial-outdoor-cooling'
| '/contact'
| '/dust-suppression'
| '/enquiry'
| '/products'
| '/faq'
| '/humidification'
| '/industrial-outdoor-cooling'
| '/misting-fittings-tubings'
| '/misting-pumps'
| '/misting-systems-accessories'
| '/misting-systems-design'
| '/misting-technology'
| '/nozzles'
| '/portable-misting-fans'
| '/professional-pre-cooling'
| '/projects'
| '/rental'
| '/solutions'
| '/residential-outdoor-cooling'
| '/sanitization-booth'
| '/satellite-misting-fans'
fileRoutesByTo: FileRoutesByTo
to:
| '/'
| '/about'
| '/applications'
| '/air-cooler'
| '/animal-cooling'
| '/commercial-outdoor-cooling'
| '/contact'
| '/dust-suppression'
| '/enquiry'
| '/products'
| '/faq'
| '/humidification'
| '/industrial-outdoor-cooling'
| '/misting-fittings-tubings'
| '/misting-pumps'
| '/misting-systems-accessories'
| '/misting-systems-design'
| '/misting-technology'
| '/nozzles'
| '/portable-misting-fans'
| '/professional-pre-cooling'
| '/projects'
| '/rental'
| '/solutions'
| '/residential-outdoor-cooling'
| '/sanitization-booth'
| '/satellite-misting-fans'
id:
| '__root__'
| '/'
| '/about'
| '/applications'
| '/air-cooler'
| '/animal-cooling'
| '/commercial-outdoor-cooling'
| '/contact'
| '/dust-suppression'
| '/enquiry'
| '/products'
| '/faq'
| '/humidification'
| '/industrial-outdoor-cooling'
| '/misting-fittings-tubings'
| '/misting-pumps'
| '/misting-systems-accessories'
| '/misting-systems-design'
| '/misting-technology'
| '/nozzles'
| '/portable-misting-fans'
| '/professional-pre-cooling'
| '/projects'
| '/rental'
| '/solutions'
| '/residential-outdoor-cooling'
| '/sanitization-booth'
| '/satellite-misting-fans'
fileRoutesById: FileRoutesById
}
export interface RootRouteChildren {
IndexRoute: typeof IndexRoute
AboutRoute: typeof AboutRoute
ApplicationsRoute: typeof ApplicationsRoute
AirCoolerRoute: typeof AirCoolerRoute
AnimalCoolingRoute: typeof AnimalCoolingRoute
CommercialOutdoorCoolingRoute: typeof CommercialOutdoorCoolingRoute
ContactRoute: typeof ContactRoute
DustSuppressionRoute: typeof DustSuppressionRoute
EnquiryRoute: typeof EnquiryRoute
ProductsRoute: typeof ProductsRoute
FaqRoute: typeof FaqRoute
HumidificationRoute: typeof HumidificationRoute
IndustrialOutdoorCoolingRoute: typeof IndustrialOutdoorCoolingRoute
MistingFittingsTubingsRoute: typeof MistingFittingsTubingsRoute
MistingPumpsRoute: typeof MistingPumpsRoute
MistingSystemsAccessoriesRoute: typeof MistingSystemsAccessoriesRoute
MistingSystemsDesignRoute: typeof MistingSystemsDesignRoute
MistingTechnologyRoute: typeof MistingTechnologyRoute
NozzlesRoute: typeof NozzlesRoute
PortableMistingFansRoute: typeof PortableMistingFansRoute
ProfessionalPreCoolingRoute: typeof ProfessionalPreCoolingRoute
ProjectsRoute: typeof ProjectsRoute
RentalRoute: typeof RentalRoute
SolutionsRoute: typeof SolutionsRoute
ResidentialOutdoorCoolingRoute: typeof ResidentialOutdoorCoolingRoute
SanitizationBoothRoute: typeof SanitizationBoothRoute
SatelliteMistingFansRoute: typeof SatelliteMistingFansRoute
}
declare module '@tanstack/react-router' {
interface FileRoutesByPath {
'/solutions': {
id: '/solutions'
path: '/solutions'
fullPath: '/solutions'
preLoaderRoute: typeof SolutionsRouteImport
parentRoute: typeof rootRouteImport
}
'/rental': {
id: '/rental'
path: '/rental'
fullPath: '/rental'
preLoaderRoute: typeof RentalRouteImport
parentRoute: typeof rootRouteImport
}
'/projects': {
id: '/projects'
path: '/projects'
fullPath: '/projects'
preLoaderRoute: typeof ProjectsRouteImport
parentRoute: typeof rootRouteImport
}
'/products': {
id: '/products'
path: '/products'
fullPath: '/products'
preLoaderRoute: typeof ProductsRouteImport
parentRoute: typeof rootRouteImport
}
'/enquiry': {
id: '/enquiry'
path: '/enquiry'
fullPath: '/enquiry'
preLoaderRoute: typeof EnquiryRouteImport
parentRoute: typeof rootRouteImport
}
'/contact': {
id: '/contact'
path: '/contact'
fullPath: '/contact'
preLoaderRoute: typeof ContactRouteImport
parentRoute: typeof rootRouteImport
}
'/applications': {
id: '/applications'
path: '/applications'
fullPath: '/applications'
preLoaderRoute: typeof ApplicationsRouteImport
'/': {
id: '/'
path: '/'
fullPath: '/'
preLoaderRoute: typeof IndexRouteImport
parentRoute: typeof rootRouteImport
}
'/about': {
@@ -205,11 +362,158 @@ declare module '@tanstack/react-router' {
preLoaderRoute: typeof AboutRouteImport
parentRoute: typeof rootRouteImport
}
'/': {
id: '/'
path: '/'
fullPath: '/'
preLoaderRoute: typeof IndexRouteImport
'/air-cooler': {
id: '/air-cooler'
path: '/air-cooler'
fullPath: '/air-cooler'
preLoaderRoute: typeof AirCoolerRouteImport
parentRoute: typeof rootRouteImport
}
'/animal-cooling': {
id: '/animal-cooling'
path: '/animal-cooling'
fullPath: '/animal-cooling'
preLoaderRoute: typeof AnimalCoolingRouteImport
parentRoute: typeof rootRouteImport
}
'/commercial-outdoor-cooling': {
id: '/commercial-outdoor-cooling'
path: '/commercial-outdoor-cooling'
fullPath: '/commercial-outdoor-cooling'
preLoaderRoute: typeof CommercialOutdoorCoolingRouteImport
parentRoute: typeof rootRouteImport
}
'/contact': {
id: '/contact'
path: '/contact'
fullPath: '/contact'
preLoaderRoute: typeof ContactRouteImport
parentRoute: typeof rootRouteImport
}
'/dust-suppression': {
id: '/dust-suppression'
path: '/dust-suppression'
fullPath: '/dust-suppression'
preLoaderRoute: typeof DustSuppressionRouteImport
parentRoute: typeof rootRouteImport
}
'/enquiry': {
id: '/enquiry'
path: '/enquiry'
fullPath: '/enquiry'
preLoaderRoute: typeof EnquiryRouteImport
parentRoute: typeof rootRouteImport
}
'/faq': {
id: '/faq'
path: '/faq'
fullPath: '/faq'
preLoaderRoute: typeof FaqRouteImport
parentRoute: typeof rootRouteImport
}
'/humidification': {
id: '/humidification'
path: '/humidification'
fullPath: '/humidification'
preLoaderRoute: typeof HumidificationRouteImport
parentRoute: typeof rootRouteImport
}
'/industrial-outdoor-cooling': {
id: '/industrial-outdoor-cooling'
path: '/industrial-outdoor-cooling'
fullPath: '/industrial-outdoor-cooling'
preLoaderRoute: typeof IndustrialOutdoorCoolingRouteImport
parentRoute: typeof rootRouteImport
}
'/misting-fittings-tubings': {
id: '/misting-fittings-tubings'
path: '/misting-fittings-tubings'
fullPath: '/misting-fittings-tubings'
preLoaderRoute: typeof MistingFittingsTubingsRouteImport
parentRoute: typeof rootRouteImport
}
'/misting-pumps': {
id: '/misting-pumps'
path: '/misting-pumps'
fullPath: '/misting-pumps'
preLoaderRoute: typeof MistingPumpsRouteImport
parentRoute: typeof rootRouteImport
}
'/misting-systems-accessories': {
id: '/misting-systems-accessories'
path: '/misting-systems-accessories'
fullPath: '/misting-systems-accessories'
preLoaderRoute: typeof MistingSystemsAccessoriesRouteImport
parentRoute: typeof rootRouteImport
}
'/misting-systems-design': {
id: '/misting-systems-design'
path: '/misting-systems-design'
fullPath: '/misting-systems-design'
preLoaderRoute: typeof MistingSystemsDesignRouteImport
parentRoute: typeof rootRouteImport
}
'/misting-technology': {
id: '/misting-technology'
path: '/misting-technology'
fullPath: '/misting-technology'
preLoaderRoute: typeof MistingTechnologyRouteImport
parentRoute: typeof rootRouteImport
}
'/nozzles': {
id: '/nozzles'
path: '/nozzles'
fullPath: '/nozzles'
preLoaderRoute: typeof NozzlesRouteImport
parentRoute: typeof rootRouteImport
}
'/portable-misting-fans': {
id: '/portable-misting-fans'
path: '/portable-misting-fans'
fullPath: '/portable-misting-fans'
preLoaderRoute: typeof PortableMistingFansRouteImport
parentRoute: typeof rootRouteImport
}
'/professional-pre-cooling': {
id: '/professional-pre-cooling'
path: '/professional-pre-cooling'
fullPath: '/professional-pre-cooling'
preLoaderRoute: typeof ProfessionalPreCoolingRouteImport
parentRoute: typeof rootRouteImport
}
'/projects': {
id: '/projects'
path: '/projects'
fullPath: '/projects'
preLoaderRoute: typeof ProjectsRouteImport
parentRoute: typeof rootRouteImport
}
'/rental': {
id: '/rental'
path: '/rental'
fullPath: '/rental'
preLoaderRoute: typeof RentalRouteImport
parentRoute: typeof rootRouteImport
}
'/residential-outdoor-cooling': {
id: '/residential-outdoor-cooling'
path: '/residential-outdoor-cooling'
fullPath: '/residential-outdoor-cooling'
preLoaderRoute: typeof ResidentialOutdoorCoolingRouteImport
parentRoute: typeof rootRouteImport
}
'/sanitization-booth': {
id: '/sanitization-booth'
path: '/sanitization-booth'
fullPath: '/sanitization-booth'
preLoaderRoute: typeof SanitizationBoothRouteImport
parentRoute: typeof rootRouteImport
}
'/satellite-misting-fans': {
id: '/satellite-misting-fans'
path: '/satellite-misting-fans'
fullPath: '/satellite-misting-fans'
preLoaderRoute: typeof SatelliteMistingFansRouteImport
parentRoute: typeof rootRouteImport
}
}
@@ -218,13 +522,28 @@ declare module '@tanstack/react-router' {
const rootRouteChildren: RootRouteChildren = {
IndexRoute: IndexRoute,
AboutRoute: AboutRoute,
ApplicationsRoute: ApplicationsRoute,
AirCoolerRoute: AirCoolerRoute,
AnimalCoolingRoute: AnimalCoolingRoute,
CommercialOutdoorCoolingRoute: CommercialOutdoorCoolingRoute,
ContactRoute: ContactRoute,
DustSuppressionRoute: DustSuppressionRoute,
EnquiryRoute: EnquiryRoute,
ProductsRoute: ProductsRoute,
FaqRoute: FaqRoute,
HumidificationRoute: HumidificationRoute,
IndustrialOutdoorCoolingRoute: IndustrialOutdoorCoolingRoute,
MistingFittingsTubingsRoute: MistingFittingsTubingsRoute,
MistingPumpsRoute: MistingPumpsRoute,
MistingSystemsAccessoriesRoute: MistingSystemsAccessoriesRoute,
MistingSystemsDesignRoute: MistingSystemsDesignRoute,
MistingTechnologyRoute: MistingTechnologyRoute,
NozzlesRoute: NozzlesRoute,
PortableMistingFansRoute: PortableMistingFansRoute,
ProfessionalPreCoolingRoute: ProfessionalPreCoolingRoute,
ProjectsRoute: ProjectsRoute,
RentalRoute: RentalRoute,
SolutionsRoute: SolutionsRoute,
ResidentialOutdoorCoolingRoute: ResidentialOutdoorCoolingRoute,
SanitizationBoothRoute: SanitizationBoothRoute,
SatelliteMistingFansRoute: SatelliteMistingFansRoute,
}
export const routeTree = rootRouteImport
._addFileChildren(rootRouteChildren)

View File

@@ -7,23 +7,65 @@ import {
HeadContent,
Scripts,
} from "@tanstack/react-router";
import { useEffect, useState, type ReactNode } from "react";
import { Menu, X, Phone } from "lucide-react";
import { useState, type ReactNode } from "react";
import { Menu, X, Phone, ChevronDown } from "lucide-react";
import { ScrollToTop } from "@/components/scroll-to-top";
import { QuickContact } from "@/components/quick-contact";
import appCss from "../styles.css?url";
import { reportLovableError } from "../lib/lovable-error-reporting";
const NAV = [
{ to: "/", label: "Home" },
{ to: "/about", label: "About" },
{ to: "/applications", label: "Applications" },
{ to: "/products", label: "Products" },
{ to: "/solutions", label: "Solutions" },
{ to: "/projects", label: "Projects" },
{ to: "/enquiry", label: "Enquiry" },
{ to: "/contact", label: "Contact" },
{ to: "/rental", label: "Rental" },
] as const;
interface NavChild {
label: string;
to: string;
}
interface NavItem {
label: string;
to?: string;
children?: NavChild[];
}
const NAV_ITEMS: NavItem[] = [
{ label: "Home", to: "/" },
{ label: "About Us", to: "/about" },
{
label: "Applications",
children: [
{ label: "Humidification", to: "/humidification" },
{ label: "Commercial Outdoor Cooling", to: "/commercial-outdoor-cooling" },
{ label: "Industrial Outdoor Cooling", to: "/industrial-outdoor-cooling" },
{ label: "Residential Outdoor Cooling", to: "/residential-outdoor-cooling" },
{ label: "Dust Suppression", to: "/dust-suppression" },
{ label: "Animal Cooling", to: "/animal-cooling" },
{ label: "Air Cooler", to: "/air-cooler" },
{ label: "Professional Pre-Cooling System", to: "/professional-pre-cooling" },
],
},
{
label: "Products",
children: [
{ label: "Sanitization Booth", to: "/sanitization-booth" },
{ label: "Nozzles", to: "/nozzles" },
{ label: "Misting Pumps", to: "/misting-pumps" },
{ label: "Portable Misting Fans", to: "/portable-misting-fans" },
{ label: "Satellite Misting Fans", to: "/satellite-misting-fans" },
{ label: "Fittings & Tubing", to: "/misting-fittings-tubings" },
{ label: "Parts & Accessories", to: "/misting-systems-accessories" },
],
},
{
label: "Solutions",
children: [
{ label: "Misting Technology", to: "/misting-technology" },
{ label: "Misting Systems Design", to: "/misting-systems-design" },
{ label: "FAQ", to: "/faq" },
],
},
{ label: "Projects", to: "/projects" },
{ label: "Enquiry", to: "/enquiry" },
{ label: "Contact Us", to: "/contact" },
{ label: "RENTAL", to: "/rental" },
];
function TopBar() {
return (
@@ -40,32 +82,118 @@ function TopBar() {
);
}
function DesktopNavItem({ item }: { item: NavItem }) {
if (!item.children) {
return (
<Link
to={item.to as any}
className="text-foreground/80 hover:text-brand-red transition-colors whitespace-nowrap"
activeProps={{ className: "text-brand-red" }}
activeOptions={{ exact: item.to === "/" }}
>
{item.label}
</Link>
);
}
return (
<div className="group relative">
<button className="inline-flex items-center gap-1 text-foreground/80 hover:text-brand-red transition-colors cursor-pointer whitespace-nowrap">
{item.label}
<ChevronDown className="h-3.5 w-3.5 transition-transform duration-200 group-hover:rotate-180" />
</button>
<div className="absolute left-1/2 -translate-x-1/2 top-full pt-3 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-200 pointer-events-none group-hover:pointer-events-auto">
<div className="bg-white rounded-lg shadow-xl border min-w-[220px] py-2">
{item.children.map((child) => (
<a
key={child.to}
href={child.to}
className="block px-5 py-2.5 text-sm text-foreground/80 hover:text-brand-red hover:bg-muted/50 transition-colors"
>
{child.label}
</a>
))}
</div>
</div>
</div>
);
}
function MobileSubMenu({ item, onLinkClick }: { item: NavItem; onLinkClick: () => void }) {
const [subOpen, setSubOpen] = useState(false);
if (!item.children) {
return (
<Link
to={item.to as any}
onClick={onLinkClick}
className="block text-foreground/80 hover:text-brand-red transition-colors"
activeProps={{ className: "text-brand-red" }}
activeOptions={{ exact: item.to === "/" }}
>
{item.label}
</Link>
);
}
return (
<div>
<button
onClick={() => setSubOpen((v) => !v)}
className="flex items-center justify-between w-full text-foreground/80 hover:text-brand-red transition-colors cursor-pointer"
>
{item.label}
<ChevronDown
className={`h-4 w-4 transition-transform duration-200 ${subOpen ? "rotate-180" : ""}`}
/>
</button>
<div
className={`overflow-hidden transition-all duration-200 ${
subOpen ? "max-h-96 opacity-100 mt-2" : "max-h-0 opacity-0"
}`}
>
<div className="ml-4 border-l pl-4 space-y-2 pb-2">
{item.children.map((child) => (
<a
key={child.to}
href={child.to}
onClick={onLinkClick}
className="block text-sm text-foreground/70 hover:text-brand-red transition-colors"
>
{child.label}
</a>
))}
</div>
</div>
</div>
);
}
function Header() {
const [open, setOpen] = useState(false);
return (
<header className="sticky top-0 z-50 bg-background/95 backdrop-blur border-b">
<div className="container-page flex items-center justify-between h-20">
<Link to="/" className="flex items-baseline gap-1 font-display">
<span className="text-3xl font-black tracking-tight">
<span className="text-brand-blue">Pro</span>
<span className="text-brand-red">mist</span>
</span>
<span className="text-xs uppercase tracking-[0.2em] text-muted-foreground hidden sm:inline">
Misting Systems
</span>
<Link to="/" className="flex items-center shrink-0">
<img src="/promist-logo.png" alt="Promist" className="h-10 w-auto" />
</Link>
<nav className="hidden lg:flex items-center gap-7 text-sm font-medium">
{NAV.map((n) => (
<Link
key={n.to}
to={n.to}
className="text-foreground/80 hover:text-brand-red transition-colors"
activeProps={{ className: "text-brand-red" }}
activeOptions={{ exact: n.to === "/" }}
>
{n.label}
</Link>
))}
<nav className="hidden lg:flex items-center gap-6 text-sm font-medium">
{NAV_ITEMS.map((item) =>
"children" in item && item.children ? (
<DesktopNavItem key={item.label} item={item} />
) : (
<Link
key={item.to}
to={item.to as any}
className="text-foreground/80 hover:text-brand-red transition-colors whitespace-nowrap"
activeProps={{ className: "text-brand-red" }}
activeOptions={{ exact: item.to === "/" }}
>
{item.label}
</Link>
),
)}
</nav>
<button
onClick={() => setOpen((v) => !v)}
@@ -78,17 +206,8 @@ function Header() {
{open && (
<div className="lg:hidden border-t">
<div className="container-page py-4 flex flex-col gap-3">
{NAV.map((n) => (
<Link
key={n.to}
to={n.to}
onClick={() => setOpen(false)}
className="text-foreground/80 hover:text-brand-red"
activeProps={{ className: "text-brand-red" }}
activeOptions={{ exact: n.to === "/" }}
>
{n.label}
</Link>
{NAV_ITEMS.map((item) => (
<MobileSubMenu key={item.label} item={item} onLinkClick={() => setOpen(false)} />
))}
</div>
</div>
@@ -101,45 +220,82 @@ function Footer() {
return (
<footer className="mt-24 border-t bg-muted/40">
<div className="container-page py-14 grid gap-10 md:grid-cols-4">
{/* Brand */}
<div>
<div className="font-display text-2xl font-black">
<span className="text-brand-blue">Pro</span>
<span className="text-brand-red">mist</span>
</div>
<p className="mt-3 text-sm text-muted-foreground max-w-xs">
High-pressure misting systems for cooling, humidification and dust suppression since 1979.
Promist is a registered trademark &amp; A brand owned by{" "}
<a
href="https://profenuae.com"
target="_blank"
rel="noopener noreferrer"
className="text-brand-red hover:underline"
>
Profen General Trading L.L.C
</a>
</p>
</div>
{/* Explore */}
<div>
<h4 className="text-xs uppercase tracking-widest text-brand-red font-semibold">Explore</h4>
<ul className="mt-4 space-y-2 text-sm">
{NAV.slice(1, 6).map((n) => (
<li key={n.to}>
<Link to={n.to} className="hover:text-brand-red">{n.label}</Link>
</li>
))}
<li><Link to="/about" className="hover:text-brand-red transition-colors">About</Link></li>
<li><Link to="/applications" className="hover:text-brand-red transition-colors">Applications</Link></li>
<li><Link to="/products" className="hover:text-brand-red transition-colors">Products</Link></li>
<li><Link to="/solutions" className="hover:text-brand-red transition-colors">Solutions</Link></li>
<li><Link to="/projects" className="hover:text-brand-red transition-colors">Projects</Link></li>
</ul>
</div>
{/* Company */}
<div>
<h4 className="text-xs uppercase tracking-widest text-brand-red font-semibold">Company</h4>
<ul className="mt-4 space-y-2 text-sm">
<li><Link to="/enquiry" className="hover:text-brand-red">Enquiry</Link></li>
<li><Link to="/contact" className="hover:text-brand-red">Contact</Link></li>
<li><Link to="/rental" className="hover:text-brand-red">Rental</Link></li>
<li><Link to="/enquiry" className="hover:text-brand-red transition-colors">Enquiry</Link></li>
<li><Link to="/contact" className="hover:text-brand-red transition-colors">Contact</Link></li>
<li><Link to="/rental" className="hover:text-brand-red transition-colors">Rental</Link></li>
</ul>
</div>
{/* Contact */}
<div>
<h4 className="text-xs uppercase tracking-widest text-brand-red font-semibold">Contact</h4>
<ul className="mt-4 space-y-2 text-sm text-muted-foreground">
<li>+971 4 251 5596</li>
<li>+971 55 209 8628</li>
<li>Dubai, United Arab Emirates</li>
<li className="flex items-start gap-2">
<span className="font-semibold text-foreground/60 shrink-0">Add:</span>
<span>P.O. Box 181926, Dubai, United Arab Emirates</span>
</li>
<li className="flex items-start gap-2">
<span className="font-semibold text-foreground/60 shrink-0">Tel:</span>
<span>+971 4 2515596</span>
</li>
<li className="flex items-start gap-2">
<span className="font-semibold text-foreground/60 shrink-0">Mob:</span>
<span>+971 58 2055 252 / +971 50 9952 886</span>
</li>
<li className="flex items-start gap-2">
<span className="font-semibold text-foreground/60 shrink-0">Fax:</span>
<span>+971 4 2857894</span>
</li>
<li className="flex items-start gap-2">
<span className="font-semibold text-foreground/60 shrink-0">Email:</span>
<span className="space-x-1">
<a href="mailto:info@promistcool.com" className="hover:text-brand-red transition-colors">info@promistcool.com</a>
<span>, </span>
<a href="mailto:sales@promistcool.com" className="hover:text-brand-red transition-colors">sales@promistcool.com</a>
</span>
</li>
<li className="flex items-start gap-2 pt-2">
<span className="font-semibold text-foreground/60 shrink-0">Call:</span>
<span>+971 50 995 2886</span>
</li>
</ul>
</div>
</div>
<div className="border-t">
<div className="container-page py-5 text-xs text-muted-foreground flex flex-wrap justify-between gap-2">
<span>© {new Date().getFullYear()} Promist Misting Systems. All rights reserved.</span>
<span>&copy; 2026 Promist Misting Systems. All rights reserved.</span>
<span>Humidity and Control</span>
</div>
</div>
@@ -167,9 +323,6 @@ function NotFoundComponent() {
function ErrorComponent({ error, reset }: { error: Error; reset: () => void }) {
console.error(error);
const router = useRouter();
useEffect(() => {
reportLovableError(error, { boundary: "tanstack_root_error_component" });
}, [error]);
return (
<div className="flex min-h-[70vh] items-center justify-center px-4">
<div className="max-w-md text-center">
@@ -201,7 +354,7 @@ export const Route = createRootRouteWithContext<{ queryClient: QueryClient }>()(
],
links: [
{ rel: "stylesheet", href: appCss },
{ rel: "icon", href: "/favicon.ico", type: "image/x-icon" },
{ rel: "icon", href: "/favicon.png", type: "image/png" },
{ rel: "preconnect", href: "https://fonts.googleapis.com" },
{ rel: "preconnect", href: "https://fonts.gstatic.com", crossOrigin: "anonymous" },
{ rel: "stylesheet", href: "https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@300;400;500;600;700;800;900&display=swap" },
@@ -232,6 +385,8 @@ function RootComponent() {
<Outlet />
</main>
<Footer />
<ScrollToTop />
<QuickContact />
</QueryClientProvider>
);
}

View File

@@ -1,5 +1,6 @@
import { createFileRoute } from "@tanstack/react-router";
import { PageHero, Section, CTA } from "@/components/page-shell";
import { createFileRoute, Link } from "@tanstack/react-router";
import { ArrowUpRight } from "lucide-react";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/about")({
head: () => ({
@@ -13,44 +14,63 @@ export const Route = createFileRoute("/about")({
component: About,
});
const HERO_IMG = "/wp-uploads/2017/04/about-banner1.jpg";
function About() {
return (
<>
<PageHero
eyebrow="About us"
title="Manufacturers of high-pressure misting since 1979."
lede="We design, build and install misting systems for cooling, humidification, dust suppression and sanitization — from residential patios to industrial factories."
/>
<Section>
<div className="grid lg:grid-cols-3 gap-12">
<div className="lg:col-span-2 space-y-6 text-lg text-muted-foreground">
<p>
For more than four decades, Promist has been engineering high-pressure misting systems for the harshest climates in
the region. Our systems force water through specially designed nozzles, creating an ultra-fine mist that evaporates
instantly to cool the surrounding air.
</p>
<p>
We manufacture and sell at factory-direct prices, giving our customers full control over quality, delivery and cost.
From the smallest residential patio to full industrial deployments, every project is engineered from first principles.
</p>
<SubPageLayout
eyebrow="About us"
title="Manufacturers of high-pressure misting since 1979."
lede="We design, build and install misting systems for cooling, humidification, dust suppression and sanitization — from residential patios to industrial factories."
>
<div className="grid lg:grid-cols-2 gap-14 items-start">
<div>
<img src={HERO_IMG} alt="About Promist" className="w-full h-auto" />
</div>
<div className="space-y-5 text-muted-foreground" style={{ textAlign: "justify" }}>
<p>
<strong>Promist Cool</strong> specialty lies in misting, fog and humidification systems that provide you
with a technology that helps control or enhance environments. But telling the difference between our
product and every other fog and misting system on the market is difficult if you aren't familiar
with the possibilities. <strong>Promist Cool</strong> breaks down the intricacies of fog and misting
systems, with an emphasis on the high-pressure pump. But how valuable is "quality" and the
"absolutely critical features" found in a pump?
</p>
<p>
Quality does not have a specific number. It's not a qualitative measurement. It's more of a
general sense of something that's better.
</p>
<p>
Do you need to attract people to your resort, restaurant or spa during the hottest time of the year? Do
you need to create a safer industrial environment for your employees? Perhaps you need to regulate the
temperatures to prevent heat stress in your cattle, your horses, our children or our rescue operatives?
It is precisely because of the necessary results of outdoor cooling, humidification and fog effects that
concepts such as "quality" and "absolutely critical features" matter. Quality
protects your investment and ensures that you have a system that performs for years and years to come.
</p>
<p>
<strong>Promist Cool</strong> brand of fog and misting systems not only adds a category to the general
landscape of upgrades, but we also commit ourselves in engineering and designing the best systems
you'll ever experience. And who knows what this could turn into.
</p>
</div>
</div>
<section className="bg-foreground text-background mt-20">
<div className="py-16 grid md:grid-cols-2 gap-6 items-center">
<div>
<h3 className="font-display text-3xl md:text-4xl font-black">
<span className="text-brand-blue">Questions?</span>{" "}
<span>Call Now: +971 4 320 3552</span>
</h3>
</div>
<div className="border-l pl-8 space-y-6">
<div>
<div className="text-xs uppercase tracking-widest text-brand-red font-semibold">Mission</div>
<p className="mt-2">Deliver reliable humidity and cooling control, everywhere it's needed.</p>
</div>
<div>
<div className="text-xs uppercase tracking-widest text-brand-red font-semibold">Vision</div>
<p className="mt-2">To be the region's most trusted misting technology partner.</p>
</div>
<div>
<div className="text-xs uppercase tracking-widest text-brand-red font-semibold">Values</div>
<p className="mt-2">Craft, quality, and unwavering customer service.</p>
</div>
<div className="flex md:justify-end">
<Link to="/enquiry" className="inline-flex items-center gap-2 bg-white text-foreground font-bold px-8 py-4 rounded-md text-sm uppercase tracking-wider hover:opacity-90">
Book now <ArrowUpRight className="h-4 w-4" />
</Link>
</div>
</div>
</Section>
<CTA />
</>
</section>
</SubPageLayout>
);
}

204
src/routes/air-cooler.tsx Normal file
View File

@@ -0,0 +1,204 @@
import { useState } from "react";
import { createFileRoute } from "@tanstack/react-router";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/air-cooler")({
head: () => ({
meta: [
{ title: "Air Cooler — Promist" },
{
name: "description",
content:
"High-performance evaporative air coolers for industrial, commercial, and residential applications.",
},
],
}),
component: ApplicationsAirCooler,
});
interface SpecRow {
label: string;
value: string;
}
interface ProductVariant {
title: string;
image: string;
specs: SpecRow[];
}
const products: ProductVariant[] = [
{
title: "New Ducted Window Air Coolers",
image: "/wp-uploads/2017/05/pm-a18s.jpg",
specs: [
{ label: "Item No.", value: "PM-A18S" },
{ label: "Air flow rate", value: "18000m³/h" },
{ label: "Voltage", value: "220V / 380V" },
{ label: "Frequency", value: "50-60Hz" },
{ label: "Power", value: "1100W" },
{ label: "Wind pressure", value: "180Pa" },
{ label: "Water consumption", value: "5-10L/H" },
{ label: "Water tank capacity", value: "25L" },
{ label: "External air opening size", value: "670mm × 670mm" },
{ label: "Overall size", value: "1100 × 1100 × 950mm" },
{ label: "Package size", value: "1150 × 1150 × 1000mm" },
{ label: "Blower type", value: "Axial-flow type" },
{ label: "Casing material", value: "Plastic" },
{ label: "Application area", value: "100-120 sq.m" },
{ label: "Motor", value: "One speed, Three speed" },
{ label: "Noise", value: "≤75dB" },
{ label: "Air-out-way", value: "Blow-Down / Blow-Up / Blow-Side" },
],
},
{
title: "Mobile Air Cooler",
image: "/wp-uploads/2017/05/pm-12.jpg",
specs: [
{ label: "Item No.", value: "PM-12" },
{ label: "Air flow rate", value: "12000m³/h" },
{ label: "Voltage", value: "120-127V / 220-240V" },
{ label: "Frequency", value: "50-60Hz" },
{ label: "Power", value: "450W" },
{ label: "Wind pressure", value: "120Pa" },
{ label: "Water consumption", value: "10-12L/H" },
{ label: "Water tank capacity", value: "50L" },
{ label: "External air opening size", value: "630mm × 650mm" },
{ label: "Package size", value: "940 × 600 × 1320mm" },
{ label: "Blower type", value: "Axial-flow type" },
{ label: "Casing material", value: "Plastic" },
{ label: "Application area", value: "100-150 sq.m" },
{ label: "Motor", value: "One speed, 3-phase" },
{ label: "Noise", value: "≤68dB" },
{ label: "Air-out-way", value: "Blow-side" },
],
},
{
title: "Evaporative Air Coolers",
image: "/wp-uploads/2017/05/pm-70.jpg",
specs: [
{ label: "Item No.", value: "PM-70" },
{ label: "Air flow rate", value: "7000m³/h" },
{ label: "Voltage", value: "120-127V / 220-240V" },
{ label: "Frequency", value: "50-60Hz" },
{ label: "Power", value: "290W" },
{ label: "Wind pressure", value: "60Pa" },
{ label: "Water consumption", value: "4-6L/H" },
{ label: "Water tank capacity", value: "70L" },
{ label: "External air opening size", value: "670mm × 670mm" },
{ label: "Overall size", value: "860 × 530 × 1400mm" },
{ label: "Package size", value: "860 × 530 × 1230mm" },
{ label: "Blower type", value: "Axial-flow type" },
{ label: "Casing material", value: "Plastic" },
{ label: "Application area", value: "30-50 sq.m" },
{ label: "Motor", value: "Three speed, 1-phase" },
{ label: "Noise", value: "≤65dB" },
{ label: "Air-out-way", value: "Blow-side" },
],
},
{
title: "Air Cooler",
image: "/wp-uploads/2017/05/pm-18.jpg",
specs: [
{ label: "Item No.", value: "PM-18" },
{ label: "Air flow rate", value: "18000m³/h" },
{ label: "Voltage", value: "120-127V / 220-240V" },
{ label: "Frequency", value: "50-60Hz" },
{ label: "Power", value: "550W" },
{ label: "Wind pressure", value: "120Pa" },
{ label: "Water consumption", value: "10-15L/H" },
{ label: "Water tank capacity", value: "50L" },
{ label: "External air opening size", value: "—" },
],
},
{
title: "X Series Duct Air Cooler",
image: "/wp-uploads/2017/05/pm-x18s.jpg",
specs: [
{ label: "Item No.", value: "PM-X18S" },
{ label: "Air flow rate", value: "18000m³/h" },
{ label: "Voltage", value: "220V / 380V" },
{ label: "Frequency", value: "50-60Hz" },
{ label: "Power", value: "1100W" },
{ label: "Wind pressure", value: "180Pa" },
{ label: "Water consumption", value: "5-10L/H" },
{ label: "Water tank capacity", value: "2L" },
],
},
];
function SpecTable({ specs }: { specs: SpecRow[] }) {
return (
<table className="w-full border-collapse">
<tbody>
{specs.map((row, i) => (
<tr key={i} className="border-b">
<td className="py-2 font-semibold w-1/2">{row.label}</td>
<td className="py-2">{row.value}</td>
</tr>
))}
</tbody>
</table>
);
}
function AccordionSection({ product, defaultOpen = false }: { product: ProductVariant; defaultOpen?: boolean }) {
const [open, setOpen] = useState(defaultOpen);
return (
<div className="border rounded-lg overflow-hidden">
<button
onClick={() => setOpen(!open)}
className="flex items-center justify-between w-full px-6 py-4 text-left font-bold text-lg bg-white hover:bg-gray-50 transition-colors"
>
<span>{product.title}</span>
<svg
className={`w-4 h-4 transition-transform ${open ? "rotate-90" : ""}`}
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</button>
{open && (
<div className="px-6 py-4 border-t">
<div className="grid md:grid-cols-[300px_1fr] gap-6 items-start">
<img
src={product.image}
alt={product.title}
className="w-full max-w-[300px] h-auto rounded-lg"
/>
<SpecTable specs={product.specs} />
</div>
</div>
)}
</div>
);
}
function ApplicationsAirCooler() {
return (
<SubPageLayout
eyebrow="Applications"
title="Air Cooler"
lede="Our evaporative air coolers combine the power of high-pressure misting with fan-forced airflow for maximum cooling efficiency."
>
<div className="py-10 px-6 lg:px-10">
<div className="prose max-w-none text-muted-foreground space-y-4 mb-8">
<p>
Promist offers a range of evaporative air coolers designed for various
applications. Our ducted window air coolers and portable units provide
effective, energy-efficient cooling for industrial, commercial, and
residential spaces.
</p>
</div>
<div className="space-y-4">
{products.map((product, i) => (
<AccordionSection key={product.title} product={product} defaultOpen={i === 0} />
))}
</div>
</div>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,76 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/animal-cooling")({
head: () => ({
meta: [
{ title: "Animal Cooling — Promist" },
{ name: "description", content: "Misting systems for livestock cooling, poultry farms, animal shelters, zoos, and equestrian facilities." },
],
}),
component: ApplicationsAnimalCooling,
});
function ApplicationsAnimalCooling() {
return (
<SubPageLayout
eyebrow="Applications"
title="Animal Cooling"
lede="Protect your livestock, poultry, and animals from heat stress with our specialized misting systems designed for animal environments."
>
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>Heat stress in animals can lead to reduced productivity, lower weight gain, decreased milk production, and even mortality. Our high-pressure misting systems provide an effective cooling solution for a wide range of animal environments.</p>
<p>By creating a fine, evaporative mist, our systems can reduce ambient temperatures by up to 15°C, helping animals maintain optimal body temperature and ensuring their health, comfort, and productivity.</p>
</div>
<img src="/wp-uploads/2017/04/animal-cooling.jpg" alt="Animal Cooling" className="w-full h-[300px] object-cover rounded-lg" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-8">Applications</h2>
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Poultry Farms</h3>
<p className="mt-2 text-muted-foreground">Reduce mortality and improve weight gain in broiler and layer houses.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Dairy & Cattle</h3>
<p className="mt-2 text-muted-foreground">Maintain milk production and reduce heat stress in dairy and beef cattle.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Equestrian</h3>
<p className="mt-2 text-muted-foreground">Cool stables, training areas, and horse trailers for equestrian facilities.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Zoos & Wildlife Parks</h3>
<p className="mt-2 text-muted-foreground">Create comfortable environments for animals in zoos, sanctuaries, and wildlife parks.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Animal Shelters</h3>
<p className="mt-2 text-muted-foreground">Keep rescued and sheltered animals comfortable during hot weather.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Pet Facilities</h3>
<p className="mt-2 text-muted-foreground">Cool outdoor runs, kennels, and grooming areas for pet care facilities.</p>
</div>
</div>
</Section>
<Section>
<h2 className="font-display text-3xl font-black mb-6">Benefits for Animal Cooling</h2>
<div className="prose max-w-none text-muted-foreground space-y-4">
<ul className="list-disc pl-6 space-y-2">
<li>Reduces heat stress and related health issues</li>
<li>Improves feed conversion and weight gain</li>
<li>Maintains milk and egg production during hot months</li>
<li>Low energy consumption compared to fans and air conditioning</li>
<li>Automatic operation with thermostatic controls</li>
<li>Corrosion-resistant materials for humid environments</li>
<li>Reduces fly and pest populations</li>
</ul>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -1,42 +0,0 @@
import { createFileRoute } from "@tanstack/react-router";
import { PageHero, Section, FeatureRow, CTA } from "@/components/page-shell";
import { Droplets, Wind, Factory, Sparkles, TreePine, Warehouse } from "lucide-react";
export const Route = createFileRoute("/applications")({
head: () => ({
meta: [
{ title: "Applications — Promist Misting Systems" },
{ name: "description", content: "Cost-effective misting solutions for industrial, commercial, residential, warehouses, greenhouses, gardens, patios and more." },
{ property: "og:title", content: "Applications" },
{ property: "og:description", content: "Misting applications across industrial, commercial and residential settings." },
],
}),
component: Applications,
});
const APPS = [
{ img: "https://promistcool.com/wp-content/uploads/2016/03/humidification-misting.jpg", title: "Humidification", body: "Commercial and industrial environments where controlling humidity or temperature provides enhanced profitability, product quality and process reliability.", Icon: Droplets },
{ img: "https://promistcool.com/wp-content/uploads/2016/03/commercial-misting.jpg", title: "Commercial Outdoor Cooling", body: "When temperatures rise into the 45s and above, patio dining and outdoor bar areas become uninhabitable money losers. Misting brings them back to life.", Icon: Wind, reverse: true },
{ img: "https://promistcool.com/wp-content/uploads/2016/03/industrial-misting.jpg", title: "Industrial Cooling", body: "Create a safer and more productive working environment. Cooling employees, equipment and processes across factories and warehouses.", Icon: Factory },
{ img: "https://promistcool.com/wp-content/uploads/2020/04/banner-sanitz.jpg", title: "Special Effects", body: "Showcase incredible landscapes, swimming pools, events, expos, amusement parks and sports events with an atmospheric mist.", Icon: Sparkles, reverse: true },
{ img: "https://promistcool.com/wp-content/uploads/2017/04/new-banner.jpg", title: "Greenhouses & Gardens", body: "Precise humidity control keeps plants healthy, improves yields and reduces water consumption compared to traditional irrigation.", Icon: TreePine },
{ img: "https://promistcool.com/wp-content/uploads/2017/04/banner4.jpg", title: "Warehouses & Factories", body: "Suppress airborne dust, cool loading bays and keep goods in ideal conditions — even during the hottest months.", Icon: Warehouse, reverse: true },
];
function Applications() {
return (
<>
<PageHero
eyebrow="Applications"
title="A cost-effective solution for cooling and humidification."
lede="Promist misting systems adapt to industrial, commercial, residential, warehouses, greenhouses, gardens, zoos, patios, parks and amusement areas."
/>
<Section>
<div className="space-y-24">
{APPS.map((a) => <FeatureRow key={a.title} {...a} />)}
</div>
</Section>
<CTA />
</>
);
}

View File

@@ -0,0 +1,54 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/commercial-outdoor-cooling")({
head: () => ({
meta: [
{ title: "Commercial Outdoor Cooling — Promist" },
{ name: "description", content: "High-pressure misting systems for commercial outdoor cooling at restaurants, hotels, resorts, and event spaces." },
],
}),
component: ApplicationsCommercialOutdoorCooling,
});
function ApplicationsCommercialOutdoorCooling() {
return (
<SubPageLayout
eyebrow="Applications"
title="Commercial Outdoor Cooling"
lede="We provide high pressure cooling systems for commercial indoor and outdoor areas. The system uses the cooling effect created by evaporating water micro-droplets in the air."
>
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>Our misting systems are the most efficient and effective solution for cooling commercial outdoor spaces. By forcing water through specially designed nozzles at high pressure, we create billions of ultra-fine micro-droplets that evaporate instantly, absorbing heat from the surrounding air and reducing ambient temperature by up to 15°C.</p>
<p>Perfect for restaurants, cafes, hotels, resorts, theme parks, shopping centers, and event venues looking to enhance customer comfort and extend the usability of outdoor spaces during hot weather.</p>
</div>
<img src="/wp-uploads/2017/04/commercial-outdoor-cooling.jpg" alt="Commercial Outdoor Cooling" className="w-full h-[300px] object-cover rounded-lg" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-8">Key Benefits</h2>
<div className="grid md:grid-cols-2 gap-6">
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Extend Outdoor Seasons</h3>
<p className="mt-2 text-muted-foreground">Use your outdoor spaces comfortably even during the hottest months, increasing revenue potential.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Energy Efficient</h3>
<p className="mt-2 text-muted-foreground">Our high-pressure systems consume minimal electricity compared to traditional air conditioning.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Customer Comfort</h3>
<p className="mt-2 text-muted-foreground">Create a pleasant, cool environment that keeps customers comfortable and encourages longer visits.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Low Maintenance</h3>
<p className="mt-2 text-muted-foreground">Designed for durability with minimal maintenance requirements, our systems are built to last.</p>
</div>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -1,6 +1,7 @@
import { createFileRoute } from "@tanstack/react-router";
import { PageHero, Section, CTA } from "@/components/page-shell";
import { Phone, Mail, MapPin } from "lucide-react";
import { useState } from "react";
import { SubPageLayout } from "@/components/sub-page-layout";
import { Phone, Mail, MapPin, Printer, Smartphone, Send } from "lucide-react";
export const Route = createFileRoute("/contact")({
head: () => ({
@@ -14,28 +15,86 @@ export const Route = createFileRoute("/contact")({
component: Contact,
});
function Contact() {
const CONTACTS = [
{ I: MapPin, t: "Address", l: ["P.O. Box 181926", "Dubai, United Arab Emirates"] },
{ I: Phone, t: "Phone", l: ["+971 4 251 5596", "+971 4 320 3552", "+971 55 209 8628"] },
{ I: Smartphone, t: "Mobile", l: ["+971 58 2055 252", "+971 50 9952 886"] },
{ I: Mail, t: "Email", l: ["info@promistcool.com", "sales@promistcool.com"] },
{ I: Printer, t: "Fax", l: ["+971 4 285 7894"] },
];
function ContactForm() {
const [name, setName] = useState("");
const [email, setEmail] = useState("");
const [message, setMessage] = useState("");
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
const subject = encodeURIComponent("Contact from " + name);
const body = encodeURIComponent(message + "\n\nFrom: " + name + "\nEmail: " + email);
window.location.href = "mailto:sales@promistcool.com?subject=" + subject + "&body=" + body;
setName("");
setEmail("");
setMessage("");
};
return (
<>
<PageHero eyebrow="Contact" title="Get in touch." lede="Our team is available across office hours to answer questions and provide quotes." />
<Section>
<div className="grid md:grid-cols-3 gap-10">
{[
{ I: Phone, t: "Call", l: ["+971 4 251 5596", "+971 55 209 8628"] },
{ I: Mail, t: "Email", l: ["info@promistcool.com", "sales@promistcool.com"] },
{ I: MapPin, t: "Visit", l: ["Dubai, United Arab Emirates"] },
].map((c) => (
<div key={c.t} className="border-t pt-6">
<c.I className="h-6 w-6 text-brand-red" />
<h3 className="mt-4 font-display text-2xl font-black">{c.t}</h3>
<div className="mt-3 space-y-1 text-muted-foreground">
{c.l.map((line) => <p key={line}>{line}</p>)}
</div>
</div>
))}
</div>
</Section>
<CTA />
</>
<form onSubmit={handleSubmit} className="space-y-5">
<div>
<label htmlFor="name" className="block text-sm font-medium text-foreground/80 mb-1.5">Name</label>
<input id="name" type="text" placeholder="Your name" value={name} onChange={(e) => setName(e.target.value)} required className="border rounded-lg px-4 py-2.5 w-full" />
</div>
<div>
<label htmlFor="email" className="block text-sm font-medium text-foreground/80 mb-1.5">Email</label>
<input id="email" type="email" placeholder="Your email" value={email} onChange={(e) => setEmail(e.target.value)} required className="border rounded-lg px-4 py-2.5 w-full" />
</div>
<div>
<label htmlFor="message" className="block text-sm font-medium text-foreground/80 mb-1.5">Message</label>
<textarea id="message" placeholder="How can we help?" value={message} onChange={(e) => setMessage(e.target.value)} required rows={5} className="border rounded-lg px-4 py-2.5 w-full resize-none" />
</div>
<button type="submit" className="bg-brand-red text-white px-6 py-2.5 rounded-lg font-medium hover:opacity-90 inline-flex items-center gap-2">
<Send className="h-4 w-4" />
Send Message
</button>
</form>
);
}
function Contact() {
return (
<SubPageLayout eyebrow="Contact" title="Get in touch." lede="Our team is available across office hours to answer questions and provide quotes.">
<div className="grid md:grid-cols-3 lg:grid-cols-5 gap-8">
{CONTACTS.map((c) => (
<div key={c.t} className="border-t pt-6">
<c.I className="h-6 w-6 text-brand-red" />
<h3 className="mt-4 font-display text-2xl font-black">{c.t}</h3>
<div className="mt-3 space-y-1 text-muted-foreground">
{c.l.map((line) => <p key={line}>{line}</p>)}
</div>
</div>
))}
</div>
<div className="mt-20 grid md:grid-cols-2 gap-10">
<div>
<h2 className="font-display text-2xl font-black mb-6">Send us a message</h2>
<ContactForm />
</div>
<div>
<h2 className="font-display text-2xl font-black mb-6">Find us</h2>
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3612.0!2d55.27!3d25.2!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x0!2zMjXCsDEyJzAwLjAiTiA1NcKwMTYnMTIuMCJF!5e0!3m2!1sen!2sae!4v1"
width="100%"
height="400"
style={{ border: 0 }}
allowFullScreen
loading="lazy"
referrerPolicy="no-referrer-when-downgrade"
title="Promist location in Dubai"
className="rounded-lg"
/>
</div>
</div>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,76 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/dust-suppression")({
head: () => ({
meta: [
{ title: "Dust Suppression — Promist" },
{ name: "description", content: "High-pressure misting systems for effective dust suppression in mining, construction, and industrial applications." },
],
}),
component: ApplicationsDustSuppression,
});
function ApplicationsDustSuppression() {
return (
<SubPageLayout
eyebrow="Applications"
title="Dust Suppression"
lede="Effective dust control solutions using high-pressure misting technology for mining, construction, demolition, and industrial processing environments."
>
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>Dust suppression is critical in many industries for workplace safety, environmental compliance, and equipment protection. Our high-pressure misting systems create ultra-fine water droplets (8-10 microns) that bond with airborne dust particles, causing them to fall to the ground efficiently.</p>
<p>Unlike traditional water spraying methods that use large amounts of water and create muddy conditions, our misting systems use minimal water while achieving superior dust capture rates.</p>
</div>
<img src="/wp-uploads/2017/04/dust-suppression.jpg" alt="Dust Suppression" className="w-full h-[300px] object-cover rounded-lg" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-8">Applications</h2>
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Mining & Quarries</h3>
<p className="mt-2 text-muted-foreground">Control airborne dust from crushing, screening, and material handling operations.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Construction & Demolition</h3>
<p className="mt-2 text-muted-foreground">Suppress dust at construction sites and during demolition activities.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Waste Management</h3>
<p className="mt-2 text-muted-foreground">Control dust at transfer stations, landfills, and recycling facilities.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Manufacturing</h3>
<p className="mt-2 text-muted-foreground">Reduce airborne particulates in industrial processing and manufacturing plants.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Agriculture</h3>
<p className="mt-2 text-muted-foreground">Suppress dust in grain handling, feed mills, and livestock operations.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Ports & Shipping</h3>
<p className="mt-2 text-muted-foreground">Control dust from bulk material loading, unloading, and storage.</p>
</div>
</div>
</Section>
<Section>
<h2 className="font-display text-3xl font-black mb-6">Why Misting for Dust Suppression?</h2>
<div className="prose max-w-none text-muted-foreground space-y-4">
<ul className="list-disc pl-6 space-y-2">
<li>Ultra-fine droplets (8-10 microns) capture even respirable dust particles</li>
<li>Uses 90% less water than traditional spray systems</li>
<li>No runoff or mud formation</li>
<li>Can be automated with timers, sensors, and remote controls</li>
<li>Low energy consumption</li>
<li>No chemical additives required uses plain water</li>
<li>Compliant with environmental regulations</li>
</ul>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -1,7 +1,7 @@
import { createFileRoute } from "@tanstack/react-router";
import { PageHero, Section } from "@/components/page-shell";
import { useState } from "react";
import { SubPageLayout } from "@/components/sub-page-layout";
import { ArrowUpRight } from "lucide-react";
import { useRef, useState } from "react";
export const Route = createFileRoute("/enquiry")({
head: () => ({
@@ -16,56 +16,66 @@ export const Route = createFileRoute("/enquiry")({
});
function Enquiry() {
const formRef = useRef<HTMLFormElement>(null);
const [sent, setSent] = useState(false);
const [captcha, setCaptcha] = useState("");
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
if (captcha !== "2") {
alert("Please answer the captcha correctly: 1 + 1 = ?");
return;
}
const fd = new FormData(e.currentTarget as HTMLFormElement);
const name = fd.get("name") as string;
const email = fd.get("email") as string;
const phone = fd.get("phone") as string;
const message = fd.get("message") as string;
const subject = encodeURIComponent("Enquiry from promistcool.com");
const body = encodeURIComponent(
`Name: ${name}\nEmail: ${email}\nPhone: ${phone}\n\nMessage:\n${message}`
);
window.location.href = `mailto:info@promistcool.com?subject=${subject}&body=${body}`;
setSent(true);
};
return (
<>
<PageHero
eyebrow="Enquiry"
title="Tell us about your project."
lede="A Promist engineer will get back to you with sizing, pricing and delivery details."
/>
<Section>
<div className="grid lg:grid-cols-5 gap-16">
<form
className="lg:col-span-3 space-y-6"
onSubmit={(e) => { e.preventDefault(); setSent(true); }}
>
{[
{ l: "Full name", n: "name", t: "text" },
{ l: "Email address", n: "email", t: "email" },
{ l: "Phone", n: "phone", t: "tel" },
{ l: "Company (optional)", n: "company", t: "text" },
].map((f) => (
<label key={f.n} className="block">
<span className="text-xs uppercase tracking-widest text-muted-foreground">{f.l}</span>
<input required={f.n !== "company"} type={f.t} name={f.n} className="mt-2 w-full border-b bg-transparent py-3 outline-none focus:border-brand-red" />
</label>
))}
<label className="block">
<span className="text-xs uppercase tracking-widest text-muted-foreground">How can we help?</span>
<textarea required name="message" rows={5} className="mt-2 w-full border-b bg-transparent py-3 outline-none focus:border-brand-red resize-none" />
<SubPageLayout
eyebrow="Enquiry"
title="Tell us about your project."
lede="A Promist engineer will get back to you with sizing, pricing and delivery details."
>
<div className="max-w-2xl">
<form ref={formRef} className="space-y-6" onSubmit={handleSubmit}>
{[
{ l: "Full Name", n: "name", t: "text" },
{ l: "Phone Number", n: "phone", t: "tel" },
{ l: "Email", n: "email", t: "email" },
].map((f) => (
<label key={f.n} className="block">
<span className="text-xs uppercase tracking-widest text-muted-foreground">{f.l}</span>
<input required type={f.t} name={f.n} className="mt-2 w-full border-b bg-transparent py-3 outline-none focus:border-brand-red" />
</label>
<button type="submit" className="inline-flex items-center gap-2 bg-brand-red text-white px-6 py-3.5 rounded-md text-sm font-semibold hover:opacity-90">
{sent ? "Thanks — we'll be in touch" : "Submit enquiry"} <ArrowUpRight className="h-4 w-4" />
</button>
</form>
<aside className="lg:col-span-2 border-l pl-10 space-y-8">
<div>
<div className="text-xs uppercase tracking-widest text-brand-red font-semibold">Call</div>
<p className="mt-2 font-display text-2xl font-bold">+971 4 251 5596</p>
<p className="font-display text-2xl font-bold">+971 55 209 8628</p>
</div>
<div>
<div className="text-xs uppercase tracking-widest text-brand-red font-semibold">Email</div>
<p className="mt-2">info@promistcool.com</p>
</div>
<div>
<div className="text-xs uppercase tracking-widest text-brand-red font-semibold">Location</div>
<p className="mt-2">Dubai, United Arab Emirates</p>
</div>
</aside>
</div>
</Section>
</>
))}
<label className="block">
<span className="text-xs uppercase tracking-widest text-muted-foreground">Message</span>
<textarea required name="message" rows={5} className="mt-2 w-full border-b bg-transparent py-3 outline-none focus:border-brand-red resize-none" />
</label>
<div className="flex items-center gap-3">
<span className="text-sm font-medium">1 + 1 =</span>
<input
type="text"
value={captcha}
onChange={(e) => setCaptcha(e.target.value)}
className="w-20 border-b bg-transparent py-2 outline-none focus:border-brand-red text-center"
required
/>
</div>
<button type="submit" className="inline-flex items-center gap-2 bg-brand-red text-white px-6 py-3.5 rounded-md text-sm font-semibold hover:opacity-90">
{sent ? "Thanks — we'll be in touch" : "Send Message"} <ArrowUpRight className="h-4 w-4" />
</button>
</form>
</div>
</SubPageLayout>
);
}

116
src/routes/faq.tsx Normal file
View File

@@ -0,0 +1,116 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/faq")({
head: () => ({
meta: [
{ title: "Frequently Asked Questions — Promist" },
{ name: "description", content: "Common questions about misting systems: how they work, installation, maintenance, and more." },
],
}),
component: SolutionsFaq,
});
const faqs = [
{
q: "How do misting systems work?",
a: "When connected to a special high pressure pump, water is forced through our patented nozzles and quickly atomized to droplets as small as 8-10 microns. These billions of tiny droplets quickly evaporate, absorbing energy from the air in the form of heat. The result is a temperature reduction of up to 35°F (15°C), depending on ambient temperature and humidity levels."
},
{
q: "Do I need misting fans or misting nozzles?",
a: "For bigger areas, misting fans are the right choice as they provide the cooling power of mist and spread the cool air around a much bigger area. For warehouse cooling, outdoor cooling such as crowd or event cooling, misting fans are also the best choice. For smaller or more confined areas, such as patios and outdoor eating areas, misting systems (nozzle-only) are the better option."
},
{
q: "How is it installed?",
a: "The tubing can be run under eaves, attached to fencing, hidden amongst shrubbery and plants, or suspended from any convenient structure. The nozzles are positioned to provide maximum coverage for the area to be cooled. Our installation teams are fully trained and can install your system quickly and efficiently."
},
{
q: "Will it work in high humidity?",
a: "Yes, although the cooling effect is stronger in dry, arid conditions. Even in humid climates, misting systems provide significant relief through direct contact with the fine mist."
},
{
q: "How many nozzles will a pump feed?",
a: "This depends on the nozzle size and the pump capacity. Our sales team will help you determine the right configuration. Generally, a single pump can feed anywhere from 10 to 50+ nozzles depending on the model."
},
{
q: "What size pump to order?",
a: "We will help you choose the right pump size based on the area to be covered, the number of nozzles required, and the application. Contact us with your requirements and we will provide a recommendation."
},
{
q: "How much water will it use?",
a: "This depends on the number and size of nozzles used. A typical residential system uses approximately 1-2 gallons per hour. The water is atomized into such fine droplets that very little water is actually used."
},
{
q: "What is the minimum inlet water pressure?",
a: "The minimum inlet water pressure required is 1.5 Bar (approximately 22 PSI). The optimal range is 2.0-3.0 Bar (29-44 PSI) for best performance."
},
{
q: "Can tubing be drilled?",
a: "Yes, our stainless steel tubing can be drilled to add additional nozzle positions. This provides flexibility for future system modifications or additions."
},
{
q: "Do I need a filter?",
a: "Yes, a 5-micron water filter is recommended to prevent nozzle blockages. Our systems include filters as standard equipment."
},
{
q: "How often should filters be replaced?",
a: "Filter replacement is recommended every 6 months, or more frequently in areas with poor water quality. Regular filter maintenance ensures consistent system performance."
},
{
q: "Can I install the system myself?",
a: "Some of our simpler DIY misting systems can be installed by homeowners. However, for complex high-pressure installations, we recommend professional installation to ensure optimal performance and warranty compliance."
},
{
q: "Must the system be serviced?",
a: "Yearly servicing is recommended to maintain optimal performance. This includes nozzle inspection, filter replacement, pump maintenance, and system pressure checks. We offer maintenance contracts for ongoing support."
},
{
q: "What is the best nozzle for 1000 PSI?",
a: "For 1000 PSI systems, we recommend nozzles with orifice sizes of 0.006\", 0.008\", or 0.012\". The choice depends on the desired droplet size and coverage area."
},
{
q: "What is the difference between high and low pressure misting?",
a: "Low-pressure systems operate at 30-85 PSI (standard household water pressure) and produce larger droplets that may not fully evaporate. High-pressure systems operate at 1000 PSI (70 BAR) and produce ultra-fine 8-10 micron droplets that evaporate almost instantly, providing superior cooling without wetness."
},
{
q: "How do I winterize my misting system?",
a: "In freezing conditions, remove all nozzles and drain the lines completely. Our systems are designed with drain valves for easy winterization."
},
{
q: "Can you provide what I need?",
a: "With over 37 years of combined industry experience, we can design, supply, install, and maintain misting systems for virtually any application. From residential patios to industrial facilities, we have the expertise and product range to meet your requirements."
},
{
q: "What is your shipping method?",
a: "We ship worldwide via freight on pallets. Systems are carefully packed to prevent damage during transit. Contact us for shipping quotes to your location."
}
];
function SolutionsFaq() {
return (
<SubPageLayout
eyebrow="Solutions"
title="Frequently Asked Questions"
lede="To make life easier for our customers, we have compiled the most commonly asked misting questions below."
>
<Section>
<div className="max-w-3xl mx-auto space-y-4">
{faqs.map((faq, i) => (
<details key={i} className="group border rounded-lg overflow-hidden">
<summary className="flex items-center justify-between p-5 cursor-pointer bg-white hover:bg-muted/30 transition-colors font-semibold text-lg">
{faq.q}
<svg className="w-5 h-5 text-brand-red shrink-0 transition-transform group-open:rotate-180" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
</svg>
</summary>
<div className="px-5 pb-5 text-muted-foreground">
<p>{faq.a}</p>
</div>
</details>
))}
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,201 @@
import { useState } from "react";
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/humidification")({
head: () => ({
meta: [
{ title: "Humidification — Promist Misting Systems" },
{ name: "description", content: "Commercial and industrial humidification solutions using high-pressure misting technology." },
{ property: "og:title", content: "Humidification" },
{ property: "og:description", content: "Precision humidification for commercial and industrial environments." },
],
}),
component: ApplicationsHumidification,
});
interface AccordionSection {
title: string;
content: React.ReactNode;
}
const sections: AccordionSection[] = [
{
title: "Greenhouse Cooling & Humidification with Misting",
content: (
<div className="space-y-4">
<p><strong>Misting systems are used with enormous advantages to keep the right climate inside greenhouses of any dimension.</strong></p>
<p>Misting systems (or Fog systems) play an important role in the greenhouse climatic control. Misting systems are also used with enormous advantages to keep the right temperature and humidity in the environment, under conditions of forced or natural ventilation. In summertime the quick evaporation of the fog will cool the greenhouse due to the principle of evaporative cooling, meanwhile it humidifies the environment in case of low relative humidity.</p>
<p>During the wintertime the system keeps the correct humidity rate preventing the dehydration of the crops caused by heating systems. The environment produced by our system is appropriate for the most delicate crops (ex. the growing of young seedings, the cultivation of tropical plants and in bloom plants) where it is not possible to use traditional spraying methods like standard spraying.</p>
<p>Fog system works on a pressure of 1000 PSI (70 Bar) and it is designed to produce water droplets smaller than 5-10 microns diameter that, for theirs dwarfish size remains suspended in the air for a long time producing the fog effect.</p>
<p>Typically all growers have the problem of low humidity and high temperatures. Serious problems occur when the humidity in the greenhouse environment drops below 30% RH. Plants will suffer and typically slow or halt the growing process. In fact, many greenhouses in arid conditions close down for the summer months until ambient temperatures will reduce to an acceptable level.</p>
<h4 className="font-bold text-brand-red text-base">LOW COST SYSTEMS</h4>
<p>Very low cost of our systems are an important aspect of misting in greenhouse, if compared to other solutions for the climate control. The energy costs are low, simple and fast installations, considering that the systems are supplied in various solutions or D-I-Y Kits, or by the simple solutions of quick couplings. Our systems are designed to operate with very low costs and with a minimum maintenance.</p>
<h4 className="font-bold text-brand-red text-base">BENEFITS</h4>
<ul className="list-disc pl-6 space-y-1">
<li>Increased general productivity of the greenhouse</li>
<li>Speeds up plants growth</li>
<li>Keeping of constant humidity levels</li>
<li>Lower water consumption for the irrigation</li>
<li>Growing of a reproduction plants stock in the greenhouse</li>
<li>Suitable for chemical spreading (fertilizers, insecticides)</li>
<li>Less humidity need</li>
<li>The correct micro-climate in any season</li>
<li>Less shading needed</li>
</ul>
</div>
),
},
{
title: "Supermarket humidification",
content: (
<div className="space-y-4">
<p><strong>Fresh produces humidification with Misting</strong></p>
<p>Our misting system re-establishes to optimal values the humidity level, blocking dehydration process, keeping the freshness of food for longer time.</p>
<p>Our misting system periodically emit an ultra light mist of water directly onto the product, usually for 1 to 5 seconds every 10-15 minutes. Due to their teeny dimensions, these small water droplets evaporate without wetting, keeping humidity and coolness in the environment air, <strong>reducing dehydration and maintaining product weight and condition.</strong></p>
<h4 className="font-bold text-brand-red text-base">FRUIT AND VEGETABLES</h4>
<p>Fruit and vegetables are largely composed of water. The loss of freshness is mainly due to a quick dehydration of the product, further to the evaporation of the water. Water evaporates, due to a difference between its values contained into the vegetables and in the surrounding air. By means of a misting system, the humidity level in the air re-establishes its optimal values, blocking the dehydration process. Additionally, a misting system, following the adiabatic principle, reduces the temperatures and cools the products displayed at the counters.</p>
<h4 className="font-bold text-brand-red text-base">FISH PRODUCTS</h4>
<p>Fish products are also subjects to the loss of freshness by dehydration, as they are composed of water in the measure higher than 70%. Moreover, the misting system can control the spread of smells in the surrounding areas. Misting system can be easily assembled inside refrigerated displays.</p>
<h4 className="font-bold text-brand-red text-base">MEAT</h4>
<p>Some types of meat and cold cuts are subjects to dehydration, too: our fog systems can restore naturally their suitable special microclimate, to preserve or keep seasoning them. Misting system can be easily assembled inside refrigerated displays.</p>
<h4 className="font-bold text-brand-red text-base">BENEFITS</h4>
<ul className="list-disc pl-6 space-y-1">
<li>Dehydration block</li>
<li>Decrease in the weight loss of the product</li>
<li>Longer freshness</li>
<li>The temperature cools naturally down</li>
<li>It facilitates the process of ripeness of some kinds of fruit</li>
<li>It controls the spread of odors</li>
</ul>
</div>
),
},
{
title: "Refrigerated storage humidification",
content: (
<div className="space-y-4">
<p><strong>Cold rooms humidification with Misting</strong></p>
<p>Our misting system re-establishes to optimal values the humidity level in cold rooms and refrigerated warehouses, blocking dehydration process, keeping the freshness of food for longer time.</p>
<p>Our misting system periodically emit an ultra light mist of water. Due to their teeny dimensions, these small water droplets evaporate without wetting, keeping humidity and coolness in the environment air, <strong>reducing dehydration and maintaining product weight and condition.</strong></p>
<h4 className="font-bold text-brand-red text-base">FRUIT AND VEGETABLE</h4>
<p>Fruit and vegetables are largely composed of water. The loss of freshness is mainly due to a quick dehydration of the product, further to the evaporation of the water. Water evaporates, due to a difference between its values contained into the vegetables and in the surrounding air. By means of a misting system, the humidity level in the air re-establishes its optimal values, blocking the dehydration process.</p>
<h4 className="font-bold text-brand-red text-base">FISH PRODUCTS</h4>
<p>Fish products are also subjects to the loss of freshness by dehydration, as they are composed of water in the measure higher than 70%.</p>
<h4 className="font-bold text-brand-red text-base">MEAT</h4>
<p>Meat is subject to dehydration, too: our misting systems can restore naturally their suitable special microclimate, to preserve or keep seasoning them. Misting system can be easily assembled inside cold rooms.</p>
<h4 className="font-bold text-brand-red text-base">BENEFITS</h4>
<ul className="list-disc pl-6 space-y-1">
<li>Dehydration block</li>
<li>Decrease in the weight loss of the product</li>
<li>Longer freshness</li>
<li>It controls the spread of odors</li>
</ul>
</div>
),
},
{
title: "Textile industry humidification",
content: (
<div className="space-y-4">
<p><strong>Textile industry humidification with Misting</strong></p>
<p>The yarns, until the transformation in tissue, must balance their own moisture and that contained in the surrounding air. A lack of moisture in the air is unpleasantly noticeable. Non air-conditioned factories or with a different humidification system frequently encounter production difficulties during embroidery, weaving and spinning yarns due to breakage and high static electricity levels.</p>
<p>The American Institute of Textile Technology found that wool, by increasing relative humidity from 60 to 70% during storage and processing, shows a 15% increase of its elasticity, which drastically reduces breakage during processing. Adjusting humidity levels with a misting system increases the tensile strength of all natural fibers, removes static electricity improving the workability of the yarns and fibers, controls the suspended residual and improves comfort of work areas.</p>
<p>Water is sprayed under pressure by special patented nozzles capable of generating very fine droplets, of less than 10 microns, which are immediately absorbed by the air without wetting surfaces and objects below. The results are significant: low cost of installation and operation, immediately effective.</p>
<h4 className="font-bold text-brand-red text-base">HUMIDITY AND YARN PROPERTIES</h4>
<p>Water is an important part of yarns weight. About 7% of dry cotton weight is made by water, in a dry synthetic yarn such as Nylon it is 2-3%. The specific weight of wool is made by water up to 18%.</p>
<h4 className="font-bold text-brand-red text-base">STATIC ELECTRICITY</h4>
<p>It is well known in the textile industry that the relative humidity, and hence the moisture regain (content) of textile fiber plays a very important role in the reduction of static electricity. Virtually all textile fibers, when completely dry, have very high electrical resistances. However, as the relative humidity increases, the fibers absorb moisture and their electrical resistance decreases with a consequent reduction electrostatic charges generation.</p>
<h4 className="font-bold text-brand-red text-base">DUST CONTROL</h4>
<p>Water is an important part of yarns weight. About 7% of dry cotton weight is made by water, in a dry synthetic yarn such as Nylon it is 2-3%. The specific weight of wool is made by water up to 18%.</p>
<h4 className="font-bold text-brand-red text-base">EFFECTIVE SOLUTION FOR:</h4>
<ul className="list-disc pl-6 space-y-1">
<li>Dry nose and eyes, burning irritation, pain</li>
<li>Danger of infection, dry nostrils are very sensitive</li>
<li>Creates headache after light dehydration</li>
<li>Enhances evaporation and suspension of solvents, paints and glues</li>
<li>High concentration of airborne dust</li>
<li>Static Electricity</li>
<li>Frequent stoppages for repeated failure</li>
</ul>
</div>
),
},
{
title: "Paper and Press industry humidification",
content: (
<div className="space-y-4">
<h4 className="font-bold text-brand-red text-base">Paper and Press industry humidification with Misting</h4>
<p><strong>Paper production, such as its storage, benefits from environment control.</strong></p>
<p>The paper-based products gain and lose moisture rapidly: for this reason a properly stabilized humidity level is crucial to obtain an excellent steady quality final product. A proper humidity level is very important to the entire printing process. As far as paper, board and other cellulose-based products, the best climate is 20-21°C and a relative humidity moving from 50% to 55%.</p>
<h4 className="font-bold text-brand-red text-base">HUMIDITY IN WINTER MONTHS</h4>
<p>Heating and heat produced by machinery themselves create, during winter months mainly, critical levels of humidity in the environment and consequently serious complications to the manufacturing process.</p>
<h4 className="font-bold text-brand-red text-base">BENEFITS</h4>
<ul className="list-disc pl-6 space-y-1">
<li>Increased output speed</li>
<li>Removal of static electricity</li>
<li>Minimization of scraps and downtime</li>
<li>Reduction in curl and deformations</li>
<li>Improvement in quality folding mechanical process</li>
<li>Improvement in flexibility and dimensional stability</li>
<li>Better ink transfer</li>
<li>Dust reduction</li>
</ul>
</div>
),
},
];
function AccordionGroup({ section, defaultOpen = false }: { section: AccordionSection; defaultOpen?: boolean }) {
const [open, setOpen] = useState(defaultOpen);
return (
<div className="border rounded-lg overflow-hidden">
<button
onClick={() => setOpen(!open)}
className="flex items-center justify-between w-full px-6 py-4 text-left font-bold text-lg bg-white hover:bg-gray-50 transition-colors"
>
<span>{section.title}</span>
<svg
className={`w-4 h-4 transition-transform ${open ? "rotate-90" : ""}`}
fill="none" stroke="currentColor" viewBox="0 0 24 24"
>
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</button>
{open && (
<div className="px-6 py-4 border-t text-muted-foreground prose-sm max-w-none">
{section.content}
</div>
)}
</div>
);
}
function ApplicationsHumidification() {
return (
<SubPageLayout
eyebrow="Applications"
title="Humidification"
lede="Commercial and industrial environments where controlling humidity or temperature provides enhanced profitability, product quality and process reliability."
>
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>High pressure misting systems offer the simplest and most effective method of air cooling and humidity control. The Promist high-pressure misting system can be used for a wide range of applications including commercial, industrial and residential outdoor cooling, greenhouses and agricultural, zoos and wild life parks, theme parks, bird and poultry farms, events and crowd cooling, prevention of energy loss and many more.</p>
</div>
<img src="/wp-uploads/2017/04/humidification.jpg" alt="Humidification" className="w-full h-[300px] object-cover rounded-lg" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-6">Applications</h2>
<div className="space-y-4">
{sections.map((section, i) => (
<AccordionGroup key={section.title} section={section} defaultOpen={i === 0} />
))}
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -1,5 +1,8 @@
import { createFileRoute, Link } from "@tanstack/react-router";
import { ArrowUpRight, Droplets, Wind, Factory, Sparkles, Gauge, ShieldCheck } from "lucide-react";
import { useState, useCallback, useEffect } from "react";
import useEmblaCarousel from "embla-carousel-react";
import Autoplay from "embla-carousel-autoplay";
export const Route = createFileRoute("/")({
head: () => ({
@@ -14,116 +17,168 @@ export const Route = createFileRoute("/")({
});
const IMG = {
nozzle: "https://promistcool.com/wp-content/uploads/2020/04/banner-sanitz.jpg",
booth: "https://promistcool.com/wp-content/uploads/2020/04/image-002.png",
humid: "https://promistcool.com/wp-content/uploads/2016/03/humidification-misting.jpg",
commercial: "https://promistcool.com/wp-content/uploads/2016/03/commercial-misting.jpg",
industrial: "https://promistcool.com/wp-content/uploads/2016/03/industrial-misting.jpg",
project1: "https://promistcool.com/wp-content/uploads/2017/04/banner4.jpg",
project2: "https://promistcool.com/wp-content/uploads/2017/04/banner2.jpg",
project3: "https://promistcool.com/wp-content/uploads/2017/04/banner3.jpg",
banner: "https://promistcool.com/wp-content/uploads/2017/04/new-banner.jpg",
nozzle: "/wp-uploads/2020/04/banner-sanitz.jpg",
booth: "/wp-uploads/2020/04/image-002.png",
humid: "/wp-uploads/2016/03/humidification-misting.jpg",
commercial: "/wp-uploads/2016/03/commercial-misting.jpg",
industrial: "/wp-uploads/2016/03/industrial-misting.jpg",
project1: "/wp-uploads/2017/04/banner4.jpg",
project2: "/wp-uploads/2017/04/banner2.jpg",
project3: "/wp-uploads/2017/04/banner3.jpg",
banner: "/wp-uploads/2017/04/new-banner.jpg",
};
const SLIDES = [
{
img: "/slide-sanitization.jpg",
title: "Sanitization Booth",
subtitle: "A turnkey solution for your disinfectant needs — engineered for continuous public use.",
cta: "View details",
ctaTo: "/products/sanitization-booth",
},
{
img: "/slide-residential.jpg",
title: "Residential Outdoor Cooling",
subtitle: "Reclaim your outdoor spaces with high-pressure misting — even when temperatures push past 45°C.",
cta: "Explore applications",
ctaTo: "/applications",
},
{
img: "/slide-humidity.jpg",
title: "Humidity & Control",
subtitle: "The most efficient way to keep the right humidity levels for industrial and commercial environments.",
cta: "Request a quote",
ctaTo: "/enquiry",
},
];
const APP_CARDS = [
{ img: IMG.humid, title: "Humidification", desc: "Commercial and industrial environments where controlled humidity or temperature drive profitability.", icon: Droplets, href: "/applications/humidification" },
{ img: IMG.commercial, title: "Commercial Outdoor Cooling", desc: "Reclaim patio dining and outdoor bars once temperatures push past 45°C.", icon: Wind, href: "/applications/commercial-outdoor-cooling" },
{ img: IMG.industrial, title: "Industrial Cooling", desc: "A safer, more productive floor — cooling employees, equipment and processes.", icon: Factory, href: "/applications/industrial-outdoor-cooling" },
];
function HeroSlider() {
const [emblaRef, emblaApi] = useEmblaCarousel(
{ loop: true, duration: 40 },
[Autoplay({ delay: 5000, stopOnInteraction: true })],
);
const [selectedIndex, setSelectedIndex] = useState(0);
const scrollTo = useCallback(
(index: number) => emblaApi && emblaApi.scrollTo(index),
[emblaApi],
);
const onSelect = useCallback(() => {
if (!emblaApi) return;
setSelectedIndex(emblaApi.selectedScrollSnap());
}, [emblaApi]);
useEffect(() => {
if (!emblaApi) return;
onSelect();
emblaApi.on("select", onSelect);
return () => {
emblaApi.off("select", onSelect);
};
}, [emblaApi, onSelect]);
return (
<section className="relative overflow-hidden">
<div ref={emblaRef} className="overflow-hidden">
<div className="flex">
{SLIDES.map((slide, i) => (
<div
key={i}
className="relative min-w-0 shrink-0 grow-0 basis-full"
>
<div className="relative h-[75vh] min-h-[500px] max-h-[800px]">
<img
src={slide.img}
alt={slide.title}
className="absolute inset-0 w-full h-full object-cover"
/>
<div className="absolute inset-0 bg-gradient-to-r from-black/70 via-black/40 to-black/30" />
<div className="absolute inset-0 flex items-center">
<div className="container-page">
<div className="max-w-2xl">
<div className="inline-flex items-center gap-2 text-xs uppercase tracking-[0.25em] text-white/80 font-semibold mb-4">
<span className="block w-8 h-0.5 bg-brand-red" /> Since 1979
</div>
<h1 className="font-display text-5xl md:text-7xl lg:text-8xl font-black leading-[0.95] text-white">
{slide.title}
</h1>
<p className="mt-6 text-lg md:text-xl text-white/80 max-w-xl">
{slide.subtitle}
</p>
<div className="mt-8 flex flex-wrap gap-3">
<Link
to={slide.ctaTo as any}
className="inline-flex items-center gap-2 bg-brand-red text-white px-7 py-3.5 rounded-md text-sm font-semibold hover:opacity-90 transition-opacity"
>
{slide.cta} <ArrowUpRight className="h-4 w-4" />
</Link>
<Link
to="/contact"
className="inline-flex items-center gap-2 bg-white/10 backdrop-blur-sm text-white border border-white/30 px-7 py-3.5 rounded-md text-sm font-semibold hover:bg-white/20 transition-colors"
>
Contact us
</Link>
</div>
</div>
</div>
</div>
</div>
</div>
))}
</div>
</div>
{/* Dots */}
<div className="absolute bottom-6 left-1/2 -translate-x-1/2 flex items-center gap-2.5">
{SLIDES.map((_, i) => (
<button
key={i}
onClick={() => scrollTo(i)}
className={`rounded-full transition-all duration-300 ${
i === selectedIndex
? "w-8 h-2.5 bg-brand-red"
: "w-2.5 h-2.5 bg-white/50 hover:bg-white/80"
}`}
aria-label={`Go to slide ${i + 1}`}
/>
))}
</div>
{/* Arrows */}
<button
onClick={() => emblaApi?.scrollPrev()}
className="absolute left-4 top-1/2 -translate-y-1/2 w-11 h-11 rounded-full bg-white/10 backdrop-blur-sm border border-white/20 flex items-center justify-center text-white hover:bg-white/20 transition-colors"
aria-label="Previous slide"
>
<svg className="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 19l-7-7 7-7" />
</svg>
</button>
<button
onClick={() => emblaApi?.scrollNext()}
className="absolute right-4 top-1/2 -translate-y-1/2 w-11 h-11 rounded-full bg-white/10 backdrop-blur-sm border border-white/20 flex items-center justify-center text-white hover:bg-white/20 transition-colors"
aria-label="Next slide"
>
<svg className="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</button>
</section>
);
}
function Home() {
return (
<>
{/* HERO */}
<section className="relative overflow-hidden border-b">
<div className="container-page grid lg:grid-cols-12 gap-10 py-16 lg:py-24 items-center">
<div className="lg:col-span-6">
<div className="inline-flex items-center gap-2 text-xs uppercase tracking-[0.25em] text-brand-blue font-semibold">
<span className="rule-blue" /> Since 1979
</div>
<h1 className="mt-6 font-display text-5xl md:text-7xl font-black leading-[0.95]">
Humidity
<br />
<span className="text-brand-blue">and</span>{" "}
<span className="text-brand-red italic">Control.</span>
</h1>
<p className="mt-6 text-lg text-muted-foreground max-w-xl">
We engineer high-pressure misting systems that cool, humidify, suppress dust and sanitize
from residential patios to industrial factories across the region.
</p>
<div className="mt-8 flex flex-wrap gap-3">
<Link to="/enquiry" className="inline-flex items-center gap-2 bg-brand-red text-white px-6 py-3.5 rounded-md text-sm font-semibold hover:opacity-90">
Request a quote <ArrowUpRight className="h-4 w-4" />
</Link>
<Link to="/products" className="inline-flex items-center gap-2 border border-foreground/20 px-6 py-3.5 rounded-md text-sm font-semibold hover:border-brand-blue hover:text-brand-blue">
Explore products
</Link>
</div>
<dl className="mt-12 grid grid-cols-3 gap-6 max-w-lg">
{[
["45+", "Years of expertise"],
["1000+", "Projects delivered"],
["70 bar", "High-pressure precision"],
].map(([k, v]) => (
<div key={k}>
<dt className="font-display text-3xl font-black text-brand-red">{k}</dt>
<dd className="text-xs uppercase tracking-wider text-muted-foreground mt-1">{v}</dd>
</div>
))}
</dl>
</div>
<div className="lg:col-span-6">
<div className="relative">
<div className="absolute -inset-4 bg-gradient-to-br from-brand-blue/10 to-brand-red/10 blur-2xl" />
<img src={IMG.nozzle} alt="Promist misting nozzle" className="relative w-full h-[520px] object-cover" />
<div className="absolute bottom-0 left-0 right-0 bg-background/90 backdrop-blur border-t border-l border-r px-6 py-4 flex items-center justify-between">
<div>
<div className="text-xs uppercase tracking-widest text-muted-foreground">Featured</div>
<div className="font-display text-xl font-bold">Sanitization Booth</div>
</div>
<Link to="/products" className="text-sm font-semibold text-brand-red inline-flex items-center gap-1">
View <ArrowUpRight className="h-4 w-4" />
</Link>
</div>
</div>
</div>
</div>
</section>
{/* APPLICATIONS */}
<section className="py-24">
<div className="container-page">
<div className="flex flex-wrap items-end justify-between gap-6 mb-14">
<div>
<span className="rule-red" />
<h2 className="mt-4 font-display text-4xl md:text-5xl font-black">Applications</h2>
<p className="mt-4 max-w-2xl text-muted-foreground">
A cost-effective solution for outdoor cooling and humidification across industrial, commercial,
residential, warehouses, greenhouses, gardens, patios, parks and amusement areas.
</p>
</div>
<Link to="/applications" className="text-sm font-semibold text-brand-blue inline-flex items-center gap-1">
All applications <ArrowUpRight className="h-4 w-4" />
</Link>
</div>
<div className="grid md:grid-cols-3 divide-y md:divide-y-0 md:divide-x border-y">
{[
{ img: IMG.humid, title: "Humidification", desc: "Commercial and industrial environments where controlled humidity or temperature drive profitability.", icon: Droplets },
{ img: IMG.commercial, title: "Commercial Outdoor Cooling", desc: "Reclaim patio dining and outdoor bars once temperatures push past 45°C.", icon: Wind },
{ img: IMG.industrial, title: "Industrial Cooling", desc: "A safer, more productive floor — cooling employees, equipment and processes.", icon: Factory },
].map((a) => (
<article key={a.title} className="p-8 group">
<div className="aspect-[4/3] overflow-hidden">
<img src={a.img} alt={a.title} className="w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" />
</div>
<div className="mt-6 flex items-center gap-3">
<a.icon className="h-5 w-5 text-brand-red" />
<h3 className="font-display text-xl font-bold">{a.title}</h3>
</div>
<p className="mt-3 text-sm text-muted-foreground">{a.desc}</p>
<Link to="/applications" className="mt-5 inline-flex items-center gap-1 text-sm font-semibold text-brand-red">
Details <ArrowUpRight className="h-4 w-4" />
</Link>
</article>
))}
</div>
</div>
</section>
{/* HERO SLIDER */}
<HeroSlider />
{/* SANITIZATION BOOTH FEATURE */}
<section className="bg-muted/40 py-24 border-y">
@@ -149,7 +204,7 @@ function Home() {
</li>
))}
</ul>
<Link to="/products" className="mt-8 inline-flex items-center gap-2 bg-brand-blue text-white px-6 py-3 rounded-md text-sm font-semibold hover:opacity-90">
<Link to="/products/sanitization-booth" className="mt-8 inline-flex items-center gap-2 bg-brand-blue text-white px-6 py-3 rounded-md text-sm font-semibold hover:opacity-90">
View details <ArrowUpRight className="h-4 w-4" />
</Link>
</div>
@@ -159,6 +214,43 @@ function Home() {
</div>
</section>
{/* APPLICATIONS */}
<section className="py-24">
<div className="container-page">
<div className="flex flex-wrap items-end justify-between gap-6 mb-14">
<div>
<span className="rule-red" />
<h2 className="mt-4 font-display text-4xl md:text-5xl font-black">Applications</h2>
<p className="mt-4 max-w-2xl text-muted-foreground">
A cost-effective solution for outdoor cooling and humidification across industrial, commercial,
residential, warehouses, greenhouses, gardens, patios, parks and amusement areas.
</p>
</div>
<Link to="/applications" className="text-sm font-semibold text-brand-blue inline-flex items-center gap-1">
All applications <ArrowUpRight className="h-4 w-4" />
</Link>
</div>
<div className="grid md:grid-cols-3 divide-y md:divide-y-0 md:divide-x border-y">
{APP_CARDS.map((a) => (
<article key={a.title} className="p-8 group">
<div className="aspect-[4/3] overflow-hidden">
<img src={a.img} alt={a.title} className="w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" />
</div>
<div className="mt-6 flex items-center gap-3">
<a.icon className="h-5 w-5 text-brand-red" />
<h3 className="font-display text-xl font-bold">{a.title}</h3>
</div>
<p className="mt-3 text-sm text-muted-foreground">{a.desc}</p>
<Link to={a.href} className="mt-5 inline-flex items-center gap-1 text-sm font-semibold text-brand-red">
Details <ArrowUpRight className="h-4 w-4" />
</Link>
</article>
))}
</div>
</div>
</section>
{/* 5 REASONS */}
<section className="py-24">
<div className="container-page">

View File

@@ -0,0 +1,76 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/industrial-outdoor-cooling")({
head: () => ({
meta: [
{ title: "Industrial Outdoor Cooling — Promist" },
{ name: "description", content: "Heavy-duty misting solutions for industrial cooling in factories, warehouses, and manufacturing facilities." },
],
}),
component: ApplicationsIndustrialOutdoorCooling,
});
function ApplicationsIndustrialOutdoorCooling() {
return (
<SubPageLayout
eyebrow="Applications"
title="Industrial Outdoor Cooling"
lede="Our heavy-duty industrial misting systems provide effective cooling solutions for factories, warehouses, manufacturing plants, and outdoor work areas."
>
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>Industrial environments generate significant heat from machinery, processes, and solar radiation. Our high-pressure misting systems provide an effective and economical solution for cooling large industrial spaces, improving worker safety, productivity, and comfort.</p>
<p>The evaporative cooling process can reduce ambient temperatures by up to 15°C, creating a safer and more productive work environment while consuming a fraction of the energy required by traditional HVAC systems.</p>
</div>
<img src="/wp-uploads/2017/04/industrial-outdoor-cooling.jpg" alt="Industrial Outdoor Cooling" className="w-full h-[300px] object-cover rounded-lg" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-8">Industrial Applications</h2>
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Warehouses</h3>
<p className="mt-2 text-muted-foreground">Cool large warehouse spaces efficiently without the high cost of traditional air conditioning.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Manufacturing Plants</h3>
<p className="mt-2 text-muted-foreground">Reduce heat stress on workers and equipment in production facilities.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Loading Docks</h3>
<p className="mt-2 text-muted-foreground">Keep loading areas comfortable for staff working in direct sun and heat.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Workshops</h3>
<p className="mt-2 text-muted-foreground">Maintain comfortable working temperatures in repair and maintenance workshops.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Foundries</h3>
<p className="mt-2 text-muted-foreground">Provide relief from extreme heat in metalworking and foundry environments.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Distribution Centers</h3>
<p className="mt-2 text-muted-foreground">Improve working conditions in large distribution and logistics facilities.</p>
</div>
</div>
</Section>
<Section>
<h2 className="font-display text-3xl font-black mb-6">Why Choose Promist for Industrial Cooling?</h2>
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>Our industrial misting systems are built with heavy-duty components designed to withstand harsh environments. With 37+ years of experience in high-pressure pump technology, we deliver reliable, long-lasting cooling solutions that reduce energy costs and improve workplace safety.</p>
<ul className="list-disc pl-6 space-y-2">
<li>1000-psi (70 bar) high-pressure systems</li>
<li>Thermal and short circuit protection</li>
<li>Low water safety switch</li>
<li>Low-speed 4-pole or 6-pole motors for reduced noise</li>
<li>Custom solutions for voltages from 115V to 575V 3 Phase</li>
<li>VFD (Variable Frequency Drive) for multi-zone applications</li>
</ul>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,203 @@
import { useState } from "react";
import { createFileRoute } from "@tanstack/react-router";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/misting-fittings-tubings")({
head: () => ({
meta: [
{ title: "Misting Fittings & Tubings — Promist" },
{
name: "description",
content:
"Stainless steel, brass and nickel plated fittings in an array of sizes for misting system installations.",
},
],
}),
component: ProductsMistingFittingsTubings,
});
interface GalleryItem {
image: string;
label: string;
}
interface AccordionGroup {
title: string;
description: string;
items: GalleryItem[];
}
const groups: AccordionGroup[] = [
{
title: '5 mm Push-In Fittings',
description:
'The remarkable flexibility of 0.19" (5 mm) polyamide tubing combined with small size fittings allow to easily adapt misting systems to umbrellas, tents, curved shapes. Made by nickel plated brass, they can be cleaned with acids.',
items: [
{ image: '/wp-uploads/2017/04/5mm01.jpg', label: '5mm 10/24" nozzle holder' },
{ image: '/wp-uploads/2017/04/5mm02.jpg', label: '5mm tube coupling' },
{ image: '/wp-uploads/2017/04/5mm03.jpg', label: '10/24" to 5mm adapter' },
{ image: '/wp-uploads/2017/04/5mm04.jpg', label: '5mm end with 10/24" hole' },
{ image: '/wp-uploads/2017/04/5mm05.jpg', label: 'F1/4" to 5mm adapter' },
{ image: '/wp-uploads/2017/04/5mm06.jpg', label: 'M1/4" to 5mm adapter' },
{ image: '/wp-uploads/2017/04/5mm07.jpg', label: '5mm white tubing' },
{ image: '/wp-uploads/2017/04/5mm08.jpg', label: '5mm black tubing' },
{ image: '/wp-uploads/2017/04/5mm09.jpg', label: '5mm black clamp' },
{ image: '/wp-uploads/2017/04/5mm10.jpg', label: '5mm white clamp' },
],
},
{
title: '3/8" Push-In Fittings',
description:
'These 3/8" (9.52mm) patented fittings features high quality and robustness. Made by nickel plated brass, they can be cleaned with acids. Adaptive teeth avoid deep scratches of the polyamide tube, preventing leakages.',
items: [
{ image: '/wp-uploads/2017/04/3-8_01.jpg', label: 'Raccordo 3/8" - 10/24"' },
{ image: '/wp-uploads/2017/04/3-8_02.jpg', label: 'Raccordo 3/8" 2 fori 10/24"' },
{ image: '/wp-uploads/2017/04/3-8_03.jpg', label: 'Giunzione 3/8"' },
{ image: '/wp-uploads/2017/04/3-8_04.jpg', label: 'Terminale 3/8" - 10/24"' },
{ image: '/wp-uploads/2017/04/3-8_05.jpg', label: 'Raccordo 3/8" T' },
{ image: '/wp-uploads/2017/04/3-8_06.jpg', label: 'Raccordo 3/8" L' },
{ image: '/wp-uploads/2017/04/3-8_07.jpg', label: 'Raccordo M1/4" - 3/8"' },
{ image: '/wp-uploads/2017/04/3-8_08.jpg', label: 'Terminale dritto 3/8" - 10/24"' },
{ image: '/wp-uploads/2017/04/3-8_09.jpg', label: 'Tappo raccordo 3/8"' },
{ image: '/wp-uploads/2017/04/3-8_10.jpg', label: 'Valvola 3/8"' },
{ image: '/wp-uploads/2017/04/3-8_11.jpg', label: 'Tubo PA 3/8" bianco' },
{ image: '/wp-uploads/2017/04/3-8_12.jpg', label: 'Tubo PA 3/8" - 80 cm' },
{ image: '/wp-uploads/2017/04/3-8_13.jpg', label: 'Clip inox 3/8"' },
{ image: '/wp-uploads/2017/04/3-8_14.jpg', label: 'Tubo PA 3/8" nero' },
{ image: '/wp-uploads/2017/04/3-8_15.jpg', label: 'Tubo PA 3/8" - 80 cm' },
{ image: '/wp-uploads/2017/04/3-8_16.jpg', label: 'Clip inox 3/8"' },
{ image: '/wp-uploads/2017/04/3-8_17.jpg', label: 'Tagliatubo 3/8" & 1/2"' },
],
},
{
title: 'Special 3/8" and 1/2" Fittings',
description:
'These 3/8" (9.52 mm) and 1/2" (12.5 mm) brass fittings features high quality and robustness. Our selection ensures that you\'ll find the ideal fitting for your project\'s requirements.',
items: [
{ image: '/wp-uploads/2017/04/3-8_18.jpg', label: '3/8" cross fitting' },
{ image: '/wp-uploads/2017/04/3-8_19.jpg', label: '3/8" 6 nozzles umbrella' },
{ image: '/wp-uploads/2017/04/3-8_20.jpg', label: '3/8" 6+1 tube connector' },
{ image: '/wp-uploads/2017/04/1-2_07.jpg', label: 'M3/8" to 3/8" tube connector' },
{ image: '/wp-uploads/2017/04/1-2_02.jpg', label: '1/2" tube coupling' },
{ image: '/wp-uploads/2017/04/1-2_03.jpg', label: '1/2" 3/8" tube adapter' },
{ image: '/wp-uploads/2017/04/1-2_04.jpg', label: '1/2" Tee fitting' },
{ image: '/wp-uploads/2017/04/1-2_05.jpg', label: '1/2" 3/8" T fitting' },
{ image: '/wp-uploads/2017/04/1-2_06.jpg', label: '1/2" end plug' },
{ image: '/wp-uploads/2017/04/1-2_01.jpg', label: 'M1/2" to 1/2" tube connector' },
{ image: '/wp-uploads/2017/04/1-2_08.jpg', label: '1/2" S.Steel clamp' },
{ image: '/wp-uploads/2017/04/1-2_09.jpg', label: '1/2" black tubing roll' },
],
},
{
title: '3/8" Noxide Fittings & Copper Tubing',
description:
'These 3/8" (9.52 mm) and nickel-plated brass fittings features high quality and robustness.',
items: [
{ image: '/wp-uploads/2017/04/noxide_01.jpg', label: '3/8" 10/24" nozzle holders' },
{ image: '/wp-uploads/2017/04/noxide_01.jpg', label: '3/8" 10/24" 2x nozzle holder' },
{ image: '/wp-uploads/2017/04/noxide_02.jpg', label: '3/8" Tee fitting' },
{ image: '/wp-uploads/2017/04/noxide_03.jpg', label: '3/8" elbow fitting' },
{ image: '/wp-uploads/2017/04/noxide_04.jpg', label: 'M1/4" 3/8" tube coupling' },
{ image: '/wp-uploads/2017/04/noxide_05.jpg', label: 'M3/8" 3/8" tube coupling' },
{ image: '/wp-uploads/2017/04/noxide_06.jpg', label: 'F1/4" 3/8" tube coupling' },
{ image: '/wp-uploads/2017/04/noxide_07.jpg', label: '3/8" union end with plug' },
{ image: '/wp-uploads/2017/04/noxide_08.jpg', label: '3/8 end fittings' },
{ image: '/wp-uploads/2017/04/noxide_09.jpg', label: 'M1/2" elbow fittings' },
{ image: '/wp-uploads/2017/04/noxide_10.jpg', label: '1/2" drain valve' },
{ image: '/wp-uploads/2017/04/noxide_11.jpg', label: '3/8" drain valve with elbow' },
{ image: '/wp-uploads/2017/04/noxide_12.jpg', label: '3/8" MM union' },
{ image: '/wp-uploads/2017/04/noxide_13.jpg', label: '3/8" FF union' },
{ image: '/wp-uploads/2017/04/noxide_14.jpg', label: '3/8" front and back ferrules' },
{ image: '/wp-uploads/2017/04/noxide_15.jpg', label: '3/8" fitting spare union' },
],
},
{
title: '10 and 12 mm S.Steel Fittings',
description:
'These 10 and 12 mm fittings features high quality and robustness. Made by S.Steel they ensure the best corrosion resistance, they can be cleaned with acids. The special fittings have been engineered to withstand pulsations produced by timers and their design allow faster installation. Nozzle holder direction can be adjusted and the fittings are easily removable.',
items: [
{ image: '/wp-uploads/2017/04/ssteel_01.jpg', label: '12 mm nozzle holder' },
{ image: '/wp-uploads/2017/04/ssteel_11.jpg', label: '10 mm nozzle holder' },
{ image: '/wp-uploads/2017/04/ssteel_02.jpg', label: '10 and 12 mm Tee fitting' },
{ image: '/wp-uploads/2017/04/ssteel_03.jpg', label: '10 and 12 mm elbow fitting' },
{ image: '/wp-uploads/2017/04/ssteel_04.jpg', label: 'F1/4" and F3/8" connector' },
{ image: '/wp-uploads/2017/04/ssteel_05.jpg', label: '10 and 12 mm pipe connector' },
{ image: '/wp-uploads/2017/04/ssteel_06.jpg', label: '15x12 and 12x10 pipe' },
{ image: '/wp-uploads/2017/04/ssteel_07.jpg', label: '10 and 12 mm cross fitting' },
{ image: '/wp-uploads/2017/04/ssteel_08.jpg', label: '10 and 12 mm end plug' },
{ image: '/wp-uploads/2017/04/ssteel_09.jpg', label: 'Nozzle holder spare O-Ring' },
{ image: '/wp-uploads/2017/04/ssteel_10.jpg', label: '12 and 10 mm pipes' },
],
},
];
function AccordionGroup({ group, defaultOpen = false }: { group: AccordionGroup; defaultOpen?: boolean }) {
const [open, setOpen] = useState(defaultOpen);
return (
<div className="border rounded-lg overflow-hidden">
<button
onClick={() => setOpen(!open)}
className="flex items-center justify-between w-full px-6 py-4 text-left font-bold text-lg bg-white hover:bg-gray-50 transition-colors"
>
<span>{group.title}</span>
<svg
className={`w-4 h-4 transition-transform ${open ? "rotate-90" : ""}`}
fill="none" stroke="currentColor" viewBox="0 0 24 24"
>
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</button>
{open && (
<div className="px-6 py-4 border-t space-y-4">
<p className="text-muted-foreground">{group.description}</p>
<div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-4">
{group.items.map((item, i) => (
<div key={i} className="text-center">
<img
src={item.image}
alt={item.label}
className="w-full aspect-square object-cover rounded-lg border"
loading="lazy"
/>
<p className="text-sm mt-1 text-muted-foreground">{item.label}</p>
</div>
))}
</div>
</div>
)}
</div>
);
}
function ProductsMistingFittingsTubings() {
return (
<SubPageLayout
eyebrow="Products"
title="Misting Fittings & Tubings"
lede="We offer a wide variety of stainless steel, brass and nickel plated fittings in an array of sizes, styles and configurations."
>
<div className="py-10 px-6 lg:px-10">
<div className="grid lg:grid-cols-2 gap-10 items-start mb-8">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>
Our outstanding selection ensures that you'll find the ideal fitting for
your project's requirements. Good corrosion resistance, ease of installation,
and extensive range of configurations and sizes.
</p>
</div>
<img
src="/wp-uploads/2017/04/fittings.jpg"
alt="Misting Fittings & Tubings"
className="w-full h-[300px] object-cover rounded-lg"
/>
</div>
<div className="space-y-4">
{groups.map((group, i) => (
<AccordionGroup key={group.title} group={group} defaultOpen={i === 0} />
))}
</div>
</div>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,62 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/misting-pumps")({
head: () => ({
meta: [
{ title: "Misting Pumps — Promist" },
{ name: "description", content: "1000-psi high-pressure misting pumps with thermal protection, low water safety switches, and low-noise motors." },
],
}),
component: ProductsMistingPumps,
});
function ProductsMistingPumps() {
return (
<SubPageLayout
eyebrow="Products"
title="Misting Pumps"
lede="We offer a broad range of 1000-psi (70 bar) high pressure misting pumps, built with high quality components following 37 years of experience."
>
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>From our economical direct drive pump to our industrial units, all of our mist pumps are built with high quality components, following our 37 years experience in the high pressure pumps industry.</p>
<p>All of our pumps are designed and built with thermal and short circuit protection. Professional units include a low water safety switch preventing the unit from operating with insufficient water supply.</p>
<p>Our mist pumps utilize a low speed, 4-pole or 6-pole motor, reducing operating speed, noise, and vibration while maintaining required pressure and flow. Most pumps are available in 115V or 230V.</p>
</div>
<img src="/wp-uploads/2017/04/misting-pumps.jpg" alt="Misting Pumps" className="w-full h-[300px] object-cover rounded-lg" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-6">Key Features</h2>
<div className="grid md:grid-cols-2 gap-6">
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Thermal Protection</h3>
<p className="mt-2 text-muted-foreground">All pumps include thermal and short circuit protection for safe, reliable operation.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Low Water Safety</h3>
<p className="mt-2 text-muted-foreground">Professional units include a low water safety switch to prevent dry running.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Low Noise Motors</h3>
<p className="mt-2 text-muted-foreground">4-pole or 6-pole motors reduce noise and vibration while maintaining performance.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Custom Solutions</h3>
<p className="mt-2 text-muted-foreground">Custom pumps built for voltages from 115V to 575V 3 Phase with VFD for multi-zone applications.</p>
</div>
</div>
</Section>
<Section>
<h2 className="font-display text-3xl font-black mb-6">Integrated Climate Control</h2>
<div className="prose max-w-none text-muted-foreground">
<p>We offer a specialized integrated climate control (HT controller) system with a remote sensor that automates operations based on programmable temperature and humidity settings. The pump is designed to suit all of our mist fans.</p>
<p className="mt-4">Additional components such as electric zone valves, drain valves, and safety switches are also available. Units can include variable frequency drive (VAR or VFD) for multi-zone applications.</p>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,44 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/misting-systems-accessories")({
head: () => ({
meta: [
{ title: "Misting Systems Accessories — Promist" },
{ name: "description", content: "Humidistats, thermostats, timers, solenoid valves, filters, dosing pumps and more for your misting system." },
],
}),
component: ProductsMistingSystemsAccessories,
});
function ProductsMistingSystemsAccessories() {
return (
<SubPageLayout
eyebrow="Products"
title="Misting Systems Accessories"
lede="We offer a wide range of accessories to complete your misting system installation: controllers, timers, valves, filters and more."
>
<Section>
<div className="prose max-w-none text-muted-foreground space-y-4">
<div className="grid md:grid-cols-2 gap-8">
<div>
<h4 className="text-brand-blue font-bold">Humidity & Temperature Controllers</h4>
<p>Correct humidity and temperature control is important. Our thermostats and humidistats provide precise control of misting pumps and ventilation systems.</p>
<h4 className="text-brand-blue font-bold mt-6">Timers & Accessories</h4>
<p>Our 3/8" (9.52mm) patented fittings feature high quality and robustness. Made of nickel plated brass, cleanable with acids. Adaptive teeth prevent deep scratches of the polyamide tube, preventing leakages.</p>
</div>
<div>
<h4 className="text-brand-blue font-bold">Dosing Pumps</h4>
<p>Precision dosing pumps for adding treatments or chemicals to your misting water supply as needed for specific applications.</p>
<h4 className="text-brand-blue font-bold mt-6">Additional Accessories</h4>
<p>Complete your system with solenoid valves, filters, sterilizers, probes, and cyclic timers designed for seamless integration with Promist systems.</p>
</div>
</div>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,50 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/misting-systems-design")({
head: () => ({
meta: [
{ title: "Misting Systems Design — Promist" },
{ name: "description", content: "Custom misting system design services for cooling, humidification, dust suppression and more." },
],
}),
component: SolutionsMistingSystemsDesign,
});
function SolutionsMistingSystemsDesign() {
return (
<SubPageLayout eyebrow="Solutions" title="Misting Systems Design" lede="Whether your space is large or small, we can design custom misting systems that maximize performance and minimize cost.">
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>Let us help you design the right misting system for your application cooling, humidification, dust suppression, and many other uses.</p>
<p>Send us a description, drawings, or pictures of the area to be cooled and we'll design a system that's right for you. Our team works with you to understand your specific requirements and creates a tailored solution that delivers optimal results.</p>
<p>From small residential patios to large industrial facilities, we have the expertise to design and deliver the perfect misting solution.</p>
</div>
<img src="/wp-uploads/2017/04/layout1.jpg" alt="System Design Layout" className="w-full h-auto object-contain rounded-lg border" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-6">Our Design Process</h2>
<div className="grid md:grid-cols-3 gap-8">
<div className="bg-white p-6 rounded-lg border text-center">
<div className="w-12 h-12 bg-brand-red text-white rounded-full flex items-center justify-center text-2xl font-bold mx-auto">1</div>
<h3 className="mt-4 font-bold text-lg">Consultation</h3>
<p className="mt-2 text-muted-foreground">We discuss your needs, space, and requirements to understand the project scope.</p>
</div>
<div className="bg-white p-6 rounded-lg border text-center">
<div className="w-12 h-12 bg-brand-red text-white rounded-full flex items-center justify-center text-2xl font-bold mx-auto">2</div>
<h3 className="mt-4 font-bold text-lg">Design</h3>
<p className="mt-2 text-muted-foreground">Our engineers create a custom system layout maximizing performance and efficiency.</p>
</div>
<div className="bg-white p-6 rounded-lg border text-center">
<div className="w-12 h-12 bg-brand-red text-white rounded-full flex items-center justify-center text-2xl font-bold mx-auto">3</div>
<h3 className="mt-4 font-bold text-lg">Installation</h3>
<p className="mt-2 text-muted-foreground">Professional installation by our experienced team ensures reliable, long-lasting operation.</p>
</div>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,48 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/misting-technology")({
head: () => ({
meta: [
{ title: "Misting Technology — Promist" },
{ name: "description", content: "How high-pressure misting systems work: evaporative cooling principle, humidification, and our advanced pump technologies." },
],
}),
component: SolutionsMistingTechnology,
});
function SolutionsMistingTechnology() {
return (
<SubPageLayout eyebrow="Solutions" title="Misting Technology" lede="By forcing water through specially designed misting nozzles at high pressure, we create ultra-fine droplets under 10 microns for efficient evaporative cooling.">
<Section>
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>By forcing water through our specially designed misting nozzles by means of a high pressure pump, we create a fog of ultra fine water droplets with an average size of less than 10 microns.</p>
<h4 className="text-brand-red font-bold">Cooling Principle</h4>
<p>Billions of tiny water droplets quickly absorb the energy (heat) present in the environment and evaporate, becoming water vapor (gas). The energy (heat) used to change the water to gas is eliminated from the environment, hence the air is cooled. Evaporative cooling is responsible for the chill you feel when a breeze strikes your skin.</p>
<h4 className="text-brand-red font-bold">Humidification</h4>
<p>Our systems are the most efficient solution to maintain proper humidity levels for materials and processes. Different levels of relative humidity provide adequate moisture content in hygroscopic materials, preventing moisture loss, material deterioration, and production problems.</p>
<h4 className="text-brand-blue font-bold mt-8">Our Pump Technologies</h4>
<h6 className="font-bold">Time Version Pumps</h6>
<p>Supplied with a digital timer that allows control of misting by programming ON and OFF spraying cycles. This saves water without losing evaporative cooling performance. During the OFF cycle the pump does not stop.</p>
<h6 className="font-bold">BPS By-Pass System</h6>
<p>The BPS system recycles water to an external tank, providing 30 times more efficient pump cooling than a standard H.P. pump. TecnoCooling pumps equipped with BPS assure long lifetime and less maintenance.</p>
<h6 className="font-bold">Low Noise Motors</h6>
<p>QES and LSP electric motors operate more quietly and efficiently. They are more reliable and offer better performance than predecessors, making them ideal for applications where low noise matters.</p>
<h6 className="font-bold">Safety Controls (SSC)</h6>
<p>SSC shuts down the pump if pressure drops below 40 bar, preventing flooding from broken tubing. It also prevents dry running, making it a reliable solution for 24H running systems.</p>
<h6 className="font-bold">VFD (VAR) Pumps</h6>
<p>VAR/VFD functionality is an integrated electronic management system. It checks working pressure in real time, keeps it constant, and automatically adjusts power and flow to match the number of spraying nozzles. The system can detect faults and automatically shut down when needed.</p>
</div>
</Section>
</SubPageLayout>
);
}

202
src/routes/nozzles.tsx Normal file
View File

@@ -0,0 +1,202 @@
import { useState } from "react";
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/nozzles")({
head: () => ({
meta: [
{ title: "Misting Nozzles — Promist" },
{
name: "description",
content:
"High-quality misting nozzles in ni-plated brass and stainless steel. Cleanable nozzle design with 10/24 and 1/8 threads.",
},
],
}),
component: ProductsNozzles,
});
interface GalleryItem {
image: string;
label: string;
}
interface SeriesGroup {
title: string;
description: string;
items: GalleryItem[];
}
const series: SeriesGroup[] = [
{
title: "Economy Series",
description:
'The Economy nozzle range includes sizes from .006" to .020" orifice with anti-drip adapter. Available in ni-plated brass or stainless steel. Flow rates range from 0.73 gph to 3.26 gph. Ideal for budget-conscious installations where reliable performance is still required.',
items: [
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Economy Nozzle .006" Orifice' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Economy Nozzle .008" Orifice' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Economy Nozzle .010" Orifice' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Economy Nozzle .013" Orifice' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Economy Nozzle .016" Orifice' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Economy Nozzle .020" Orifice' },
],
},
{
title: "TCN Series — Cleanable Filter Nozzles",
description:
'The TCN mist nozzles include sizes from .006" to .020" with anti-drip adapter and cleanable filter. Available in ni-plated brass or stainless steel with flow rates from 0.73 gph to 3.26 gph. The cleanable filter design allows for easy maintenance and extended nozzle life.',
items: [
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'TCN Nozzle .006" Orifice' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'TCN Nozzle .008" Orifice' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'TCN Nozzle .010" Orifice' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'TCN Nozzle .013" Orifice' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'TCN Nozzle .016" Orifice' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'TCN Nozzle .020" Orifice' },
],
},
{
title: "Nozzle Adapter Range",
description:
"The Nozzle Adapter range includes extensions, clusters, swivel fittings, and multi-thread adapters. Available in brass and stainless steel with various thread configurations including 10/24\" and 1/8\" to suit different installation requirements.",
items: [
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: '10/24" to 1/8" Adapter' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Nozzle Extension' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Nozzle Cluster' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Swivel Fitting' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Multi-Thread Adapter' },
{ image: "/wp-uploads/2017/04/nozzle-banner1.jpg", label: 'Anti-Drip Adapter' },
],
},
];
function AccordionGroup({ group, defaultOpen = false }: { group: SeriesGroup; defaultOpen?: boolean }) {
const [open, setOpen] = useState(defaultOpen);
return (
<div className="border rounded-lg overflow-hidden">
<button
onClick={() => setOpen(!open)}
className="flex items-center justify-between w-full px-6 py-4 text-left font-bold text-lg bg-white hover:bg-gray-50 transition-colors"
>
<span>{group.title}</span>
<svg
className={`w-4 h-4 transition-transform ${open ? "rotate-90" : ""}`}
fill="none" stroke="currentColor" viewBox="0 0 24 24"
>
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</button>
{open && (
<div className="px-6 py-4 border-t space-y-4">
<p className="text-muted-foreground">{group.description}</p>
<div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-4">
{group.items.map((item, i) => (
<div key={i} className="text-center">
<img
src={item.image}
alt={item.label}
className="w-full aspect-square object-cover rounded-lg border"
loading="lazy"
/>
<p className="text-sm mt-1 text-muted-foreground">{item.label}</p>
</div>
))}
</div>
</div>
)}
</div>
);
}
function ProductsNozzles() {
return (
<SubPageLayout
eyebrow="Products"
title="Misting Nozzles"
lede='We offer the latest cleanable nozzle design with 10/24" and 1/8" threads. Buy direct from the manufacturer.'
>
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>
Mist nozzles are available in ni-plated brass and stainless steel. We
also offer a variety of other nozzle designs as special order items
with different orifice sizes.
</p>
<p>
The Economy nozzle range includes sizes from .006" to .020" orifice
with anti-drip adapter. They are available in ni-plated brass or
stainless steel. Flow rates for this range vary from 0.73 gph to 3.26
gph.
</p>
<p>
The TCN mist nozzles include sizes from .006" to .020" with anti-drip
adapter and cleanable filter. They are available in ni-plated brass or
stainless steel with orifice sizes from .006" to .020" and flow rates
from 0.73 gph to 3.26 gph.
</p>
<p>
The Nozzle Adapter range includes extensions, clusters, swivel
fittings, and multi-thread adapters.
</p>
</div>
<img
src="/wp-uploads/2017/04/nozzle-banner1.jpg"
alt="Misting Nozzles"
className="w-full h-[300px] object-cover rounded-lg"
/>
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-6">Nozzle Series</h2>
<div className="space-y-4">
{series.map((group, i) => (
<AccordionGroup key={group.title} group={group} defaultOpen={i === 0} />
))}
</div>
</Section>
<Section>
<h2 className="font-display text-3xl font-black mb-6">
Nozzle Specifications
</h2>
<div className="prose max-w-none text-muted-foreground space-y-4">
<table className="w-full border-collapse">
<thead>
<tr className="border-b text-left">
<th className="py-2 font-bold">Type</th>
<th className="py-2 font-bold">Material</th>
<th className="py-2 font-bold">Orifice</th>
<th className="py-2 font-bold">Flow Rate</th>
</tr>
</thead>
<tbody>
<tr className="border-b">
<td className="py-2">Economy</td>
<td className="py-2">Ni-plated Brass / SS</td>
<td className="py-2">.006" .020"</td>
<td className="py-2">0.73 3.26 gph</td>
</tr>
<tr className="border-b">
<td className="py-2">TCN</td>
<td className="py-2">Ni-plated Brass / SS</td>
<td className="py-2">.006" .020"</td>
<td className="py-2">0.73 3.26 gph</td>
</tr>
<tr className="border-b">
<td className="py-2">Adapter</td>
<td className="py-2">Brass / SS</td>
<td className="py-2">Various</td>
<td className="py-2"></td>
</tr>
</tbody>
</table>
<p className="text-sm mt-4">
All nozzles include anti-drip adapter. Cleanable filter included with
TCN series.
</p>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,58 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/portable-misting-fans")({
head: () => ({
meta: [
{ title: "Portable Misting Fans — Promist" },
{ name: "description", content: "1000-psi high pressure portable misting fans for versatile cooling anywhere you need it." },
],
}),
component: ProductsPortableMistingFans,
});
function ProductsPortableMistingFans() {
return (
<SubPageLayout eyebrow="Products" title="Portable Misting Fans" lede="Our Portable Mist Fans can be used almost anywhere an air conditioner can be used and many places where it can't.">
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>We offer a broad range of 1000-psi (70 bar) high pressure portable misting fans. They only need to connect to water and power supply. Perfect for indoor and outdoor use where flexible, movable cooling is required.</p>
<p>Ideal for warehouses, workshops, outdoor events, construction sites, sports facilities, and any location where temporary or mobile cooling is needed.</p>
</div>
<img src="/wp-uploads/2017/04/portable.jpg" alt="Portable Misting Fans" className="w-full h-[300px] object-cover rounded-lg" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-6">Applications</h2>
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Outdoor Events</h3>
<p className="mt-2 text-muted-foreground">Keep guests comfortable at weddings, parties, and corporate events.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Construction Sites</h3>
<p className="mt-2 text-muted-foreground">Provide cooling for workers in temporary outdoor work areas.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Sports Facilities</h3>
<p className="mt-2 text-muted-foreground">Cool players and spectators at outdoor sports venues.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Warehouses</h3>
<p className="mt-2 text-muted-foreground">Mobile cooling for large indoor spaces without permanent installation.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Workshops</h3>
<p className="mt-2 text-muted-foreground">Flexible cooling for repair shops, garages, and workshops.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Emergency Cooling</h3>
<p className="mt-2 text-muted-foreground">Rapid deployment cooling for emergency response situations.</p>
</div>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -1,49 +0,0 @@
import { createFileRoute, Link } from "@tanstack/react-router";
import { PageHero, Section, CTA } from "@/components/page-shell";
import { ArrowUpRight } from "lucide-react";
export const Route = createFileRoute("/products")({
head: () => ({
meta: [
{ title: "Products — Nozzles, Pumps & Sanitization Booth" },
{ name: "description", content: "High-pressure pumps, misting nozzles, control panels and the Promist Sanitization Booth." },
{ property: "og:title", content: "Promist Products" },
{ property: "og:description", content: "Pumps, nozzles, panels and sanitization systems." },
],
}),
component: Products,
});
const PRODUCTS = [
{ img: "https://promistcool.com/wp-content/uploads/2020/04/banner-sanitz.jpg", title: "Misting Nozzles", desc: "Precision brass and stainless-steel nozzles engineered for ultra-fine mist and long service life." },
{ img: "https://promistcool.com/wp-content/uploads/2017/04/new-banner.jpg", title: "High-Pressure Pumps", desc: "Reliable pumps up to 70 bar for residential, commercial and industrial deployments." },
{ img: "https://promistcool.com/wp-content/uploads/2020/04/image-002.png", title: "Sanitization Booth", desc: "Turnkey walk-through booth with electric control panel, reflective sensor and 12-month warranty." },
{ img: "https://promistcool.com/wp-content/uploads/2017/04/banner4.jpg", title: "Misting Fans", desc: "Portable and fixed misting fans for events, patios, factories and open spaces." },
];
function Products() {
return (
<>
<PageHero
eyebrow="Products"
title="Engineered components. Complete systems."
lede="Every part of a Promist system — from nozzle to pump to control panel — is built to work as one."
/>
<Section>
<div className="grid md:grid-cols-2 gap-x-14 gap-y-20">
{PRODUCTS.map((p) => (
<article key={p.title}>
<img src={p.img} alt={p.title} className="w-full h-[320px] object-cover" />
<h3 className="mt-6 font-display text-2xl font-black">{p.title}</h3>
<p className="mt-3 text-muted-foreground">{p.desc}</p>
<Link to="/enquiry" className="mt-4 inline-flex items-center gap-1 text-sm font-semibold text-brand-red">
Enquire <ArrowUpRight className="h-4 w-4" />
</Link>
</article>
))}
</div>
</Section>
<CTA />
</>
);
}

View File

@@ -0,0 +1,55 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/professional-pre-cooling")({
head: () => ({
meta: [
{ title: "Professional Pre-Cooling System — Promist" },
{ name: "description", content: "High-pressure misting pre-cooling systems for HVAC condensers, reducing energy costs by up to 30%." },
],
}),
component: ApplicationsProfessionalPreCooling,
});
function ApplicationsProfessionalPreCooling() {
return (
<SubPageLayout
eyebrow="Applications"
title="Professional Pre-Cooling System"
lede="Reduce energy consumption and enhance air conditioning performance with our high-pressure misting pre-cooling systems."
>
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>Promist designs and installs high-pressure misting systems in front of or below condenser coils to pre-cool the intake airflow before passing through the condenser coils, lowering the ambient temperature around the condenser.</p>
<p>These systems pre-cool the air intake for industrial air conditioners and evaporative coolers, enhancing the performance of existing AC units while dramatically reducing operating costs by as much as 30%. This is accomplished because the misting system reduces the compressor load and head pressure, reducing unit cycling and energy required to operate.</p>
</div>
<img src="/wp-uploads/2017/04/pre-cooling.jpg" alt="Professional Pre-Cooling" className="w-full h-[300px] object-cover rounded-lg" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-6">How It Works</h2>
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>The high-pressure misting systems operate at 70-150 Bar, producing extremely small water droplets that use the principal of "flash evaporation" reducing temperature without getting the coils noticeably wet. This lowers the temperature of the air surrounding the condenser. At a lower ambient temperature, the condenser's cooling capacity increases and the systems operate more efficiently.</p>
<p>As the head pressure falls, the saturated liquid temperature also falls and cooling capacity increases. The air conditioning or refrigeration system does not have to operate as long to satisfy the load, reducing energy use. Reduced head pressure also lengthens compressor life and increases cooling reliability.</p>
</div>
</Section>
<Section>
<h2 className="font-display text-3xl font-black mb-6">Benefits & Savings</h2>
<div className="prose max-w-none text-muted-foreground space-y-4">
<ul className="list-disc pl-6 space-y-2">
<li>Reduced Maintenance Costs</li>
<li>Increased Cooling Capacity</li>
<li>Reduced energy usage during normal and peak times</li>
<li>Up to 30% reduction in energy costs</li>
<li>Fast return on investment pays for itself quickly</li>
<li>Extends equipment life</li>
<li>Suitable for all types of condensers and HVAC systems</li>
</ul>
<p className="mt-6">Most importantly it reduces the overall electrical bill. This is a great investment because it will pay for itself in a short amount of time and continue to reduce energy and maintenance costs for years to come.</p>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -1,5 +1,5 @@
import { createFileRoute } from "@tanstack/react-router";
import { PageHero, Section, CTA } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/projects")({
head: () => ({
@@ -14,35 +14,38 @@ export const Route = createFileRoute("/projects")({
});
const IMGS = [
"https://promistcool.com/wp-content/uploads/2017/04/banner4.jpg",
"https://promistcool.com/wp-content/uploads/2017/04/banner2.jpg",
"https://promistcool.com/wp-content/uploads/2017/04/banner3.jpg",
"https://promistcool.com/wp-content/uploads/2020/04/banner-sanitz.jpg",
"https://promistcool.com/wp-content/uploads/2017/04/new-banner.jpg",
"https://promistcool.com/wp-content/uploads/2016/03/commercial-misting.jpg",
"https://promistcool.com/wp-content/uploads/2016/03/industrial-misting.jpg",
"https://promistcool.com/wp-content/uploads/2016/03/humidification-misting.jpg",
"/wp-uploads/2016/03/commercial-misting.jpg",
"/wp-uploads/2017/04/residential.jpg",
"/wp-uploads/2017/04/commercial.jpg",
"/wp-uploads/2017/04/industrial.jpg",
"/wp-uploads/2017/04/project1.jpg",
"/wp-uploads/2017/04/project2.jpg",
"/wp-uploads/2017/04/project3.jpg",
"/wp-uploads/2017/04/project4.jpg",
"/wp-uploads/2017/04/project5.jpg",
"/wp-uploads/2017/04/project6.jpg",
"/wp-uploads/2017/04/new-banner.jpg",
"/wp-uploads/2020/04/banner-sanitz.jpg",
"/wp-uploads/2020/04/image-002.png",
"/wp-uploads/2017/05/pm-a18s.jpg",
"/wp-uploads/2017/04/banner4.jpg",
];
function Projects() {
return (
<>
<PageHero
eyebrow="Projects"
title="Selected installations."
lede="A cross-section of Promist deployments — residential, commercial and industrial."
/>
<Section>
<div className="grid sm:grid-cols-2 lg:grid-cols-3 gap-1">
{IMGS.map((src, i) => (
<a key={src} href={src} className="group relative overflow-hidden aspect-square">
<img src={src} alt={`Promist project ${i + 1}`} className="w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" />
<div className="absolute inset-0 bg-brand-red/0 group-hover:bg-brand-red/30 transition-colors" />
</a>
))}
</div>
</Section>
<CTA />
</>
<SubPageLayout
eyebrow="Projects"
title="Selected installations."
lede="A cross-section of Promist deployments — residential, commercial and industrial."
>
<div className="grid sm:grid-cols-2 lg:grid-cols-5 gap-2">
{IMGS.map((src, i) => (
<a key={src} href={src} className="group relative overflow-hidden aspect-square">
<img src={src} alt={`Promist project ${i + 1}`} className="w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" />
<div className="absolute inset-0 bg-brand-red/0 group-hover:bg-brand-red/30 transition-colors" />
</a>
))}
</div>
</SubPageLayout>
);
}

View File

@@ -1,5 +1,6 @@
import { createFileRoute, Link } from "@tanstack/react-router";
import { PageHero, Section } from "@/components/page-shell";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
import { ArrowUpRight } from "lucide-react";
export const Route = createFileRoute("/rental")({
@@ -15,17 +16,33 @@ export const Route = createFileRoute("/rental")({
});
function Rental() {
const specs = [
{ label: "Item No.", value: "PM-90" },
{ label: "Air flow rate", value: "9000m³/h" },
{ label: "Voltage", value: "120-127V / 220-240V" },
{ label: "Frequency", value: "50-60Hz" },
{ label: "Power", value: "400w" },
{ label: "Water consumption", value: "6-8 L/H" },
{ label: "Water tank capacity", value: "70L" },
{ label: "Overall size", value: "860×530×1400mm" },
{ label: "Package size", value: "860×530×1400mm" },
{ label: "Blower type", value: "Axial-flow type" },
{ label: "Casing material", value: "Plastic" },
{ label: "Application area", value: "30-50 m²" },
{ label: "Motor", value: "Three speed, 1-phase" },
{ label: "Noise", value: "≤65dB" },
];
return (
<>
<PageHero
eyebrow="Rental"
title="Cool on demand — for a day, a week or a season."
lede="Rent complete Promist misting systems and fans for events, expos, weddings, film sets and temporary outdoor installations."
/>
<SubPageLayout
eyebrow="Rental"
title="Rental"
lede="Cool on demand — for a day, a week or a season."
>
<Section>
<div className="grid lg:grid-cols-2 gap-14">
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div>
<img src="https://promistcool.com/wp-content/uploads/2017/04/new-banner.jpg" alt="Rental misting" className="w-full h-[440px] object-cover" />
<img src="/wp-uploads/2017/04/new-banner.jpg" alt="Rental misting" className="w-full h-[440px] object-cover" />
</div>
<div>
<ul className="space-y-4">
@@ -47,6 +64,24 @@ function Rental() {
</div>
</div>
</Section>
</>
<Section className="bg-muted/50">
<div className="grid lg:grid-cols-2 gap-10 items-start">
<img src="/wp-uploads/2017/05/pm-90.jpg" alt="PM-90 Evaporative Air Cooler" className="w-full h-[400px] object-cover rounded-lg" />
<div>
<h3 className="font-display text-2xl font-bold mb-6">PM-90 Evaporative Air Coolers</h3>
<table className="w-full border-collapse">
<tbody>
{specs.map((spec) => (
<tr key={spec.label} className="border-b">
<td className="py-2 pr-4 font-semibold text-sm">{spec.label}</td>
<td className="py-2 text-muted-foreground">{spec.value}</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,79 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/residential-outdoor-cooling")({
head: () => ({
meta: [
{ title: "Residential Outdoor Cooling — Promist" },
{
name: "description",
content:
"Misting systems for residential patios, gardens, poolsides, and outdoor living spaces.",
},
],
}),
component: ApplicationsResidentialOutdoorCooling,
});
function ApplicationsResidentialOutdoorCooling() {
return (
<SubPageLayout
eyebrow="Applications"
title="Residential Outdoor Cooling"
lede="Transform your outdoor living spaces with our premium residential misting systems. Perfect for patios, gardens, pool areas, and terraces."
>
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none space-y-4">
<img
src="/wp-uploads/2017/04/residential1.jpg"
alt="Residential Outdoor Cooling"
className="w-full h-auto rounded-lg"
/>
</div>
<div className="prose max-w-none text-muted-foreground space-y-4">
<p style={{ color: "#003161" }}>
Many people are unable to enjoy their patio or yard areas during the heat of
the summer. Pets and plants suffer due to intense heat. Customers say their
lifestyles have been changed completely by outdoor cooling (misting system).
They are no longer "trapped" inside their homes. Pets and plants are healthier.
Now you can enjoy the outdoors year round.
</p>
<p style={{ color: "#003161" }}>
Our Misting Systems are a simple, inexpensive and appealing way to{" "}
<strong>lower temperature by 10-12 °C</strong> outdoors and indoors without
wetting.
</p>
</div>
</div>
</Section>
<Section className="bg-muted/50">
<div className="prose max-w-none space-y-4">
<h4 style={{ color: "#de1f26", fontSize: "16px" }}>COOLING PRINCIPLE</h4>
<p style={{ color: "#003161" }}>
Evaporative cooling is responsible for the chill you feel when a breeze strikes
your skin. The air evaporates the water on your skin, with your body heat
providing the energy.
</p>
<p style={{ color: "#003161" }}>
By forcing water, by means of a high pressure pump, through our specially
designed misting nozzles, we create a fog made by ultra fine water droplets
with an average size of less than 10 microns. These tiny water droplets quickly
absorb the energy (heat) present in the environment and evaporate, becoming
water vapor (gas). The energy (heat) used to change the water to gas is
eliminated from the environment, hence the air is cooled.
</p>
<h4 style={{ color: "#de1f26", fontSize: "16px" }}>BENEFITS</h4>
<ul style={{ color: "#003161" }}>
<li>Lowers temperature</li>
<li>Reduces flying insects</li>
<li>Fully expandable</li>
<li>Absorbs dust and pollen</li>
<li>Special effects</li>
</ul>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,63 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/sanitization-booth")({
head: () => ({
meta: [
{ title: "Sanitization Booth — Promist" },
{ name: "description", content: "Automatic disinfection tunnel for human body using atomized sanitizer. Approved by Dubai Municipality." },
],
}),
component: ProductsSanitizationBooth,
});
function ProductsSanitizationBooth() {
return (
<SubPageLayout eyebrow="Products" title="Sanitization Booth" lede="Disinfection tunnel for human body — automatically atomizes approved disinfectant around the person as they walk through.">
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>Our automatic sanitization tunnel uses specially designed atomizers to cover the human body with a fine layer of approved disinfectant as the person walks through. This superficial layer will neutralize any SARS-CoV-2 virus stuck to the body.</p>
<p>The system is designed to operate independently, controlled by an IP65 rated sensor. As the person walks through the tunnel, the atomizers activate to cover the body without wetting the person.</p>
<p className="font-semibold text-brand-red">One of the very few systems approved by Dubai Municipality Health & Safety Division.</p>
</div>
<img src="/wp-uploads/2020/04/banner-sanitz.jpg" alt="Sanitization Booth" className="w-full h-[300px] object-cover rounded-lg" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-6">Key Features</h2>
<ul className="space-y-3 max-w-3xl">
{[
"Specially manufactured and approved disinfectant atomized around the human body",
"Atomizers placed carefully to superficially cover the person with disinfectant",
"Neutralizes SARS-CoV-2 virus stuck to the body",
"Can be used as a preventive measure to eliminate contamination",
"Operates independently, controlled by IP65 rated sensor",
"Atomizers activate automatically as person walks through",
"Fine layer of disinfectant without wetting the person",
"Atomizers designed not to change chemical composition of disinfectant"
].map((item, i) => (
<li key={i} className="flex items-start gap-3 bg-white p-4 rounded-lg border">
<span className="text-brand-red font-bold mt-0.5"></span>
<span className="text-muted-foreground">{item}</span>
</li>
))}
</ul>
</Section>
<Section>
<h2 className="font-display text-3xl font-black mb-6">Specifications</h2>
<div className="prose max-w-none text-muted-foreground">
<table className="w-full border-collapse">
<tbody>
<tr className="border-b"><td className="py-2 font-semibold">Tunnel shape</td><td className="py-2">Rectangular</td></tr>
<tr className="border-b"><td className="py-2 font-semibold">Enclosure</td><td className="py-2">Transparent plastic cover with aluminium structure</td></tr>
<tr className="border-b"><td className="py-2 font-semibold">Control system</td><td className="py-2">IP65 Rated sensor, automatic operation</td></tr>
<tr className="border-b"><td className="py-2 font-semibold">Approval</td><td className="py-2">Dubai Municipality Health & Safety Division</td></tr>
</tbody>
</table>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -0,0 +1,63 @@
import { createFileRoute } from "@tanstack/react-router";
import { Section } from "@/components/page-shell";
import { SubPageLayout } from "@/components/sub-page-layout";
export const Route = createFileRoute("/satellite-misting-fans")({
head: () => ({
meta: [
{ title: "Satellite Misting Fans — Promist" },
{ name: "description", content: "Heavy-duty satellite misting fans for industrial and commercial indoor cooling applications." },
],
}),
component: ProductsSatelliteMistingFans,
});
function ProductsSatelliteMistingFans() {
return (
<SubPageLayout eyebrow="Products" title="Satellite Misting Fans" lede="Heavy duty misting fans offering great benefits in industrial indoor cooling thanks to high performance and low energy consumption.">
<Section>
<div className="grid lg:grid-cols-2 gap-10 items-start">
<div className="prose max-w-none text-muted-foreground space-y-4">
<p>Misting fans are the best solution for open areas, providing air flow and cooling with the best efficiency. The two integrated systems ventilation and misting together ensure the best result against high levels of relative humidity in hot seasons.</p>
<p>Our standard and exhaust fans offer high volume output and smooth, efficient operation. The heavy duty galvanized housing is strong, compact, and easy to install. Automatic shutters are included in exhaust models. The high velocity air pattern provides maximum cooling at the lowest electrical cost.</p>
</div>
<img src="/wp-uploads/2017/04/misting-fans.jpg" alt="Satellite Misting Fans" className="w-full h-[300px] object-cover rounded-lg" />
</div>
</Section>
<Section className="bg-muted/50">
<h2 className="font-display text-3xl font-black mb-6">Applications</h2>
<div className="grid md:grid-cols-2 gap-6">
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Industrial Warehouses</h3>
<p className="mt-2 text-muted-foreground">Large-scale cooling for warehouses and distribution centers.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Manufacturing Plants</h3>
<p className="mt-2 text-muted-foreground">Effective cooling for production floors and assembly areas.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Sports Centers</h3>
<p className="mt-2 text-muted-foreground">Cool indoor sports facilities, arenas, and gymnasiums.</p>
</div>
<div className="bg-white p-6 rounded-lg border">
<h3 className="font-bold text-lg">Agricultural Buildings</h3>
<p className="mt-2 text-muted-foreground">Ventilation and cooling for livestock barns and poultry houses.</p>
</div>
</div>
</Section>
<Section>
<h2 className="font-display text-3xl font-black mb-6">Features</h2>
<div className="prose max-w-none text-muted-foreground">
<ul className="list-disc pl-6 space-y-2">
<li>Heavy duty galvanized housing strong, compact, easy to install</li>
<li>High volume air output with smooth, efficient operation</li>
<li>Automatic shutters on exhaust models</li>
<li>High velocity air pattern for maximum cooling</li>
<li>Lowest electrical cost compared to standard air conditioning</li>
<li>Integrated misting and ventilation in one system</li>
</ul>
</div>
</Section>
</SubPageLayout>
);
}

View File

@@ -1,48 +0,0 @@
import { createFileRoute } from "@tanstack/react-router";
import { PageHero, Section, CTA } from "@/components/page-shell";
import { Droplets, Sparkles, Gauge, ShieldCheck, Wind, Factory } from "lucide-react";
export const Route = createFileRoute("/solutions")({
head: () => ({
meta: [
{ title: "Solutions — Misting Technology by Promist" },
{ name: "description", content: "Humidification, cooling, dust suppression and special effects — engineered by Promist." },
{ property: "og:title", content: "Solutions" },
{ property: "og:description", content: "Full-service misting technology solutions." },
],
}),
component: Solutions,
});
const S = [
{ i: Droplets, t: "Misting Technology", d: "By forcing water at high pressure through specially designed misting nozzles, we create an ultra-fine mist that evaporates instantly." },
{ i: Gauge, t: "Cooling Principle", d: "Billions of tiny water droplets evaporate, becoming vapor. The energy used to change water to gas cools the surrounding air." },
{ i: ShieldCheck, t: "Humidification", d: "The most efficient way to keep the right humidity levels for food, materials and industrial processes." },
{ i: Wind, t: "Dust Suppression", d: "Extremely effective airborne dust suppression and air filtration for factories, warehouses and outdoor sites." },
{ i: Sparkles, t: "Special Effects", d: "Elevate landscapes, pools, events, expos, amusement parks and sports events with atmospheric mist." },
{ i: Factory, t: "Industrial Systems", d: "Custom engineered high-pressure systems designed to run continuously in demanding industrial environments." },
];
function Solutions() {
return (
<>
<PageHero
eyebrow="Solutions"
title="Promist is a full-service misting technology partner."
lede="From concept to commissioning, we deliver misting systems that just work — every day, in every climate."
/>
<Section>
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-x-12 gap-y-14 border-t pt-14">
{S.map((x) => (
<div key={x.t} className="border-b pb-8">
<x.i className="h-7 w-7 text-brand-red" />
<h3 className="mt-5 font-display text-2xl font-black">{x.t}</h3>
<p className="mt-3 text-muted-foreground">{x.d}</p>
</div>
))}
</div>
</Section>
<CTA />
</>
);
}