myprofile
unknown
plain_text
4 years ago
25 kB
4
Indexable
<template>
<div class="my-profile container" v-if="isLoggedIn">
<div class="my-profile__head fixed-top">
<div class="my-profile__logo">
<svg
width="32"
height="28"
viewBox="0 0 32 28"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M9.23437 8.0831C9.3583 7.15035 10.192 6.45311 11.1929
6.45311H21.7823C23.293 6.45311 24.3079 7.33456 24.3079
8.64703C24.3079 10.0039 23.3165 10.8809 21.7823 10.8809H11.1929C10.1997
10.8809 9.36471 10.1857 9.23651 9.25863V8.14894C9.23651 8.12794 9.23565
8.10734 9.23437 8.0831ZM8.35533 18.551C8.56473 18.326 8.74037 18.0759
8.87882 17.8069C8.98694 17.6732 9.08309 17.5677 9.17283 17.4849C9.65273
17.041 10.2425 16.7885 10.9258 16.7352L21.9874 16.734C23.7165 16.734 24.8335
17.6695 24.8335 19.1173C24.8335 20.658 23.7964 21.5411 21.9879 21.5411L12.9351
21.5354C12.8338 21.5253 12.7313 21.5201 12.627 21.5201H3.10804C1.39441 21.5201 0
22.8378 0 24.4581C0 26.0356 1.32902 27.8001 3.10804 27.8001L23.4874 27.7989C29.3364
27.7989 32 23.6962 32 19.8849C32 17.9462 31.206 16.0763 29.821 14.7549C29.1202 14.086
29.0967 12.9981 29.7663 12.2774C30.8838 11.0756 31.4744 9.50181 31.4744 7.72559C31.4744
2.82957 27.1035 0.600098 23.043 0.600098H5.43233C3.63665 0.600098 2.17601 1.98084 2.17601
3.67829V16.349C2.17601 18.189 3.75973 19.6861 5.70626 19.6861C6.71264 19.6861 7.67757 19.2729
8.35362 18.5526"
fill="white"
/>
</svg>
</div>
<div class="my-profile__controls">
<router-link
class="my-profile__controls-home"
to="/"
>
<svg
class="my-profile__icon-home"
width="22"
height="21"
viewBox="0 0 22 21"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M11.9869 0.481236C11.4582 0.0987506 10.7551 0.0912436 10.219 0.464967C9.20884 1.16906 7.2305 2.57641 5.36335 4.06967C4.43005 4.81609 3.52 5.58757 2.77101 6.30596C2.03016 7.01654 1.41828 7.70173 1.11127 8.27449C0.813992 8.8291 0.622111 9.64466 0.494567 10.5574C0.365601 11.4803 0.297562 12.5418 0.267539 13.6137C0.207474 15.7581 0.298939 17.9711 0.36992 19.2533C0.415421 20.0752 1.09777 20.6996 1.9111 20.6996H9.19955C9.39837 20.6996 9.55955 20.5384 9.55955 20.3396V13.9869C9.55955 13.1916 10.2043 12.5469 10.9995 12.5469C11.7948 12.5469 12.4395 13.1916 12.4395 13.9869V20.3396C12.4395 20.5384 12.6007 20.6996 12.7995 20.6996H20.059C20.8877 20.6996 21.5763 20.0535 21.6077 19.2176C21.6579 17.8825 21.7243 15.5712 21.6863 13.3979C21.6673 12.3117 21.6222 11.2541 21.535 10.3675C21.4495 9.49825 21.3195 8.74036 21.1068 8.29062C20.9894 8.04249 20.7829 7.76411 20.5303 7.47403C20.2736 7.17932 19.9524 6.85368 19.5881 6.50988C18.8595 5.82207 17.9432 5.04723 16.9914 4.28049C15.087 2.74633 13.0216 1.2297 11.9869 0.481236Z"
/>
</svg>
</router-link>
<a
class="my-profile__controls-msg"
href="#"
>
<svg
class="my-profile__icon-msg"
width="24"
height="24"
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M12.3938 22.3128C12.2243 22.3176 12.0531 22.32 11.88 22.32C4.55356 22.32 0.47998 18.0791 0.47998 11.52C0.47998 4.96082 4.64395 0.719971 11.88 0.719971C19.116 0.719971 23.28 5.01831 23.28 11.52C23.28 13.248 22.9922 14.8204 22.4321 16.1978C22.2559 17.1923 22.2818 18.2165 22.5131 19.2082L23.3668 22.868C23.4091 23.0492 23.2495 23.2134 23.0671 23.1761L19.8742 22.5239C18.0558 22.1524 16.1992 22.0246 14.353 22.1413C13.8586 22.2163 13.3451 22.2682 12.8128 22.296C12.6452 22.3191 12.4777 22.3443 12.3105 22.3714L12.3938 22.3128ZM8.27994 13.92C9.4066 13.92 10.3199 13.0066 10.3199 11.88C10.3199 10.7533 9.4066 9.83997 8.27994 9.83997C7.15328 9.83997 6.23994 10.7533 6.23994 11.88C6.23994 13.0066 7.15328 13.92 8.27994 13.92ZM17.2799 11.88C17.2799 13.0066 16.3666 13.92 15.2399 13.92C14.1132 13.92 13.1999 13.0066 13.1999 11.88C13.1999 10.7533 14.1132 9.83997 15.2399 9.83997C16.3666 9.83997 17.2799 10.7533 17.2799 11.88Z"
/>
</svg>
</a>
<router-link
class="my-profile__controls-post"
to="/add_post"
>
<svg
class="my-profile__icon-post"
width="32"
height="32"
viewBox="0 0 32 32"
xmlns="http://www.w3.org/2000/svg"
>
<g>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M27.9052 4.09476C26.6514 2.84093 24.7646 2.00213 22.7361 1.46971C20.6776 0.929412 18.327 0.666626 16.0001 0.666626C13.6732 0.666626 11.3226 0.929412 9.26409 1.46971C7.23559 2.00213 5.34877 2.84093 4.09494 4.09476C2.84109 5.34861 2.00227 7.23545 1.46985 9.26396C0.929539 11.3225 0.666748 13.6731 0.666748 16C0.666748 18.3269 0.929539 20.6775 1.46985 22.736C2.00227 24.7645 2.84109 26.6513 4.09495 27.9052C5.34877 29.159 7.23559 29.9978 9.26409 30.5302C11.3226 31.0705 13.6732 31.3333 16.0001 31.3333C18.327 31.3333 20.6776 31.0705 22.7361 30.5302C24.7646 29.9978 26.6514 29.159 27.9052 27.9052C29.1591 26.6513 29.9979 24.7645 30.5303 22.736C31.0706 20.6775 31.3334 18.3269 31.3334 16C31.3334 13.6731 31.0706 11.3225 30.5303 9.26396C29.9979 7.23545 29.1591 5.34861 27.9052 4.09476ZM15.9997 7.79993C16.8465 7.79993 17.533 8.48642 17.533 9.33326V14.4666H21.9255C22.7723 14.4666 23.4588 15.1531 23.4588 15.9999C23.4588 16.8468 22.7723 17.5333 21.9255 17.5333H17.533V22.6666C17.533 23.5134 16.8465 24.1999 15.9997 24.1999C15.1528 24.1999 14.4663 23.5134 14.4663 22.6666V17.5333H10.0736C9.22681 17.5333 8.54031 16.8468 8.54031 15.9999C8.54031 15.1531 9.22681 14.4666 10.0736 14.4666H14.4663V9.33326C14.4663 8.48642 15.1528 7.79993 15.9997 7.79993Z"
/>
</g>
</svg>
</router-link>
<a
class="my-profile__controls-user"
href="#"
>
<svg
class="my-profile__icon-user"
width="35"
height="34"
viewBox="0 0 35 34"
xmlns="http://www.w3.org/2000/svg"
>
<g filter="url(#filter0_d)">
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M17.7208 6.19995C15.0699 6.19995 12.9208 8.34901 12.9208 11C12.9208 13.6509 15.0699 15.8 17.7208 15.8C20.3718 15.8 22.5209 13.6509 22.5209 11C22.5209 8.34901 20.3718 6.19995 17.7208 6.19995ZM17.7204 17C14.8424 17 12.4083 17.5808 10.5489 18.8C8.6608 20.0379 7.46366 21.8711 6.98505 24.155C6.58833 26.048 8.04903 27.8 9.96232 27.8H25.4785C27.3917 27.8 28.8525 26.048 28.4557 24.155C27.9771 21.8711 26.78 20.0379 24.8919 18.8C23.0325 17.5808 20.5984 17 17.7204 17Z"
/>
</g>
<defs>
<filter
id="filter0_d"
x="0.919678"
y="0.199951"
width="33.6014"
height="33.6"
filterUnits="userSpaceOnUse"
color-interpolation-filters="sRGB"
>
<feFlood
flood-opacity="0"
result="BackgroundImageFix"
/>
<feColorMatrix
in="SourceAlpha"
type="matrix"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset />
<feGaussianBlur stdDeviation="3" />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.360784 0 0 0 0 0.772549 0 0 0 0 0.870588 0 0 0 0.75 0"
/>
<feBlend
mode="normal"
in2="BackgroundImageFix"
result="effect1_dropShadow"
/>
<feBlend
mode="normal"
in="SourceGraphic"
in2="effect1_dropShadow"
result="shape"
/>
</filter>
</defs>
</svg>
</a>
<a
class="my-profile__controls-notification"
href="#"
>
<svg
class="my-profile__icon-notification"
width="22"
height="22"
viewBox="0 0 22 22"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M20.573 14.8531C20.573 15.5632 20.2886 16.2057 19.8291 16.6709C19.3696 17.1361 18.7351 17.4241 18.0338 17.4241H4.42665C3.02453 17.4241 1.88745 16.2728 1.88745 14.8531C1.88745 14.143 2.18569 13.5105 2.63131 13.0353C3.75558 11.8364 4.16837 10.6161 4.16837 9.36833V7.96187C4.16837 3.67494 6.20187 0.199951 11.2268 0.199951C16.2518 0.199951 18.2853 3.67494 18.2853 7.96187V9.36833C18.2853 10.5999 18.6489 11.6977 19.4072 12.6749C20.0121 13.4543 20.573 13.9437 20.573 14.8531Z"
/>
<path
opacity="0.32"
fill-rule="evenodd"
clip-rule="evenodd"
d="M11.2719 21.4136C9.84539 21.3843 9.41777 20.5679 9.42042 19.53C9.42157 19.0685 9.58677 18.6464 9.8602 18.3199L12.6985 18.3272C12.9703 18.6551 13.1334 19.078 13.1323 19.5395C13.1297 20.5774 12.6985 21.443 11.2719 21.4136Z"
/>
</svg>
</a>
<button class="my-profile__settings" />
</div>
</div>
<div class="my-profile__user-wrap container-sm">
<img
class="my-profile__avatar"
:src="avatar"
alt="avatar"
>
<span class="my-profile__username">{{ username }}</span>
<span class="my-profile__name">{{ name }}</span>
<span class="my-profile__followers">followers</span>
<span class="my-profile__following">following</span>
</div>
<button class="my-profile__rating">
<span class="my-profile__rating-heart" />
<span class="my-profile__rating-heart" />
<span class="my-profile__rating-heart" />
<span class="my-profile__rating-heart" />
<span class="my-profile__rating-heart-empty" />
<span class="my-profile__rating-number">4.1 (6)</span>
</button>
<span class="my-profile__info">
I am an oldschool explorer! Will tell you all the jems and hiddend places
in every counry. From NYC
</span>
<div class="my-profile__content-wrap">
<div class="my-profile__btn-wrap w-100 bg-dark">
<button
class="btn nav-link text-white"
>
My content
</button>
<button class="btn nav-link text-white">
Purchased
</button>
<button class="btn nav-link text-white">
Saved
</button>
</div>
<div class="my-profile__images mt-5">
<div
v-for="item in postsList"
:key="item.id"
class="my-profile__picture-wrap mx-auto mt-5"
>
<img
class="img-thumbnail w-100"
:src="item.icon"
alt="pic"
>
</div>
</div>
</div>
</div>
<div class="my-profile container" v-else>
<h1 style="color: #fff; display: none">Login required.</h1>
</div>
</template>
<script>
export default {
name: "MyProfile",
computed: {
postsList() {
const getArrayFiltered = () => {
const postsArray = this.$store.getters.POSTS;
postsArray.sort(function (a, b) {
return Date.parse(b.created) - Date.parse(a.created);
});
return postsArray.filter(
(item) => "icon" in item && item.icon.includes(`https://get-online`)
);
};
return getArrayFiltered();
},
},
data() {
return {
isLoggedIn: false
}
},
created() {
},
mounted() {
this.isLoggedIn = false;
this.$store.dispatch("GET_USER")
.then( data => {
this.isLoggedIn = true;
this.$store.dispatch("GET_POST");
} )
.catch( e => {
this.isLoggedIn = false;
document.querySelectorAll('.my-profile.container h1')[0].style = 'color: #fff; display: block';
} );
},
};
</script>
<style scoped>
/* //////////////////////////MOBILE WIDTH ONLY///////////////////////// */
.my-profile {
display: flex;
flex-direction: column;
background-color: #1d1d1d;
border: solid 1px transparent;
min-height: 100%;
margin-top: 0px;
padding: 10px;
z-index: 1;
}
.my-profile__head {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
background-color: #1d1d1d;
border: solid 1px transparent;
box-sizing: border-box;
padding: 0px 5vw 0px 5vw;
opacity: 0.9;
}
.my-profile__balance {
width: 68px;
height: 30px;
font-style: normal;
font-weight: bold;
font-size: 10px;
line-height: 28px;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #1d1e1f;
background-color: #5cc5de;
border: none;
border-radius: 15px;
margin-left: 10px;
}
.my-profile__balance:hover {
background-color: #a4b6bb;
}
.my-profile__settings {
width: 30px;
height: 30px;
border: none;
background: transparent;
background-image: url("../assets/img/icon-settings.png");
background-repeat: no-repeat;
background-position: center;
}
.my-profile__user-wrap {
display: grid;
grid-template-columns: auto auto auto;
grid-template-rows: auto auto auto;
border: solid 1px transparent;
margin: 40px auto 0px 0px;
}
.my-profile__avatar {
grid-column-start: 1;
grid-column-end: 2;
grid-row-start: 1;
grid-row-end: 4;
width: 104px;
height: 104px;
border-radius: 50%;
border: solid 1px #5cc5de;
}
.my-profile__username {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 2;
font-style: normal;
font-weight: bold;
font-size: 22px;
line-height: 25px;
color: #ffffff;
}
.my-profile__name {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 2;
grid-row-end: 3;
font-style: normal;
font-weight: normal;
font-size: 16px;
line-height: 22px;
color: #ffffff;
mix-blend-mode: normal;
opacity: 0.7;
}
.my-profile__followers,
.my-profile__following {
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 16px;
color: #ffffff;
}
.my-profile__followers {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 3;
grid-row-end: 4;
}
.my-profile__following {
grid-column-start: 3;
grid-column-end: 4;
grid-row-start: 3;
grid-row-end: 4;
}
.my-profile__rating {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
color: #f9f9f9;
width: 172px;
height: 58px;
background: #464646;
border-radius: 33.5px;
border: none;
margin-top: 30px;
}
.my-profile__rating-heart {
display: block;
width: 15px;
height: 15px;
background-image: url("../assets/img/icon-rating-heart.png");
background-repeat: no-repeat;
background-position: center;
border: solid 1px transparent;
}
.my-profile__rating-heart-empty {
display: block;
width: 15px;
height: 15px;
background-image: url("../assets/img/icon-rating-heart-empty.png");
background-repeat: no-repeat;
background-position: center;
border: solid 1px transparent;
}
.my-profile__rating-number {
display: block;
border: solid 1px transparent;
}
.my-profile__info {
display: block;
font-style: normal;
font-weight: normal;
font-size: 16px;
line-height: 22px;
color: #ffffff;
margin-top: 30px;
}
.my-profile__social-wrap {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
border: solid 1px transparent;
margin-top: 30px;
}
.my-profile__social-fb {
display: block;
width: 25px;
height: 25px;
background-image: url("../assets/img/icon-fb.svg");
background-repeat: no-repeat;
background-position: center;
}
.my-profile__social-instagram {
display: block;
width: 25px;
height: 25px;
background-image: url("../assets/img/icon-inst.svg");
background-repeat: no-repeat;
background-position: center;
}
.my-profile__social-twitter {
display: block;
width: 25px;
height: 25px;
background-image: url("../assets/img/icon-twitter.svg");
background-repeat: no-repeat;
background-position: center;
}
.my-profile__social-sf {
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 16px;
color: #ffffff;
}
.my-profile__content-wrap {
width: 100%;
background-color: transparent;
border: solid 1px transparent;
margin-top: 20px;
}
.my-profile__btn-wrap {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
margin-top: 30px;
}
.my-profile__my-content-btn,
.my-profile__purchased-btn,
.my-profile__saved-btn {
width: 120px;
height: 35px;
font-style: normal;
font-weight: bold;
font-size: 16px;
line-height: 18px;
text-align: center;
color: #000000;
mix-blend-mode: normal;
opacity: 0.4;
border: none;
border-radius: 16.5px;
background-color: transparent;
}
.my-profile__my-content-btn-active {
color: #ffffff;
background-color: #1d1d1d;
opacity: initial;
}
.my-profile__images {
display: block;
border: solid 1px transparent;
margin: 0px auto 50px auto;
}
.my-profile__images::-webkit-scrollbar {
width: 0;
}
.my-profile__content-picture {
width: 126px;
height: 126px;
border: solid 1px #1d1d1d;
border-radius: 5px;
margin: 5px;
}
.my-profile__picture-wrap {
width: 100%;
max-width: 614px;
height: auto;
}
.my-profile__controls {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
height: 50px;
margin-top: 0px;
border: solid 1px transparent;
background: rgba(29, 29, 29, 0.8);
}
.my-profile__controls-home {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
}
.my-profile__icon-home {
fill: white;
opacity: 0.32;
}
.my-profile__icon-home:hover {
fill: #5cc5de;
opacity: initial;
}
.my-profile__icon-home:active {
fill: #5cc5de;
opacity: initial;
}
.my-profile__controls-msg {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
}
.my-profile__icon-msg {
fill: white;
opacity: 0.32;
}
.my-profile__icon-msg:hover {
fill: #5cc5de;
opacity: initial;
}
.my-profile__icon-msg:active {
fill: #5cc5de;
opacity: initial;
}
.my-profile__controls-post {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
}
.my-profile__icon-post {
fill: white;
opacity: 0.32;
}
.my-profile__icon-post:hover {
fill: #5cc5de;
opacity: initial;
}
.my-profile__icon-post:active {
fill: #5cc5de;
opacity: initial;
}
.my-profile__controls-user {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
}
.my-profile__icon-user {
fill: white;
opacity: 0.32;
}
.my-profile__icon-user:hover {
fill: #5cc5de;
opacity: initial;
}
.my-profile__icon-user:active {
fill: #5cc5de;
opacity: initial;
}
.my-profile__controls-notification {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
}
.my-profile__icon-notification {
fill: white;
opacity: 0.32;
}
.my-profile__icon-notification:hover {
fill: #5cc5de;
opacity: initial;
}
.my-profile__icon-notification:active {
fill: #5cc5de;
opacity: initial;
}
/* //////////////////////////TABLET WIDTH///////////////////////// */
@media (min-width: 768px) {
.my-profile__balance {
width: 90px;
height: 35px;
font-style: normal;
font-weight: bold;
font-size: 15px;
line-height: 33px;
}
.my-profile__settings {
width: 30px;
height: 30px;
border: none;
background: transparent;
background-image: url("../assets/img/icon-settings.png");
background-repeat: no-repeat;
background-position: center;
}
.my-profile__user-wrap{
padding-right: 40%;
}
.my-profile__avatar {
grid-column-start: 1;
grid-column-end: 2;
grid-row-start: 1;
grid-row-end: 4;
width: 104px;
height: 104px;
border-radius: 50%;
border: solid 1px #5cc5de;
}
.my-profile__username {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 2;
font-style: normal;
font-weight: bold;
font-size: 22px;
line-height: 25px;
color: #ffffff;
}
.my-profile__name {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 2;
grid-row-end: 3;
font-style: normal;
font-weight: normal;
font-size: 16px;
line-height: 22px;
color: #ffffff;
mix-blend-mode: normal;
opacity: 0.7;
}
.my-profile__followers,
.my-profile__following {
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 16px;
color: #ffffff;
}
.my-profile__followers {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 3;
grid-row-end: 4;
}
.my-profile__following {
grid-column-start: 3;
grid-column-end: 4;
grid-row-start: 3;
grid-row-end: 4;
}
.my-profile__rating {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
color: #f9f9f9;
width: 172px;
height: 58px;
background: #464646;
border-radius: 33.5px;
border: none;
margin-top: 30px;
}
.my-profile__rating-heart {
display: block;
width: 15px;
height: 15px;
background-image: url("../assets/img/icon-rating-heart.png");
background-repeat: no-repeat;
background-position: center;
border: solid 1px transparent;
}
.my-profile__rating-heart-empty {
width: 15px;
height: 15px;
}
.my-profile__info {
font-style: normal;
font-weight: normal;
font-size: 16px;
line-height: 22px;
margin-top: 30px;
}
.my-profile__social-wrap {
margin-top: 30px;
}
.my-profile__social-fb {
width: 25px;
height: 25px;
}
.my-profile__social-instagram {
width: 25px;
height: 25px;
}
.my-profile__social-twitter {
width: 25px;
height: 25px;
}
.my-profile__social-sf {
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 16px;
}
.my-profile__content-wrap {
width: 100%;
}
.my-profile__btn-wrap {
margin-top: 20px;
}
.my-profile__my-content-btn,
.my-profile__purchased-btn,
.my-profile__saved-btn {
width: 120px;
height: 35px;
font-style: normal;
font-weight: bold;
font-size: 16px;
line-height: 18px;
border-radius: 16.5px;
}
.my-profile__images {
margin: 0px auto 50px auto;
}
.my-profile__images::-webkit-scrollbar {
width: 0;
}
.my-profile__content-picture {
width: 156px;
height: 156px;
border-radius: 5px;
margin: 5px;
}
.my-profile__picture-wrap {
width: 100%;
height: auto;
}
.my-profile__controls {
height: 50px;
margin-top: 0px;
}
.my-profile__controls-home {
width: 40px;
height: 40px;
}
.my-profile__controls-msg {
width: 40px;
height: 40px;
}
.my-profile__controls-post {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
}
.my-profile__controls-user {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
}
.my-profile__controls-notification {
width: 40px;
height: 40px;
}
}
/* //////////////////////////DOSKTOP WIDTH ///////////////////////// */
@media (min-width: 1024px) {
}
</style>
Editor is loading...