Fix blocking heavy use banner on mobile (#85)

AudiusProject · Oct 25, 2020 · 0c4cb73 · 0c4cb73
1 parent c7349f9
commit 0c4cb73
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/packages/web/src/containers/notice/Notice.module.css b/packages/web/src/containers/notice/Notice.module.css
@@ -28,7 +28,7 @@
 }
 
 .content {
-  pointer-events: all;
+  pointer-events: none;
   margin: 0 20px;
   position: relative;
   background: var(--page-header-gradient);
@@ -42,6 +42,10 @@
   font-weight: var(--font-bold);
 }
 
+.contentShow {
+  pointer-events: all;
+}
+
 .iconRemove {
   cursor: pointer;
   position: absolute;

diff --git a/packages/web/src/containers/notice/Notice.tsx b/packages/web/src/containers/notice/Notice.tsx
@@ -25,7 +25,11 @@ const Notice = ({ shouldPadTop }: { shouldPadTop: boolean }) => {
         [styles.shouldPadTop]: shouldPadTop
       })}
     >
-      <div className={styles.content}>
+      <div
+        className={cn(styles.content, {
+          [styles.contentShow]: isVisible
+        })}
+      >
         <IconRemove className={styles.iconRemove} onClick={hide} />
         {noticeText}
       </div>