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

370
package-lock.json generated
View File

@@ -24,7 +24,7 @@
"eslint-plugin-vue": "^9.22.0", "eslint-plugin-vue": "^9.22.0",
"postcss": "^8.4.35", "postcss": "^8.4.35",
"tailwindcss": "^3.4.1", "tailwindcss": "^3.4.1",
"vite": "^5.0.11" "vite": "^5.2.11"
} }
}, },
"node_modules/@aashutoshrathi/word-wrap": { "node_modules/@aashutoshrathi/word-wrap": {
@@ -60,9 +60,9 @@
} }
}, },
"node_modules/@esbuild/aix-ppc64": { "node_modules/@esbuild/aix-ppc64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.20.2.tgz",
"integrity": "sha512-bmoCYyWdEL3wDQIVbcyzRyeKLgk2WtWLTWz1ZIAZF/EGbNOwSA6ew3PftJ1PqMiOOGu0OyFMzG53L0zqIpPeNA==", "integrity": "sha512-D+EBOJHXdNZcLJRBkhENNG8Wji2kgc9AZ9KiPr1JuZjsNtyHzrsfLRrY0tk2H2aoFu6RANO1y1iPPUCDYWkb5g==",
"cpu": [ "cpu": [
"ppc64" "ppc64"
], ],
@@ -76,9 +76,9 @@
} }
}, },
"node_modules/@esbuild/android-arm": { "node_modules/@esbuild/android-arm": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.20.2.tgz",
"integrity": "sha512-qg/Lj1mu3CdQlDEEiWrlC4eaPZ1KztwGJ9B6J+/6G+/4ewxJg7gqj8eVYWvao1bXrqGiW2rsBZFSX3q2lcW05w==", "integrity": "sha512-t98Ra6pw2VaDhqNWO2Oph2LXbz/EJcnLmKLGBJwEwXX/JAN83Fym1rU8l0JUWK6HkIbWONCSSatf4sf2NBRx/w==",
"cpu": [ "cpu": [
"arm" "arm"
], ],
@@ -92,9 +92,9 @@
} }
}, },
"node_modules/@esbuild/android-arm64": { "node_modules/@esbuild/android-arm64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.20.2.tgz",
"integrity": "sha512-P0UVNGIienjZv3f5zq0DP3Nt2IE/3plFzuaS96vihvD0Hd6H/q4WXUGpCxD/E8YrSXfNyRPbpTq+T8ZQioSuPA==", "integrity": "sha512-mRzjLacRtl/tWU0SvD8lUEwb61yP9cqQo6noDZP/O8VkwafSYwZ4yWy24kan8jE/IMERpYncRt2dw438LP3Xmg==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -108,9 +108,9 @@
} }
}, },
"node_modules/@esbuild/android-x64": { "node_modules/@esbuild/android-x64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.20.2.tgz",
"integrity": "sha512-3k7ZoUW6Q6YqhdhIaq/WZ7HwBpnFBlW905Fa4s4qWJyiNOgT1dOqDiVAQFwBH7gBRZr17gLrlFCRzF6jFh7Kew==", "integrity": "sha512-btzExgV+/lMGDDa194CcUQm53ncxzeBrWJcncOBxuC6ndBkKxnHdFJn86mCIgTELsooUmwUm9FkhSp5HYu00Rg==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -124,9 +124,9 @@
} }
}, },
"node_modules/@esbuild/darwin-arm64": { "node_modules/@esbuild/darwin-arm64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.20.2.tgz",
"integrity": "sha512-B6IeSgZgtEzGC42jsI+YYu9Z3HKRxp8ZT3cqhvliEHovq8HSX2YX8lNocDn79gCKJXOSaEot9MVYky7AKjCs8g==", "integrity": "sha512-4J6IRT+10J3aJH3l1yzEg9y3wkTDgDk7TSDFX+wKFiWjqWp/iCfLIYzGyasx9l0SAFPT1HwSCR+0w/h1ES/MjA==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -140,9 +140,9 @@
} }
}, },
"node_modules/@esbuild/darwin-x64": { "node_modules/@esbuild/darwin-x64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.20.2.tgz",
"integrity": "sha512-hKoVkKzFiToTgn+41qGhsUJXFlIjxI/jSYeZf3ugemDYZldIXIxhvwN6erJGlX4t5h417iFuheZ7l+YVn05N3A==", "integrity": "sha512-tBcXp9KNphnNH0dfhv8KYkZhjc+H3XBkF5DKtswJblV7KlT9EI2+jeA8DgBjp908WEuYll6pF+UStUCfEpdysA==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -156,9 +156,9 @@
} }
}, },
"node_modules/@esbuild/freebsd-arm64": { "node_modules/@esbuild/freebsd-arm64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.20.2.tgz",
"integrity": "sha512-4aRvFIXmwAcDBw9AueDQ2YnGmz5L6obe5kmPT8Vd+/+x/JMVKCgdcRwH6APrbpNXsPz+K653Qg8HB/oXvXVukA==", "integrity": "sha512-d3qI41G4SuLiCGCFGUrKsSeTXyWG6yem1KcGZVS+3FYlYhtNoNgYrWcvkOoaqMhwXSMrZRl69ArHsGJ9mYdbbw==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -172,9 +172,9 @@
} }
}, },
"node_modules/@esbuild/freebsd-x64": { "node_modules/@esbuild/freebsd-x64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.20.2.tgz",
"integrity": "sha512-EYoXZ4d8xtBoVN7CEwWY2IN4ho76xjYXqSXMNccFSx2lgqOG/1TBPW0yPx1bJZk94qu3tX0fycJeeQsKovA8gg==", "integrity": "sha512-d+DipyvHRuqEeM5zDivKV1KuXn9WeRX6vqSqIDgwIfPQtwMP4jaDsQsDncjTDDsExT4lR/91OLjRo8bmC1e+Cw==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -188,9 +188,9 @@
} }
}, },
"node_modules/@esbuild/linux-arm": { "node_modules/@esbuild/linux-arm": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.20.2.tgz",
"integrity": "sha512-J5jPms//KhSNv+LO1S1TX1UWp1ucM6N6XuL6ITdKWElCu8wXP72l9MM0zDTzzeikVyqFE6U8YAV9/tFyj0ti+w==", "integrity": "sha512-VhLPeR8HTMPccbuWWcEUD1Az68TqaTYyj6nfE4QByZIQEQVWBB8vup8PpR7y1QHL3CpcF6xd5WVBU/+SBEvGTg==",
"cpu": [ "cpu": [
"arm" "arm"
], ],
@@ -204,9 +204,9 @@
} }
}, },
"node_modules/@esbuild/linux-arm64": { "node_modules/@esbuild/linux-arm64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.20.2.tgz",
"integrity": "sha512-EoTjyYyLuVPfdPLsGVVVC8a0p1BFFvtpQDB/YLEhaXyf/5bczaGeN15QkR+O4S5LeJ92Tqotve7i1jn35qwvdA==", "integrity": "sha512-9pb6rBjGvTFNira2FLIWqDk/uaf42sSyLE8j1rnUpuzsODBq7FvpwHYZxQ/It/8b+QOS1RYfqgGFNLRI+qlq2A==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -220,9 +220,9 @@
} }
}, },
"node_modules/@esbuild/linux-ia32": { "node_modules/@esbuild/linux-ia32": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.20.2.tgz",
"integrity": "sha512-Thsa42rrP1+UIGaWz47uydHSBOgTUnwBwNq59khgIwktK6x60Hivfbux9iNR0eHCHzOLjLMLfUMLCypBkZXMHA==", "integrity": "sha512-o10utieEkNPFDZFQm9CoP7Tvb33UutoJqg3qKf1PWVeeJhJw0Q347PxMvBgVVFgouYLGIhFYG0UGdBumROyiig==",
"cpu": [ "cpu": [
"ia32" "ia32"
], ],
@@ -236,9 +236,9 @@
} }
}, },
"node_modules/@esbuild/linux-loong64": { "node_modules/@esbuild/linux-loong64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.20.2.tgz",
"integrity": "sha512-LiXdXA0s3IqRRjm6rV6XaWATScKAXjI4R4LoDlvO7+yQqFdlr1Bax62sRwkVvRIrwXxvtYEHHI4dm50jAXkuAA==", "integrity": "sha512-PR7sp6R/UC4CFVomVINKJ80pMFlfDfMQMYynX7t1tNTeivQ6XdX5r2XovMmha/VjR1YN/HgHWsVcTRIMkymrgQ==",
"cpu": [ "cpu": [
"loong64" "loong64"
], ],
@@ -252,9 +252,9 @@
} }
}, },
"node_modules/@esbuild/linux-mips64el": { "node_modules/@esbuild/linux-mips64el": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.20.2.tgz",
"integrity": "sha512-fEnAuj5VGTanfJ07ff0gOA6IPsvrVHLVb6Lyd1g2/ed67oU1eFzL0r9WL7ZzscD+/N6i3dWumGE1Un4f7Amf+w==", "integrity": "sha512-4BlTqeutE/KnOiTG5Y6Sb/Hw6hsBOZapOVF6njAESHInhlQAghVVZL1ZpIctBOoTFbQyGW+LsVYZ8lSSB3wkjA==",
"cpu": [ "cpu": [
"mips64el" "mips64el"
], ],
@@ -268,9 +268,9 @@
} }
}, },
"node_modules/@esbuild/linux-ppc64": { "node_modules/@esbuild/linux-ppc64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.20.2.tgz",
"integrity": "sha512-nYJA2/QPimDQOh1rKWedNOe3Gfc8PabU7HT3iXWtNUbRzXS9+vgB0Fjaqr//XNbd82mCxHzik2qotuI89cfixg==", "integrity": "sha512-rD3KsaDprDcfajSKdn25ooz5J5/fWBylaaXkuotBDGnMnDP1Uv5DLAN/45qfnf3JDYyJv/ytGHQaziHUdyzaAg==",
"cpu": [ "cpu": [
"ppc64" "ppc64"
], ],
@@ -284,9 +284,9 @@
} }
}, },
"node_modules/@esbuild/linux-riscv64": { "node_modules/@esbuild/linux-riscv64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.20.2.tgz",
"integrity": "sha512-2MueBrlPQCw5dVJJpQdUYgeqIzDQgw3QtiAHUC4RBz9FXPrskyyU3VI1hw7C0BSKB9OduwSJ79FTCqtGMWqJHg==", "integrity": "sha512-snwmBKacKmwTMmhLlz/3aH1Q9T8v45bKYGE3j26TsaOVtjIag4wLfWSiZykXzXuE1kbCE+zJRmwp+ZbIHinnVg==",
"cpu": [ "cpu": [
"riscv64" "riscv64"
], ],
@@ -300,9 +300,9 @@
} }
}, },
"node_modules/@esbuild/linux-s390x": { "node_modules/@esbuild/linux-s390x": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.20.2.tgz",
"integrity": "sha512-+Pil1Nv3Umes4m3AZKqA2anfhJiVmNCYkPchwFJNEJN5QxmTs1uzyy4TvmDrCRNT2ApwSari7ZIgrPeUx4UZDg==", "integrity": "sha512-wcWISOobRWNm3cezm5HOZcYz1sKoHLd8VL1dl309DiixxVFoFe/o8HnwuIwn6sXre88Nwj+VwZUvJf4AFxkyrQ==",
"cpu": [ "cpu": [
"s390x" "s390x"
], ],
@@ -316,9 +316,9 @@
} }
}, },
"node_modules/@esbuild/linux-x64": { "node_modules/@esbuild/linux-x64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.20.2.tgz",
"integrity": "sha512-B71g1QpxfwBvNrfyJdVDexenDIt1CiDN1TIXLbhOw0KhJzE78KIFGX6OJ9MrtC0oOqMWf+0xop4qEU8JrJTwCg==", "integrity": "sha512-1MdwI6OOTsfQfek8sLwgyjOXAu+wKhLEoaOLTjbijk6E2WONYpH9ZU2mNtR+lZ2B4uwr+usqGuVfFT9tMtGvGw==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -332,9 +332,9 @@
} }
}, },
"node_modules/@esbuild/netbsd-x64": { "node_modules/@esbuild/netbsd-x64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.20.2.tgz",
"integrity": "sha512-3ltjQ7n1owJgFbuC61Oj++XhtzmymoCihNFgT84UAmJnxJfm4sYCiSLTXZtE00VWYpPMYc+ZQmB6xbSdVh0JWA==", "integrity": "sha512-K8/DhBxcVQkzYc43yJXDSyjlFeHQJBiowJ0uVL6Tor3jGQfSGHNNJcWxNbOI8v5k82prYqzPuwkzHt3J1T1iZQ==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -348,9 +348,9 @@
} }
}, },
"node_modules/@esbuild/openbsd-x64": { "node_modules/@esbuild/openbsd-x64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.20.2.tgz",
"integrity": "sha512-RbrfTB9SWsr0kWmb9srfF+L933uMDdu9BIzdA7os2t0TXhCRjrQyCeOt6wVxr79CKD4c+p+YhCj31HBkYcXebw==", "integrity": "sha512-eMpKlV0SThJmmJgiVyN9jTPJ2VBPquf6Kt/nAoo6DgHAoN57K15ZghiHaMvqjCye/uU4X5u3YSMgVBI1h3vKrQ==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -364,9 +364,9 @@
} }
}, },
"node_modules/@esbuild/sunos-x64": { "node_modules/@esbuild/sunos-x64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.20.2.tgz",
"integrity": "sha512-HKjJwRrW8uWtCQnQOz9qcU3mUZhTUQvi56Q8DPTLLB+DawoiQdjsYq+j+D3s9I8VFtDr+F9CjgXKKC4ss89IeA==", "integrity": "sha512-2UyFtRC6cXLyejf/YEld4Hajo7UHILetzE1vsRcGL3earZEW77JxrFjH4Ez2qaTiEfMgAXxfAZCm1fvM/G/o8w==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -380,9 +380,9 @@
} }
}, },
"node_modules/@esbuild/win32-arm64": { "node_modules/@esbuild/win32-arm64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.20.2.tgz",
"integrity": "sha512-URgtR1dJnmGvX864pn1B2YUYNzjmXkuJOIqG2HdU62MVS4EHpU2946OZoTMnRUHklGtJdJZ33QfzdjGACXhn1A==", "integrity": "sha512-GRibxoawM9ZCnDxnP3usoUDO9vUkpAxIIZ6GQI+IlVmr5kP3zUq+l17xELTHMWTWzjxa2guPNyrpq1GWmPvcGQ==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -396,9 +396,9 @@
} }
}, },
"node_modules/@esbuild/win32-ia32": { "node_modules/@esbuild/win32-ia32": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.20.2.tgz",
"integrity": "sha512-+ZOE6pUkMOJfmxmBZElNOx72NKpIa/HFOMGzu8fqzQJ5kgf6aTGrcJaFsNiVMH4JKpMipyK+7k0n2UXN7a8YKQ==", "integrity": "sha512-HfLOfn9YWmkSKRQqovpnITazdtquEW8/SoHW7pWpuEeguaZI4QnCRW6b+oZTztdBnZOS2hqJ6im/D5cPzBTTlQ==",
"cpu": [ "cpu": [
"ia32" "ia32"
], ],
@@ -412,9 +412,9 @@
} }
}, },
"node_modules/@esbuild/win32-x64": { "node_modules/@esbuild/win32-x64": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.19.12.tgz", "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.20.2.tgz",
"integrity": "sha512-T1QyPSDCyMXaO3pzBkF96E8xMkiRYbUEZADd29SyPGabqxMViNoii+NcK7eWJAEoU6RZyEm5lVSIjTmcdoB9HA==", "integrity": "sha512-N49X4lJX27+l9jbLKSqZ6bKNjzQvHaT8IIFUy+YIqmXQdjYCToGWwOItDrfby14c78aDd5NHQl29xingXfCdLQ==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -675,9 +675,9 @@
} }
}, },
"node_modules/@rollup/rollup-android-arm-eabi": { "node_modules/@rollup/rollup-android-arm-eabi": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.17.2.tgz",
"integrity": "sha512-+ac02NL/2TCKRrJu2wffk1kZ+RyqxVUlbjSagNgPm94frxtr+XDL12E5Ll1enWskLrtrZ2r8L3wED1orIibV/w==", "integrity": "sha512-NM0jFxY8bB8QLkoKxIQeObCaDlJKewVlIEkuyYKm5An1tdVZ966w2+MPQ2l8LBZLjR+SgyV+nRkTIunzOYBMLQ==",
"cpu": [ "cpu": [
"arm" "arm"
], ],
@@ -688,9 +688,9 @@
] ]
}, },
"node_modules/@rollup/rollup-android-arm64": { "node_modules/@rollup/rollup-android-arm64": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.17.2.tgz",
"integrity": "sha512-OBqcX2BMe6nvjQ0Nyp7cC90cnumt8PXmO7Dp3gfAju/6YwG0Tj74z1vKrfRz7qAv23nBcYM8BCbhrsWqO7PzQQ==", "integrity": "sha512-yeX/Usk7daNIVwkq2uGoq2BYJKZY1JfyLTaHO/jaiSwi/lsf8fTFoQW/n6IdAsx5tx+iotu2zCJwz8MxI6D/Bw==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -701,9 +701,9 @@
] ]
}, },
"node_modules/@rollup/rollup-darwin-arm64": { "node_modules/@rollup/rollup-darwin-arm64": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.17.2.tgz",
"integrity": "sha512-X64tZd8dRE/QTrBIEs63kaOBG0b5GVEd3ccoLtyf6IdXtHdh8h+I56C2yC3PtC9Ucnv0CpNFJLqKFVgCYe0lOQ==", "integrity": "sha512-kcMLpE6uCwls023+kknm71ug7MZOrtXo+y5p/tsg6jltpDtgQY1Eq5sGfHcQfb+lfuKwhBmEURDga9N0ol4YPw==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -714,9 +714,9 @@
] ]
}, },
"node_modules/@rollup/rollup-darwin-x64": { "node_modules/@rollup/rollup-darwin-x64": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.17.2.tgz",
"integrity": "sha512-cc71KUZoVbUJmGP2cOuiZ9HSOP14AzBAThn3OU+9LcA1+IUqswJyR1cAJj3Mg55HbjZP6OLAIscbQsQLrpgTOg==", "integrity": "sha512-AtKwD0VEx0zWkL0ZjixEkp5tbNLzX+FCqGG1SvOu993HnSz4qDI6S4kGzubrEJAljpVkhRSlg5bzpV//E6ysTQ==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -727,9 +727,22 @@
] ]
}, },
"node_modules/@rollup/rollup-linux-arm-gnueabihf": { "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.17.2.tgz",
"integrity": "sha512-a6w/Y3hyyO6GlpKL2xJ4IOh/7d+APaqLYdMf86xnczU3nurFTaVN9s9jOXQg97BE4nYm/7Ga51rjec5nfRdrvA==", "integrity": "sha512-3reX2fUHqN7sffBNqmEyMQVj/CKhIHZd4y631duy0hZqI8Qoqf6lTtmAKvJFYa6bhU95B1D0WgzHkmTg33In0A==",
"cpu": [
"arm"
],
"dev": true,
"optional": true,
"os": [
"linux"
]
},
"node_modules/@rollup/rollup-linux-arm-musleabihf": {
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.17.2.tgz",
"integrity": "sha512-uSqpsp91mheRgw96xtyAGP9FW5ChctTFEoXP0r5FAzj/3ZRv3Uxjtc7taRQSaQM/q85KEKjKsZuiZM3GyUivRg==",
"cpu": [ "cpu": [
"arm" "arm"
], ],
@@ -740,9 +753,9 @@
] ]
}, },
"node_modules/@rollup/rollup-linux-arm64-gnu": { "node_modules/@rollup/rollup-linux-arm64-gnu": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.17.2.tgz",
"integrity": "sha512-0fZBq27b+D7Ar5CQMofVN8sggOVhEtzFUwOwPppQt0k+VR+7UHMZZY4y+64WJ06XOhBTKXtQB/Sv0NwQMXyNAA==", "integrity": "sha512-EMMPHkiCRtE8Wdk3Qhtciq6BndLtstqZIroHiiGzB3C5LDJmIZcSzVtLRbwuXuUft1Cnv+9fxuDtDxz3k3EW2A==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -753,9 +766,9 @@
] ]
}, },
"node_modules/@rollup/rollup-linux-arm64-musl": { "node_modules/@rollup/rollup-linux-arm64-musl": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.17.2.tgz",
"integrity": "sha512-eTvzUS3hhhlgeAv6bfigekzWZjaEX9xP9HhxB0Dvrdbkk5w/b+1Sxct2ZuDxNJKzsRStSq1EaEkVSEe7A7ipgQ==", "integrity": "sha512-NMPylUUZ1i0z/xJUIx6VUhISZDRT+uTWpBcjdv0/zkp7b/bQDF+NfnfdzuTiB1G6HTodgoFa93hp0O1xl+/UbA==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -765,10 +778,23 @@
"linux" "linux"
] ]
}, },
"node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.17.2.tgz",
"integrity": "sha512-T19My13y8uYXPw/L/k0JYaX1fJKFT/PWdXiHr8mTbXWxjVF1t+8Xl31DgBBvEKclw+1b00Chg0hxE2O7bTG7GQ==",
"cpu": [
"ppc64"
],
"dev": true,
"optional": true,
"os": [
"linux"
]
},
"node_modules/@rollup/rollup-linux-riscv64-gnu": { "node_modules/@rollup/rollup-linux-riscv64-gnu": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.17.2.tgz",
"integrity": "sha512-ix+qAB9qmrCRiaO71VFfY8rkiAZJL8zQRXveS27HS+pKdjwUfEhqo2+YF2oI+H/22Xsiski+qqwIBxVewLK7sw==", "integrity": "sha512-BOaNfthf3X3fOWAB+IJ9kxTgPmMqPPH5f5k2DcCsRrBIbWnaJCgX2ll77dV1TdSy9SaXTR5iDXRL8n7AnoP5cg==",
"cpu": [ "cpu": [
"riscv64" "riscv64"
], ],
@@ -778,10 +804,23 @@
"linux" "linux"
] ]
}, },
"node_modules/@rollup/rollup-linux-s390x-gnu": {
"version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.17.2.tgz",
"integrity": "sha512-W0UP/x7bnn3xN2eYMql2T/+wpASLE5SjObXILTMPUBDB/Fg/FxC+gX4nvCfPBCbNhz51C+HcqQp2qQ4u25ok6g==",
"cpu": [
"s390x"
],
"dev": true,
"optional": true,
"os": [
"linux"
]
},
"node_modules/@rollup/rollup-linux-x64-gnu": { "node_modules/@rollup/rollup-linux-x64-gnu": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.17.2.tgz",
"integrity": "sha512-TenQhZVOtw/3qKOPa7d+QgkeM6xY0LtwzR8OplmyL5LrgTWIXpTQg2Q2ycBf8jm+SFW2Wt/DTn1gf7nFp3ssVA==", "integrity": "sha512-Hy7pLwByUOuyaFC6mAr7m+oMC+V7qyifzs/nW2OJfC8H4hbCzOX07Ov0VFk/zP3kBsELWNFi7rJtgbKYsav9QQ==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -792,9 +831,9 @@
] ]
}, },
"node_modules/@rollup/rollup-linux-x64-musl": { "node_modules/@rollup/rollup-linux-x64-musl": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.17.2.tgz",
"integrity": "sha512-LfFdRhNnW0zdMvdCb5FNuWlls2WbbSridJvxOvYWgSBOYZtgBfW9UGNJG//rwMqTX1xQE9BAodvMH9tAusKDUw==", "integrity": "sha512-h1+yTWeYbRdAyJ/jMiVw0l6fOOm/0D1vNLui9iPuqgRGnXA0u21gAqOyB5iHjlM9MMfNOm9RHCQ7zLIzT0x11Q==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -805,9 +844,9 @@
] ]
}, },
"node_modules/@rollup/rollup-win32-arm64-msvc": { "node_modules/@rollup/rollup-win32-arm64-msvc": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.17.2.tgz",
"integrity": "sha512-JPDxovheWNp6d7AHCgsUlkuCKvtu3RB55iNEkaQcf0ttsDU/JZF+iQnYcQJSk/7PtT4mjjVG8N1kpwnI9SLYaw==", "integrity": "sha512-tmdtXMfKAjy5+IQsVtDiCfqbynAQE/TQRpWdVataHmhMb9DCoJxp9vLcCBjEQWMiUYxO1QprH/HbY9ragCEFLA==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -818,9 +857,9 @@
] ]
}, },
"node_modules/@rollup/rollup-win32-ia32-msvc": { "node_modules/@rollup/rollup-win32-ia32-msvc": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.17.2.tgz",
"integrity": "sha512-fjtuvMWRGJn1oZacG8IPnzIV6GF2/XG+h71FKn76OYFqySXInJtseAqdprVTDTyqPxQOG9Exak5/E9Z3+EJ8ZA==", "integrity": "sha512-7II/QCSTAHuE5vdZaQEwJq2ZACkBpQDOmQsE6D6XUbnBHW8IAhm4eTufL6msLJorzrHDFv3CF8oCA/hSIRuZeQ==",
"cpu": [ "cpu": [
"ia32" "ia32"
], ],
@@ -831,9 +870,9 @@
] ]
}, },
"node_modules/@rollup/rollup-win32-x64-msvc": { "node_modules/@rollup/rollup-win32-x64-msvc": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.12.0.tgz", "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.17.2.tgz",
"integrity": "sha512-ZYmr5mS2wd4Dew/JjT0Fqi2NPB/ZhZ2VvPp7SmvPZb4Y1CG/LRcS6tcRo2cYU7zLK5A7cdbhWnnWmUjoI4qapg==", "integrity": "sha512-TGGO7v7qOq4CYmSBVEYpI1Y5xDuCEnbVC5Vth8mOsW0gDSzxNrVERPc790IGHsrT2dQSimgMr9Ub3Y1Jci5/8w==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -1454,9 +1493,9 @@
} }
}, },
"node_modules/esbuild": { "node_modules/esbuild": {
"version": "0.19.12", "version": "0.20.2",
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.19.12.tgz", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.20.2.tgz",
"integrity": "sha512-aARqgq8roFBj054KvQr5f1sFu0D65G+miZRCuJyJ0G13Zwx7vRar5Zhn2tkQNzIXcBrNVsv/8stehpj+GAjgbg==", "integrity": "sha512-WdOOppmUNU+IbZ0PaDiTst80zjnrOkyJNHoKupIcVyU8Lvla3Ugx94VzkQ32Ijqd7UhHJy75gNWDMUekcrSJ6g==",
"dev": true, "dev": true,
"hasInstallScript": true, "hasInstallScript": true,
"bin": { "bin": {
@@ -1466,29 +1505,29 @@
"node": ">=12" "node": ">=12"
}, },
"optionalDependencies": { "optionalDependencies": {
"@esbuild/aix-ppc64": "0.19.12", "@esbuild/aix-ppc64": "0.20.2",
"@esbuild/android-arm": "0.19.12", "@esbuild/android-arm": "0.20.2",
"@esbuild/android-arm64": "0.19.12", "@esbuild/android-arm64": "0.20.2",
"@esbuild/android-x64": "0.19.12", "@esbuild/android-x64": "0.20.2",
"@esbuild/darwin-arm64": "0.19.12", "@esbuild/darwin-arm64": "0.20.2",
"@esbuild/darwin-x64": "0.19.12", "@esbuild/darwin-x64": "0.20.2",
"@esbuild/freebsd-arm64": "0.19.12", "@esbuild/freebsd-arm64": "0.20.2",
"@esbuild/freebsd-x64": "0.19.12", "@esbuild/freebsd-x64": "0.20.2",
"@esbuild/linux-arm": "0.19.12", "@esbuild/linux-arm": "0.20.2",
"@esbuild/linux-arm64": "0.19.12", "@esbuild/linux-arm64": "0.20.2",
"@esbuild/linux-ia32": "0.19.12", "@esbuild/linux-ia32": "0.20.2",
"@esbuild/linux-loong64": "0.19.12", "@esbuild/linux-loong64": "0.20.2",
"@esbuild/linux-mips64el": "0.19.12", "@esbuild/linux-mips64el": "0.20.2",
"@esbuild/linux-ppc64": "0.19.12", "@esbuild/linux-ppc64": "0.20.2",
"@esbuild/linux-riscv64": "0.19.12", "@esbuild/linux-riscv64": "0.20.2",
"@esbuild/linux-s390x": "0.19.12", "@esbuild/linux-s390x": "0.20.2",
"@esbuild/linux-x64": "0.19.12", "@esbuild/linux-x64": "0.20.2",
"@esbuild/netbsd-x64": "0.19.12", "@esbuild/netbsd-x64": "0.20.2",
"@esbuild/openbsd-x64": "0.19.12", "@esbuild/openbsd-x64": "0.20.2",
"@esbuild/sunos-x64": "0.19.12", "@esbuild/sunos-x64": "0.20.2",
"@esbuild/win32-arm64": "0.19.12", "@esbuild/win32-arm64": "0.20.2",
"@esbuild/win32-ia32": "0.19.12", "@esbuild/win32-ia32": "0.20.2",
"@esbuild/win32-x64": "0.19.12" "@esbuild/win32-x64": "0.20.2"
} }
}, },
"node_modules/escalade": { "node_modules/escalade": {
@@ -2635,9 +2674,9 @@
} }
}, },
"node_modules/postcss": { "node_modules/postcss": {
"version": "8.4.35", "version": "8.4.38",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.35.tgz", "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz",
"integrity": "sha512-u5U8qYpBCpN13BsiEB0CbR1Hhh4Gc0zLFuedrHJKMctHCHAGrMdG0PRM/KErzAL3CU6/eckEtmHNB3x6e3c0vA==", "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==",
"funding": [ "funding": [
{ {
"type": "opencollective", "type": "opencollective",
@@ -2655,7 +2694,7 @@
"dependencies": { "dependencies": {
"nanoid": "^3.3.7", "nanoid": "^3.3.7",
"picocolors": "^1.0.0", "picocolors": "^1.0.0",
"source-map-js": "^1.0.2" "source-map-js": "^1.2.0"
}, },
"engines": { "engines": {
"node": "^10 || ^12 || >=14" "node": "^10 || ^12 || >=14"
@@ -2940,9 +2979,9 @@
} }
}, },
"node_modules/rollup": { "node_modules/rollup": {
"version": "4.12.0", "version": "4.17.2",
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.12.0.tgz", "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.17.2.tgz",
"integrity": "sha512-wz66wn4t1OHIJw3+XU7mJJQV/2NAfw5OAk6G6Hoo3zcvz/XOfQ52Vgi+AN4Uxoxi0KBBwk2g8zPrTDA4btSB/Q==", "integrity": "sha512-/9ClTJPByC0U4zNLowV1tMBe8yMEAxewtR3cUNX5BoEpGH3dQEWpJLr6CLp0fPdYRF/fzVOgvDb1zXuakwF5kQ==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@types/estree": "1.0.5" "@types/estree": "1.0.5"
@@ -2955,19 +2994,22 @@
"npm": ">=8.0.0" "npm": ">=8.0.0"
}, },
"optionalDependencies": { "optionalDependencies": {
"@rollup/rollup-android-arm-eabi": "4.12.0", "@rollup/rollup-android-arm-eabi": "4.17.2",
"@rollup/rollup-android-arm64": "4.12.0", "@rollup/rollup-android-arm64": "4.17.2",
"@rollup/rollup-darwin-arm64": "4.12.0", "@rollup/rollup-darwin-arm64": "4.17.2",
"@rollup/rollup-darwin-x64": "4.12.0", "@rollup/rollup-darwin-x64": "4.17.2",
"@rollup/rollup-linux-arm-gnueabihf": "4.12.0", "@rollup/rollup-linux-arm-gnueabihf": "4.17.2",
"@rollup/rollup-linux-arm64-gnu": "4.12.0", "@rollup/rollup-linux-arm-musleabihf": "4.17.2",
"@rollup/rollup-linux-arm64-musl": "4.12.0", "@rollup/rollup-linux-arm64-gnu": "4.17.2",
"@rollup/rollup-linux-riscv64-gnu": "4.12.0", "@rollup/rollup-linux-arm64-musl": "4.17.2",
"@rollup/rollup-linux-x64-gnu": "4.12.0", "@rollup/rollup-linux-powerpc64le-gnu": "4.17.2",
"@rollup/rollup-linux-x64-musl": "4.12.0", "@rollup/rollup-linux-riscv64-gnu": "4.17.2",
"@rollup/rollup-win32-arm64-msvc": "4.12.0", "@rollup/rollup-linux-s390x-gnu": "4.17.2",
"@rollup/rollup-win32-ia32-msvc": "4.12.0", "@rollup/rollup-linux-x64-gnu": "4.17.2",
"@rollup/rollup-win32-x64-msvc": "4.12.0", "@rollup/rollup-linux-x64-musl": "4.17.2",
"@rollup/rollup-win32-arm64-msvc": "4.17.2",
"@rollup/rollup-win32-ia32-msvc": "4.17.2",
"@rollup/rollup-win32-x64-msvc": "4.17.2",
"fsevents": "~2.3.2" "fsevents": "~2.3.2"
} }
}, },
@@ -3055,9 +3097,9 @@
} }
}, },
"node_modules/source-map-js": { "node_modules/source-map-js": {
"version": "1.0.2", "version": "1.2.0",
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
"integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
"engines": { "engines": {
"node": ">=0.10.0" "node": ">=0.10.0"
} }
@@ -3368,14 +3410,14 @@
"dev": true "dev": true
}, },
"node_modules/vite": { "node_modules/vite": {
"version": "5.1.4", "version": "5.2.11",
"resolved": "https://registry.npmjs.org/vite/-/vite-5.1.4.tgz", "resolved": "https://registry.npmjs.org/vite/-/vite-5.2.11.tgz",
"integrity": "sha512-n+MPqzq+d9nMVTKyewqw6kSt+R3CkvF9QAKY8obiQn8g1fwTscKxyfaYnC632HtBXAQGc1Yjomphwn1dtwGAHg==", "integrity": "sha512-HndV31LWW05i1BLPMUCE1B9E9GFbOu1MbenhS58FuK6owSO5qHm7GiCotrNY1YE5rMeQSFBGmT5ZaLEjFizgiQ==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"esbuild": "^0.19.3", "esbuild": "^0.20.1",
"postcss": "^8.4.35", "postcss": "^8.4.38",
"rollup": "^4.2.0" "rollup": "^4.13.0"
}, },
"bin": { "bin": {
"vite": "bin/vite.js" "vite": "bin/vite.js"

2
package.json
View File

@@ -25,6 +25,6 @@
"eslint-plugin-vue": "^9.22.0", "eslint-plugin-vue": "^9.22.0",
"postcss": "^8.4.35", "postcss": "^8.4.35",
"tailwindcss": "^3.4.1", "tailwindcss": "^3.4.1",
"vite": "^5.0.11" "vite": "^5.2.11"
} }
} }

