source: imaps-frontend/node_modules/inline-style-prefixer/README.md@ d565449

main
Last change on this file since d565449 was d565449, checked in by stefan toskovski <stefantoska84@…>, 4 weeks ago

Update repo after prototype presentation

  • Property mode set to 100644
File size: 3.5 KB
Line 
1# inline-style-prefixer
2
3A small, simple and fast vendor prefixer from JavaScript style object.
4
5<img alt="npm downloads" src="https://img.shields.io/npm/dm/inline-style-prefixer.svg"> <img alt="gzipped size" src="https://img.shields.io/bundlephobia/minzip/inline-style-prefixer.svg?colorB=4c1&label=gzipped%20size"> <img alt="npm version" src="https://badge.fury.io/js/inline-style-prefixer.svg">
6
7## Installation
8
9```sh
10yarn add inline-style-prefixer
11```
12
13If you're still using npm, you may run `npm i --save inline-style-prefixer`.
14
15## Browser Support
16
17It supports all major browsers with the following versions. For other, unsupported browses, we automatically use a fallback.
18
19- Chrome: 55+
20- Android (Chrome): 55+
21- Android (Stock Browser): 5+
22- Android (UC): 11+
23- Firefox: 52+
24- Safari: 13+
25- iOS (Safari): 13+
26- Opera: 30+
27- Opera (Mini): 12+
28- IE: 11+
29- IE (Mobile): 11+
30- Edge: 12+
31
32It will **only** add prefixes if a property still needs them in one of the above mentioned versions.<br> Therefore, e.g. `border-radius` will not be prefixed at all.
33
34> **Need to support legacy browser versions?**<br>
35> Don't worry - we got you covered. Check [this guide](https://github.com/rofrischmann/inline-style-prefixer/blob/master/docs/guides/CustomPrefixer.md).
36
37## Usage
38
39```javascript
40import { prefix } from 'inline-style-prefixer'
41
42const style = {
43 transition: '200ms all linear',
44 boxSizing: 'border-box',
45 display: 'flex',
46 color: 'blue'
47}
48
49const output = prefix(style)
50
51output === {
52 WebkitTransition: '200ms all linear',
53 transition: '200ms all linear',
54 MozBoxSizing: 'border-box',
55 boxSizing: 'border-box',
56 display: [ '-webkit-box', '-moz-box', '-ms-flexbox', '-webkit-flex', 'flex' ],
57 color: 'blue'
58}
59```
60
61## Usage with TypeScript
62
63You can use TypeScript definition from [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/inline-style-prefixer) using [@types/inline-style-prefixer](https://www.npmjs.com/package/@types/inline-style-prefixer)
64
65```sh
66yarn add @types/inline-style-prefixer
67
68# alternatively use npm
69npm i --save @types/inline-style-prefixer
70```
71
72## Documentation
73
74If you got any issue using this prefixer, please first check the FAQ's. Most cases are already covered and provide a solid solution.
75
76- [Usage Guides](https://inline-style-prefixer.js.org/docs/UsageGuides.html)
77- [Data Reference](https://inline-style-prefixer.js.org/docs/DataReference.html)
78- [API Reference](https://inline-style-prefixer.js.org/docs/API.html)
79
80## Community
81
82Here are some popular users of this library:
83
84- [Aphrodite](https://github.com/Khan/aphrodite)
85- [Fela](https://github.com/rofrischmann/fela)
86- [Glamor](https://github.com/threepointone/glamor)
87- [Material UI](https://github.com/callemall/material-ui)
88- [nano-css](https://github.com/streamich/nano-css)
89- [Radium](https://github.com/FormidableLabs/radium)
90- [react-native-web](https://github.com/necolas/react-native-web)
91- [styled-components](https://github.com/styled-components/styled-components)
92- [Styletron](https://github.com/rtsao/styletron)
93
94> PS: Feel free to add your solution!
95
96## Support
97
98Join us on [Gitter](https://gitter.im/rofrischmann/fela). We highly appreciate any contribution.<br>
99We also love to get feedback.
100
101## License
102
103**inline-style-prefixer** is licensed under the [MIT License](http://opensource.org/licenses/MIT).<br>
104Documentation is licensed under [Creative Common License](http://creativecommons.org/licenses/by/4.0/).<br>
105Created with ♥ by [@rofrischmann](http://rofrischmann.de) and all contributors.
Note: See TracBrowser for help on using the repository browser.