open-index/open-npm huggingface dataset:
npm package: @jswork/wsui-shadow-on-scroll
Description: Pure CSS drop shadow on scroll.
Author: afei
Latest version: 1.0.1

# wsui-shadow-on-scroll
> Pure CSS drop shadow on scroll.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-shadow-on-scroll
```

## usage
```scss
// use sass
@import '~@jswork/wsui-shadow-on-scroll/dist/index.scss';
// use css
@import '~@jswork/wsui-shadow-on-scroll/dist/style.css';
```

## preview
- https://afeiship.github.io/wsui-shadow-on-scroll/

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-shadow-on-scroll/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-shadow-on-scroll
[version-url]: https://npmjs.org/package/@jswork/wsui-shadow-on-scroll

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-shadow-on-scroll
[license-url]: https://github.com/afeiship/wsui-shadow-on-scroll/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-shadow-on-scroll
[size-url]: https://github.com/afeiship/wsui-shadow-on-scroll/blob/master/dist/wsui-shadow-on-scroll.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-shadow-on-scroll
[download-url]: https://www.npmjs.com/package/@jswork/wsui-shadow-on-scroll
npm package: @jswork/wsui-shorty
Description: Short and pithy style toolkits.
Author: afei
Latest version: 1.2.3

# wsui-shorty
> Short and pithy style toolkits.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-shorty
```

## usage
```scss
// default to `scss`
@import '~@jswork/wsui-shorty/dist/index.scss';
// or use `css`
@import '~@jswork/wsui-shorty/dist/style.css";

// when tailwind
@import '~@jswork/wsui-shorty/dist/tailwind.css";
// OR use scss
@import '~@jswork/wsui-shorty/dist/tailwind.scss";
```

## with tailwind
> You can use `@jswork/wsui-shorty` with tailwind. At first, you need install `sass`.

```scss
@tailwind base;
@tailwind components;
@tailwind utilities;

@import '@jswork/wsui-shorty/dist/tailwind.css';

body {
    background: #eee;
}
```

## documentation
- [align.scss](./documentation/align.scss.md)
- [background.scss](./documentation/background.scss.md)
- [border.scss](./documentation/border.scss.md)
- [box-sizing.scss](./documentation/box-sizing.scss.md)
- [box.scss](./documentation/box.scss.md)
- [clearfix.scss](./documentation/clearfix.scss.md)
- [cursor.scss](./documentation/cursor.scss.md)
- [debug.scss](./documentation/debug.scss.md)
- [flip.scss](./documentation/flip.scss.md)
- [display.scss](./documentation/display.scss.md)
- [float.scss](./documentation/float.scss.md)
- [font-size.scss](./documentation/font-size.scss.md)
- [height.scss](./documentation/height.scss.md)
- [line-clamp.scss](./documentation/line-clamp.scss.md)
- [margin.scss](./documentation/margin.scss.md)
- [overflow.scss](./documentation/overflow.scss.md)
- [padding.scss](./documentation/padding.scss.md)
- [position.scss](./documentation/position.scss.md)
- [shadow.scss](./documentation/shadow.scss.md)
- [shape.scss](./documentation/shape.scss.md)
- [status.scss](./documentation/status.scss.md)
- [text.scss](./documentation/text.scss.md)
- [transform.scss](./documentation/transform.scss.md)
- [transparent.scss](./documentation/transparent.scss.md)
- [width.scss](./documentation/width.scss.md)
- [z-index.scss](./documentation/z-index.scss.md)

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-shorty/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-shorty
[version-url]: https://npmjs.org/package/@jswork/wsui-shorty

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-shorty
[license-url]: https://github.com/afeiship/wsui-shorty/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-shorty
[size-url]: https://github.com/afeiship/wsui-shorty/blob/master/dist/wsui-shorty.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-shorty
[download-url]: https://www.npmjs.com/package/@jswork/wsui-shorty
npm package: @jswork/wsui-sound-wave
Description: Sound wave effect for webkit sassui.
Author: afei
Latest version: 1.0.0

