Skip to content

This is a library of stylus mixins for the most natural syntax in stylus

Notifications You must be signed in to change notification settings

luismidevmx/stylus-kit

Folders and files

NameName
Last commit message
Last commit date
Jun 27, 2021
Jun 27, 2021
Jun 27, 2021
Feb 22, 2021
Jun 27, 2021
Jun 27, 2021
Apr 24, 2021
Jun 27, 2021

Repository files navigation

Stylus kit

This is a library of stylus mixins for the most natural syntax in stylus

stylus is based on natural syntax, this mixins starts with programmers' desireds shorthands

.awesome-grid
  grid-template 'faz' 60px \
                'foo' auto \
                'bar' auto /\
                 1fr

  lg grid-template  'faz faz' 60px \
                    'foo bar' auto \/\
                     2fr 1fr

  xl grid-template  'faz faz' 60px \
                    'foo bar' auto \/\
                     3fr 1fr

yields:

.awesome-grid {
  grid-template: 'faz' 60px 'foo' auto 'bar' auto/1fr;
}
@media screen and (min-width: 900px) {
  .awesome-grid {
    grid-template: 'faz faz' 60px 'foo bar' auto/2fr 1fr;
  }
}
@media screen and (min-width: 1200px) {
  .awesome-grid {
    grid-template: 'faz faz' 60px 'foo bar' auto/3fr 1fr;
  }
}

this do not provide prefixes, because nib and postcss are written for make it

Features

Get started

Install

npm i -D stylus-kit

import the plugin for the compiler

using terminal

npx stylus index.styl -u node_modules/stylus-kit

Javascript

const stylus = require('stylus')
const { readFileSync } = require('fs')
const stylusKit = require('stylus-kit')

stylus(readFileSync('./index.styl', 'utf-8'), {
  use: [stylusKit()]
}).render(console.error, console.log)

Webpack

{
  loader: 'stylus-loader',
  options: {
    stylusOptions: {
      use: ['stylus-kit']
    }
  }
}

add the library in your index.styl

@require stylus-kit

Contributors

contributors welcome, lets revive stylus with for comfort for all of us!

About

This is a library of stylus mixins for the most natural syntax in stylus

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published