1
Fork 0
mirror of https://github.com/Steffo99/bluelib.git synced 2024-12-24 04:24:21 +00:00
bluelib/src/components/Color/Readme.md

45 lines
955 B
Markdown
Raw Normal View History

2021-03-23 15:32:25 +00:00
Change the **bluelib color** of the contained elements.
2021-01-25 18:37:58 +00:00
2021-03-23 15:32:25 +00:00
The color can chosen through either the `builtin` prop or the `custom` prop.
2021-01-25 18:37:58 +00:00
2021-03-23 15:32:25 +00:00
By using the `builtin` prop, the color will automatically adapt itself to the theme. Possible builtin colors are:
- `"red"`
- `"orange"`
- `"yellow"`
- `"lime"`
- `"cyan"`
- `"blue"`
- `"magenta"`
- `"gray"`
By using the `custom` prop, the color will be the same for all themes, but you will be able to specify any color.
2021-01-25 18:37:58 +00:00
```jsx
import Bluelib from "../Bluelib";
2021-03-23 15:32:25 +00:00
import Box from "../Box";
2021-01-25 18:37:58 +00:00
<Bluelib>
<div>
2021-03-23 15:32:25 +00:00
<Color builtin={"red"}>
<span>
Red
</span>
2021-01-25 18:37:58 +00:00
</Color>
</div>
<div>
2021-03-23 15:32:25 +00:00
<Color builtin={"orange"}>
<Box>
Orange
</Box>
2021-01-25 18:37:58 +00:00
</Color>
</div>
<div>
2021-03-23 15:32:25 +00:00
<Color custom={"#ffff00"}>
<Box>
Custom yellow
</Box>
2021-01-25 18:37:58 +00:00
</Color>
</div>
</Bluelib>
```