1.4.4 • Published 11 months ago
react-reading-panel v1.4.4
Main Features
- Change font size
- Change line spacing
- Change letter spacing
Switch between light/dark colors
More features are coming soon!
Installation
npm install --save react-reading-panel
OR
yarn add react-reading-panel
Usage
Target by Id
<ReadingPanel targetId="sample"></ReadingPanel>
<p id="sample">
Text to be changed
</p>
Target by class
<ReadingPanel targetClass="sample"></ReadingPanel>
<p className="sample">
Text to be changed
</p>
Settings
Name | Description | Default |
---|---|---|
colorSetting | light/dark default colors | see below |
defaultTheme | default theme to start from | light |
direction | panel direction | horizontal |
fontSizeStep | font size step size | 1 |
fontSizeUnits | font size units | px |
letterSpacingDefaultSize | letter spacing default size | 1px |
letterSpacingUnit | letter spacing unit | px |
lineHeightDefaultSize | line height default size | 1rem |
lineHeightsStep | line height step size | 1 |
lineHeightUnits | line height units | px |
showButtons | show only some of the buttons | shows everything |
Color Setting
Name | Description | Default |
---|---|---|
bgLightColor | light background color | #ffffff (white) |
fgLightColor | light foreground color | #000000 (black) |
fgDarkColor | dark background color | #ffffff (white) |
bgDarkColor | dark foreground color | #000000 (black) |
1.4.4
11 months ago
1.4.3
11 months ago
1.4.2
11 months ago
1.4.1
11 months ago
1.4.0
11 months ago
1.3.0
11 months ago
1.2.10
11 months ago
1.2.9
11 months ago
1.2.8
11 months ago
1.2.7
11 months ago
1.2.6
11 months ago
1.2.5
11 months ago
1.2.4
11 months ago
1.2.3
11 months ago
1.2.2
11 months ago
1.2.1
11 months ago
1.2.0
11 months ago
1.1.1
11 months ago
1.1.0
11 months ago
1.0.9
11 months ago
1.0.8
11 months ago
1.0.7
11 months ago
1.0.6
11 months ago
1.0.5
11 months ago
1.0.4
11 months ago
1.0.3
11 months ago
1.0.2
11 months ago