fix: scope all classes under explain-block

githubnext · Apr 19, 2022 · d73a828 · d73a828
1 parent 968b3de
commit d73a828
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/src/blocks/file-blocks/explain/index.css b/src/blocks/file-blocks/explain/index.css
@@ -113,28 +113,28 @@
   /* purposely ignored */
 }
 
-.syntax-highlighter-block .comment {
+.explain-block .syntax-highlighter-block .comment {
   cursor: pointer;
 }
 
-[data-highlighted="true"] {
+.explain-block [data-highlighted="true"] {
   background: #fff8c5;
 }
-[data-highlighted="true"] .comment {
+.explain-block [data-highlighted="true"] .comment {
   box-shadow: inset -2px 0 0 rgba(212, 167, 44, 0.4);
 }
 
-.comment {
+.explain-block .comment {
   background: white !important;
 
   color: #222;
 }
 
-.comment:hover {
+.explain-block .comment:hover {
   color: rgba(0, 0, 0, 0.5);
 }
 
-code,
-code span {
+.explain-block code,
+.explain-block code span {
   font-size: 14px !important;
 }
diff --git a/src/blocks/file-blocks/explain/index.tsx b/src/blocks/file-blocks/explain/index.tsx
@@ -101,7 +101,7 @@ function BlockInner(props: FileBlockProps) {
   }, [content, context, start, end]);
 
   return (
-    <div className="py-4 h-full">
+    <div className="py-4 h-full explain-block">
       <div className="max-w-6xl h-full px-4 mx-auto overflow-hidden">
         <div className="border relative h-full">
           {start && end && (