bender/3e64aab5-9ea3-4448-a77a-0bb16172257f
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

merge into: bender:version_1
Branches Tags
bender:main bender:version_3 bender:version_2 bender:version_1
...
pull from: bender:main
Branches Tags
bender:main bender:version_3 bender:version_2 bender:version_1

18 Commits
version_1 ... main

Author SHA1 Message Date
bender
33fa0148cc Merge version_2 into main 
Merge version_2 into main
 2026-03-05 21:06:20 +00:00
bender
577811ad59 Update theme colors 2026-03-05 21:06:14 +00:00
bender
eecd1a3d68 Merge version_2 into main 
Merge version_2 into main
 2026-03-05 21:03:42 +00:00
bender
baf3d25361 Update theme colors 2026-03-05 21:03:36 +00:00
bender
110efec3b3 Merge version_2 into main 
Merge version_2 into main
 2026-03-05 21:03:09 +00:00
bender
33d3f9b1db Update theme colors 2026-03-05 21:03:03 +00:00
bender
cedc3891a1 Merge version_2 into main 
Merge version_2 into main
 2026-03-05 21:02:27 +00:00
bender
cee7dc71ef Update theme colors 2026-03-05 21:02:21 +00:00
bender
5d3d7d9a1b Merge version_2 into main 
Merge version_2 into main
 2026-03-05 21:02:12 +00:00
bender
0a68525d9a Update theme colors 2026-03-05 21:02:06 +00:00
bender
f0878b6683 Merge version_2 into main 
Merge version_2 into main
 2026-03-05 21:01:47 +00:00
bender
b48a35bdd8 Update theme colors 2026-03-05 21:01:40 +00:00
bender
297fba7670 Merge version_2 into main 
Merge version_2 into main
 2026-03-05 21:01:13 +00:00
bender
b948db6197 Update src/app/page.tsx 2026-03-05 21:01:09 +00:00
bender
bfa3fc5106 Update src/app/layout.tsx 2026-03-05 21:01:09 +00:00
bender
b240c253d5 Merge version_1 into main 
Merge version_1 into main
 2026-03-05 20:14:54 +00:00
bender
38a287b6bf Merge version_1 into main 
Merge version_1 into main
 2026-03-05 20:14:04 +00:00
bender
2aedf54182 Merge version_1 into main 
Merge version_1 into main
 2026-03-05 20:12:56 +00:00
3 changed files with 68 additions and 94 deletions
Expand all files Collapse all files

73
src/app/layout.tsx
View File

