jbourdon/social-media
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/main' into feature/oauth

Browse Source
This commit is contained in:
Dominic Villemure
2024-06-09 19:45:20 -04:00
parent 305021101c 8bacd976c5
commit 2d438c30be
58 changed files with 8010 additions and 385 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/views/main/ContactView.vue
View File

@@ -33,10 +33,12 @@
<h1 class="h2-Participez-au-développement">PARTICIPEZ AU DÉVELOPPEMENT</h1>
<v-text-field v-model="name" label="Nom" style="color: rgb(107, 0, 101);"></v-text-field>
<v-text-field v-model="emailAddress" label="Courriel" style="color: rgb(107, 0, 101);"></v-text-field>
<v-textarea v-model="reasonToJoin" style="color: rgb(107, 0, 101)" label="Pourquoi voulez-vous participer au développement?"
placeholder="Écrivez votre message ici" rows="3" auto-grow></v-textarea>
<v-textarea v-model="socialNetworkAccount" style="color: rgb(107, 0, 101)" label="Avez-vous déjà des comptes sur les réseaux sociaux?"
placeholder="Écrivez votre message ici" rows="3" auto-grow></v-textarea>
<v-textarea v-model="reasonToJoin" style="color: rgb(107, 0, 101)"
label="Pourquoi voulez-vous participer au développement?" placeholder="Écrivez votre message ici"
rows="3" auto-grow></v-textarea>
<v-textarea v-model="socialNetworkAccount" style="color: rgb(107, 0, 101)"
label="Avez-vous déjà des comptes sur les réseaux sociaux?" placeholder="Écrivez votre message ici"
rows="3" auto-grow></v-textarea>
<v-btn @click="sendForm()" style="background-color: rgb(163, 14, 121); color: white; font-weight: bold;"
class="mt-4 send-btn" block>Envoyez
</v-btn>
@@ -101,16 +103,19 @@
</v-col>
</v-row>
<!-- Form Information -->+
<v-text-field v-model="name" class="labelsize" label="Nom" style="margin-top: 5%; color: rgb(107, 0, 101);"></v-text-field>
<v-text-field v-model="emailAddress" class="labelsize" label="Courriel" style="color: rgb(107, 0, 101);"></v-text-field>
<!-- Form Information -->
<v-text-field v-model="name" class="labelsize" label="Nom"
style="margin-top: 5%; color: rgb(107, 0, 101);"></v-text-field>
<v-text-field v-model="emailAddress" class="labelsize" label="Courriel"
style="color: rgb(107, 0, 101);"></v-text-field>
<v-textarea v-model="reasonToJoin" class="labelsize" style="color: rgb(107, 0, 101)"
label="Pourquoi voulez-vous participer au développement?" placeholder="Écrivez votre message ici" rows="3"
auto-grow></v-textarea>
<v-textarea v-model="socialNetworkAccount" class="labelsize" style="color: rgb(107, 0, 101)"
label="Avez-vous déjà des comptes sur les réseaux sociaux?" placeholder="Écrivez votre message ici" rows="3"
auto-grow></v-textarea>
<v-btn @click="sendForm()" style="background-color: rgb(163, 14, 121); margin-bottom: 8%; color: white; font-weight: bold;"
<v-btn @click="sendForm()"
style="background-color: rgb(163, 14, 121); margin-bottom: 8%; color: white; font-weight: bold;"
class="mt-4 send-btn" block>
Envoyez
</v-btn>
@@ -182,8 +187,8 @@
<script setup>
import DefaultLayout from '@/layouts/DefaultLayout.vue';
import FooterLayout from '@/layouts/FooterLayout.vue';
import { ref } from 'vue';
import { useClient } from "@/plugins/api.js";
import { ref } from 'vue';
const client = useClient();

89
src/views/main/CreatorFolio.vue
View File

