Merged PR 16: Modification de CreatorFolio - Tweaking de la mise en page, changement du fav...
Modification de CreatorFolio - Tweaking de la mise en page, changement du favicon et modification du component StripePayment pour le ui
This commit is contained in:
Pascal Marchesseault
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 15 KiB |
@@ -1,23 +1,30 @@
|
||||
<template>
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-text-field
|
||||
label="Montant ($)"
|
||||
v-model="price"
|
||||
style="color: rgb(0, 109, 119); background-color: #f4f4f4">
|
||||
</v-text-field>
|
||||
</v-col>
|
||||
|
||||
<v-col>
|
||||
<v-btn
|
||||
@click="goPay()"
|
||||
style=" background-color: rgb(11, 170, 178); color: white; font-weight: bold;"
|
||||
>Envoyez
|
||||
</v-btn>
|
||||
</v-col>
|
||||
<v-row>
|
||||
<v-text-field label="Message"
|
||||
style=" 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="margin-bottom: 10px; color: #a30e79; background-color: #f4f4f4">
|
||||
</v-text-field>
|
||||
</v-row>
|
||||
|
||||
<v-row justify="center">
|
||||
<v-btn @click="goPay()"
|
||||
style="margin-bottom: 10px; width: 200px; background-color: #6b0065; color: white; font-weight: bold;">
|
||||
<v-icon left style="margin-right: 10px;">
|
||||
mdi-gift
|
||||
</v-icon>
|
||||
Envoyez
|
||||
</v-btn>
|
||||
</v-row>
|
||||
|
||||
|
||||
<v-dialog v-model="isPaymentDialogActive" max-width="720" persistent>
|
||||
<template v-slot:default>
|
||||
<v-card>
|
||||
@@ -26,10 +33,7 @@
|
||||
</div>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn
|
||||
text="Annuler"
|
||||
@click="closeDialog()"
|
||||
></v-btn>
|
||||
<v-btn block class="ma-auto" style="width: 200px;" text="Annuler" @click="closeDialog()"></v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</template>
|
||||
@@ -37,6 +41,9 @@
|
||||
</v-container>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
@@ -3,12 +3,15 @@
|
||||
<DefaultLayout></DefaultLayout>
|
||||
|
||||
<!-- Bannière -->
|
||||
<v-row class="fluid" style="margin-top: -25px; position: relative; z-index: 0;">
|
||||
<v-row class="fluid" style="margin-top: -50px; position: relative; z-index: 0;">
|
||||
<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 style="background-color: #6b0065; height: 5px; box-shadow: rgba(0, 0, 0, 0.7);">
|
||||
|
||||
</v-row>
|
||||
|
||||
|
||||
|
||||
@@ -65,20 +68,21 @@
|
||||
<!-- "Creator Core (Menu / Feed / Donation)" -->
|
||||
<v-row>
|
||||
<!-- "Menu" -->
|
||||
<v-col cols="2" md="3" lg="2" xl="3" xxl="3" class="hidden-sm-and-down" hidden-sm-and-down>
|
||||
|
||||
<v-img src="../../../images/hutopy.png" alt="Description de l'image" style="height: 150px; width: 300px;"
|
||||
class="mx-auto" :elevation="10"></v-img>
|
||||
<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">
|
||||
<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/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-group>
|
||||
<router-link v-for="(item, index) in navigationItems" :key="index" :to="item.link">
|
||||
<v-btn text class="d-flex align-start align-center main-background" elevation="0" outlined="false">
|
||||
<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>
|
||||
@@ -109,6 +113,12 @@
|
||||
</v-col>
|
||||
</v-container>
|
||||
|
||||
</v-col>
|
||||
|
||||
|
||||
</v-row>
|
||||
|
||||
<v-row style="height: 1400px;"></v-row>
|
||||
|
||||
<!-- Wallet -->
|
||||
<v-row>
|
||||
@@ -198,10 +208,11 @@
|
||||
</v-dialog>
|
||||
</v-row>
|
||||
</v-col>
|
||||
|
||||
</v-col>
|
||||
|
||||
<!-- Profile Info Picture name title & description -->
|
||||
<v-col style="z-index: 5;" cols="12" xs="12" sm="12" md="9" lg="7" xl="6" xxl="6">
|
||||
<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>
|
||||
@@ -221,11 +232,11 @@
|
||||
|
||||
<v-row>
|
||||
<v-spacer></v-spacer>
|
||||
<v-col cols="7" style="margin-top: 1%; margin-bottom: -2%;">
|
||||
<v-row>
|
||||
<v-col cols="10" style="margin-top: 1%; margin-bottom: -2%;">
|
||||
<v-col cols="11" style="margin-top: 1%; margin-bottom: -2%;">
|
||||
<v-row justify-center align="center">
|
||||
<a href="https://www.facebook.com/profile.php?id=61556819217561">
|
||||
<img class="socialicons invert-color" src="../../../images/facebookicon.png"
|
||||
alt="Description image 2">
|
||||
<img class="socialicons invert-color" src="../../../images/facebookicon.png" alt="Description image 2">
|
||||
</a>
|
||||
<a href="https://www.facebook.com/profile.php?id=61556819217561">
|
||||
<img class="socialicons" src="../../../images/instaicon.png" alt="Description image 2">
|
||||
@@ -237,6 +248,8 @@
|
||||
<img class="socialicons invert-color" src="../../../images/tiktok.png" alt="Description image 2">
|
||||
</a>
|
||||
</v-row>
|
||||
</v-col>
|
||||
|
||||
</v-col>
|
||||
<v-col background-color="primary"></v-col>
|
||||
</v-row>
|
||||
@@ -271,7 +284,7 @@
|
||||
|
||||
<v-col class="text-right">
|
||||
<v-btn class="btn-card-options" flat tile elevation="0">
|
||||
<v-icon style="color: rgb(11, 170, 178); font-size: 24px;">mdi-dots-vertical</v-icon>
|
||||
<v-icon style="color: #6e6e6e; font-size: 24px;">mdi-dots-vertical</v-icon>
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
@@ -284,12 +297,12 @@
|
||||
<div
|
||||
style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%; margin-bottom: -5%;">
|
||||
<v-container>
|
||||
<iframe style="margin-left: 2.1%; width: 96%;" src="https://www.youtube.com/embed/pf95whtA_xs?start=0"
|
||||
title="Guillaumem" frameborder="0"
|
||||
<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"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
allowfullscreen></iframe>
|
||||
|
||||
<p class="text-justify pa-10" style="margin-bottom: -3%; font-size: 1.2em">Ma mission est claire :
|
||||
<p class="text-justify pa-10" style="margin-bottom: -3%; font-size: 1em">Ma mission est claire :
|
||||
mettre en lumière le côté humain des entrepreneurs. Chaque service, chaque produit est porteur d’une
|
||||
histoire, d’une passion, d’une vision unique. Mon objectif est de faire rayonner cette unicité, de
|
||||
créer des connexions authentiques entre ces entrepreneurs et leurs clients potentiels. Parce que
|
||||
@@ -306,7 +319,60 @@
|
||||
</div>
|
||||
|
||||
<!-- Comments -->
|
||||
<v-text-field style="margin-left: 2%;"
|
||||
<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-container>
|
||||
</div>
|
||||
</v-card>
|
||||
</v-container>
|
||||
|
||||
<v-container>
|
||||
<v-card class="flow-menu m-0 youtube-card">
|
||||
<v-col>
|
||||
<v-row>
|
||||
<v-col>
|
||||
<h1 class="card-title">
|
||||
PODCAST #01</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>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<h1 class="card-date">
|
||||
10-03-2024</h1>
|
||||
</v-row>
|
||||
</v-col>
|
||||
|
||||
<div
|
||||
style="background-color: rgba(255, 255, 255, 0.1); margin-left: -5%; margin-right: -5%; margin-bottom: -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"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
allowfullscreen></iframe>
|
||||
|
||||
<p class="text-justify pa-10" style="margin-bottom: -3%; font-size: 1em">Ma mission est claire :
|
||||
mettre en lumière le côté humain des entrepreneurs. Chaque service, chaque produit est porteur d’une
|
||||
histoire, d’une passion, d’une vision unique. Mon objectif est de faire rayonner cette unicité, de
|
||||
créer des connexions authentiques entre ces entrepreneurs et leurs clients potentiels. Parce que
|
||||
derrière chaque entreprise, il y a des personnes inspirantes qui méritent d’être entendues et
|
||||
comprises. Et toi, quel est ton objectif pour cette année?</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;"
|
||||
placeholder="Commentaire (Commentaire, Aime et Partagez sont non fonctionnel pour le moment)"></v-text-field>
|
||||
</v-container>
|
||||
</div>
|
||||
@@ -315,8 +381,10 @@
|
||||
</v-col>
|
||||
|
||||
<!-- "Large-Monitor-RightCol" Donation -->
|
||||
<v-col cols="2" md="3" lg="3" xl="3" xxl="3" class="hidden-md-and-down" hidden-md-and-up>
|
||||
<v-container class="sticky-bottom-label" style="max-width: 400px ; bottom: 0; z-index: 1000;">
|
||||
<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>
|
||||
@@ -326,20 +394,20 @@
|
||||
JE SOUTIENS!
|
||||
</v-card-title>
|
||||
</v-row>
|
||||
<v-spacer style="height: 20px;"></v-spacer>
|
||||
<v-textarea style="color: #a30e79;" label="Votre message" placeholder="Écrivez votre message ici" rows="3"
|
||||
auto-grow></v-textarea>
|
||||
<v-text-field style="color: #a30e79;" label="Montant ($)" placeholder="Écrivez votre message ici" rows="3"
|
||||
auto-grow></v-text-field>
|
||||
<v-btn block class="ma-auto" style="width: 200px;">
|
||||
<v-icon left>
|
||||
mdi-gift
|
||||
</v-icon>
|
||||
Donnez
|
||||
</v-btn>
|
||||
|
||||
<StripePayment></StripePayment>
|
||||
</v-container>
|
||||
</v-card>
|
||||
</v-container>
|
||||
<v-container style="height: 1600px;">
|
||||
|
||||
</v-container>
|
||||
|
||||
</v-col>
|
||||
<v-spacer>
|
||||
</v-spacer>
|
||||
</v-row>
|
||||
|
||||
</v-col>
|
||||
|
||||
|
||||
@@ -351,7 +419,7 @@
|
||||
|
||||
|
||||
<!-- "Mobile" Donation -->
|
||||
<v-col class="hidden-lg-and-up sticky-bottom-label" hidden-md-and-down
|
||||
<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 -->
|
||||
@@ -372,14 +440,7 @@
|
||||
<h1 class="text-soutiens">JE SOUTIENS</h1>
|
||||
<v-textarea style="color: white;" label="Votre message" placeholder="Écrivez votre message ici" rows="2"
|
||||
auto-grow></v-textarea>
|
||||
<v-text-field style="color: white;" label="Montant ($)" placeholder="Écrivez votre message ici" rows="2"
|
||||
auto-grow></v-text-field>
|
||||
<v-btn class="mx-auto">
|
||||
<v-icon left class="mr-4">
|
||||
mdi-gift
|
||||
</v-icon>
|
||||
Donnez
|
||||
</v-btn>
|
||||
<StripePayment></StripePayment>
|
||||
</v-container>
|
||||
</v-bottom-sheet>
|
||||
|
||||
@@ -398,6 +459,7 @@
|
||||
<script setup>
|
||||
import DefaultLayout from '@/layouts/DefaultLayout.vue';
|
||||
import FooterLayout from '@/layouts/FooterLayout.vue';
|
||||
import StripePayment from '../StripePayment.vue';
|
||||
</script>
|
||||
|
||||
<script>
|
||||
@@ -414,6 +476,7 @@ export default {
|
||||
tiktokLink: 'tiktok.com',
|
||||
drawer: false,
|
||||
drawerbottom: false,
|
||||
|
||||
items: [
|
||||
{ title: 'Item 1' },
|
||||
{ title: 'Item 2' },
|
||||
@@ -436,6 +499,16 @@ export default {
|
||||
|
||||
|
||||
<style scoped>
|
||||
.Hutopy-menu-sticky {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 1000;
|
||||
margin-top: -40px;
|
||||
}
|
||||
|
||||
.sticky-bottom-label {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
@@ -443,6 +516,7 @@ export default {
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 1000;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.sticky-top-label {
|
||||
@@ -457,15 +531,15 @@ export default {
|
||||
.text-soutiens {
|
||||
margin-bottom: 15px;
|
||||
color: white;
|
||||
font-size: 2rem;
|
||||
letter-spacing: 10px;
|
||||
font-size: 1.5rem;
|
||||
letter-spacing: 7px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.name-info {
|
||||
margin-top: -10px;
|
||||
margin-left: 15%;
|
||||
font-size: larger
|
||||
|
||||
}
|
||||
|
||||
.occupation-info {
|
||||
@@ -599,6 +673,8 @@ export default {
|
||||
.youtube-card {
|
||||
margin-left: 2%;
|
||||
margin-right: 2%;
|
||||
border-radius: 15px;
|
||||
|
||||
|
||||
|
||||
background-color: #f4f4f4;
|
||||
@@ -629,9 +705,11 @@ export default {
|
||||
.social-container2 {
|
||||
background-color: #0baab2;
|
||||
border-bottom-right-radius: 30px;
|
||||
border-bottom-left-radius:30px;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 500;
|
||||
color: white;
|
||||
|
||||
}
|
||||
|
||||
.social-container-mobile {
|
||||
@@ -753,6 +831,10 @@ export default {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.card-youtube {
|
||||
min-height: 250px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -784,6 +866,10 @@ export default {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.card-youtube {
|
||||
min-height: 330px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -813,15 +899,52 @@ export default {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.card-youtube {
|
||||
min-height: 425px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media (min-width: 959px) and (max-width: 1280px) {
|
||||
|
||||
.middle-col {
|
||||
margin-left: -30px;
|
||||
}
|
||||
|
||||
.text-soutiens {
|
||||
font-size: 1.2rem;
|
||||
letter-spacing: 5px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.profile-container {
|
||||
margin-top: -16%;
|
||||
margin-top: -185px;
|
||||
|
||||
}
|
||||
|
||||
.card-youtube {
|
||||
min-height: 270px;
|
||||
}
|
||||
|
||||
.Je-soutien-container {
|
||||
min-width: 300px;
|
||||
margin-left: -40px;
|
||||
}
|
||||
|
||||
|
||||
.mobile-profile-picture-creator {
|
||||
transform: scale(.9) translateY(63px) translateX(-40px);
|
||||
}
|
||||
|
||||
.name-info {
|
||||
font-size: 1.3rem;
|
||||
margin-left: 40px;
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
.social-container {
|
||||
min-width: 300px;
|
||||
|
||||
}
|
||||
}
|
||||
@@ -834,11 +957,34 @@ export default {
|
||||
}
|
||||
|
||||
.mobile-profile-picture-creator {
|
||||
transform: scale(1.2) translateY(25px) translateX(-8px);
|
||||
transform: scale(1.0) translateY(55px) translateX(-30px);
|
||||
}
|
||||
|
||||
.profile-container {
|
||||
margin-top: -25%;
|
||||
margin-top: -180px;
|
||||
|
||||
}
|
||||
|
||||
.card-youtube {
|
||||
min-height: 290px;
|
||||
}
|
||||
|
||||
.menu-col {
|
||||
margin-left: -4%;
|
||||
}
|
||||
|
||||
.Je-soutien-container {
|
||||
min-width: 350px;
|
||||
}
|
||||
|
||||
.name-info {
|
||||
font-size: 1.3rem;
|
||||
margin-left: 50px;
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
.social-container {
|
||||
min-width: 300px;
|
||||
|
||||
}
|
||||
|
||||
@@ -847,29 +993,100 @@ export default {
|
||||
|
||||
@media (min-width: 1600px) and (max-width: 1919px) {
|
||||
.text-soutiens {
|
||||
font-size: 1.5rem;
|
||||
font-size: 1.3rem;
|
||||
|
||||
}
|
||||
|
||||
.mobile-profile-picture-creator {
|
||||
transform: scale(1.3) translateY(25px) translateX(-5px);
|
||||
transform: scale(1.1) translateY(40px) translateX(-25px);
|
||||
}
|
||||
|
||||
.profile-container {
|
||||
margin-top: -20%;
|
||||
margin-top: -171px;
|
||||
|
||||
}
|
||||
|
||||
.card-youtube {
|
||||
min-height: 355px;
|
||||
}
|
||||
|
||||
.menu-col {
|
||||
margin-left: -4%;
|
||||
}
|
||||
|
||||
.Je-soutien-container {
|
||||
min-width: 400px;
|
||||
}
|
||||
|
||||
.name-info {
|
||||
font-size: 1.4rem;
|
||||
margin-left: 40px;
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
@media (min-width: 1920px) and (max-width: 2559px) {
|
||||
.text-soutiens {
|
||||
font-size: 1.5rem;
|
||||
font-size: 1.3rem;
|
||||
|
||||
}
|
||||
|
||||
.profile-container {
|
||||
margin-top: -12%;
|
||||
margin-top: -160px;
|
||||
|
||||
}
|
||||
|
||||
.card-youtube {
|
||||
min-height: 380px;
|
||||
}
|
||||
|
||||
.Je-soutien-container {
|
||||
min-width: 400px;
|
||||
}
|
||||
|
||||
.mobile-profile-picture-creator {
|
||||
transform: scale(1.3) translateY(40px) translateX(-10px);
|
||||
}
|
||||
|
||||
.name-info {
|
||||
font-size: 1.4rem;
|
||||
margin-left: 40px;
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
.social-container {
|
||||
margin-left: 150px;
|
||||
|
||||
}
|
||||
|
||||
.social-container2 {
|
||||
margin-left: 80px;
|
||||
min-width: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 2559px) {}
|
||||
@media (min-width: 2560px) {
|
||||
.card-youtube {
|
||||
min-height: 380px;
|
||||
}
|
||||
|
||||
.text-soutiens {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.name-info {
|
||||
font-size: 2rem;
|
||||
|
||||
}
|
||||
|
||||
.social-container {
|
||||
margin-left: 150px;
|
||||
}
|
||||
|
||||
.social-container2 {
|
||||
margin-left: 150px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user