lucas.delanier
/
Portfolio-website
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

responsive design
continuous-integration/drone/push Build is failing Details

Browse Source
main
Lucas DELANIER 11 months ago
parent ac79060fba
commit d4850be6cd
4 changed files with 19 additions and 19 deletions
Show Stats Download Patch File Download Diff File

10
src/components/views/AllinView.vue
Unescape View File

@ -4,9 +4,9 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
</script> </script>
<template> <template>
<div class="flex flex-col h-[75vh] w-full bg-black overflow-hidden relative items-center justify-center px-96"> <div class="flex flex-col h-[75vh] w-full bg-black overflow-hidden relative items-center justify-center sm:px-20 md:px-50 lg:px-60 xl:px-96 px-10">
<p class="text-6xl font-extrabold text-white pb-8 z-10">Allin</p> <p class="text-6xl font-extrabold text-white pb-8 z-10">Allin</p>
<p class="text-xl font-light text-white text-center z-10"> <p class=" md:text-xl text-md font-light text-white text-center z-10">
J'ai participé au développement du projet Allin, une application mobile multiplateforme J'ai participé au développement du projet Allin, une application mobile multiplateforme
permettant de parier sur des événements de la vie quotidienne ou sportifs. Vous pouvez ajouter des amis permettant de parier sur des événements de la vie quotidienne ou sportifs. Vous pouvez ajouter des amis
et les défier pour remporter leurs Allcoins ! et les défier pour remporter leurs Allcoins !
@ -24,9 +24,9 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
<router-link to="/"> <router-link to="/">
<img src="/images/back-button.png" class="absolute z-10 top-0 left-0 p-10 scale-25 hover:scale-35 ease-in-out transition-all"/> <img src="/images/back-button.png" class="absolute z-10 top-0 left-0 p-10 scale-25 hover:scale-35 ease-in-out transition-all"/>
</router-link> </router-link>
<img src="/images/projects/allin/allin-banner.png" class="opacity-10 absolute z-0 pointer-events-none"/> <img src="/images/projects/allin/allin-banner.png" class="opacity-10 absolute z-0 pointer-events-none h-[75vh] w-full object-cover"/>
</div> </div>
<div class="bg-white w-full px-80 py-20 transition-all flex flex-col gap-20 pb-36 items-center relative"> <div class="bg-white w-full sm:px-20 md:px-50 lg:px-60 xl:px-80 px-10 py-20 transition-all flex flex-col gap-20 pb-36 items-center relative">
<img src="/images/projects/allin/logo.png" class=" absolute z-0 pointer-events-none w-20 -top-12 left-20"/> <img src="/images/projects/allin/logo.png" class=" absolute z-0 pointer-events-none w-20 -top-12 left-20"/>
<img src="/images/projects/allin/allin-banner.png" class="pointer-events-none rounded-md"/> <img src="/images/projects/allin/allin-banner.png" class="pointer-events-none rounded-md"/>
@ -37,7 +37,7 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
pour visualiser l'application et la rendre plus concrète. Avec l'aide d'un enseignant, nous avons mis en place pour visualiser l'application et la rendre plus concrète. Avec l'aide d'un enseignant, nous avons mis en place
un suivi de projet agile avec des sprints de deux semaines. un suivi de projet agile avec des sprints de deux semaines.
</p> </p>
<div class="flex flox-row w-full justify-between overflow-hidden"> <div class="flex flox-row w-full justify-between overflow-scroll overflow-y-hidden">
<img src="/images/projects/allin/allin-1.png" class="pointer-events-none w-52 object-contain"/> <img src="/images/projects/allin/allin-1.png" class="pointer-events-none w-52 object-contain"/>
<img src="/images/projects/allin/allin-4.png" class="pointer-events-none w-52 object-contain"/> <img src="/images/projects/allin/allin-4.png" class="pointer-events-none w-52 object-contain"/>
<img src="/images/projects/allin/allin-2.png" class="pointer-events-none w-52 object-contain"/> <img src="/images/projects/allin/allin-2.png" class="pointer-events-none w-52 object-contain"/>

8
src/components/views/CompagnonView.vue
Unescape View File

