orange-component

- web component
- support typescript
- custom some style (can override default setting by define root variants)

Installation

- npm package

``shell
npm i @winnies0728/orange-component
`

- cdn

`html
type="module"
src="https://www.unpkg.com/@winnies0728/orange-component@latest/dist/index.global.js"
>
`

Usage

$3

- html

`html

`

- react

`tsx
// main.tsx
import '@winnies0728/orange-component'
...

// your component.tsx
export default function App (){
...
return <>
...


}
`

- vue

`html



`

- custom style (support dark mode)

`css
/ your css file.css /
:root {
...
--scrollToTop-mainColor: #e6e6e6;
--scrollToTop-bgColor: #666;
--scrollToTop-borderColor: #666;
}
@media (prefers-color-scheme: light) {
:root {
...
--scrollToTop-mainColor: #222;
--scrollToTop-bgColor: #e6e6e6;
--scrollToTop-borderColor: #e6e6e6;
}
}
``