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.
The npm package cssjanus receives a total of 183,511 weekly downloads. As such, cssjanus popularity was classified as popular.
We found that cssjanus demonstrated a healthy version release cadence and project activity because the last version was released less than 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
Research
The Socket Research Team breaks down a malicious wrapper package that uses obfuscation to harvest credentials and exfiltrate sensitive data.
Research
Security News
Attackers used a malicious npm package typosquatting a popular ESLint plugin to steal sensitive data, execute commands, and exploit developer systems.
Security News
The Ultralytics' PyPI Package was compromised four times in one weekend through GitHub Actions cache poisoning and failure to rotate previously compromised API tokens.