chore: make some minor adjustments on some of the components

components/buttons/BackToTopButton.tsx

@@ -28,7 +28,7 @@ const BackToTopButton = () => {
     isVisible && (
       <button
         onClick={scrollToTop}
-        className='fixed right-3 top-1/2 z-40 -translate-y-1/2 rounded-full bg-white p-3 text-gray-700 shadow-lg transition-all duration-500 hover:bg-white'
+        className='fixed right-3 top-1/2 z-40 -translate-y-1/2 rounded-full bg-white p-3 text-gray-700 shadow-lg transition-all duration-500 hover:bg-white hover:text-modern-black'
       >
         <ChevronUpIcon className='h-6 w-6' />
       </button>

components/resources/ContributingResources.tsx

@@ -91,7 +91,7 @@ const ContributingResources: React.FC = () => {
                 <h3 className="text-lg font-semibold text-white">
                   {tutorial.title}
                 </h3>
-                <span className="rounded-full bg-modern-purple/10 px-3 py-1 text-xs font-medium text-modern-purple">
+                <span className="rounded-full bg-modern-purple/10 px-3 py-1 text-xs font-medium text-modern-purple text-center">
                   {tutorial.channel}
                 </span>
               </div>

pages/index.tsx

@@ -88,7 +88,7 @@ export default function Home() {
           >
             <div className='modern-container'>
               <div className='mx-auto max-w-2xl lg:text-center'>
-                <h2 className='text-3xl font-semibold leading-7 text-modern-purple'>
+                <h2 className='text-3xl font-semibold leading-snug text-modern-purple'>
                   Become a part of our community of over 700 inspiring
                   developers who have already contributed to this project!
                 </h2>

styles/tailwind.css

@@ -175,6 +175,10 @@ body {
   @apply text-gray-200;
 }
 
+.theme-dark .text-gray-800 {
+  @apply text-gray-200
+}
+
 .theme-dark .border-gray-200 {
   @apply border-gray-700;
 }