BIN
public/images/hutopymedia/banners/hutopy.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 27 KiB

After

Width:  |  Height:  |  Size: 64 KiB

BIN
public/images/hutopymedia/homepage/votrehutopy.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 65 KiB

After

Width:  |  Height:  |  Size: 88 KiB

BIN
public/images/hutopymedia/icons/black/arpsblack.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

BIN
public/images/hutopymedia/icons/black/leffetblack.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 56 KiB

BIN
public/images/hutopymedia/icons/black/linkedinblack.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
public/images/hutopymedia/icons/black/tiktokblack.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 17 KiB

BIN
public/images/hutopymedia/icons/black/youtube.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
public/images/hutopymedia/tospage/membersPictures/profileChloe.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 614 KiB

BIN
public/images/hutopymedia/tospage/membersPictures/profileDominique.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 MiB

BIN
public/images/hutopymedia/tospage/membersPictures/profileEdouard.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 711 KiB

BIN
public/images/hutopymedia/tospage/membersPictures/profileMarco.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 508 KiB

BIN
public/images/hutopymedia/tospage/membersPictures/profilePascal.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 554 KiB

BIN
public/images/usersmedia/ARPS/banners/bannerARPS01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 MiB

BIN
public/images/usersmedia/ARPS/profilepictures/profileARPS.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 MiB

BIN
public/images/usersmedia/ARPS/profilepictures/profileARPS.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 MiB

BIN
public/images/usersmedia/HutopyProfile/banners/banner01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 MiB

BIN
public/images/usersmedia/HutopyProfile/pictures/version.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.8 MiB

BIN
public/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

BIN
public/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile02.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 385 KiB

BIN
public/images/usersmedia/chloebeaugrand/banners/bannerChloeBeaugrand01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 MiB

BIN
public/images/usersmedia/chloebeaugrand/pictures/posts/postsChloeBeaugrand01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.7 MiB

BIN
public/images/usersmedia/chloebeaugrand/pictures/posts/postsChloeBeaugrand02.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 494 KiB

BIN
public/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 454 KiB

BIN
public/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 MiB

BIN
public/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand02.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 700 KiB

BIN
public/images/usersmedia/leffet/banners/banner01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 MiB

