https://github.com/sass-basis/basis

A lightweight responsive Sass/CSS framework based on flexible box.
https://github.com/sass-basis/basis

css css-framework flexbox mixin sass scss

Last synced: 2 months ago
JSON representation

A lightweight responsive Sass/CSS framework based on flexible box.

• Host: GitHub
• URL: https://github.com/sass-basis/basis
• Owner: sass-basis
• License: mit
• Created: 2015-11-20T02:44:10.000Z (about 9 years ago)
• Default Branch: master
• Last Pushed: 2024-11-05T07:06:41.000Z (3 months ago)
• Last Synced: 2024-11-05T08:18:35.711Z (3 months ago)
• Topics: css, css-framework, flexbox, mixin, sass, scss
• Language: SCSS
• Homepage: https://sass-basis.github.io/
• Size: 5.85 MB
• Stars: 144
• Watchers: 7
• Forks: 14
• Open Issues: 10
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Basis

A lightweight responsive Sass/CSS framework based on flexible box.



* Document: https://sass-basis.github.io/

* GitHub: https://github.com/sass-basis/basis/

* Release: https://github.com/sass-basis/basis/releases/

## Why it's awesome?

* Basis isn't about a UI framework. Basis provides only basic frame of components. So you build a responsive web page quickly and easy to overwrite with your Sass or CSS.

* CSS architecture of Basis is [FLOCSS](https://github.com/hiloki/flocss). So it is possible a modular approach.

* Basis has incorporated the concept of vertical rhythm. So you can be a good-balanced design.

* Basis has many mixins. Usufule mixins and abstract mixin of compornents.

## Get started

### Using NPM

Installs Basis

```

$ npm install sass-basis

```

Imports Basis your Sass/SCSS.

```

/* If you want to use Basis classes */

@import node_modules/sass-basis/src/css/basis;

/* If you want to use Basis mixins only */

@import node_modules/sass-basis/src/css/basis-core;

```

Imports JavaScript

```

import 'node_modules/sass-basis/src/js/basis.js';

```

### Download from GitHub

Download the basis from https://github.com/sass-basis/basis/releases

Imports Basis your Sass/SCSS.

```

/* If you want to use Basis classes */

@use "node_modules/sass-basis/src/css/basis;"

/* If you want to use Basis mixins only */

@use "node_modules/sass-basis/core";

```

or Just this link.

```

```

Loads JavaScripts

```

```

### Using CDN (jsDelivr)

https://cdn.jsdelivr.net/npm/sass-basis@latest/dist/

### Sample for using classes

```

Btn

```

### Sample for using abstracts

```

@use "node_modules/sass-basis/core";

.c-btn {

  @include core.btn();

  &--block {

    display: block;

  }

}

```

```

Btn

```

## Browser support

Modern Browser only

## How to contribute

Please make an issue if there is a problem and needs.

Please don't make the new issue if the issue of the same content already exists.

If you can coding, please give me a pull request.

But, please do not send in the master branch.

Pull request sent to the master branch doesn't merge.

## License

MIT License