Fixed share popup style

This commit is contained in:
kvakazyambra 2023-02-08 23:43:59 +03:00
parent 5dc4c6c4b7
commit 2a91b04148
2 changed files with 21 additions and 5 deletions

View File

@ -31,31 +31,31 @@ export const SharePopup = (props: SharePopupProps) => {
<Popup {...props} variant="bordered">
<ul class="nodash">
<li>
<button role="button" onClick={() => share(VK)}>
<button role="button" class={styles.shareControl} onClick={() => share(VK)}>
<Icon name="vk-white" class={styles.icon} />
VK
</button>
</li>
<li>
<button role="button" onClick={() => share(FACEBOOK)}>
<button role="button" class={styles.shareControl} onClick={() => share(FACEBOOK)}>
<Icon name="facebook-white" class={styles.icon} />
Facebook
</button>
</li>
<li>
<button role="button" onClick={() => share(TWITTER)}>
<button role="button" class={styles.shareControl} onClick={() => share(TWITTER)}>
<Icon name="twitter-white" class={styles.icon} />
Twitter
</button>
</li>
<li>
<button role="button" onClick={() => share(TELEGRAM)}>
<button role="button" class={styles.shareControl} onClick={() => share(TELEGRAM)}>
<Icon name="telegram-white" class={styles.icon} />
Telegram
</button>
</li>
<li>
<button role="button" onClick={copyLink}>
<button role="button" class={styles.shareControl} onClick={copyLink}>
<Icon name="link-white" class={styles.icon} />
{t('Copy link')}
</button>

View File

@ -5,6 +5,7 @@
.popup {
background: #fff;
color: #000;
cursor: default;
min-width: 144px;
opacity: 1;
position: absolute;
@ -88,6 +89,21 @@
transition: filter 0.3s;
}
}
.shareControl {
text-align: left;
transition: color 0.3s, background-color 0.3s;
white-space: nowrap;
&:hover {
background: #000;
color: #fff;
.icon img {
filter: invert(0);
}
}
}
}
// TODO: animation