open-index/open-npm huggingface dataset:
npm package: @kazishiplu/wp-pro-seperator
Description: wordpress pro plugin seperator
Author: Kazi Shiplu
Latest version: 1.0.2

# Wordpress Pro Plugin Seperator

## Usage
```js
npm run start -- --dir=plugin-automation-pro 
```
or 
```js
npx @kazishiplu/wp-pro-seperator --dir=plugin-automation-pro 
```
npm package: @kazkadien/svelte
Description: Svelte UI components
Latest version: 0.32.0

# (WIP) CSS & Svelte Component Library

### Installation

```bash
npm i @kazkadien/svelte
#or
pnpm add @kazkadien/svelte
```

---

### Usage

Import all CSS

```css
@import '@kazkadien/svelte/styles.css';
```

Import Components

```js
import { Btn } from '@kazkadien/svelte'
```

Then wrap entry point (ex: root `+layout.svelte`) with `AppWrapper` component

```svelte
<script>
  import { AppWrapper } from '@kazkadien/svelte'
</script>

<AppWrapper> </AppWrapper>
```

Set color theme `app.html`

```html
<script>
  ;(function () {
    const THEME = 'my-theme'
    const DARK = 'dark'

    const myTheme = localStorage.getItem(THEME)

    if (myTheme) {
      if (myTheme === DARK) document.documentElement.classList.add(DARK)
      // if (myTheme === 'light')
    } else {
      if (
        window.matchMedia &&
        window.matchMedia('(prefers-color-scheme: dark)').matches
      ) {
        document.documentElement.classList.add(DARK)
      }
    }
  })()
</script>
```

---

### Colors

There are 4 _accents_: **alpha**, **beta**, **gamma** and **danger**.

```css
:root {
  --hue-alpha: 200;
  --hue-beta: 32;
  --hue-gamma: 69;
  --hue-danger: 355;

  --saturation: 60%;
  --lightness: 25%;

  --hue-sat-bg: 0, 0%;
}

html.dark {
  --saturation: 35%;
  --lightness: 75%;

  --hue-sat-bg: 195, 4%;
}

html.dark :where(.alpha, .beta, .gamma, .danger) {
  --fg-lightness: 65%;
  --fg-lightness-step: 10%;

  --fg-transparency: 0.75;
  --fg-transparency1: 0.85;

  --bg-transparency: 0.075;
  --bg-transparency1: 0.1;
}
```

---

### Icons