info/developer-roadmap
1
0
Fork 0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-08-01 06:50:26 +02:00
Code Issues Releases Wiki Activity

Fix flickering numbers

Browse Source
This commit is contained in:
Kamran Ahmed
2023-09-03 12:17:30 +01:00
parent cbe758349c
commit 58dd3f2f41
2 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/Questions/QuestionCard.tsx
View File

@@ -1,4 +1,4 @@
import { useEffect, useRef, useState } from 'react';
import { Fragment, useEffect, useRef, useState } from 'react';
import type { QuestionType } from '../../lib/question-group';
import { markdownToHtml } from '../../lib/markdown';
import Prism from 'prismjs';
@@ -58,12 +58,12 @@ export function QuestionCard(props: QuestionCardProps) {
const totalTopics = question.topics?.length || 0;
return (
<>
<Fragment key={topic}>
<span className="capitalize">{topic}</span>
{counter !== totalTopics - 1 && (
<span className="mx-2">&middot;</span>
)}
</>
</Fragment>
);
})}
</div>

6
src/components/Questions/QuestionsProgress.tsx
View File

@@ -46,7 +46,7 @@ export function QuestionsProgress(props: QuestionsProgressProps) {
<CheckCircle className="mr-1 h-4" />
<span>Knew</span>
<span className="ml-2 rounded-md bg-gray-200/80 px-1.5 font-medium text-black">
{knowCount} Questions
<span className='tabular-nums'>{knowCount}</span> Questions
</span>
</span>
@@ -54,7 +54,7 @@ export function QuestionsProgress(props: QuestionsProgressProps) {
<Sparkles className="mr-1 h-4" />
<span>Learnt</span>
<span className="ml-2 rounded-md bg-gray-200/80 px-1.5 font-medium text-black">
{didNotKnowCount} Questions
<span className='tabular-nums'>{didNotKnowCount}</span> Questions
</span>
</span>
@@ -62,7 +62,7 @@ export function QuestionsProgress(props: QuestionsProgressProps) {
<SkipForward className="mr-1 h-4" />
<span>Skipped</span>
<span className="ml-2 rounded-md bg-gray-200/80 px-1.5 font-medium text-black">
{skippedCount} Questions
<span className='tabular-nums'>{skippedCount}</span> Questions
</span>
</span>