modal
psoubrie
parent
4fc0cfef34
commit
7a9f8e9561
|
|
@ -80,7 +80,7 @@ import("webdav").then(({ createClient }) => {
|
||||||
cleanDist()
|
cleanDist()
|
||||||
.then(buildWithParcel)
|
.then(buildWithParcel)
|
||||||
.then(loginToWebDAV)
|
.then(loginToWebDAV)
|
||||||
.then((client) => cleanMainFolder(client).then(() => client))
|
// .then((client) => cleanMainFolder(client).then(() => client)) WILL DELETE OTHER SUBFOLDERS
|
||||||
.then((client) => transferContent(client))
|
.then((client) => transferContent(client))
|
||||||
.then(cleanDist)
|
.then(cleanDist)
|
||||||
.then(() => console.log("Process completed successfully"))
|
.then(() => console.log("Process completed successfully"))
|
||||||
|
|
|
||||||
|
|
@ -5,5 +5,8 @@
|
||||||
"prettier": "^3.1.0",
|
"prettier": "^3.1.0",
|
||||||
"prettier-plugin-tailwindcss": "^0.5.7",
|
"prettier-plugin-tailwindcss": "^0.5.7",
|
||||||
"tailwindcss": "^3.3.5"
|
"tailwindcss": "^3.3.5"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"flowbite": "^2.2.1"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
194
src/index.html
194
src/index.html
|
|
@ -1,150 +1,147 @@
|
||||||
|
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
|
||||||
|
<head>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<title>Philippe Soubrier</title>
|
<title>Philippe Soubrier</title>
|
||||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
<link
|
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+3&family=Work+Sans:wght@500;600&display=swap"
|
||||||
href="https://fonts.googleapis.com/css2?family=Source+Sans+3&family=Work+Sans:wght@500;600&display=swap"
|
rel="stylesheet" />
|
||||||
rel="stylesheet"
|
|
||||||
/>
|
|
||||||
<link href="./index.css" rel="stylesheet" />
|
<link href="./index.css" rel="stylesheet" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
</head>
|
</head>
|
||||||
<body
|
|
||||||
class="flex min-h-screen justify-center items-center flex-col tex sm:text-xl w-screen overflow-x-hidden"
|
<body class="flex min-h-screen justify-center items-center flex-col tex sm:text-xl w-screen overflow-x-hidden">
|
||||||
>
|
<div class="w-full grow h-full flex max-w-6xl justify-center py-14 flex-wrap content-center p-4 gap-10 items-center">
|
||||||
<div
|
<a href="https://www.printables.com/@flol3622"
|
||||||
class="w-full grow h-full flex max-w-6xl justify-center py-14 flex-wrap content-center p-4 gap-10 items-center"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
>
|
|
||||||
<a
|
|
||||||
href="https://www.printables.com/@flol3622"
|
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-[#fa6831] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#fa6831] -z-10 w-full h-full"></div>
|
||||||
Printables
|
Printables
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://gitea.flupkesoffice.synology.me/Flupke?tab=repositories"
|
||||||
href="https://gitea.flupkesoffice.synology.me/Flupke?tab=repositories"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-[#609926] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#609926] -z-10 w-full h-full"></div>
|
||||||
GitEA
|
GitEA
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://www.facebook.com/profile.php?id=100064097734400"
|
||||||
href="https://www.facebook.com/profile.php?id=100064097734400"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
Facebook
|
Facebook
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://cults3d.com/en/users/Flupke3622/3d-models"
|
||||||
href="https://cults3d.com/en/users/Flupke3622/3d-models"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-[#8d45f6] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#8d45f6] -z-10 w-full h-full"></div>
|
||||||
Cult3D
|
Cult3D
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://www.thingiverse.com/flol3622/designs"
|
||||||
href="https://www.thingiverse.com/flol3622/designs"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-[#196ef0] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#196ef0] -z-10 w-full h-full"></div>
|
||||||
Thingiverse
|
Thingiverse
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://www.instagram.com/flupke_maker/"
|
||||||
href="https://www.instagram.com/flupke_maker/"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
<div class="absolute bg-gradient-to-r from-[#f6d371] via-[#cf2872] to-[#4d58ce] -z-10 w-full h-full"></div>
|
||||||
>
|
|
||||||
<div
|
|
||||||
class="absolute bg-gradient-to-r from-[#f6d371] via-[#cf2872] to-[#4d58ce] -z-10 w-full h-full"
|
|
||||||
></div>
|
|
||||||
Instagram
|
Instagram
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://www.turbosquid.com/Search/Artists/PhilippeSoubrier"
|
||||||
href="https://www.turbosquid.com/Search/Artists/PhilippeSoubrier"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-[#ff8135] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#ff8135] -z-10 w-full h-full"></div>
|
||||||
Turbosquid
|
Turbosquid
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://www.youtube.com/channel/UCV7rneXmSakiAaGB0y9qhPw"
|
||||||
href="https://www.youtube.com/channel/UCV7rneXmSakiAaGB0y9qhPw"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-[#ff0000] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#ff0000] -z-10 w-full h-full"></div>
|
||||||
Youtube
|
Youtube
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="mailto:philippe.soubrier@gmail.com"
|
||||||
href="mailto:philippe.soubrier@gmail.com"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
||||||
Email
|
Email
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="w-full flex justify-center">
|
<div class="w-full flex justify-center">
|
||||||
<img
|
<img src="public/banner.svg" alt="Flupke" class="w-full h-[7vw] max-h-20 object-cover" />
|
||||||
src="public/banner.svg"
|
|
||||||
alt="Flupke"
|
|
||||||
class="w-full h-[7vw] max-h-20 object-cover"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div class="w-full grow h-full flex max-w-6xl justify-center py-14 flex-wrap content-center p-4 gap-10 items-center">
|
||||||
class="w-full grow h-full flex max-w-6xl justify-center py-14 flex-wrap content-center p-4 gap-10 items-center"
|
|
||||||
>
|
<!-- Main modal -->
|
||||||
<a
|
<div id="default-modal" tabindex="-1" aria-hidden="true"
|
||||||
href="https://www.linkedin.com/in/philippe-soubrier-0338b9205/"
|
class="hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
<div class="fixed h-full w-full bg-black top-0 opacity-30 pointer-events-none"></div>
|
||||||
>
|
<div class="relative p-4 w-full max-w-2xl max-h-full">
|
||||||
|
<!-- Modal content -->
|
||||||
|
<div class="relative bg-white rounded-lg shadow dark:bg-gray-700">
|
||||||
|
<!-- Modal header -->
|
||||||
|
<div class="flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600">
|
||||||
|
<h3 class="text-xl font-semibold text-gray-900 dark:text-white">
|
||||||
|
Current event going on:
|
||||||
|
</h3>
|
||||||
|
<button type="button"
|
||||||
|
class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white"
|
||||||
|
data-modal-hide="default-modal">
|
||||||
|
<svg class="w-3 h-3" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
|
||||||
|
viewBox="0 0 14 14">
|
||||||
|
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||||
|
d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" />
|
||||||
|
</svg>
|
||||||
|
<span class="sr-only">Close modal</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<!-- Modal body -->
|
||||||
|
<div class="p-4 md:p-5 space-y-4 flex flex-col items-center">
|
||||||
|
<p class="text-2xl leading-relaxed text-gray-500 dark:text-gray-400">
|
||||||
|
BFG days 2024
|
||||||
|
</p>
|
||||||
|
<a href="/bfg/">
|
||||||
|
<img src="public/logo.png" alt="BFG days" class="w-32" />
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- Modal footer -->
|
||||||
|
<div class="flex items-center p-4 md:p-5 border-t border-gray-200 rounded-b dark:border-gray-600">
|
||||||
|
<a data-modal-hide="default-modal" type="button"
|
||||||
|
class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800" href="/bfg/">Go to event</a>
|
||||||
|
<button data-modal-hide="default-modal" type="button"
|
||||||
|
class="ms-3 text-gray-500 bg-white hover:bg-gray-100 focus:ring-4 focus:outline-none focus:ring-blue-300 rounded-lg border border-gray-200 text-sm font-medium px-5 py-2.5 hover:text-gray-900 focus:z-10 dark:bg-gray-700 dark:text-gray-300 dark:border-gray-500 dark:hover:text-white dark:hover:bg-gray-600 dark:focus:ring-gray-600">
|
||||||
|
Close
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a href="https://www.linkedin.com/in/philippe-soubrier-0338b9205/"
|
||||||
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
<div class="absolute bg-[#0a66c2] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#0a66c2] -z-10 w-full h-full"></div>
|
||||||
LinkedIn
|
LinkedIn
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://github.com/flol3622"
|
||||||
href="https://github.com/flol3622"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-[#1f2328] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#1f2328] -z-10 w-full h-full"></div>
|
||||||
Github
|
Github
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://research.ugent.be/web/person/philippe-soubrier-0/nl"
|
||||||
href="https://research.ugent.be/web/person/philippe-soubrier-0/nl"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-[#1e64c8] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#1e64c8] -z-10 w-full h-full"></div>
|
||||||
UGent
|
UGent
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://m.me/dai.dico"
|
||||||
href="https://m.me/dai.dico"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl 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>
|
||||||
>
|
|
||||||
<div
|
|
||||||
class="absolute bg-gradient-to-r from-[#ff8fb2] via-[#a797ff] to-[#00e5ff] -z-10 w-full h-full"
|
|
||||||
></div>
|
|
||||||
Messenger
|
Messenger
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://www.facebook.com/dai.dico"
|
||||||
href="https://www.facebook.com/dai.dico"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
<div class="absolute bg-[#1877F2] -z-10 w-full h-full"></div>
|
||||||
Facebook
|
Facebook
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="https://www.instagram.com/soubrierphilippe/"
|
||||||
href="https://www.instagram.com/soubrierphilippe/"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
<div class="absolute bg-gradient-to-r from-[#f6d371] via-[#cf2872] to-[#4d58ce] -z-10 w-full h-full"></div>
|
||||||
>
|
|
||||||
<div
|
|
||||||
class="absolute bg-gradient-to-r from-[#f6d371] via-[#cf2872] to-[#4d58ce] -z-10 w-full h-full"
|
|
||||||
></div>
|
|
||||||
Instagram
|
Instagram
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a href="mailto:philippe.soubrier@ugent.be"
|
||||||
href="mailto:philippe.soubrier@ugent.be"
|
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center">
|
||||||
class="w-28 sm:w-40 h-min cursor-pointer bg-white border-black border-2 hover:border-dashed hover:shadow-xl relative p-2 text-center"
|
|
||||||
>
|
|
||||||
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
<div class="absolute bg-black -z-10 w-full h-full"></div>
|
||||||
Email
|
Email
|
||||||
</a>
|
</a>
|
||||||
|
|
@ -154,8 +151,9 @@
|
||||||
PhD Student - Hobbyist
|
PhD Student - Hobbyist
|
||||||
<p class="text-sm">- 2023 -</p>
|
<p class="text-sm">- 2023 -</p>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div class="fixed bottom-0 w-full h-10 bg-gradient-to-t from-gray-200 -z-20" />
|
||||||
class="fixed bottom-0 w-full h-10 bg-gradient-to-t from-gray-200 -z-20"
|
|
||||||
/>
|
<script src="./script.js" type="module"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
|
|
@ -0,0 +1,8 @@
|
||||||
|
import {Modal} from 'flowbite';
|
||||||
|
|
||||||
|
const $targetEl = document.getElementById('default-modal');
|
||||||
|
|
||||||
|
const modal = new Modal($targetEl);
|
||||||
|
|
||||||
|
// model.show on load
|
||||||
|
modal.show();
|
||||||
|
|
@ -1,15 +1,12 @@
|
||||||
/** @type {import('tailwindcss').Config} */
|
/** @type {import('tailwindcss').Config} */
|
||||||
module.exports = {
|
module.exports = {
|
||||||
content: [
|
content: ["./src/**/*.{html,js,ts,jsx,tsx}"],
|
||||||
"./src/**/*.{html,js,ts,jsx,tsx}",
|
|
||||||
],
|
|
||||||
theme: {
|
theme: {
|
||||||
extend: {},
|
extend: {},
|
||||||
fontFamily: {
|
fontFamily: {
|
||||||
body: ['Source Sans 3', 'sans-serif'],
|
body: ["Source Sans 3", "sans-serif"],
|
||||||
title: ['Work Sans', 'sans-serif']
|
title: ["Work Sans", "sans-serif"],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
plugins: [],
|
plugins: [require("flowbite/plugin")],
|
||||||
}
|
};
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue