colors
parent
a343c6c344
commit
f12d480e7f
156
src/index.html
156
src/index.html
|
@ -1,61 +1,135 @@
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<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=Source+Sans+3&family=Work+Sans:wght@500;600&display=swap"
|
|
||||||
rel="stylesheet"
|
|
||||||
/>
|
|
||||||
<link href="./index.css" rel="stylesheet" />
|
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<title>My First Parcel App</title>
|
<title>My First Parcel App</title>
|
||||||
|
<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=Source+Sans+3&family=Work+Sans:wght@500;600&display=swap"
|
||||||
|
rel="stylesheet"
|
||||||
|
/>
|
||||||
|
<link href="./index.css" rel="stylesheet" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
</head>
|
</head>
|
||||||
<body class="flex h-screen justify-center items-center flex-col text-xl">
|
<body
|
||||||
<div class="w-full h-full flex justify-center flex-wrap p-4 gap-10 items-center">
|
class="flex h-screen justify-center items-center flex-col tex sm:text-xl w-screen"
|
||||||
<a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
|
>
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
<div
|
||||||
|
class="w-full h-full flex justify-center flex-wrap p-4 gap-10 items-center"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
Facebook
|
Facebook
|
||||||
</a>
|
</a>
|
||||||
<a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
|
<a
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-gradient-to-r from-[#ff8fb2] via-[#a797ff] to-[#00e5ff] -z-10 w-full h-full"></div>
|
||||||
|
Messenger
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#fa6831] -z-10 w-full h-full"></div>
|
||||||
|
Printables
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#8d45f6] -z-10 w-full h-full"></div>
|
||||||
|
Cult3D
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#196ef0] -z-10 w-full h-full"></div>
|
||||||
|
Thingiverse
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#1f2328] -z-10 w-full h-full"></div>
|
||||||
|
Github
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#ff8135] -z-10 w-full h-full"></div>
|
||||||
|
Turbosquid
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
|
Youtube
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
|
Instagram
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
|
Email
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="w-full flex justify-center">
|
||||||
|
<div class="relative w-full">
|
||||||
|
<div
|
||||||
|
class="border border-black absolute w-full h-0 self-end bottom-[11.5%]"
|
||||||
|
></div>
|
||||||
|
</div>
|
||||||
|
<img class="max-w-2xl" src="public/logo_main.svg" alt="parcel logo" />
|
||||||
|
<div class="relative w-full">
|
||||||
|
<div
|
||||||
|
class="border border-black absolute w-full h-0 self-end top-[17%]"
|
||||||
|
></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-full h-full flex justify-center flex-wrap p-4 gap-10 items-center"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
Facebook
|
Facebook
|
||||||
</a>
|
</a>
|
||||||
<a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
|
<a
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
Facebook
|
Facebook
|
||||||
</a>
|
</a>
|
||||||
<a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
|
<a
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
Facebook
|
Facebook
|
||||||
</a>
|
</a>
|
||||||
<a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
|
<a
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
|
Facebook
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center"
|
||||||
|
>
|
||||||
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
Facebook
|
Facebook
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<img class="max-w-2xl" src="public/logo_main.svg" alt="parcel logo" />
|
<div class="p-3 bg-black text-white w-full text-center font-thin">
|
||||||
<div class="w-full h-full flex justify-center flex-wrap p-4 gap-10 items-center">
|
<h2 class="text-xl font-normal">Philippe Soubrier</h2>
|
||||||
<a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
|
Phd Student - Hobbyist
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
<p class="text-sm">- 2023 -</p>
|
||||||
Facebook
|
|
||||||
</a>
|
|
||||||
<a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
|
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
|
||||||
Facebook
|
|
||||||
</a>
|
|
||||||
<a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
|
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
|
||||||
Facebook
|
|
||||||
</a>
|
|
||||||
<a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
|
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
|
||||||
Facebook
|
|
||||||
</a>
|
|
||||||
<a class="w-40 h-min cursor-pointer bg-white border-black border-2 relative p-2 text-center">
|
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
|
||||||
Facebook
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<?xml version="1.0" encoding="UTF-8"?>
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
<svg id="Layer_2" style="stroke-width: 1px" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 369.82 34.77">
|
<svg id="Layer_2" style="stroke-width: 1.1px" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 369.82 34.77">
|
||||||
<defs>
|
<defs>
|
||||||
<style>
|
<style>
|
||||||
.cls-1 {
|
.cls-1 {
|
||||||
|
@ -8,7 +8,7 @@
|
||||||
|
|
||||||
.cls-1, .cls-2, .cls-3, .cls-4, .cls-5, .cls-6, .cls-7, .cls-8, .cls-9 {
|
.cls-1, .cls-2, .cls-3, .cls-4, .cls-5, .cls-6, .cls-7, .cls-8, .cls-9 {
|
||||||
fill: none;
|
fill: none;
|
||||||
stroke: #231f20;
|
stroke: #000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cls-2 {
|
.cls-2 {
|
||||||
|
|
Before Width: | Height: | Size: 5.4 KiB After Width: | Height: | Size: 5.4 KiB |
Loading…
Reference in New Issue