https://github.com/otsukasatoshi/sass-library

A sass library for general use.
https://github.com/otsukasatoshi/sass-library

css sass sass-functions sass-library sass-mixins scss

Last synced: about 1 month ago
JSON representation

A sass library for general use.

• Host: GitHub
• URL: https://github.com/otsukasatoshi/sass-library
• Owner: otsukasatoshi
• License: mit
• Created: 2020-09-28T04:40:43.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2024-11-26T06:49:42.000Z (about 1 month ago)
• Last Synced: 2024-11-26T07:29:53.778Z (about 1 month ago)
• Topics: css, sass, sass-functions, sass-library, sass-mixins, scss
• Language: SCSS
• Homepage:
• Size: 132 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 13
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Sass library

![CI](https://github.com/otsukasatoshi/sass-library/workflows/CI/badge.svg)

Collection of Sass mixins and functions.

## Setup

### Clone project

```

git clone [email protected]:otsukasatoshi/sass-library.git

```

### Install

```

yarn install

```

## Run the project

### Compile Sass to CSS

```

gulp

```

### Lint

```

yarn lint

```

### Format

```

yarn format

```

## Usage

### Write your Sass code in `./src/sass/app.scss`

```

.el {

  background-color: $bg-color;

  @include box(200px);

  @include center(xy);

}

```

### CSS code is output to `./dist/css/app.css`

```

.el {

  background-color: #cc6699;

  width: 200px;

  height: 200px;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

}

```

### View HTML file

open `./dist/index.html` in your browser.