COCO is an open-source CSS framework.
Minimalistic ⛽ | Modular 🗂 | Modern 💈 | Free ⚗️ |
---|---|---|---|
As small as possible, yet feature-rich | Import only the components you need | Built on CSS3 | Open Source |
Latest version:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@blockchainhub/coco/dist/css/coco.min.css" />
Minor updates and patch fixes within a major version:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@blockchainhub/coco@2/dist/css/coco.min.css" />
Patch fixes within a minor version:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@blockchainhub/coco@2.0/dist/css/coco.min.css" />
Using SRI with the exact version:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@blockchainhub/coco@2.0.0/dist/css/coco.min.css" integrity="sha384-{hash}" crossorigin="anonymous" />
Replace
{hash}
with the SRI hash generated for the specific version. Use this SRI Hash Generator for assistance.
npm i @blockchainhub/coco
or
npm install "https://github.com/bchainhub/coco.git#semver:^2.0" --save
yarn add @blockchainhub/coco
or
yarn add "https://github.com/bchainhub/coco.git#semver:^2.0"
After installation, import the CSS file into your project:
CSS version:
@import '@blockchainhub/coco/dist/coco.css';
Minified CSS version:
@import '@blockchainhub/coco/dist/coco.min.css';
This framework uses a grid system with the same standards as Bootstrap.
Implement a sticky footer with just one class:
<body class="has-sticky-footer">
<header></header>
<main></main>
<footer></footer>
</body>
Use emojis as icons with effects:
<em class="oji flat">📥</em>
Display the current version of COCO using this code:
<span class="coco version">version </span>
For detailed documentation, visit the Online Manual.
Have you noticed some files start with an underscore?
Sass files that begin with an underscore (
_
) are considered partials. These files are not compiled by themselves but are included in other files.
Released under the CORE license.