From dedf2c2b1a77e507e152a76ee05b3cc16b094c47 Mon Sep 17 00:00:00 2001
From: lucasferreiralimax <lucasferreiralimax@gmail.com>
Date: Sat, 24 Aug 2024 19:14:43 -0300
Subject: [PATCH] adjustment component code example

---
 src/components/Code/index.tsx          |  5 ++++-
 src/components/ModalInstall/style.scss | 10 +++++-----
 src/index.scss                         |  2 +-
 3 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/src/components/Code/index.tsx b/src/components/Code/index.tsx
index da91753..f7f6ce0 100644
--- a/src/components/Code/index.tsx
+++ b/src/components/Code/index.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import { useEffect, useRef } from 'react';
 import hljs from 'highlight.js';
 import 'highlight.js/scss/atom-one-light.scss';
@@ -10,7 +11,9 @@ function ModalInstall(props: any) {
   }, [props.children]);
 
   return (
-    <code ref={codeRef} className={`language-${props.language}`}>{props.children}</code>
+    <div className="code-wrapper">
+      <code ref={codeRef} className={`language-${props.language}`}>{props.children}</code>
+    </div>
   );
 }
 
diff --git a/src/components/ModalInstall/style.scss b/src/components/ModalInstall/style.scss
index ab272fd..81f4a0b 100644
--- a/src/components/ModalInstall/style.scss
+++ b/src/components/ModalInstall/style.scss
@@ -26,15 +26,15 @@
   h2:first-of-type {
     margin-top: 0;
   }
-  code:last-of-type {
-    margin-bottom: 0;
+  h2, h3 {
+    margin: 2rem 0;
   }
-  code {
-    padding: 1rem;
+  .type {
     background: #fff;
     color: #000;
-    white-space: pre;
     border-radius: 8px;
+    padding: .5rem;
+    margin-right: 1rem;
   }
 }
 
diff --git a/src/index.scss b/src/index.scss
index 2bcd98c..8cb57d2 100644
--- a/src/index.scss
+++ b/src/index.scss
@@ -29,7 +29,7 @@ body.modal-active {
 
 .code-wrapper {
   color: var(--color-text);
-  background: var(--vtl-background);
+  background: #fff;
   padding: 1rem;
   border-radius: 10px;
   display: inline-block;