final?
5
.prettierrc
Normal file
|
@ -0,0 +1,5 @@
|
|||
{
|
||||
"arrowParens": "avoid",
|
||||
"semi": false,
|
||||
"singleQuote": true
|
||||
}
|
332
src/about.html
|
@ -1,131 +1,225 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Luis Medeiros</title>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Luis Medeiros</title>
|
||||
|
||||
<link rel="stylesheet" href="./css/styles.css" />
|
||||
<link rel="stylesheet" href="css/styles.css" />
|
||||
|
||||
<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=Manrope:wght@300;400;500;700&family=Syne+Tactile&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
</head>
|
||||
<body class="min-h-screen flex flex-col">
|
||||
<header class="w-full px-40 py-20">
|
||||
<nav class="flex w-full justify-between">
|
||||
<ul>
|
||||
<li><a href="/">work</a></li>
|
||||
<li><a href="about.html" class="text-blue">about</a></li>
|
||||
<li><a href="contact.html">contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<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=Manrope:wght@300;400;500;700&family=Syne+Tactile&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
</head>
|
||||
<body class="min-h-screen flex flex-col">
|
||||
<header class="w-full px-40 py-20 sticky top-0 bg-white">
|
||||
<nav>
|
||||
<ul class="grid grid-cols-3 w-full">
|
||||
<li><a href="/">work</a></li>
|
||||
<li class="text-center">
|
||||
<a href="about.html" class="text-blue">about</a>
|
||||
</li>
|
||||
<li class="text-right"><a href="contact.html">contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="flex flex-col w-full flex-1 px-40 gap-24">
|
||||
<h1 class="text-7xl text-left font-light self-start">
|
||||
Luis Medeiros,
|
||||
<br />
|
||||
<span class="font-syne">creative</span> strategist
|
||||
<br />
|
||||
<span class="text-blue">is</span>
|
||||
</h1>
|
||||
<main class="flex flex-col w-full flex-1 px-40 gap-24">
|
||||
<h1 class="text-7xl text-left font-light self-start">
|
||||
Luis Medeiros,
|
||||
<br />
|
||||
<span class="font-syne">creative</span> strategist
|
||||
<br />
|
||||
<span class="text-blue">is</span>
|
||||
</h1>
|
||||
|
||||
<h2 class="text-right self-end text-2xl w-10/12">
|
||||
a young but well-versed creative strategist with a background in
|
||||
copywriting amplified by four years of design thinking;
|
||||
experience leading several branding & design projects; and an
|
||||
artistic adventure as one-third of the indie pop band Ditch
|
||||
Days.
|
||||
</h2>
|
||||
<h2 class="text-right self-end text-2xl w-10/12">
|
||||
a young but well-versed creative strategist with a background in
|
||||
copywriting amplified by four years of design thinking; experience
|
||||
leading several branding & design projects; and an artistic adventure as
|
||||
one-third of the indie pop band
|
||||
<a href="https://ditch-days.com" class="text-blue underline"
|
||||
>Ditch Days</a
|
||||
>.
|
||||
</h2>
|
||||
|
||||
<section>
|
||||
<h2 class="text-5xl font-light mb-16">
|
||||
<span class="mr-2">The journey so far</span>
|
||||
<img src="./assets/arrow-down-blue.png" class="inline" />
|
||||
</h2>
|
||||
<section>
|
||||
<h2 class="text-5xl font-light mb-20">
|
||||
<span class="mr-2">The journey so far</span>
|
||||
<img src="assets/arrow-down-blue.png" class="inline" />
|
||||
</h2>
|
||||
|
||||
<ul>
|
||||
<li class="flex items-start justify-between">
|
||||
<img src="./assets/emma-logo.png" />
|
||||
<div class="w-8/12">
|
||||
<h3 class="font-bold">
|
||||
Business Partner Recruiting: Creative Teams
|
||||
</h3>
|
||||
<p>
|
||||
<a
|
||||
href="https://team.emma-sleep.com/"
|
||||
class="text-blue underline"
|
||||
>
|
||||
Emma - The Sleep Company</a
|
||||
>
|
||||
(sleep e-commerce)
|
||||
</p>
|
||||
<p>Oct 2021 - Present</p>
|
||||
<br />
|
||||
<p>
|
||||
- Providing expertise and managing the expansion
|
||||
of Emma's in-house creative teams;
|
||||
</p>
|
||||
<p>
|
||||
-
|
||||
<span class="font-medium">
|
||||
Owning the hiring process
|
||||
</span>
|
||||
and pipelines of Creative Excellence, Global
|
||||
Brand and UX Teams, including active sourcing
|
||||
and contact with creative talent, portfolio
|
||||
assessment, interviews to evaluate cultural fit
|
||||
and creative task definition, among other tasks;
|
||||
</p>
|
||||
<p>
|
||||
- Managing internal and external stakeholders:
|
||||
from 4+ hiring managers to hundreds of talent
|
||||
every week, through a leading ATS;
|
||||
</p>
|
||||
<p>
|
||||
- Leading and participating in 300+ interviews
|
||||
with candidates from all levels of seniority,
|
||||
from interns to directors;
|
||||
</p>
|
||||
<p>
|
||||
- Developing and implementing Employer Branding
|
||||
initiatives;
|
||||
</p>
|
||||
<p>
|
||||
- Supporting the management of Emma's careers
|
||||
website.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</main>
|
||||
<ul class="flex flex-col gap-16">
|
||||
<li class="flex items-start justify-between">
|
||||
<img src="assets/emma-logo.png" />
|
||||
<div class="w-8/12">
|
||||
<h3 class="font-bold text-xl">
|
||||
Business Partner Recruiting: Creative Teams
|
||||
</h3>
|
||||
<p>
|
||||
<a
|
||||
href="https://team.emma-sleep.com/"
|
||||
class="text-blue underline"
|
||||
>
|
||||
Emma - The Sleep Company</a
|
||||
>
|
||||
(sleep e-commerce)
|
||||
</p>
|
||||
<p>Oct 2021 - Present</p>
|
||||
<br />
|
||||
<p>
|
||||
- Providing expertise and managing the expansion of Emma's
|
||||
in-house creative teams;
|
||||
</p>
|
||||
<p>
|
||||
-
|
||||
<span class="font-medium">Owning the hiring process</span>
|
||||
and pipelines of Creative Excellence, Global Brand and UX Teams,
|
||||
including active sourcing and contact with creative talent,
|
||||
portfolio assessment, interviews to evaluate cultural fit and
|
||||
creative task definition, among other tasks;
|
||||
</p>
|
||||
<p>
|
||||
-
|
||||
<span class="font-medium"
|
||||
>Managing internal and external stakeholders</span
|
||||
>: from 4+ hiring managers to hundreds of talent every week,
|
||||
through a leading ATS;
|
||||
</p>
|
||||
<p>
|
||||
-
|
||||
<span class="font-medium"
|
||||
>Leading and participating in 300+ interviews</span
|
||||
>
|
||||
with candidates from all levels of seniority, from interns to
|
||||
directors;
|
||||
</p>
|
||||
<p>
|
||||
- Developing and implementing
|
||||
<span class="font-medium">Employer Branding</span> initiatives;
|
||||
</p>
|
||||
<p>- Supporting the management of Emma's careers website.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start justify-between">
|
||||
<img src="assets/withcompany-logo.png" />
|
||||
<div class="w-8/12">
|
||||
<h3 class="font-bold text-xl">Creative Strategist + Writer</h3>
|
||||
<p>
|
||||
<a
|
||||
href="https://www.with-company.com/"
|
||||
class="text-blue underline"
|
||||
>
|
||||
With Company</a
|
||||
>
|
||||
(transformative design consultancy)
|
||||
</p>
|
||||
<p>May 2018 — Sep 2021 (3 years 5 months)</p>
|
||||
<br />
|
||||
<p>
|
||||
- Bridging the gap between
|
||||
<span class="font-medium"
|
||||
>business strategy, brand creativity and organizational
|
||||
culture</span
|
||||
>
|
||||
in multiple in-depth projects for national and international
|
||||
clients;
|
||||
</p>
|
||||
<p>
|
||||
- <span class="font-medium">Creative direction</span> of
|
||||
multidisciplinary 3-5 people teams;
|
||||
</p>
|
||||
<p>
|
||||
- Managing client relationships,
|
||||
<span class="font-medium"
|
||||
>leading presentations and co-creation workshops</span
|
||||
>;
|
||||
</p>
|
||||
<p>
|
||||
- Hands-on desk and field research (including interviews,
|
||||
observatory techniques, surveyingand workshops);
|
||||
</p>
|
||||
<p>
|
||||
- Designing and presenting project proposals for new business
|
||||
development;
|
||||
</p>
|
||||
<p>
|
||||
- Solving complex problems through
|
||||
<span class="font-medium">design thinking</span>
|
||||
methodologies.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start justify-between">
|
||||
<img src="assets/addiction-logo.png" />
|
||||
<div class="w-8/12">
|
||||
<h3 class="font-bold text-xl">Copywriter</h3>
|
||||
<p>
|
||||
<a href="https://www.addiction.pt/" class="text-blue underline">
|
||||
Addiction - Creative Thinking</a
|
||||
>
|
||||
(advertising company)
|
||||
</p>
|
||||
<p>Jan 2017 — Jan 2018 (1 year 1 month)</p>
|
||||
<br />
|
||||
<p>
|
||||
- <span class="font-medium">Copywriting</span> and creative
|
||||
concept development for
|
||||
<span class="font-medium">advertising</span>: from press to
|
||||
radio, BTL collaterals to brand activation, social media content
|
||||
to out-of-home campaigns.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<footer
|
||||
class="grid grid-cols-3 w-full px-40 font-light text-sm items-center py-8 justify-between bg-blue"
|
||||
<section class="mb-20">
|
||||
<h2 class="text-5xl font-light mb-20">
|
||||
<span class="mr-2">Brand-dropping</span>
|
||||
<img src="assets/arrow-down-blue.png" class="inline" />
|
||||
</h2>
|
||||
<div
|
||||
class="grid grid-cols-3 gap-x-16 gap-y-16 justify-between place-items-center"
|
||||
>
|
||||
<div>
|
||||
<span class="mr-2">To the top</span>
|
||||
<img
|
||||
class="inline"
|
||||
src="./assets/arrow-up-white.png?height=15"
|
||||
alt="Arrow up icon"
|
||||
/>
|
||||
</div>
|
||||
<div class="flex gap-6 justify-center">
|
||||
<img
|
||||
src="./assets/linkedin.png?height=25"
|
||||
alt="LinkedIn logo"
|
||||
/>
|
||||
<img src="./assets/mail.png?height=25" alt="Mail icon" />
|
||||
</div>
|
||||
<div class="text-right">Luis Medeiros 2022 ©</div>
|
||||
</footer>
|
||||
<img src="assets/oliveiradaserra-logo.png" />
|
||||
<img src="assets/fula-logo.png" />
|
||||
<img src="assets/edp-logo.png" />
|
||||
<img src="assets/fidelidade-logo.png" />
|
||||
<img src="assets/nestle-logo.png" />
|
||||
<img src="assets/zippy-logo.png" />
|
||||
<img src="assets/irn-logo.png" />
|
||||
<img src="assets/mimi-logo.png" />
|
||||
<img src="assets/creditoagricola-logo.png" />
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<script src="./js/website.js" type="module"></script>
|
||||
</body>
|
||||
<footer
|
||||
class="grid grid-cols-3 w-full px-40 font-light text-sm items-center py-8 justify-between bg-blue"
|
||||
>
|
||||
<button onclick="window.scrollTo(0, 0)">
|
||||
<span class="mr-2">To the top</span>
|
||||
<img
|
||||
class="inline"
|
||||
src="assets/arrow-up-white.png?height=15"
|
||||
alt="Arrow up icon"
|
||||
/>
|
||||
</button>
|
||||
<div class="flex gap-6 justify-center">
|
||||
<a href="https://www.linkedin.com/in/lu%C3%ADs-medeiros-10bb86a3"
|
||||
><img src="./assets/linkedin.png?height=25" alt="LinkedIn logo"
|
||||
/></a>
|
||||
<a href="mailto:luissilvamedeiros@gmail.com">
|
||||
<img src="./assets/mail.png?height=25" alt="Mail icon"
|
||||
/></a>
|
||||
</div>
|
||||
<div class="text-right">Luis Medeiros 2022 ©</div>
|
||||
</footer>
|
||||
|
||||
<script src="js/website.js" type="module"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
BIN
src/assets/addiction-logo.png
Normal file
After Width: | Height: | Size: 17 KiB |
BIN
src/assets/creditoagricola-logo.png
Normal file
After Width: | Height: | Size: 8.9 KiB |
BIN
src/assets/edp-logo.png
Normal file
After Width: | Height: | Size: 10 KiB |
BIN
src/assets/fidelidade-logo.png
Normal file
After Width: | Height: | Size: 7.1 KiB |
BIN
src/assets/fula-logo.png
Normal file
After Width: | Height: | Size: 14 KiB |
BIN
src/assets/irn-logo.png
Normal file
After Width: | Height: | Size: 6.7 KiB |
BIN
src/assets/mimi-logo.png
Normal file
After Width: | Height: | Size: 11 KiB |
BIN
src/assets/nestle-logo.png
Normal file
After Width: | Height: | Size: 6.1 KiB |
BIN
src/assets/oliveiradaserra-logo.png
Normal file
After Width: | Height: | Size: 13 KiB |
BIN
src/assets/withcompany-logo.png
Normal file
After Width: | Height: | Size: 7.1 KiB |
BIN
src/assets/zippy-logo.png
Normal file
After Width: | Height: | Size: 2.2 KiB |
140
src/contact.html
|
@ -1,71 +1,83 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Luis Medeiros</title>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Luis Medeiros</title>
|
||||
|
||||
<link rel="stylesheet" href="./css/styles.css" />
|
||||
<link rel="stylesheet" href="./css/styles.css" />
|
||||
|
||||
<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=Manrope:wght@300;400;500;700&family=Syne+Tactile&display=swap"
|
||||
rel="stylesheet"
|
||||
<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=Manrope:wght@300;400;500;700&family=Syne+Tactile&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
</head>
|
||||
<body class="min-h-screen flex flex-col">
|
||||
<header class="w-full px-40 py-20 sticky top-0 bg-white">
|
||||
<nav>
|
||||
<ul class="grid grid-cols-3 w-full">
|
||||
<li><a href="/">work</a></li>
|
||||
<li class="text-center"><a href="about.html">about</a></li>
|
||||
<li class="text-right">
|
||||
<a href="contact.html" class="text-orange">contact</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="flex flex-col items-center w-full flex-1 px-40 text-center">
|
||||
<h1 class="text-7xl text-left font-light self-start mb-24">
|
||||
Luis Medeiros,
|
||||
<br />
|
||||
<span class="font-syne">creative</span> strategist
|
||||
<br />
|
||||
<span class="text-orange">can be reached</span>
|
||||
</h1>
|
||||
|
||||
<h2 class="text-right self-end text-2xl">
|
||||
<p class="text-3xl">
|
||||
by
|
||||
<a
|
||||
href="mailto:luissilvamedeiros@gmail.com"
|
||||
class="text-orange font-bold underline"
|
||||
>email</a
|
||||
>
|
||||
</p>
|
||||
<p class="text-3xl">
|
||||
by
|
||||
<a
|
||||
href="https://www.linkedin.com/in/lu%C3%ADs-medeiros-10bb86a3"
|
||||
class="text-orange font-bold underline"
|
||||
>linkedin</a
|
||||
>
|
||||
</p>
|
||||
</h2>
|
||||
</main>
|
||||
|
||||
<footer
|
||||
class="grid grid-cols-3 w-full px-40 font-light text-sm items-center py-8 justify-between bg-orange"
|
||||
>
|
||||
<button onclick="window.scrollTo(0, 0)">
|
||||
<span class="mr-2">To the top</span>
|
||||
<img
|
||||
class="inline"
|
||||
src="assets/arrow-up-white.png?height=15"
|
||||
alt="Arrow up icon"
|
||||
/>
|
||||
</head>
|
||||
<body class="min-h-screen flex flex-col">
|
||||
<header class="w-full px-40 py-20">
|
||||
<nav class="flex w-full justify-between">
|
||||
<ul>
|
||||
<li><a href="/">work</a></li>
|
||||
<li><a href="about.html">about</a></li>
|
||||
<li>
|
||||
<a href="contact.html" class="text-orange">contact</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
</button>
|
||||
<div class="flex gap-6 justify-center">
|
||||
<a href="https://www.linkedin.com/in/lu%C3%ADs-medeiros-10bb86a3"
|
||||
><img src="./assets/linkedin.png?height=25" alt="LinkedIn logo"
|
||||
/></a>
|
||||
<a href="mailto:luissilvamedeiros@gmail.com">
|
||||
<img src="./assets/mail.png?height=25" alt="Mail icon"
|
||||
/></a>
|
||||
</div>
|
||||
<div class="text-right">Luis Medeiros 2022 ©</div>
|
||||
</footer>
|
||||
|
||||
<main
|
||||
class="flex flex-col items-center w-full flex-1 px-40 text-center"
|
||||
>
|
||||
<h1 class="text-7xl text-left font-light self-start mb-24">
|
||||
Luis Medeiros,
|
||||
<br />
|
||||
<span class="font-syne">creative</span> strategist
|
||||
<br />
|
||||
<span class="text-orange">can be reached</span>
|
||||
</h1>
|
||||
|
||||
<h2 class="text-right self-end text-2xl">
|
||||
<p>creative ideation & leadership / copywriting</p>
|
||||
<p>brand strategy & identity / business strategy</p>
|
||||
<p>co-creation workshops / organizational culture / music</p>
|
||||
</h2>
|
||||
</main>
|
||||
|
||||
<footer
|
||||
class="grid grid-cols-3 w-full px-40 font-light text-sm items-center py-8 justify-between bg-orange"
|
||||
>
|
||||
<div>
|
||||
<span class="mr-2">To the top</span>
|
||||
<img
|
||||
class="inline"
|
||||
src="./assets/arrow-up-white.png?height=15"
|
||||
alt="Arrow up icon"
|
||||
/>
|
||||
</div>
|
||||
<div class="flex gap-6 justify-center">
|
||||
<img
|
||||
src="./assets/linkedin.png?height=25"
|
||||
alt="LinkedIn logo"
|
||||
/>
|
||||
<img src="./assets/mail.png?height=25" alt="Mail icon" />
|
||||
</div>
|
||||
<div class="text-right">Luis Medeiros 2022 ©</div>
|
||||
</footer>
|
||||
|
||||
<script src="./js/website.js" type="module"></script>
|
||||
</body>
|
||||
<script src="./js/website.js" type="module"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -3,5 +3,9 @@
|
|||
@tailwind utilities;
|
||||
|
||||
body {
|
||||
font-family: "Manrope", sans-serif;
|
||||
font-family: 'Manrope', sans-serif;
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
|
123
src/index.html
|
@ -1,69 +1,68 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Luis Medeiros</title>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Luis Medeiros</title>
|
||||
|
||||
<link rel="stylesheet" href="./css/styles.css" />
|
||||
<link rel="stylesheet" href="./css/styles.css" />
|
||||
|
||||
<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=Manrope:wght@300;400;500;700&family=Syne+Tactile&display=swap"
|
||||
rel="stylesheet"
|
||||
<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=Manrope:wght@300;400;500;700&family=Syne+Tactile&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
</head>
|
||||
<body class="min-h-screen flex flex-col">
|
||||
<header class="w-full px-40 py-20 sticky top-0 bg-white">
|
||||
<nav>
|
||||
<ul class="grid grid-cols-3 w-full">
|
||||
<li><a href="/" class="text-green">work</a></li>
|
||||
<li class="text-center"><a href="about.html">about</a></li>
|
||||
<li class="text-right"><a href="contact.html">contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="flex flex-col items-center w-full flex-1 px-40 text-center">
|
||||
<h1 class="text-7xl text-left font-light self-start mb-24">
|
||||
Luis Medeiros,
|
||||
<br />
|
||||
<span class="font-syne">creative</span> strategist
|
||||
<br />
|
||||
<span class="text-green">does</span>
|
||||
</h1>
|
||||
|
||||
<h2 class="text-right self-end text-2xl">
|
||||
<p>creative ideation & leadership / copywriting</p>
|
||||
<p>brand strategy & identity / business strategy</p>
|
||||
<p>co-creation workshops / organizational culture / music</p>
|
||||
</h2>
|
||||
</main>
|
||||
|
||||
<footer
|
||||
class="grid grid-cols-3 w-full px-40 font-light text-sm items-center py-8 justify-between bg-green"
|
||||
>
|
||||
<button onclick="window.scrollTo(0, 0)">
|
||||
<span class="mr-2">To the top</span>
|
||||
<img
|
||||
class="inline"
|
||||
src="assets/arrow-up-white.png?height=15"
|
||||
alt="Arrow up icon"
|
||||
/>
|
||||
</head>
|
||||
<body class="min-h-screen flex flex-col">
|
||||
<header class="w-full px-40 py-20">
|
||||
<nav class="flex w-full justify-between">
|
||||
<ul>
|
||||
<li><a href="/" class="text-green">work</a></li>
|
||||
<li><a href="about.html">about</a></li>
|
||||
<li><a href="contact.html">contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
</button>
|
||||
<div class="flex gap-6 justify-center">
|
||||
<a href="https://www.linkedin.com/in/lu%C3%ADs-medeiros-10bb86a3"
|
||||
><img src="./assets/linkedin.png?height=25" alt="LinkedIn logo"
|
||||
/></a>
|
||||
<a href="mailto:luissilvamedeiros@gmail.com">
|
||||
<img src="./assets/mail.png?height=25" alt="Mail icon"
|
||||
/></a>
|
||||
</div>
|
||||
<div class="text-right">Luis Medeiros 2022 ©</div>
|
||||
</footer>
|
||||
|
||||
<main
|
||||
class="flex flex-col items-center w-full flex-1 px-40 text-center"
|
||||
>
|
||||
<h1 class="text-7xl text-left font-light self-start mb-24">
|
||||
Luis Medeiros,
|
||||
<br />
|
||||
<span class="font-syne">creative</span> strategist
|
||||
<br />
|
||||
<span class="text-green">does</span>
|
||||
</h1>
|
||||
|
||||
<h2 class="text-right self-end text-2xl">
|
||||
<p>creative ideation & leadership / copywriting</p>
|
||||
<p>brand strategy & identity / business strategy</p>
|
||||
<p>co-creation workshops / organizational culture / music</p>
|
||||
</h2>
|
||||
</main>
|
||||
|
||||
<footer
|
||||
class="grid grid-cols-3 w-full px-40 font-light text-sm items-center py-8 justify-between bg-green"
|
||||
>
|
||||
<div>
|
||||
<span class="mr-2">To the top</span>
|
||||
<img
|
||||
class="inline"
|
||||
src="./assets/arrow-up-white.png?height=15"
|
||||
alt="Arrow up icon"
|
||||
/>
|
||||
</div>
|
||||
<div class="flex gap-6 justify-center">
|
||||
<img
|
||||
src="./assets/linkedin.png?height=25"
|
||||
alt="LinkedIn logo"
|
||||
/>
|
||||
<img src="./assets/mail.png?height=25" alt="Mail icon" />
|
||||
</div>
|
||||
<div class="text-right">Luis Medeiros 2022 ©</div>
|
||||
</footer>
|
||||
|
||||
<script src="./js/website.js" type="module"></script>
|
||||
</body>
|
||||
<script src="./js/website.js" type="module"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|