@@ -35,7 +35,7 @@
</v-col>
<!-- Instagram -->
<v-col cols="2" sm="2" xs="3" style="margin-top: 60px; z-index: 50;" class="d-flex justify-center align-center">
<a href="https://www.instagram.com/p/C2f-3UnNdfX//">
<a href="https://www.instagram.com/guillaumeaime/">
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/instagramblack.png"
alt="Instagram"></v-img>
</a>
@@ -46,12 +46,7 @@
<v-img :src="profilePicture" class="elevation-4 mobile-profile-picture-creator"></v-img>
</v-row>
</v-col>
<!-- X
<v-col cols="2" sm="2" xs="3" style="margin-top: 60px; z-index: 50;" class="d-flex justify-center align-center">
<a href="https://www.x.com/">
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/xblack.png" alt="X"></v-img>
</a>
</v-col> -->
<!-- TikTok -->
<v-col cols="2" sm="2" xs="3" style="margin-top: 60px; z-index: 50;" class="d-flex justify-center align-center">
<a href="https://www.tiktok.com/@guillaumeaime">
@@ -59,18 +54,25 @@
alt="TikTok"></v-img>
</a>
</v-col>
<v-spacer class="hidden-xs"> </v-spacer>
</v-row>
<!-- User informations Name title and description -->
<v-row class="social-container-mobile">
<v-col cols="12" xs="12" sm="4" class="d-flex justify-center">
<v-row>
<v-row class="d-flex justify-center">
{{ name }}
</v-row>
</v-col>
<v-spacer xs="12" sm="4"></v-spacer>
<v-col cols="12" xs="12" sm="4" class="d-flex justify-center">
<v-row>
<v-row class="d-flex justify-center">
{{ title }}
</v-row>
</v-col>
@@ -253,11 +255,6 @@
<img class="socialicons" src="/images/hutopymedia/icons/black/instagramblack.png"
alt="Description image 2">
</a>
<!-- x
<a href="https://www.facebook.com/profile.php?id=61556819217561">
<img class="socialicons" src="/images/hutopymedia/icons/black/xblack.png"
alt="Description image 2">
</a> -->
<a href="https://www.tiktok.com/@guillaumeaime">
<img class="socialicons invert-color" src="/images/hutopymedia/icons/white/tiktokwhite.png"
@@ -287,6 +284,8 @@
</v-container>
<PostContentMenu style="margin-top: -30px;"></PostContentMenu>
<!-- Card youtube balado -->
<v-container>
@@ -309,8 +308,7 @@
</v-col>
<!-- Card core Video/image & text -->
<div
style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%; margin-bottom: -5%;">
<div style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%">
<v-container>
<iframe class="card-youtube" style="margin-left: 2.1%; width: 96%;"
src="https://www.youtube.com/embed/pf95whtA_xs?start=0" title="Guillaumem" frameborder="0"
@@ -320,14 +318,14 @@
<!-- Date -->
<v-row class="text-right">
<v-col>
<h1 style=" margin-right: 40px; margin-top: 10px">
<h1 style=" margin-right: 40px; margin-top: 10px" class="card-date">
24-04-2024
</h1>
</v-col>
</v-row>
<p class="text-justify pa-10" style="margin-bottom: -3%; font-size: 1em">C’est un honneur de vous
<p class="text-justify pa-10" style="margin-bottom: -50px; font-size: 1em">C’est un honneur de vous
présenter
mon tout premier balado. Dans ce premier épisode, les passionnés de cinéma et de gadgets seront
particulièrement gâtés, car je dévoile les gadgets que j'utilise professionnellement. Par la suite, je
@@ -349,13 +347,14 @@
</div>
<!-- Comments -->
<v-text-field style="margin-left: 2%; margin-bottom: 15px;"
placeholder="Commentaire (Commentaire, Aime et Partagez sont non fonctionnel pour le moment)"></v-text-field>
<v-text-field style="margin-left: 2%; margin-bottom: 15px; margin-bottom: -20px"
placeholder="Commentaire (Arrive bientôt)"></v-text-field>
</v-container>
</div>
</v-card>
</v-container>
<!-- Card nouvelle boutique -->
<v-container>
<v-card class="flow-menu m-0 youtube-card">
@@ -366,19 +365,18 @@
<h1 class="card-title">
NOUVELLE BOUTIQUE À SAINT-HYACINTHE</h1>
</v-col>
<!--
<v-col class="text-right">
<v-btn class="btn-card-options" flat tile elevation="0">
<!--<v-col class="text-right">
<v-btn class="btn-card-options" flat tile elevation="0">
<v-icon style="color: #6e6e6e; font-size: 24px;">mdi-dots-vertical</v-icon>
</v-btn> (a intégrer)
</v-col> -->
</v-col> -->
</v-row>
</v-col>
<!-- Card core Video/image & text -->
<div
style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%; margin-bottom: -5%;">
<div style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%">
<v-container>
<v-img src="images/usersmedia/guillaumeMousseau/pictures/posts/nouvelleboutique.jpg"
title="Guillaumem"></v-img>
@@ -386,13 +384,14 @@
<!-- Date -->
<v-row class="text-right">
<v-col>
<h1 style=" margin-right: 40px; margin-top: 10px">
23-04-2024
<h1 style=" margin-right: 40px; margin-top: 10px" class="card-date">
24-04-2024
</h1>
</v-col>
</v-row>
<p class="text-justify pa-10" style="margin-bottom: -3%; font-size: 1em">J’ai découvert une nouvelle
<p class="text-justify pa-10" style="margin-bottom: -6%; font-size: 1em">J’ai découvert une nouvelle
boutique
à St-Hyacinthe qui embrasse exactement ma philosophie derrière la page Guillaume Aime: faire découvrir
le
@@ -405,6 +404,7 @@
Carl
pour ce projet!</p>
<!-- Like dislike commment Section -->
<div style="height: 20px;"></div>
<div
@@ -414,8 +414,8 @@
</div>
<!-- Comments -->
<v-text-field style="margin-left: 2%; margin-bottom: 15px;"
placeholder="Commentaire (Commentaire, Aime et Partagez sont non fonctionnel pour le moment)"></v-text-field>
<v-text-field style="margin-left: 2%; margin-bottom: 15px; margin-bottom: -20px"
placeholder="Commentaire (Arrive bientôt)"></v-text-field>
</v-container>
</div>
</v-card>
@@ -442,8 +442,7 @@
</v-col>
<!-- Card core Video/image & text -->
<div
style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%; margin-bottom: -5%;">
<div style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%">
<v-container>
<v-img src="images/usersmedia/guillaumeMousseau/pictures/posts/cestparti.jpg"
title="Guillaumem"></v-img>
@@ -451,13 +450,13 @@
<!-- Date -->
<v-row class="text-right">
<v-col>
<h1 style=" margin-right: 40px; margin-top: 10px">
<h1 style=" margin-right: 40px; margin-top: 10px" class="card-date">
22-04-2024
</h1>
</v-col>
</v-row>
<p class="text-justify pa-10" style="margin-bottom: -3%; font-size: 1em">C'est parti pour 2024 ! De
<p class="text-justify pa-10" style="margin-bottom: -6%; font-size: 1em">C'est parti pour 2024 ! De
retour au
travail officiellement ce matin afin d'aider les entreprises de la région à rayonner ! Mettre en
lumière les
@@ -474,8 +473,8 @@
</div>
<!-- Comments -->
<v-text-field style="margin-left: 2%; margin-bottom: 15px;"
placeholder="Commentaire (Commentaire, Aime et Partagez sont non fonctionnel pour le moment)"></v-text-field>
<v-text-field style="margin-left: 2%; margin-bottom: 15px; margin-bottom: -20px"
placeholder="Commentaire (Arrive bientôt)"></v-text-field>
</v-container>
</div>
</v-card>
@@ -542,6 +541,7 @@
<script setup>
import DefaultLayout from '@/layouts/DefaultLayout.vue';
import FooterLayout from '@/layouts/FooterLayout.vue';
import PostContentMenu from '@/layouts/PostContentMenu.vue';
import { ref } from 'vue';
import StripePayment from '../StripePayment.vue';
let imageSrc = '/images/usersmedia/guillaumeMousseau/banners/bannerGuillaumeMousseau01.png';
@@ -552,8 +552,8 @@ let drawerbottom = ref(false)
let navigationItems = [
{ icon: 'mdi-home', text: 'Accueil', link: 'home' },
{ icon: 'mdi-account-group', text: 'Amis', link: '/contact' },
//{ icon: 'mdi-file-document-outline', text: 'Contenu', link: '/creatorfolio' }
{ icon: 'mdi-account-group', text: 'Utilisateur', link: '/userbrowser' },
{ icon: 'mdi-handshake', text: 'Aidez-nous', link: '/contact' },
];
</script>
@@ -562,6 +562,7 @@ let navigationItems = [
filter: invert(1);
}
.Hutopy-menu-sticky-mobile {
position: sticky;
top: 0;
@@ -682,9 +683,13 @@ let navigationItems = [
.card-date {
margin-left: 10px;
margin-top: -18px
margin-top: -18px;
margin-bottom: -20px;
font-size: .8rem;
}
.social-container {
background-color: #006d77;
border-top-right-radius: 30px;
@@ -766,6 +771,7 @@ let navigationItems = [
.profile-banner {
margin-top: 25px;
min-height: 200px
}
.v-navigation-drawer {
@@ -1089,6 +1095,9 @@ let navigationItems = [
}
@media (min-width: 2560px) {
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(25%) translateX(-20px);
}

58
src/views/main/HomeView.vue
View File

@@ -162,7 +162,7 @@
style="margin-top: 3%; margin-bottom: 5%; max-width: 900px;">
Bienvenue sur Hutopy, votre nouvelle frontière de création, de connexion et d'innovation. Au
cœur de notre mission réside une ambition audacieuse : transformer l'espace numérique en un
écosystème où chaque créateur, chaque rêveur, chaque professionnel, peut non seulement imaginer
écosystème où chaque créateur, chaque rêveur, chaque professionnel, peut non seulement imaginer,
mais concrétiser son utopie personnelle. Hutopy est plus qu'une simple plateforme c'est une
communauté vibrante qui défie les conventions de l’éducation, encourage l'originalité et célèbre
la créativité.
@@ -226,26 +226,32 @@
<!-- Account links -->
<v-row justify="center" class="profile-images">
<v-col>
<router-link :to="{ name: 'creatorfolio' }">
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image"
class="profile-image ">
<router-link :to="{ name: 'Hutopy' }">
<img src="/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile02.png"
alt="Profile Image" class="profile-image ">
</router-link>
</v-col>
<v-col>
<router-link :to="{ name: 'creatorfolio' }">
<router-link :to="{ name: 'guillaumeaime' }">
<img src="/images/usersmedia/guillaumeMousseau/profilepictures/profileGuillaumeMousseau01.jpg"
alt="Profile Image" class="profile-image">
</router-link>
</v-col>
<v-col>
<router-link :to="{ name: 'creatorfolio' }">
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image"
class="profile-image">
<router-link :to="{ name: 'chloebeaugrand' }">
<img src="/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand02.png"
alt="Profile Image" class="profile-image">
</router-link>
</v-col>
</v-row>
</v-col>
<v-spacer></v-spacer>
<v-row justify='center'>
<router-link :to="{ name: 'userbrowser' }">
<v-btn style="border-radius:10px; background-color:#a30e79; color:white">Découvre les autres créateurs
</v-btn>
</router-link>
</v-row>
<v-spacer></v-spacer>
</v-col>
<v-spacer></v-spacer>
</v-row>
@@ -314,7 +320,7 @@
<p style="margin-top: 3%; margin-bottom: 5%; text-align: justify;" class="center-vertical">
Bienvenue sur Hutopy, votre nouvelle frontière de création, de connexion et d'innovation. Au
cœur de notre mission réside une ambition audacieuse : transformer l'espace numérique en un
écosystème où chaque créateur, chaque rêveur, chaque professionnel, peut non seulement imaginer
écosystème où chaque créateur, chaque rêveur, chaque professionnel, peut non seulement imaginer,
mais concrétiser son utopie personnelle. Hutopy est plus qu'une simple plateforme c'est une
communauté vibrante qui défie les conventions de l’éducation, encourage l'originalité et célèbre
la créativité.
@@ -366,28 +372,36 @@
<v-col>
<v-row justify="center" class="profile-images">
<v-col cols="8">
<router-link :to="{ name: 'creatorfolio' }">
<router-link :to="{ name: 'Hutopy' }">
<img src="/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile02.png"
alt="Profile Image" class="profile-image ">
</router-link>
</v-col>
<v-col cols="8">
<router-link :to="{ name: 'guillaumeaime' }">
<img src="/images/usersmedia/guillaumeMousseau/profilepictures/profileGuillaumeMousseau01.jpg"
alt="Profile Image" class="profile-image">
</router-link>
</v-col>
<v-col cols="8">
<router-link :to="{ name: 'creatorfolio' }">
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image"
class="profile-image ">
</router-link>
</v-col>
<v-col cols="8">
<router-link :to="{ name: 'creatorfolio' }">
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image"
class="profile-image">
</router-link>
</v-col>
<router-link :to="{ name: 'chloebeaugrand' }">
<img src="/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand02.png"
alt="Profile Image" class="profile-image">
</router-link>
</v-col>
<v-row justify='center'>
<router-link :to="{ name: 'userbrowser' }">
<v-btn style="margin-top:30px; border-radius:10px; background-color:#a30e79; color:white">Découvre les autres créateurs
</v-btn>
</router-link>
</v-row>
</v-row>
</v-col>
</div>
</div>
<v-snackbar v-model="errorNoAccessSnackBar">
Vous n'etes pas connecter !
<template v-slot:actions>