BIN
public/images/usersmedia/leffet/banners/banner02.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 163 KiB

BIN
public/images/usersmedia/leffet/banners/banner02.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 MiB

BIN
public/images/usersmedia/leffet/profilepictures/leffetProfile01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 206 KiB

BIN
public/images/usersmedia/mathieuCaron/banners/bannerMathieuCaron01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 420 KiB

BIN
public/images/usersmedia/mathieuCaron/profilepictures/profileMathieuCaron01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 MiB

163
src/layouts/DefaultLayout.vue
View File

@@ -1,34 +1,42 @@
<template> <template>
<body style="background-color: #f4f4f4;"> <body style="background-color: #f4f4f4;">
<!-- PC Version --> <!-- PC Version -->
<v-card style="z-index: 1000; background-color: #ffff;" class="hidden-sm-and-down" hidden-sm-and-down elevation="5"> <v-card style="z-index: 1000; background-color: #ffff;" class="hidden-sm-and-down" elevation="5">
<v-container style="z-index: 2000; margin-bottom: .8%; margin-top: -.3%; margin-right: 1%;"> <v-container style="z-index: 2000; margin-bottom: .8%; margin-top: -.3%; margin-right: 1%;">
<v-row justify="end" style="margin-top: .2%; margin-bottom: -1.2%;"> <v-row justify="end" style="margin-top: .2%; margin-bottom: -1.2%;">
<v-menu> <v-menu>
<template v-slot:activator="{ props }"> <template v-slot:activator="{ props }">
<v-row>
<!-- Colonne de droite -->
<v-col class="text-right d-flex align-center justify-end">
<div class="d-flex align-center"> <div class="d-flex align-center">
<!-- Profile picture in the top right corner -->
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png" <img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png"
class="header-profile-icon mr-2" alt="Logo"> class="header-profile-icon mr-2" alt="Logo">
<v-btn flat style="min-width: 200px; font-size: 1.3rem;" dark v-bind="props"> <v-btn flat style="min-width: 200px; font-size: 1.3rem;" dark v-bind="props" ref="walletActivator">
ANONYME {{ currentUserName }}
</v-btn> </v-btn>
</div> </div>
</v-col>
</v-row>
</template> </template>
<!-- Dropdown Menu Profile/Connection --> <!-- Dropdown Menu Profile/Connection -->
<v-list style="padding: 0;"> <v-list style="padding: 0;">
<v-list-item> <v-list-item v-if="!currentUser">
<router-link :to="{ name: 'contact' }"> <router-link :to="{ name: 'contact' }">
<v-btn class="full-width-btn" flat>Inscription</v-btn> <v-btn class="full-width-btn" flat>Inscription</v-btn>
</router-link> </router-link>
</v-list-item> </v-list-item>
<!-- <v-list-item> <v-list-item v-if="currentUser">
<v-btn class="full-width-btn" flat>Mon profil</v-btn> <v-btn @click="openWalletDialog" class="full-width-btn" flat>
</v-list-item>--> <v-icon left class="mr-4">mdi-wallet</v-icon>
<p>Bourse</p>
</v-btn>
</v-list-item>
<v-list-item v-if="currentUser">
<v-btn @click="logout()" class="full-width-btn" flat>Déconnecter</v-btn>
</v-list-item>
</v-list> </v-list>
</v-menu> </v-menu>
</v-row> </v-row>
@@ -36,12 +44,11 @@
</v-card> </v-card>
<!-- Mobile version --> <!-- Mobile version -->
<v-card style="z-index: 9000; background-color: #f4f4f4;" class="hidden-md-and-up" hidden-md-and-up> <v-card style="z-index: 2000; background-color: #f4f4f4;" class="hidden-md-and-up">
<v-app-bar app> <v-app-bar app>
<v-app-bar-nav-icon @click.stop="drawer = !drawer"></v-app-bar-nav-icon> <v-app-bar-nav-icon @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
<v-row> <v-row>
<v-col cols="11" class="d-flex align-center justify-center"> <v-col cols="11" class="d-flex align-center justify-center">
<!-- Logo Top bar --> <!-- Logo Top bar -->
<img src="/images/hutopymedia/banners/hutopy.png" class="mobile-header" alt="Logo"> <img src="/images/hutopymedia/banners/hutopy.png" class="mobile-header" alt="Logo">
</v-col> </v-col>
@@ -51,7 +58,7 @@
<!-- Left-side Menu --> <!-- Left-side Menu -->
<v-navigation-drawer v-model="drawer" temporary> <v-navigation-drawer v-model="drawer" temporary>
<v-list> <v-list>
<v-list-item subtitle="email" title="ANONYME"> <v-list-item :title="currentUserName">
<template v-slot:prepend> <template v-slot:prepend>
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png" <img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png"
class="mobile-profile-picture mini-profile-picture" alt="Avatar"> class="mobile-profile-picture mini-profile-picture" alt="Avatar">
@@ -63,27 +70,115 @@
<v-divider></v-divider> <v-divider></v-divider>
<v-list density="compact" nav> <v-list density="compact" nav>
<h1 class="h1-navigation">Navigation</h1> <h1 class="h1-navigation">Navigation</h1>
<router-link :to="{ name: 'home' }" class=""> <router-link :to="{ name: 'home' }">
<v-list-item prepend-icon="mdi-home" title="Accueil" value="home"></v-list-item> <v-list-item prepend-icon="mdi-home" title="Accueil" value="home"></v-list-item>
</router-link> </router-link>
<RouterLink :to="{ name: 'contact' }"> <router-link :to="{ name: 'userbrowser' }">
<v-list-item prepend-icon="mdi-account-multiple" title="Amis" value="friends"></v-list-item> <v-list-item prepend-icon="mdi-account-multiple" title="Créateurs" value="friends"></v-list-item>
</RouterLink> </router-link>
<!-- <v-list-item prepend-icon="mdi-newspaper" title="Contenu" value="content"></v-list-item>--> <router-link :to="{ name: 'contact' }">
<!-- <v-list-item prepend-icon="mdi-wallet" title="Portefeuille" value="wallet"></v-list-item>--> <v-list-item prepend-icon="mdi-handshake" title="Aidez-nous" value="friends"></v-list-item>
<!-- <v-list-item style="margin-top: 110%;" prepend-icon="mdi-logout" title="Déconnexion" </router-link>
value="logout"></v-list-item>-->
<v-list-item v-if="currentUser" @click="openWalletDialog" prepend-icon="mdi-wallet" title="Bourse"
value="wallet"></v-list-item>
<v-list-item v-if="currentUser" @click="logout()" style="margin-top: 110%;" prepend-icon="mdi-logout"
title="Déconnecter" value="logout"></v-list-item>
</v-list> </v-list>
</v-navigation-drawer> </v-navigation-drawer>
</v-card> </v-card>
<!-- Wallet Modal -->
<v-dialog v-model="walletDialog" transition="dialog-top-transition" width="auto">
<v-card style="border-radius: 30px;">
<div class="text-center" style="margin-top: 2%; margin-bottom: 2%;">
<v-icon left size="48">mdi-wallet</v-icon>
<v-toolbar title="Portefeuille"
style="color: white; width: 750px; background-color: #a30e79; margin-bottom: -6%;"></v-toolbar>
</div>
<v-card-text class="text-h1 pa-12">
<v-row>
<v-col>
<v-row>
<v-col class="text-center">
<h1 style="margin-bottom: -4px; font-size: 1.3rem;">Balance actuelle</h1>
<h1 style=" margin-bottom: -45px; font-size: 3.5rem;">{{ currentUser.totalBalance }}$</h1>
</v-col>
</v-row>
</v-col>
</v-row>
</v-card-text>
<v-data-table-virtual fixed-header :headers="headers" :items="currentUser.userTransactions" height="250"
item-value="name">
</v-data-table-virtual>
<v-dialog activator="#activator-target" max-width="650">
<template v-slot:default="{ isActive }">
<v-card prepend-icon="mdi-file-document-edit" text="Découvrez Hutopy, l'endroit où la valorisation de votre travail atteint son apogée. Avec une commission réduite à seulement 9 %, notre engagement envers votre succès est palpable. Chaque pourcentage prélevé est réinvesti avec soin pour catalyser votre croissance : du développement de fonctionnalités innovantes à la maintenance d'une infrastructure technologique de pointe, en passant par un support utilisateur de premier ordre. Notre objectif ? Amplifier votre expansion et garantir une expérience utilisateur sans précédent.
Pour chaque transaction, un frais minime assure la sécurité et la fiabilité de vos paiements, grâce à un partenaire de confiance à la renommée mondiale. Ce dernier sécurise pour des milliards en transactionchaque année pour une diversité d'entreprises, allant des startups dynamiques aux conglomerats établis. Ce gage de sécurité est disponible pour une modique somme : 2,9 % plus 0,30 $ par transaction, une petite contribution pour la tranquillité d'esprit et la protection de vos revenus.
Notre modèle tarifaire a été pensé dans un esprit de simplicité et de transparence, avec l'ambition ultime d'optimiser vos gains. Chez Hutopy, la notion de partenariat prend tout son sens : votre épanouissement est au cœur de nos préoccupations. Bénéficiez d'une plateforme qui élargit votre horizon créatif et entrepreneurial, tout en vous assurant que vos intérêts sont précieusement gardés.
Hutopy est plus qu'une plateforme ; c'est une communauté où la transformation de la passion en profit devient réalité, grâce au soutien indéfectible d'une équipe dévouée à enrichir votre parcours. Nous vous invitons à nous rejoindre pour explorer ensemble les avenues de succès que nous pouvons emprunter ensemble, tout en vous garantissant une part conséquente de vos revenus. Embarquez dans une aventure où votre présence en ligne ne connaît pas de limites, soutenue par Hutopy, votre allié dans la quête du succès.
" title="Comission">
<template v-slot:actions>
<v-btn class="ml-auto" text="Close" @click="isActive.value = false"></v-btn>
</template>
</v-card>
</template>
</v-dialog>
<v-card-actions class="justify-center">
<v-row justify="center">
<v-btn id="activator-target">
Comisssion
</v-btn>
<v-btn @click="walletDialog = false" text="Fermer"></v-btn>
</v-row>
</v-card-actions>
</v-card>
</v-dialog>
</body> </body>
</template> </template>
<script setup> <script async setup>
import { ref } from 'vue'; import MyUserModel from "@/models/myUserModel.js";
const drawer = ref(false); import { useClient } from "@/plugins/api.js";
</script> import { onBeforeMount, ref } from 'vue';
const client = useClient();
const drawer = ref(false);
const currentUserName = ref("INVITÉ");
const walletDialog = ref(false);
let currentUser = null;
const headers = ref([
{ title: 'Montant', value: 'amount', width: '20%', key: "amount" },
{ title: 'Date', value: 'created', width: '20%', key: "created" },
{ title: 'Message', value: 'tipMessage', width: '60%' }
]);
onBeforeMount(async () => {
try {
const myUser = await client.get("/api/GetMyUser");
const currentUserModel = MyUserModel.createFromApiResult(myUser.data);
currentUser = currentUserModel;
currentUserName.value = currentUserModel.firstName + " " + currentUserModel.lastName;
} catch (error) {
console.log("User not logged");
}
});
function logout() {
localStorage.removeItem('jwt');
window.location.reload();
}
function openWalletDialog() {
walletDialog.value = true;
}
</script>
<style scoped> <style scoped>
.full-width-btn { .full-width-btn {
@@ -107,16 +202,15 @@ const drawer = ref(false);
.mobile-profile-picture { .mobile-profile-picture {
height: 40px; height: 40px;
border-radius: px; border-radius: 50px;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
border: 2px solid #a30e79; border: 2px solid #a30e79;
margin-right: 10px margin-right: 10px;
} }
.header-banner { .header-banner {
border-top: 5px solid rgba(107, 0, 101, 1); border-top: 5px solid rgba(107, 0, 101, 1);
margin-top: 15%; margin-top: 15%;
} }
.social-container { .social-container {
@@ -132,12 +226,21 @@ const drawer = ref(false);
font-size: 1.4rem; font-size: 1.4rem;
font-weight: 800; font-weight: 800;
color: white; color: white;
min-width: 400px;
} }
.mobile-header { .mobile-header {
height: 50px; height: 50px;
width: auto;
border-radius: 10px;
}
.mobile-navigation-container {
background-color: #a30e79;
}
.h1-navigation {
padding-left: 20%;
font-size: 1.4rem;
font-weight: 800;
} }
</style> </style>

11
src/layouts/FooterLayout.vue
View File

@@ -35,9 +35,10 @@
<!-- Need X Account --> <!-- Need X Account -->
<v-col cols="auto"> <v-col cols="auto">
<router-link :to="{ name: 'home' }"> <a href="https://twitter.com/Hutopyinc">
<img src="/images/hutopymedia/icons/pink/xpink.png" alt="Description image 1" class="icons"> <img src="/images/hutopymedia/icons/pink/xpink.png" alt="Description image 1" class="icons">
</router-link> </a>
</v-col> </v-col>
</v-row> </v-row>
</v-container> </v-container>
@@ -68,7 +69,8 @@ const links = [
'Guide pour les créateurs', 'Guide pour les créateurs',
'Conditions générales', 'Conditions générales',
'Politique de Contenu', 'Politique de Contenu',
'À Propos' 'À Propos',
'Transactions'
]; ];
const linkRoutes = { const linkRoutes = {
@@ -77,7 +79,8 @@ const linkRoutes = {
'Guide pour les créateurs': { name: 'guideforcreators' }, 'Guide pour les créateurs': { name: 'guideforcreators' },
'Conditions générales': { name: 'termsandconditions' }, 'Conditions générales': { name: 'termsandconditions' },
'Politique de Contenu': { name: 'contentpolicy' }, 'Politique de Contenu': { name: 'contentpolicy' },
'À Propos': { name: 'about' } 'À Propos': { name: 'about' },
'Transactions': { name: 'transactions' }
}; };
// If broken link, redirect to home page. // If broken link, redirect to home page.

160
src/layouts/PostContentMenu.vue Normal file
View File

@@ -0,0 +1,160 @@
<template>
<v-col cols="12">
<v-container>
<v-card style="border-radius: 30px" elevation="10">
<v-card-text>
<v-row>
<!-- Boutons de sélection -->
<v-col cols="2" class="d-flex justify-center align-center toolbar-btn">
<v-btn elevation="0" icon @click="selectType('title')">
<v-icon>mdi-format-title</v-icon>
</v-btn>
</v-col>
<v-col cols="2" class="d-flex justify-center align-center toolbar-btn">
<v-btn elevation="0" icon @click="selectType('text')">
<v-icon>mdi-text</v-icon>
</v-btn>
</v-col>
<v-col cols="2" class="d-flex justify-center align-center toolbar-btn">
<v-btn elevation="0" icon @click="selectType('image')">
<v-icon>mdi-image</v-icon>
</v-btn>
</v-col>
<v-col cols="2" class="d-flex justify-center align-center toolbar-btn">
<v-btn elevation="0" icon @click="selectType('video')">
<v-icon>mdi-video</v-icon>
</v-btn>
</v-col>
<v-col cols="2" class="d-flex justify-center align-center toolbar-btn">
<v-btn elevation="0" icon @click="selectType('audio')">
<v-icon>mdi-volume-high</v-icon>
</v-btn>
</v-col>
<v-col cols="2" class="d-flex justify-center align-center toolbar-btn">
<v-btn elevation="0" icon @click="selectType('comments')">
<v-icon>mdi-comment</v-icon>
</v-btn>
</v-col>
</v-row>
</v-card-text>
<!-- Affichage du contenu en fonction du type sélectionné -->
<v-card-text>
<v-row v-for="(content, index) in contents" :key="index" class="draggable-row"
@dragstart="dragStart(index)" @dragover.prevent @drop="drop(index)" draggable="true">
<v-col cols="10">
<template v-if="content.type === 'title'">
<v-text-field v-model="content.value" label="Titre"></v-text-field>
</template>
<template v-else-if="content.type === 'text'">
<v-textarea v-model="content.value" label="Texte"></v-textarea>
</template>
<template v-else-if="content.type === 'image'">
<v-row>
<v-col cols="12">
<v-file-input v-model="content.value" label="Image"></v-file-input>
</v-col>
</v-row>
</template>
<template v-else-if="content.type === 'video'">
<v-text-field v-model="content.value" label="URL de la vidéo"></v-text-field>
</template>
<template v-else-if="content.type === 'audio'">
<v-row>
<v-col cols="2">
<v-icon>mdi-volume-high</v-icon>
</v-col>
<v-col cols="10">
<v-file-input v-model="content.value" label="Audio"></v-file-input>
</v-col>
</v-row>
</template>
<template v-else-if="content.type === 'comments'">
<v-text-field v-model="content.value" label="Commentaires"></v-text-field>
</template>
</v-col>
<v-col cols="2" class="d-flex justify-center align-center">
<v-btn icon @click="removeContent(index)" class="remove-button">
<v-icon>mdi-close</v-icon>
</v-btn>
</v-col>
</v-row>
</v-card-text>
<!-- Boutons Post, Preview et Cancel -->
<v-row v-if="contents.length > 0" justify="end" style="margin-bottom: 10px;">
<v-col class="d-flex justify-end" style="margin-right: 4%;">
<v-btn style="margin-right: 15px;" @click="postContent" color="white" dark
elevation="4">Post</v-btn>
<v-btn style="margin-right: 15px;" @click="previewContent" color="white" dark
elevation="5">Preview</v-btn>
<v-btn @click="cancelPost" color="white" dark elevation="5">Cancel</v-btn>
</v-col>
</v-row>
</v-card>
</v-container>
</v-col>
</template>
<script setup>
import { ref } from 'vue';
const contents = ref([]);
let dragIndex = null;
const selectType = (type) => {
console.log("Type sélectionné:", type);
contents.value.push({ type: type, value: '' });
};
const removeContent = (index) => {
contents.value.splice(index, 1);
};
const postContent = () => {
// Implémenter la logique pour poster le contenu
};
const previewContent = () => {
// Implémenter la logique pour prévisualiser le contenu
};
const cancelPost = () => {
if (contents.value.length > 0) {
// Réinitialiser le tableau contents pour supprimer tous les contenus
contents.value = [];
}
};
const dragStart = (index) => {
dragIndex = index;
};
const drop = (index) => {
if (dragIndex !== null && index !== null) {
const draggedItem = contents.value[dragIndex];
contents.value.splice(dragIndex, 1);
contents.value.splice(index, 0, draggedItem);
dragIndex = null;
}
};
</script>
<style scoped>
.remove-button {
display: flex;
justify-content: center;
align-items: center;
margin-top: -20%;
}
.toolbar-btn {
margin-top: 10px;
margin-bottom: -15px;
}
.draggable-row {
cursor: grab;
}
</style>

0
src/layouts/postcomponents/postimagecomponents Normal file
View File

24
src/models/myUserModel.js Normal file
View File

@@ -0,0 +1,24 @@
import UserTransactionsModel from "@/models/userTransactionsModel.js";
export default class MyUserModel
{
id = "";
firstName = "";
lastName = "";
userName = "";
totalBalance = "";
userTransactions = [];
static createFromApiResult(apiResult){
const userModel = Object.assign(new MyUserModel(), apiResult);
const notMapperTransaction = Object.freeze(userModel.userTransactions);
userModel.userTransactions = [];
for (const transaction of notMapperTransaction) {
userModel.userTransactions.push(UserTransactionsModel.createFromApiResult(transaction))
}
return userModel;
}
}

23
src/models/userTransactionsModel.js Normal file
View File

@@ -0,0 +1,23 @@
export default class UserTransactionsModel
{
amount = "";
currency = "";
tipMessage = "";
created = "";
static createFromApiResult(apiResult){
const userTransactionModel = Object.assign(new UserTransactionsModel(), apiResult)
const date = new Date(userTransactionModel.created);
const options = {
year: 'numeric',
month: 'long',
day: 'numeric',
timeZone: 'America/Montreal'
};
userTransactionModel.created = new Intl.DateTimeFormat('fr-CA', options).format(date);
return userTransactionModel;
}
}

69
src/router/index.js
View File

@@ -1,18 +1,25 @@
import ARPS from '@/views/manualusers/ARPS.vue'
import GuillaumeAime from '@/views/manualusers/GuillaumeAime.vue'
import About from '@/views/tos/About.vue' import About from '@/views/tos/About.vue'
import ContentPolicy from '@/views/tos/ContentPolicy.vue' import ContentPolicy from '@/views/tos/ContentPolicy.vue'
import FAQ from '@/views/tos/FAQ.vue' import FAQ from '@/views/tos/FAQ.vue'
import GuideForCreators from '@/views/tos/GuideForCreators.vue' import GuideForCreators from '@/views/tos/GuideForCreators.vue'
import HelpAndContact from '@/views/tos/HelpAndContact.vue' import HelpAndContact from '@/views/tos/HelpAndContact.vue'
import TermsAndConditions from '@/views/tos/TermsAndConditions.vue' import TermsAndConditions from '@/views/tos/TermsAndConditions.vue'
import Transactions from '@/views/tos/Transactions.vue'
import { createRouter, createWebHistory } from 'vue-router' import { createRouter, createWebHistory } from 'vue-router'
import LoginView from '../views/LoginView.vue' import LoginView from '../views/LoginView.vue'
import PaymentCompleted from '../views/PayementCompleted.vue'
import SignupView from '../views/SignupView.vue' import SignupView from '../views/SignupView.vue'
import UserBrowser from '../views/UsersBrowser.vue'
import ContactView from '../views/main/ContactView.vue' import ContactView from '../views/main/ContactView.vue'
import CreatorFolio from '../views/main/CreatorFolio.vue' import CreatorFolio from '../views/main/CreatorFolio.vue'
import PaymentCompleted from '../views/PayementCompleted.vue'
import HomeView from '../views/main/HomeView.vue' import HomeView from '../views/main/HomeView.vue'
import YourProfile from '../views/main/YourProfile.vue' import YourProfile from '../views/main/YourProfile.vue'
import ChloeBeaugrand from '../views/manualusers/ChloeProfile.vue'
import Hutopy from '../views/manualusers/HutopyProfile.vue'
import Leffet from '../views/manualusers/LeffetProfile.vue'
import MathieuCaron from '../views/manualusers/MathieuCaron.vue'
const router = createRouter({ const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL), history: createWebHistory(import.meta.env.BASE_URL),
@@ -23,7 +30,7 @@ const router = createRouter({
component: HomeView component: HomeView
}, },
{ {
path: '/guillaumeaime', path: '/creatorfolio',
name: 'creatorfolio', name: 'creatorfolio',
component: CreatorFolio component: CreatorFolio
}, },
@@ -89,6 +96,62 @@ const router = createRouter({
name: 'about', name: 'about',
component: About component: About
}, },
{
path: '/transactions',
name: 'transactions',
component: Transactions
},
{
path: '/Hutopy',
name: 'Hutopy',
component: Hutopy
},
{
path: '/Leffet',
name: 'Leffet',
component: Leffet
},
{
path: '/userbrowser',
name: 'userbrowser',
component: UserBrowser
},
{
path: '/chloebeaugrand',
name: 'chloebeaugrand',
component: ChloeBeaugrand
},
{
path: '/guillaumeaime',
name: 'guillaumeaime',
component: GuillaumeAime
},
{
path: '/mathieucaron',
name: 'mathieucaron',
component: MathieuCaron
},
{
path: '/arps',
name: 'arps',
component: ARPS
},
{
path: '/guillaumeaime',
name: 'guillaumeaime',
component: GuillaumeAime
},
], ],
scrollBehavior(to, from, savedPosition) { scrollBehavior(to, from, savedPosition) {
return { top: 0 }; return { top: 0 };

6
src/views/LoginView.vue
View File

@@ -24,12 +24,12 @@
<v-card-text> <v-card-text>
<v-form class="label-mail-password"> <v-form class="label-mail-password">
<v-text-field prepend-icon="mdi-email" type="text" v-model="user.email" <v-text-field prepend-icon="mdi-email" type="text" v-model="user.email"
label="E-mail" class="text-start"></v-text-field> label="Nom d'utilisateur" class="text-start"></v-text-field>
<v-text-field prepend-icon="mdi-lock" type="password" v-model="user.password" <v-text-field prepend-icon="mdi-lock" type="password" v-model="user.password"
label="Mot de passe" class="text-start"></v-text-field> label="Mot de passe" class="text-start"></v-text-field>
</v-form> </v-form>
<v-snackbar v-model="errorSnackBar"> <v-snackbar v-model="errorSnackBar">
Email ou mot de passe invalide. Nom d'utilisateur ou mot de passe invalide.
<template v-slot:actions> <template v-slot:actions>
<v-btn color="red" variant="text" @click="errorSnackBar = false">Fermer</v-btn> <v-btn color="red" variant="text" @click="errorSnackBar = false">Fermer</v-btn>
</template> </template>
@@ -68,7 +68,7 @@
vous connecter à votre compte?</h2> vous connecter à votre compte?</h2>
<v-form style="max-width: 400px; width: 350px;"> <v-form style="max-width: 400px; width: 350px;">
<v-text-field prepend-icon="mdi-email" type="text" v-model="user.email" label="E-mail"></v-text-field> <v-text-field prepend-icon="mdi-email" type="text" v-model="user.email" label="Nom d'utilisateur"></v-text-field>
<v-text-field prepend-icon="mdi-lock" type="password" v-model="user.password" <v-text-field prepend-icon="mdi-lock" type="password" v-model="user.password"
label="Mot de passe"></v-text-field> label="Mot de passe"></v-text-field>
</v-form> </v-form>

107
src/views/PayementCompleted.vue
View File

@@ -1,44 +1,113 @@
<script setup>
</script>
<template> <template>
<v-card class="custom-dialog" style="background-color: #f4f4f4;">
<body style="background-color: #f4f4f4;">
<DefaultLayout></DefaultLayout>
<v-container> <v-container>
<div class="margin-top-mobile">
<v-row style="margin-top: 4%; margin-bottom: 2%" class="d-flex justify-center align-center">
<v-col cols="12" xxl="4" xl="4" lg="5" md="7" sm="9"> <v-card class="custom-dialog"
style="background-color: white;">
<v-container>
<!-- Title Card -->
<v-card-text style="font-weight: 600; margin-top: 20px; margin-bottom: 20px; font-size: 2rem;"
class="text-center">
Paiement complété
</v-card-text>
<v-row justify="center"> <v-row justify="center">
<!-- Icon Check --> <!-- Icon Check -->
<v-col cols="12" class="text-center"> <v-col cols="12" class="text-center">
<v-icon color=#a30e79 size="250">mdi-check-circle</v-icon> <v-icon color=#a30e79 size="150">mdi-check-circle</v-icon>
</v-col> </v-col>
</v-row> </v-row>
<!-- Informations --> <!-- Informations -->
<v-row justify="center"> <v-row justify="center">
<v-col cols="12"> <v-col cols="12">
<v-card-text style="font-weight: 600;">
Paiement complété
</v-card-text>
<v-card-text style="margin-top: -24px;">
Transaction : #
</v-card-text>
<v-card-text style="font-size: 1.2rem; text-align: center;"> <v-card-text style="font-size: 1.2rem; text-align: center;">
Merci de supporter Merci de supporter
</v-card-text> </v-card-text>
<v-card-text style="font-weight: 600; font-size: 1.6rem; text-align: center;"> <v-card-text style="font-weight: 600; font-size: 1.6rem; text-align: center; margin-bottom: 10px;">
Guillaume Mousseau {{ creatorName }}
</v-card-text> </v-card-text>
</v-col> </v-col>
</v-row> </v-row>
<!-- Ok btn --> <!-- Ok btn -->
<v-row> <v-row>
<v-row style="margin-left: 30px; margin-right: 30px; margin-bottom: 10px;">
<v-text-field variant="underlined" style=" margin-right: 10px;" v-model="email"
label="Email"></v-text-field>
<v-btn color="#6b0065" variant="outlined" style="margin-top: 10px;" @click="getReceipt">Reçu</v-btn>
</v-row>
<v-col cols="12"> <v-col cols="12">
<v-card-actions class="justify-end">
<v-btn @click="this.$router.push({path: '/guillaumeaime'})">Ok</v-btn> <v-card-actions class="justify-center">
<v-btn color="white" outlined elevation="2"
style="font-size: 2rem; width: 175px; height: 45px; margin-bottom: 25px; background-color: #a30e79;"
@click="router.push({ path: `/${creatorUserName}` })">Ok</v-btn>
</v-card-actions> </v-card-actions>
</v-col> </v-col>
</v-row> </v-row>
</v-container> </v-container>
</v-card> </v-card>
</v-col>
</v-row>
</div>
<v-snackbar v-model="errorSnackBar">
Aucun reçu trouvé pour ce email.
<template v-slot:actions>
<v-btn color="red" variant="text" @click="errorSnackBar = false">Fermer</v-btn>
</template> </template>
</v-snackbar>
</v-container>
<FooterLayout></FooterLayout>
</body>
</template>
<script async setup>
import DefaultLayout from '@/layouts/DefaultLayout.vue';
import FooterLayout from '@/layouts/FooterLayout.vue';
import { useClient } from '@/plugins/api.js';
import { onBeforeMount, ref } from 'vue';
import { useRouter } from 'vue-router';
const router = useRouter()
const client = useClient();
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const creatorId = urlParams.get('creatorId')
const creatorName = ref("");
const creatorUserName = ref("");
const email = ref("");
const errorSnackBar = ref(false);
onBeforeMount(async () => {
const creatorResponse = await client.get(`/api/Users?UserId=${creatorId}`);
creatorName.value = creatorResponse.data.firstName + " " + creatorResponse.data.lastName;
creatorUserName.value = creatorResponse.data.userName;
})
async function getReceipt() {
const receiptResponse = await client.get(`/api/Stripe/GetMyLastReceipt?CreatorId=${creatorId}&Email=${email.value}`);
const receiptUrl = receiptResponse.data.receiptUrl;
if (receiptUrl === "") {
errorSnackBar.value = true;
return;
}
window.open(receiptUrl);
}
</script>
<style scoped>
@media (min-width: 200px) and (max-width: 960px) {
.margin-top-mobile {
margin-top: 60px;
}
}
</style>

12
src/views/StripePayment.vue
View File

@@ -2,12 +2,11 @@
<v-container> <v-container>
<v-row> <v-row>
<v-text-field label="Message" v-model="tipMessage" <v-text-field label="Message (facultatif)" v-model="tipMessage"
style="border-radius: 10px; margin-top: 10px; margin-bottom: 10px; color: #a30e79; background-color: #f4f4f4"> style="border-radius: 10px; margin-top: 10px; margin-bottom: 10px; color: #a30e79; background-color: #f4f4f4">
</v-text-field> </v-text-field>
</v-row> </v-row>
<v-row> <v-row>
<v-text-field label="Montant ($)" v-model="price" <v-text-field label="Montant ($)" v-model="price"
style="border-radius: 10px; margin-bottom: 10px; color: #a30e79; background-color: #f4f4f4"> style="border-radius: 10px; margin-bottom: 10px; color: #a30e79; background-color: #f4f4f4">
@@ -24,7 +23,6 @@
</v-btn> </v-btn>
</v-row> </v-row>
<v-dialog v-model="isPaymentDialogActive" max-width="720" persistent> <v-dialog v-model="isPaymentDialogActive" max-width="720" persistent>
<template v-slot:default> <template v-slot:default>
<v-card> <v-card>
@@ -40,10 +38,6 @@
</v-dialog> </v-dialog>
</v-container> </v-container>
</template> </template>
<script setup> <script setup>
@@ -51,6 +45,8 @@ import { useClient } from '@/plugins/api.js';
import { loadStripe } from '@stripe/stripe-js'; import { loadStripe } from '@stripe/stripe-js';
import { onMounted, ref } from "vue"; import { onMounted, ref } from "vue";
const props = defineProps(['creatorId'])
let stripe = null; let stripe = null;
const client = useClient(); const client = useClient();
const price = ref(0); const price = ref(0);
@@ -72,7 +68,7 @@ async function createCheckoutSession() {
let clientSecret = await client.post('/api/Stripe', { let clientSecret = await client.post('/api/Stripe', {
amount: (price.value * 100), amount: (price.value * 100),
tipMessage: tipMessage.value, tipMessage: tipMessage.value,
creatorId: "5b122430-442a-4967-98b6-6c7787c70c91" creatorId: props.creatorId
}); });
let secret = clientSecret["data"]; let secret = clientSecret["data"];

883
src/views/UsersBrowser.vue Normal file
View File

@@ -0,0 +1,883 @@
<template>
<div style="background-color: #f4f4f4;">
<DefaultLayout style="margin-bottom: 30px"></DefaultLayout>
<!-- "Mobile -->
<v-row class="fluid hidden-md-and-up social-mobile-container"
style="margin-top: -10px; position: relative; z-index: 0; " hidden-md-and-down>
<v-col cols="12" class="pa-0" style="width: 100vw; overflow: hidden;">
<v-img class="profile-banner" max-height="375" :src="imageSrc" cover
style="box-shadow: 0 4px 6px rgba(0, 0, 0, 0.8);"></v-img>
</v-col>
</v-row>
<!-- "PurpleLine" -->
<v-row style="background-color: #6b0065; height: 5px; box-shadow: rgba(0, 0, 0, 0.7);">
</v-row>
<!-- "Mobile-Profile" -->
<!-- "Profile picture" -->
<v-row class="d-flex justify-center align-center d-sm-none" style="margin-top: 50px; margin-bottom: -10px">
<v-img :src="profilePicture" class="elevation-4 mobile-profile-picture-creator"></v-img>
</v-row>
<!-- User Social Network Links -->
<v-container style="margin-top: -70px; padding: 0;" class="hidden-md-and-up social-container-mobile-icons"
hidden-md-and-down>
<!-- Facebook -->
<v-row no-gutters class="d-flex justify-space-between align-center"
style="margin-left: 3%; margin-right: 3%;">
<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.facebook.com/Hutopy">
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/facebookblack.png"
alt="Facebook"></v-img>
</a>
</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/hutopy.inc/">
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/instagramblack.png"
alt="Instagram"></v-img>
</a>
</v-col>
<!-- Profile picture - Small -->
<v-col cols="4" sm="4" xs="0" class="hidden-xs">
<v-row class="d-flex justify-center align-center">
<v-img :src="profilePicture" class="elevation-4 mobile-profile-picture-creator"></v-img>
</v-row>
</v-col>
<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://twitter.com/Hutopyinc">
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/xblack.png"
alt="X"></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 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 class="d-flex justify-center">
{{ title }}
</v-row>
</v-col>
</v-row>
<v-row>
<v-container
style="border-bottom-left-radius: 15px; margin-top: -12px; border-bottom-right-radius: 15px;"
class="social-icon-group-mobile">
<v-expansion-panels style="min-width: 320px;">
<v-col cols="12" offset="-1">
<v-expansion-panel class="background-pink text-justify" style="color: white;"
text="Notre mission chez Hutopy est d'aider les gens à s'épanouir en leur proposant un environnement de partage unique qui va leur permettre de se surpasser. Nous travaillons étroitement avec la communauté d'Hutopy afin de concentrer notre développement sur ce que vous demandez et sur vos besoins, afin d'offrir les meilleurs outils. Le tout en gardant à l'esprit l'aspect humain de chacun. Il est important pour nous de contribuer à créer un monde meilleur."
title="À propos d'Hutopy :">
</v-expansion-panel>
</v-col>
</v-expansion-panels>
</v-container>
</v-row>
</v-container>
<!-- Bannière Pc -->
<v-row class="fluid hidden-sm-and-down" style="margin-top: -65px; position: relative; z-index: 0; "
hidden-sm-and-up>
<v-col cols="12" class="pa-0" style="width: 100vw; overflow: hidden;">
<v-img class="profile-banner" max-height="375" :src="imageSrc" cover
style="box-shadow: 0 4px 6px rgba(0, 0, 0, 0.8);"></v-img>
</v-col>
</v-row>
<v-row class="hidden-sm-and-down"
style="background-color: #6b0065; height: 5px; box-shadow: rgba(0, 0, 0, 0.7);" hidden-sm-and-up>
</v-row>
<!-- "Core (Menu / Center / Donation)" -->
<v-row>
<!-- "Menu" -->
<v-col cols="2" md="3" lg="3" xl="3" xxl="2" class="hidden-sm-and-down menu-col" hidden-sm-and-down>
<v-col style="margin: 0;">
<v-row class="Hutopy-menu-sticky-mobile">
<v-spacer></v-spacer>
<v-col>
<v-container style=" overflow-y: hidden;">
<!-- Nav-Btn -->
<v-col cols="12" class="px-0">
<v-img src="/images/hutopymedia/banners/hutopy.png" alt="Description de l'image"
style="height: 150px; width: 300px;" class="mx-auto" :elevation="10"></v-img>
<v-list dense class="main-background">
<v-list-item v-for="item in navigationItems" :key="item.link">
<router-link :to="item.link">
<v-btn text class="d-flex align-start align-center main-background"
elevation="0" outlined="false">
<v-icon left class="mr-4">{{ item.icon }}</v-icon>
{{ item.text }}
</v-btn>
</router-link>
</v-list-item>
</v-list>
</v-col>
</v-container>
</v-col>
</v-row>
<v-row style="height: 400px;"></v-row>
</v-col>
</v-col>
<!-- creators -->
<v-col class="middle-col" style="z-index: 5;" cols="12" xs="12" sm="12" md="6" lg="6" xl="6" xxl="8">
<v-container fluid style="margin-bottom: -40px; font-size: 3rem;">
<v-row justify="center" class="text-center">
<v-row justify="center">
<v-col cols="12" class="text-left d-flex justify-center ">
<div class="headline font-weight-bold">CRÉATEURS</div>
</v-col>
</v-row>
</v-row>
</v-container>
<v-container>
<v-row justify="center">
<v-col cols="12">
<v-container class="mt-10">
<v-row justify="center">
<router-link v-for="(profile, index) in profiles" :key="index"
:to="profile.routerLink" class="text-decoration-none">
<v-col>
<v-card class="mb-4 card-equal-width"
style="max-width: 250px; height: 300px;">
<v-img :src="profile.imageUrl" height="200px" width="300px"
style="margin-top: 10px;"></v-img>
<v-card-title style="font-weight: 600;" class="text-center">{{
profile.name
}}</v-card-title>
<v-card-text class="text-center">{{ profile.description }}</v-card-text>
</v-card>
</v-col>
</router-link>
</v-row>
</v-container>
</v-col>
</v-row>
</v-container>
</v-col>
<!-- "Large-Monitor-RightCol" Donation -->
<v-col cols="2" md="3" lg="3" xl="2" xxl="2" class="hidden-sm-and-down" hidden-sm-and-up>
<v-row>
<v-col>
<v-container class="sticky-bottom-label Je-soutien-container"
style="max-width: 400px ; bottom: 0;">
<!-- Donnation -->
<v-card style="border-radius: 20px;">
<v-container>
<v-row class="mb-0"
style="background-color: #6b0065; margin-left: -24px; margin-right: -24px; margin-top: -20px; justify-content: center;">
<v-card-title class="text-soutiens" style="margin-top: 15px;">
JE SOUTIENS!
</v-card-title>
</v-row>
<StripePayment creator-id="3c4317c6-af4d-475a-a382-6d0a675cc67f"></StripePayment>
</v-container>
</v-card>
</v-container>
<v-container style="height: 400px;">
</v-container>
</v-col>
<v-spacer>
</v-spacer>
</v-row>
</v-col>
</v-row>
<!-- "Mobile" Donation -->
<v-col class="hidden-md-and-up sticky-bottom-label" hidden-sm-and-down
style="background-color: #6b0065; margin-top: 30px; text-align: center;">
<!-- Barre cliquable pour ouvrir le drawer -->
<v-btn @click="drawerbottom = !drawerbottom" elevation="0"
style="background-color: #6b0065; color: white; text-align: center;" class="text-soutiens ">
JE SOUTIENS
</v-btn>
</v-col>
<!-- Drawer du bas -->
<template>
<div>
<v-bottom-sheet v-model="drawerbottom" class="sticky-bottom-label" hide-overlay>
<v-container style="background-color: #6b0065; color: white; padding: 20px; text-align: center;">
<h1 class="text-soutiens">JE SOUTIENS</h1>
<StripePayment creator-id="3c4317c6-af4d-475a-a382-6d0a675cc67f"></StripePayment>
</v-container>
</v-bottom-sheet>
</div>
</template>
<FooterLayout></FooterLayout>
</div>
</template>
<script setup>
import DefaultLayout from '@/layouts/DefaultLayout.vue';
import FooterLayout from '@/layouts/FooterLayout.vue';
import { ref } from 'vue';
import StripePayment from './StripePayment.vue';
let imageSrc = '/images/usersmedia/HutopyProfile/banners/banner01.png';
let profilePicture = '/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile01.png';
let name = 'Hutopy'
let title = 'Page officiel'
let drawerbottom = ref(false)
let navigationItems = [
{ icon: 'mdi-home', text: 'Accueil', link: 'home' },
{ icon: 'mdi-account-group', text: 'Créateurs', link: '/userbrowser' },
{ icon: 'mdi-handshake', text: 'Aidez-nous', link: '/contact' },
];
const profiles = ref([
{
id: 1,
name: "Hutopy",
description: "Page officielle",
imageUrl: '/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile01.png',
routerLink: 'Hutopy'
},
{
id: 2,
name: "L'effet",
description: "Fondation",
imageUrl: '/images/usersmedia/leffet/profilepictures/leffetProfile01.png',
routerLink: 'leffet'
},
{
id: 3,
name: "Guillaume M",
description: "Créateur de contenus",
imageUrl: '/images/usersmedia/guillaumeMousseau/profilepictures/profileGuillaumeMousseau01.png',
routerLink: 'guillaumeaime'
},
{
id: 4,
name: "Chloé Beaugrand",
description: "Spécialiste en médias sociaux",
imageUrl: '/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand01.png',
routerLink: 'chloebeaugrand'
},
{
id: 5,
name: "Mathieu Caron",
description: "Entrevue Atypique",
imageUrl: '/images/usersmedia/mathieuCaron/profilepictures/profileMathieuCaron01.png',
routerLink: 'mathieuCaron'
},
{
id: 6,
name: "ARPS",
description: "Agence créative",
imageUrl: '/images/usersmedia/ARPS/profilepictures/profileARPS.png',
routerLink: 'ARPS'
}
]);
</script>
<style scoped>
.invert-color {
filter: invert(1);
}
.Hutopy-menu-sticky-mobile {
position: sticky;
top: 0;
bottom: 0;
left: 0;
width: 100%;
z-index: 1000;
margin-top: -40px;
}
.sticky-bottom-label {
position: sticky;
top: 0;
bottom: 0;
left: 0;
width: 100%;
z-index: 1000;
margin-top: 20px;
}
.sticky-top-label {
position: sticky;
bottom: 0;
right: 10%;
width: 100%;
z-index: 1000;
}
.text-soutiens {
margin-bottom: 15px;
color: white;
font-size: 1.5rem;
letter-spacing: 7px;
text-align: center;
}
.name-info {
margin-top: -10px;
margin-left: 15%;
}
.occupation-info {
margin-left: 15%;
font-size: large;
}
.name-info-mobile {
margin-left: 22px;
font-size: 1.3rem
}
.main-background {
background-color: #f4f4f4;
}
.profile-container {
margin-top: -16%;
}
.btn-custom {
width: 100%;
background-color: transparent;
}
.background-profile-container {
background-color: #ececec;
color: white;
border-top: 3px solid #a30e79;
border-right: 3px solid #a30e79;
font-weight: 700;
font-size: 1.15rem;
border-radius: 25px;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3)
}
.background-pink {
background-color: #23393b;
color: white;
font-weight: 400;
}
.label-text {
font-weight: 400;
margin-left: 3%;
font-size: 1rem;
}
.profile-name {
margin-top: -15%;
}
.socialicons {
width: 35px;
max-width: 100px;
margin-top: 3px;
margin-left: 40px;
}
.socialicons-mobile {
width: 35px;
max-width: 100px;
margin-top: 27px;
margin-left: 20px;
}
.youtube-card {
margin-left: 2%;
margin-right: 2%;
border-radius: 15px;
background-color: #f4f4f4;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4)
}
.card-title {
font-size: 1.4rem;
margin-top: 10px;
}
.card-date {
margin-left: 10px;
margin-top: -18px;
margin-bottom: -20px;
font-size: .8rem;
}
.social-container {
background-color: #6b0065;
border-top-right-radius: 30px;
border-bottom-right-radius: 30px;
font-size: 1.7rem;
font-weight: 600;
color: white;
}
.social-container2 {
background-color: #a30e79;
border-bottom-right-radius: 30px;
font-size: 1.4rem;
font-weight: 500;
color: white;
}
.social-container-mobile {
background-color: #a30e79;
font-size: 1.4rem;
font-weight: 600;
color: white;
z-index: 1000;
margin: auto;
text-align: center;
}
.social-container2-mobile {
background-color: #0baab2;
z-index: 1000;
font-size: 1.2rem;
font-weight: 500;
color: white;
}
.social-icon-group-mobile {
background-color: #6b0065;
}
.mini-profile-picture {
border-radius: 100px;
}
.btn-card-options {
background-color: #f4f4f4;
width: 50px;
margin-left: -12px;
margin-top: 10px;
}
.mobile-profile-picture-creator {
border-radius: 100px;
height: 150px;
width: 150px;
border-radius: 50%;
max-width: 150px;
border: 4px solid white;
z-index: 1000;
}
.mobile-header {
height: 50px;
margin-left: -13%;
margin-top: 6%;
}
.h1-navigation {
text-align: center;
font-weight: 600;
margin-bottom: 10%;
}
.mobile-profile-picture {
height: 40px;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
border: 2px solid #a30e79;
margin-right: 10px
}
.profile-banner {
margin-top: 25px;
min-height: 200px
}
.v-navigation-drawer {
max-height: 100vh;
}
@media (min-width: 150px) and (max-width: 474px) {
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(-30%) translateX(0%);
}
.socialicons-mobile {
width: 35px;
max-width: 100px;
margin-top: 0px;
margin-left: 20px;
}
}
@media (min-width: 475px) and (max-width: 599px) {
.socialicons-mobile {
width: 35px;
max-width: 100px;
margin-top: 0px;
margin-left: px;
}
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(-30%) translateX(0%);
}
.profile-container-mobile {
width: 110%;
margin-left: -3%;
margin-top: -112px;
}
.occupation-info {
font-size: 1rem;
}
.card-youtube {
min-height: 250px;
}
.name-info-mobile {
font-size: 1.6rem;
}
}
@media (min-width: 599px) and (max-width: 749px) {
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(25%) translateX(0%);
}
.profile-container {
width: 110%;
margin-left: -3%;
}
.profile-container-mobile {
width: 110%;
margin-left: -3%;
margin-top: -110px;
}
.name-info {
font-size: 1.2rem;
}
.occupation-info {
font-size: 1rem;
}
.card-youtube {
min-height: 330px;
}
}
@media (min-width: 750px) and (max-width: 960px) {
.mobile-profile-picture-creator {
transform: scale(1.8) translateY(25%) translateX(0%);
}
.profile-container {
width: 110%;
margin-left: -3%;
}
.profile-container-mobile {
width: 110%;
margin-left: -3%;
margin-top: -110px;
}
.name-info {
font-size: 1.2rem;
}
.occupation-info {
font-size: 1rem;
}
.card-youtube {
min-height: 425px;
}
}
@media (min-width: 960px) and (max-width: 1280px) {
.middle-col {
margin-left: -30px;
}
.text-soutiens {
font-size: 1.2rem;
letter-spacing: 5px;
}
.profile-container {
margin-top: -185px;
min-width: 480px
}
.card-youtube {
min-height: 270px;
}
.Je-soutien-container {
min-width: 325px;
margin-left: -35px;
}
.mobile-profile-picture-creator {
transform: scale(1.3) translateY(25%) translateX(-50px);
}
.name-info {
font-size: 1.2rem;
margin-left: 20px;
margin-top: -6px
}
.occupation-info {
margin-left: 40px;
margin-top: -8px
}
.social-container {
margin-left: 80px;
min-width: 270px;
max-height: 40px
}
.social-container2 {
margin-left: 50px;
min-width: 250px;
max-height: 35px
}
.socialicons {
width: 34px;
max-width: 100px;
margin-top: 15px;
margin-left: 25px;
}
}
@media (min-width: 1280px) and (max-width: 1600px) {
.text-soutiens {
font-size: 1.3rem;
letter-spacing: 8px;
}
.mobile-profile-picture-creator {
transform: scale(1.3) translateY(25%) translateX(-50px);
}
.profile-container {
margin-top: -180px;
}
.card-youtube {
min-height: 290px;
}
.menu-col {
margin-left: -4%;
}
.Je-soutien-container {
min-width: 350px;
}
.name-info {
font-size: 1.2rem;
margin-left: 20px;
margin-top: -6px
}
.social-container {
margin-left: 90px;
min-width: 350;
max-height: 40px
}
.occupation-info {
margin-left: 70px;
margin-top: -8px
}
.social-container2 {
margin-left: 40px;
min-width: 290px;
max-height: 35px
}
.socialicons {
width: 34px;
max-width: 100px;
margin-top: 15px;
margin-left: 25px;
}
}
@media (min-width: 1600px) and (max-width: 1919px) {
.text-soutiens {
font-size: 1.3rem;
}
.mobile-profile-picture-creator {
transform: scale(1.4) translateY(25%) translateX(-40px);
}
.profile-container {
margin-top: -171px;
}
.card-youtube {
min-height: 355px;
}
.menu-col {
margin-left: -4%;
}
.Je-soutien-container {
min-width: 400px;
}
.name-info {
font-size: 1.5rem;
margin-top: -4px;
margin-left: 35px;
}
.occupation-info {
font-size: 1.3rem;
margin-left: 75px;
margin-top: -2px
}
.social-container2 {
margin-left: 70px;
min-width: 300px;
}
}
@media (min-width: 1920px) and (max-width: 2559px) {
.text-soutiens {
font-size: 1.3rem;
}
.profile-container {
margin-top: -160px;
}
.card-youtube {
min-height: 380px;
}
.Je-soutien-container {
min-width: 400px;
}
.mobile-profile-picture-creator {
transform: scale(1.4) translateY(25%) translateX(-40px);
}
.name-info {
font-size: 1.5rem;
margin-left: 35px;
margin-top: -4px;
}
.social-container {
margin-left: 100px;
}
.occupation-info {
font-size: 1.3rem;
margin-left: 110px;
margin-top: -4px
}
.social-container2 {
margin-left: 30px;
min-width: 360px;
}
.socialicons {
width: 38px;
max-width: 100px;
margin-top: 13px;
margin-left: 40px;
}
}
@media (min-width: 2560px) {
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(25%) translateX(-20px);
}
.profile-container {
margin-top: -150px
}
.profile-banner {
margin-top: 25px;
min-height: 450px;
}
.card-youtube {
min-height: 380px;
}
.text-soutiens {
font-size: 1.5rem;
}
.name-info {
font-size: 2rem;
}
.social-container {
margin-left: 140px;
}
.social-container2 {
margin-left: 130px;
}
.occupation-info {
font-size: 1.5rem;
margin-left: 65px;
margin-top: -6px
}
.socialicons {
width: 45px;
max-width: 100px;
margin-top: 15px;
margin-left: 40px;
}
}
</style>

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

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

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

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

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

