All Projects → kjbrum → Juice

kjbrum / Juice

Licence: mit
Mixins for Life

Projects that are alternatives of or similar to Juice

Sassessentials
Repository for my tutorial course: Sass Essential Training on LinkedIn Learning and Lynda.com.
Stars: ✭ 167 (-39.05%)
Mutual labels:  mixins, scss, sass, sass-mixins
Mixins
sass mixins
Stars: ✭ 132 (-51.82%)
Mutual labels:  mixins, scss, sass
Sass Deprecate
Let Sass warn you about the pieces of your UI that are deprecated, providing a clear upgrade path for developers
Stars: ✭ 265 (-3.28%)
Mutual labels:  scss, sass, sass-mixins
Accecss
AcceCSS A Sass Mixin That debug & check the accessibility of your designs
Stars: ✭ 132 (-51.82%)
Mutual labels:  mixins, scss, sass-mixins
Mq Scss
Extremely powerful Sass media query mixin. Allows you to create almost any media query you can imagine.
Stars: ✭ 122 (-55.47%)
Mutual labels:  mixins, scss, sass
Browser Hack Sass Mixins
Browser hack sass mixin - Apply your SCSS to a specific browser - CSS hacks for: IE, Chrome, Firefox, Edge, Opera
Stars: ✭ 170 (-37.96%)
Mutual labels:  mixins, scss, sass
Bourbon
Bourbon is maintained by the thoughtbot design team. It is funded by thoughtbot, inc. and the names and logos for thoughtbot are trademarks of thoughtbot, inc.
Stars: ✭ 9,065 (+3208.39%)
Mutual labels:  scss, sass, sass-mixins
Skeleton Sass
Skeleton Sass is a highly modular version of Skeleton CSS
Stars: ✭ 151 (-44.89%)
Mutual labels:  mixins, scss, sass
Sassyfication
💅Library with sass mixins to speed up your css workflow.
Stars: ✭ 51 (-81.39%)
Mutual labels:  scss, sass, sass-mixins
Sassmagic
Collection best of Sass mixins and function
Stars: ✭ 795 (+190.15%)
Mutual labels:  scss, sass, sass-mixins
Breakpoint Slicer
Slice media queries with ease
Stars: ✭ 332 (+21.17%)
Mutual labels:  scss, sass, sass-mixins
Css Vars
Sass mixin to use CSS Custom Properties with Sass
Stars: ✭ 164 (-40.15%)
Mutual labels:  scss, sass, sass-mixins
Sscss
Light Sass lib for managing your font-size, margin, padding, and position values across breakpoints.
Stars: ✭ 119 (-56.57%)
Mutual labels:  scss, sass, sass-mixins
Sass Extras
Useful utilities for working with Sass
Stars: ✭ 179 (-34.67%)
Mutual labels:  scss, sass, sass-mixins
Bootstrap
The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.
Stars: ✭ 154,459 (+56271.9%)
Mutual labels:  scss, sass
Input Range Scss
Styling Cross-Browser Compatible Range Inputs with Sass
Stars: ✭ 272 (-0.73%)
Mutual labels:  scss, sass
Aqua.css
An elegant CSS Framework.
Stars: ✭ 253 (-7.66%)
Mutual labels:  scss, sass
Csshake
CSS classes to move your DOM!
Stars: ✭ 4,531 (+1553.65%)
Mutual labels:  mixins, sass
Angled Edges
📐 Quickly create angled section edges using only Sass
Stars: ✭ 969 (+253.65%)
Mutual labels:  mixins, sass
buttono
A flexible Sass mixin for creating BEM-style buttons.
Stars: ✭ 82 (-70.07%)
Mutual labels:  mixins, sass-mixins

Bower Version

Juice - Mixins for Life

Simplify your life. Juice is a collection of Sass mixins/functions that are used to minimize the work needed to apply styling/properties to elements. Juice is not just a collection to help with cross browser support, so it is best paired with autoprefixer, for the best possible browser compatibility.

Documentation

http://kylebrumm.com/juice

Requirements:

  • Sass Version 3.3

Features:

Mixins

  • Breakpoints
  • Show/Hide Element
  • Single Side Border Radius
  • Single Transform
  • Box Emboss
  • Letterpress
  • Placeholder Color
  • Sizing
  • Hoverer
  • Responsive
  • Triangle
  • Circle
  • Square
  • Position
  • TRBL
  • Image Preload
  • Juice Prefixer

Helpers

  • Clearfix
  • Hide Text
  • Centerer
  • Vertical Centerer
  • Coverer
  • Center Block
  • Clean

Functions

  • Tint
  • Shade
  • Strip Units
  • Rem Calc
  • Em Calc
  • Random Color
  • Reverse String

Installation

You can use either bower or just clone the github repo directly.

Bower

$ bower install juice

Clone/Fork

$ git clone [email protected]:kjbrum/juice.git

Using the file

Just import the "_juice.scss" file into your main scss file:

@import "juice";

Compatibility Issues / Conflicts:

Bourbon
  • Position (mixin)
  • Single Side Border Radius (mixin)
  • Triangle (mixin)
  • Strip Units (function)
Compass
  • Single Side Border Radius (mixin)
  • Transforms (mixin)

Changelog:

1.0.1:
  • Fix box-emboss with prefixes issue
1.0.0:
  • Placeholders have been turned into argument-less mixins (helpers)
  • New mixins - Image Preload, show/hide, juice prefixer, clean
  • Global option (variable) to add cross browser prefixes
  • Added a few extra breakpoint presets (mostly -only options)
  • Fixed the breakpoint mixin so that the more complex queries actually work now

To-Do

  • Change the way mixins that take multiple values (trbl, size, etc..) are structured. (Make it so they don't require commas)

License

Copyright © Kyle Brumm. Juice is free to use on whatever and may be redistributed under the terms specified in the license.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].