https://github.com/squidit/css
Front-end framework style created by Squid
https://github.com/squidit/css
components css framework js scss squid style
Last synced: about 1 month ago
JSON representation
Front-end framework style created by Squid
- Host: GitHub
- URL: https://github.com/squidit/css
- Owner: squidit
- License: mit
- Created: 2021-05-10T14:02:05.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2026-01-28T13:32:53.000Z (2 months ago)
- Last Synced: 2026-01-29T05:44:10.149Z (2 months ago)
- Topics: components, css, framework, js, scss, squid, style
- Language: CSS
- Homepage:
- Size: 36 MB
- Stars: 1
- Watchers: 12
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
CSS - Components Squid Style
## About
> Squid CSS Framework
## Table of contents
- [About](#about)
- [Table of contents](#table-of-contents)
- [Exemple](#exemple)
- [Usage](#usage)
- [Install](#install)
- [Angular Install](#angular-install)
- [React.js Install](#reactjs-install)
- [Vue.js Install](#vuejs-install)
- [Development](#development)
- [Write Documentation](#write-documentation)
- [Production](#production)
- [Deploy on jsdelivr](#deploy-on-jsdelivr)
- [Documentation](#documentation)
- [External Libraries and Inspiration](#external-libraries-and-inspiration)
- [Animate.css](#animatecss)
- [Grid System](#grid-system)
- [Icons](#icons)
- [Toast](#toast)
- [Based Styleguide](#based-styleguide)
## Exemple
See an exemple of all components [here](https://squidit.github.io/css/)
## Usage
### Install
You can easily install with npm
or download [here](https://github.com/squidit/css/releases)
or use CDN`https://www.jsdelivr.com/package/gh/squidit/css`\*
or use `https://css-cdn.squidit.com.br`\*
-> Use the path from references above on CDN's to find the files. Exemple: `https://css-cdn.squidit.com.br/dist/css/squid.min.css`
`npm install @squidit/css --save`
Just reference CSS `/dist/css/squid.min.css` and Javascript `/dist/js/squid.min.js` on your page or your framework.
If necessary remember to declare the fonts contained in the `/dist/fonts` folder or change paths on `squid.min.css` or `squid.css`
```html
...
...
```
#### Angular Install
Use [NGX-CSS](https://github.com/squidit/ngx-css)
#### React Install
Use [React-CSS](https://github.com/squidit/react-css)
#### Vue.js Install
Soon
## Development
1. Install npm dependences
`npm install`
2. Run `npm start` to watch `.scss` and `.js` files
### Write Documentation
See Intructions [here](https://github.com/squidit/css/blob/master/src/docs/README.md)
### Deploy on jsdelivr
The official CDN for Squid CSS is jsdelivr, which is even where the framework documentation consumes assets.
On [GitHub Releases](https://github.com/squidit/css/releases) create a new release, with a new tag version\*\* and using `master` branch
### jsdelivr usage
```html
...
...
```
### Deploy yo NPM
> Just draft a new release here on Github and an actions will starts
\*\*Important to use the same tag as package.json
## Documentation
See Docs [here](https://css.squidit.com.br)
## External Libraries and Inspiration
### Animate.css
> This framework uses Animate.css lib, see docs [here](https://animate.style/)
### Grid System
> This framework uses a Grid based on Boostrap 5 Grid System with modifications, see docs [here](https://getbootstrap.com/docs/5.0/)
### Icons
> This framework uses Icons from Font Awersome, see [here](https://fontawesome.com/)
### Toast
> This framework uses a adaptation of VanillaToast, see [here](https://github.com/talsu/vanilla-toast)
### Based Styleguide
> This framework is based on [Squid Styleguide](https://www.figma.com/file/jgIT00DpxPCgaFwxlN7BZv/PADRONIZA%C3%87%C3%83O?node-id=0%3A1)