Added rtl toggle button #3282
Merged
Added rtl toggle button #3282
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This was referenced Oct 17, 2019
ZeroX-DG
requested changes
Nov 7, 2019
browser/components/CodeEditor.js
Outdated
| @@ -294,6 +294,8 @@ export default class CodeEditor extends React.Component { | |||
| scrollPastEnd: this.props.scrollPastEnd, | |||
| inputStyle: 'textarea', | |||
| dragDrop: false, | |||
| direction: RTL ? 'rtl' : 'ltr', | |||
| rtlMoveVisually: RTL ? 'true' : 'false', | |||
There was a problem hiding this comment.
Why don't you just write RTL instead of RTL ? 'true' : 'false'
browser/components/CodeEditor.js
Outdated
| @@ -555,6 +557,10 @@ export default class CodeEditor extends React.Component { | |||
| if (prevProps.keyMap !== this.props.keyMap) { | |||
| needRefresh = true | |||
| } | |||
| if (prevProps.RTL !== this.props.RTL) { | |||
| this.editor.setOption('direction', this.props.RTL ? 'rtl' : 'ltr') | |||
| this.editor.setOption('rtlMoveVisually', this.props.RTL ? 'true' : 'false') | |||
There was a problem hiding this comment.
Can you write this.props.RTL instead of this.props.RTL ? 'true' : 'false' please?
| ${RTL ? 'direction: rtl;' : ''} | ||
| ${RTL ? 'text-align: right;' : ''} | ||
|
|
||
|
|
There was a problem hiding this comment.
Please remove these 2 empty lines
| onClick, editorDirection | ||
| }) => ( | ||
| <div styleName='control-toggleModeButton'> | ||
| <div styleName={editorDirection ? 'active' : undefined} onClick={() => onClick()}> |
There was a problem hiding this comment.
editorDirection is quite hard to understand, can you assign it to a more meaningful variable name such as isRTL or something?
ZeroX-DG
added
awaiting changes 🖊️
|
@ibraude ping! |
|
@ZeroX-DG Sorry for the delay |
Flexo013
added
awaiting review ❇️
|
@ibraude can you fix the conflict before I officially approve it? |
ZeroX-DG
added
awaiting changes 🖊️
Flexo013
added
awaiting review ❇️
ZeroX-DG
requested changes
Jan 12, 2020
| ${scrollPastEnd ? ` | ||
| padding-bottom: 90vh; | ||
| box-sizing: border-box; | ||
| ` | ||
| : ''} | ||
| ${optimizeOverflowScroll ? 'height: 100%;' : ''} |
There was a problem hiding this comment.
This optimizeOverflowScroll variable is undefined can you fix it please
ZeroX-DG
added
awaiting changes 🖊️
ZeroX-DG
added
approved 👍
Rokt33r
removed
the
approved 👍
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
I have added a direction toggle switch for the MarkdownPreview and CodeEditor. (It's located at the top right, next to the Toggle Mode switch button)
This is so notes can be taken and read comfortably when using right-to-left languages like Hebrew or Arabic.
Here is the Boostnote welcome page in the LTR direction:
Here is the Boostnote welcome page in Hebrew with the RTL direction:
I have also added a hotkey for direction toggle:
Issue fixed
This fixes the open issue "Please add RTL support" #846
I believe this is a simple solution that answers the need for people using both ltr and rtl languages regularly.
Type of changes
Checklist:
All tests pass except for the test:
tests/lib/markdown-toc-generator-test.jsI think that the test throws an error because it recognizes the difference between the rtl to ltr as seen in the image below when infact it is the desired result.
Hope this helps.
Cheers