@@ -162,7 +162,7 @@
style="margin-top: 3%; margin-bottom: 5%; max-width: 900px;"> 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 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 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 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 communauté vibrante qui défie les conventions de l’éducation, encourage l'originalité et célèbre
la créativité. la créativité.
@@ -226,25 +226,31 @@
<!-- Account links --> <!-- Account links -->
<v-row justify="center" class="profile-images"> <v-row justify="center" class="profile-images">
<v-col> <v-col>
<router-link :to="{ name: 'creatorfolio' }"> <router-link :to="{ name: 'Hutopy' }">
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image" <img src="/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile02.png"
class="profile-image "> alt="Profile Image" class="profile-image ">
</router-link> </router-link>
</v-col> </v-col>
<v-col> <v-col>
<router-link :to="{ name: 'creatorfolio' }"> <router-link :to="{ name: 'guillaumeaime' }">
<img src="/images/usersmedia/guillaumeMousseau/profilepictures/profileGuillaumeMousseau01.jpg" <img src="/images/usersmedia/guillaumeMousseau/profilepictures/profileGuillaumeMousseau01.jpg"
alt="Profile Image" class="profile-image"> alt="Profile Image" class="profile-image">
</router-link> </router-link>
</v-col> </v-col>
<v-col> <v-col>
<router-link :to="{ name: 'creatorfolio' }"> <router-link :to="{ name: 'chloebeaugrand' }">
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image" <img src="/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand02.png"
class="profile-image"> alt="Profile Image" class="profile-image">
</router-link> </router-link>
</v-col> </v-col>
</v-row> </v-row>
</v-col> </v-col>
<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-spacer></v-spacer>
</v-col> </v-col>
<v-spacer></v-spacer> <v-spacer></v-spacer>
@@ -314,7 +320,7 @@
<p style="margin-top: 3%; margin-bottom: 5%; text-align: justify;" class="center-vertical"> <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 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 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 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 communauté vibrante qui défie les conventions de l’éducation, encourage l'originalité et célèbre
la créativité. la créativité.
@@ -366,28 +372,36 @@
<v-col> <v-col>
<v-row justify="center" class="profile-images"> <v-row justify="center" class="profile-images">
<v-col cols="8"> <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" <img src="/images/usersmedia/guillaumeMousseau/profilepictures/profileGuillaumeMousseau01.jpg"
alt="Profile Image" class="profile-image"> alt="Profile Image" class="profile-image">
</router-link> </router-link>
</v-col> </v-col>
<v-col cols="8"> <v-col cols="8">
<router-link :to="{ name: 'creatorfolio' }"> <router-link :to="{ name: 'chloebeaugrand' }">
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image" <img src="/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand02.png"
class="profile-image "> alt="Profile Image" class="profile-image">
</router-link> </router-link>
</v-col> </v-col>
<v-col cols="8"> <v-row justify='center'>
<router-link :to="{ name: 'creatorfolio' }"> <router-link :to="{ name: 'userbrowser' }">
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image" <v-btn style="margin-top:30px; border-radius:10px; background-color:#a30e79; color:white">Découvre les autres créateurs
class="profile-image"> </v-btn>
</router-link> </router-link>
</v-col> </v-row>
</v-row> </v-row>
</v-col> </v-col>
</div> </div>
</div> </div>
<v-snackbar v-model="errorNoAccessSnackBar"> <v-snackbar v-model="errorNoAccessSnackBar">
Vous n'etes pas connecter ! Vous n'etes pas connecter !
<template v-slot:actions> <template v-slot:actions>

