Skip to content

Commit 1678432

Browse files
committed
fix: remaining dark mode issues - light backgrounds and text colors
- Replace hardcoded light backgrounds (#EEF0FF, #FEE2E2, #f0f0ff, etc.) with rgba tints that work on both light and dark backgrounds - Fix FilterButton text color to use theme.colors.neutral800 - Fix hover states to use theme.colors.neutral100 - Replace #F3F4F6 backgrounds with rgba(128,128,128,0.08) - Fix QueryBuilder placeholder text to use theme.colors.neutral500
1 parent 23d96df commit 1678432

8 files changed

Lines changed: 19 additions & 19 deletions

admin/src/components/AdvancedFilterButton.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,15 +25,15 @@ const FilterButton = styled.button<{ $isActive?: boolean }>`
2525
border: 1px solid ${props => props.$isActive ? '#4945FF' : 'rgba(128, 128, 128, 0.25)'};
2626
border-radius: 4px;
2727
background: ${props => props.$isActive
28-
? '#EEF0FF'
28+
? 'rgba(73, 69, 255, 0.08)'
2929
: props.theme.colors.neutral0};
30-
color: ${props => props.$isActive ? '#4945FF' : '#32324d'};
30+
color: ${props => props.$isActive ? '#4945FF' : props.theme.colors.neutral800};
3131
cursor: pointer;
3232
transition: all 0.15s ease;
3333
white-space: nowrap;
3434
3535
&:hover {
36-
background: ${props => props.$isActive ? '#E0E7FF' : '#f6f6f9'};
36+
background: ${props => props.$isActive ? 'rgba(73, 69, 255, 0.12)' : props.theme.colors.neutral100};
3737
border-color: ${props => props.$isActive ? '#4945FF' : 'rgba(128, 128, 128, 0.3)'};
3838
}
3939
@@ -57,13 +57,13 @@ const ClearButton = styled.button`
5757
padding: 0;
5858
border: 1px solid rgba(239, 68, 68, 0.3);
5959
border-radius: 4px;
60-
background: #fef2f2;
60+
background: rgba(239, 68, 68, 0.06);
6161
color: #dc2626;
6262
cursor: pointer;
6363
transition: all 0.15s ease;
6464
6565
&:hover {
66-
background: #fee2e2;
66+
background: rgba(239, 68, 68, 0.12);
6767
border-color: rgba(239, 68, 68, 0.4);
6868
}
6969

admin/src/components/CreateViewModal.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ const IconButton = styled.button<{ $isSelected?: boolean }>`
4949
5050
&:hover {
5151
border-color: #4945FF;
52-
background: #EEF0FF;
52+
background: rgba(73, 69, 255, 0.08);
5353
5454
svg {
5555
color: #4945FF;

admin/src/components/CustomSelect.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ const DropdownItem = styled.button<{ $isSelected: boolean }>`
9494
9595
&:focus {
9696
outline: none;
97-
background: #f0f0ff;
97+
background: rgba(73, 69, 255, 0.06);
9898
}
9999
100100
@media (max-width: 768px) {

admin/src/components/QueryBuilder.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -258,7 +258,7 @@ const DesktopControls = styled.div`
258258
const DragHandle = styled.div`
259259
cursor: grab;
260260
padding: 8px 4px;
261-
color: #9CA3AF;
261+
color: ${(p) => p.theme.colors.neutral500};
262262
display: flex;
263263
flex-direction: column;
264264
align-items: center;
@@ -362,7 +362,7 @@ const ValueInput = styled.input`
362362
}
363363
364364
&::placeholder {
365-
color: #9CA3AF;
365+
color: ${(p) => p.theme.colors.neutral500};
366366
}
367367
368368
/* Mobile */
@@ -375,7 +375,7 @@ const ValueInput = styled.input`
375375
`;
376376

377377
const DeleteButton = styled.button`
378-
background: #FEE2E2;
378+
background: rgba(239, 68, 68, 0.12);
379379
border: none;
380380
flex-shrink: 0;
381381
border-radius: 8px;

admin/src/components/RelationFieldSelector.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -116,7 +116,7 @@ const ClearButton = styled.button`
116116
width: 24px;
117117
height: 24px;
118118
border: none;
119-
background: #FEE2E2;
119+
background: rgba(239, 68, 68, 0.12);
120120
color: #DC2626;
121121
border-radius: 6px;
122122
cursor: pointer;
@@ -386,7 +386,7 @@ const RelationFieldSelector: React.FC<Props> = ({
386386
<MobileNestedLabel>Nested field:</MobileNestedLabel>
387387
<SelectWrapper $isNew={newLevel === 1} $level={1}>
388388
{loadingLevel === 1 ? (
389-
<Box padding={3} style={{ display: 'flex', alignItems: 'center', gap: '8px', background: '#F3F4F6', borderRadius: '8px', height: '40px', width: '100%' }}>
389+
<Box padding={3} style={{ display: 'flex', alignItems: 'center', gap: '8px', background: 'rgba(128, 128, 128, 0.08)', borderRadius: '8px', height: '40px', width: '100%' }}>
390390
<Loader small /> Loading...
391391
</Box>
392392
) : (
@@ -416,7 +416,7 @@ const RelationFieldSelector: React.FC<Props> = ({
416416
<MobileNestedLabel>Deep nested:</MobileNestedLabel>
417417
<SelectWrapper $isNew={newLevel === 2} $level={2}>
418418
{loadingLevel === 2 ? (
419-
<Box padding={3} style={{ display: 'flex', alignItems: 'center', gap: '8px', background: '#F3F4F6', borderRadius: '8px', height: '40px', width: '100%' }}>
419+
<Box padding={3} style={{ display: 'flex', alignItems: 'center', gap: '8px', background: 'rgba(128, 128, 128, 0.08)', borderRadius: '8px', height: '40px', width: '100%' }}>
420420
<Loader small /> Loading...
421421
</Box>
422422
) : (

admin/src/components/StrapiStyleFilterModal.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -97,13 +97,13 @@ const DeleteButton = styled.button`
9797
width: 32px;
9898
height: 32px;
9999
border: none;
100-
background: #fef2f2;
100+
background: rgba(239, 68, 68, 0.06);
101101
color: #dc2626;
102102
border-radius: 4px;
103103
cursor: pointer;
104104
flex-shrink: 0;
105105
&:hover {
106-
background: #fee2e2;
106+
background: rgba(239, 68, 68, 0.12);
107107
}
108108
svg {
109109
width: 14px;
@@ -126,7 +126,7 @@ const AddButton = styled.button`
126126
transition: all 0.15s ease;
127127
&:hover {
128128
border-color: #4945ff;
129-
background: #f0f0ff;
129+
background: rgba(73, 69, 255, 0.06);
130130
}
131131
`;
132132

admin/src/components/ViewsListPopover.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ const BookmarksList = styled.div`
6969
}
7070
7171
&::-webkit-scrollbar-track {
72-
background: #f1f1f1;
72+
background: rgba(128, 128, 128, 0.12);
7373
border-radius: 3px;
7474
}
7575
@@ -213,7 +213,7 @@ const ViewAllLink = styled.button`
213213
transition: all 0.15s ease;
214214
215215
&:hover {
216-
background: #eef0ff;
216+
background: rgba(73, 69, 255, 0.08);
217217
}
218218
219219
svg {

admin/src/pages/UpgradePage.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -169,7 +169,7 @@ const FeatureIcon = styled(Box)<FeatureIconProps>`
169169
background: rgba(34, 197, 94, 0.15);
170170
svg { color: #16A34A; }
171171
` : `
172-
background: #FEE2E2;
172+
background: rgba(239, 68, 68, 0.12);
173173
svg { color: #DC2626; }
174174
`}
175175
`;

0 commit comments

Comments
 (0)