@@ -1,74 +1,20 @@
import type { Metadata } from "next";
import { Halant } from "next/font/google";
import { Inter } from "next/font/google";
import { Inter_Tight } from "next/font/google";
import "./styles/variables.css";
import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const halant = Halant({
variable: "--font-halant",
subsets: ["latin"],
weight: ["300", "400", "500", "600", "700"],
});
const inter = Inter({
variable: "--font-inter",
subsets: ["latin"],
});
const interTight = Inter_Tight({
variable: "--font-inter-tight",
subsets: ["latin"],
weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"],
});
export const metadata: Metadata = {
title: "CSBIMAGERY | Professional Videography & Sports Livestreaming Services",
description: "Professional videography, photography, and sports livestreaming services. Specialising in documentaries, social media content, and event coverage. Get a free quote today.",
keywords: "videography, photography, sports livestreaming, documentary filmmaker, event videography, social media content production, professional video production",
metadataBase: new URL("https://csbimagery.com"),
alternates: {
canonical: "https://csbimagery.com",
},
openGraph: {
title: "CSBIMAGERY | Professional Production Services",
description: "Capture powerful stories with professional videography and sports livestreaming solutions.",
type: "website",
siteName: "CSBIMAGERY",
images: [
{
url: "http://img.b2bpic.net/free-photo/professional-cameraman-recording-poeple-watching-football-public-place-night_1268-18138.jpg",
alt: "CSBIMAGERY - Professional Videography Services",
},
],
},
twitter: {
card: "summary_large_image",
title: "CSBIMAGERY | Professional Videography Services",
description: "Professional videography, photography & sports livestreaming.",
images: ["http://img.b2bpic.net/free-photo/group-bicycles-forest_53876-40323.jpg"],
},
robots: {
index: true,
follow: true,
},
};
title: "CSBIMAGERY - Professional Videography, Photography & Sports Livestreaming", description: "Professional videography, photography, and sports livestreaming services for brands, sports events, and organisations."};
export default function RootLayout({
children,
}: Readonly<{
}: {
children: React.ReactNode;
}>) {
}) {
return (
<html lang="en" suppressHydrationWarning>
<ServiceWrapper>
<body
className={`${halant.variable} ${inter.variable} ${interTight.variable} antialiased`}
>
<Tag />
{children}
<html lang="en">
<body>
{children}
<script
dangerouslySetInnerHTML={{
__html: `
@@ -1436,7 +1382,6 @@ export default function RootLayout({
}}
/>
</body>
</ServiceWrapper>
</html>
);
}
}

71
src/app/page.tsx
View File

@@ -86,15 +86,29 @@ export default function HomePage() {
]}
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/group-bicycles-forest_53876-40323.jpg?_wi=1", imageAlt: "Sports livestreaming setup"},
imageSrc: "http://img.b2bpic.net/free-photo/group-bicycles-forest_53876-40323.jpg?_wi=1", imageAlt: "Sports livestreaming setup"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/girl-taking-photo-her-friends-group-young-friends-hiking-through-forest-travel-hiking-adventure-concept_613910-18677.jpg?_wi=1", imageAlt: "Documentary filmmaking"},
imageSrc: "http://img.b2bpic.net/free-photo/girl-taking-photo-her-friends-group-young-friends-hiking-through-forest-travel-hiking-adventure-concept_613910-18677.jpg?_wi=1", imageAlt: "Documentary filmmaking"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/cheery-young-man-filming-his-video-blog-episode_171337-5517.jpg?_wi=1", imageAlt: "Social media content"},
imageSrc: "http://img.b2bpic.net/free-photo/cheery-young-man-filming-his-video-blog-episode_171337-5517.jpg?_wi=1", imageAlt: "Social media content"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/portrait-photographer-photo-art-concept_23-2148565566.jpg?_wi=1", imageAlt: "Professional photography"},
imageSrc: "http://img.b2bpic.net/free-photo/portrait-photographer-photo-art-concept_23-2148565566.jpg?_wi=1", imageAlt: "Professional photography"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/professional-cameraman-recording-poeple-watching-football-public-place-night_1268-18138.jpg?_wi=1", imageAlt: "Professional videography"},
imageSrc: "http://img.b2bpic.net/free-photo/professional-cameraman-recording-poeple-watching-football-public-place-night_1268-18138.jpg?_wi=1", imageAlt: "Professional videography"
},
{
videoSrc: "https://www.youtube.com/embed/dQw4w9WgXcQ", videoAriaLabel: "Hero section video showcase"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/video-camera-recording-football-match_1137-258.jpg", imageAlt: "Video camera recording sports"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/professional-cameraman-recording-poeple-watching-football-public-place-night_1268-18138.jpg?_wi=2", imageAlt: "Professional video crew"
}
]}
mediaAnimation="blur-reveal"
/>
@@ -109,13 +123,16 @@ export default function HomePage() {
features={[
{
id: 1,
title: "Sports Livestreaming", description: "Multi-camera professional livestream setups for sports events, races, and competitions. Crystal-clear broadcast quality with reliable technical support.", imageSrc: "http://img.b2bpic.net/free-photo/video-camera-recording-football-match_1137-258.jpg", imageAlt: "Sports livestreaming setup"},
title: "Sports Livestreaming", description: "Multi-camera professional livestream setups for sports events, races, and competitions. Crystal-clear broadcast quality with reliable technical support.", imageSrc: "http://img.b2bpic.net/free-photo/video-camera-recording-football-match_1137-258.jpg", imageAlt: "Sports livestreaming setup"
},
{
id: 2,
title: "Documentary Filmmaking", description: "Long-form cinematic documentaries capturing outdoor adventures and brand stories. Professional editing and colour grading included.", imageSrc: "http://img.b2bpic.net/free-photo/professional-cameraman-recording-poeple-watching-football-public-place-night_1268-18138.jpg?_wi=2", imageAlt: "Documentary production"},
title: "Documentary Filmmaking", description: "Long-form cinematic documentaries capturing outdoor adventures and brand stories. Professional editing and colour grading included.", imageSrc: "http://img.b2bpic.net/free-photo/professional-cameraman-recording-poeple-watching-football-public-place-night_1268-18138.jpg?_wi=2", imageAlt: "Documentary production"
},
{
id: 3,
title: "Social Media Content", description: "Short-form, high-impact video content optimised for Instagram, TikTok, and YouTube. Fast turnaround and unlimited revisions.", imageSrc: "http://img.b2bpic.net/free-photo/female-artist-explaining-painting-techniques-used-online-tutorial_482257-124811.jpg", imageAlt: "Social media content creation"},
title: "Social Media Content", description: "Short-form, high-impact video content optimised for Instagram, TikTok, and YouTube. Fast turnaround and unlimited revisions.", imageSrc: "http://img.b2bpic.net/free-photo/female-artist-explaining-painting-techniques-used-online-tutorial_482257-124811.jpg", imageAlt: "Social media content creation"
},
]}
animationType="blur-reveal"
textboxLayout="default"
@@ -131,13 +148,17 @@ export default function HomePage() {
tagIcon={Film}
products={[
{
id: "1", name: "Mountain Bike Championship Live", price: "Full Coverage", imageSrc: "http://img.b2bpic.net/free-photo/group-bicycles-forest_53876-40323.jpg?_wi=2", imageAlt: "Mountain bike championship livestream"},
id: "1", name: "Mountain Bike Championship Live", price: "Full Coverage", imageSrc: "http://img.b2bpic.net/free-photo/group-bicycles-forest_53876-40323.jpg?_wi=2", imageAlt: "Mountain bike championship livestream"
},
{
id: "2", name: "Alpine Adventure Documentary", price: "Full Production", imageSrc: "http://img.b2bpic.net/free-photo/girl-taking-photo-her-friends-group-young-friends-hiking-through-forest-travel-hiking-adventure-concept_613910-18677.jpg?_wi=2", imageAlt: "Alpine adventure documentary"},
id: "2", name: "Alpine Adventure Documentary", price: "Full Production", imageSrc: "http://img.b2bpic.net/free-photo/girl-taking-photo-her-friends-group-young-friends-hiking-through-forest-travel-hiking-adventure-concept_613910-18677.jpg?_wi=2", imageAlt: "Alpine adventure documentary"
},
{
id: "3", name: "Brand Promotion Series", price: "Social Content", imageSrc: "http://img.b2bpic.net/free-photo/cheery-young-man-filming-his-video-blog-episode_171337-5517.jpg?_wi=2", imageAlt: "Brand promotion video series"},
id: "3", name: "Brand Promotion Series", price: "Social Content", imageSrc: "http://img.b2bpic.net/free-photo/cheery-young-man-filming-his-video-blog-episode_171337-5517.jpg?_wi=2", imageAlt: "Brand promotion video series"
},
{
id: "4", name: "Event Photography Package", price: "Full Event", imageSrc: "http://img.b2bpic.net/free-photo/portrait-photographer-photo-art-concept_23-2148565566.jpg?_wi=2", imageAlt: "Professional event photography"},
id: "4", name: "Event Photography Package", price: "Full Event", imageSrc: "http://img.b2bpic.net/free-photo/portrait-photographer-photo-art-concept_23-2148565566.jpg?_wi=2", imageAlt: "Professional event photography"
},
]}
gridVariant="bento-grid"
animationType="slide-up"
@@ -155,16 +176,20 @@ export default function HomePage() {
metrics={[
{
id: "1", icon: Video,
title: "Professional Equipment", value: "4K Ready"},
title: "Professional Equipment", value: "4K Ready"
},
{
id: "2", icon: Users,
title: "Experience", value: "100+ Events"},
title: "Experience", value: "100+ Events"
},
{
id: "3", icon: Zap,
title: "Fast Delivery", value: "48hr Turnaround"},
title: "Fast Delivery", value: "48hr Turnaround"
},
{
id: "4", icon: Shield,
title: "Reliability", value: "99.9% Uptime"},
title: "Reliability", value: "99.9% Uptime"
},
]}
animationType="scale-rotate"
textboxLayout="default"
@@ -180,13 +205,17 @@ export default function HomePage() {
tagIcon={Quote}
testimonials={[
{
id: "1", name: "James Richardson, Event Director", date: "Date: 15 January 2025", title: "Exceptional professionalism and reliability", quote: "CSBIMAGERY handled our mountain bike championship livestream flawlessly. The multi-camera setup was seamless, and their technical support was outstanding. We'll definitely work with them again.", tag: "Sports Event", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/group-bicycles-forest_53876-40323.jpg?_wi=3"},
id: "1", name: "James Richardson, Event Director", date: "Date: 15 January 2025", title: "Exceptional professionalism and reliability", quote: "CSBIMAGERY handled our mountain bike championship livestream flawlessly. The multi-camera setup was seamless, and their technical support was outstanding. We'll definitely work with them again.", tag: "Sports Event", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/group-bicycles-forest_53876-40323.jpg?_wi=3"
},
{
id: "2", name: "Sarah Mitchell, Marketing Manager", date: "Date: 10 January 2025", title: "Transformed our social media presence", quote: "The social media content they created for us generated triple the engagement we were expecting. Fast turnarounds, creative ideas, and professional execution. Highly recommended.", tag: "Brand Content", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/cheery-young-man-filming-his-video-blog-episode_171337-5517.jpg?_wi=3"},
id: "2", name: "Sarah Mitchell, Marketing Manager", date: "Date: 10 January 2025", title: "Transformed our social media presence", quote: "The social media content they created for us generated triple the engagement we were expecting. Fast turnarounds, creative ideas, and professional execution. Highly recommended.", tag: "Brand Content", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/cheery-young-man-filming-his-video-blog-episode_171337-5517.jpg?_wi=3"
},
{
id: "3", name: "Michael Chen, Documentary Producer", date: "Date: 5 January 2025", title: "Cinematic quality storytelling", quote: "Their documentary work captured the essence of our outdoor adventure perfectly. The colour grading and editing were cinema-quality. They made our vision come to life.", tag: "Documentary", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/girl-taking-photo-her-friends-group-young-friends-hiking-through-forest-travel-hiking-adventure-concept_613910-18677.jpg?_wi=3"},
id: "3", name: "Michael Chen, Documentary Producer", date: "Date: 5 January 2025", title: "Cinematic quality storytelling", quote: "Their documentary work captured the essence of our outdoor adventure perfectly. The colour grading and editing were cinema-quality. They made our vision come to life.", tag: "Documentary", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/girl-taking-photo-her-friends-group-young-friends-hiking-through-forest-travel-hiking-adventure-concept_613910-18677.jpg?_wi=3"
},
{
id: "4", name: "Emma Davies, Tourism Director", date: "Date: 20 December 2024", title: "Professional and reliable partner", quote: "We've worked with CSBIMAGERY on multiple projects. They consistently deliver high-quality work on time and within budget. They're an invaluable part of our marketing strategy.", tag: "Tourism Campaign", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/control-room-desk-with-motorized-faders-multiple-knobs_482257-83509.jpg"},
id: "4", name: "Emma Davies, Tourism Director", date: "Date: 20 December 2024", title: "Professional and reliable partner", quote: "We've worked with CSBIMAGERY on multiple projects. They consistently deliver high-quality work on time and within budget. They're an invaluable part of our marketing strategy.", tag: "Tourism Campaign", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/control-room-desk-with-motorized-faders-multiple-knobs_482257-83509.jpg"
},
]}
textboxLayout="default"
useInvertedBackground={false}
@@ -215,4 +244,4 @@ export default function HomePage() {
</div>
</ThemeProvider>
);
}
}

18
src/app/styles/variables.css
View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #fffefe;
--card: #f6f7f4;
--foreground: #080908;
--primary-cta: #0e3a29;
--primary-cta-text: #fffefe;
--secondary-cta: #e7eecd;
--secondary-cta-text: #080908;
--accent: #35c18b;
--background-accent: #ecebe4;
--background: #252525;
--card: #1a1a1a;
--foreground: #ffffff;
--primary-cta: #e34400;
--primary-cta-text: #ffffff;
--secondary-cta: #010101;
--secondary-cta-text: #ffffff;
--accent: #737373;
--background-accent: #e34400;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);