source: trip-planner-front/node_modules/postcss-color-hex-alpha/README.md

Last change on this file was 6a3a178, checked in by Ema <ema_spirova@…>, 3 years ago

initial commit

  • Property mode set to 100644
File size: 2.4 KB
Line 
1# PostCSS Color Hex Alpha [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS" width="90" height="90" align="right">][postcss]
2
3[![NPM Version][npm-img]][npm-url]
4[![CSS Standard Status][css-img]][css-url]
5[![Build Status][cli-img]][cli-url]
6[![Support Chat][git-img]][git-url]
7
8[PostCSS Color Hex Alpha] lets you use 4 & 8 character hex color notation in
9CSS, following the [CSS Color Module] specification.
10
11```pcss
12body {
13 background: #9d9c;
14}
15
16/* becomes */
17
18body {
19 background: rgba(153, 221, 153, 0.8);
20}
21```
22
23## Usage
24
25Add [PostCSS Color Hex Alpha] to your project:
26
27```bash
28npm install postcss-color-hex-alpha --save-dev
29```
30
31Use [PostCSS Color Hex Alpha] to process your CSS:
32
33```js
34const postcssColorHexAlpha = require('postcss-color-hex-alpha');
35
36postcssColorHexAlpha.process(YOUR_CSS /*, processOptions, pluginOptions */);
37```
38
39Or use it as a [PostCSS] plugin:
40
41```js
42const postcss = require('postcss');
43const postcssColorHexAlpha = require('postcss-color-hex-alpha');
44
45postcss([
46 postcssColorHexAlpha(/* pluginOptions */)
47]).process(YOUR_CSS /*, processOptions */);
48```
49
50[PostCSS Color Hex Alpha] runs in all Node environments, with special instructions for:
51
52| [Node](INSTALL.md#node) | [PostCSS CLI](INSTALL.md#postcss-cli) | [Webpack](INSTALL.md#webpack) | [Create React App](INSTALL.md#create-react-app) | [Gulp](INSTALL.md#gulp) | [Grunt](INSTALL.md#grunt) |
53| --- | --- | --- | --- | --- | --- |
54
55## Options
56
57### preserve
58
59The `preserve` option determines whether 4 & 8 character hex color notation
60should be preserved in their original form. By default, these are not preserved.
61
62```js
63postcssColorHexAlpha({
64 preserve: true
65});
66```
67
68```pcss
69body {
70 background: #9d9c;
71}
72
73/* becomes */
74
75body {
76 background: rgba(153, 221, 153, 0.8);
77 background: #9d9c;
78}
79```
80
81[cli-img]: https://img.shields.io/travis/postcss/postcss-color-hex-alpha.svg
82[cli-url]: https://travis-ci.org/postcss/postcss-color-hex-alpha
83[css-img]: https://cssdb.org/badge/hexadecimal-alpha-notation.svg
84[css-url]: https://cssdb.org/#hexadecimal-alpha-notation
85[git-img]: https://img.shields.io/badge/support-chat-blue.svg
86[git-url]: https://gitter.im/postcss/postcss
87[npm-img]: https://img.shields.io/npm/v/postcss-color-hex-alpha.svg
88[npm-url]: https://www.npmjs.com/package/postcss-color-hex-alpha
89
90[PostCSS]: https://github.com/postcss/postcss
91[PostCSS Color Hex Alpha]: https://github.com/postcss/postcss-color-hex-alpha
92[CSS Color Module]: https://www.w3.org/TR/css-color-4/#hex-notation
Note: See TracBrowser for help on using the repository browser.