项目作者: 7ninjas

项目描述 :
Collection of scss mixins and functions to ease and improve implementations of common style-code patterns.
高级语言: CSS
项目地址: git://github.com/7ninjas/scss-mixins.git
创建时间: 2018-01-05T11:22:11Z
项目社区:https://github.com/7ninjas/scss-mixins

开源协议:MIT License

下载







7ninjas




scss-mixins is a collection of scss mixins and functions to ease and improve implementations of common style-code patterns.




Discover our scss practices »




Portfolio

Careers

Contact

Be like a Ninja! Style like a Ninja!


Status

@7ninjas/scss-mixins"">npm
@7ninjas/scss-mixins"">npm
@7ninjas/scss-mixins"">npm

CircleCI branch
David
GitHub code size in bytes

GitHub pull requests
GitHub issues
GitHub closed issues

GitHub stars
GitHub watchers

Quick start

Several quick start options are available:

  • Clone the repo: git clone https://github.com/7ninjas/scss-mixins.git
  • Install with npm: npm install @7ninjas/scss-mixins
  • Install with yarn: yarn add @7ninjas/scss-mixins

Usage

Import all file to your core scss file for importing all mixins from package

Example:

  1. @import '~@7ninjas/scss-mixins/all';

Table of contents


Animations

- Full documentation
- Mixin hardware


Border Radius

- Full documentation
- Mixin border-radius
- Mixin border-top-radius
- Mixin border-right-radius
- Mixin border-bottom-radius
- Mixin border-left-radius


Breakpoints

- Full documentation
- Mixin media-breakpoint-up
- Mixin media-breakpoint-down
- Mixin media-breakpoint-between
- Mixin media-breakpoint-only


Buttons

- Full documentation
- Mixin button-variant
- Mixin button-outline-variant
- Mixin button-size


Flex

- Full documentation
- Mixin flex
- Mixin inline-flex


Fonts

- Full documentation
- Mixin font-face


Forms

- Full documentation
- Mixin placeholder


Gradients

- Full documentation
- Mixin gradient-bg
- Mixin gradient-x
- Mixin gradient-y
- Mixin gradient-directional
- Mixin gradient-x-three-colors
- Mixin gradient-y-three-colors
- Mixin gradient-radial
- Mixin gradient-striped


Grid

- Full documentation
- Mixin center
- Mixin container
- Mixin col


Hover

- Full documentation
- Mixin hover
- Mixin hover-focus
- Mixin plain-hover-focus
- Mixin hover-focus-active


Icons

- Full documentation
- Mixin svg-icon


Images

- Full documentation
- Mixin img-fluid


Lists

- Full documentation
- Mixin list-unstyled


Positioning

- Full documentation
- Mixin size
- Mixin clearfix
- Mixin z-index
- Mixin pseudo
- Mixin absolute
- Mixin fixed
- Mixin relative
- Mixin sticky


Responsive

- Full documentation
- Mixin responsive-prop
- Mixin responsive-embed
- Mixin responsive-col


Shapes

- Full documentation
- Mixin triangle


Spacing

- Full documentation
- Mixin ml
- Mixin mt
- Mixin mr
- Mixin mb
- Mixin mx
- Mixin my
- Mixin m
- Mixin pl
- Mixin pt
- Mixin pr
- Mixin pb
- Mixin px
- Mixin py
- Mixin p


Tables

- Full documentation
- Mixin table
- Mixin table-bordered
- Mixin table-responsible
- Mixin table-striped
- Mixin table-hover


Typography

- Full documentation
- Mixin text-hide
- Mixin text-truncate
- Mixin font


Variables

- Full documentation

Bugs and feature requests

Found bug? Or maybe you’ve got great idea for feature request? Please first search for existing and closed issues.
If your problem or idea is not addressed yet - don’t hesitate to open a new issue!

Community

Get updates on 7ninjas’s development and chat with the project maintainers and community members.

Versioning

To see new features and changes for each released version checkout the Releases section of our GitHub project

License

Code released under the MIT License.