🚨 Shai-Hulud Strikes Again:834 Packages Compromised.Technical Analysis →
Socket
Book a DemoInstallSign in
Socket

@megalo/px2rpx

Package Overview
Dependencies
Maintainers
3
Versions
2
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@megalo/px2rpx

According to one stylesheet, generate rpx version and @1x, @2x and @3x stylesheet

latest
Source
npmnpm
Version
0.1.0
Version published
Maintainers
3
Created
Source

px2rpx

According to one stylesheet, generate rpx version.

NPM version Build status Test coverage Downloads

Usage

The raw stylesheet only contains @2x style, and if you

  • don't intend to transform the original value, eg: 1px border, add /*no*/ after the declaration

Attention: Dealing with SASS or LESS, only /*...*/ comment can be used, in order to have the comments persisted

API

var Px2rpx = require('@megalojs/px2rpx');
var px2rpxIns = new Px2rpx({
  {rpxUnit: 0.5}
});
var originCssText = '...';
var newCssText = px2rpxIns.generateRpx(originCssText); // generate rpx version stylesheet

Example

Pre processing:

One raw stylesheet: test.css

.selector {
  width: 350px;
  height: 60px; 
  font-size: 20px; 
  border: 1px solid #ddd; /*no*/
}

After processing:

Rpx version: test.debug.css

.selector {
  width: 750rpx;
  height: 120rpx;
  font-size: 40rpx;
  border: 1px solid #ddd;
}

Technical proposal

comment hook + css parser

Change Log

0.0.1

License

MIT

Keywords

3x

FAQs

Package last updated on 03 Dec 2018

Did you know?

Socket

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.

Install

Related posts