open-index/open-npm huggingface dataset:
npm package: @settld/eslint-config
Description: Shared @eslint config for web development projects.
Latest version: 1.2.0

# @settld/eslint-config

![Peer Eslint Version](https://img.shields.io/npm/dependency-version/@settld/eslint-config/peer/eslint) ![Peer TypeScript Version](https://img.shields.io/npm/dependency-version/@settld/eslint-config/peer/typescript)

Shared @eslint config for web development projects.
npm package: @settld/stylelint-config
Description: Shared @stylelint config for web development projects.
Latest version: 1.2.0

# @settld/stylelint-config

![Peer Stylelint Version](https://img.shields.io/npm/dependency-version/@settld/stylelint-config/peer/stylelint) ![Peer PostCSS Version](https://img.shields.io/npm/dependency-version/@settld/stylelint-config/peer/postcss)

Shared @stylelint config for web development projects.
npm package: @settld/tailwindcss-config
Description: Shared Tailwind CSS preset for web development projects.
Latest version: 1.2.0

# @settld/tailwindcss-config

![Peer Tailwind CSS Version](https://img.shields.io/npm/dependency-version/@settld/tailwindcss-config/peer/tailwindcss)

Shared Tailwind CSS preset for web development projects.

## How to use

There are two files [index.js](./index.js) and [plugin.js](./plugin.js) in the shared prest.

### Custom design tokens

Change design tokens like colors, typography and breakpoints in [index.js](./index.js), below is an example.

```js
const colors = require('tailwindcss/colors');
const defaultTheme = require('tailwindcss/defaultTheme');

module.exports = {
  theme: {
    colors: {
      ...colors,

      // Add user custom colors here
      primary: colors.blue,
      secondary: colors.indigo,
    },

    fontFamily: {
      ...defaultTheme.fontFamily,

      // Add user custom font family here
      brand: ['Barlow', 'sans-serif'],
    },

    // Add user custom breakpoints here
    screens: {
      xs: '368px',
      sm: '686px',
      md: '1024px',
      lg: '1220px',
    },
  },
};
```

### Add/Change base classes

If there are some user customize tailwindcss classes you will to use in project frequently, you should add them in [index.js](./index.js), below is an example.

```js
const defaultTheme = require('tailwindcss/defaultTheme');

module.exports = {
  theme: {
    borderRadius: {
      ...defaultTheme.borderRadius,

      // Add user custom here
      half: '50%',
      third: '33.3%',
    },
  },
};
```

### Use official or custom tailwindcss plugins

For official plugins, you should install it with `pnpm`, then require it in plugin list, for local plugin, just require the relative path of the plugin.

```js
/** @type {import('tailwindcss/tailwind-config').TailwindConfig} */
module.exports = {
  plugins: [
    // An official plugin
    require('@tailwindcss/forms'),

    // An user defined local plugin
    require('./plugin'),
  ],
};
```

### Add tailwindcss utilities with custom plugin

We can define a local plugin to add more utilities to tailwindcss, write utility block in `CSS-in-JS` format, below is a example.

```js
const plugin = require('tailwindcss/plugin');

module.exports = plugin(({ addUtilities, theme }) => {
  addUtilities({
    '.overlay': {
      position: 'absolute',
      right: 0,
      left: 0,
      height: '100%',
      width: '100%',
      overflow: 'hidden',
    },
  });
});
```
npm package: @settleapi/acceptance
Description: Settle Acceptance library
Latest version: 1.0.0

settle.acceptance.js
==================

A standalone JavaScript library that helps you display QR-codes or "Pay with Settle" buttons correctly depending on browser platform.
On a phone a button will be shown, that when pressed opens the Settle app and makes a call to Settle.
If the phone does not have Settle installed the user will be redirected to GooglePlay or AppStore.

Building the library
--------------------
You need `npm` from [node.js](http://nodejs.org/) to build this library.
```
npm install
npm run build
```

Deploying the library
---------------------
After building the code deploy the content of `dist` folder. Pick either settle.acceptance.js or the minified settle.acceptance.min.js and the assets folder as is.


Example and customization
------------------------
[press here](https://aukaio.github.io/settle.acceptance.js/)
You can open this link in on your phone to see how it changes from QR
code to button (or fake your user agent and view on your laptop). Shows examples of customization with alternate look and language variants.


Try the example
-------------
Start a local example server `npm run example` and open [http://localhost:7080/index.html](http://localhost:7080/example.html) in your browser.

Test suit
-------

```
npm test
```