updated blog styles

OpenQDev · Aug 3, 2023 · bcdf523 · bcdf523
1 parent f3e75cd
commit bcdf523
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 8 deletions.
diff --git a/slices/BlogBody/index.js b/slices/BlogBody/index.js
@@ -6,10 +6,11 @@
 import { PrismicRichText } from '@prismicio/react';
 import React from 'react';
 const BlogBody = ({ slice }) => {
+  console.log(slice);
   return (
     <div className='flex w-full justify-center bg-dark-mode z-10'>
-      <div className='max-w-lg  px-8 rich-text w-full py-4'>
-        <PrismicRichText field={slice.primary.richtext} />
+      <div className='max-w-2xl text-xl px-8 rich-text w-full py-4'>
+        <PrismicRichText className='text-xl' field={slice.primary.richtext} />
       </div>
     </div>
   );

diff --git a/slices/BlogImage/index.js b/slices/BlogImage/index.js
@@ -8,10 +8,10 @@ import Image from 'next/image';
 const BlogImage = ({ slice }) => {
   return (
     <div className='flex w-full justify-center bg-dark-mode z-10'>
-      <div className='py-4 px-8 bg-dark-mode z-10 '>
+      <div className='py-4 max-w-2xl px-8 bg-dark-mode z-10 '>
         {slice?.primary?.blogimage?.url && (
           <Image
-            className='w-full max-w-lg rounded-lg'
+            className='w-full rounded-lg'
             src={slice?.primary?.blogimage?.url}
             width={slice?.primary?.blogimage?.dimensions?.width}
             height={slice?.primary?.blogimage?.dimensions?.height}

diff --git a/slices/SubHeader/index.js b/slices/SubHeader/index.js
@@ -7,7 +7,7 @@ import React from 'react';
 const SubHeader = ({ slice }) => {
   return (
     <div className='flex w-full justify-center bg-dark-mode z-10'>
-      <div className='max-w-lg w-full px-8 bg-dark-mode z-10'>
+      <div className='max-w-2xl w-full px-8 bg-dark-mode z-10'>
         <h3 className='text-3xl py-6 font-semibold '> {slice.primary.subheader[0].text}</h3>
       </div>
     </div>

diff --git a/styles/globals.css b/styles/globals.css
@@ -409,9 +409,8 @@ body::-webkit-scrollbar {
   animation: fadeInRight 0.8s ease-in-out;
   opacity:1 !important;
 }
-.rich-text br {
-   display: block;
-   margin-bottom: 1.5rem;
+.rich-text a{
+  @apply text-blue-500 underline;
 }
 .explore button {
   @apply flex justify-center items-center   text-white rounded-sm px-4 py-2 whitespace-nowrap;