-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
136 lines (123 loc) · 9.42 KB
/
Copy pathindex.html
File metadata and controls
136 lines (123 loc) · 9.42 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<!DOCTYPE html>
<html lang="pt-BR" class="scroll-smooth">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Régis Picáz - Desenvolvedor de Software PHP/Laravel, VueJS & Tailwind</title>
<meta name="description" content="Desenvolvedor de Software especialista em PHP, Laravel, VueJS e Tailwind CSS, criando soluções web de alta performance. Conheça meu portfólio.">
<meta name="keywords" content="Desenvolvedor PHP, Laravel, VueJS, Tailwind CSS, Full-Stack, Backend, Frontend, Portfólio">
<meta name="author" content="Régis Picáz">
<meta name="theme-color" content="#111827">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<script src="https://cdn.tailwindcss.com"></script>
<script src="src/assets/js/app.js"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="src/assets/styles/app.css">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css">
</head>
<body class="antialiased">
<header class="bg-white/80 backdrop-blur-lg fixed top-0 left-0 right-0 z-40 shadow-sm">
<div class="container mx-auto px-6 py-4 flex justify-between items-center">
<a href="#" class="text-2xl font-bold tracking-wider">RÉGIS<span class="highlight-color">PICÁZ</span></a>
<nav class="hidden md:flex space-x-8 items-center">
<a href="#about" class="hover:text-red-500 transition-colors">Sobre</a>
<a href="#services" class="hover:text-red-500 transition-colors">Serviços</a>
<a href="#contact" class="bg-gray-800 text-white px-4 py-2 rounded-md hover:bg-red-500 transition-colors">Contato</a>
</nav>
<button id="menu-btn" class="md:hidden focus:outline-none" aria-label="Abrir menu">
<i class="fas fa-bars text-2xl"></i>
</button>
</div>
<div id="mobile-menu" class="hidden md:hidden">
<a href="#about" class="block py-2 px-6 text-sm hover:bg-gray-200">Sobre</a>
<a href="#services" class="block py-2 px-6 text-sm hover:bg-gray-200">Serviços</a>
<a href="#contact" class="block py-2 px-6 text-sm hover:bg-gray-200">Contato</a>
</div>
</header>
<main>
<section id="home" class="pt-28 pb-16">
<div class="container mx-auto px-6 grid md:grid-cols-2 gap-12 items-center">
<div class="text-center md:text-left">
<span class="text-red-500 font-semibold">DESENVOLVEDOR DE SOFTWARE</span>
<h1 class="text-4xl md:text-6xl font-extrabold my-4 leading-tight">Olá, sou RÉGIS PICÁZ</h1>
<p class="text-lg text-gray-600 mb-8">Especialista na criação de sistemas web robustos e escaláveis com <strong class="text-gray-800">PHP/Laravel</strong> para o backend e <strong class="text-gray-800">VueJS</strong> com <strong class="text-gray-800">Tailwind CSS</strong> para interfaces dinâmicas e modernas.</p>
<div class="flex justify-center md:justify-start space-x-4">
<a href="https://github.com/regispicaz" target="_blank" aria-label="Github" class="text-gray-700 hover:text-red-500"><i class="fab fa-github text-3xl"></i></a>
<a href="https://linkedin.com/in/regispicaz" target="_blank" aria-label="LinkedIn" class="text-gray-700 hover:text-red-500"><i class="fab fa-linkedin text-3xl"></i></a>
</div>
</div>
<div class="flex justify-center items-center">
<div class="relative w-64 h-64 md:w-80 md:h-80">
<div class="hero-image-container">
<img src="https://ecossistemas.online/assets/img/profile/profile_regis.jpg" alt="Foto de RÉGIS PICÁZ" class="rounded-full w-full h-full object-cover relative z-10 shadow-lg">
</div>
</div>
</div>
</div>
</section>
<section id="partners" class="py-12 bg-gray-100">
<div class="container mx-auto px-6 text-center">
<h3 class="text-sm font-bold tracking-widest text-gray-500 uppercase">TECNOLOGIAS QUE DOMINO</h3>
<div class="flex flex-wrap justify-center items-center gap-8 md:gap-16 mt-8">
<i class="fab fa-laravel text-5xl text-gray-500 hover:text-red-500 transition-colors" title="Laravel"></i>
<i class="fab fa-vuejs text-5xl text-gray-500 hover:text-green-500 transition-colors" title="VueJS"></i>
<i class="fab fa-php text-5xl text-gray-500 hover:text-indigo-500 transition-colors" title="PHP"></i>
<svg class="w-12 h-12 text-gray-500 hover:text-cyan-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path></svg> <i class="fab fa-js-square text-5xl text-gray-500 hover:text-yellow-500 transition-colors" title="JavaScript"></i>
<i class="fab fa-git-alt text-5xl text-gray-500 hover:text-orange-600 transition-colors" title="Git"></i>
</div>
</div>
</section>
<section id="about" class="py-20 animated-section">
<div class="container mx-auto px-6">
<div class="text-center">
<h2 class="text-3xl font-bold mb-4">Sobre Mim</h2>
<p class="max-w-3xl mx-auto text-gray-600">Sou um desenvolvedor apaixonado por transformar ideias em código limpo, eficiente e escalável. Com uma sólida experiência em todo o ecossistema Laravel e uma paixão por criar interfaces reativas com VueJS, meu objetivo é entregar produtos digitais que não apenas funcionem, mas que encantem os usuários.</p>
</div>
</div>
</section>
<section id="services" class="py-20 bg-gray-50 animated-section">
<div class="container mx-auto px-6">
<div class="text-center mb-12">
<h2 class="text-3xl font-bold">Serviços</h2>
<p class="text-gray-600 mt-2">Soluções completas para suas necessidades digitais.</p>
</div>
<div class="grid md:grid-cols-3 gap-8">
<div class="border-l-4 border-red-500 pl-6">
<h3 class="text-xl font-bold mb-2">Desenvolvimento Backend com Laravel</h3>
<p class="text-gray-600">Criação de APIs RESTful, sistemas de gerenciamento, e-commerce e aplicações complexas com a robustez e elegância do Laravel.</p>
</div>
<div class="border-l-4 border-red-500 pl-6">
<h3 class="text-xl font-bold mb-2">Desenvolvimento Frontend com VueJS</h3>
<p class="text-gray-600">Interfaces de usuário interativas, rápidas e modernas, utilizando todo o poder do ecossistema Vue (Vuex, Vue Router).</p>
</div>
<div class="border-l-4 border-red-500 pl-6">
<h3 class="text-xl font-bold mb-2">Integrações e Automações</h3>
<p class="text-gray-600">Integração com gateways de pagamento, CRMs, ERPs e automação de processos para otimizar a operação do seu negócio.</p>
</div>
</div>
</div>
</section>
</main>
<footer id="contact" class="bg-gray-800 text-white pt-16 pb-8">
<div class="container mx-auto px-6">
<div class="text-center mb-12">
<h2 class="text-3xl font-bold">Vamos conversar?</h2>
<p class="text-gray-400 mt-2 max-w-xl mx-auto">Estou sempre aberto a novas oportunidades e colaborações. Entre em contato para discutirmos como posso ajudar a tirar seu projeto do papel.</p>
<a href="https://wa.me/555392419079" target="_blank" class="inline-block bg-red-500 text-white px-8 py-3 rounded-md mt-6 font-bold hover:bg-red-600 transition-colors">Fale comigo no WhatsApp</a>
</div>
<div class="border-t border-gray-700 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
<p class="text-gray-400"><!-- © --> 2025 Régis Picaz. Todos os direitos reservados.</p>
<div class="flex space-x-6 mt-4 md:mt-0">
<a href="https://github.com/regispicaz" target="_blank" aria-label="Github" class="text-gray-400 hover:text-white"><i class="fab fa-github text-2xl"></i></a>
<a href="https://linkedin.com/in/regispicaz" target="_blank" aria-label="LinkedIn" class="text-gray-400 hover:text-white"><i class="fab fa-linkedin text-2xl"></i></a>
</div>
</div>
</div>
</footer>
<a href="https://wa.me/555392419079" target="_blank" class="fixed bottom-6 right-6 bg-green-500 text-white w-14 h-14 rounded-full flex items-center justify-center shadow-lg hover:bg-green-600 transition-all transform hover:scale-110" aria-label="Fale comigo no WhatsApp">
<i class="fab fa-whatsapp text-3xl"></i>
</a>
</body>
</html>