Skip to content

Commit 4570bc4

Browse files
yoshiakishuv1k
authored andcommitted
Fix/light theme display (#957)
* refacotor(react): remove unnecessary css property * fix(react): enable subscription time showed in a light theme
1 parent 496614c commit 4570bc4

File tree

2 files changed

+9
-3
lines changed

2 files changed

+9
-3
lines changed

packages/graphql-playground-react/src/components/Playground/Results.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -135,14 +135,14 @@ const SubscriptionTime = styled.div`
135135
content: '';
136136
top: 9px;
137137
left: 95px;
138-
border-top: 1px solid ${p => p.theme.colours.white20};
138+
border-top: 1px solid
139+
${p => p.theme.editorColours.subscriptionTimeBoaderTop};
139140
}
140141
`
141142

142143
const SubscriptionTimeText = styled.div`
143-
color: rgba(23, 42, 58, 1);
144144
font-size: 12px;
145-
color: rgba(255, 255, 255, 0.5);
145+
color: ${p => p.theme.editorColours.subscriptionTimeText};
146146
padding-left: 15px;
147147
`
148148

packages/graphql-playground-react/src/styled/theme.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,8 @@ export interface EditorColours {
9494
buttonWorkspaceHover: string
9595
buttonWorkspaceText: string
9696
circle: string
97+
subscriptionTimeBoaderTop: string
98+
subscriptionTimeText: string
9799
}
98100

99101
export const darkColours: Colours = {
@@ -227,6 +229,8 @@ export const darkEditorColours: EditorColours = {
227229
buttonWorkspaceHover: '#a4acb2',
228230
buttonWorkspaceText: 'rgb(23, 42, 58)',
229231
circle: 'rgba(255, 255, 255, 0.4)',
232+
subscriptionTimeBoaderTop: 'rgba(255, 255, 255, 0.2)',
233+
subscriptionTimeText: 'rgba(255, 255, 255, 0.5)',
230234
}
231235

232236
export const lightEditorColours: EditorColours = {
@@ -283,6 +287,8 @@ export const lightEditorColours: EditorColours = {
283287
buttonWorkspaceHover: 'rgb(157, 166, 173)',
284288
buttonWorkspaceText: 'rgb(238, 239, 240)',
285289
circle: 'rgba(23,42,58,.4)',
290+
subscriptionTimeBoaderTop: 'rgba(23, 42, 58, 0.2)',
291+
subscriptionTimeText: 'rgba(23, 42, 58, 0.5)',
286292
}
287293

288294
export interface Sizes {

0 commit comments

Comments
 (0)