Frontend Mentor | Mateusz's profile

@Zinah-ZwayenSubmitted about 2 years ago

Hi Everyone,

I'm stuck with making the share icon clickable again and again, it just shows the social media pop-up once and stops, not sure what is wrong, can anyone help here? Thanks,

article-preview-component-master

1

Mateusz•180

@userMatMikPosted about 2 years ago

Hi, you just over complicate this. To display/hide this share overlay you just need to add and remove class active to .clicked-profile div. The best solution to add and remove class is toggle. Your code should look like this :

document.querySelector('.share-img').addEventListener('click', () => { document.querySelector('.clicked-profile').classList.toggle('active'); })

Hope this solution will be helpful.

Marked as helpful

0

polukarp•190

@polukarpSubmitted about 2 years ago

I couldn't align Ethereum and Clock logos horizontally. Could you please give me an advice on how to do it? Thanks.

Responsive NFT Card Component Using Flexbox

4

Mateusz•180

@userMatMikPosted about 2 years ago

Hi, I checked your code and you are using pseudo-elements ::before to display icons so if you want to align them you must set position: relative to parent element and position: absolute to ::before element. So for example it should look like this:

.card__price { position: relative; margin-left: 20px; }

.card__price::before { position: absolute; left: -20px; top: 1px; }

.card__date { position: relative; }

.card__date::before { left: -25px; top: 2px; }

Hope it helps you.

Marked as helpful

0