Bug 1590212 - More RTL fixes to the console editor r=nchevobbe

Differential Revision: https://phabricator.services.mozilla.com/D49986

--HG--
extra : moz-landing-system : lando
This commit is contained in:
Itiel 2019-10-29 12:40:13 +00:00
parent 5d3dcb3132
commit d26a949e7e
2 changed files with 24 additions and 6 deletions

View File

@ -128,6 +128,10 @@ body {
grid-auto-flow: column;
}
.webconsole-app:not(.jsterm-editor) .jsterm-input-container {
direction: ltr;
}
.webconsole-app .webconsole-output:empty ~ .jsterm-input-container {
border-top: none;
}
@ -138,6 +142,10 @@ body {
margin: 0;
}
:root:dir(rtl) .webconsole-input-openEditorButton {
transform: scaleX(-1);
}
.webconsole-input-openEditorButton::before {
background-image: url("chrome://devtools/skin/images/webconsole/editor.svg");
}
@ -281,10 +289,6 @@ body {
margin-inline-end: 2px;
}
[dir="rtl"] .jsterm-editor .webconsole-editor-toolbar .webconsole-editor-toolbar-executeButton::before {
transform: rotate(180deg);
}
.jsterm-editor .webconsole-editor-toolbar .webconsole-editor-toolbar-history-prevExpressionButton {
grid-column: -5 / -6;
}

View File

@ -24,15 +24,29 @@
.reverse-search input {
border: none;
flex-grow: 1;
padding-inline-start: var(--console-inline-start-gutter);
background: transparent;
color: currentColor;
background-image: url(chrome://devtools/skin/images/search.svg);
background-repeat: no-repeat;
background-size: 12px;
background-position: 10px 2px;
--background-position-inline: 10px;
background-position: var(--background-position-inline) 2px;
-moz-context-properties: fill;
fill: var(--theme-icon-dimmed-color);
text-align: match-parent;
unicode-bidi: plaintext;
}
.reverse-search:dir(ltr) input {
/* Be explicit about left/right direction to prevent the text/placeholder
* from overlapping the background image when the user changes the text
* direction manually (e.g. via Ctrl+Shift). */
padding-left: var(--console-inline-start-gutter);
}
.reverse-search:dir(rtl) input {
background-position-x: right var(--background-position-inline);
padding-right: var(--console-inline-start-gutter);
}
.reverse-search input:focus {