{"id":13397832,"url":"https://github.com/wikimedia/node-cssjanus","last_synced_at":"2025-03-14T00:32:42.326Z","repository":{"id":3748433,"uuid":"4823366","full_name":"wikimedia/node-cssjanus","owner":"wikimedia","description":"↔️ Convert CSS between left-to-right and right-to-left. Mirror of https://gerrit.wikimedia.org/g/mediawiki/libs/node-cssjanus/. Contribute via https://www.mediawiki.org/wiki/Developer_account.","archived":false,"fork":false,"pushed_at":"2023-10-24T23:56:19.000Z","size":498,"stargazers_count":198,"open_issues_count":1,"forks_count":52,"subscribers_count":10,"default_branch":"master","last_synced_at":"2023-12-19T18:54:24.169Z","etag":null,"topics":["css","cssjanus","javascript","stylesheets","swap"],"latest_commit_sha":null,"homepage":"https://cssjanus.github.io","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/wikimedia.png","metadata":{"files":{"readme":"README.md","changelog":"History.md","contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":"AUTHORS.txt"}},"created_at":"2012-06-28T17:15:35.000Z","updated_at":"2024-01-02T19:35:58.221Z","dependencies_parsed_at":"2024-01-02T19:47:40.504Z","dependency_job_id":null,"html_url":"https://github.com/wikimedia/node-cssjanus","commit_stats":{"total_commits":120,"total_committers":20,"mean_commits":6.0,"dds":0.3833333333333333,"last_synced_commit":"7c97220768acf29dba95a3227b6ccedf022a320b"},"previous_names":["cssjanus/cssjanus"],"tags_count":15,"template":null,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wikimedia%2Fnode-cssjanus","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wikimedia%2Fnode-cssjanus/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wikimedia%2Fnode-cssjanus/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wikimedia%2Fnode-cssjanus/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/wikimedia","download_url":"https://codeload.github.com/wikimedia/node-cssjanus/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243222206,"owners_count":20256227,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","cssjanus","javascript","stylesheets","swap"],"created_at":"2024-07-30T18:01:47.809Z","updated_at":"2025-03-14T00:32:42.317Z","avatar_url":"https://github.com/wikimedia.png","language":"JavaScript","readme":"[![npm](https://img.shields.io/npm/v/cssjanus.svg?style=flat)](https://www.npmjs.com/package/cssjanus)\n[![Tested with QUnit](https://img.shields.io/badge/tested_with-qunit-9c3493.svg)](https://qunitjs.com/)\n\n# CSSJanus\n\nConvert CSS stylesheets between left-to-right and right-to-left.\n\nBased the original [Google project](https://code.google.com/p/cssjanus/).\n\nSee **[Interactive demo](https://cssjanus.github.io)**.\n\n## Install\n\n```sh\nnpm install cssjanus\n```\n\n## Usage\n\n```javascript\nvar cssjanus = require( 'cssjanus' );\nvar rtlCss = cssjanus.transform( ltrCss );\n```\n\n```\ntransform( string css [, Object options ] ) : string\n```\n\nParameters:\n\n* `css` Stylesheet to transform\n* `options`: Options object (optional)\n * `options.transformDirInUrl` (Boolean): Transform directions in URLs, such as `ltr` to `rtl`. Default: `false`.\n * `options.transformEdgeInUrl` (Boolean): Transform edges in URLs, such as `left` to `right`. Default: `false`.\n\n### Preventing flipping\n\nIf a rule is not meant to be flipped by CSSJanus, use a `/* @noflip */` comment to protect the rule.\n\n```css\n.rule1 {\n  /* Will be converted to margin-right */\n  margin-left: 1em;\n}\n/* @noflip */\n.rule2 {\n  /* Will be preserved as margin-left */\n  margin-left: 1em;\n}\n```\n\n## CSS Logical\n\nWe encourage and recommend use of\n[CSS logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values)\nfor the subset of CSS features where a native\ndirection-aware version of a CSS property exists\n(be sure to check [browser support](https://caniuse.com/)\nfor specific properties). You can, for example, set\nproperties like `margin-inline-start` instead of\n`margin-left`, which the browser flips based on content\ndirection, and work seamlessly alongside other CSS\nproperties that CSSJanus flips instead.\n\nNote that CSS logical properties flip based on nearest\ncontent direction and content language, whereas CSSJanus\nis generally configured to flip by user language and\nUI direction.\n\n## Integrations\n\n* **[css](https://www.npmjs.com/package/css)** parser: [rtl-converter](https://github.com/HosseinAlipour/rtl-converter).\n* **Grunt**: [grunt-cssjanus](https://gerrit.wikimedia.org/g/mediawiki/tools/grunt-cssjanus).\n* **PHP** port: [php-cssjanus](https://gerrit.wikimedia.org/g/mediawiki/libs/php-cssjanus/).\n* **Gulp**: [gulp-cssjanus](https://github.com/tomyam1/gulp-cssjanus).\n* **PostCSS**: [postcss-cssjanus](https://www.npmjs.com/package/postcss-janus).\n* **styled-components**: [styled-components-rtl](https://www.npmjs.com/package/styled-components-rtl).\n* **Stylis**: [stylis-plugin-rtl](https://www.npmjs.com/package/stylis-plugin-rtl).\n* **webpack**: [cssjanus-webpack](https://www.npmjs.com/package/@mooeypoo/cssjanus-webpack), [webpack-arabic-css](https://www.npmjs.com/package/webpackarabiccssplugin).\n\n## Who uses CSSJanus?\n\n* **[Wikimedia Foundation](https://www.wikimedia.org/)**, the non-profit behind Wikipedia and other free knowledge projects. Used as part of [MediaWiki](https://www.mediawiki.org/wiki/MediaWiki) and [VisualEditor](https://gerrit.wikimedia.org/g/VisualEditor/VisualEditor) on [Wikipedia](https://ar.wikipedia.org/), and [more](https://doc.wikimedia.org/).\n* **[WordPress](https://wordpress.org/)**, a free and open-source content management system. Used for the interface of wp-admin and the default yearly themes.\n* **[styled-components](https://styled-components.com/)**, an ecosystem of visual primitives. Its RTL support is powered by CSSJanus.\n* **[AdminLTE](https://adminlte.io/)**, an open-source admin dashboard and control panel theme. See\n[AdminLTE-RTL](https://github.com/mmdsharifi/AdminLTE-RTL).\n\n## See also\n\n* [Interactive demo](https://cssjanus.github.io)\n\n## Contribute\n\n* Issue tracker: \u003chttps://phabricator.wikimedia.org/tag/cssjanus/\u003e\n* Source code: \u003chttps://gerrit.wikimedia.org/g/mediawiki/libs/node-cssjanus\u003e\n* Submit patches via Gerrit: \u003chttps://www.mediawiki.org/wiki/Developer_account\u003e\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwikimedia%2Fnode-cssjanus","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwikimedia%2Fnode-cssjanus","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwikimedia%2Fnode-cssjanus/lists"}