style(og-preview): Improve hover state and interaction

neural-loop · neural-loop · commit b307e2fbdd7b · 2025-06-12T09:42:05.000-04:00
Add pointer-events: none to svg and sharing-runner for better UX.
diff --git a/assets/scss/components/_og-preview.scss b/assets/scss/components/_og-preview.scss
@@ -15,7 +15,7 @@
       @apply opacity-100;
     }
     .sharing-runner {
-      @apply opacity-0;
+      @apply opacity-0 pointer-events-none;
     }
   }
 }
@@ -58,6 +58,10 @@
     transform: scale(1.1);
     background: var(--color-primary-new);
   }
+
+  svg {
+    pointer-events: none;
+  }
 }
 
 .dark .social-icon:hover {
@@ -82,12 +86,6 @@
   }
 }
 
-@screen lg {
-  .og-preview-wrapper {
-    @apply mt-6;
-  }
-}
-
 @media (max-width: 1023.98px) {
   .og-preview-container:hover {
      transform: none;

Original file line number	Diff line number	Diff line change
`@@ -15,7 +15,7 @@`
`15`	`15`	`@apply opacity-100;`
`16`	`16`	`}`
`17`	`17`	`.sharing-runner {`
`18`		`- @apply opacity-0;`
	`18`	`+ @apply opacity-0 pointer-events-none;`
`19`	`19`	`}`
`20`	`20`	`}`
`21`	`21`	`}`
`@@ -58,6 +58,10 @@`
`58`	`58`	`transform: scale(1.1);`
`59`	`59`	`background: var(--color-primary-new);`
`60`	`60`	`}`
	`61`	`+`
	`62`	`+ svg {`
	`63`	`+ pointer-events: none;`
	`64`	`+ }`
`61`	`65`	`}`
`62`	`66`
`63`	`67`	`.dark .social-icon:hover {`
`@@ -82,12 +86,6 @@`
`82`	`86`	`}`
`83`	`87`	`}`
`84`	`88`
`85`		`-@screen lg {`
`86`		`- .og-preview-wrapper {`
`87`		`- @apply mt-6;`
`88`		`- }`
`89`		`-}`
`90`		`-`
`91`	`89`	`@media (max-width: 1023.98px) {`
`92`	`90`	`.og-preview-container:hover {`
`93`	`91`	`transform: none;`