Skip to content

Commit 6f34e98

Browse files
angristanangristan
committed
feat: softer white color for text in dark mode
1 parent 9ca2c17 commit 6f34e98

File tree

6 files changed

+27
-27
lines changed

6 files changed

+27
-27
lines changed

‎src/components/Benchmarks/BenchmarkDetail.tsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -224,16 +224,16 @@ const BenchmarkDetail = ({
224224
<div className="grid w-2/5">
225225
<div className="pl-8 pr-8 border-4 border-dashed border-gray-200 rounded-lg h-96 p-4">
226226
<div className="flex justify-between">
227-
<h1 className="text-2xl pb-3 dark:text-white">Subject</h1>
227+
<h1 className="text-2xl pb-3 dark:text-gray-100">Subject</h1>
228228
<div className="">
229229
<Listbox value={selected} onChange={setSelected}>
230230
{({ open }) => (
231231
<>
232-
<Listbox.Label className="w-36 block dark:text-white text-sm font-medium text-gray-700">
232+
<Listbox.Label className="w-36 block dark:text-gray-100 text-sm font-medium text-gray-700">
233233
Languages
234234
</Listbox.Label>
235235
<div className="mt-1 relative">
236-
<Listbox.Button className="dark:text-white dark:bg-gray-800 relative w-full bg-white border border-gray-300 rounded-md shadow-sm pl-3 pr-10 py-2 text-left cursor-default focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
236+
<Listbox.Button className="dark:text-gray-100 dark:bg-gray-800 relative w-full bg-white border border-gray-300 rounded-md shadow-sm pl-3 pr-10 py-2 text-left cursor-default focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
237237
<span className="flex items-center">
238238
<img
239239
src={selected.avatar}
@@ -261,7 +261,7 @@ const BenchmarkDetail = ({
261261
>
262262
<Listbox.Options
263263
static
264-
className="dark:text-white dark:bg-gray-800 absolute z-10 mt-1 w-full bg-white shadow-lg max-h-96 rounded-md py-1 text-base ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm"
264+
className="dark:text-gray-100 dark:bg-gray-800 absolute z-10 mt-1 w-full bg-white shadow-lg max-h-96 rounded-md py-1 text-base ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm"
265265
>
266266
{languages.map((language) => (
267267
<Listbox.Option
@@ -270,7 +270,7 @@ const BenchmarkDetail = ({
270270
classNames(
271271
active
272272
? 'text-white bg-indigo-600'
273-
: 'text-gray-900 dark:text-white',
273+
: 'text-gray-900 dark:text-gray-100',
274274
'cursor-default select-none relative py-2 pl-3 pr-9',
275275
)
276276
}
@@ -301,7 +301,7 @@ const BenchmarkDetail = ({
301301
className={classNames(
302302
active
303303
? 'text-white'
304-
: 'text-indigo-600 dark:text-white',
304+
: 'text-indigo-600 dark:text-gray-100',
305305
'absolute inset-y-0 right-0 flex items-center pr-4',
306306
)}
307307
>
@@ -323,7 +323,7 @@ const BenchmarkDetail = ({
323323
</Listbox>
324324
</div>
325325
</div>
326-
<ReactMarkdown className="dark:text-white">
326+
<ReactMarkdown className="dark:text-gray-100">
327327
{benchmarkData?.subject || ''}
328328
</ReactMarkdown>
329329
</div>

‎src/components/Benchmarks/Benchmarks.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1+
import { useBenchmarkSList } from '../../hooks/benchmark';
12
import Header from '../Page/Header';
23
import Page from '../Page/Page';
34
import benchmarkModel from './BenchmarkModel';
45
import BenchmarkRow from './BenchmarkRow';
5-
import { useBenchmarkSList } from '../../hooks/benchmark';
66

77
const Benchmarks: React.FC = () => {
88
let benchmarks: benchmarkModel[] = [];
@@ -40,25 +40,25 @@ const Benchmarks: React.FC = () => {
4040
<tr>
4141
<th
4242
scope="col"
43-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
43+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
4444
>
4545
Title
4646
</th>
4747
<th
4848
scope="col"
49-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
49+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
5050
>
5151
Subject
5252
</th>
5353
<th
5454
scope="col"
55-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
55+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
5656
>
5757
Difficulty
5858
</th>
5959
<th
6060
scope="col"
61-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
61+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
6262
>
6363
Creator
6464
</th>

‎src/components/Benchmarks/CreateBenchmark.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ const CreateBenchmark: React.FC = () => {
4747
<div className="flex flex-wrap -mx-3 mb-6">
4848
<div className="w-full px-3">
4949
<label
50-
className="block uppercase dark:text-white tracking-wide text-gray-700 text-xs font-bold mb-2"
50+
className="block uppercase dark:text-gray-100 tracking-wide text-gray-700 text-xs font-bold mb-2"
5151
htmlFor="grid-password"
5252
>
5353
Title
@@ -63,7 +63,7 @@ const CreateBenchmark: React.FC = () => {
6363
<div className="flex flex-wrap -mx-3 mb-6">
6464
<div className="w-full px-3">
6565
<label
66-
className="block dark:text-white uppercase tracking-wide text-gray-700 text-xs font-bold mb-2"
66+
className="block dark:text-gray-100 uppercase tracking-wide text-gray-700 text-xs font-bold mb-2"
6767
htmlFor="grid-password"
6868
>
6969
Subject
@@ -78,7 +78,7 @@ const CreateBenchmark: React.FC = () => {
7878
<div className="flex flex-wrap -mx-3 mb-6">
7979
<div className="w-full px-3">
8080
<label
81-
className="block dark:text-white uppercase tracking-wide text-gray-700 text-xs font-bold mb-2"
81+
className="block dark:text-gray-100 uppercase tracking-wide text-gray-700 text-xs font-bold mb-2"
8282
htmlFor="grid-password"
8383
>
8484
Difficulty

‎src/components/Benchmarks/Result.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ const Result: React.FC<LayoutProps> = ({
2727
}) => {
2828
if (status !== 'done' && status !== 'error') {
2929
return (
30-
<div className="flex justify-center dark:text-white">
30+
<div className="flex justify-center dark:text-gray-100">
3131
<Loader
3232
type="ThreeDots"
3333
color="#0a75ab"
@@ -81,7 +81,7 @@ const OutputsComponent: React.FC<OutputsComponentProps> = ({ text, value }) => {
8181
if (value) {
8282
return (
8383
<div>
84-
<b className="dark:text-white">{text}:</b>
84+
<b className="dark:text-gray-100">{text}:</b>
8585
<div
8686
className={'h-auto p-4 mt-2 w-full bg-gray-800 rounded-lg text-white'}
8787
>

‎src/components/Page/Header.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ const Header: React.FC<HeaderProps> = ({
4343
) : (
4444
<></>
4545
)}
46-
<h1 className="text-3xl dark:text-white font-bold text-gray-900 ml-2">
46+
<h1 className="text-3xl dark:text-gray-100 font-bold text-gray-900 ml-2">
4747
{title}
4848
</h1>
4949
{/* Add space to move extraContent to the end of the header */}
@@ -52,7 +52,7 @@ const Header: React.FC<HeaderProps> = ({
5252
</div>
5353
) : (
5454
<div className="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8 flex justify-between">
55-
<h1 className="text-3xl dark:text-white font-bold text-gray-900">
55+
<h1 className="text-3xl dark:text-gray-100 font-bold text-gray-900">
5656
{title}
5757
</h1>
5858
{isButtonNeeded ? (

‎src/components/leaderboard/Leaderboard.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ const Leaderboard: React.FC<LeaderboardProps> = ({ benchmarkId }) => {
4848
return (
4949
<div className="mt-3 ml-2 flex-1">
5050
<div className="flex justify-between">
51-
<h1 className="text-2xl pb-3 dark:text-white ">Leaderboard</h1>
51+
<h1 className="text-2xl pb-3 dark:text-gray-100 ">Leaderboard</h1>
5252
<div>
5353
<Listbox value={selected} onChange={setSelected}>
5454
{({ open }) => (
@@ -153,26 +153,26 @@ const Leaderboard: React.FC<LeaderboardProps> = ({ benchmarkId }) => {
153153
<tr>
154154
<th
155155
scope="col"
156-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
156+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
157157
>
158158
Rank
159159
</th>
160160
<th
161161
scope="col"
162-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
162+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
163163
>
164164
Name
165165
</th>
166166
<th
167167
scope="col"
168-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
168+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
169169
>
170170
Date / Language
171171
</th>
172172

173173
<th
174174
scope="col"
175-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
175+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
176176
onClick={() => setSortedField('qualityScore')}
177177
>
178178
<div className="flex">
@@ -186,7 +186,7 @@ const Leaderboard: React.FC<LeaderboardProps> = ({ benchmarkId }) => {
186186
</th>
187187
<th
188188
scope="col"
189-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
189+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
190190
onClick={() => setSortedField('lintScore')}
191191
>
192192
<div className="flex">
@@ -200,7 +200,7 @@ const Leaderboard: React.FC<LeaderboardProps> = ({ benchmarkId }) => {
200200
</th>
201201
<th
202202
scope="col"
203-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
203+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
204204
onClick={() => setSortedField('lintScore')}
205205
>
206206
<div className="flex">
@@ -214,7 +214,7 @@ const Leaderboard: React.FC<LeaderboardProps> = ({ benchmarkId }) => {
214214
</th>
215215
<th
216216
scope="col"
217-
className="dark:text-white px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
217+
className="dark:text-gray-100 px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"
218218
onClick={() => setSortedField('lintScore')}
219219
>
220220
<div className="flex">

0 commit comments

Comments
 (0)