<ct-button>
Installation
npm install @conectate/ct-button
yarn add @conectate/ct-button
NOTE: Conectate Components are distributed as ES2020 JavaScript Modules, and use the Custom Elements API. They are compatible with all modern browsers including Chrome, Firefox, Safari, Edge, and IE11, but an additional tooling step is required to resolve bare module specifiers, as well as transpilation and polyfills for Edge and IE11.
Example usage
Standard
<ct-button value="value1"></ct-button>
<ct-button shadow value="value2"></ct-button>
<ct-button raised value="value3"></ct-button>
<ct-button flat value="value4"></ct-button>
<ct-button light value="value5"></ct-button>
<ct-button disabled value="value5"></ct-button>
<script type="module">
import '@conectate/ct-button';
</script>
API
Slots
None
Properties/Attributes
Name | Type | Default | Description |
---|---|---|---|
raised |
boolean |
false |
Raised Style (primary color) |
shadow |
boolean |
false |
Shown with opaque black background. |
flat |
boolean |
false |
Shown with a primary color border |
light |
boolean |
false |
Shown with a primary color border |
disabled |
boolean |
false |
If true , Disable clicks |
Methods
None
Events
Name | Detail | Description |
---|---|---|
value |
{value : string} |
Fired when the user modifies the ct-input value state from an input device interaction on this radio. |
CSS Custom Properties
Custom property | Description | Default |
---|---|---|
--color-primary |
Primary color | #00aeff |
--dark-primary-color |
Dark Primary color | #00aeff |
--ct-button-box-shadow |
Box-Shadow for hover | 0 2px 16px 4px rgba(99, 188, 240, 0.45) |
--ct-button-shadow-color |
- | rgba(64, 117, 187, 0.1) |