@ -4,9 +4,9 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
</script> </script>
<template> <template>
<div class="flex flex-col h-[75vh] w-full bg-black overflow-hidden relative items-center justify-center px-96"> <div class="flex flex-col h-[75vh] w-full bg-black overflow-hidden relative items-center justify-center sm:px-20 md:px-50 lg:px-60 xl:px-96 px-10">
<p class="text-6xl font-extrabold text-white pb-8 z-10">Compagnon</p> <p class="text-6xl font-extrabold text-white pb-8 z-10">Compagnon</p>
<p class="text-xl font-light text-white text-center z-10"> <p class=" md:text-xl text-md font-light text-white text-center z-10">
Compagnon est une application web qui vous assiste dans toutes sortes de tâches. Que ce soit pour noter des idées, Compagnon est une application web qui vous assiste dans toutes sortes de tâches. Que ce soit pour noter des idées,
enregistrer et générer des mots de passe, organiser vos photos ou planifier vos voyages, Compagnon est là pour enregistrer et générer des mots de passe, organiser vos photos ou planifier vos voyages, Compagnon est là pour
vous. vous.
@ -24,9 +24,9 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
<router-link to="/"> <router-link to="/">
<img src="/images/back-button.png" class="absolute z-10 top-0 left-0 p-10 scale-25 hover:scale-35 ease-in-out transition-all"/> <img src="/images/back-button.png" class="absolute z-10 top-0 left-0 p-10 scale-25 hover:scale-35 ease-in-out transition-all"/>
</router-link> </router-link>
<img src="/images/projects/compagnon/compagnon-banner.png" class="opacity-5 absolute z-0 pointer-events-none"/> <img src="/images/projects/compagnon/compagnon-banner.png" class="opacity-5 absolute z-0 pointer-events-none h-[75vh] w-full object-cover"/>
</div> </div>
<div class="bg-white w-full px-80 py-20 transition-all flex flex-col gap-20 pb-36 items-center"> <div class="bg-white w-full sm:px-20 md:px-50 lg:px-60 xl:px-80 px-10 py-20 transition-all flex flex-col gap-20 pb-36 items-center relative">
<img src="/images/projects/compagnon/compagnon-banner.png" class="pointer-events-none rounded-md"/> <img src="/images/projects/compagnon/compagnon-banner.png" class="pointer-events-none rounded-md"/>
<p class="text-xl font-normal text-black"> <p class="text-xl font-normal text-black">
Compagnon est une application web réalisée avec le framework Vue et le framework CSS Tailwind. J'ai conçu les Compagnon est une application web réalisée avec le framework Vue et le framework CSS Tailwind. J'ai conçu les

10
src/components/views/JustMusicView.vue
Unescape View File

@ -4,9 +4,9 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
</script> </script>
<template> <template>
<div class="flex flex-col h-[75vh] w-full bg-black overflow-hidden relative items-center justify-center px-96"> <div class="flex flex-col h-[75vh] w-full bg-black overflow-hidden relative items-center justify-center sm:px-20 md:px-50 lg:px-60 xl:px-96 px-10">
<p class="text-6xl font-extrabold text-white pb-8 z-10">JustMusic</p> <p class="text-6xl font-extrabold text-white pb-8 z-10">JustMusic</p>
<p class="text-xl font-light text-white text-center z-10"> <p class="md:text-xl text-md font-light text-white text-center z-10">
Avec un ami, j'ai développé l'application justMusic, un réseau social captivant qui combine musique et vie Avec un ami, j'ai développé l'application justMusic, un réseau social captivant qui combine musique et vie
quotidienne. Sur cette application, vous êtes invité à poster une "capsule" par jour, composée d'une musique et quotidienne. Sur cette application, vous êtes invité à poster une "capsule" par jour, composée d'une musique et
d'un selfie de vous. d'un selfie de vous.
@ -24,9 +24,9 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
<router-link to="/"> <router-link to="/">
<img src="/images/back-button.png" class="absolute z-10 top-0 left-0 p-10 scale-25 hover:scale-35 ease-in-out transition-all"/> <img src="/images/back-button.png" class="absolute z-10 top-0 left-0 p-10 scale-25 hover:scale-35 ease-in-out transition-all"/>
</router-link> </router-link>
<img src="/images/projects/justmusic/justmusic-banner.png" class="opacity-10 absolute z-0 pointer-events-none"/> <img src="/images/projects/justmusic/justmusic-banner.png" class="opacity-10 absolute z-0 pointer-events-none h-[75vh] w-full object-cover"/>
</div> </div>
<div class="bg-white w-full px-80 py-20 transition-all flex flex-col gap-20 pb-36 items-center relative"> <div class="bg-white w-full sm:px-20 md:px-50 lg:px-60 xl:px-80 px-10 py-20 transition-all flex flex-col gap-20 pb-36 items-center relative">
<img src="/images/projects/justmusic/logo.png" class=" absolute z-0 pointer-events-none w-20 -top-12 left-20 border-white border-2 rounded-lg"/> <img src="/images/projects/justmusic/logo.png" class=" absolute z-0 pointer-events-none w-20 -top-12 left-20 border-white border-2 rounded-lg"/>
<img src="/images/projects/justmusic/justmusic-banner.png" class="pointer-events-none rounded-md"/> <img src="/images/projects/justmusic/justmusic-banner.png" class="pointer-events-none rounded-md"/>
<p class="text-xl font-normal text-black"> <p class="text-xl font-normal text-black">
@ -36,7 +36,7 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
d'un selfie pris sur le vif, vous pouvez partager à tout moment de la journée votre moment favori et interagir d'un selfie pris sur le vif, vous pouvez partager à tout moment de la journée votre moment favori et interagir
avec les autres utilisateurs. avec les autres utilisateurs.
</p> </p>
<div class="flex flox-row w-full justify-between overflow-hidden"> <div class="flex flox-row w-full justify-between overflow-scroll overflow-y-hidden">
<img src="/images/projects/justmusic/justmusic-1.png" class="pointer-events-none w-52 object-contain"/> <img src="/images/projects/justmusic/justmusic-1.png" class="pointer-events-none w-52 object-contain"/>
<img src="/images/projects/justmusic/justmusic-4.png" class="pointer-events-none w-52 object-contain"/> <img src="/images/projects/justmusic/justmusic-4.png" class="pointer-events-none w-52 object-contain"/>
<img src="/images/projects/justmusic/justmusic-2.png" class="pointer-events-none w-52 object-contain"/> <img src="/images/projects/justmusic/justmusic-2.png" class="pointer-events-none w-52 object-contain"/>

