
Security News
Vite Releases Technical Preview of Rolldown-Vite, a Rust-Based Bundler
Vite releases Rolldown-Vite, a Rust-based bundler preview offering faster builds and lower memory usage as a drop-in replacement for Vite.
A CSS BiDi flipper. Generate left-to-right (LTR) or right-to-left (RTL) CSS from your source.
npm install css-flip
var flip = require('css-flip');
var css = 'div { float: left; }';
flip(css);
// => 'div { float: right; }'
As a Rework plugin:
var flip = require('css-flip');
var rework = require('rework');
var css = 'div { float: left; }';
rework(css).use(flip.rework()).toString();
// => 'div { float: right; }'
background-position
,
background-position-x
,
border-bottom-left-radius
,
border-bottom-right-radius
,
border-color
,
border-left
,
border-left-color
,
border-left-style
,
border-left-width
,
border-radius
,
border-right
,
border-right-color
,
border-right-style
,
border-right-width
,
border-style
,
border-top-left-radius
,
border-top-right-radius
,
border-width
,
box-shadow
,
clear
,
direction
,
float
,
left
,
margin
,
margin-left
,
margin-right
,
padding
,
padding-left
,
padding-right
,
right
,
text-align
transition
transition-property
css-flip provides a way to ignore declarations or rules that should not be flipped, and precisely replace property values.
Prevent a single declaration from being flipped.
Source:
p {
/*@noflip*/ float: left;
clear: left;
}
Yields:
p {
float: left;
clear: right;
}
Prevent all declarations in a rule from being flipped.
Source:
/*@noflip*/
p {
float: left;
clear: left;
}
Yields:
p {
float: left;
clear: left;
}
Replace the value of a single declaration. Useful for custom LTR/RTL adjustments, e.g., changing background sprite positions or using a different glyph in an icon font.
Source:
p {
/*@replace: -32px -32px*/ background-position: -32px 0;
/*@replace: ">"*/ content: "<";
}
Yields:
p {
background-position: -32px -32px;
content: ">";
}
The CLI can be used globally or locally in a package.
View available options:
css-flip --help
Example use:
css-flip path/to/file.css > path/to/file.rtl.css
Run the lint and unit tests:
npm test
Just the JSHint tests:
npm run lint
Just the Mocha unit tests:
npm run unit
Run Mocha unit tests in "watch" mode:
npm run watch
Copyright 2014 Twitter, Inc. and other contributors.
Licensed under the MIT License
css-flip was inspired by ded/R2 and Closure Stylesheets.
0.5.0 - 23 June 2014
background-position
.background-position
single value if it's a percentage.background-position
X value of 0%
to 100%
.transition
and transition-property
.border-radius
.FAQs
A CSS BiDi flipper.
The npm package css-flip receives a total of 226 weekly downloads. As such, css-flip popularity was classified as not popular.
We found that css-flip demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 2 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
Vite releases Rolldown-Vite, a Rust-based bundler preview offering faster builds and lower memory usage as a drop-in replacement for Vite.
Research
Security News
A malicious npm typosquat uses remote commands to silently delete entire project directories after a single mistyped install.
Research
Security News
Malicious PyPI package semantic-types steals Solana private keys via transitive dependency installs using monkey patching and blockchain exfiltration.