-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
138 lines (135 loc) · 8.88 KB
/
index.html
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
137
138
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lucas Eduardo Schuster</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="shortcut icon" href="img/favicon-32x32.png" type="image/x-icon">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@600&family=Roboto&display=swap" rel="stylesheet">
<script src="js/copyText.js"></script>
<script src="js/copyright.js"></script>
<script src="https://kit.fontawesome.com/2cde1942cf.js" crossorigin="anonymous"></script>
</head>
<body class="bg-[#1C1C1C] ">
<header>
<div class="flex h-[28rem] justify-center">
<div class="max-h-full w-screen bg-[url('/img/wallpaper.png')] bg-center bg-cover relative">
<div class="w-full h-full flex flex-col justify-center items-center backdrop-blur-[3px]"></div>
<div class="absolute inset-0 flex items-center justify-center">
<div class="absolute inset-0 flex flex-col justify-center items-center">
<h1
class="text-white text-4xl sm:text-5xl md:text-6xl lg:text-7xl font-semibold inline-block font-['Poppins'] break-words">
Olá, eu sou o Lucas 👋🏻</h1>
<p class="text-white text-xl font-semibold font-['Poppins']">Um amante de tecnologia</p>
</div>
</div>
</div>
</div>
</header>
<main>
<div>
<div class=" justify-center">
<div class="flex flex-col justify-center items-center">
<h2 class="text-center text-white text-5xl font-['Poppins'] mt-12">Um breve resuminho</h2>
<p class="w-[50%] text-center text-white text-xl font-['Roboto'] mt-4">Meu nome é Lucas, atualmente
moro no estado do Rio Grande do Sul, na cidade de Não-Me-toque. Atuo como desenvolvedor Full
Stack.</p>
</div>
<div class="flex flex-col justify-center items-center mt-16">
<h2 class="text-center text-white text-5xl font-['Poppins']">Tecnologias mais utilizadas</h2>
<h5 class="text-white text-left text-2xl mt-8 mb-2 font-['Poppins'] font-semibold">Front-End</h5>
<div>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:border-transparent transition-all duration-300">
Livewire
</button>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
Bootstrap
</button>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
Tailwind
</button>
</div>
<h5 class="text-white text-left text-2xl mt-8 mb-2 font-['Poppins'] font-semibold">Back-End</h5>
<div>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
PhP
</button>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
Laravel
</button>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
Java
</button>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
Sql
</button>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
Python
</button>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
C
</button>
</div>
<h5 class="text-white text-left text-2xl mt-8 mb-2 font-['Poppins'] font-semibold">Banco de dados
</h5>
<div>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
Oracle
</button>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
MySQL
</button>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
Firebase
</button>
<button
class="rounded-full border border-[#273dff] bg-transparent px-4 py-2 text-white font-semibold hover:bg-[#273dff] hover:text-white hover:border-transparent transition-all duration-300">
PostgreSQL
</button>
</div>
</div>
<div class="flex flex-col justify-center items-center mt-16">
<h2 class="text-center text-white text-5xl font-['Poppins']">Me conheça um pouco mais!</h2>
<div class="my-6 space-x-2">
<a class="rounded-full bg-[#273dff] px-4 py-2 text-white font-semibold hover:bg-[#2609b2] hover:text-white hover:border-transparent transition-all duration-300"
href="https://www.linkedin.com/in/lucas-eduardo-schuster-945535231/" target="_blank">
Linkedin <i class="fa-solid fa-arrow-up-right-from-square text-white"></i>
</a>
<a class="rounded-full bg-[#273dff] px-4 py-2 text-white font-semibold hover:bg-[#2609b2] hover:text-white hover:border-transparent transition-all duration-300"
href="https://github.com/LukasSchusta" target="_blank">
Github <i class="fa-solid fa-arrow-up-right-from-square text-white"></i>
</a>
<button class="rounded-full bg-[#273dff] px-4 py-2 text-white font-semibold hover:bg-[#2609b2] hover:text-white hover:border-transparent transition-all duration-300"
onclick="copyText('[email protected]')">
Email <i class="fa-regular fa-copy"></i>
</a>
<div id="alertaCopiado" class="hidden bg-[#273dff] text-white font-semibold px-4 py-2 rounded fixed top-0 right-2 mt-5 mr-5 transition-opacity duration-500">
Copiado para a área de transferência
</div>
</div>
</div>
</div>
</div>
</main>
<footer class="bg-[#151515]">
<div class="flex justify-center items-center">
<p id="copyright" class="text-white text-sm font-['Roboto'] my-4"></p>
</div>
</footer>
</body>
</html>