Finaizando React Markdown nas paginas com descricao

aceleradora-TW · Feb 1, 2024 · 1e2bb55 · 1e2bb55
1 parent 98d4b86
commit 1e2bb55
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 15 deletions.
diff --git a/src/pages/therapies-description/index.js b/src/pages/therapies-description/index.js
@@ -163,7 +163,7 @@ export const DetailsTherapies = () => {
           <div className='container-description'>
             <p className="description">Descrição</p>
             {(
-                <div className=''>
+                <div>
                   <ReactMarkdown rehypePlugins={[rehypeRaw]}>
                   {therapies?.attributes?.descricao}
                   </ReactMarkdown>

diff --git a/src/pages/therapies-description/styled.js b/src/pages/therapies-description/styled.js
@@ -41,6 +41,8 @@ const Details = styled.div`
   
 .container-description {
   padding-top: 1em;
+  font-size: 20px;
+  line-height: 23px;
     li {
       padding-top: 0em;
     }
@@ -57,13 +59,6 @@ const Details = styled.div`
     padding-bottom: 20px;
   }
 
-  .descriptionCMS {
-    font-size: 20px;
-    text-align: justify;
-    width: 85%;
-    line-height: 23px;
-  }
-
   .button-close,
   .button-container {
     padding-left: 90px;

diff --git a/src/pages/workshop-description/index.js b/src/pages/workshop-description/index.js
@@ -18,6 +18,8 @@ import 'swiper/css/navigation'
 import 'swiper/css/thumbs'
 import NavBar from '../../components/navbar'
 import { Link, useParams } from 'react-router-dom'
+import ReactMarkdown from 'react-markdown'
+import rehypeRaw from 'rehype-raw'
 
 export const WorkshopDetails = () => {
   const [thumbsSwiper, setThumbsSwiper] = useState(null)
@@ -165,8 +167,17 @@ export const WorkshopDetails = () => {
               </li>
             </ul>
           </span>
+          <div className='container-description'>
           <p className="description">Descrição</p>
-          <p className="descriptionCMS">{workshops.attributes?.descricao}</p>
+          {(
+              <div>
+                  <ReactMarkdown rehypePlugins={[rehypeRaw]}>
+                  {workshops.attributes?.descricao}
+                  </ReactMarkdown>
+              </div>
+              )}
+          </div>
+
           {workshops.attributes?.url_inscricao !== null && (
             <a
               className="button-inscription"

diff --git a/src/pages/workshop-description/styled.js b/src/pages/workshop-description/styled.js
@@ -52,12 +52,19 @@ const Details = styled.div`
     padding-bottom: 20px;
   }
 
-  .descriptionCMS {
-    font-size: 20px;
-    text-align: justify;
-    width: 85%;
-    line-height: 23px;
-  }
+  .container-description {
+  padding-top: 1em;
+  font-size: 20px;
+  line-height: 23px;
+    li {
+      padding-top: 0em;
+    }
+
+    p {
+    padding-top: 1em;
+
+    }
+}
 
   .button-close,
   .button-container {