Merge remote-tracking branch 'origin/main' into feature/oauth
This commit is contained in:
Dominic Villemure
370
package-lock.json
generated
370
package-lock.json
generated
@@ -24,7 +24,7 @@
|
||||
"eslint-plugin-vue": "^9.22.0",
|
||||
"postcss": "^8.4.35",
|
||||
"tailwindcss": "^3.4.1",
|
||||
"vite": "^5.0.11"
|
||||
"vite": "^5.2.11"
|
||||
}
|
||||
},
|
||||
"node_modules/@aashutoshrathi/word-wrap": {
|
||||
@@ -60,9 +60,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/aix-ppc64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.19.12.tgz",
|
||||
"integrity": "sha512-bmoCYyWdEL3wDQIVbcyzRyeKLgk2WtWLTWz1ZIAZF/EGbNOwSA6ew3PftJ1PqMiOOGu0OyFMzG53L0zqIpPeNA==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.20.2.tgz",
|
||||
"integrity": "sha512-D+EBOJHXdNZcLJRBkhENNG8Wji2kgc9AZ9KiPr1JuZjsNtyHzrsfLRrY0tk2H2aoFu6RANO1y1iPPUCDYWkb5g==",
|
||||
"cpu": [
|
||||
"ppc64"
|
||||
],
|
||||
@@ -76,9 +76,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/android-arm": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.19.12.tgz",
|
||||
"integrity": "sha512-qg/Lj1mu3CdQlDEEiWrlC4eaPZ1KztwGJ9B6J+/6G+/4ewxJg7gqj8eVYWvao1bXrqGiW2rsBZFSX3q2lcW05w==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.20.2.tgz",
|
||||
"integrity": "sha512-t98Ra6pw2VaDhqNWO2Oph2LXbz/EJcnLmKLGBJwEwXX/JAN83Fym1rU8l0JUWK6HkIbWONCSSatf4sf2NBRx/w==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
@@ -92,9 +92,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/android-arm64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.19.12.tgz",
|
||||
"integrity": "sha512-P0UVNGIienjZv3f5zq0DP3Nt2IE/3plFzuaS96vihvD0Hd6H/q4WXUGpCxD/E8YrSXfNyRPbpTq+T8ZQioSuPA==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.20.2.tgz",
|
||||
"integrity": "sha512-mRzjLacRtl/tWU0SvD8lUEwb61yP9cqQo6noDZP/O8VkwafSYwZ4yWy24kan8jE/IMERpYncRt2dw438LP3Xmg==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@@ -108,9 +108,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/android-x64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.19.12.tgz",
|
||||
"integrity": "sha512-3k7ZoUW6Q6YqhdhIaq/WZ7HwBpnFBlW905Fa4s4qWJyiNOgT1dOqDiVAQFwBH7gBRZr17gLrlFCRzF6jFh7Kew==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.20.2.tgz",
|
||||
"integrity": "sha512-btzExgV+/lMGDDa194CcUQm53ncxzeBrWJcncOBxuC6ndBkKxnHdFJn86mCIgTELsooUmwUm9FkhSp5HYu00Rg==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -124,9 +124,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/darwin-arm64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.19.12.tgz",
|
||||
"integrity": "sha512-B6IeSgZgtEzGC42jsI+YYu9Z3HKRxp8ZT3cqhvliEHovq8HSX2YX8lNocDn79gCKJXOSaEot9MVYky7AKjCs8g==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.20.2.tgz",
|
||||
"integrity": "sha512-4J6IRT+10J3aJH3l1yzEg9y3wkTDgDk7TSDFX+wKFiWjqWp/iCfLIYzGyasx9l0SAFPT1HwSCR+0w/h1ES/MjA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@@ -140,9 +140,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/darwin-x64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.19.12.tgz",
|
||||
"integrity": "sha512-hKoVkKzFiToTgn+41qGhsUJXFlIjxI/jSYeZf3ugemDYZldIXIxhvwN6erJGlX4t5h417iFuheZ7l+YVn05N3A==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.20.2.tgz",
|
||||
"integrity": "sha512-tBcXp9KNphnNH0dfhv8KYkZhjc+H3XBkF5DKtswJblV7KlT9EI2+jeA8DgBjp908WEuYll6pF+UStUCfEpdysA==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -156,9 +156,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/freebsd-arm64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.19.12.tgz",
|
||||
"integrity": "sha512-4aRvFIXmwAcDBw9AueDQ2YnGmz5L6obe5kmPT8Vd+/+x/JMVKCgdcRwH6APrbpNXsPz+K653Qg8HB/oXvXVukA==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.20.2.tgz",
|
||||
"integrity": "sha512-d3qI41G4SuLiCGCFGUrKsSeTXyWG6yem1KcGZVS+3FYlYhtNoNgYrWcvkOoaqMhwXSMrZRl69ArHsGJ9mYdbbw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@@ -172,9 +172,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/freebsd-x64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.19.12.tgz",
|
||||
"integrity": "sha512-EYoXZ4d8xtBoVN7CEwWY2IN4ho76xjYXqSXMNccFSx2lgqOG/1TBPW0yPx1bJZk94qu3tX0fycJeeQsKovA8gg==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.20.2.tgz",
|
||||
"integrity": "sha512-d+DipyvHRuqEeM5zDivKV1KuXn9WeRX6vqSqIDgwIfPQtwMP4jaDsQsDncjTDDsExT4lR/91OLjRo8bmC1e+Cw==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -188,9 +188,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-arm": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.19.12.tgz",
|
||||
"integrity": "sha512-J5jPms//KhSNv+LO1S1TX1UWp1ucM6N6XuL6ITdKWElCu8wXP72l9MM0zDTzzeikVyqFE6U8YAV9/tFyj0ti+w==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.20.2.tgz",
|
||||
"integrity": "sha512-VhLPeR8HTMPccbuWWcEUD1Az68TqaTYyj6nfE4QByZIQEQVWBB8vup8PpR7y1QHL3CpcF6xd5WVBU/+SBEvGTg==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
@@ -204,9 +204,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-arm64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.19.12.tgz",
|
||||
"integrity": "sha512-EoTjyYyLuVPfdPLsGVVVC8a0p1BFFvtpQDB/YLEhaXyf/5bczaGeN15QkR+O4S5LeJ92Tqotve7i1jn35qwvdA==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.20.2.tgz",
|
||||
"integrity": "sha512-9pb6rBjGvTFNira2FLIWqDk/uaf42sSyLE8j1rnUpuzsODBq7FvpwHYZxQ/It/8b+QOS1RYfqgGFNLRI+qlq2A==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@@ -220,9 +220,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-ia32": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.19.12.tgz",
|
||||
"integrity": "sha512-Thsa42rrP1+UIGaWz47uydHSBOgTUnwBwNq59khgIwktK6x60Hivfbux9iNR0eHCHzOLjLMLfUMLCypBkZXMHA==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.20.2.tgz",
|
||||
"integrity": "sha512-o10utieEkNPFDZFQm9CoP7Tvb33UutoJqg3qKf1PWVeeJhJw0Q347PxMvBgVVFgouYLGIhFYG0UGdBumROyiig==",
|
||||
"cpu": [
|
||||
"ia32"
|
||||
],
|
||||
@@ -236,9 +236,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-loong64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.19.12.tgz",
|
||||
"integrity": "sha512-LiXdXA0s3IqRRjm6rV6XaWATScKAXjI4R4LoDlvO7+yQqFdlr1Bax62sRwkVvRIrwXxvtYEHHI4dm50jAXkuAA==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.20.2.tgz",
|
||||
"integrity": "sha512-PR7sp6R/UC4CFVomVINKJ80pMFlfDfMQMYynX7t1tNTeivQ6XdX5r2XovMmha/VjR1YN/HgHWsVcTRIMkymrgQ==",
|
||||
"cpu": [
|
||||
"loong64"
|
||||
],
|
||||
@@ -252,9 +252,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-mips64el": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.19.12.tgz",
|
||||
"integrity": "sha512-fEnAuj5VGTanfJ07ff0gOA6IPsvrVHLVb6Lyd1g2/ed67oU1eFzL0r9WL7ZzscD+/N6i3dWumGE1Un4f7Amf+w==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.20.2.tgz",
|
||||
"integrity": "sha512-4BlTqeutE/KnOiTG5Y6Sb/Hw6hsBOZapOVF6njAESHInhlQAghVVZL1ZpIctBOoTFbQyGW+LsVYZ8lSSB3wkjA==",
|
||||
"cpu": [
|
||||
"mips64el"
|
||||
],
|
||||
@@ -268,9 +268,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-ppc64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.19.12.tgz",
|
||||
"integrity": "sha512-nYJA2/QPimDQOh1rKWedNOe3Gfc8PabU7HT3iXWtNUbRzXS9+vgB0Fjaqr//XNbd82mCxHzik2qotuI89cfixg==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.20.2.tgz",
|
||||
"integrity": "sha512-rD3KsaDprDcfajSKdn25ooz5J5/fWBylaaXkuotBDGnMnDP1Uv5DLAN/45qfnf3JDYyJv/ytGHQaziHUdyzaAg==",
|
||||
"cpu": [
|
||||
"ppc64"
|
||||
],
|
||||
@@ -284,9 +284,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-riscv64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.19.12.tgz",
|
||||
"integrity": "sha512-2MueBrlPQCw5dVJJpQdUYgeqIzDQgw3QtiAHUC4RBz9FXPrskyyU3VI1hw7C0BSKB9OduwSJ79FTCqtGMWqJHg==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.20.2.tgz",
|
||||
"integrity": "sha512-snwmBKacKmwTMmhLlz/3aH1Q9T8v45bKYGE3j26TsaOVtjIag4wLfWSiZykXzXuE1kbCE+zJRmwp+ZbIHinnVg==",
|
||||
"cpu": [
|
||||
"riscv64"
|
||||
],
|
||||
@@ -300,9 +300,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-s390x": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.19.12.tgz",
|
||||
"integrity": "sha512-+Pil1Nv3Umes4m3AZKqA2anfhJiVmNCYkPchwFJNEJN5QxmTs1uzyy4TvmDrCRNT2ApwSari7ZIgrPeUx4UZDg==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.20.2.tgz",
|
||||
"integrity": "sha512-wcWISOobRWNm3cezm5HOZcYz1sKoHLd8VL1dl309DiixxVFoFe/o8HnwuIwn6sXre88Nwj+VwZUvJf4AFxkyrQ==",
|
||||
"cpu": [
|
||||
"s390x"
|
||||
],
|
||||
@@ -316,9 +316,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/linux-x64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.19.12.tgz",
|
||||
"integrity": "sha512-B71g1QpxfwBvNrfyJdVDexenDIt1CiDN1TIXLbhOw0KhJzE78KIFGX6OJ9MrtC0oOqMWf+0xop4qEU8JrJTwCg==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.20.2.tgz",
|
||||
"integrity": "sha512-1MdwI6OOTsfQfek8sLwgyjOXAu+wKhLEoaOLTjbijk6E2WONYpH9ZU2mNtR+lZ2B4uwr+usqGuVfFT9tMtGvGw==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -332,9 +332,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/netbsd-x64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.19.12.tgz",
|
||||
"integrity": "sha512-3ltjQ7n1owJgFbuC61Oj++XhtzmymoCihNFgT84UAmJnxJfm4sYCiSLTXZtE00VWYpPMYc+ZQmB6xbSdVh0JWA==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.20.2.tgz",
|
||||
"integrity": "sha512-K8/DhBxcVQkzYc43yJXDSyjlFeHQJBiowJ0uVL6Tor3jGQfSGHNNJcWxNbOI8v5k82prYqzPuwkzHt3J1T1iZQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -348,9 +348,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/openbsd-x64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.19.12.tgz",
|
||||
"integrity": "sha512-RbrfTB9SWsr0kWmb9srfF+L933uMDdu9BIzdA7os2t0TXhCRjrQyCeOt6wVxr79CKD4c+p+YhCj31HBkYcXebw==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.20.2.tgz",
|
||||
"integrity": "sha512-eMpKlV0SThJmmJgiVyN9jTPJ2VBPquf6Kt/nAoo6DgHAoN57K15ZghiHaMvqjCye/uU4X5u3YSMgVBI1h3vKrQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -364,9 +364,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/sunos-x64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.19.12.tgz",
|
||||
"integrity": "sha512-HKjJwRrW8uWtCQnQOz9qcU3mUZhTUQvi56Q8DPTLLB+DawoiQdjsYq+j+D3s9I8VFtDr+F9CjgXKKC4ss89IeA==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.20.2.tgz",
|
||||
"integrity": "sha512-2UyFtRC6cXLyejf/YEld4Hajo7UHILetzE1vsRcGL3earZEW77JxrFjH4Ez2qaTiEfMgAXxfAZCm1fvM/G/o8w==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -380,9 +380,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/win32-arm64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.19.12.tgz",
|
||||
"integrity": "sha512-URgtR1dJnmGvX864pn1B2YUYNzjmXkuJOIqG2HdU62MVS4EHpU2946OZoTMnRUHklGtJdJZ33QfzdjGACXhn1A==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.20.2.tgz",
|
||||
"integrity": "sha512-GRibxoawM9ZCnDxnP3usoUDO9vUkpAxIIZ6GQI+IlVmr5kP3zUq+l17xELTHMWTWzjxa2guPNyrpq1GWmPvcGQ==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@@ -396,9 +396,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/win32-ia32": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.19.12.tgz",
|
||||
"integrity": "sha512-+ZOE6pUkMOJfmxmBZElNOx72NKpIa/HFOMGzu8fqzQJ5kgf6aTGrcJaFsNiVMH4JKpMipyK+7k0n2UXN7a8YKQ==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.20.2.tgz",
|
||||
"integrity": "sha512-HfLOfn9YWmkSKRQqovpnITazdtquEW8/SoHW7pWpuEeguaZI4QnCRW6b+oZTztdBnZOS2hqJ6im/D5cPzBTTlQ==",
|
||||
"cpu": [
|
||||
"ia32"
|
||||
],
|
||||
@@ -412,9 +412,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@esbuild/win32-x64": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.19.12.tgz",
|
||||
"integrity": "sha512-T1QyPSDCyMXaO3pzBkF96E8xMkiRYbUEZADd29SyPGabqxMViNoii+NcK7eWJAEoU6RZyEm5lVSIjTmcdoB9HA==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.20.2.tgz",
|
||||
"integrity": "sha512-N49X4lJX27+l9jbLKSqZ6bKNjzQvHaT8IIFUy+YIqmXQdjYCToGWwOItDrfby14c78aDd5NHQl29xingXfCdLQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -675,9 +675,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@rollup/rollup-android-arm-eabi": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.12.0.tgz",
|
||||
"integrity": "sha512-+ac02NL/2TCKRrJu2wffk1kZ+RyqxVUlbjSagNgPm94frxtr+XDL12E5Ll1enWskLrtrZ2r8L3wED1orIibV/w==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.17.2.tgz",
|
||||
"integrity": "sha512-NM0jFxY8bB8QLkoKxIQeObCaDlJKewVlIEkuyYKm5An1tdVZ966w2+MPQ2l8LBZLjR+SgyV+nRkTIunzOYBMLQ==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
@@ -688,9 +688,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-android-arm64": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.12.0.tgz",
|
||||
"integrity": "sha512-OBqcX2BMe6nvjQ0Nyp7cC90cnumt8PXmO7Dp3gfAju/6YwG0Tj74z1vKrfRz7qAv23nBcYM8BCbhrsWqO7PzQQ==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.17.2.tgz",
|
||||
"integrity": "sha512-yeX/Usk7daNIVwkq2uGoq2BYJKZY1JfyLTaHO/jaiSwi/lsf8fTFoQW/n6IdAsx5tx+iotu2zCJwz8MxI6D/Bw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@@ -701,9 +701,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-darwin-arm64": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.12.0.tgz",
|
||||
"integrity": "sha512-X64tZd8dRE/QTrBIEs63kaOBG0b5GVEd3ccoLtyf6IdXtHdh8h+I56C2yC3PtC9Ucnv0CpNFJLqKFVgCYe0lOQ==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.17.2.tgz",
|
||||
"integrity": "sha512-kcMLpE6uCwls023+kknm71ug7MZOrtXo+y5p/tsg6jltpDtgQY1Eq5sGfHcQfb+lfuKwhBmEURDga9N0ol4YPw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@@ -714,9 +714,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-darwin-x64": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.12.0.tgz",
|
||||
"integrity": "sha512-cc71KUZoVbUJmGP2cOuiZ9HSOP14AzBAThn3OU+9LcA1+IUqswJyR1cAJj3Mg55HbjZP6OLAIscbQsQLrpgTOg==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.17.2.tgz",
|
||||
"integrity": "sha512-AtKwD0VEx0zWkL0ZjixEkp5tbNLzX+FCqGG1SvOu993HnSz4qDI6S4kGzubrEJAljpVkhRSlg5bzpV//E6ysTQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -727,9 +727,22 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-arm-gnueabihf": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.12.0.tgz",
|
||||
"integrity": "sha512-a6w/Y3hyyO6GlpKL2xJ4IOh/7d+APaqLYdMf86xnczU3nurFTaVN9s9jOXQg97BE4nYm/7Ga51rjec5nfRdrvA==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.17.2.tgz",
|
||||
"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": [
|
||||
"arm"
|
||||
],
|
||||
@@ -740,9 +753,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-arm64-gnu": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.12.0.tgz",
|
||||
"integrity": "sha512-0fZBq27b+D7Ar5CQMofVN8sggOVhEtzFUwOwPppQt0k+VR+7UHMZZY4y+64WJ06XOhBTKXtQB/Sv0NwQMXyNAA==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.17.2.tgz",
|
||||
"integrity": "sha512-EMMPHkiCRtE8Wdk3Qhtciq6BndLtstqZIroHiiGzB3C5LDJmIZcSzVtLRbwuXuUft1Cnv+9fxuDtDxz3k3EW2A==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@@ -753,9 +766,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-arm64-musl": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.12.0.tgz",
|
||||
"integrity": "sha512-eTvzUS3hhhlgeAv6bfigekzWZjaEX9xP9HhxB0Dvrdbkk5w/b+1Sxct2ZuDxNJKzsRStSq1EaEkVSEe7A7ipgQ==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.17.2.tgz",
|
||||
"integrity": "sha512-NMPylUUZ1i0z/xJUIx6VUhISZDRT+uTWpBcjdv0/zkp7b/bQDF+NfnfdzuTiB1G6HTodgoFa93hp0O1xl+/UbA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@@ -765,10 +778,23 @@
|
||||
"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": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.12.0.tgz",
|
||||
"integrity": "sha512-ix+qAB9qmrCRiaO71VFfY8rkiAZJL8zQRXveS27HS+pKdjwUfEhqo2+YF2oI+H/22Xsiski+qqwIBxVewLK7sw==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.17.2.tgz",
|
||||
"integrity": "sha512-BOaNfthf3X3fOWAB+IJ9kxTgPmMqPPH5f5k2DcCsRrBIbWnaJCgX2ll77dV1TdSy9SaXTR5iDXRL8n7AnoP5cg==",
|
||||
"cpu": [
|
||||
"riscv64"
|
||||
],
|
||||
@@ -778,10 +804,23 @@
|
||||
"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": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.12.0.tgz",
|
||||
"integrity": "sha512-TenQhZVOtw/3qKOPa7d+QgkeM6xY0LtwzR8OplmyL5LrgTWIXpTQg2Q2ycBf8jm+SFW2Wt/DTn1gf7nFp3ssVA==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.17.2.tgz",
|
||||
"integrity": "sha512-Hy7pLwByUOuyaFC6mAr7m+oMC+V7qyifzs/nW2OJfC8H4hbCzOX07Ov0VFk/zP3kBsELWNFi7rJtgbKYsav9QQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -792,9 +831,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-x64-musl": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.12.0.tgz",
|
||||
"integrity": "sha512-LfFdRhNnW0zdMvdCb5FNuWlls2WbbSridJvxOvYWgSBOYZtgBfW9UGNJG//rwMqTX1xQE9BAodvMH9tAusKDUw==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.17.2.tgz",
|
||||
"integrity": "sha512-h1+yTWeYbRdAyJ/jMiVw0l6fOOm/0D1vNLui9iPuqgRGnXA0u21gAqOyB5iHjlM9MMfNOm9RHCQ7zLIzT0x11Q==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -805,9 +844,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-win32-arm64-msvc": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.12.0.tgz",
|
||||
"integrity": "sha512-JPDxovheWNp6d7AHCgsUlkuCKvtu3RB55iNEkaQcf0ttsDU/JZF+iQnYcQJSk/7PtT4mjjVG8N1kpwnI9SLYaw==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.17.2.tgz",
|
||||
"integrity": "sha512-tmdtXMfKAjy5+IQsVtDiCfqbynAQE/TQRpWdVataHmhMb9DCoJxp9vLcCBjEQWMiUYxO1QprH/HbY9ragCEFLA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@@ -818,9 +857,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-win32-ia32-msvc": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.12.0.tgz",
|
||||
"integrity": "sha512-fjtuvMWRGJn1oZacG8IPnzIV6GF2/XG+h71FKn76OYFqySXInJtseAqdprVTDTyqPxQOG9Exak5/E9Z3+EJ8ZA==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.17.2.tgz",
|
||||
"integrity": "sha512-7II/QCSTAHuE5vdZaQEwJq2ZACkBpQDOmQsE6D6XUbnBHW8IAhm4eTufL6msLJorzrHDFv3CF8oCA/hSIRuZeQ==",
|
||||
"cpu": [
|
||||
"ia32"
|
||||
],
|
||||
@@ -831,9 +870,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-win32-x64-msvc": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.12.0.tgz",
|
||||
"integrity": "sha512-ZYmr5mS2wd4Dew/JjT0Fqi2NPB/ZhZ2VvPp7SmvPZb4Y1CG/LRcS6tcRo2cYU7zLK5A7cdbhWnnWmUjoI4qapg==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.17.2.tgz",
|
||||
"integrity": "sha512-TGGO7v7qOq4CYmSBVEYpI1Y5xDuCEnbVC5Vth8mOsW0gDSzxNrVERPc790IGHsrT2dQSimgMr9Ub3Y1Jci5/8w==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@@ -1454,9 +1493,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/esbuild": {
|
||||
"version": "0.19.12",
|
||||
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.19.12.tgz",
|
||||
"integrity": "sha512-aARqgq8roFBj054KvQr5f1sFu0D65G+miZRCuJyJ0G13Zwx7vRar5Zhn2tkQNzIXcBrNVsv/8stehpj+GAjgbg==",
|
||||
"version": "0.20.2",
|
||||
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.20.2.tgz",
|
||||
"integrity": "sha512-WdOOppmUNU+IbZ0PaDiTst80zjnrOkyJNHoKupIcVyU8Lvla3Ugx94VzkQ32Ijqd7UhHJy75gNWDMUekcrSJ6g==",
|
||||
"dev": true,
|
||||
"hasInstallScript": true,
|
||||
"bin": {
|
||||
@@ -1466,29 +1505,29 @@
|
||||
"node": ">=12"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@esbuild/aix-ppc64": "0.19.12",
|
||||
"@esbuild/android-arm": "0.19.12",
|
||||
"@esbuild/android-arm64": "0.19.12",
|
||||
"@esbuild/android-x64": "0.19.12",
|
||||
"@esbuild/darwin-arm64": "0.19.12",
|
||||
"@esbuild/darwin-x64": "0.19.12",
|
||||
"@esbuild/freebsd-arm64": "0.19.12",
|
||||
"@esbuild/freebsd-x64": "0.19.12",
|
||||
"@esbuild/linux-arm": "0.19.12",
|
||||
"@esbuild/linux-arm64": "0.19.12",
|
||||
"@esbuild/linux-ia32": "0.19.12",
|
||||
"@esbuild/linux-loong64": "0.19.12",
|
||||
"@esbuild/linux-mips64el": "0.19.12",
|
||||
"@esbuild/linux-ppc64": "0.19.12",
|
||||
"@esbuild/linux-riscv64": "0.19.12",
|
||||
"@esbuild/linux-s390x": "0.19.12",
|
||||
"@esbuild/linux-x64": "0.19.12",
|
||||
"@esbuild/netbsd-x64": "0.19.12",
|
||||
"@esbuild/openbsd-x64": "0.19.12",
|
||||
"@esbuild/sunos-x64": "0.19.12",
|
||||
"@esbuild/win32-arm64": "0.19.12",
|
||||
"@esbuild/win32-ia32": "0.19.12",
|
||||
"@esbuild/win32-x64": "0.19.12"
|
||||
"@esbuild/aix-ppc64": "0.20.2",
|
||||
"@esbuild/android-arm": "0.20.2",
|
||||
"@esbuild/android-arm64": "0.20.2",
|
||||
"@esbuild/android-x64": "0.20.2",
|
||||
"@esbuild/darwin-arm64": "0.20.2",
|
||||
"@esbuild/darwin-x64": "0.20.2",
|
||||
"@esbuild/freebsd-arm64": "0.20.2",
|
||||
"@esbuild/freebsd-x64": "0.20.2",
|
||||
"@esbuild/linux-arm": "0.20.2",
|
||||
"@esbuild/linux-arm64": "0.20.2",
|
||||
"@esbuild/linux-ia32": "0.20.2",
|
||||
"@esbuild/linux-loong64": "0.20.2",
|
||||
"@esbuild/linux-mips64el": "0.20.2",
|
||||
"@esbuild/linux-ppc64": "0.20.2",
|
||||
"@esbuild/linux-riscv64": "0.20.2",
|
||||
"@esbuild/linux-s390x": "0.20.2",
|
||||
"@esbuild/linux-x64": "0.20.2",
|
||||
"@esbuild/netbsd-x64": "0.20.2",
|
||||
"@esbuild/openbsd-x64": "0.20.2",
|
||||
"@esbuild/sunos-x64": "0.20.2",
|
||||
"@esbuild/win32-arm64": "0.20.2",
|
||||
"@esbuild/win32-ia32": "0.20.2",
|
||||
"@esbuild/win32-x64": "0.20.2"
|
||||
}
|
||||
},
|
||||
"node_modules/escalade": {
|
||||
@@ -2635,9 +2674,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/postcss": {
|
||||
"version": "8.4.35",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.35.tgz",
|
||||
"integrity": "sha512-u5U8qYpBCpN13BsiEB0CbR1Hhh4Gc0zLFuedrHJKMctHCHAGrMdG0PRM/KErzAL3CU6/eckEtmHNB3x6e3c0vA==",
|
||||
"version": "8.4.38",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz",
|
||||
"integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==",
|
||||
"funding": [
|
||||
{
|
||||
"type": "opencollective",
|
||||
@@ -2655,7 +2694,7 @@
|
||||
"dependencies": {
|
||||
"nanoid": "^3.3.7",
|
||||
"picocolors": "^1.0.0",
|
||||
"source-map-js": "^1.0.2"
|
||||
"source-map-js": "^1.2.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^10 || ^12 || >=14"
|
||||
@@ -2940,9 +2979,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/rollup": {
|
||||
"version": "4.12.0",
|
||||
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.12.0.tgz",
|
||||
"integrity": "sha512-wz66wn4t1OHIJw3+XU7mJJQV/2NAfw5OAk6G6Hoo3zcvz/XOfQ52Vgi+AN4Uxoxi0KBBwk2g8zPrTDA4btSB/Q==",
|
||||
"version": "4.17.2",
|
||||
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.17.2.tgz",
|
||||
"integrity": "sha512-/9ClTJPByC0U4zNLowV1tMBe8yMEAxewtR3cUNX5BoEpGH3dQEWpJLr6CLp0fPdYRF/fzVOgvDb1zXuakwF5kQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@types/estree": "1.0.5"
|
||||
@@ -2955,19 +2994,22 @@
|
||||
"npm": ">=8.0.0"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@rollup/rollup-android-arm-eabi": "4.12.0",
|
||||
"@rollup/rollup-android-arm64": "4.12.0",
|
||||
"@rollup/rollup-darwin-arm64": "4.12.0",
|
||||
"@rollup/rollup-darwin-x64": "4.12.0",
|
||||
"@rollup/rollup-linux-arm-gnueabihf": "4.12.0",
|
||||
"@rollup/rollup-linux-arm64-gnu": "4.12.0",
|
||||
"@rollup/rollup-linux-arm64-musl": "4.12.0",
|
||||
"@rollup/rollup-linux-riscv64-gnu": "4.12.0",
|
||||
"@rollup/rollup-linux-x64-gnu": "4.12.0",
|
||||
"@rollup/rollup-linux-x64-musl": "4.12.0",
|
||||
"@rollup/rollup-win32-arm64-msvc": "4.12.0",
|
||||
"@rollup/rollup-win32-ia32-msvc": "4.12.0",
|
||||
"@rollup/rollup-win32-x64-msvc": "4.12.0",
|
||||
"@rollup/rollup-android-arm-eabi": "4.17.2",
|
||||
"@rollup/rollup-android-arm64": "4.17.2",
|
||||
"@rollup/rollup-darwin-arm64": "4.17.2",
|
||||
"@rollup/rollup-darwin-x64": "4.17.2",
|
||||
"@rollup/rollup-linux-arm-gnueabihf": "4.17.2",
|
||||
"@rollup/rollup-linux-arm-musleabihf": "4.17.2",
|
||||
"@rollup/rollup-linux-arm64-gnu": "4.17.2",
|
||||
"@rollup/rollup-linux-arm64-musl": "4.17.2",
|
||||
"@rollup/rollup-linux-powerpc64le-gnu": "4.17.2",
|
||||
"@rollup/rollup-linux-riscv64-gnu": "4.17.2",
|
||||
"@rollup/rollup-linux-s390x-gnu": "4.17.2",
|
||||
"@rollup/rollup-linux-x64-gnu": "4.17.2",
|
||||
"@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"
|
||||
}
|
||||
},
|
||||
@@ -3055,9 +3097,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/source-map-js": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
|
||||
"integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
|
||||
"integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
@@ -3368,14 +3410,14 @@
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/vite": {
|
||||
"version": "5.1.4",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-5.1.4.tgz",
|
||||
"integrity": "sha512-n+MPqzq+d9nMVTKyewqw6kSt+R3CkvF9QAKY8obiQn8g1fwTscKxyfaYnC632HtBXAQGc1Yjomphwn1dtwGAHg==",
|
||||
"version": "5.2.11",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-5.2.11.tgz",
|
||||
"integrity": "sha512-HndV31LWW05i1BLPMUCE1B9E9GFbOu1MbenhS58FuK6owSO5qHm7GiCotrNY1YE5rMeQSFBGmT5ZaLEjFizgiQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"esbuild": "^0.19.3",
|
||||
"postcss": "^8.4.35",
|
||||
"rollup": "^4.2.0"
|
||||
"esbuild": "^0.20.1",
|
||||
"postcss": "^8.4.38",
|
||||
"rollup": "^4.13.0"
|
||||
},
|
||||
"bin": {
|
||||
"vite": "bin/vite.js"
|
||||
|
||||
@@ -25,6 +25,6 @@
|
||||
"eslint-plugin-vue": "^9.22.0",
|
||||
"postcss": "^8.4.35",
|
||||
"tailwindcss": "^3.4.1",
|
||||
"vite": "^5.0.11"
|
||||
"vite": "^5.2.11"
|
||||
}
|
||||
}
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 64 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 65 KiB After Width: | Height: | Size: 88 KiB |
BIN
public/images/hutopymedia/icons/black/arpsblack.png
Normal file
BIN
public/images/hutopymedia/icons/black/arpsblack.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
public/images/hutopymedia/icons/black/leffetblack.png
Normal file
BIN
public/images/hutopymedia/icons/black/leffetblack.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 56 KiB |
BIN
public/images/hutopymedia/icons/black/linkedinblack.png
Normal file
BIN
public/images/hutopymedia/icons/black/linkedinblack.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
BIN
public/images/hutopymedia/icons/black/tiktokblack.png
Normal file
BIN
public/images/hutopymedia/icons/black/tiktokblack.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
public/images/hutopymedia/icons/black/youtube.png
Normal file
BIN
public/images/hutopymedia/icons/black/youtube.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 614 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 711 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 508 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 554 KiB |
BIN
public/images/usersmedia/ARPS/banners/bannerARPS01.png
Normal file
BIN
public/images/usersmedia/ARPS/banners/bannerARPS01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 MiB |
BIN
public/images/usersmedia/ARPS/profilepictures/profileARPS.jpg
Normal file
BIN
public/images/usersmedia/ARPS/profilepictures/profileARPS.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
BIN
public/images/usersmedia/ARPS/profilepictures/profileARPS.png
Normal file
BIN
public/images/usersmedia/ARPS/profilepictures/profileARPS.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
BIN
public/images/usersmedia/HutopyProfile/banners/banner01.png
Normal file
BIN
public/images/usersmedia/HutopyProfile/banners/banner01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 MiB |
BIN
public/images/usersmedia/HutopyProfile/pictures/version.png
Normal file
BIN
public/images/usersmedia/HutopyProfile/pictures/version.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.8 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 385 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.7 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 494 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 454 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 700 KiB |
BIN
public/images/usersmedia/leffet/banners/banner01.png
Normal file
BIN
public/images/usersmedia/leffet/banners/banner01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.6 MiB |
BIN
public/images/usersmedia/leffet/banners/banner02.jpg
Normal file
BIN
public/images/usersmedia/leffet/banners/banner02.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 163 KiB |
BIN
public/images/usersmedia/leffet/banners/banner02.png
Normal file
BIN
public/images/usersmedia/leffet/banners/banner02.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 206 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 420 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 MiB |
@@ -1,34 +1,42 @@
|
||||
<template>
|
||||
|
||||
<body style="background-color: #f4f4f4;">
|
||||
|
||||
<!-- 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-row justify="end" style="margin-top: .2%; margin-bottom: -1.2%;">
|
||||
<v-menu>
|
||||
<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">
|
||||
|
||||
<!-- Profile picture in the top right corner -->
|
||||
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png"
|
||||
class="header-profile-icon mr-2" alt="Logo">
|
||||
<v-btn flat style="min-width: 200px; font-size: 1.3rem;" dark v-bind="props">
|
||||
ANONYME
|
||||
<v-btn flat style="min-width: 200px; font-size: 1.3rem;" dark v-bind="props" ref="walletActivator">
|
||||
{{ currentUserName }}
|
||||
</v-btn>
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
|
||||
<!-- Dropdown Menu Profile/Connection -->
|
||||
<v-list style="padding: 0;">
|
||||
<v-list-item>
|
||||
<v-list-item v-if="!currentUser">
|
||||
<router-link :to="{ name: 'contact' }">
|
||||
<v-btn class="full-width-btn" flat>Inscription</v-btn>
|
||||
</router-link>
|
||||
</v-list-item>
|
||||
<!-- <v-list-item>
|
||||
<v-btn class="full-width-btn" flat>Mon profil</v-btn>
|
||||
</v-list-item>-->
|
||||
<v-list-item v-if="currentUser">
|
||||
<v-btn @click="openWalletDialog" class="full-width-btn" flat>
|
||||
<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-menu>
|
||||
</v-row>
|
||||
@@ -36,12 +44,11 @@
|
||||
</v-card>
|
||||
|
||||
<!-- 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-nav-icon @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
|
||||
<v-row>
|
||||
<v-col cols="11" class="d-flex align-center justify-center">
|
||||
|
||||
<!-- Logo Top bar -->
|
||||
<img src="/images/hutopymedia/banners/hutopy.png" class="mobile-header" alt="Logo">
|
||||
</v-col>
|
||||
@@ -51,7 +58,7 @@
|
||||
<!-- Left-side Menu -->
|
||||
<v-navigation-drawer v-model="drawer" temporary>
|
||||
<v-list>
|
||||
<v-list-item subtitle="email" title="ANONYME">
|
||||
<v-list-item :title="currentUserName">
|
||||
<template v-slot:prepend>
|
||||
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png"
|
||||
class="mobile-profile-picture mini-profile-picture" alt="Avatar">
|
||||
@@ -63,27 +70,115 @@
|
||||
<v-divider></v-divider>
|
||||
<v-list density="compact" nav>
|
||||
<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>
|
||||
</router-link>
|
||||
<RouterLink :to="{ name: 'contact' }">
|
||||
<v-list-item prepend-icon="mdi-account-multiple" title="Amis" value="friends"></v-list-item>
|
||||
</RouterLink>
|
||||
<!-- <v-list-item prepend-icon="mdi-newspaper" title="Contenu" value="content"></v-list-item>-->
|
||||
<!-- <v-list-item prepend-icon="mdi-wallet" title="Portefeuille" value="wallet"></v-list-item>-->
|
||||
<!-- <v-list-item style="margin-top: 110%;" prepend-icon="mdi-logout" title="Déconnexion"
|
||||
value="logout"></v-list-item>-->
|
||||
<router-link :to="{ name: 'userbrowser' }">
|
||||
<v-list-item prepend-icon="mdi-account-multiple" title="Créateurs" value="friends"></v-list-item>
|
||||
</router-link>
|
||||
<router-link :to="{ name: 'contact' }">
|
||||
<v-list-item prepend-icon="mdi-handshake" title="Aidez-nous" value="friends"></v-list-item>
|
||||
</router-link>
|
||||
|
||||
<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-navigation-drawer>
|
||||
</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>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
const drawer = ref(false);
|
||||
</script>
|
||||
<script async setup>
|
||||
import MyUserModel from "@/models/myUserModel.js";
|
||||
import { useClient } from "@/plugins/api.js";
|
||||
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>
|
||||
.full-width-btn {
|
||||
@@ -107,16 +202,15 @@ const drawer = ref(false);
|
||||
|
||||
.mobile-profile-picture {
|
||||
height: 40px;
|
||||
border-radius: px;
|
||||
border-radius: 50px;
|
||||
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
|
||||
border: 2px solid #a30e79;
|
||||
margin-right: 10px
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.header-banner {
|
||||
border-top: 5px solid rgba(107, 0, 101, 1);
|
||||
margin-top: 15%;
|
||||
|
||||
}
|
||||
|
||||
.social-container {
|
||||
@@ -132,12 +226,21 @@ const drawer = ref(false);
|
||||
font-size: 1.4rem;
|
||||
font-weight: 800;
|
||||
color: white;
|
||||
min-width: 400px;
|
||||
|
||||
}
|
||||
|
||||
.mobile-header {
|
||||
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>
|
||||
@@ -35,9 +35,10 @@
|
||||
|
||||
<!-- Need X Account -->
|
||||
<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">
|
||||
</router-link>
|
||||
</a>
|
||||
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
@@ -68,7 +69,8 @@ const links = [
|
||||
'Guide pour les créateurs',
|
||||
'Conditions générales',
|
||||
'Politique de Contenu',
|
||||
'À Propos'
|
||||
'À Propos',
|
||||
'Transactions'
|
||||
];
|
||||
|
||||
const linkRoutes = {
|
||||
@@ -77,7 +79,8 @@ const linkRoutes = {
|
||||
'Guide pour les créateurs': { name: 'guideforcreators' },
|
||||
'Conditions générales': { name: 'termsandconditions' },
|
||||
'Politique de Contenu': { name: 'contentpolicy' },
|
||||
'À Propos': { name: 'about' }
|
||||
'À Propos': { name: 'about' },
|
||||
'Transactions': { name: 'transactions' }
|
||||
};
|
||||
|
||||
// If broken link, redirect to home page.
|
||||
|
||||
160
src/layouts/PostContentMenu.vue
Normal file
160
src/layouts/PostContentMenu.vue
Normal 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
0
src/layouts/postcomponents/postimagecomponents
Normal file
24
src/models/myUserModel.js
Normal file
24
src/models/myUserModel.js
Normal 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
23
src/models/userTransactionsModel.js
Normal 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;
|
||||
}
|
||||
}
|
||||
@@ -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 ContentPolicy from '@/views/tos/ContentPolicy.vue'
|
||||
import FAQ from '@/views/tos/FAQ.vue'
|
||||
import GuideForCreators from '@/views/tos/GuideForCreators.vue'
|
||||
import HelpAndContact from '@/views/tos/HelpAndContact.vue'
|
||||
import TermsAndConditions from '@/views/tos/TermsAndConditions.vue'
|
||||
import Transactions from '@/views/tos/Transactions.vue'
|
||||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
import LoginView from '../views/LoginView.vue'
|
||||
import PaymentCompleted from '../views/PayementCompleted.vue'
|
||||
import SignupView from '../views/SignupView.vue'
|
||||
import UserBrowser from '../views/UsersBrowser.vue'
|
||||
import ContactView from '../views/main/ContactView.vue'
|
||||
import CreatorFolio from '../views/main/CreatorFolio.vue'
|
||||
import PaymentCompleted from '../views/PayementCompleted.vue'
|
||||
import HomeView from '../views/main/HomeView.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({
|
||||
history: createWebHistory(import.meta.env.BASE_URL),
|
||||
@@ -23,7 +30,7 @@ const router = createRouter({
|
||||
component: HomeView
|
||||
},
|
||||
{
|
||||
path: '/guillaumeaime',
|
||||
path: '/creatorfolio',
|
||||
name: 'creatorfolio',
|
||||
component: CreatorFolio
|
||||
},
|
||||
@@ -89,6 +96,62 @@ const router = createRouter({
|
||||
name: '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) {
|
||||
return { top: 0 };
|
||||
|
||||
@@ -24,12 +24,12 @@
|
||||
<v-card-text>
|
||||
<v-form class="label-mail-password">
|
||||
<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"
|
||||
label="Mot de passe" class="text-start"></v-text-field>
|
||||
</v-form>
|
||||
<v-snackbar v-model="errorSnackBar">
|
||||
Email ou mot de passe invalide.
|
||||
Nom d'utilisateur ou mot de passe invalide.
|
||||
<template v-slot:actions>
|
||||
<v-btn color="red" variant="text" @click="errorSnackBar = false">Fermer</v-btn>
|
||||
</template>
|
||||
@@ -68,7 +68,7 @@
|
||||
vous connecter à votre compte?</h2>
|
||||
|
||||
<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"
|
||||
label="Mot de passe"></v-text-field>
|
||||
</v-form>
|
||||
|
||||
@@ -1,44 +1,113 @@
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<v-card class="custom-dialog" style="background-color: #f4f4f4;">
|
||||
|
||||
<body style="background-color: #f4f4f4;">
|
||||
|
||||
<DefaultLayout></DefaultLayout>
|
||||
<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">
|
||||
|
||||
<!-- Icon Check -->
|
||||
<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-row>
|
||||
|
||||
<!-- Informations -->
|
||||
<v-row justify="center">
|
||||
<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;">
|
||||
Merci de supporter
|
||||
</v-card-text>
|
||||
<v-card-text style="font-weight: 600; font-size: 1.6rem; text-align: center;">
|
||||
Guillaume Mousseau
|
||||
<v-card-text style="font-weight: 600; font-size: 1.6rem; text-align: center; margin-bottom: 10px;">
|
||||
{{ creatorName }}
|
||||
</v-card-text>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<!-- Ok btn -->
|
||||
<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-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-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</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>
|
||||
</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>
|
||||
|
||||
@@ -2,12 +2,11 @@
|
||||
<v-container>
|
||||
|
||||
<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">
|
||||
</v-text-field>
|
||||
</v-row>
|
||||
|
||||
|
||||
<v-row>
|
||||
<v-text-field label="Montant ($)" v-model="price"
|
||||
style="border-radius: 10px; margin-bottom: 10px; color: #a30e79; background-color: #f4f4f4">
|
||||
@@ -24,7 +23,6 @@
|
||||
</v-btn>
|
||||
</v-row>
|
||||
|
||||
|
||||
<v-dialog v-model="isPaymentDialogActive" max-width="720" persistent>
|
||||
<template v-slot:default>
|
||||
<v-card>
|
||||
@@ -40,10 +38,6 @@
|
||||
</v-dialog>
|
||||
</v-container>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@@ -51,6 +45,8 @@ import { useClient } from '@/plugins/api.js';
|
||||
import { loadStripe } from '@stripe/stripe-js';
|
||||
import { onMounted, ref } from "vue";
|
||||
|
||||
const props = defineProps(['creatorId'])
|
||||
|
||||
let stripe = null;
|
||||
const client = useClient();
|
||||
const price = ref(0);
|
||||
@@ -72,7 +68,7 @@ async function createCheckoutSession() {
|
||||
let clientSecret = await client.post('/api/Stripe', {
|
||||
amount: (price.value * 100),
|
||||
tipMessage: tipMessage.value,
|
||||
creatorId: "5b122430-442a-4967-98b6-6c7787c70c91"
|
||||
creatorId: props.creatorId
|
||||
});
|
||||
|
||||
let secret = clientSecret["data"];
|
||||
|
||||
883
src/views/UsersBrowser.vue
Normal file
883
src/views/UsersBrowser.vue
Normal 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>
|
||||
@@ -33,10 +33,12 @@
|
||||
<h1 class="h2-Participez-au-développement">PARTICIPEZ AU DÉVELOPPEMENT</h1>
|
||||
<v-text-field v-model="name" label="Nom" style="color: rgb(107, 0, 101);"></v-text-field>
|
||||
<v-text-field v-model="emailAddress" label="Courriel" style="color: rgb(107, 0, 101);"></v-text-field>
|
||||
<v-textarea v-model="reasonToJoin" style="color: rgb(107, 0, 101)" label="Pourquoi voulez-vous participer au développement?"
|
||||
placeholder="Écrivez votre message ici" rows="3" auto-grow></v-textarea>
|
||||
<v-textarea v-model="socialNetworkAccount" style="color: rgb(107, 0, 101)" label="Avez-vous déjà des comptes sur les réseaux sociaux?"
|
||||
placeholder="Écrivez votre message ici" rows="3" auto-grow></v-textarea>
|
||||
<v-textarea v-model="reasonToJoin" style="color: rgb(107, 0, 101)"
|
||||
label="Pourquoi voulez-vous participer au développement?" placeholder="Écrivez votre message ici"
|
||||
rows="3" auto-grow></v-textarea>
|
||||
<v-textarea v-model="socialNetworkAccount" style="color: rgb(107, 0, 101)"
|
||||
label="Avez-vous déjà des comptes sur les réseaux sociaux?" placeholder="Écrivez votre message ici"
|
||||
rows="3" auto-grow></v-textarea>
|
||||
<v-btn @click="sendForm()" style="background-color: rgb(163, 14, 121); color: white; font-weight: bold;"
|
||||
class="mt-4 send-btn" block>Envoyez
|
||||
</v-btn>
|
||||
@@ -101,16 +103,19 @@
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<!-- Form Information -->+
|
||||
<v-text-field v-model="name" class="labelsize" label="Nom" style="margin-top: 5%; color: rgb(107, 0, 101);"></v-text-field>
|
||||
<v-text-field v-model="emailAddress" class="labelsize" label="Courriel" style="color: rgb(107, 0, 101);"></v-text-field>
|
||||
<!-- Form Information -->
|
||||
<v-text-field v-model="name" class="labelsize" label="Nom"
|
||||
style="margin-top: 5%; color: rgb(107, 0, 101);"></v-text-field>
|
||||
<v-text-field v-model="emailAddress" class="labelsize" label="Courriel"
|
||||
style="color: rgb(107, 0, 101);"></v-text-field>
|
||||
<v-textarea v-model="reasonToJoin" class="labelsize" style="color: rgb(107, 0, 101)"
|
||||
label="Pourquoi voulez-vous participer au développement?" placeholder="Écrivez votre message ici" rows="3"
|
||||
auto-grow></v-textarea>
|
||||
<v-textarea v-model="socialNetworkAccount" class="labelsize" style="color: rgb(107, 0, 101)"
|
||||
label="Avez-vous déjà des comptes sur les réseaux sociaux?" placeholder="Écrivez votre message ici" rows="3"
|
||||
auto-grow></v-textarea>
|
||||
<v-btn @click="sendForm()" style="background-color: rgb(163, 14, 121); margin-bottom: 8%; color: white; font-weight: bold;"
|
||||
<v-btn @click="sendForm()"
|
||||
style="background-color: rgb(163, 14, 121); margin-bottom: 8%; color: white; font-weight: bold;"
|
||||
class="mt-4 send-btn" block>
|
||||
Envoyez
|
||||
</v-btn>
|
||||
@@ -182,8 +187,8 @@
|
||||
<script setup>
|
||||
import DefaultLayout from '@/layouts/DefaultLayout.vue';
|
||||
import FooterLayout from '@/layouts/FooterLayout.vue';
|
||||
import { ref } from 'vue';
|
||||
import { useClient } from "@/plugins/api.js";
|
||||
import { ref } from 'vue';
|
||||
|
||||
const client = useClient();
|
||||
|
||||
|
||||
@@ -35,7 +35,7 @@
|
||||
</v-col>
|
||||
<!-- Instagram -->
|
||||
<v-col cols="2" sm="2" xs="3" style="margin-top: 60px; z-index: 50;" class="d-flex justify-center align-center">
|
||||
<a href="https://www.instagram.com/p/C2f-3UnNdfX//">
|
||||
<a href="https://www.instagram.com/guillaumeaime/">
|
||||
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/instagramblack.png"
|
||||
alt="Instagram"></v-img>
|
||||
</a>
|
||||
@@ -46,12 +46,7 @@
|
||||
<v-img :src="profilePicture" class="elevation-4 mobile-profile-picture-creator"></v-img>
|
||||
</v-row>
|
||||
</v-col>
|
||||
<!-- X
|
||||
<v-col cols="2" sm="2" xs="3" style="margin-top: 60px; z-index: 50;" class="d-flex justify-center align-center">
|
||||
<a href="https://www.x.com/">
|
||||
<v-img class="socialicons-mobile" src="/images/hutopymedia/icons/black/xblack.png" alt="X"></v-img>
|
||||
</a>
|
||||
</v-col> -->
|
||||
|
||||
<!-- TikTok -->
|
||||
<v-col cols="2" sm="2" xs="3" style="margin-top: 60px; z-index: 50;" class="d-flex justify-center align-center">
|
||||
<a href="https://www.tiktok.com/@guillaumeaime">
|
||||
@@ -59,18 +54,25 @@
|
||||
alt="TikTok"></v-img>
|
||||
</a>
|
||||
</v-col>
|
||||
|
||||
|
||||
|
||||
|
||||
<v-spacer class="hidden-xs"> </v-spacer>
|
||||
|
||||
|
||||
</v-row>
|
||||
|
||||
<!-- User informations Name title and description -->
|
||||
<v-row class="social-container-mobile">
|
||||
<v-col cols="12" xs="12" sm="4" class="d-flex justify-center">
|
||||
<v-row>
|
||||
<v-row class="d-flex justify-center">
|
||||
{{ name }}
|
||||
</v-row>
|
||||
</v-col>
|
||||
<v-spacer xs="12" sm="4"></v-spacer>
|
||||
<v-col cols="12" xs="12" sm="4" class="d-flex justify-center">
|
||||
<v-row>
|
||||
<v-row class="d-flex justify-center">
|
||||
{{ title }}
|
||||
</v-row>
|
||||
</v-col>
|
||||
@@ -253,11 +255,6 @@
|
||||
<img class="socialicons" src="/images/hutopymedia/icons/black/instagramblack.png"
|
||||
alt="Description image 2">
|
||||
</a>
|
||||
<!-- x
|
||||
<a href="https://www.facebook.com/profile.php?id=61556819217561">
|
||||
<img class="socialicons" src="/images/hutopymedia/icons/black/xblack.png"
|
||||
alt="Description image 2">
|
||||
</a> -->
|
||||
|
||||
<a href="https://www.tiktok.com/@guillaumeaime">
|
||||
<img class="socialicons invert-color" src="/images/hutopymedia/icons/white/tiktokwhite.png"
|
||||
@@ -287,6 +284,8 @@
|
||||
</v-container>
|
||||
|
||||
|
||||
<PostContentMenu style="margin-top: -30px;"></PostContentMenu>
|
||||
|
||||
|
||||
<!-- Card youtube balado -->
|
||||
<v-container>
|
||||
@@ -309,8 +308,7 @@
|
||||
</v-col>
|
||||
|
||||
<!-- Card core Video/image & text -->
|
||||
<div
|
||||
style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%; margin-bottom: -5%;">
|
||||
<div style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%">
|
||||
<v-container>
|
||||
<iframe class="card-youtube" style="margin-left: 2.1%; width: 96%;"
|
||||
src="https://www.youtube.com/embed/pf95whtA_xs?start=0" title="Guillaumem" frameborder="0"
|
||||
@@ -320,14 +318,14 @@
|
||||
<!-- Date -->
|
||||
<v-row class="text-right">
|
||||
<v-col>
|
||||
<h1 style=" margin-right: 40px; margin-top: 10px">
|
||||
<h1 style=" margin-right: 40px; margin-top: 10px" class="card-date">
|
||||
24-04-2024
|
||||
</h1>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
|
||||
<p class="text-justify pa-10" style="margin-bottom: -3%; font-size: 1em">C’est un honneur de vous
|
||||
<p class="text-justify pa-10" style="margin-bottom: -50px; font-size: 1em">C’est un honneur de vous
|
||||
présenter
|
||||
mon tout premier balado. Dans ce premier épisode, les passionnés de cinéma et de gadgets seront
|
||||
particulièrement gâtés, car je dévoile les gadgets que j'utilise professionnellement. Par la suite, je
|
||||
@@ -349,13 +347,14 @@
|
||||
</div>
|
||||
|
||||
<!-- Comments -->
|
||||
<v-text-field style="margin-left: 2%; margin-bottom: 15px;"
|
||||
placeholder="Commentaire (Commentaire, Aime et Partagez sont non fonctionnel pour le moment)"></v-text-field>
|
||||
<v-text-field style="margin-left: 2%; margin-bottom: 15px; margin-bottom: -20px"
|
||||
placeholder="Commentaire (Arrive bientôt)"></v-text-field>
|
||||
</v-container>
|
||||
</div>
|
||||
</v-card>
|
||||
</v-container>
|
||||
|
||||
|
||||
<!-- Card nouvelle boutique -->
|
||||
<v-container>
|
||||
<v-card class="flow-menu m-0 youtube-card">
|
||||
@@ -366,8 +365,8 @@
|
||||
<h1 class="card-title">
|
||||
NOUVELLE BOUTIQUE À SAINT-HYACINTHE</h1>
|
||||
</v-col>
|
||||
<!--
|
||||
<v-col class="text-right">
|
||||
|
||||
<!--<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)
|
||||
@@ -377,8 +376,7 @@
|
||||
</v-col>
|
||||
|
||||
<!-- Card core Video/image & text -->
|
||||
<div
|
||||
style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%; margin-bottom: -5%;">
|
||||
<div style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%">
|
||||
<v-container>
|
||||
<v-img src="images/usersmedia/guillaumeMousseau/pictures/posts/nouvelleboutique.jpg"
|
||||
title="Guillaumem"></v-img>
|
||||
@@ -386,13 +384,14 @@
|
||||
<!-- Date -->
|
||||
<v-row class="text-right">
|
||||
<v-col>
|
||||
<h1 style=" margin-right: 40px; margin-top: 10px">
|
||||
23-04-2024
|
||||
<h1 style=" margin-right: 40px; margin-top: 10px" class="card-date">
|
||||
24-04-2024
|
||||
</h1>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<p class="text-justify pa-10" style="margin-bottom: -3%; font-size: 1em">J’ai découvert une nouvelle
|
||||
|
||||
<p class="text-justify pa-10" style="margin-bottom: -6%; font-size: 1em">J’ai découvert une nouvelle
|
||||
boutique
|
||||
à St-Hyacinthe qui embrasse exactement ma philosophie derrière la page Guillaume Aime: faire découvrir
|
||||
le
|
||||
@@ -405,6 +404,7 @@
|
||||
Carl
|
||||
pour ce projet!</p>
|
||||
|
||||
|
||||
<!-- Like dislike commment Section -->
|
||||
<div style="height: 20px;"></div>
|
||||
<div
|
||||
@@ -414,8 +414,8 @@
|
||||
</div>
|
||||
|
||||
<!-- Comments -->
|
||||
<v-text-field style="margin-left: 2%; margin-bottom: 15px;"
|
||||
placeholder="Commentaire (Commentaire, Aime et Partagez sont non fonctionnel pour le moment)"></v-text-field>
|
||||
<v-text-field style="margin-left: 2%; margin-bottom: 15px; margin-bottom: -20px"
|
||||
placeholder="Commentaire (Arrive bientôt)"></v-text-field>
|
||||
</v-container>
|
||||
</div>
|
||||
</v-card>
|
||||
@@ -442,8 +442,7 @@
|
||||
</v-col>
|
||||
|
||||
<!-- Card core Video/image & text -->
|
||||
<div
|
||||
style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%; margin-bottom: -5%;">
|
||||
<div style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%">
|
||||
<v-container>
|
||||
<v-img src="images/usersmedia/guillaumeMousseau/pictures/posts/cestparti.jpg"
|
||||
title="Guillaumem"></v-img>
|
||||
@@ -451,13 +450,13 @@
|
||||
<!-- Date -->
|
||||
<v-row class="text-right">
|
||||
<v-col>
|
||||
<h1 style=" margin-right: 40px; margin-top: 10px">
|
||||
<h1 style=" margin-right: 40px; margin-top: 10px" class="card-date">
|
||||
22-04-2024
|
||||
</h1>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<p class="text-justify pa-10" style="margin-bottom: -3%; font-size: 1em">C'est parti pour 2024 ! De
|
||||
<p class="text-justify pa-10" style="margin-bottom: -6%; font-size: 1em">C'est parti pour 2024 ! De
|
||||
retour au
|
||||
travail officiellement ce matin afin d'aider les entreprises de la région à rayonner ! Mettre en
|
||||
lumière les
|
||||
@@ -474,8 +473,8 @@
|
||||
</div>
|
||||
|
||||
<!-- Comments -->
|
||||
<v-text-field style="margin-left: 2%; margin-bottom: 15px;"
|
||||
placeholder="Commentaire (Commentaire, Aime et Partagez sont non fonctionnel pour le moment)"></v-text-field>
|
||||
<v-text-field style="margin-left: 2%; margin-bottom: 15px; margin-bottom: -20px"
|
||||
placeholder="Commentaire (Arrive bientôt)"></v-text-field>
|
||||
</v-container>
|
||||
</div>
|
||||
</v-card>
|
||||
@@ -542,6 +541,7 @@
|
||||
<script setup>
|
||||
import DefaultLayout from '@/layouts/DefaultLayout.vue';
|
||||
import FooterLayout from '@/layouts/FooterLayout.vue';
|
||||
import PostContentMenu from '@/layouts/PostContentMenu.vue';
|
||||
import { ref } from 'vue';
|
||||
import StripePayment from '../StripePayment.vue';
|
||||
let imageSrc = '/images/usersmedia/guillaumeMousseau/banners/bannerGuillaumeMousseau01.png';
|
||||
@@ -552,8 +552,8 @@ let drawerbottom = ref(false)
|
||||
|
||||
let navigationItems = [
|
||||
{ icon: 'mdi-home', text: 'Accueil', link: 'home' },
|
||||
{ icon: 'mdi-account-group', text: 'Amis', link: '/contact' },
|
||||
//{ icon: 'mdi-file-document-outline', text: 'Contenu', link: '/creatorfolio' }
|
||||
{ icon: 'mdi-account-group', text: 'Utilisateur', link: '/userbrowser' },
|
||||
{ icon: 'mdi-handshake', text: 'Aidez-nous', link: '/contact' },
|
||||
];
|
||||
</script>
|
||||
|
||||
@@ -562,6 +562,7 @@ let navigationItems = [
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
|
||||
.Hutopy-menu-sticky-mobile {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
@@ -682,9 +683,13 @@ let navigationItems = [
|
||||
|
||||
.card-date {
|
||||
margin-left: 10px;
|
||||
margin-top: -18px
|
||||
margin-top: -18px;
|
||||
margin-bottom: -20px;
|
||||
font-size: .8rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.social-container {
|
||||
background-color: #006d77;
|
||||
border-top-right-radius: 30px;
|
||||
@@ -766,6 +771,7 @@ let navigationItems = [
|
||||
|
||||
.profile-banner {
|
||||
margin-top: 25px;
|
||||
min-height: 200px
|
||||
}
|
||||
|
||||
.v-navigation-drawer {
|
||||
@@ -1089,6 +1095,9 @@ let navigationItems = [
|
||||
}
|
||||
|
||||
@media (min-width: 2560px) {
|
||||
|
||||
|
||||
|
||||
.mobile-profile-picture-creator {
|
||||
transform: scale(1.5) translateY(25%) translateX(-20px);
|
||||
}
|
||||
|
||||
@@ -162,7 +162,7 @@
|
||||
style="margin-top: 3%; margin-bottom: 5%; max-width: 900px;">
|
||||
Bienvenue sur Hutopy, votre nouvelle frontière de création, de connexion et d'innovation. Au
|
||||
cœur de notre mission réside une ambition audacieuse : transformer l'espace numérique en un
|
||||
écosystème où chaque créateur, chaque rêveur, chaque professionnel, peut non seulement imaginer
|
||||
écosystème où chaque créateur, chaque rêveur, chaque professionnel, peut non seulement imaginer,
|
||||
mais concrétiser son utopie personnelle. Hutopy est plus qu'une simple plateforme c'est une
|
||||
communauté vibrante qui défie les conventions de l’éducation, encourage l'originalité et célèbre
|
||||
la créativité.
|
||||
@@ -226,25 +226,31 @@
|
||||
<!-- Account links -->
|
||||
<v-row justify="center" class="profile-images">
|
||||
<v-col>
|
||||
<router-link :to="{ name: 'creatorfolio' }">
|
||||
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image"
|
||||
class="profile-image ">
|
||||
<router-link :to="{ name: 'Hutopy' }">
|
||||
<img src="/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile02.png"
|
||||
alt="Profile Image" class="profile-image ">
|
||||
</router-link>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<router-link :to="{ name: 'creatorfolio' }">
|
||||
<router-link :to="{ name: 'guillaumeaime' }">
|
||||
<img src="/images/usersmedia/guillaumeMousseau/profilepictures/profileGuillaumeMousseau01.jpg"
|
||||
alt="Profile Image" class="profile-image">
|
||||
</router-link>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<router-link :to="{ name: 'creatorfolio' }">
|
||||
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image"
|
||||
class="profile-image">
|
||||
<router-link :to="{ name: 'chloebeaugrand' }">
|
||||
<img src="/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand02.png"
|
||||
alt="Profile Image" class="profile-image">
|
||||
</router-link>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
<v-row justify='center'>
|
||||
<router-link :to="{ name: 'userbrowser' }">
|
||||
<v-btn style="border-radius:10px; background-color:#a30e79; color:white">Découvre les autres créateurs
|
||||
</v-btn>
|
||||
</router-link>
|
||||
</v-row>
|
||||
<v-spacer></v-spacer>
|
||||
</v-col>
|
||||
<v-spacer></v-spacer>
|
||||
@@ -314,7 +320,7 @@
|
||||
<p style="margin-top: 3%; margin-bottom: 5%; text-align: justify;" class="center-vertical">
|
||||
Bienvenue sur Hutopy, votre nouvelle frontière de création, de connexion et d'innovation. Au
|
||||
cœur de notre mission réside une ambition audacieuse : transformer l'espace numérique en un
|
||||
écosystème où chaque créateur, chaque rêveur, chaque professionnel, peut non seulement imaginer
|
||||
écosystème où chaque créateur, chaque rêveur, chaque professionnel, peut non seulement imaginer,
|
||||
mais concrétiser son utopie personnelle. Hutopy est plus qu'une simple plateforme c'est une
|
||||
communauté vibrante qui défie les conventions de l’éducation, encourage l'originalité et célèbre
|
||||
la créativité.
|
||||
@@ -366,28 +372,36 @@
|
||||
<v-col>
|
||||
<v-row justify="center" class="profile-images">
|
||||
<v-col cols="8">
|
||||
<router-link :to="{ name: 'creatorfolio' }">
|
||||
<router-link :to="{ name: 'Hutopy' }">
|
||||
<img src="/images/usersmedia/HutopyProfile/profilepictures/profileHutopyProfile02.png"
|
||||
alt="Profile Image" class="profile-image ">
|
||||
</router-link>
|
||||
</v-col>
|
||||
<v-col cols="8">
|
||||
<router-link :to="{ name: 'guillaumeaime' }">
|
||||
<img src="/images/usersmedia/guillaumeMousseau/profilepictures/profileGuillaumeMousseau01.jpg"
|
||||
alt="Profile Image" class="profile-image">
|
||||
</router-link>
|
||||
</v-col>
|
||||
<v-col cols="8">
|
||||
<router-link :to="{ name: 'creatorfolio' }">
|
||||
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image"
|
||||
class="profile-image ">
|
||||
<router-link :to="{ name: 'chloebeaugrand' }">
|
||||
<img src="/images/usersmedia/chloebeaugrand/profilepictures/profileChloeBeaugrand02.png"
|
||||
alt="Profile Image" class="profile-image">
|
||||
</router-link>
|
||||
</v-col>
|
||||
<v-col cols="8">
|
||||
<router-link :to="{ name: 'creatorfolio' }">
|
||||
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeLarge.png" alt="Profile Image"
|
||||
class="profile-image">
|
||||
<v-row justify='center'>
|
||||
<router-link :to="{ name: 'userbrowser' }">
|
||||
<v-btn style="margin-top:30px; border-radius:10px; background-color:#a30e79; color:white">Découvre les autres créateurs
|
||||
</v-btn>
|
||||
</router-link>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-row>
|
||||
</v-col>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<v-snackbar v-model="errorNoAccessSnackBar">
|
||||
Vous n'etes pas connecter !
|
||||
<template v-slot:actions>
|
||||
|
||||
1020
src/views/manualusers/ARPS.vue
Normal file
1020
src/views/manualusers/ARPS.vue
Normal file
File diff suppressed because it is too large
Load Diff
941
src/views/manualusers/ChloeProfile.vue
Normal file
941
src/views/manualusers/ChloeProfile.vue
Normal 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
1054
src/views/manualusers/GuillaumeAime.vue
Normal file
File diff suppressed because it is too large
Load Diff
936
src/views/manualusers/HutopyProfile.vue
Normal file
936
src/views/manualusers/HutopyProfile.vue
Normal 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
1012
src/views/manualusers/LeffetProfile.vue
Normal file
File diff suppressed because it is too large
Load Diff
1072
src/views/manualusers/MathieuCaron.vue
Normal file
1072
src/views/manualusers/MathieuCaron.vue
Normal file
File diff suppressed because it is too large
Load Diff
@@ -18,6 +18,16 @@
|
||||
</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">
|
||||
@@ -79,68 +89,104 @@
|
||||
contenu. Notre équipe est notre plus grande force, chaque membre apportant une expertise
|
||||
unique et une perspective fraîche à notre mission commune.
|
||||
</p>
|
||||
|
||||
<v-row>
|
||||
<v-col>
|
||||
|
||||
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png"
|
||||
alt="Marc-Olivier Hébert">
|
||||
<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"
|
||||
style="font-size: 1.5rem; font-weight: bold;">
|
||||
Hébert</v-typography><br>
|
||||
<v-typography class="task" style="font-size: 1rem;">Fondateur</v-typography><br>
|
||||
<v-typography class="text" style="font-size: 0.8rem; text-align: justify;">Avec une
|
||||
<v-typography class="task" style="font-size: 1rem;">Fondateur</v-typography><br><br>
|
||||
<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
|
||||
manière dont le contenu est créé et partagé.</v-typography>
|
||||
</v-col>
|
||||
<v-col>
|
||||
|
||||
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png"
|
||||
manière dont le contenu est créé et partagé.</p>
|
||||
</div>
|
||||
</v-card>
|
||||
<v-card max-width="250px" style="margin: 10px;">
|
||||
<img class="member-profile-picture"
|
||||
src="/images/hutopymedia/tospage/membersPictures/profileDominique.png"
|
||||
alt="Dominic Villemure">
|
||||
<br>
|
||||
|
||||
<div style="margin: 10px;">
|
||||
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">Dominic
|
||||
</v-typography><br>
|
||||
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">
|
||||
Villemure</v-typography><br>
|
||||
<v-typography class="task" style="font-size: 1rem;">Responsable
|
||||
Technique</v-typography><br>
|
||||
<v-typography class="text" style="font-size: 0.8rem; text-align: justify;">À la tête de
|
||||
notre équipe de développement, il assure qu’Hutopy reste à la pointe de la
|
||||
technologie.</v-typography>
|
||||
</v-col>
|
||||
<v-col>
|
||||
|
||||
<img src="/images/usersmedia/anonyme/profilepictures/profileAnonymeSquare.png"
|
||||
alt="Parcal Marchesseault">
|
||||
<br>
|
||||
Technique</v-typography><br><br>
|
||||
<p class="text" style="hyphens: auto; font-size: 0.8rem; text-align: justify;">À la
|
||||
tête de notre équipe de développement, il assure qu’Hutopy reste à la pointe de
|
||||
la technologie.
|
||||
</p>
|
||||
</div>
|
||||
</v-card>
|
||||
<v-card max-width="250px" style="margin: 10px;">
|
||||
<img class="member-profile-picture"
|
||||
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><br>
|
||||
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">
|
||||
Marchesseault</v-typography><br>
|
||||
<v-typography class="task" style="font-size: 1rem;">Expérience
|
||||
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>
|
||||
|
||||
<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><br>
|
||||
<v-typography class="name" style="font-size: 1.5rem; font-weight: bold;">
|
||||
Beaugrand</v-typography><br>
|
||||
<v-typography class="task" style="font-size: 1rem;">Responsable
|
||||
Marketing</v-typography><br>
|
||||
<v-typography class="text" style="font-size: 0.8rem; text-align: justify;">Elle façonne
|
||||
l'image d’Hutopy et engage notre communauté à travers des campagnes innovantes et
|
||||
impactantes.</v-typography>
|
||||
</v-col>
|
||||
<br>
|
||||
<p class="text" style="hyphens: auto; font-size: 0.8rem; text-align: justify;">Elle
|
||||
façonne
|
||||
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>
|
||||
<br>
|
||||
|
||||
|
||||
|
||||
<p style="margin-top: 25px; margin-bottom: 25px;">
|
||||
@@ -205,4 +251,9 @@ import FooterLayout from '@/layouts/FooterLayout.vue';
|
||||
.header-text-size {
|
||||
font-size: 4rem;
|
||||
}
|
||||
|
||||
.member-profile-picture {
|
||||
width: 250px;
|
||||
height: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -11,6 +11,8 @@
|
||||
</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">
|
||||
@@ -18,6 +20,16 @@
|
||||
</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">
|
||||
|
||||
@@ -18,6 +18,16 @@
|
||||
</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">
|
||||
|
||||
107
src/views/tos/Transactions.vue
Normal file
107
src/views/tos/Transactions.vue
Normal 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
16
staticwebapp.config.json
Normal 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
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user