[V0_FILE]typescriptreact:file="components/navbar.tsx" isEdit="true" isMerged="true" "use client" import { useEffect, useState } from "react" import Link from "next/link" export default function Navbar() { const [isScrolled, setIsScrolled] = useState(false) useEffect(() => { const handleScroll = () => { setIsScrolled(window.scrollY > 0) } window.addEventListener("scroll", handleScroll) return () => window.removeEventListener("scroll", handleScroll) }, []) const scrollToSection = (sectionId: string) => { const element = document.getElementById(sectionId) if (element) { element.scrollIntoView({ behavior: "smooth" }) } } return ( ) } [V0_FILE]typescriptreact:file="components/cta-section.tsx" isEdit="true" isMerged="true" export default function CTASection() { return (

Elevate your software quality with our expert QA solutions

) } [V0_FILE]typescriptreact:file="components/footer.tsx" isEdit="true" isQuickEdit="true" isMerged="true" export default function Footer() { return ( ) } [V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" isMerged="true" import Navbar from "@/components/navbar" import Hero from "@/components/hero" import Services from "@/components/services" import Features from "@/components/features" import CTASection from "@/components/cta-section" import Footer from "@/components/footer" export default function Home() { return (

) } [V0_FILE]typescript:file="tailwind.config.ts" isEdit="true" isMerged="true" import type { Config } from "tailwindcss" const config: Config = { darkMode: ["class"], content: [ "./pages/**/*.{js,ts,jsx,tsx,mdx}", "./components/**/*.{js,ts,jsx,tsx,mdx}", "./app/**/*.{js,ts,jsx,tsx,mdx}", "app/**/*.{ts,tsx}", "components/**/*.{ts,tsx}", ], theme: { extend: { fontFamily: { title: ["var(--font-space-grotesk)"], content: ["var(--font-roboto-serif)"], }, colors: { border: "hsl(var(--border))", input: "hsl(var(--input))", ring: "hsl(var(--ring))", background: "hsl(var(--background))", foreground: "hsl(var(--foreground))", primary: { DEFAULT: "hsl(var(--primary))", foreground: "hsl(var(--primary-foreground))", }, secondary: { DEFAULT: "hsl(var(--secondary))", foreground: "hsl(var(--secondary-foreground))", }, destructive: { DEFAULT: "hsl(var(--destructive))", foreground: "hsl(var(--destructive-foreground))", }, muted: { DEFAULT: "hsl(var(--muted))", foreground: "hsl(var(--muted-foreground))", }, accent: { DEFAULT: "hsl(var(--accent))", foreground: "hsl(var(--accent-foreground))", }, popover: { DEFAULT: "hsl(var(--popover))", foreground: "hsl(var(--popover-foreground))", }, card: { DEFAULT: "hsl(var(--card))", foreground: "hsl(var(--card-foreground))", }, "section-bg": "var(--section-bg)", }, borderRadius: { lg: "var(--radius)", md: "calc(var(--radius) - 2px)", sm: "calc(var(--radius) - 4px)", }, }, }, plugins: [require("tailwindcss-animate")], } export default config [V0_FILE]typescriptreact:file="app/layout.tsx" isEdit="true" import type { Metadata } from "next" import { Space_Grotesk, Inter } from "next/font/google" import "./globals.css" import type React from "react" const spaceGrotesk = Space_Grotesk({ subsets: ["latin"], weight: ["300", "400", "500", "600"], variable: "--font-space-grotesk", }) const inter = Inter({ subsets: ["latin"], weight: ["400"], variable: "--font-inter", }) export const metadata: Metadata = { title: "streakforce | Testing Labs", description: "Improving Software Quality with Innovative Testing Solutions", } export default function RootLayout({ children, }: { children: React.ReactNode }) { return ( {children} ) } [V0_FILE]css:file="app/globals.css" isEdit="true" @tailwind base; @tailwind components; @tailwind utilities; :root { --background: #ffffff; --foreground: #1a1a1a; --primary: #1f2937; --accent: #9f7aea; --section-bg: #f9f7f3; --footer-bg: #021410; --text-dark: #1a1a1a; } .dark-section { background-color: var(--footer-bg); } .section-bg { background-color: var(--section-bg); } body { background-color: var(--background); color: var(--foreground); font-size: 16px; line-height: 1.5; } h1, h2, h3, h4, h5, h6 { font-family: var(--font-space-grotesk); font-weight: 500; line-height: 1.2; } .title-font { font-family: var(--font-space-grotesk); } .content-font { font-family: var(--font-inter); } .button-font { font-family: var(--font-space-grotesk); } .underline-word { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; } @layer utilities { .text-balance { text-wrap: balance; } } .section-title { @apply text-sm mb-6 title-font font-medium uppercase tracking-wider text-black; } .section-heading { @apply text-3xl md:text-4xl mb-16 max-w-2xl title-font font-semibold; } .section-description { @apply text-base font-normal leading-relaxed max-w-3xl; font-family: var(--font-inter); color: var(--text-dark); } .footer-text { @apply text-sm md:text-base button-font font-normal; } .nav-text { @apply text-sm button-font font-normal; } [V0_FILE]typescriptreact:file="components/services.tsx" isEdit="true" export default function Services() { const services = [ { id: "01", title: "Automation", description: "Automation testing services include E2E testing, as well as integration and functionality API testing. API automated testing can start with shift-left testing. E2E automated tests are developed once the software reaches a stable state.", }, { id: "02", title: "Functional testing", description: "Functional testing involves a thorough verification of features and user flows, ensuring smooth functionality and an optimal user experience in all application scenarios.", }, { id: "03", title: "Security testing", description: "Security testing is integrated into the testing process, focusing on common vulnerabilities using automated methodologies. It includes API security testing and basic vulnerability demonstrations as proof of concept.", }, { id: "04", title: "Game testing", description: "Game testing involves specialized testing for web and mobile applications on Android and iOS, focusing on functionality and cross-platform compatibility.", }, ] return (

WHAT WE DO

Complete testing solutions for modern applications.

{services.map((service) => (

{service.id}

{service.title}

{service.description}

))}

) } [V0_FILE]typescriptreact:file="components/features.tsx" isEdit="true" import { ArrowRight } from "lucide-react" export default function Features() { const features = [ { title: "The code and results are 100% yours", description: "Everything produced, from automation scripts to quality reports, is entirely yours. Every detail is carefully documented to ensure you can maintain and scale the results long-term.", }, { title: "Confidentiality is a priority", description: "Confidentiality is a priority, and trust is essential. Strict measures are in place to protect your confidential information, ensuring your project is handled with the highest level of care and security. Any confidential information, such as a small exploitation of a vulnerability, will be immediately destroyed from the system once a report containing those vulnerabilities is sent", }, { title: "Your success is the priority", description: "Long-term relationships are key. Quality and a focus on exceeding expectations help build lasting collaborations based on consistent and reliable results.", }, { title: "Total flexibility", description: "Our outsourcing company specializes in comprehensive staff augmentation management, adapting to the specific needs of each project. We provide the right talent with the flexibility to scale the team according to the project's requirements and progress. Whether you need short-term or long-term resources, we offer tailored solutions to ensure the success of your project.", }, { title: "Complete commitment to your project", description: "Each project has a dedicated team working exclusively on your objectives. Without distractions or context switching, personalized attention and results that meet the highest expectations are guaranteed.", }, { title: "Reducing the gap between traditional testing and security testing", description: "Traditionally, security testing has often been overlooked. However, in today's landscape, it is essential, as companies of all sizes are vulnerable to cyberattacks. The security testing process must be conducted by an ethical specialist due to the sensitive nature of the methodology and the need to limit access in order to protect critical data.", }, ] return (

OUR DIFFERENCE

What makes us your ideal QA partner

{features.map((feature, index) => (

{feature.title}

{feature.description}

))}

) } [V0_FILE]typescriptreact:file="components/hero.tsx" isEdit="true" export default function Hero() { return (

Elevating Software Quality Through Testing{" "} Solutions

We deliver exceptional quality assurance results by combining technical expertise with strategic thinking. Our services are meticulously tailored to meet the unique needs of each company, ensuring optimal solutions across web, mobile, and gaming platforms.

) }