1020
src/views/manualusers/ARPS.vue Normal file
View File

File diff suppressed because it is too large Load Diff

941
src/views/manualusers/ChloeProfile.vue Normal file
View File

@@ -0,0 +1,941 @@
<template>
<div style="background-color: #f4f4f4;">
<DefaultLayout style="margin-bottom: 30px"></DefaultLayout>
<!-- "Mobile -->
<v-row class="fluid hidden-md-and-up social-mobile-container"
style="margin-top: -10px; position: relative; z-index: 0; " hidden-md-and-down>
<v-col cols="12" class="pa-0" style="width: 100vw; overflow: hidden;">
<v-img class="profile-banner" max-height="375" :src="imageSrc" cover
style="box-shadow: 0 4px 6px rgba(0, 0, 0, 0.8);"></v-img>
</v-col>
</v-row>
<!-- "PurpleLine" -->
<v-row style="background-color: #6b0065; height: 5px; box-shadow: rgba(0, 0, 0, 0.7);">
</v-row>
<!-- "Mobile-Profile" -->
<!-- "Profile picture" -->
<v-row class="d-flex justify-center align-center d-sm-none" style="margin-top: 50px; margin-bottom: -10px">
<v-img :src="profilePicture" class="elevation-4 mobile-profile-picture-creator"></v-img>
</v-row>
<!-- User Social Network Links -->
<v-container style="margin-top: -70px; padding: 0;" class="hidden-md-and-up social-container-mobile-icons"
hidden-md-and-down>
<!-- Facebook -->
<v-row no-gutters class="d-flex justify-space-between align-center" style="margin-left: 3%; margin-right: 3%;">
<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.facebook.com/chloegestionmedias">
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/facebookblack.png"
alt="Facebook"></v-img>
</a>
</v-col>
<!-- Profile picture - Small -->
<v-col cols="4" sm="4" xs="0" class="hidden-xs">
<v-row class="d-flex justify-center align-center">
<v-img :src="profilePicture" class="elevation-4 mobile-profile-picture-creator"></v-img>
</v-row>
</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/chloe.photo_gms">
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/instagramblack.png"
alt="Instagram"></v-img>
</a>
</v-col>
</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 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 class="d-flex justify-center">
{{ title }}
</v-row>
</v-col>
</v-row>
<v-row>
<v-container style="border-bottom-left-radius: 15px; margin-top: -12px; border-bottom-right-radius: 15px;"
class="social-icon-group-mobile">
<v-expansion-panels style="min-width: 320px;">
<v-col cols="12" offset="-1">
<v-expansion-panel class="background-pink text-justify" style="color: white;" text="
Axé sur l’être humain et le désir de performer, j’ai trouvé mon X avec les médias sociaux → Mon but est d’aider les entreprises à communiquer et à prospérer en renforçant leur image de marque à travers leur communauté!
Chaque collaboration est une aventure marketing inspirante!
Je suis authentique, créative, stratégique, caféinée et à l’écoute. Et surtout, j’ai hâte de travailler avec vous!
" title="À propos de moi.">
</v-expansion-panel>
</v-col>
</v-expansion-panels>
</v-container>
</v-row>
</v-container>
<!-- Bannière Pc -->
<v-row class="fluid hidden-sm-and-down" style="margin-top: -65px; position: relative; z-index: 0; "
hidden-sm-and-up>
<v-col cols="12" class="pa-0" style="width: 100vw; overflow: hidden;">
<v-img class="profile-banner" max-height="375" :src="imageSrc" cover
style="box-shadow: 0 4px 6px rgba(0, 0, 0, 0.8);"></v-img>
</v-col>
</v-row>
<v-row class="hidden-sm-and-down" style="background-color: #6b0065; height: 5px; box-shadow: rgba(0, 0, 0, 0.7);"
hidden-sm-and-up>
</v-row>
<!-- "Core (Menu / Center / Donation)" -->
<v-row>
<!-- "Menu" -->
<v-col cols="2" md="3" lg="4" xl="4" xxl="4" class="hidden-sm-and-down menu-col" hidden-sm-and-down>
<v-col style="margin: 0;">
<v-row class="Hutopy-menu-sticky-mobile">
<v-spacer></v-spacer>
<v-col>
<v-container style=" overflow-y: hidden;">
<!-- Nav-Btn -->
<v-col cols="12" class="px-0">
<v-img src="/images/hutopymedia/banners/hutopy.png" alt="Description de l'image"
style="height: 150px; width: 300px;" class="mx-auto" :elevation="10"></v-img>
<v-list dense class="main-background">
<v-list-item v-for="item in navigationItems" :key="item.link">
<router-link :to="item.link">
<v-btn text class="d-flex align-start align-center main-background" elevation="0"
outlined="false">
<v-icon left class="mr-4">{{ item.icon }}</v-icon>
{{ item.text }}
</v-btn>
</router-link>
</v-list-item>
</v-list>
</v-col>
</v-container>
</v-col>
</v-row>
<v-row style="height: 3000px;"></v-row>
</v-col>
</v-col>
<!-- Profile Info Picture name title & description -->
<v-col class="middle-col" style="z-index: 5;" cols="12" xs="12" sm="12" md="6" lg="5" xl="4" xxl="4">
<v-container class="profile-container hidden-sm-and-down" hidden-md-and-up>
<v-container>
<v-img :src="profilePicture" class="elevation-4 mobile-profile-picture-creator"></v-img>
<!-- User informations Name & title -->
<v-container class="background-profile-container" style="margin-top: -8%;">
<v-row>
<v-col style="height: 50px;" cols="7" offset="2" class="social-container">
<h1 class="name-info">{{ name }}</h1>
</v-col>
<v-col></v-col>
</v-row>
<v-row>
<v-col style="height: 50px;" cols="6" offset="2" class="social-container2">
<h1 class="occupation-info">{{ title }}</h1>
</v-col>
<v-col></v-col>
</v-row>
<!-- User Social Network Links -->
<v-row>
<v-spacer></v-spacer>
<v-col cols="7" style="margin-top: 1%; margin-bottom: -2%;">
<v-row>
<a href="https://www.facebook.com/chloegestionmedias">
<img class="socialicons" src="/images/hutopymedia/icons/black/facebookblack.png"
alt="Description image 2">
</a>
<a href="https://www.instagram.com/chloe.photo_gms">
<img class="socialicons" src="/images/hutopymedia/icons/black/instagramblack.png"
alt="Description image 2">
</a>
</v-row>
</v-col>
<v-col background-color="primary"></v-col>
</v-row>
<!-- Description -->
<v-row>
<v-container
style="border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; margin-top: 15px;">
<v-expansion-panels style="min-width: 320px;">
<v-col cols="12" offset="-1">
<v-expansion-panel class="background-pink text-justify" style="color: white;" text="
Axé sur l’être humain et le désir de performer, j’ai trouvé mon X avec les médias sociaux → Mon but est d’aider les entreprises à communiquer et à prospérer en renforçant leur image de marque à travers leur communauté!
Chaque collaboration est une aventure marketing inspirante!
Je suis authentique, créative, stratégique, caféinée et à l’écoute. Et surtout, j’ai hâte de travailler avec vous!
" title="À propos de moi.">
</v-expansion-panel>
</v-col>
</v-expansion-panels>
</v-container>
</v-row>
</v-container>
</v-container>
</v-container>
<!-- <PostContentMenu style="margin-top: -30px;"></PostContentMenu> Post -->
<!-- Card nouvelle boutique -->
<v-container>
<v-card class="flow-menu m-0 youtube-card">
<div style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%;">
<v-container style="margin-top: -15px;">
<v-img src="images/usersmedia/chloebeaugrand/pictures/posts/postsChloeBeaugrand01.png"
title="Savoir faire"></v-img>
<!-- Date -->
<v-row class="text-right">
<v-col>
<h1 style=" margin-right: 40px; margin-top: 10px; margin-bottom: -20px" class="card-date">
23-04-2024
</h1>
</v-col>
</v-row>
<p class="text-justify pa-10" style="margin-bottom: -6%; font-size: 1em">Quand on observe des gens
réaliser un
Rubik’s Cube ça a l’air si facile pour eux qu’on est vraiment impressionnés et peut-être même
découragés…<br><br>
Mais saviez-vous que pour résoudre ce casse-tête, il suffit d’une série de mouvements exécutés à
répétitions
dans le même ordre jusqu’à la fin?<br><br>
La gestion de médias sociaux peut donner l’impression d’être un vrai casse-tête!
La clé c’est de comprendre chaque élément individuellement et ensuite en faire un tout.
</p>
<!-- Like dislike commment Section -->
<div style="height: 20px;"></div>
<div
style="z-index: 500; margin-bottom: 2%; background-color: rgba(0, 0, 0, 1); height: 3px; width: 100%; margin-top: 20px;">
</div>
<div style="background-color: rgba(0, 0, 0, 1); height: 3px; width: 100%; margin-top: 20px;">
</div>
<!-- Comments -->
<v-text-field style="margin-left: 2%; margin-bottom: 15px; margin-bottom: -20px" class="Comments-font"
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">
<div style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%;">
<v-container style="margin-top: -15px;">
<v-img src="images/usersmedia/chloebeaugrand/pictures/posts/postsChloeBeaugrand02.png"
title="Guillaumem"></v-img>
<!-- Date -->
<v-row class="text-right">
<v-col>
<h1 style=" margin-right: 40px; margin-top: 10px; margin-bottom: -20px" class="card-date">
23-04-2024
</h1>
</v-col>
</v-row>
<p class="text-justify pa-10" style="margin-bottom: -6%; font-size: 1em">
Que ce soit pour un portrait créatif, la gestion totales de tes médias sociaux où pour devenir
autonome à
les gérer par toi-même → Je suis là pour ça!
<br><br>
Je te promets qu’on passera un bon moment ET que tu auras des résultats à la hauteur de tes attentes
<v-icon icon=" mdi-emoticon"></v-icon>
</p>
<!-- Like dislike commment Section -->
<div style="height: 20px;"></div>
<div
style="z-index: 500; margin-bottom: 2%; background-color: rgba(0, 0, 0, 1); height: 3px; width: 100%; margin-top: 20px;">
</div>
<div style="background-color: rgba(0, 0, 0, 1); height: 3px; width: 100%; margin-top: 20px;">
</div>
<!-- Comments -->
<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>
</v-col>
<!-- "Large-Monitor-RightCol" Donation -->
<v-col cols="2" md="3" lg="3" xl="4" xxl="4" class="hidden-sm-and-down" hidden-sm-and-up>
<v-row>
<v-col>
<v-container class="sticky-bottom-label Je-soutien-container" style="max-width: 400px ; bottom: 0;">
<!-- Donnation -->
<v-card style="border-radius: 20px;">
<v-container>
<v-row class="mb-0"
style="background-color: #6b0065; margin-left: -24px; margin-right: -24px; margin-top: -20px; justify-content: center;">
<v-card-title class="text-soutiens" style="margin-top: 15px;">
JE SOUTIENS!
</v-card-title>
</v-row>
<StripePayment creator-id="27e5321d-2bcc-42b0-9548-33802431e8f3"></StripePayment>
</v-container>
</v-card>
</v-container>
<v-container style="height: 3000px;">
</v-container>
</v-col>
<v-spacer>
</v-spacer>
</v-row>
</v-col>
</v-row>
<!-- "Mobile" Donation -->
<v-col class="hidden-md-and-up sticky-bottom-label" hidden-sm-and-down
style="background-color: #6b0065; margin-top: 30px; text-align: center;">
<!-- Barre cliquable pour ouvrir le drawer -->
<v-btn @click="drawerbottom = !drawerbottom" elevation="0"
style="background-color: #6b0065; color: white; text-align: center;" class="text-soutiens ">
JE SOUTIENS
</v-btn>
</v-col>
<!-- Drawer du bas -->
<template>
<div>
<v-bottom-sheet v-model="drawerbottom" class="sticky-bottom-label" hide-overlay>
<v-container style="background-color: #6b0065; color: white; padding: 20px; text-align: center;">
<h1 class="text-soutiens">JE SOUTIENS</h1>
<StripePayment creator-id="27e5321d-2bcc-42b0-9548-33802431e8f3"></StripePayment>
</v-container>
</v-bottom-sheet>
</div>
</template>
<FooterLayout></FooterLayout>
</div>
</template>
<script setup>
import DefaultLayout from '@/layouts/DefaultLayout.vue';
import FooterLayout from '@/layouts/FooterLayout.vue';
import { ref } from 'vue';
import StripePayment from '../StripePayment.vue';
let imageSrc = '/images/usersmedia/chloebeaugrand/banners/bannerChloeBeaugrand01.png';
let profilePicture = '/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand01.png';
let name = 'Chloé Beaugrand'
let title = 'Spécialiste en média'
let drawerbottom = ref(false)
let navigationItems = [
{ icon: 'mdi-home', text: 'Accueil', link: 'home' },
{ icon: 'mdi-account-group', text: 'Créateurs', link: '/userbrowser' },
{ icon: 'mdi-handshake', text: 'Aidez-nous', link: '/contact' },
];
</script>
<style scoped>
.invert-color {
filter: invert(1);
}
.Comments-font {
font-size: .1rem;
}
.Hutopy-menu-sticky-mobile {
position: sticky;
top: 0;
bottom: 0;
left: 0;
width: 100%;
z-index: 1000;
margin-top: -40px;
}
.sticky-bottom-label {
position: sticky;
top: 0;
bottom: 0;
left: 0;
width: 100%;
z-index: 1000;
margin-top: 20px;
}
.sticky-top-label {
position: sticky;
bottom: 0;
right: 10%;
width: 100%;
z-index: 1000;
}
.text-soutiens {
margin-bottom: 15px;
color: white;
font-size: 1.5rem;
letter-spacing: 7px;
text-align: center;
}
.name-info {
margin-top: -10px;
margin-left: 15%;
}
.occupation-info {
margin-left: 15%;
font-size: large;
}
.name-info-mobile {
margin-left: 22px;
font-size: 1.3rem
}
.main-background {
background-color: #f4f4f4;
}
.profile-container {
margin-top: -16%;
}
.btn-custom {
width: 100%;
background-color: transparent;
}
.background-profile-container {
background-color: #ececec;
color: white;
border-top: 3px solid #a30e79;
border-right: 3px solid #a30e79;
font-weight: 700;
font-size: 1.15rem;
border-radius: 25px;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3)
}
.background-pink {
background-color: #231f20;
color: white;
font-weight: 400;
}
.label-text {
font-weight: 400;
margin-left: 3%;
font-size: 1rem;
}
.profile-name {
margin-top: -15%;
}
.socialicons {
width: 35px;
max-width: 100px;
margin-top: 3px;
margin-left: 40px;
}
.socialicons-mobile {
width: 35px;
max-width: 100px;
margin-top: 27px;
margin-left: 20px;
}
.youtube-card {
margin-left: 2%;
margin-right: 2%;
border-radius: 15px;
background-color: #f4f4f4;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4)
}
.card-title {
font-size: 1.4rem;
margin-top: 10px;
}
.card-date {
margin-left: 10px;
margin-top: -18px;
margin-bottom: -20px;
font-size: .8rem;
}
.social-container {
background-color: #8c5536;
border-top-right-radius: 30px;
border-bottom-right-radius: 30px;
font-size: 1.7rem;
font-weight: 600;
color: white;
}
.social-container2 {
background-color: #231f20;
border-bottom-right-radius: 30px;
font-size: 1.4rem;
font-weight: 500;
color: white;
}
.social-container-mobile {
background-color: #8c5536;
font-size: 1.4rem;
font-weight: 600;
color: white;
z-index: 1000;
margin: auto;
text-align: center;
}
.social-container2-mobile {
background-color: #0baab2;
z-index: 1000;
font-size: 1.2rem;
font-weight: 500;
color: white;
}
.social-icon-group-mobile {
background-color: #272526;
}
.mini-profile-picture {
border-radius: 100px;
}
.btn-card-options {
background-color: #f4f4f4;
width: 50px;
margin-left: -12px;
margin-top: 10px;
}
.mobile-profile-picture-creator {
border-radius: 100px;
height: 150px;
width: 150px;
border-radius: 50%;
max-width: 150px;
border: 4px solid white;
z-index: 1000;
}
.mobile-header {
height: 50px;
margin-left: -13%;
margin-top: 6%;
}
.h1-navigation {
text-align: center;
font-weight: 600;
margin-bottom: 10%;
}
.mobile-profile-picture {
height: 40px;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
border: 2px solid #a30e79;
margin-right: 10px
}
.profile-banner {
margin-top: 25px;
min-height: 200px
}
.v-navigation-drawer {
max-height: 100vh;
}
@media (min-width: 150px) and (max-width: 474px) {
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(-30%) translateX(0%);
}
.socialicons-mobile {
width: 35px;
max-width: 100px;
margin-top: 0px;
margin-left: 20px;
}
}
@media (min-width: 475px) and (max-width: 599px) {
.socialicons-mobile {
width: 35px;
max-width: 100px;
margin-top: 0px;
margin-left: px;
}
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(-30%) translateX(0%);
}
.profile-container-mobile {
width: 110%;
margin-left: -3%;
margin-top: -112px;
}
.occupation-info {
font-size: 1rem;
}
.card-youtube {
min-height: 250px;
}
.name-info-mobile {
font-size: 1.6rem;
}
}
@media (min-width: 599px) and (max-width: 749px) {
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(25%) translateX(0%);
}
.profile-container {
width: 110%;
margin-left: -3%;
}
.profile-container-mobile {
width: 110%;
margin-left: -3%;
margin-top: -110px;
}
.name-info {
font-size: 1.2rem;
}
.occupation-info {
font-size: 1rem;
}
.card-youtube {
min-height: 330px;
}
}
@media (min-width: 750px) and (max-width: 960px) {
.mobile-profile-picture-creator {
transform: scale(1.8) translateY(25%) translateX(0%);
}
.profile-container {
width: 110%;
margin-left: -3%;
}
.profile-container-mobile {
width: 110%;
margin-left: -3%;
margin-top: -110px;
}
.name-info {
font-size: 1.2rem;
}
.occupation-info {
font-size: 1rem;
}
.card-youtube {
min-height: 425px;
}
}
@media (min-width: 960px) and (max-width: 1280px) {
.middle-col {
margin-left: -30px;
}
.text-soutiens {
font-size: 1.2rem;
letter-spacing: 5px;
}
.profile-container {
margin-top: -185px;
min-width: 480px
}
.card-youtube {
min-height: 270px;
}
.Je-soutien-container {
min-width: 325px;
margin-left: -35px;
}
.mobile-profile-picture-creator {
transform: scale(1.3) translateY(25%) translateX(-50px);
}
.name-info {
font-size: 1.2rem;
margin-left: 20px;
margin-top: -6px
}
.occupation-info {
margin-left: 40px;
margin-top: -8px
}
.social-container {
margin-left: 80px;
min-width: 270px;
max-height: 40px
}
.social-container2 {
margin-left: 50px;
min-width: 250px;
max-height: 35px
}
.socialicons {
width: 34px;
max-width: 100px;
margin-top: 15px;
margin-left: 25px;
}
}
@media (min-width: 1280px) and (max-width: 1600px) {
.text-soutiens {
font-size: 1.3rem;
letter-spacing: 8px;
}
.mobile-profile-picture-creator {
transform: scale(1.3) translateY(25%) translateX(-50px);
}
.profile-container {
margin-top: -180px;
}
.card-youtube {
min-height: 290px;
}
.menu-col {
margin-left: -4%;
}
.Je-soutien-container {
min-width: 350px;
}
.name-info {
font-size: 1.2rem;
margin-left: 20px;
margin-top: -6px
}
.social-container {
margin-left: 90px;
min-width: 350;
max-height: 40px
}
.occupation-info {
margin-left: 70px;
margin-top: -8px
}
.social-container2 {
margin-left: 40px;
min-width: 290px;
max-height: 35px
}
.socialicons {
width: 34px;
max-width: 100px;
margin-top: 15px;
margin-left: 25px;
}
}
@media (min-width: 1600px) and (max-width: 1919px) {
.text-soutiens {
font-size: 1.3rem;
}
.mobile-profile-picture-creator {
transform: scale(1.4) translateY(25%) translateX(-40px);
}
.profile-container {
margin-top: -171px;
}
.card-youtube {
min-height: 355px;
}
.menu-col {
margin-left: -4%;
}
.Je-soutien-container {
min-width: 400px;
}
.name-info {
font-size: 1.5rem;
margin-top: -4px;
margin-left: 35px;
}
.occupation-info {
font-size: 1.3rem;
margin-left: 75px;
margin-top: -2px
}
.social-container2 {
margin-left: 70px;
min-width: 300px;
}
}
@media (min-width: 1920px) and (max-width: 2559px) {
.text-soutiens {
font-size: 1.3rem;
}
.profile-container {
margin-top: -160px;
}
.card-youtube {
min-height: 380px;
}
.Je-soutien-container {
min-width: 400px;
}
.mobile-profile-picture-creator {
transform: scale(1.4) translateY(25%) translateX(-40px);
}
.name-info {
font-size: 1.5rem;
margin-left: 35px;
margin-top: -4px;
}
.social-container {
margin-left: 100px;
}
.occupation-info {
font-size: 1.3rem;
margin-left: 110px;
margin-top: -4px
}
.social-container2 {
margin-left: 30px;
min-width: 360px;
}
.socialicons {
width: 38px;
max-width: 100px;
margin-top: 13px;
margin-left: 40px;
}
}
@media (min-width: 2560px) {
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(25%) translateX(-20px);
}
.card-youtube {
min-height: 380px;
}
.text-soutiens {
font-size: 1.5rem;
}
.name-info {
font-size: 2rem;
}
.social-container {
margin-left: 140px;
}
.social-container2 {
margin-left: 130px;
}
.occupation-info {
font-size: 1.5rem;
margin-left: 65px;
margin-top: -6px
}
.socialicons {
width: 45px;
max-width: 100px;
margin-top: 15px;
margin-left: 40px;
}
}
</style>

1054
src/views/manualusers/GuillaumeAime.vue Normal file
View File

File diff suppressed because it is too large Load Diff

936
src/views/manualusers/HutopyProfile.vue Normal file
View File

@@ -0,0 +1,936 @@
<template>
<div style="background-color: #f4f4f4;">
<DefaultLayout style="margin-bottom: 30px"></DefaultLayout>
<!-- "Mobile -->
<v-row class="fluid hidden-md-and-up social-mobile-container"
style="margin-top: -10px; position: relative; z-index: 0; " hidden-md-and-down>
<v-col cols="12" class="pa-0" style="width: 100vw; overflow: hidden;">
<v-img class="profile-banner" max-height="375" :src="imageSrc" cover
style="box-shadow: 0 4px 6px rgba(0, 0, 0, 0.8);"></v-img>
</v-col>
</v-row>
<!-- "PurpleLine" -->
<v-row style="background-color: #6b0065; height: 5px; box-shadow: rgba(0, 0, 0, 0.7);">
</v-row>
<!-- "Mobile-Profile" -->
<!-- "Profile picture" -->
<v-row class="d-flex justify-center align-center d-sm-none" style="margin-top: 50px; margin-bottom: -10px">
<v-img :src="profilePicture" class="elevation-4 mobile-profile-picture-creator"></v-img>
</v-row>
<!-- User Social Network Links -->
<v-container style="margin-top: -70px; padding: 0;" class="hidden-md-and-up social-container-mobile-icons"
hidden-md-and-down>
<!-- Facebook -->
<v-row no-gutters class="d-flex justify-space-between align-center" style="margin-left: 3%; margin-right: 3%;">
<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.facebook.com/Hutopy">
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/facebookblack.png"
alt="Facebook"></v-img>
</a>
</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/hutopy.inc/">
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/instagramblack.png"
alt="Instagram"></v-img>
</a>
</v-col>
<!-- Profile picture - Small -->
<v-col cols="4" sm="4" xs="0" class="hidden-xs">
<v-row class="d-flex justify-center align-center">
<v-img :src="profilePicture" class="elevation-4 mobile-profile-picture-creator"></v-img>
</v-row>
</v-col>
<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://twitter.com/Hutopyinc">
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/xblack.png" alt="X"></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 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 class="d-flex justify-center">
{{ title }}
</v-row>
</v-col>
</v-row>
<v-row>
<v-container style="border-bottom-left-radius: 15px; margin-top: -12px; border-bottom-right-radius: 15px;"
class="social-icon-group-mobile">
<v-expansion-panels style="min-width: 320px;">
<v-col cols="12" offset="-1">
<v-expansion-panel class="background-pink text-justify" style="color: white;"
text="Notre mission chez Hutopy est d'aider les gens à s'épanouir en leur proposant un environnement de partage unique qui va leur permettre de se surpasser. Nous travaillons étroitement avec la communauté d'Hutopy afin de concentrer notre développement sur ce que vous demandez et sur vos besoins, afin d'offrir les meilleurs outils. Le tout en gardant à l'esprit l'aspect humain de chacun. Il est important pour nous de contribuer à créer un monde meilleur."
title="À propos d'Hutopy :">
</v-expansion-panel>
</v-col>
</v-expansion-panels>
</v-container>
</v-row>
</v-container>
<!-- Bannière Pc -->
<v-row class="fluid hidden-sm-and-down" style="margin-top: -65px; position: relative; z-index: 0; "
hidden-sm-and-up>
<v-col cols="12" class="pa-0" style="width: 100vw; overflow: hidden;">
<v-img class="profile-banner" max-height="375" :src="imageSrc" cover
style="box-shadow: 0 4px 6px rgba(0, 0, 0, 0.8);"></v-img>
</v-col>
</v-row>
<v-row class="hidden-sm-and-down" style="background-color: #6b0065; height: 5px; box-shadow: rgba(0, 0, 0, 0.7);"
hidden-sm-and-up>
</v-row>
<!-- "Core (Menu / Center / Donation)" -->
<v-row>
<!-- "Menu" -->
<v-col cols="2" md="3" lg="4" xl="4" xxl="4" class="hidden-sm-and-down menu-col" hidden-sm-and-down>
<v-col style="margin: 0;">
<v-row class="Hutopy-menu-sticky-mobile">
<v-spacer></v-spacer>
<v-col>
<v-container style=" overflow-y: hidden;">
<!-- Nav-Btn -->
<v-col cols="12" class="px-0">
<v-img src="/images/hutopymedia/banners/hutopy.png" alt="Description de l'image"
style="height: 150px; width: 300px;" class="mx-auto" :elevation="10"></v-img>
<v-list dense class="main-background">
<v-list-item v-for="item in navigationItems" :key="item.link">
<router-link :to="item.link">
<v-btn text class="d-flex align-start align-center main-background" elevation="0"
outlined="false">
<v-icon left class="mr-4">{{ item.icon }}</v-icon>
{{ item.text }}
</v-btn>
</router-link>
</v-list-item>
</v-list>
</v-col>
</v-container>
</v-col>
</v-row>
<v-row style="height: 1000px;"></v-row>
</v-col>
</v-col>
<!-- Profile Info Picture name title & description -->
<v-col class="middle-col" style="z-index: 5;" cols="12" xs="12" sm="12" md="6" lg="5" xl="4" xxl="4">
<v-container class="profile-container hidden-sm-and-down" hidden-md-and-up>
<v-container>
<v-img :src="profilePicture" class="elevation-4 mobile-profile-picture-creator"></v-img>
<!-- User informations Name & title -->
<v-container class="background-profile-container" style="margin-top: -8%;">
<v-row>
<v-col style="height: 50px;" cols="7" offset="2" class="social-container">
<h1 class="name-info">{{ name }}</h1>
</v-col>
<v-col></v-col>
</v-row>
<v-row>
<v-col style="height: 50px;" cols="6" offset="2" class="social-container2">
<h1 class="occupation-info">{{ title }}</h1>
</v-col>
<v-col></v-col>
</v-row>
<!-- User Social Network Links -->
<v-row>
<v-spacer></v-spacer>
<v-col cols="7" style="margin-top: 1%; margin-bottom: -2%;">
<v-row>
<a href="https://www.facebook.com/Hutopy">
<img class="socialicons" src="/images/hutopymedia/icons/black/facebookblack.png"
alt="Description image 2">
</a>
<a href="https://www.instagram.com/hutopy.inc/">
<img class="socialicons" src="/images/hutopymedia/icons/black/instagramblack.png"
alt="Description image 2">
</a>
<a href="https://twitter.com/Hutopyinc">
<img class="socialicons" src="/images/hutopymedia/icons/black/xblack.png"
alt="Description image 2">
</a>
</v-row>
</v-col>
<v-col background-color="primary"></v-col>
</v-row>
<!-- Description -->
<v-row>
<v-container
style="border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; margin-top: 15px;">
<v-expansion-panels style="min-width: 320px;">
<v-col cols="12" offset="-1">
<v-expansion-panel class="background-pink text-justify" style="color: white;"
text="Notre mission chez Hutopy est d'aider les gens à s'épanouir en leur proposant un environnement de partage unique qui va leur permettre de se surpasser. Nous travaillons étroitement avec la communauté d'Hutopy afin de concentrer notre développement sur ce que vous demandez et sur vos besoins, afin d'offrir les meilleurs outils. Le tout en gardant à l'esprit l'aspect humain de chacun. Il est important pour nous de contribuer à créer un monde meilleur."
title="À propos d'Hutopy :">
</v-expansion-panel>
</v-col>
</v-expansion-panels>
</v-container>
</v-row>
</v-container>
</v-container>
</v-container>
<!-- <PostContentMenu style="margin-top: -30px;"></PostContentMenu> Post -->
<!-- Release v0.1 -->
<v-container>
<v-card class="flow-menu m-0 youtube-card">
<!-- Title, date and btn -->
<v-col>
<v-row>
<v-col class="text-center">
<h1 class="card-title">
Déploiement de la version 0.10 d'Hutopy</h1>
</v-col>
<!--<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-row>
</v-col>
<!-- Card core Video/image & text -->
<div style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%">
<v-container>
<v-img src="images/usersmedia/HutopyProfile/pictures/version.png" title="Release v0.1"></v-img>
<!-- Date -->
<v-row class="text-right">
<v-col>
<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: -6%; font-size: 1em">
Bonjour, Nous sommes fiers de vous présenter la version 0.10 d'Hutopy. Nous sommes au début d'une
aventure
visant à transformer la sphère des médias sociaux. Notre objectif est d'apporter un souffle de
fraîcheur en
favorisant des interactions plus constructives entre les individus.
Dans cette première version, seuls nos utilisateurs testeurs ont accès à la plateforme comme créateur.
Dans
un futur
proche, avec le déploiement de la version 0.2, nous contacterons les personnes qui se sont inscrites
via
l'onglet d'inscription et ont rempli quelques questions.
Si vous souhaitez soutenir le développement de la plateforme, deux options s'offrent à vous. La
première
consiste à nous apporter un soutien financier, tandis que la seconde est de nous contacter pour faire
partie
de l'équipe de développement. Nous recherchons actuellement un programmeur supplémentaire pour faire
progresser certaines fonctionnalités.
Merci de visiter Hutopy.</p>
<!-- Like dislike commment Section -->
<div style="height: 20px;"></div>
<div
style="z-index: 500; margin-bottom: 2%; background-color: rgba(0, 0, 0, 1); height: 3px; width: 100%; margin-top: 20px;">
</div>
<div style="background-color: rgba(0, 0, 0, 1); height: 3px; width: 100%; margin-top: 20px;">
</div>
<!-- Comments -->
<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>
</v-col>
<!-- "Large-Monitor-RightCol" Donation -->
<v-col cols="2" md="3" lg="3" xl="4" xxl="4" class="hidden-sm-and-down" hidden-sm-and-up>
<v-row>
<v-col>
<v-container class="sticky-bottom-label Je-soutien-container" style="max-width: 400px ; bottom: 0;">
<!-- Donnation -->
<v-card style="border-radius: 20px;">
<v-container>
<v-row class="mb-0"
style="background-color: #6b0065; margin-left: -24px; margin-right: -24px; margin-top: -20px; justify-content: center;">
<v-card-title class="text-soutiens" style="margin-top: 15px;">
JE SOUTIENS!
</v-card-title>
</v-row>
<StripePayment creator-id="3c4317c6-af4d-475a-a382-6d0a675cc67f"></StripePayment>
</v-container>
</v-card>
</v-container>
<v-container style="height: 1000px;">
</v-container>
</v-col>
<v-spacer>
</v-spacer>
</v-row>
</v-col>
</v-row>
<!-- "Mobile" Donation -->
<v-col class="hidden-md-and-up sticky-bottom-label" hidden-sm-and-down
style="background-color: #6b0065; margin-top: 30px; text-align: center;">
<!-- Barre cliquable pour ouvrir le drawer -->
<v-btn @click="drawerbottom = !drawerbottom" elevation="0"
style="background-color: #6b0065; color: white; text-align: center;" class="text-soutiens ">
JE SOUTIENS
</v-btn>
</v-col>
<!-- Drawer du bas -->
<template>
<div>
<v-bottom-sheet v-model="drawerbottom" class="sticky-bottom-label" hide-overlay>
<v-container style="background-color: #6b0065; color: white; padding: 20px; text-align: center;">
<h1 class="text-soutiens">JE SOUTIENS</h1>
<StripePayment creator-id="3c4317c6-af4d-475a-a382-6d0a675cc67f"></StripePayment>
</v-container>
</v-bottom-sheet>
</div>
</template>
<FooterLayout></FooterLayout>
</div>
</template>
<script setup>
import DefaultLayout from '@/layouts/DefaultLayout.vue';
import FooterLayout from '@/layouts/FooterLayout.vue';
import { ref } from 'vue';
import StripePayment from '../StripePayment.vue';
let imageSrc = '/images/usersmedia/HutopyProfile/banners/banner01.png';
let profilePicture = '/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile01.png';
let name = 'Hutopy'
let title = 'Page officiel'
let drawerbottom = ref(false)
let navigationItems = [
{ icon: 'mdi-home', text: 'Accueil', link: 'home' },
{ icon: 'mdi-account-group', text: 'Créateurs', link: '/userbrowser' },
{ icon: 'mdi-handshake', text: 'Aidez-nous', link: '/contact' },
];
</script>
<style scoped>
.invert-color {
filter: invert(1);
}
.Hutopy-menu-sticky-mobile {
position: sticky;
top: 0;
bottom: 0;
left: 0;
width: 100%;
z-index: 1000;
margin-top: -40px;
}
.sticky-bottom-label {
position: sticky;
top: 0;
bottom: 0;
left: 0;
width: 100%;
z-index: 1000;
margin-top: 20px;
}
.sticky-top-label {
position: sticky;
bottom: 0;
right: 10%;
width: 100%;
z-index: 1000;
}
.text-soutiens {
margin-bottom: 15px;
color: white;
font-size: 1.5rem;
letter-spacing: 7px;
text-align: center;
}
.name-info {
margin-top: -10px;
margin-left: 15%;
}
.occupation-info {
margin-left: 15%;
font-size: large;
}
.name-info-mobile {
margin-left: 22px;
font-size: 1.3rem
}
.main-background {
background-color: #f4f4f4;
}
.profile-container {
margin-top: -16%;
}
.btn-custom {
width: 100%;
background-color: transparent;
}
.background-profile-container {
background-color: #ececec;
color: white;
border-top: 3px solid #a30e79;
border-right: 3px solid #a30e79;
font-weight: 700;
font-size: 1.15rem;
border-radius: 25px;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3)
}
.background-pink {
background-color: #23393b;
color: white;
font-weight: 400;
}
.label-text {
font-weight: 400;
margin-left: 3%;
font-size: 1rem;
}
.profile-name {
margin-top: -15%;
}
.socialicons {
width: 35px;
max-width: 100px;
margin-top: 3px;
margin-left: 40px;
}
.socialicons-mobile {
width: 35px;
max-width: 100px;
margin-top: 27px;
margin-left: 20px;
}
.youtube-card {
margin-left: 2%;
margin-right: 2%;
border-radius: 15px;
background-color: #f4f4f4;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4)
}
.card-title {
font-size: 1.4rem;
margin-top: 10px;
}
.card-date {
margin-left: 10px;
margin-top: -18px;
margin-bottom: -20px;
font-size: .8rem;
}
.social-container {
background-color: #6b0065;
border-top-right-radius: 30px;
border-bottom-right-radius: 30px;
font-size: 1.7rem;
font-weight: 600;
color: white;
}
.social-container2 {
background-color: #a30e79;
border-bottom-right-radius: 30px;
font-size: 1.4rem;
font-weight: 500;
color: white;
}
.social-container-mobile {
background-color: #a30e79;
font-size: 1.4rem;
font-weight: 600;
color: white;
z-index: 1000;
margin: auto;
text-align: center;
}
.social-container2-mobile {
background-color: #0baab2;
z-index: 1000;
font-size: 1.2rem;
font-weight: 500;
color: white;
}
.social-icon-group-mobile {
background-color: #6b0065;
}
.mini-profile-picture {
border-radius: 100px;
}
.btn-card-options {
background-color: #f4f4f4;
width: 50px;
margin-left: -12px;
margin-top: 10px;
}
.mobile-profile-picture-creator {
border-radius: 100px;
height: 150px;
width: 150px;
border-radius: 50%;
max-width: 150px;
border: 4px solid white;
z-index: 1000;
}
.mobile-header {
height: 50px;
margin-left: -13%;
margin-top: 6%;
}
.h1-navigation {
text-align: center;
font-weight: 600;
margin-bottom: 10%;
}
.mobile-profile-picture {
height: 40px;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
border: 2px solid #a30e79;
margin-right: 10px
}
.profile-banner {
margin-top: 25px;
min-height: 200px
}
.v-navigation-drawer {
max-height: 100vh;
}
@media (min-width: 150px) and (max-width: 474px) {
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(-30%) translateX(0%);
}
.socialicons-mobile {
width: 35px;
max-width: 100px;
margin-top: 0px;
margin-left: 20px;
}
}
@media (min-width: 475px) and (max-width: 599px) {
.socialicons-mobile {
width: 35px;
max-width: 100px;
margin-top: 0px;
margin-left: px;
}
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(-30%) translateX(0%);
}
.profile-container-mobile {
width: 110%;
margin-left: -3%;
margin-top: -112px;
}
.occupation-info {
font-size: 1rem;
}
.card-youtube {
min-height: 250px;
}
.name-info-mobile {
font-size: 1.6rem;
}
}
@media (min-width: 599px) and (max-width: 749px) {
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(25%) translateX(0%);
}
.profile-container {
width: 110%;
margin-left: -3%;
}
.profile-container-mobile {
width: 110%;
margin-left: -3%;
margin-top: -110px;
}
.name-info {
font-size: 1.2rem;
}
.occupation-info {
font-size: 1rem;
}
.card-youtube {
min-height: 330px;
}
}
@media (min-width: 750px) and (max-width: 960px) {
.mobile-profile-picture-creator {
transform: scale(1.8) translateY(25%) translateX(0%);
}
.profile-container {
width: 110%;
margin-left: -3%;
}
.profile-container-mobile {
width: 110%;
margin-left: -3%;
margin-top: -110px;
}
.name-info {
font-size: 1.2rem;
}
.occupation-info {
font-size: 1rem;
}
.card-youtube {
min-height: 425px;
}
}
@media (min-width: 960px) and (max-width: 1280px) {
.middle-col {
margin-left: -30px;
}
.text-soutiens {
font-size: 1.2rem;
letter-spacing: 5px;
}
.profile-container {
margin-top: -185px;
min-width: 480px
}
.card-youtube {
min-height: 270px;
}
.Je-soutien-container {
min-width: 325px;
margin-left: -35px;
}
.mobile-profile-picture-creator {
transform: scale(1.3) translateY(25%) translateX(-50px);
}
.name-info {
font-size: 1.2rem;
margin-left: 20px;
margin-top: -6px
}
.occupation-info {
margin-left: 40px;
margin-top: -8px
}
.social-container {
margin-left: 80px;
min-width: 270px;
max-height: 40px
}
.social-container2 {
margin-left: 50px;
min-width: 250px;
max-height: 35px
}
.socialicons {
width: 34px;
max-width: 100px;
margin-top: 15px;
margin-left: 25px;
}
}
@media (min-width: 1280px) and (max-width: 1600px) {
.text-soutiens {
font-size: 1.3rem;
letter-spacing: 8px;
}
.mobile-profile-picture-creator {
transform: scale(1.3) translateY(25%) translateX(-50px);
}
.profile-container {
margin-top: -180px;
}
.card-youtube {
min-height: 290px;
}
.menu-col {
margin-left: -4%;
}
.Je-soutien-container {
min-width: 350px;
}
.name-info {
font-size: 1.2rem;
margin-left: 20px;
margin-top: -6px
}
.social-container {
margin-left: 90px;
min-width: 350;
max-height: 40px
}
.occupation-info {
margin-left: 70px;
margin-top: -8px
}
.social-container2 {
margin-left: 40px;
min-width: 290px;
max-height: 35px
}
.socialicons {
width: 34px;
max-width: 100px;
margin-top: 15px;
margin-left: 25px;
}
}
@media (min-width: 1600px) and (max-width: 1919px) {
.text-soutiens {
font-size: 1.3rem;
}
.mobile-profile-picture-creator {
transform: scale(1.4) translateY(25%) translateX(-40px);
}
.profile-container {
margin-top: -171px;
}
.card-youtube {
min-height: 355px;
}
.menu-col {
margin-left: -4%;
}
.Je-soutien-container {
min-width: 400px;
}
.name-info {
font-size: 1.5rem;
margin-top: -4px;
margin-left: 35px;
}
.occupation-info {
font-size: 1.3rem;
margin-left: 75px;
margin-top: -2px
}
.social-container2 {
margin-left: 70px;
min-width: 300px;
}
}
@media (min-width: 1920px) and (max-width: 2559px) {
.text-soutiens {
font-size: 1.3rem;
}
.profile-container {
margin-top: -160px;
}
.card-youtube {
min-height: 380px;
}
.Je-soutien-container {
min-width: 400px;
}
.mobile-profile-picture-creator {
transform: scale(1.4) translateY(25%) translateX(-40px);
}
.name-info {
font-size: 1.5rem;
margin-left: 35px;
margin-top: -4px;
}
.social-container {
margin-left: 100px;
}
.occupation-info {
font-size: 1.3rem;
margin-left: 110px;
margin-top: -4px
}
.social-container2 {
margin-left: 30px;
min-width: 360px;
}
.socialicons {
width: 38px;
max-width: 100px;
margin-top: 13px;
margin-left: 40px;
}
}
@media (min-width: 2560px) {
.mobile-profile-picture-creator {
transform: scale(1.5) translateY(25%) translateX(-20px);
}
.profile-container {
margin-top: -150px
}
.profile-banner {
margin-top: 25px;
min-height: 450px;
}
.card-youtube {
min-height: 380px;
}
.text-soutiens {
font-size: 1.5rem;
}
.name-info {
font-size: 2rem;
}
.social-container {
margin-left: 140px;
}
.social-container2 {
margin-left: 130px;
}
.occupation-info {
font-size: 1.5rem;
margin-left: 65px;
margin-top: -6px
}
.socialicons {
width: 45px;
max-width: 100px;
margin-top: 15px;
margin-left: 40px;
}
}
</style>

1012
src/views/manualusers/LeffetProfile.vue Normal file
View File

File diff suppressed because it is too large Load Diff

1072
src/views/manualusers/MathieuCaron.vue Normal file
View File

File diff suppressed because it is too large Load Diff

125
src/views/tos/About.vue
View File

@@ -18,6 +18,16 @@
</v-row> </v-row>
</v-container> </v-container>
<v-row class="fluid d-flex justify-center" style="margin-bottom: 25px; margin-top: 25px;">
<v-col cols="auto">
<router-link :to="{ name: 'home' }">
<v-btn flat style="background-color: #f4f4f4;">
<v-icon left style="margin-right: 10px;">mdi-home</v-icon> Accueil
</v-btn>
</router-link>
</v-col>
</v-row>
<v-container style="z-index: 100; position: relative;"> <v-container style="z-index: 100; position: relative;">
<v-row justify="center" align="center"> <v-row justify="center" align="center">
@@ -79,68 +89,104 @@
contenu. Notre équipe est notre plus grande force, chaque membre apportant une expertise contenu. Notre équipe est notre plus grande force, chaque membre apportant une expertise
unique et une perspective fraîche à notre mission commune. unique et une perspective fraîche à notre mission commune.
</p> </p>
<v-row>
<v-col>
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png"
alt="Marc-Olivier Hébert">
<br> <br>
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">Marc-Olivier <v-row justify="center">
<v-card max-width="250px" style="margin: 10px;">
<img class="member-profile-picture"
src="/images/hutopymedia/tospage/membersPictures/profileMarco.png"
alt="Marc-Olivier Hébert">
<div style="margin: 10px;">
<v-typography class="name"
style="font-size: 1.5rem; font-weight: bold;">Marc-Olivier
</v-typography><br> <v-typography class="name" </v-typography><br> <v-typography class="name"
style="font-size: 1.5rem; font-weight: bold;"> style="font-size: 1.5rem; font-weight: bold;">
Hébert</v-typography><br> Hébert</v-typography><br>
<v-typography class="task" style="font-size: 1rem;">Fondateur</v-typography><br> <v-typography class="task" style="font-size: 1rem;">Fondateur</v-typography><br><br>
<v-typography class="text" style="font-size: 0.8rem; text-align: justify;">Avec une <p class="text" style="hyphens: auto; font-size: 0.8rem; text-align: justify;">Avec
une
vision claire et un engagement sans faille, il a lancé Hutopy pour changer la vision claire et un engagement sans faille, il a lancé Hutopy pour changer la
manière dont le contenu est créé et partagé.</v-typography> manière dont le contenu est créé et partagé.</p>
</v-col> </div>
<v-col> </v-card>
<v-card max-width="250px" style="margin: 10px;">
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png" <img class="member-profile-picture"
src="/images/hutopymedia/tospage/membersPictures/profileDominique.png"
alt="Dominic Villemure"> alt="Dominic Villemure">
<br>
<div style="margin: 10px;">
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">Dominic <v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">Dominic
</v-typography><br> </v-typography><br>
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;"> <v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">
Villemure</v-typography><br> Villemure</v-typography><br>
<v-typography class="task" style="font-size: 1rem;">Responsable <v-typography class="task" style="font-size: 1rem;">Responsable
Technique</v-typography><br> Technique</v-typography><br><br>
<v-typography class="text" style="font-size: 0.8rem; text-align: justify;">À la tête de <p class="text" style="hyphens: auto; font-size: 0.8rem; text-align: justify;">À la
notre équipe de développement, il assure qu’Hutopy reste à la pointe de la tête de notre équipe de développement, il assure qu’Hutopy reste à la pointe de
technologie.</v-typography> la technologie.
</v-col> </p>
<v-col> </div>
</v-card>
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png" <v-card max-width="250px" style="margin: 10px;">
alt="Parcal Marchesseault"> <img class="member-profile-picture"
<br> src="/images/hutopymedia/tospage/membersPictures/profilePascal.png"
alt="Pascal Marchesseault">
<div style="margin: 10px;">
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">Pascal <v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">Pascal
</v-typography><br> </v-typography><br>
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;"> <v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">
Marchesseault</v-typography><br> Marchesseault</v-typography><br>
<v-typography class="task" style="font-size: 1rem;">Expérience <v-typography class="task" style="font-size: 1rem;">Expérience
utilisateur</v-typography><br> utilisateur</v-typography><br>
<v-typography class="text" style="font-size: 0.8rem; text-align: justify;">Le champion
de l'expérience utilisateur, il veille à ce que chaque interaction avec Hutopy soit
positive et enrichissante pour tous les utilisateurs.</v-typography>
</v-col>
<v-col>
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png"
alt="Chloé Beaugrand">
<br> <br>
<p class="text" style="hyphens: auto; font-size: 0.8rem; text-align: justify;">Le
champion
de l'expérience utilisateur, il veille à ce que chaque interaction avec Hutopy
soit
positive et enrichissante pour tous les utilisateurs.</p>
</div>
</v-card>
<v-card max-width="250px" style="margin: 10px;">
<img class="member-profile-picture"
src="/images/hutopymedia/tospage/membersPictures/profileChloe.png"
alt="Chloé Beaugrand">
<div style="margin: 10px;">
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">Chloé <v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">Chloé
</v-typography><br> </v-typography><br>
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;"> <v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">
Beaugrand</v-typography><br> Beaugrand</v-typography><br>
<v-typography class="task" style="font-size: 1rem;">Responsable <v-typography class="task" style="font-size: 1rem;">Responsable
Marketing</v-typography><br> Marketing</v-typography><br>
<v-typography class="text" style="font-size: 0.8rem; text-align: justify;">Elle façonne <br>
l'image d’Hutopy et engage notre communauté à travers des campagnes innovantes et <p class="text" style="hyphens: auto; font-size: 0.8rem; text-align: justify;">Elle
impactantes.</v-typography> façonne
</v-col> l'image d’Hutopy et engage notre communauté à travers des campagnes innovantes
et
impactantes.</p>
</div>
</v-card>
<v-card max-width="250px" style="margin: 10px;">
<img class="member-profile-picture"
src="/images/hutopymedia/tospage/membersPictures/profileEdouard.png"
alt="Édouard Letarte">
<div style="margin: 10px;">
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">Édouard
</v-typography><br>
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">
Letarte</v-typography><br>
<v-typography class="task" style="font-size: 1rem;">Intégrateur
</v-typography><br><br>
<p class="text" style="hyphens: auto; font-size: 0.8rem; text-align: justify;">Son
expertise nous permet d'intégrer des fonctionnalités qui permettent à Hutopy de
devenir réalité.</p>
</div>
</v-card>
</v-row> </v-row>
<br>
<p style="margin-top: 25px; margin-bottom: 25px;"> <p style="margin-top: 25px; margin-bottom: 25px;">
@@ -205,4 +251,9 @@ import FooterLayout from '@/layouts/FooterLayout.vue';
.header-text-size { .header-text-size {
font-size: 4rem; font-size: 4rem;
} }
.member-profile-picture {
width: 250px;
height: auto;
}
</style> </style>

