Spaces:
Running
Running
| <html lang="pt-BR" data-bs-theme="light"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Cooperchip - Desenvolvimento de Software e Consultoria</title> | |
| <!-- Bootstrap 5.3.x CSS --> | |
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"> | |
| <!-- Font Awesome --> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"> | |
| <!-- Custom CSS --> | |
| <style> | |
| :root { | |
| --primary-color: #2c3e50; | |
| --secondary-color: #3498db; | |
| --accent-color: #e74c3c; | |
| --light-color: #ecf0f1; | |
| --dark-color: #2c3e50; | |
| } | |
| body { | |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; | |
| line-height: 1.6; | |
| } | |
| .navbar-brand img { | |
| height: 40px; | |
| } | |
| .hero-section { | |
| background: linear-gradient(135deg, var(--primary-color), var(--secondary-color)); | |
| color: white; | |
| padding: 5rem 0; | |
| } | |
| .service-card { | |
| transition: transform 0.3s ease; | |
| border: none; | |
| box-shadow: 0 5px 15px rgba(0,0,0,0.1); | |
| } | |
| .service-card:hover { | |
| transform: translateY(-10px); | |
| } | |
| .course-card { | |
| border: none; | |
| box-shadow: 0 5px 15px rgba(0,0,0,0.1); | |
| } | |
| .course-badge { | |
| position: absolute; | |
| top: -10px; | |
| right: -10px; | |
| background-color: var(--accent-color); | |
| color: white; | |
| border-radius: 50%; | |
| width: 40px; | |
| height: 40px; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| font-weight: bold; | |
| } | |
| .social-icon { | |
| font-size: 1.5rem; | |
| margin-right: 1rem; | |
| color: var(--primary-color); | |
| transition: color 0.3s ease; | |
| } | |
| .social-icon:hover { | |
| color: var(--secondary-color); | |
| } | |
| .theme-toggle { | |
| cursor: pointer; | |
| } | |
| footer { | |
| background-color: var(--primary-color); | |
| color: white; | |
| } | |
| /* Dark mode styles */ | |
| [data-bs-theme="dark"] { | |
| --primary-color: #34495e; | |
| --secondary-color: #2980b9; | |
| --light-color: #2c3e50; | |
| --dark-color: #ecf0f1; | |
| } | |
| [data-bs-theme="dark"] .service-card, | |
| [data-bs-theme="dark"] .course-card { | |
| background-color: #34495e; | |
| color: white; | |
| box-shadow: 0 5px 15px rgba(0,0,0,0.3); | |
| } | |
| [data-bs-theme="dark"] .social-icon { | |
| color: white; | |
| } | |
| [data-bs-theme="dark"] .social-icon:hover { | |
| color: var(--secondary-color); | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <!-- Navigation --> | |
| <nav class="navbar navbar-expand-lg navbar-dark bg-primary sticky-top"> | |
| <div class="container"> | |
| <a class="navbar-brand" href="#"> | |
| <img src="https://cooperchip.com.br/wp-content/uploads/2023/10/logo-cooperchip.png" alt="Cooperchip Logo"> | |
| </a> | |
| <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> | |
| <span class="navbar-toggler-icon"></span> | |
| </button> | |
| <div class="collapse navbar-collapse" id="navbarNav"> | |
| <ul class="navbar-nav ms-auto"> | |
| <li class="nav-item"> | |
| <a class="nav-link active" href="#home">Início</a> | |
| </li> | |
| <li class="nav-item"> | |
| <a class="nav-link" href="#about">Sobre Nós</a> | |
| </li> | |
| <li class="nav-item"> | |
| <a class="nav-link" href="#services">Serviços</a> | |
| </li> | |
| <li class="nav-item"> | |
| <a class="nav-link" href="#courses">Cursos</a> | |
| </li> | |
| <li class="nav-item"> | |
| <a class="nav-link" href="#gpt">Agente GPT</a> | |
| </li> | |
| <li class="nav-item"> | |
| <a class="nav-link" href="#samples">Amostras</a> | |
| </li> | |
| <li class="nav-item"> | |
| <a class="nav-link" href="#contact">Contato</a> | |
| </li> | |
| </ul> | |
| <div class="ms-3 theme-toggle"> | |
| <i class="fas fa-moon text-white"></i> | |
| </div> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- Hero Section --> | |
| <section id="home" class="hero-section"> | |
| <div class="container"> | |
| <div class="row align-items-center"> | |
| <div class="col-lg-6"> | |
| <h1 class="display-4 fw-bold mb-4">Cooperchip - Soluções em Tecnologia</h1> | |
| <p class="lead mb-4">Especializada em desenvolvimento de software e consultoria em TI, oferecemos soluções personalizadas para impulsionar seu negócio.</p> | |
| <div class="d-flex gap-3 mb-4"> | |
| <a href="#contact" class="btn btn-light btn-lg">Contate-nos</a> | |
| <a href="#courses" class="btn btn-outline-light btn-lg">Nossos Cursos</a> | |
| </div> | |
| <div class="social-links"> | |
| <a href="#" class="social-icon"><i class="fab fa-facebook-f"></i></a> | |
| <a href="#" class="social-icon"><i class="fab fa-twitter"></i></a> | |
| <a href="#" class="social-icon"><i class="fab fa-linkedin-in"></i></a> | |
| <a href="#" class="social-icon"><i class="fab fa-whatsapp"></i></a> | |
| </div> | |
| </div> | |
| <div class="col-lg-6 d-none d-lg-block"> | |
| <img src="https://cooperchip.com.br/wp-content/uploads/2023/10/carlos-alberto-santos.png" alt="Carlos Alberto dos Santos" class="img-fluid rounded-circle"> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- About Section --> | |
| <section id="about" class="py-5 bg-light"> | |
| <div class="container"> | |
| <div class="row"> | |
| <div class="col-lg-6"> | |
| <h2 class="display-5 fw-bold mb-4">Sobre Nós</h2> | |
| <p class="lead">A Cooperchip é uma empresa especializada em desenvolvimento de software e consultoria em TI, liderada por Carlos Alberto dos Santos, profissional com mais de 20 anos de experiência na área.</p> | |
| <p>Nossa missão é fornecer soluções tecnológicas de alta qualidade que atendam às necessidades específicas de cada cliente, utilizando as melhores práticas e tecnologias modernas.</p> | |
| <ul class="list-unstyled"> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Experiência comprovada em projetos complexos</li> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Foco em resultados e satisfação do cliente</li> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Metodologias ágeis e transparentes</li> | |
| </ul> | |
| </div> | |
| <div class="col-lg-6"> | |
| <div class="card border-0 shadow"> | |
| <div class="card-body p-4"> | |
| <h3 class="h4 mb-4">Carlos Alberto dos Santos</h3> | |
| <div class="d-flex mb-4"> | |
| <div class="flex-shrink-0"> | |
| <img src="https://cooperchip.com.br/wp-content/uploads/2023/10/carlos-alberto-santos.png" alt="Carlos Alberto" class="rounded-circle" width="80"> | |
| </div> | |
| <div class="flex-grow-1 ms-3"> | |
| <h5 class="mb-1">Fundador e Consultor Sênior</h5> | |
| <p class="text-muted mb-1">Especialista em .NET Core e Angular</p> | |
| <div class="small"> | |
| <span class="me-2"><i class="fas fa-star text-warning"></i> 5.0</span> | |
| <span class="me-2"><i class="fas fa-project-diagram text-primary"></i> 50+ projetos</span> | |
| <span><i class="fas fa-award text-success"></i> 20+ anos</span> | |
| </div> | |
| </div> | |
| </div> | |
| <p>Profissional experiente com vasto conhecimento em desenvolvimento de software, arquitetura de sistemas e gestão de projetos. Especializado em tecnologias Microsoft (.NET Core) e frameworks front-end como Angular.</p> | |
| <div class="d-flex flex-wrap gap-2"> | |
| <span class="badge bg-primary">.NET Core</span> | |
| <span class="badge bg-primary">Angular</span> | |
| <span class="badge bg-primary">Web API</span> | |
| <span class="badge bg-primary">Entity Framework</span> | |
| <span class="badge bg-primary">Azure</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Services Section --> | |
| <section id="services" class="py-5"> | |
| <div class="container"> | |
| <div class="text-center mb-5"> | |
| <h2 class="display-5 fw-bold">Nossos Serviços</h2> | |
| <p class="lead text-muted">Soluções tecnológicas personalizadas para seu negócio</p> | |
| </div> | |
| <div class="row g-4"> | |
| <div class="col-md-4"> | |
| <div class="card service-card h-100"> | |
| <div class="card-body p-4 text-center"> | |
| <div class="icon-box mb-4"> | |
| <i class="fas fa-code fa-3x text-primary"></i> | |
| </div> | |
| <h3 class="h4 mb-3">Desenvolvimento de Software</h3> | |
| <p class="text-muted">Sistemas personalizados desenvolvidos com as melhores tecnologias do mercado, garantindo performance, segurança e escalabilidade.</p> | |
| <ul class="list-unstyled text-start"> | |
| <li class="mb-2"><i class="fas fa-check text-success me-2"></i> Aplicações Web e Mobile</li> | |
| <li class="mb-2"><i class="fas fa-check text-success me-2"></i> Arquitetura Moderna</li> | |
| <li class="mb-2"><i class="fas fa-check text-success me-2"></i> Integração com APIs</li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="col-md-4"> | |
| <div class="card service-card h-100"> | |
| <div class="card-body p-4 text-center"> | |
| <div class="icon-box mb-4"> | |
| <i class="fas fa-user-tie fa-3x text-primary"></i> | |
| </div> | |
| <h3 class="h4 mb-3">Consultoria Especializada</h3> | |
| <p class="text-muted">Consultoria técnica para ajudar sua empresa a tomar as melhores decisões tecnológicas e otimizar seus processos.</p> | |
| <ul class="list-unstyled text-start"> | |
| <li class="mb-2"><i class="fas fa-check text-success me-2"></i> Análise de Arquitetura</li> | |
| <li class="mb-2"><i class="fas fa-check text-success me-2"></i> Migração de Sistemas</li> | |
| <li class="mb-2"><i class="fas fa-check text-success me-2"></i> Otimização de Performance</li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="col-md-4"> | |
| <div class="card service-card h-100"> | |
| <div class="card-body p-4 text-center"> | |
| <div class="icon-box mb-4"> | |
| <i class="fas fa-graduation-cap fa-3x text-primary"></i> | |
| </div> | |
| <h3 class="h4 mb-3">Treinamentos e Cursos</h3> | |
| <p class="text-muted">Cursos especializados em tecnologias modernas para capacitar sua equipe ou iniciantes na área de desenvolvimento.</p> | |
| <ul class="list-unstyled text-start"> | |
| <li class="mb-2"><i class="fas fa-check text-success me-2"></i> .NET Core e Angular</li> | |
| <li class="mb-2"><i class="fas fa-check text-success me-2"></i> Web Scraping</li> | |
| <li class="mb-2"><i class="fas fa-check text-success me-2"></i> Segurança em APIs</li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Courses Section --> | |
| <section id="courses" class="py-5 bg-light"> | |
| <div class="container"> | |
| <div class="text-center mb-5"> | |
| <h2 class="display-5 fw-bold">Cursos e Promoções</h2> | |
| <p class="lead text-muted">Aprenda com quem tem experiência no mercado</p> | |
| </div> | |
| <div class="row g-4"> | |
| <div class="col-md-6"> | |
| <div class="card course-card h-100 position-relative"> | |
| <div class="course-badge">PROMO</div> | |
| <div class="card-body p-4"> | |
| <h3 class="h4 mb-3">Web Scraping com Asp.Net Core 7 e Angular 16</h3> | |
| <p class="text-muted mb-4">Aprenda a desenvolver aplicações de web scraping robustas utilizando as tecnologias mais modernas do mercado.</p> | |
| <ul class="list-unstyled mb-4"> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> HtmlAgilityPack avançado</li> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Integração frontend-backend</li> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Armazenamento em banco de dados</li> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Casos reais de uso</li> | |
| </ul> | |
| <div class="d-flex justify-content-between align-items-center"> | |
| <div> | |
| <span class="text-decoration-line-through text-muted me-2">R$ 299,90</span> | |
| <span class="h4 text-primary">R$ 199,90</span> | |
| </div> | |
| <a href="#" class="btn btn-primary">Saiba Mais</a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="col-md-6"> | |
| <div class="card course-card h-100 position-relative"> | |
| <div class="course-badge">NOVO</div> | |
| <div class="card-body p-4"> | |
| <h3 class="h4 mb-3">Segurança com Asp.Net Core 7 e Angular 16</h3> | |
| <p class="text-muted mb-4">Domine os conceitos de segurança em aplicações web modernas com JWT, AccessToken e RefreshToken.</p> | |
| <ul class="list-unstyled mb-4"> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Autenticação e Autorização</li> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> JWT avançado</li> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Refresh Tokens</li> | |
| <li class="mb-2"><i class="fas fa-check-circle text-primary me-2"></i> Proteção contra ataques</li> | |
| </ul> | |
| <div class="d-flex justify-content-between align-items-center"> | |
| <div> | |
| <span class="h4 text-primary">R$ 249,90</span> | |
| </div> | |
| <a href="#" class="btn btn-primary">Saiba Mais</a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center mt-5"> | |
| <a href="#" class="btn btn-outline-primary btn-lg">Ver Todos os Cursos</a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- GPT Agent Section --> | |
| <section id="gpt" class="py-5"> | |
| <div class="container"> | |
| <div class="row align-items-center"> | |
| <div class="col-lg-6"> | |
| <img src="https://cooperchip.com.br/wp-content/uploads/2023/10/gpt-agent.png" alt="Agente GPT" class="img-fluid rounded"> | |
| </div> | |
| <div class="col-lg-6"> | |
| <h2 class="display-5 fw-bold mb-4">Agente GPT Asp.Net Core</h2> | |
| <p class="lead mb-4">Nosso agente de IA especializado em projetos .Net Core e Angular está disponível na OpenAI Store para auxiliar desenvolvedores.</p> | |
| <p>Este assistente virtual pode ajudar com:</p> | |
| <ul class="list-unstyled mb-4"> | |
| <li class="mb-2"><i class="fas fa-robot text-primary me-2"></i> Solução de problemas em código .NET Core</li> | |
| <li class="mb-2"><i class="fas fa-robot text-primary me-2"></i> Melhores práticas para Angular</li> | |
| <li class="mb-2"><i class="fas fa-robot text-primary me-2"></i> Arquitetura de software</li> | |
| <li class="mb-2"><i class="fas fa-robot text-primary me-2"></i> Integração entre frontend e backend</li> | |
| </ul> | |
| <a href="#" class="btn btn-primary btn-lg">Acessar na OpenAI Store</a> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Samples Section --> | |
| <section id="samples" class="py-5 bg-light"> | |
| <div class="container"> | |
| <div class="text-center mb-5"> | |
| <h2 class="display-5 fw-bold">Amostras | Aulas Liberadas</h2> | |
| <p class="lead text-muted">Conheça nosso material gratuitamente</p> | |
| </div> | |
| <div class="row g-4"> | |
| <div class="col-md-6"> | |
| <div class="card h-100 border-0 shadow"> | |
| <div class="card-body p-4"> | |
| <div class="embed-responsive embed-responsive-16by9 mb-4"> | |
| <iframe class="embed-responsive-item w-100" src="https://www.youtube.com/embed/VIDEO_ID" allowfullscreen style="height: 300px;"></iframe> | |
| </div> | |
| <h3 class="h4 mb-3">Backend com Asp.Net Core 7</h3> | |
| <p class="text-muted">Aula demonstrativa sobre criação de APIs RESTful com Asp.Net Core 7, Entity Framework e padrão Repository.</p> | |
| <a href="#" class="btn btn-outline-primary">Assistir Aula Completa</a> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="col-md-6"> | |
| <div class="card h-100 border-0 shadow"> | |
| <div class="card-body p-4"> | |
| <div class="embed-responsive embed-responsive-16by9 mb-4"> | |
| <iframe class="embed-responsive-item w-100" src="https://www.youtube.com/embed/VIDEO_ID" allowfullscreen style="height: 300px;"></iframe> | |
| </div> | |
| <h3 class="h4 mb-3">Frontend com Angular 16</h3> | |
| <p class="text-muted">Demonstração de criação de componentes, serviços e consumo de API em uma aplicação Angular 16.</p> | |
| <a href="#" class="btn btn-outline-primary">Assistir Aula Completa</a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center mt-5"> | |
| <a href="#" class="btn btn-primary btn-lg">Ver Mais Amostras</a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Web Scraping Section --> | |
| <section id="scraping" class="py-5"> | |
| <div class="container"> | |
| <div class="row align-items-center"> | |
| <div class="col-lg-6 order-lg-2"> | |
| <img src="https://cooperchip.com.br/wp-content/uploads/2023/10/web-scraping.png" alt="Web Scraping" class="img-fluid rounded"> | |
| </div> | |
| <div class="col-lg-6 order-lg-1"> | |
| <h2 class="display-5 fw-bold mb-4">Web Scraping com HtmlAgilityPack</h2> | |
| <p class="lead mb-4">Aprenda a extrair e processar dados da web de forma eficiente com a biblioteca HtmlAgilityPack em projetos .NET.</p> | |
| <p>Nossas soluções de web scraping permitem:</p> | |
| <ul class="list-unstyled mb-4"> | |
| <li class="mb-2"><i class="fas fa-check text-primary me-2"></i> Coleta de dados estruturados</li> | |
| <li class="mb-2"><i class="fas fa-check text-primary me-2"></i> Processamento de HTML complexo</li> | |
| <li class="mb-2"><i class="fas fa-check text-primary me-2"></i> Integração com bancos de dados</li> | |
| <li class="mb-2"><i class="fas fa-check text-primary me-2"></i> Automação de tarefas repetitivas</li> | |
| </ul> | |
| <div class="d-flex gap-3"> | |
| <a href="#" class="btn btn-primary">Ver Exemplos</a> | |
| <a href="#courses" class="btn btn-outline-primary">Fazer Curso</a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Contact Section --> | |
| <section id="contact" class="py-5 bg-light"> | |
| <div class="container"> | |
| <div class="row justify-content-center"> | |
| <div class="col-lg-8 text-center"> | |
| <h2 class="display-5 fw-bold mb-4">Entre em Contato</h2> | |
| <p class="lead mb-5">Tem dúvidas ou quer saber mais sobre nossos serviços? Preencha o formulário abaixo ou utilize nossos outros canais de comunicação.</p> | |
| </div> | |
| </div> | |
| <div class="row"> | |
| <div class="col-lg-6"> | |
| <form> | |
| <div class="mb-3"> | |
| <label for="name" class="form-label">Nome Completo</label> | |
| <input type="text" class="form-control" id="name" required> | |
| </div> | |
| <div class="mb-3"> | |
| <label for="email" class="form-label">E-mail</label> | |
| <input type="email" class="form-control" id="email" required> | |
| </div> | |
| <div class="mb-3"> | |
| <label for="phone" class="form-label">Telefone</label> | |
| <input type="tel" class="form-control" id="phone"> | |
| </div> | |
| <div class="mb-3"> | |
| <label for="subject" class="form-label">Assunto</label> | |
| <select class="form-select" id="subject"> | |
| <option value="service">Serviços</option> | |
| <option value="course">Cursos</option> | |
| <option value="consulting">Consultoria</option> | |
| <option value="other">Outro</option> | |
| </select> | |
| </div> | |
| <div class="mb-3"> | |
| <label for="message" class="form-label">Mensagem</label> | |
| <textarea class="form-control" id="message" rows="5" required></textarea> | |
| </div> | |
| <button type="submit" class="btn btn-primary btn-lg">Enviar Mensagem</button> | |
| </form> | |
| </div> | |
| <div class="col-lg-6"> | |
| <div class="card border-0 shadow h-100"> | |
| <div class="card-body p-4"> | |
| <h3 class="h4 mb-4">Outras Formas de Contato</h3> | |
| <ul class="list-unstyled mb-5"> | |
| <li class="mb-3"> | |
| <div class="d-flex align-items-center"> | |
| <div class="icon-box me-3"> | |
| <i class="fas fa-phone fa-2x text-primary"></i> | |
| </div> | |
| <div> | |
| <h5 class="mb-0">Telefone</h5> | |
| <p class="mb-0">+55 (XX) XXXX-XXXX</p> | |
| </div> | |
| </div> | |
| </li> | |
| <li class="mb-3"> | |
| <div class="d-flex align-items-center"> | |
| <div class="icon-box me-3"> | |
| <i class="fab fa-whatsapp fa-2x text-primary"></i> | |
| </div> | |
| <div> | |
| <h5 class="mb-0">WhatsApp</h5> | |
| <p class="mb-0">+55 (XX) XXXXX-XXXX</p> | |
| </div> | |
| </div> | |
| </li> | |
| <li class="mb-3"> | |
| <div class="d-flex align-items-center"> | |
| <div class="icon-box me-3"> | |
| <i class="fas fa-envelope fa-2x text-primary"></i> | |
| </div> | |
| <div> | |
| <h5 class="mb-0">E-mail</h5> | |
| <p class="mb-0">contato@cooperchip.com.br</p> | |
| </div> | |
| </div> | |
| </li> | |
| <li> | |
| <div class="d-flex align-items-center"> | |
| <div class="icon-box me-3"> | |
| <i class="fas fa-map-marker-alt fa-2x text-primary"></i> | |
| </div> | |
| <div> | |
| <h5 class="mb-0">Endereço</h5> | |
| <p class="mb-0">Cidade, Estado - Brasil</p> | |
| </div> | |
| </div> | |
| </li> | |
| </ul> | |
| <h3 class="h4 mb-3">Redes Sociais</h3> | |
| <div class="social-links"> | |
| <a href="#" class="btn btn-outline-primary btn-lg me-2 mb-2"><i class="fab fa-facebook-f me-2"></i> Facebook</a> | |
| <a href="#" class="btn btn-outline-primary btn-lg me-2 mb-2"><i class="fab fa-twitter me-2"></i> Twitter</a> | |
| <a href="#" class="btn btn-outline-primary btn-lg me-2 mb-2"><i class="fab fa-linkedin-in me-2"></i> LinkedIn</a> | |
| <a href="#" class="btn btn-outline-primary btn-lg mb-2"><i class="fab fa-instagram me-2"></i> Instagram</a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="py-5"> | |
| <div class="container"> | |
| <div class="row"> | |
| <div class="col-lg-4 mb-4 mb-lg-0"> | |
| <img src="https://cooperchip.com.br/wp-content/uploads/2023/10/logo-cooperchip.png" alt="Cooperchip Logo" width="180" class="mb-3"> | |
| <p class="text-white-50">Especializada em desenvolvimento de software e consultoria em TI, oferecemos soluções personalizadas para impulsionar seu negócio.</p> | |
| </div> | |
| <div class="col-lg-2 col-md-6 mb-4 mb-md-0"> | |
| <h5 class="text-white mb-4">Links Rápidos</h5> | |
| <ul class="list-unstyled"> | |
| <li class="mb-2"><a href="#home" class="text-white-50">Início</a></li> | |
| <li class="mb-2"><a href="#about" class="text-white-50">Sobre Nós</a></li> | |
| <li class="mb-2"><a href="#services" class="text-white-50">Serviços</a></li> | |
| <li class="mb-2"><a href="#courses" class="text-white-50">Cursos</a></li> | |
| <li><a href="#contact" class="text-white-50">Contato</a></li> | |
| </ul> | |
| </div> | |
| <div class="col-lg-3 col-md-6 mb-4 mb-md-0"> | |
| <h5 class="text-white mb-4">Serviços</h5> | |
| <ul class="list-unstyled"> | |
| <li class="mb-2"><a href="#" class="text-white-50">Desenvolvimento de Software</a></li> | |
| <li class="mb-2"><a href="#" class="text-white-50">Consultoria em TI</a></li> | |
| <li class="mb-2"><a href="#" class="text-white-50">Treinamentos Personalizados</a></li> | |
| <li><a href="#" class="text-white-50">Web Scraping</a></li> | |
| </ul> | |
| </div> | |
| <div class="col-lg-3 col-md-6"> | |
| <h5 class="text-white mb-4">Newsletter</h5> | |
| <p class="text-white-50 mb-4">Assine nossa newsletter para receber novidades e promoções.</p> | |
| <form class="mb-3"> | |
| <div class="input-group"> | |
| <input type="email" class="form-control" placeholder="Seu e-mail" required> | |
| <button class="btn btn-primary" type="submit">Assinar</button> | |
| </div> | |
| </form> | |
| <div class="social-links"> | |
| <a href="#" class="text-white me-3"><i class="fab fa-facebook-f"></i></a> | |
| <a href="#" class="text-white me-3"><i class="fab fa-twitter"></i></a> | |
| <a href="#" class="text-white me-3"><i class="fab fa-linkedin-in"></i></a> | |
| <a href="#" class="text-white"><i class="fab fa-instagram"></i></a> | |
| </div> | |
| </div> | |
| </div> | |
| <hr class="my-4 bg-white-50"> | |
| <div class="row"> | |
| <div class="col-md-6 text-center text-md-start"> | |
| <p class="small text-white-50 mb-0">© 2023 Cooperchip. Todos os direitos reservados.</p> | |
| </div> | |
| <div class="col-md-6 text-center text-md-end"> | |
| <p class="small text-white-50 mb-0">Desenvolvido com <i class="fas fa-heart text-danger"></i> pela Cooperchip</p> | |
| </div> | |
| </div> | |
| </div> | |
| </footer> | |
| <!-- Back to Top Button --> | |
| <a href="#" class="btn btn-primary btn-lg back-to-top" id="back-to-top"><i class="fas fa-arrow-up"></i></a> | |
| <!-- Bootstrap 5.3.x JS --> | |
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> | |
| <!-- Custom JS --> | |
| <script> | |
| // Theme toggle functionality | |
| document.addEventListener('DOMContentLoaded', function() { | |
| const themeToggle = document.querySelector('.theme-toggle'); | |
| const themeIcon = themeToggle.querySelector('i'); | |
| const htmlElement = document.documentElement; | |
| // Check for saved theme preference or use preferred color scheme | |
| const savedTheme = localStorage.getItem('theme') || | |
| (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'); | |
| // Apply the saved theme | |
| if (savedTheme === 'dark') { | |
| htmlElement.setAttribute('data-bs-theme', 'dark'); | |
| themeIcon.classList.replace('fa-moon', 'fa-sun'); | |
| } else { | |
| htmlElement.setAttribute('data-bs-theme', 'light'); | |
| themeIcon.classList.replace('fa-sun', 'fa-moon'); | |
| } | |
| // Toggle theme on click | |
| themeToggle.addEventListener('click', function() { | |
| if (htmlElement.getAttribute('data-bs-theme') === 'dark') { | |
| htmlElement.setAttribute('data-bs-theme', 'light'); | |
| themeIcon.classList.replace('fa-sun', 'fa-moon'); | |
| localStorage.setItem('theme', 'light'); | |
| } else { | |
| htmlElement.setAttribute('data-bs-theme', 'dark'); | |
| themeIcon.classList.replace('fa-moon', 'fa-sun'); | |
| localStorage.setItem('theme', 'dark'); | |
| } | |
| }); | |
| // Back to top button | |
| const backToTopButton = document.getElementById('back-to-top'); | |
| window.addEventListener('scroll', function() { | |
| if (window.pageYOffset > 300) { | |
| backToTopButton.style.display = 'block'; | |
| } else { | |
| backToTopButton.style.display = 'none'; | |
| } | |
| }); | |
| backToTopButton.addEventListener('click', function(e) { | |
| e.preventDefault(); | |
| window.scrollTo({top: 0, behavior: 'smooth'}); | |
| }); | |
| // Smooth scrolling for anchor links | |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { | |
| anchor.addEventListener('click', function(e) { | |
| e.preventDefault(); | |
| const targetId = this.getAttribute('href'); | |
| if (targetId === '#') return; | |
| const targetElement = document.querySelector(targetId); | |
| if (targetElement) { | |
| targetElement.scrollIntoView({ | |
| behavior: 'smooth' | |
| }); | |
| } | |
| }); | |
| }); | |
| // Navbar background change on scroll | |
| const navbar = document.querySelector('.navbar'); | |
| window.addEventListener('scroll', function() { | |
| if (window.scrollY > 50) { | |
| navbar.classList.add('navbar-scrolled'); | |
| } else { | |
| navbar.classList.remove('navbar-scrolled'); | |
| } | |
| }); | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=gallabs/site-cooperchip" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |