Style fix for share popup

src/components/Feed/ArticleCard.module.scss

@@ -426,6 +426,10 @@
   z-index: 3;
 }
 
+.shoutCardDetailsActive {
+  z-index: 4;
+}
+
 .shoutCardDetailsContent {
   display: flex;
 

src/components/Feed/ArticleCard.tsx

@@ -1,4 +1,4 @@
-import { createMemo, For, Show } from 'solid-js'
+import { createMemo, createSignal, For, Show } from 'solid-js'
 import type { Shout } from '../../graphql/types.gen'
 import { capitalize } from '../../utils'
 import { translit } from '../../utils/ru2en'
@@ -85,6 +85,8 @@ export const ArticleCard = (props: ArticleCardProps) => {
     changeSearchParam('scrollTo', 'comments')
   }
 
+  const [isSharePopupActive, setIsSharePopupActive] = createSignal(false)
+
   return (
     <section
       class={clsx(styles.shoutCard, `${props.settings?.additionalClass || ''}`)}
@@ -172,7 +174,10 @@ export const ArticleCard = (props: ArticleCardProps) => {
         </Show>
 
         <Show when={props.settings?.isFeedMode}>
-          <section class={styles.shoutCardDetails}>
+          <section
+            class={styles.shoutCardDetails}
+            classList={{ [styles.shoutCardDetailsActive]: isSharePopupActive() }}
+          >
             <div class={styles.shoutCardDetailsContent}>
               <ShoutRatingControl shout={props.article} class={styles.shoutCardDetailsItem} />