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

Made SVG icons for recent social network

Browse Source
This commit is contained in:
PascalMarchesseault
2024-08-06 11:33:45 -04:00
parent c1579e1d88
commit fefc28705a
4 changed files with 75 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
src/views/Profile/Dialogs/PageInformations/Socials.vue
View File

@@ -43,7 +43,7 @@ const save = async () => {
props.creator.socials.websiteUrl = websiteUrl
props.creator.socials.xUrl = xUrl
props.creator.socials.youtubeUrl = youtubeUrl
emits('closeRequested')
} catch (error) {
console.error(error)
@@ -58,63 +58,86 @@ const cancel = () => {
<template>
<div class="pb-5 text-2xl">Reseaux Sociaux</div>
<v-text-field
variant="outlined"
v-model="facebookUrl"
label="Lien Facebook"
outlined
></v-text-field>
<v-text-field
variant="outlined"
v-model="instagramUrl"
label="Lien Instagram"
outlined
></v-text-field>
<div class="flex flex-row align-center">
<v-icon class="mb-5 mr-2">mdi-facebook</v-icon>
<v-text-field
variant="outlined"
v-model="facebookUrl"
label="Lien Facebook"
outlined
></v-text-field>
</div>
<v-text-field
variant="outlined"
v-model="linkedInUrl"
label="Lien LinkedIn"
outlined
></v-text-field>
<div class="flex flex-row align-center">
<v-icon class="mb-5 mr-2">mdi-instagram</v-icon>
<v-text-field
variant="outlined"
v-model="instagramUrl"
label="Lien Instagram"
outlined
></v-text-field>
</div>
<div class="flex flex-row align-center">
<v-icon class="mb-5 mr-2">mdi-linkedin</v-icon>
<v-text-field
variant="outlined"
v-model="linkedInUrl"
label="Lien LinkedIn"
outlined
></v-text-field>
</div>
<div class="flex flex-row align-center">
<v-icon class="mb-5 mr-2">mdi-reddit</v-icon>
<v-text-field
variant="outlined"
v-model="redditUrl"
label="Lien Reddit"
outlined
></v-text-field>
</div>
<div class="flex flex-row align-center">
<img src="/images/hutopymedia/icons/tiktok.svg" width="23px" height="23px" class="mb-5 mr-2">
<v-text-field
variant="outlined"
v-model="tikTokUrl"
label="Lien TikTok"
outlined
></v-text-field>
</div>
<div class="flex flex-row align-center">
<v-icon class="mb-5 mr-2">mdi-web</v-icon>
<v-text-field
variant="outlined"
v-model="websiteUrl"
label="Lien site web"
outlined
></v-text-field>
</div>
<v-text-field
<div class="flex flex-row align-center">
<img src="/images/hutopymedia/icons/x.svg" width="23px" height="23px" class="mb-5 mr-2">
<v-text-field
variant="outlined"
v-model="xUrl"
label="Lien X"
outlined
></v-text-field>
</div>
<v-text-field
<div class="flex flex-row align-center">
<v-icon class="mb-5 mr-2">mdi-youtube</v-icon>
<v-text-field
variant="outlined"
v-model="youtubeUrl"
label="Lien Youtube"
outlined
></v-text-field>
</div>
<div class="flex justify-end space-x-4">
<v-btn color="black" variant="text" @click="cancel">Annuler</v-btn>

4
src/views/Profile/PageInformations.vue
View File

@@ -142,7 +142,7 @@ const closeDialog = () => {
<button
@click="openDialog('Socials')"
class="HoverBtn active:bg-gray-300 py-2 px-4 border-gray-400 shadow flex items-center transition duration-200 ease-in-out w-full">
<span class="flex-none pa-2 min-w-32 text-left"><v-icon>mdi-twitter</v-icon></span>
<span class="flex-none pa-2 min-w-32 text-left"> <img src="/images/hutopymedia/icons/x.svg" width="23px" height="23px"></span>
<span class="flex-auto text-left pr-6">{{ userStore.creator.socials.xUrl }}</span>
<span class="flex-none">
<v-icon>mdi-chevron-right</v-icon>
@@ -163,7 +163,7 @@ const closeDialog = () => {
@click="openDialog('Socials')"
class="HoverBtn active:bg-gray-300 py-2 px-4 border-gray-400 shadow flex items-center transition duration-200 ease-in-out w-full ">
<span class="flex-none pa-2 min-w-32 text-left">
<img src="/images/socials/tiktok-black.png" class="w-5 h-5">
<img src="/images/hutopymedia/icons/tiktok.svg" class="w-5 h-5">
</span>
<span class="flex-auto text-left pr-6">{{ userStore.creator.socials.tikTokUrl }}</span>
<span class="flex-none">