12
src/views/tos/ContentPolicy.vue
View File

@@ -11,6 +11,8 @@
</v-col> </v-col>
</v-row> </v-row>
<v-container style="z-index: 100; position: relative;"> <v-container style="z-index: 100; position: relative;">
<v-row justify="center" align="center" style="color:white; margin-top: -250px;" <v-row justify="center" align="center" style="color:white; margin-top: -250px;"
class="header-text-size"> class="header-text-size">
@@ -18,6 +20,16 @@
</v-row> </v-row>
</v-container> </v-container>
<v-row class="fluid d-flex justify-center" style="margin-bottom: 25px; margin-top: 25px;">
<v-col cols="auto">
<router-link :to="{ name: 'home' }">
<v-btn flat style="background-color: #f4f4f4;">
<v-icon left style="margin-right: 10px;">mdi-home</v-icon> Accueil
</v-btn>
</router-link>
</v-col>
</v-row>
<v-container style="z-index: 100; position: relative;"> <v-container style="z-index: 100; position: relative;">
<v-row justify="center" align="center"> <v-row justify="center" align="center">

10
src/views/tos/TermsAndConditions.vue
View File

@@ -18,6 +18,16 @@
</v-row> </v-row>
</v-container> </v-container>
<v-row class="fluid d-flex justify-center" style="margin-bottom: 25px; margin-top: 25px;">
<v-col cols="auto">
<router-link :to="{ name: 'home' }">
<v-btn flat style="background-color: #f4f4f4;">
<v-icon left style="margin-right: 10px;">mdi-home</v-icon> Accueil
</v-btn>
</router-link>
</v-col>
</v-row>
<v-container style="z-index: 100; position: relative;"> <v-container style="z-index: 100; position: relative;">
<v-row justify="center" align="center"> <v-row justify="center" align="center">

107
src/views/tos/Transactions.vue Normal file
View File

@@ -0,0 +1,107 @@
<template>
<body style="background-color: #f4f4f4;">
<DefaultLayout></DefaultLayout>
<div>
<v-row class="fluid" style="margin-top: -30px; position: relative; z-index: 0;" hidden-md-and-down>
<v-col cols="12" class="pa-0" style="width: 100vw; overflow: hidden;">
<v-img class="profile-banner" max-height="375"
src="/images/hutopymedia/tospage/headerbackground.png" cover
style="box-shadow: 0 4px 6px rgba(0, 0, 0, 0.8);"></v-img>
</v-col>
</v-row>
<v-container style="z-index: 100; position: relative;">
<v-row justify="center" align="center" style="color:white; margin-top: -250px;"
class="header-text-size">
<v-typography class="headline text-center">Transactions</v-typography>
</v-row>
</v-container>
<v-row class="fluid d-flex justify-center" style="margin-bottom: 25px; margin-top: 25px;">
<v-col cols="auto">
<router-link :to="{ name: 'home' }">
<v-btn flat style="background-color: #f4f4f4;">
<v-icon left style="margin-right: 10px;">mdi-home</v-icon> Accueil
</v-btn>
</router-link>
</v-col>
</v-row>
<v-container style="z-index: 100; position: relative;">
<v-row justify="center" align="center">
<v-spacer></v-spacer>
<v-col cols="7">
<p style="font-weight: 600; font-size: 2rem; margin-bottom: 25px;">
Transactions
</p>
<p style="margin-top: 25px; margin-bottom: 25px;">
Découvrez Hutopy, l'endroit où la valorisation de votre travail atteint son apogée. Avec une
commission réduite à seulement 9 %, notre engagement envers votre succès est palpable.
Chaque pourcentage prélevé est réinvesti avec soin pour catalyser votre croissance afin de
développer des fonctionnalités innovantes, maintenir une infrastructure technologique de
pointe, et un support utilisateur de premier ordre. Notre objectif ? Amplifier votre
expansion et garantir une expérience utilisateur sans précédent.
</p>
<p style="margin-top: 25px; margin-bottom: 25px;">
Pour chaque transaction, un frais minime assure la sécurité et la fiabilité des paiements,
grâce à un partenaire de confiance mondialement reconnu. Ce dernier sécurise des milliards
en transactions chaque année pour une diversité d'entreprises, à des entreprises en
démarrage aux conglomérats établis. Ce gage de sécurité est disponible pour une somme de 2,9
% plus un 0,30 $ par transaction, une petite contribution pour la tranquillité d'esprit et
la protection de vos revenus.
</p>
<p style="margin-top: 25px; margin-bottom: 25px;">
Notre modèle tarifaire, pensé pour la simplicité et la transparence, a pour ambition ultime
d'optimiser vos gains. Chez Hutopy, la notion de partenariat prend tout son sens : votre
épanouissement est au cœur de nos préoccupations. Bénéficiez d'une plateforme qui élargit
votre horizon créatif et entrepreneurial, tout en vous assurant que vos intérêts et ceux de
vos donnateurs sont précieusement gardés.
</p>
<p style="margin-top: 25px; margin-bottom: 25px;">
Hutopy est plus qu'une plateforme ; c'est une communauté où la transformation de la passion
en profit devient réalité, grâce au soutien indéfectible d'une équipe dévouée à enrichir
votre parcours. Nous vous invitons à nous rejoindre pour explorer ensemble les avenues de
succès, tout en vous garantissant une part conséquente de vos revenus. Embarquez dans une
aventure où votre présence en ligne ne connaît pas de limites, soutenue par Hutopy, votre
allié dans la quête du succès.
</p>
</v-col>
<v-spacer></v-spacer>
</v-row>
</v-container>
</div>
<FooterLayout></FooterLayout>
</body>
</template>
<script setup>
import DefaultLayout from '@/layouts/DefaultLayout.vue';
import FooterLayout from '@/layouts/FooterLayout.vue';
</script>
<style>
.header-text-size {
font-size: 4rem;
}
.member-profile-picture {
width: 250px;
height: auto;
}
</style>

16
staticwebapp.config.json Normal file
View File

@@ -0,0 +1,16 @@
{
"navigationFallback": {
"rewrite": "/index.html",
"exclude": ["/images/*.{png,jpg,gif}", "/css/*"]
},
"mimeTypes": {
".json": "application/json",
".webmanifest": "application/manifest+json"
},
"responseOverrides": {
"404": {
"rewrite": "/index.html",
"statusCode": 200
}
}
}