# wsui-sound-wave
> Sound wave effect for webkit sassui.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-sound-wave
```

## usage
```scss
// use sass
@import '~@jswork/wsui-sound-wave/dist/index.scss';
// use css
@import '~@jswork/wsui-sound-wave/dist/style.css';
```

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-sound-wave/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-sound-wave
[version-url]: https://npmjs.org/package/@jswork/wsui-sound-wave

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-sound-wave
[license-url]: https://github.com/afeiship/wsui-sound-wave/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-sound-wave
[size-url]: https://github.com/afeiship/wsui-sound-wave/blob/master/dist/wsui-sound-wave.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-sound-wave
[download-url]: https://www.npmjs.com/package/@jswork/wsui-sound-wave
npm package: @jswork/wsui-table
Description: Webkit sass table.
Author: afei
Latest version: 1.0.1

# wsui-table
> Webkit sass table.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-table
```

## usage
```scss
// use sass
@import '~@jswork/wsui-table/dist/index.scss';
// use css
@import '~@jswork/wsui-table/dist/style.css';
```

## preview
- https://afeiship.github.io/wsui-table/

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-table/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-table
[version-url]: https://npmjs.org/package/@jswork/wsui-table

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-table
[license-url]: https://github.com/afeiship/wsui-table/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-table
[size-url]: https://github.com/afeiship/wsui-table/blob/master/dist/wsui-table.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-table
[download-url]: https://www.npmjs.com/package/@jswork/wsui-table
npm package: @jswork/wsui-table-eq-width
Description: Webkit css ui module for table equal width.
Author: afei
Latest version: 1.0.0

# wsui-table-eq-width
> Webkit css ui module for table equal width.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-table-eq-width
```

## usage
```scss
// use sass
@import '~@jswork/wsui-table-eq-width/dist/index.scss';
// use css
@import '~@jswork/wsui-table-eq-width/dist/style.css';
```

## preview
- https://afeiship.github.io/wsui-table-eq-width/

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-table-eq-width/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-table-eq-width
[version-url]: https://npmjs.org/package/@jswork/wsui-table-eq-width

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-table-eq-width
[license-url]: https://github.com/afeiship/wsui-table-eq-width/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-table-eq-width
[size-url]: https://github.com/afeiship/wsui-table-eq-width/blob/master/dist/wsui-table-eq-width.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-table-eq-width
[download-url]: https://www.npmjs.com/package/@jswork/wsui-table-eq-width
npm package: @jswork/wsui-tdline-colorful
Description: Text decoration with colorful for wsui.
Author: afei
Latest version: 1.0.1

# wsui-tdline-colorful
> Text decoration with colorful for wsui.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-tdline-colorful
```

## usage
```scss
// use sass
@import '~@jswork/wsui-tdline-colorful/dist/index.scss';
// use css
@import '~@jswork/wsui-tdline-colorful/dist/style.css';


.tdline1 {
  @include wsui-tdline-colorful($in-color1: #ff7a18, $in-color2: #af002d, $in-color3: #319197);
}

// <a href="tdn tdline1">道可道，非常道；名可名，非常名。</a>
```

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-tdline-colorful/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-tdline-colorful
[version-url]: https://npmjs.org/package/@jswork/wsui-tdline-colorful

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-tdline-colorful
[license-url]: https://github.com/afeiship/wsui-tdline-colorful/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-tdline-colorful
[size-url]: https://github.com/afeiship/wsui-tdline-colorful/blob/master/dist/wsui-tdline-colorful.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-tdline-colorful
[download-url]: https://www.npmjs.com/package/@jswork/wsui-tdline-colorful
npm package: @jswork/wsui-tdline-overfly
Description: Text decoration line overfly effect.
Author: afei
Latest version: 1.0.0

# wsui-tdline-overfly
> Text decoration line overfly effect.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-tdline-overfly
```

## usage
```scss
// use sass
@import '~@jswork/wsui-tdline-overfly/dist/index.scss';
// use css
@import '~@jswork/wsui-tdline-overfly/dist/style.css';

