You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+16-15Lines changed: 16 additions & 15 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -12,26 +12,27 @@ import { NgToggleModule } from 'ng-toogle';
12
12
...
13
13
imports: [
14
14
...,
15
-
NgToggleModule
15
+
NgToggleModule
16
16
],
17
17
})
18
18
```
19
19
20
20
### Properties
21
21
22
-
| Name | Type | Default | Description |
23
-
| --- | --- | --- | --- |
24
-
| value |`boolean`|`false`| Initial state of the toggle button |
25
-
| speed |`number`|`300`| Transition time for the animation |
26
-
| disabled |`boolean`|`false`| Button does not react on mouse events |
27
-
| color |`string`|`#75C791`| If `String` - color of the button when checked <br>If `Object` - colors for the button when checked/unchecked or disabled<br>Example: `{checked: '#00FF00', unchecked: '#FF0000', disabled: '#CCCCCC'}`|
28
-
| labels | `boolean | Object` |`false`| If `boolean` - shows/hides default labels <br>If `Object` - sets custom labels for both states. <br>Example: `{checked: 'Foo', unchecked: 'Bar'}`|
29
-
| switchColor | `string | Object` |`#BFCBD9`| If `string` - color or background property of the switch when checked <br>If `Object` - colors or background property for the switch when checked/uncheked <br>Example: `{checked: '#25EF02', unchecked: 'linear-gradient(red, yellow)'}`|
30
-
| width |`number`|`50`| Width of the button |
31
-
| height |`number`|`22`| Height of the button |
32
-
| margin |`number`|`3`| Space between the switch and background border |
33
-
| name |`string`|`undefined`| Name to attach to the generated input field |
| value |`boolean`|`false`| Initial state of the toggle button |
25
+
| speed |`number`|`300`| Transition time for the animation |
26
+
| disabled |`boolean`|`false`| Button does not react on mouse events |
27
+
| color |`string`|`#0099CC`| If `String` - color of the button when checked <br>If `Object` - colors for the button when checked/unchecked or disabled<br>Example: `{checked: '#00FF00', unchecked: '#FF0000', disabled: '#CCCCCC'}`|
28
+
| labels |`boolean,Object`|`false`| If `boolean` - shows/hides default labels <br>If `Object` - sets custom labels for both states. <br>Example: `{checked: 'Foo', unchecked: 'Bar'}`|
29
+
| switchColor |`string,Object`|`#fff`| If `string` - color or background property of the switch when checked <br>If `Object` - colors or background property for the switch when checked/uncheked <br>Example: `{checked: '#25EF02', unchecked: 'silver'}`|
30
+
| width |`number`|`50`| Width of the button |
31
+
| height |`number`|`22`| Height of the button |
32
+
| margin |`number`|`3`| Space between the switch and background border |
33
+
| name |`string`|`undefined`| Name to attach to the generated input field |
34
+
| fontSize |`number`|`10`| Font size in pixels |
35
+
| fontCize |`string, Object`|`10`| If `string` - color when checked <br>If `Object` - colors for labels when checked/uncheked <br>Example: `{checked: '#25EF02', unchecked: '#35DB15'}`|
35
36
36
37
### Outputs events
37
38
@@ -42,4 +43,4 @@ import { NgToggleModule } from 'ng-toogle';
42
43
## Development server
43
44
44
45
Clone this repo and download the dependencies.
45
-
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`.
46
+
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`.
0 commit comments