File: /var/www/laracopilot.stgviitor.com/laracopilot-wp/wp-content/themes/laracopilot/header.php
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo('charset'); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Favicon -->
<link rel="icon" type="image/x-icon" href="<?php echo esc_url(get_site_icon_url()); ?>">
<link rel="preload" href="<?php echo get_template_directory_uri(); ?>/assets/fonts/InstrumentSans-Regular.woff2" as="font" type="font/woff2" crossorigin>
<link rel="preload" href="<?php echo get_template_directory_uri(); ?>/assets/fonts/InstrumentSans-Regular.woff" as="font" type="font/woff" crossorigin>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@graph": [{
"@type": "Organization",
"name": "LaraCopilot",
"url": "https://laracopilot.com/",
"logo": "https://laracopilot.com/images/white-logo.svg",
"description": "LaraCopilot is an AI-powered assistant for Laravel developers, automating code generation, CRUD scaffolding, and boosting productivity in Laravel projects.",
"contactPoint": {
"@type": "ContactPoint",
"contactType": "customer support",
"email": "support@laracopilot.com"
},
"sameAs": [
"https://x.com/laracopilot"
]
},
{
"@type": "SoftwareApplication",
"name": "LaraCopilot",
"operatingSystem": "Web",
"applicationCategory": "DeveloperTool",
"url": "https://laracopilot.com/",
"description": "LaraCopilot automates Laravel development by generating CRUD scaffolding, validation rules, and tests, helping developers code faster with AI-powered workflows.",
"softwareVersion": "1.0",
"provider": {
"@type": "Organization",
"name": "LaraCopilot"
}
},
{
"@context": "https://schema.org",
"@type": "WebSite",
"name": "LaraCopilot",
"url": "https://laracopilot.com/",
"potentialAction": {
"@type": "SearchAction",
"target": "https://laracopilot.com/?s={search_term_string}",
"query-input": "required name=search_term_string"
}
}
]
}
</script>
<?php wp_head(); ?>
</head>
<body <?php body_class('min-h-[100dvh] relative'); ?> style="background-color: #000000; overflow-x: hidden; margin: 0; padding: 0;">
<div class="fixed inset-0 pointer-events-none bg-effects" aria-hidden="true" style="
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
overflow: hidden;
z-index: 0;
contain: strict;
will-change: auto;
">
<!-- Grid patterns as background image (no separate divs) -->
<div style="
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #000000;
background-image:
radial-gradient(circle at center, rgba(245, 48, 3, 0.2) 1px, transparent 1px),
radial-gradient(circle at center, rgba(245, 48, 3, 0.05) 1px, transparent 1px);
background-size: 30px 30px, 60px 60px;
background-position: 0 0, 0 0;
contain: strict;
"></div>
<!-- Single gradient overlay - Subtle like original -->
<div style="
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background:
radial-gradient(ellipse 1200px 1200px at 85% 10%, rgba(245, 48, 3, 0.18) 0%, transparent 60%),
radial-gradient(ellipse 800px 800px at 65% 35%, rgba(220, 38, 38, 0.08) 0%, transparent 55%),
radial-gradient(ellipse 1000px 1000px at 15% 85%, rgba(139, 69, 19, 0.06) 0%, transparent 60%),
radial-gradient(ellipse 600px 600px at 5% 65%, rgba(245, 48, 3, 0.07) 0%, transparent 55%);
contain: strict;
filter: blur(80px);
opacity: 0.5;
"></div>
<!-- Subtle vignette overlay -->
<div style="
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(ellipse at center, transparent 0%, rgba(0,0,0,0.2) 65%, rgba(0,0,0,0.5) 100%);
contain: strict;
"></div>
</div>
<!-- Main content wrapper -->
<div class="relative z-10" style="position: relative; z-index: 10;">
<!-- Navigation -->
<?php if (! is_page('get-in-touch')) { ?>
<nav id="header" class="fixed top-0 w-full bg-black/80 backdrop-blur-lg border-b border-red-500/20 z-50">
<div class="max-w-7xl mx-auto px-4 md:px-6 lg:px-0">
<div class="flex justify-between items-center py-4">
<div class="flex items-center relative">
<a href="<?php echo esc_url(home_url('/')); ?>" class="relative">
<?php
$custom_logo_id = get_theme_mod('custom_logo');
$logo_url = wp_get_attachment_image_url($custom_logo_id, 'full');
if ($logo_url) { ?>
<img src="<?php echo esc_url($logo_url); ?>" alt="<?php echo esc_attr(get_bloginfo('name')); ?>" height="32" width="132" class="h-8">
<?php } else { ?>
<img src="<?php echo get_template_directory_uri(); ?>/assets/images/white-logo.svg" alt="<?php bloginfo('name'); ?>" height="32" width="132" class="h-8" />
<?php } ?>
</a>
<?php /*
<!-- Interactive Monkey Hanging Beta Badge -->
<div class="relative ml-3 group cursor-pointer" onclick="console.log('🐵 Beta badge clicked!')">
<!-- Hanging string/rope -->
<div class="absolute top-0 left-1/2 transform -translate-x-1/2 w-0.5 h-3 bg-gradient-to-b from-red-300 to-red-400 rounded-full opacity-60 group-hover:animate-pulse"></div>
<!-- Main hanging badge container -->
<div class="relative transform-gpu transition-all duration-300 ease-out group-hover:animate-bounce sway" style="transform-origin: top center;">
<!-- Badge shadow for depth -->
<div class="absolute inset-0 bg-black/20 rounded-xl blur-sm transform translate-y-1 group-hover:translate-y-2 transition-transform duration-200"></div>
<!-- Main badge -->
<div class="relative bg-gradient-to-br from-red-500 via-red-600 to-red-700 text-white text-[10px] sm:text-xs font-bold tracking-wider px-3 py-1.5 rounded-xl border-2 border-red-300/40 shadow-2xl transform transition-all duration-200 group-hover:scale-110 group-hover:rotate-2 group-hover:shadow-red-500/50">
<span class="relative z-10 drop-shadow-md">BETA</span>
<!-- Interactive sparkles -->
<div class="absolute -top-1 -left-1 w-1 h-1 bg-red-500 rounded-full animate-ping group-hover:bg-red-600"></div>
<div class="absolute -bottom-1 -right-2 w-1 h-1 bg-red-500 rounded-full animate-ping" style="animation-delay: 0.5s;"></div>
<!-- Swinging rope effect on hover -->
<div class="absolute inset-0 bg-gradient-to-r from-transparent via-white/10 to-transparent transform -skew-x-12 -translate-x-full group-hover:translate-x-full transition-transform duration-400"></div>
</div>
<!-- Hanging chain/rope decorative elements -->
<div class="absolute -top-2 left-1/2 transform -translate-x-1/2 w-1 h-1 bg-red-400 rounded-full"></div>
<div class="absolute -top-1 left-1/2 transform -translate-x-1/2 w-0.5 h-0.5 bg-red-300 rounded-full"></div>
</div>
</div>
*/ ?>
</div>
<!-- Desktop Navigation -->
<div class="hidden lg:flex items-center space-x-6 lg:space-x-8 px-4">
<?php
wp_nav_menu(array(
'theme_location' => 'primary',
'menu_class' => 'flex items-center space-x-6 lg:space-x-8',
'container' => false,
));
?>
</div>
<!-- Auth Buttons (Desktop) -->
<?php
$sign_in_text = get_field('sign_in_text', 'option');
$sign_in_link = get_field('sign_in_link', 'option');
$get_start_text = get_field('get_start_text', 'option');
$get_start_link = get_field('get_start_link', 'option');
?>
<div class="hidden lg:flex items-center space-x-6">
<?php if ($sign_in_link) { ?>
<a href="<?php echo $sign_in_link; ?>" class="text-white/80 hover:text-white transition-colors font-medium py-2 block mobile-menu-link">
<?php echo $sign_in_text; ?>
</a>
<?php }
if ($get_start_link) { ?>
<a href="<?php echo $get_start_link; ?>" class="bg-red-600 text-white px-6 py-2.5 rounded-lg font-medium text-center md:inline-block mobile-menu-link">
<?php echo $get_start_text; ?>
</a>
<?php } ?>
</div>
<!-- Mobile menu button -->
<div class="lg:hidden flex items-center space-x-2">
<button id="mobile-menu-btn" class="text-white p-2 hover:bg-white/10 rounded-lg transition-colors duration-200" aria-label="Toggle Mobile Menu">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
</svg>
</button>
</div>
</div>
<!-- Mobile Navigation -->
<div id="mobile-menu" class="mobile-menu lg:hidden pb-4 border-t border-red-500/20 mt-4">
<div class="flex flex-col space-y-2 md:space-y-4 pt-4">
<?php
wp_nav_menu(array(
'theme_location' => 'primary',
'menu_class' => 'flex flex-col space-y-2 md:space-y-4',
'container' => false,
));
?>
<div class="border-t border-red-500/20 pt-4 mt-2">
<?php if ($sign_in_link) { ?>
<a href="<?php echo $sign_in_link; ?>" class="text-white/80 hover:text-white transition-colors font-medium py-2 block mobile-menu-link">
<?php echo $sign_in_text; ?>
</a>
<?php }
if ($get_start_link) { ?>
<a href="<?php echo $get_start_link; ?>" class="bg-red-600 text-white px-6 py-2.5 rounded-lg font-medium text-center md:inline-block mt-3 mobile-menu-link">
<?php echo $get_start_text; ?>
</a>
<?php } ?>
</div>
</div>
</div>
</div>
</nav>
<?php } ?>
<!-- Spacer for fixed header -->
<div style="height: 80px;"></div>
<!-- Main Content Area -->
<main class="relative">