// <a href="#" class="wsui-tdline-overfly">道可道，非常道；名可名，非常名。</a>
```

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-tdline-overfly/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-tdline-overfly
[version-url]: https://npmjs.org/package/@jswork/wsui-tdline-overfly

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-tdline-overfly
[license-url]: https://github.com/afeiship/wsui-tdline-overfly/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-tdline-overfly
[size-url]: https://github.com/afeiship/wsui-tdline-overfly/blob/master/dist/wsui-tdline-overfly.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-tdline-overfly
[download-url]: https://www.npmjs.com/package/@jswork/wsui-tdline-overfly
npm package: @jswork/wsui-text-justify
Description: Text align justify for webkit sassui.
Author: afei
Latest version: 1.0.0

# wsui-text-justify
> Text align justify for webkit sassui.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-text-justify
```

## usage
```scss
// use sass
@import '~@jswork/wsui-text-justify/dist/index.scss';
// use css
@import '~@jswork/wsui-text-justify/dist/style.css';
```

## preview
- https://afeiship.github.io/wsui-text-justify/

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-text-justify/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-text-justify
[version-url]: https://npmjs.org/package/@jswork/wsui-text-justify

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-text-justify
[license-url]: https://github.com/afeiship/wsui-text-justify/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-text-justify
[size-url]: https://github.com/afeiship/wsui-text-justify/blob/master/dist/wsui-text-justify.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-text-justify
[download-url]: https://www.npmjs.com/package/@jswork/wsui-text-justify
npm package: @jswork/wsui-tips
Description: Webkit sass for tips.
Author: afei
Latest version: 1.0.0

# wsui-tips
> Webkit sass for tips.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-tips
```

## usage
```scss
// use sass
@import '~@jswork/wsui-tips/dist/index.scss';
// use css
@import '~@jswork/wsui-tips/dist/style.css';
```

## preview
- https://afeiship.github.io/wsui-tips/

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-tips/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-tips
[version-url]: https://npmjs.org/package/@jswork/wsui-tips

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-tips
[license-url]: https://github.com/afeiship/wsui-tips/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-tips
[size-url]: https://github.com/afeiship/wsui-tips/blob/master/dist/wsui-tips.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-tips
[download-url]: https://www.npmjs.com/package/@jswork/wsui-tips
npm package: @jswork/wsui-toast
Description: Toast sass style.
Author: afei
Latest version: 1.0.0

# wsui-toast
> Toast sass style.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-toast
```

## usage
```scss
// use sass
@import '~@jswork/wsui-toast/dist/index.scss';
// use css
@import '~@jswork/wsui-toast/dist/style.css';
```

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-toast/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-toast
[version-url]: https://npmjs.org/package/@jswork/wsui-toast

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-toast
[license-url]: https://github.com/afeiship/wsui-toast/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-toast
[size-url]: https://github.com/afeiship/wsui-toast/blob/master/dist/wsui-toast.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-toast
[download-url]: https://www.npmjs.com/package/@jswork/wsui-toast
npm package: @jswork/wsui-transform-center
Description: Webkit sass ui module transform center.
Author: afei
Latest version: 1.0.0

# wsui-transform-center
> Webkit sass ui module transform center.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-transform-center
```

## usage
```scss
@import '~@jswork/wsui-transform-center';

// .wsui-transform-center-x
// .wsui-transform-center-y
// .wsui-transform-center-xy
```

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-transform-center/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-transform-center
[version-url]: https://npmjs.org/package/@jswork/wsui-transform-center

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-transform-center
[license-url]: https://github.com/afeiship/wsui-transform-center/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-transform-center
[size-url]: https://github.com/afeiship/wsui-transform-center/blob/master/dist/wsui-transform-center.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-transform-center
[download-url]: https://www.npmjs.com/package/@jswork/wsui-transform-center
npm package: @jswork/wsui-vim-center
Description: Vertical align center for webkit sass ui.
Author: afei
Latest version: 1.0.1

# wsui-vim-center
> Vertical align center for webkit sass ui.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-vim-center
```

## usage
```scss
// use sass
@import '~@jswork/wsui-vim-center/dist/index.scss';
// use css
@import '~@jswork/wsui-vim-center/dist/style.css';
```

