Misc UI improvements (#1115)

onflow · Jan 24, 2025 · 451250e · 451250e
1 parent c8e1e76
commit 451250e
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 5 deletions.
diff --git a/src/components/ChallengeModal.tsx b/src/components/ChallengeModal.tsx
@@ -59,7 +59,7 @@ const ChallengeModal: React.FC<{
     <Modal isOpen={isOpen} onClose={onClose} title="Challenge Details">
       <div className="space-y-4 text-center">
         <FontAwesomeIcon icon={faBrain} size="5x" className="text-green-500" />
-        <p className="text-lg text-gray-700 mt-4">
+        <p className="mt-4 text-lg text-gray-500 dark:text-gray-400">
           By completing this challenge, you are declaring your intent to learn
           Flow and explore its capabilities.
         </p>

diff --git a/src/components/ProfileModal.tsx b/src/components/ProfileModal.tsx
@@ -2,7 +2,6 @@ import React, { useEffect, useState } from 'react';
 import Input from '@site/src/ui/design-system/src/lib/Components/Input';
 import Field from '@site/src/ui/design-system/src/lib/Components/Field';
 import Modal from '@site/src/ui/design-system/src/lib/Components/Modal';
-import RadioGroup from '@site/src/ui/design-system/src/lib/Components/RadioGroup';
 import { Button } from '@site/src/ui/design-system/src/lib/Components/Button';
 import { Challenge, ProfileSettings, SocialType } from '../types/gold-star';
 import { useProfile } from '../hooks/use-profile';
@@ -490,15 +489,14 @@ const ProfileModal: React.FC<ProfileModalProps> = ({ isOpen, onClose }) => {
           )}
         </div>
 
-
         {completedChallenges.length > 0 && (
           <div>
             <h3 className="text-lg font-bold mb-3">My Challenges</h3>
             <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2 gap-6">
               {completedChallenges.map((challenge, index) => (
                 <div
                   key={index}
-                  className="flex flex-col items-center bg-gray-100 p-6 rounded-lg shadow-md text-center w-full"
+                  className="flex flex-col items-center p-6 rounded shadow-md text-center w-full bg-white dark:bg-gray-100 hover:bg-gray-200 dark:hover:bg-gray-200 text-gray-800 border dark:border-gray-200"
                 >
                   <FontAwesomeIcon
                     icon={faTrophy}

diff --git a/src/components/ProgressModal.tsx b/src/components/ProgressModal.tsx
@@ -36,7 +36,7 @@ const ProgressModal: React.FC<ProgressModalProps> = ({
     <>
       <Modal isOpen={isOpen} onClose={onClose} title="Progress">
         <div className="space-y-6">
-          <p className="text-sm text-gray-600 dark:text-gray-100">
+          <p className="text-sm text-gray-500 dark:text-gray-400">
             Complete the steps below to unlock rewards and challenges. Keep
             track of your progress and stay on track with your goals!
           </p>