diff --git a/bin/generate-html.js b/bin/generate-html.js
index 7c2b82e..c144fdd 100644
--- a/bin/generate-html.js
+++ b/bin/generate-html.js
@@ -10,7 +10,10 @@ const defaults = {
};
function template(rawOptions) {
- const options = Object.assign({}, defaults, rawOptions || {});
+ if (defaults.localeDir === "rtl") {
+ defaults.cssPath = "./main-rtl.css";
+ }
+ const options = Object.assign({}, defaults, rawOptions || {});
return `
diff --git a/bin/generate-rtl.js b/bin/generate-rtl.js
new file mode 100755
index 0000000..658d54c
--- /dev/null
+++ b/bin/generate-rtl.js
@@ -0,0 +1,19 @@
+#! /usr/bin/env node
+"use strict";
+const path = require("path");
+const fs = require("fs");
+const cssjanus = require("cssjanus");
+
+const FILE_NAME = path.join(__dirname, "../www/main-rtl.css");
+const FILE_PATH = path.join(__dirname, "../www/main.css");
+
+function convertCSS(filePath) {
+ try {
+ var data = fs.readFileSync(filePath, "utf8");
+ fs.writeFileSync(FILE_NAME, cssjanus.transform(data), "utf8");
+ } catch (e) {
+ throw e;
+ }
+}
+
+convertCSS(FILE_PATH);
diff --git a/package.json b/package.json
index e638537..86b5379 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
"build:js": "NODE_ENV=production webpack -p --optimize-dedupe",
"build:css": "node-sass src/main.scss -o www",
"postbuild": "node ./bin/generate-directories --static www -o build",
+ "postbuild:css": "bin/generate-rtl.js",
"start": "npm run setup && npm-run-all --parallel watch:*",
"watch:css": "npm run build:css && npm run build:css -- --source-map www/main.css.map -w -r",
"watch:js": "webpack-dev-server --hot --port=1944 --content-base www",
@@ -43,6 +44,7 @@
"chai-as-promised": "^5.1.0",
"cli-color": "^1.1.0",
"codeclimate-test-reporter": "^0.1.0",
+ "cssjanus": "1.1.2",
"eslint": "^1.10.2",
"eslint-config-airbnb": "^1.0.2",
"eslint-loader": "^1.1.1",
diff --git a/src/components/Search/Search.scss b/src/components/Search/Search.scss
index b6dc6b5..17dc801 100644
--- a/src/components/Search/Search.scss
+++ b/src/components/Search/Search.scss
@@ -25,11 +25,6 @@
outline: none;
border-color: $focus-blue;
}
- &:-moz-dir(rtl) {
- border: 1px solid;
- border-color: rgba(23, 51, 78, 0.15) rgba(23, 51, 78, 0.17) rgba(23, 51, 78, 0.2);
- border-left: none;
- }
}
.search-submit {
@@ -44,9 +39,6 @@
&:hover {
background: url("chrome://browser/skin/search-arrow-go.svg#search-arrow-go-inverted") center center no-repeat, linear-gradient(#4cb1ff, #1793e5);
}
- &:-moz-dir(rtl) {
- border-radius: 2px 0 0 2px;
- }
}
.search-input:focus + .search-submit {
@@ -63,8 +55,5 @@
background-repeat: no-repeat;
background-position: 5px center;
@include bgimage("magnifier.svg");
- &:-moz-dir(rtl) {
- right: 0;
- }
}
}
diff --git a/src/components/Settings/Settings.scss b/src/components/Settings/Settings.scss
index b19563a..be825d4 100644
--- a/src/components/Settings/Settings.scss
+++ b/src/components/Settings/Settings.scss
@@ -3,13 +3,9 @@
position: fixed;
top: 20px;
right: 20px;
+ left: 0;
z-index: 1;
text-align: right;
- &:-moz-dir(rtl) {
- right: auto;
- text-align: left;
- left: 20px;
- }
}
.settings-toggle {
background: none;
@@ -83,19 +79,6 @@
}
}
}
- &:-moz-dir(rtl) {
- &::before {
- right: auto;
- left: 10px;
- }
- &::after {
- right: auto;
- left: 10px;
- }
- &.active {
- text-align: right;
- }
- }
}
.settings-overlay {
display: none;