The cssjanus npm package is a utility for converting CSS stylesheets between left-to-right (LTR) and right-to-left (RTL) formats. This is particularly useful for supporting languages that are read from right to left, such as Arabic and Hebrew.
Convert LTR to RTL
This feature allows you to convert a left-to-right CSS stylesheet to a right-to-left format. The example code demonstrates how to transform a simple CSS rule from LTR to RTL.
const cssjanus = require('cssjanus');
const ltrCss = 'body { margin-left: 10px; }';
const rtlCss = cssjanus.transform(ltrCss);
console.log(rtlCss); // Output: 'body { margin-right: 10px; }'Convert RTL to LTR
This feature allows you to convert a right-to-left CSS stylesheet to a left-to-right format. The example code demonstrates how to transform a simple CSS rule from RTL to LTR.
const cssjanus = require('cssjanus');
const rtlCss = 'body { margin-right: 10px; }';
const ltrCss = cssjanus.transform(rtlCss);
console.log(ltrCss); // Output: 'body { margin-left: 10px; }'Preserve Directional Neutral Rules
This feature ensures that CSS rules that are neutral with respect to directionality (e.g., color properties) remain unchanged during the transformation. The example code shows that a color property remains the same after transformation.
const cssjanus = require('cssjanus');
const neutralCss = 'body { color: red; }';
const transformedCss = cssjanus.transform(neutralCss);
console.log(transformedCss); // Output: 'body { color: red; }'rtlcss is another tool for converting CSS from LTR to RTL. It offers more customization options and plugins for advanced transformations. Compared to cssjanus, rtlcss provides a more extensive API and greater flexibility for handling complex CSS rules.
postcss-rtl is a PostCSS plugin that adds RTL support to your CSS. It allows you to write your styles in LTR and automatically generate the RTL counterpart. This package integrates well with the PostCSS ecosystem, making it a good choice for projects already using PostCSS.
Convert CSS stylesheets between left-to-right and right-to-left.
Based the original Google project.
See Interactive demo.
npm install cssjanus
var cssjanus = require( 'cssjanus' );
var rtlCss = cssjanus.transform( ltrCss );
transform( string css [, Object options ] ) : string
Parameters:
css Stylesheet to transformoptions: Options object (optional)options.transformDirInUrl (Boolean): Transform directions in URLs, such as ltr to rtl. Default: false.options.transformEdgeInUrl (Boolean): Transform edges in URLs, such as left to right. Default: false.If a rule is not meant to be flipped by CSSJanus, use a /* @noflip */ comment to protect the rule.
.rule1 {
/* Will be converted to margin-right */
margin-left: 1em;
}
/* @noflip */
.rule2 {
/* Will be preserved as margin-left */
margin-left: 1em;
}
FAQs
Convert CSS stylesheets between left-to-right and right-to-left directions.
We found that cssjanus demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 4 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
AGENTS.md is a fast-growing open format giving AI coding agents a shared, predictable way to understand project setup, style, and workflows.
Security News
/Research
Malicious npm package impersonates Nodemailer and drains wallets by hijacking crypto transactions across multiple blockchains.
Security News
This episode explores the hard problem of reachability analysis, from static analysis limits to handling dynamic languages and massive dependency trees.