kyd-shared-badge 0.2.7 → 0.2.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kyd-shared-badge",
-  "version": "0.2.7",
+  "version": "0.2.9",
   "private": false,
   "main": "./src/index.ts",
   "module": "./src/index.ts",

package/src/SharedBadgeDisplay.tsx

@@ -68,8 +68,7 @@ interface ScoreCardProps {
 
 const ScoreCard = ({ title, score, description, descriptor, scoreType, iconImageSrc }: ScoreCardProps) => {
     const isDescriptor = scoreType === 'descriptor';
-    const scoreHex = isDescriptor ? undefined : getScoreColor(score);
-    const scoreClass = isDescriptor ? 'text-neutral-400' : '';
+    const scoreHex = getScoreColor(score);
     const overlay = scoreHex ? hexToRgba(scoreHex, 0.08) : 'transparent';
     let displayScore;
 
@@ -88,11 +87,11 @@ const ScoreCard = ({ title, score, description, descriptor, scoreType, iconImage
           }
           style={{ backgroundColor: 'var(--content-card-background)', borderColor: 'var(--icon-button-secondary)', backgroundImage: `linear-gradient(${overlay}, ${overlay})` }}
         >
-            <div className={`text-3xl mb-4 ${scoreClass}`} style={scoreHex ? { color: scoreHex } : undefined}>
+            <div className={`text-3xl mb-4`} style={scoreHex ? { color: scoreHex } : undefined}>
               <Image src={iconImageSrc} alt="icon" width={32} height={32} className="h-8 w-8 object-contain" />
             </div>
             <h3 className={`font-semibold text-xl ${isDescriptor ? 'text-neutral-400' : ''}`} style={{ color: 'var(--text-main)' }}>{title}</h3>
-            <p className={`text-4xl font-bold ${scoreClass}`} style={scoreHex ? { color: scoreHex } : undefined}>{displayScore}</p>
+            <p className={`text-4xl font-bold`} style={scoreHex ? { color: scoreHex } : undefined}>{displayScore}</p>
             <p className={'text-sm text-neutral-600 dark:text-neutral-400 mt-4'} style={{ color: 'var(--text-secondary)' }}>{description}</p>
         </div>
     );
@@ -148,8 +147,8 @@ const SharedBadgeDisplay = ({ badgeData }: { badgeData: PublicBadgeData }) => {
                 />
                 <ScoreCard 
                   title={<span>KYD AI™ <span className="text-xs font-semibold bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200 px-2 py-1 rounded-full align-middle">Beta</span></span>}
-                  score={0}
-                  description={aiUsageScore?.description || 'Analysis of AI tool usage and transparency.'}
+                  score={aiUsageScore?.score || 0}
+                  description={aiUsageScore?.description || ''}
                   descriptor={aiUsageScore?.descriptor}
                   scoreType='descriptor'
                   iconImageSrc={getAiIconSrc(aiUsageScore?.descriptor)}

package/src/components/ReportHeader.tsx

@@ -49,8 +49,8 @@ const ReportHeader = ({ badgeId, developerName, updatedAt, score = 0, isPublic,
         >
             {/* Left Section */}
             <div className="flex items-center text-left md:text-center">
-                <Image src={finalBadgeImageUrl} alt="KYD Badge" width={100} height={100} unoptimized />
-                <div className='flex flex-col ml-3'>
+                <Image src={finalBadgeImageUrl} alt="KYD Badge" width={100} height={100} unoptimized className='p-3'/>
+                <div className='flex flex-col'>
                     <h1 className={'font-bold text-lg'} style={{ color: 'var(--text-main)' }}>
                       KYD Self-Check™
                     </h1>