10
src/components/views/MovieFinderView.vue
Unescape View File

@ -4,9 +4,9 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
</script> </script>
<template> <template>
<div class="flex flex-col h-[75vh] w-full bg-black overflow-hidden relative items-center justify-center px-96"> <div class="flex flex-col h-[75vh] w-full bg-black overflow-hidden relative items-center justify-center sm:px-20 md:px-50 lg:px-60 xl:px-96 px-10">
<p class="text-6xl font-extrabold text-white pb-8 z-10">MovieFinder</p> <p class="text-6xl font-extrabold text-white pb-8 z-10">MovieFinder</p>
<p class="text-xl font-light text-white text-center z-10">J'ai développé l'application MovieFinder pour permettre <p class=" md:text-xl text-md font-light text-white text-center z-10">
la découverte des films tendance et des sorties en salle à travers le monde entier. Inspirée par les applications la découverte des films tendance et des sorties en salle à travers le monde entier. Inspirée par les applications
de rencontres, MovieFinder vous permet de "liker" ou de rejeter des films et séries tendances.</p> de rencontres, MovieFinder vous permet de "liker" ou de rejeter des films et séries tendances.</p>
<div class="flex scale-90 sm:scale-100 flex-row gap-3 pt-12 flex-wrap items-center justify-center z-10"> <div class="flex scale-90 sm:scale-100 flex-row gap-3 pt-12 flex-wrap items-center justify-center z-10">
@ -22,9 +22,9 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
<router-link to="/"> <router-link to="/">
<img src="/images/back-button.png" class="absolute z-10 top-0 left-0 p-10 scale-25 hover:scale-35 ease-in-out transition-all"/> <img src="/images/back-button.png" class="absolute z-10 top-0 left-0 p-10 scale-25 hover:scale-35 ease-in-out transition-all"/>
</router-link> </router-link>
<img src="/images/projects/moviefinder/movie-finder-banner.png" class="opacity-10 absolute z-0 pointer-events-none"/> <img src="/images/projects/moviefinder/movie-finder-banner.png" class="opacity-10 absolute z-0 pointer-events-none h-[75vh] w-full object-cover"/>
</div> </div>
<div class="bg-white w-full px-80 py-20 transition-all flex flex-col gap-20 pb-36 items-center relative"> <div class="bg-white w-full sm:px-20 md:px-50 lg:px-60 xl:px-80 px-10 py-20 transition-all flex flex-col gap-20 pb-36 items-center relative">
<img src="/images/projects/moviefinder/logo.png" class=" absolute z-0 pointer-events-none w-20 -top-12 left-20"/> <img src="/images/projects/moviefinder/logo.png" class=" absolute z-0 pointer-events-none w-20 -top-12 left-20"/>
<img src="/images/projects/moviefinder/banner-1.png" class="pointer-events-none rounded-md"/> <img src="/images/projects/moviefinder/banner-1.png" class="pointer-events-none rounded-md"/>
@ -35,7 +35,7 @@ import RedirectLogo from "../../assets/icons/redirect.svg";
les détails de chaque film, incluant le synopsis, la bande-annonce, les acteurs principaux et leur popularité, les détails de chaque film, incluant le synopsis, la bande-annonce, les acteurs principaux et leur popularité,
ainsi que des recommandations de films similaires et des commentaires d'internautes. ainsi que des recommandations de films similaires et des commentaires d'internautes.
</p> </p>
<div class="flex flox-row w-full justify-between overflow-hidden"> <div class="flex flox-row w-full justify-between overflow-scroll overflow-y-hidden">
<img src="/images/projects/moviefinder/moviefinder-1.png" class="pointer-events-none w-52 object-contain"/> <img src="/images/projects/moviefinder/moviefinder-1.png" class="pointer-events-none w-52 object-contain"/>
<img src="/images/projects/moviefinder/moviefinder-2.png" class="pointer-events-none w-52 object-contain"/> <img src="/images/projects/moviefinder/moviefinder-2.png" class="pointer-events-none w-52 object-contain"/>
<img src="/images/projects/moviefinder/moviefinder-3.png" class="pointer-events-none w-52 object-contain"/> <img src="/images/projects/moviefinder/moviefinder-3.png" class="pointer-events-none w-52 object-contain"/>

Write Preview
Loading…
Cancel
Save