## preview
- https://afeiship.github.io/wsui-vim-center/

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-vim-center/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-vim-center
[version-url]: https://npmjs.org/package/@jswork/wsui-vim-center

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-vim-center
[license-url]: https://github.com/afeiship/wsui-vim-center/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-vim-center
[size-url]: https://github.com/afeiship/wsui-vim-center/blob/master/dist/wsui-vim-center.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-vim-center
[download-url]: https://www.npmjs.com/package/@jswork/wsui-vim-center
npm package: @jswork/wsui-vw-rem
Description: Rem solution based on vw and media query.
Author: afei
Latest version: 1.0.8

# wsui-vw-rem
> Rem solution based on vw and media query.

[![version][version-image]][version-url]
[![license][license-image]][license-url]
[![size][size-image]][size-url]
[![download][download-image]][download-url]

## installation
```shell
npm i @jswork/wsui-vw-rem
```

## usage
```scss
@import '~@jswork/wsui-vw-rem';

// based: 750px
// 13.33vw = 100px

// based: 375px
// 13.33vw = 50px

// you can customize options:
$wsui-vw-rem-screen-width: 375px !default;
$wsui-vw-rem-base-font-size: 10px !default;
$wsui-vw-rem-media-list: ( 320, 360, 375, 393, 414, 480, 540, 640, 720, 768 ) !default;

// OR (presets for tailwindcss)
$wsui-vw-rem-screen-width: 375px !default;
$wsui-vw-rem-base-font-size: 16px !default;
```

## resources
- https://3g.163.com/touch/#/
- https://blog.csdn.net/chi1130/article/details/82844489
- https://blog.csdn.net/lishihong108/article/details/52290021

## license
Code released under [the MIT license](https://github.com/afeiship/wsui-vw-rem/blob/master/LICENSE.txt).

[version-image]: https://img.shields.io/npm/v/@jswork/wsui-vw-rem
[version-url]: https://npmjs.org/package/@jswork/wsui-vw-rem

[license-image]: https://img.shields.io/npm/l/@jswork/wsui-vw-rem
[license-url]: https://github.com/afeiship/wsui-vw-rem/blob/master/LICENSE.txt

[size-image]: https://img.shields.io/bundlephobia/minzip/@jswork/wsui-vw-rem
[size-url]: https://github.com/afeiship/wsui-vw-rem/blob/master/dist/wsui-vw-rem.min.js

[download-image]: https://img.shields.io/npm/dm/@jswork/wsui-vw-rem
[download-url]: https://www.npmjs.com/package/@jswork/wsui-vw-rem
npm package: @jswork/yeoman-generator
Description: My base yeoman-generator.
Latest version: 1.0.6

# yeoman-generator
> My base yeoman-generator.

## installation
```shell
npm i @jswork/yeoman-generator
```

## usage
```js
// es6
import YeomanGenerator from '@jswork/yeoman-generator';
// es5
const Generator = require('@jswork/yeoman-generator');

module.exports = class extends YeomanGenerator {
  // start your generator code...
};
```
npm package: @jswork/yeoman-generator-helper
Description: Yeoman generator helper.
Author: afei
Latest version: 1.0.11

# yeoman-generator-helper
> Yeoman generator helper.

## installation
```shell
npm i @jswork/yeoman-generator-helper
```

## apis
| api          | params                 | description |
| ------------ | ---------------------- | ----------- |
| discoverRoot | -                      | -           |
| shortName    | (name)                 | -           |
| extendProps  | (context)              | -           |
| underToDot   | (context)              | -           |
| rewriteProps | (props,{ exclude:[] }) | -           |
| renameBy     | (context, callback)    | -           |
| rename       | (context, src,dest)    | -           |

## gulp-rename
- https://github.com/yeoman/yo/issues/577
- https://github.com/yeoman/yeoman/issues/1676

~~~
This seems to be caused by recent changes in **gulp-rename** (current version 1.2.3). 
Older versions work just fine. 
In my case i had to pin gulp-rename to 1.2.2 to fix my generators.
~~~