tw
unknown
html
2 years ago
5.3 kB
2
Indexable
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="output.css">
</head>
<body>
<div class="mx-80 mt-12">
<!-- Navbar open -->
<div class="flex justify-between">
<div class="flex items-center">
<img src="assets/img/profile.png" alt="">
<h1 class="text-xl text-gray-700 font-semibold ml-4">Resaendr.</h1>
</div>
<div>
<a href="" class="bg-gray-100 px-6 py-2 rounded-lg">Portfolio</a>
<a href="" class="ml-14">Blog</a>
<a href="" class="ml-14">About Me</a>
<a href="" class="ml-14 text-gray-700 border-2 font-semibold border-gray-700 px-6 py-2 rounded-xl">Contact</a>
</div>
</div>
<!-- Navbar close -->
<!-- Text big open-->
<div class="mt-24">
<h1 class="text-5xl font-bold text-gray-700">👋 Hello, I'm a Remote UI/UX Designer based in Bandung, Indonesia.</h1>
</div>
<!-- Text big close-->
<!-- Recent projects open -->
<div class="flex justify-between mt-32">
<div class="flex items-center">
<div class="w-16 h-0.5 bg-gray-700 rounded-full"></div>
<div>
<h1 class="pl-4 text-lg">Recent projects</h1>
</div>
</div>
<div class="flex items-center">
<h1>See all</h1>
<img src="assets/icons/www.png" class="ml-4" alt="">
</div>
</div>
<div class="mt-9 grid grid-cols-3 gap-x-8">
<img src="assets/img/recents.png" alt="">
<img src="assets/img/recents.png" alt="">
<img src="assets/img/recents.png" alt="">
</div>
<!-- Recent projects close -->
<!-- Portfolio open -->
<div class="flex justify-between mt-32">
<div class="flex items-center">
<div class="w-16 h-0.5 bg-gray-700 rounded-full"></div>
<div>
<h1 class="pl-4 text-lg">Portfolio</h1>
</div>
</div>
</div>
<!-- content 1 open -->
<div class="mt-9 flex items-center gap-x-20">
<img src="assets/img/Opening 23.png" alt="">
<div class="items-center">
<div class="">
<span class="bg-gray-100 py-2 px-6 rounded-full">UI Designer</span>
<span class="bg-gray-100 py-2 px-6 rounded-full ml-6">UX Researcher</span>
</div>
<h1 class="text-3xl mt-6">Ieuberita Mobile App</h1>
<p class="text-base text-gray-400 mt-9">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Et venenatis nibh velit aliquet ac, tellus. Ut malesuada viverra nisl lectus massa felis sem. Viverra pellentesque velit pulvinar diam pharetra. Nisl, urna integer lectus volutpat.</p>
</div>
</div>
<!-- content 1 close -->
<!-- content 1 open -->
<div class="mt-24 flex items-center gap-x-20">
<div class="items-center">
<div class="">
<span class="bg-gray-100 py-2 px-6 rounded-full">UI Designer</span>
<span class="bg-gray-100 py-2 px-6 rounded-full ml-6">UX Researcher</span>
</div>
<h1 class="text-3xl mt-6">Ieuberita Mobile App</h1>
<p class="text-base text-gray-400 mt-9">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Et venenatis nibh velit aliquet ac, tellus. Ut malesuada viverra nisl lectus massa felis sem. Viverra pellentesque velit pulvinar diam pharetra. Nisl, urna integer lectus volutpat.</p>
</div>
<img src="assets/img/Opening 23.png" alt="">
</div>
<!-- content 1 close -->
<!-- Portfolio close -->
<!-- interesting open -->
<div class="bg-gray-100 flex justify-center h-72 mt-14 items-center">
<div class="bg-[url('/assets/texture.png')] items-center">
<div class="">
<h1 class="text-center text-2xl">Interesting to work with me?</h1>
</div>
<div class="mx-auto mt-12">
<div class="flex gap-12 items-center">
<a href="" class="underline text-lg">resaendr@gmail.com</a>
<p>or</p>
<a href="" class="bg-gray-800 text-white px-8 py-3 rounded-2xl">Hit me up ✌</a>
</div>
</div>
</div>
</div>
<!-- interesting close -->
</div>
<!-- footer open-->
<div class="bg-gray-100 mt-8 h-11 center flex items-center justify-center">
<p class="text-center">© 2022 BR Project. All Right Reserved.</p>
</div>
<!-- footer close-->
</body>
</html>