fix(code-styles): add tough border to code blocks (#798)

sabertazimi · May 4, 2022 · 1ba97ae · 1ba97ae · vercel · May 4, 2022
1 parent c497ac5
commit 1ba97ae
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 1 deletion.
diff --git a/components/CodeBlocks/LiveCode.module.css b/components/CodeBlocks/LiveCode.module.css
@@ -7,6 +7,8 @@
 .preview {
   @apply flex-auto;
   @apply w-full md:w-1/2;
+  @apply border-solid border-dark;
+  @apply border-l border-r border-b;
 }
 
 .error {

diff --git a/contents/implementFancyCodeBlock.mdx b/contents/implementFancyCodeBlock.mdx
@@ -91,7 +91,7 @@ const App = () => {
     <div
       onClick={() => setCount(count => count + 1)}
       style={{
-        paddingTop: '3rem',
+        padding: '3rem',
         textAlign: 'center',
         cursor: 'pointer',
       }}

diff --git a/styles/globals.css b/styles/globals.css
@@ -17,3 +17,8 @@ li.task-list-item > div {
 .ant-image-mask-info {
   @apply flex items-center;
 }
+
+/* Remove border radius for sandpack editor */
+.sp-wrapper .sp-layout {
+  @apply rounded-none;
+}