rtl languages friendly: issue #29

pull/2/head
gorhill 10 years ago
parent b42fd99bd0
commit 3ddb31a96c

@ -23,11 +23,11 @@ ul {
<li><span data-i18n="aboutPermissions"></span><br>
<li><a href="https://github.com/gorhill/uMatrix" data-i18n="aboutCode"></a><br>
<li><a href="https://github.com/gorhill/uMatrix/issues" data-i18n="aboutIssues"></a><br>
<li><span data-i18n="aboutContributors"></span><br>
<li><span data-i18n="aboutContributors"></span>
<ul>
<li>Code: <a href="https://github.com/gorhill/uMatrix/graphs/contributors">µMatrix, <a href="https://github.com/gorhill/httpswitchboard/graphs/contributors">HTTP Switchboard</a>
<li>Issues: <a href="https://github.com/gorhill/uMatrix/issues?q=is%3Aissue">µMatrix</a>, <a href="https://github.com/gorhill/httpswitchboard/issues?q=is%3Aissue">HTTP Switchboard</a>
<li>Translations: <a href="https://github.com/gorhill/uMatrix/wiki/Translation-work-contributors">Crowdin</a>
<li><span data-i18n="aboutCodeContributors"></span> <a href="https://github.com/gorhill/uMatrix/graphs/contributors">µMatrix, <a href="https://github.com/gorhill/httpswitchboard/graphs/contributors">HTTP Switchboard</a>
<li><span data-i18n="aboutIssueContributors"></span> <a href="https://github.com/gorhill/uMatrix/issues?q=is%3Aissue">µMatrix</a>, <a href="https://github.com/gorhill/httpswitchboard/issues?q=is%3Aissue">HTTP Switchboard</a>
<li><span data-i18n="aboutTranslationContributors"></span> <a href="https://github.com/gorhill/uMatrix/wiki/Translation-work-contributors">Crowdin</a>
</ul>
</ul>

@ -72,10 +72,11 @@ html.rtl {
white-space: pre-line;
z-index: 20;
}
.tip-anchor-left[data-tip]:hover:after {
html.ltr .tip-anchor-left[data-tip]:hover:after,
html.rtl .tip-anchor-right[data-tip]:hover:after {
left: -5vw;
}
.tip-anchor-right[data-tip]:hover:after {
html.ltr .tip-anchor-right[data-tip]:hover:after,
html.rtl .tip-anchor-left[data-tip]:hover:after {
right: -5vw;
}

@ -20,9 +20,14 @@ h3 {
font-size: 16px;
}
h2 + * {
margin: 0 0 0 1em;
padding: 0;
}
html.ltr h2 + * {
margin: 0 0 0 1em;
}
html.rtl h2 + * {
margin: 0 1em 0 0;
}
a {
text-decoration: none;
}

@ -15,15 +15,16 @@ select {
white-space: nowrap;
}
#requests-log {
margin: 0;
background-color: white;
border: 1px inset #eee;
padding: 0;
direction: ltr;
font: 11px monospace;
background-color: white;
margin: 0;
overflow: scroll;
padding: 0;
width: calc(100% - 1.5em);
}
#requests-log table {
#requestsTable {
border-collapse: collapse;
}
#requests-log tr {

@ -38,10 +38,12 @@ body {
position: absolute;
top: 0;
}
.toolbar.alignLeft {
html.ltr .toolbar.alignLeft,
html.rtl .toolbar.alignRight {
left: 0;
}
.toolbar.alignRight {
html.ltr .toolbar.alignRight,
html.rtl .toolbar.alignLeft {
right: 0;
}
@ -316,8 +318,7 @@ body.tScopeNarrow #scopeCell {
.matrix .matRow > .matCell:first-child {
width: 16em;
text-align: start;
direction: rtl;
text-align: right;
}
.matrix .matRow.l2 > .matCell:first-child {
margin-left: 1px;

@ -26,6 +26,42 @@ div > p:last-child {
#diff > div > div > span {
float: left;
}
html.ltr #revertButton:after {
content: '\2009\f061';
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
line-height: 1;
vertical-align: baseline;
display: inline-block;
}
html.rtl #revertButton:after {
content: '\2009\f060';
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
line-height: 1;
vertical-align: baseline;
display: inline-block;
}
html.ltr #commitButton:before {
content: '\f060\2009';
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
line-height: 1;
vertical-align: baseline;
display: inline-block;
}
html.rtl #commitButton:before {
content: '\f061\2009';
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
line-height: 1;
vertical-align: baseline;
display: inline-block;
}
#revertButton,
#commitButton,
#diff.edit #editEnterButton {
@ -68,7 +104,9 @@ div > p:last-child {
}
#diff li {
background-color: white;
direction: ltr;
padding: 2px 0;
text-align: left;
white-space: nowrap;
}
#diff li:nth-of-type(2n+0) {
@ -95,7 +133,7 @@ div > p:last-child {
background-color: #f8f8ff;
border: 0;
border-top: 1px solid #eee;
visibility: hidden;
direction: ltr;
font: 12px monospace;
line-height: calc(140% + 4px);
height: 100%;
@ -106,6 +144,7 @@ div > p:last-child {
padding: 1em 0 0 0;
position: absolute;
resize: none;
visibility: hidden;
white-space: nowrap;
width: 100%;
}

@ -29,9 +29,8 @@ window.addEventListener('load', function() {
'fa': true,
'he': true
};
if ( rtlLanguages[navigator.language] ) {
uDom('html').addClass('rtl');
}
uDom('html').toggleClass('rtl', rtlLanguages.hasOwnProperty(navigator.language));
uDom('html').toggleClass('ltr', rtlLanguages.hasOwnProperty(navigator.language) === false);
var nodeList = document.querySelectorAll('[data-i18n]');
var i = nodeList.length;

@ -63,6 +63,7 @@ var matrixHeaderPrettyNames = {
'other': ''
};
var firstPartyLabel = '';
var blacklistedHostnamesLabel = '';
/******************************************************************************/
@ -534,7 +535,7 @@ function renderMatrixCellDomain(cell, domain) {
.prop('hostname', domain)
.addClass(getCellClass(domain, '*'))
.contents();
contents.nodeAt(0).textContent = '\u202A' + punycode.toUnicode(domain);
contents.nodeAt(0).textContent = punycode.toUnicode(domain);
contents.nodeAt(1).textContent = ' ';
}
@ -543,7 +544,7 @@ function renderMatrixCellSubdomain(cell, domain, subomain) {
.prop('hostname', subomain)
.addClass(getCellClass(subomain, '*'))
.contents();
contents.nodeAt(0).textContent = '\u202A' + punycode.toUnicode(subomain.slice(0, subomain.lastIndexOf(domain)-1)) + '.';
contents.nodeAt(0).textContent = punycode.toUnicode(subomain.slice(0, subomain.lastIndexOf(domain)-1)) + '.';
contents.nodeAt(1).textContent = punycode.toUnicode(domain);
}
@ -552,7 +553,7 @@ function renderMatrixMetaCellDomain(cell, domain) {
.prop('hostname', domain)
.addClass(getCellClass(domain, '*'))
.contents();
contents.nodeAt(0).textContent = '\u202A\u2217.' + punycode.toUnicode(domain);
contents.nodeAt(0).textContent = '\u2217.' + punycode.toUnicode(domain);
contents.nodeAt(1).textContent = ' ';
}
@ -694,7 +695,7 @@ function hostnameCompare(a,b) {
/******************************************************************************/
function makeMatrixGroup0SectionDomain() {
return makeMatrixRowDomain('1st-party').addClass('g0 l1');
return makeMatrixRowDomain(firstPartyLabel).addClass('g0 l1');
}
function makeMatrixGroup0Section() {
@ -952,7 +953,8 @@ function initMenuEnvironment() {
prettyNames[key] = text;
}
blacklistedHostnamesLabel = '\u202A' + uDom('[data-i18n="matrixBlacklistedHostnames"]').text();
firstPartyLabel = uDom('[data-i18n="matrix1stPartyLabel"]').text();
blacklistedHostnamesLabel = uDom('[data-i18n="matrixBlacklistedHostnames"]').text();
}
/******************************************************************************/

@ -75,6 +75,7 @@
<!-- Convenient to auto-fetch locale strings used in scripts -->
<div style="display: none;">
<span data-i18n="matrixBlacklistedHostnames"></span>
<span data-i18n="matrix1stPartyLabel"></span>
</div>
<script src="lib/punycode.min.js"></script>

@ -24,7 +24,7 @@ ul > li {
color: #888;
}
#spoof-user-agent-with {
margin-left: 1.25em;
direction: ltr;
display: block;
font-size: 11px;
width: 50em;
@ -33,6 +33,12 @@ ul > li {
word-wrap: normal;
overflow-x: scroll;
}
html.ltr #spoof-user-agent-with {
margin-left: 1.25em;
}
html.rtl #spoof-user-agent-with {
margin-right: 1.25em;
}
</style>
</head>
@ -86,7 +92,7 @@ ul > li {
<input id="spoof-user-agent" type="checkbox"><label data-i18n="privacySpoofUserAgentPrompt1" for="spoof-user-agent"></label> <input id="spoof-user-agent-every" type="text" value="5" size="3"> <span data-i18n="privacySpoofUserAgentPrompt2"></span>
<button class="whatisthis"></button>
<div class="whatisthis-expandable para" data-i18n="privacySpoofUserAgentHelp"></div>
<textarea id="spoof-user-agent-with"></textarea>
<textarea id="spoof-user-agent-with" spellcheck="false"></textarea>
</ul>
<h2 data-i18n="privacyBehindTheSceneHeader"></h2>

@ -15,14 +15,14 @@
<div class="pane left">
<div>
<h2 data-i18n="userRulesPermanentHeader"></h2>
<button type="button" id="revertButton"><span data-i18n="userRulesRevert"></span>&thinsp;<span class="fa">&#xf061;</span></button>
<button type="button" id="revertButton" data-i18n="userRulesRevert"></button>
</div>
<ul></ul>
</div>
<div class="pane right">
<div>
<h2 data-i18n="userRulesTemporaryHeader"></h2>
<button type="button" id="commitButton"><span class="fa">&#xf060;</span>&thinsp;<span data-i18n="userRulesCommit"></span></button>
<button type="button" id="commitButton" data-i18n="userRulesCommit"></button>
<button type="button" id="editEnterButton" data-i18n="userRulesEdit"></button>
<button type="button" id="editStopButton" data-i18n="userRulesEditSave"></button>
<button type="button" id="editCancelButton" data-i18n="userRulesEditDicard"></button>

@ -99,6 +99,10 @@
"message": "Reload the page.",
"description": "Tool tip for the reload button"
},
"matrix1stPartyLabel" : {
"message": "1st-party",
"description": "1st-party"
},
"matrixBlacklistedHostnames" : {
"message": "{{count}} blacklisted hostname(s)",
"description": "Appears in the metadata row of bottom-most group: **mind the limited width**"
@ -451,6 +455,18 @@
"message":"Contributors",
"description":"English: Contributors"
},
"aboutCodeContributors":{
"message":"Code:",
"description":""
},
"aboutIssueContributors":{
"message":"Issues:",
"description":""
},
"aboutTranslationContributors":{
"message":"Translations:",
"description":""
},
"aboutUserDataHeader" : {
"message": "Your data",
"description": ""

Loading…
Cancel
Save