Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2025-08-08 14:14:56 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix: make ConsoleEditor typography closer to the payload viewer

Browse Source
This commit is contained in:
Arian Rahimi 2020-01-21 16:32:50 +03:30
parent cb2389a586
commit e80fe1d47c
2 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/Console/ConsoleEditor.tsx
View File

@ -46,8 +46,13 @@ export class ConsoleEditor extends React.Component<ConsoleEditorProps> {
enableSnippets: true, enableSnippets: true,
showLineNumbers: true, showLineNumbers: true,
tabSize: 2, tabSize: 2,
fontFamily: 'Courier,monospace,Vazir',
displayIndentGuides: false,
}}
fontSize={13}
style={{
lineHeight: '23px',
}} }}
fontSize={15}
mode="json" mode="json"
name="request-builder-editor" name="request-builder-editor"
editorProps={{ $blockScrolling: true }} editorProps={{ $blockScrolling: true }}

4
src/components/Console/ConsoleEditorWrapper.ts
View File

@ -15,8 +15,9 @@ export const ConsoleEditorWrapper = styled.div`
background: #11171a !important; background: #11171a !important;
width: 100% !important; width: 100% !important;
} }
& .ace_editor .ace_marker-layer .ace_selection { & .ace_editor .ace_marker-layer .ace_selection, & .ace_editor .ace_marker-layer .ace_selected-word {
background: ${lighten(0.05, '#11171a')} !important; background: ${lighten(0.05, '#11171a')} !important;
border-color: ${lighten(0.05, '#11171a')} !important;
} }
& .ace_editor .ace_marker-layer .ace_active-line { & .ace_editor .ace_marker-layer .ace_active-line {
background: rgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.2);
@ -30,6 +31,7 @@ export const ConsoleEditorWrapper = styled.div`
& .ace_editor .ace_line .ace_fold { & .ace_editor .ace_line .ace_fold {
background: none !important; background: none !important;
color: #aaa; color: #aaa;
border: none;
} }
& .ace_editor .ace_line .ace_fold:hover { & .ace_editor .ace_line .ace_fold:hover {
background: none !important; background: none !important;