# @vlalg-nimbus/chameleon-grid-layout

> Chameleon Grid Layout

Latest version **2.0.0** (published 2024-11-19) · MIT license · 0 weekly downloads

## Install

```sh
npm install @vlalg-nimbus/chameleon-grid-layout
pnpm add @vlalg-nimbus/chameleon-grid-layout
yarn add @vlalg-nimbus/chameleon-grid-layout
bun add @vlalg-nimbus/chameleon-grid-layout
```

## Health

**Score 45/100 (D)** — status: stable.

Positive: esm support; no vulnerabilities; high maintenance score.

Warnings: low downloads; no types.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 2.0.0 |
| Published | 2024-11-19 |
| First published | 2023-09-17 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 18.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 16 |
| Author | Antonio and Felipe |
| Maintainers | tonhaosantos |
| Keywords | module, lib, css, library, css, sass, mobile-first, responsive, front-end, framework, web |

## Links

- npm: https://www.npmjs.com/package/@vlalg-nimbus/chameleon-grid-layout
- Repository: https://github.com/VemLavarALoucaGamers/vlalg-nimbus
- Homepage: https://nimbus.tec.br
- Issues: https://github.com/VemLavarALoucaGamers/vlalg-nimbus/issues
- npm.io page: https://npm.io/package/@vlalg-nimbus/chameleon-grid-layout

## Alternatives

- [style-dictionary](https://npm.io/package/style-dictionary.md) — 2.0M weekly downloads
- [postcss-merge-idents](https://npm.io/package/postcss-merge-idents.md) — 1.7M weekly downloads
- [@fontsource/noto-sans](https://npm.io/package/@fontsource/noto-sans.md) — 93.0K weekly downloads
- [uglifycss](https://npm.io/package/uglifycss.md) — 71.6K weekly downloads
- [mat4-interpolate](https://npm.io/package/mat4-interpolate.md) — 23.3K weekly downloads

## Recent versions

- 2.0.0 (latest) — 2024-11-19
- 1.0.3 — 2024-03-20
- 1.0.2 — 2023-10-06
- 1.0.1 — 2023-10-05
- 1.0.0 — 2023-09-17

## README

<p align="center">
<img src="https://github.com/VemLavarALoucaGamers/vlalg-nimbus/raw/main/packages/scss/chameleon-grid-layout/images/Chameleon_Grid_Layout_Logo_White_Name.png" width="100">
</p>

<div align="center">

![npm](https://img.shields.io/npm/v/@vlalg-nimbus/chameleon-grid-layout?style=for-the-badge) ![npm](https://img.shields.io/npm/dm/@vlalg-nimbus/chameleon-grid-layout?style=for-the-badge) ![Snyk Vulnerabilities for npm package](https://img.shields.io/snyk/vulnerabilities/npm/@vlalg-nimbus/chameleon-grid-layout?label=npm%20vulnerabilities&style=for-the-badge) ![Snyk Vulnerabilities for GitHub Repo](https://img.shields.io/snyk/vulnerabilities/github/VemLavarALoucaGamers/vlalg-nimbus?label=Repo%20Vulnerabilities&style=for-the-badge)
</div>

<br />

<p align="center">
<img src="https://github.com/VemLavarALoucaGamers/vlalg-nimbus/raw/main/packages/scss/chameleon-grid-layout/images/example.png" width="300">
<img src="https://github.com/VemLavarALoucaGamers/vlalg-nimbus/raw/main/packages/scss/chameleon-grid-layout/images/example2.png" width="300">
</p>

A CSS library that provides classes to work with Responsive Grid Layout.

## Documentation

Documentation and tutorial on how to use it can be found [here](https://nimbus.tec.br/css-library). We didn't put it here in README.md because it would take up a lot of space.

## How to use?

##### CDN

To use the CSS file via CDN, or if you prefer, you can use the auto-import file (JS) via CDN, it can be done this way:

[Unpkg CSS](https://unpkg.com/@vlalg-nimbus/chameleon-grid-layout/dist/chameleon-grid-layout.min.css) / [Unpkg JS](https://unpkg.com/@vlalg-nimbus/chameleon-grid-layout/dist/chameleon-grid-layout.min.js)

Links:

```js
https://unpkg.com/@vlalg-nimbus/chameleon-grid-layout/dist/chameleon-grid-layout.min.css

// or

https://unpkg.com/@vlalg-nimbus/chameleon-grid-layout/dist/chameleon-grid-layout.min.js
```

##### To install

```bash
npm i @vlalg-nimbus/chameleon-grid-layout
```

or

```bash

yarn add @vlalg-nimbus/chameleon-grid-layout

```

To use, just import the CSS file. I do not recommend using the auto import file (IIFE), this avoids possible conflicts if your system does not support IIFE.

```js
import '@vlalg-nimbus/chameleon-grid-layout/dist/chameleon-grid-layout.min.css'
```

## Browser support

These were some of the browsers tested:

- Chrome
- Edge
- Firefox ESR+
- Internet Explorer 10+
- Safari 8+
- Opera

I didn't mention the all versions, but I guarantee that it works correctly in 99% of browsers that have already been previously tested. The tests were carried out on [browserling](https://www.browserling.com) and [browserstack](https://www.browserstack.com).

## License

[MIT](http://opensource.org/licenses/MIT)

---
_Source: https://npm.io/package/@vlalg-nimbus/chameleon-grid-layout · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._