holm/bruno
1
0
Fork 0
forked from extern/bruno
Code Issues Pull Requests Packages Projects Releases Wiki Activity

RequestPane body form input text color visibility fix in dark mode (#70)

Browse Source
This commit is contained in:
Vinod Godti 2022-11-10 18:29:17 +05:30 committed by GitHub
parent b93be5a846
commit cffef31f97
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 27 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/StyledWrapper.js
View File

@ -12,7 +12,7 @@ const Wrapper = styled.div`
} }
thead { thead {
color: ${(props) => props.theme.table.thead.color};; color: ${(props) => props.theme.table.thead.color};
font-size: 0.8125rem; font-size: 0.8125rem;
user-select: none; user-select: none;
} }
@ -29,6 +29,7 @@ const Wrapper = styled.div`
width: 100%; width: 100%;
border: solid 1px transparent; border: solid 1px transparent;
outline: none !important; outline: none !important;
color: ${(props) => props.theme.table.input.color};
&:focus { &:focus {
outline: none !important; outline: none !important;

3
packages/bruno-app/src/components/RequestPane/MultipartFormParams/StyledWrapper.js
View File

@ -12,7 +12,7 @@ const Wrapper = styled.div`
} }
thead { thead {
color: ${(props) => props.theme.table.thead.color};; color: ${(props) => props.theme.table.thead.color};
font-size: 0.8125rem; font-size: 0.8125rem;
user-select: none; user-select: none;
} }
@ -29,6 +29,7 @@ const Wrapper = styled.div`
width: 100%; width: 100%;
border: solid 1px transparent; border: solid 1px transparent;
outline: none !important; outline: none !important;
color: ${(props) => props.theme.table.input.color};
&:focus { &:focus {
outline: none !important; outline: none !important;

19
packages/bruno-app/src/themes/dark.js
View File

@ -15,7 +15,7 @@ const darkTheme = {
}, },
menubar: { menubar: {
bg: '#333333', bg: '#333333'
}, },
sidebar: { sidebar: {
@ -55,8 +55,8 @@ const darkTheme = {
}, },
dropdown: { dropdown: {
color: "rgb(204, 204, 204)", color: 'rgb(204, 204, 204)',
iconColor: "rgb(204, 204, 204)", iconColor: 'rgb(204, 204, 204)',
bg: 'rgb(48, 48, 49)', bg: 'rgb(48, 48, 49)',
hoverBg: '#185387', hoverBg: '#185387',
shadow: 'rgb(0 0 0 / 36%) 0px 2px 8px', shadow: 'rgb(0 0 0 / 36%) 0px 2px 8px',
@ -107,7 +107,7 @@ const darkTheme = {
active: { active: {
bg: 'transparent', bg: 'transparent',
hoverBg: 'transparent' hoverBg: 'transparent'
}, }
}, },
gridBorder: '#4f4f4f' gridBorder: '#4f4f4f'
} }
@ -122,9 +122,9 @@ const darkTheme = {
}, },
body: { body: {
color: '#ccc', color: '#ccc',
bg: 'rgb(48, 48, 49)', bg: 'rgb(48, 48, 49)'
}, },
input : { input: {
bg: 'rgb(65, 65, 65)', bg: 'rgb(65, 65, 65)',
border: 'rgb(65, 65, 65)', border: 'rgb(65, 65, 65)',
focusBorder: 'rgb(65, 65, 65)' focusBorder: 'rgb(65, 65, 65)'
@ -191,10 +191,13 @@ const darkTheme = {
table: { table: {
border: '#333', border: '#333',
thead : { thead: {
color: 'rgb(204, 204, 204)' color: 'rgb(204, 204, 204)'
}, },
striped: '#2A2D2F' striped: '#2A2D2F',
input: {
color: '#555555'
}
}, },
plainGrid: { plainGrid: {

21
packages/bruno-app/src/themes/light.js
View File

@ -7,7 +7,7 @@ const lightTheme = {
colors: { colors: {
text: { text: {
danger: 'rgb(185, 28, 28)', danger: 'rgb(185, 28, 28)',
muted: '#4b5563', muted: '#4b5563'
}, },
bg: { bg: {
danger: '#dc3545' danger: '#dc3545'
@ -15,7 +15,7 @@ const lightTheme = {
}, },
menubar: { menubar: {
bg: 'rgb(44, 44, 44)', bg: 'rgb(44, 44, 44)'
}, },
sidebar: { sidebar: {
@ -55,8 +55,8 @@ const lightTheme = {
}, },
dropdown: { dropdown: {
color: "rgb(48 48 48)", color: 'rgb(48 48 48)',
iconColor: "rgb(75, 85, 99)", iconColor: 'rgb(75, 85, 99)',
bg: '#fff', bg: '#fff',
hoverBg: '#e9e9e9', hoverBg: '#e9e9e9',
shadow: 'rgb(50 50 93 / 25%) 0px 6px 12px -2px, rgb(0 0 0 / 30%) 0px 3px 7px -3px', shadow: 'rgb(50 50 93 / 25%) 0px 6px 12px -2px, rgb(0 0 0 / 30%) 0px 3px 7px -3px',
@ -107,7 +107,7 @@ const lightTheme = {
active: { active: {
bg: '#dcdcdc', bg: '#dcdcdc',
hoverBg: '#dcdcdc' hoverBg: '#dcdcdc'
}, }
}, },
gridBorder: '#f4f4f4' gridBorder: '#f4f4f4'
} }
@ -126,9 +126,9 @@ const lightTheme = {
}, },
body: { body: {
color: 'rgb(52, 52, 52)', color: 'rgb(52, 52, 52)',
bg: 'white', bg: 'white'
}, },
input : { input: {
bg: 'white', bg: 'white',
border: '#ccc', border: '#ccc',
focusBorder: '#8b8b8b' focusBorder: '#8b8b8b'
@ -195,10 +195,13 @@ const lightTheme = {
table: { table: {
border: '#efefef', border: '#efefef',
thead : { thead: {
color: '#616161' color: '#616161'
}, },
striped: '#f3f3f3' striped: '#f3f3f3',
input: {
color: '#000000'
}
}, },
plainGrid: { plainGrid: {