sass-boilerplate - A collection of common use Sass stylesheets, mixins and functions.

  •        19

Building a collection of my common use Sass mixins, functions and snippets. All written with SCSS syntax. Mixins for CSS3 animation, @keyframes and transition defintions.

https://www.npmjs.com/package/sassboilerplate
https://github.com/magnetikonline/sass-boilerplate

Tags
Implementation
License
Platform

   




Related Projects

awesome-sass - 🎨 Curated list of awesome Sass and SCSS frameworks, libraries, style guides, articles, and resources

  •    

Curated list of awesome Sass and SCSS frameworks, libraries, style guides, articles, and resources. Sass is an extension of CSS that adds power and elegance to the basic language. It allows you to use variables, nested rules, mixins, inline imports, and more, all with a fully CSS-compatible syntax. Sass helps keep large stylesheets well-organized, and get small stylesheets up and running quickly.

motherplate - A bare bones responsive SCSS boilerplate for web designers

  •    CSS

This is a bare bones HTML/CSS framework. This is what I'll typically start off most web projects with. It includes a CSS reset and a bunch of minimal boilerplate styles that should come in useful for any project, including a responsive grid, typography, buttons, icons and forms.

bourbon - A Lightweight Sass Tool Set

  •    Ruby

Bourbon is a library of Sass mixins and functions that are designed to make you a more efficient style sheet author. Alternatively, you can install Bourbon with Bower.

grunt-contrib-sass - Compile Sass to CSS.

  •    Javascript

Run this task with the grunt sass command. Sass is a preprocessor that adds nested rules, variables, mixins and functions, selector inheritance, and more to CSS. Sass files compile into well-formatted, standard CSS to use in your site or application.

css3-sass-mixins - SASS mixins which makes it easy to use css3 in SASS or SCSS powered projects

  •    

SASS mixins which makes it easy to use css3 in SASS or SCSS powered projects


spectre - Spectre.css - A Lightweight, Responsive and Modern CSS Framework

  •    CSS

Spectre.css is a lightweight, responsive and modern CSS framework. Spectre is a side project based on years of CSS development work on a large web service project. Spectre only includes modern base styles, responsive layout system, CSS components and utilities, and it can be modified for your project with Sass/Scss compiler.

grunt-contrib-compass - Compile Compass to CSS.

  •    Javascript

Run this task with the grunt compass command. Compass is an open-source authoring framework for the Sass css preprocessor. It helps you build stylesheets faster with a huge library of Sass mixins and functions, advanced tools for spriting, and workflow improvements including file based Sass configuration and a simple pattern for building and using Compass extensions.

Crumpet - Crumpet is a deliciously simple SASS/SCSS responsive framework that keeps your HTML clean & stays out of your way

  •    CSS

Crumpet is a deliciously simple SASS/SCSS responsive framework that keeps your HTML clean & stays out of your way. Tidy HTML - Uses placeholder selectors to reduce the size of your HTML. No one likes messy.

spaceBase - A Sass-based responsive CSS framework.

  •    CSS

Many CSS frameworks are meant to be included and left alone. But spaceBase is a boilerplate layer that can be built upon and tailored for your needs. It combines best practices for today’s responsive web with the core components we use on every project. Consider it the launch pad for your adventures into cyberspace. spaceBase is the front-end starter files for any new web project. It sets up your Sass architecture and normalizes your CSS and native HTML elements. It provides the structural groundwork for your application.

sass.js - Sass.js - API for emscripted libsass to run in the browser

  •    Javascript

Sass parser in JavaScript. Have a look at the Interactive Playground to play around with compiling SCSS to CSS in your browser.This is a convenience API for emscripted libsass (at v3.4.8). If you're looking to run Sass in node, you're probably looking for node-sass. Sass.js and node-sass should generate the same results.

breakpoint - Really simple media queries in Sass

  •    CSS

Breakpoint makes writing media queries in Sass super simple. Create a variable using a simplified syntax based on most commonly used media queries, then call it using the breakpoint mixin. Breakpoint handles all of the heavy lifting, from writing the media query itself, to handling cross-browser compatibility issues, so you can focus on what's important: making sure your website looks its best. Breakpoint also allows you to get the context of your media queries from your code, allowing you to write dynamic mixins based on their media query context.

include-media - 📐 Simple, elegant and maintainable media queries in Sass

  •    CSS

include-media is a Sass library for writing CSS media queries in an easy and maintainable way, using a natural and simplistic syntax. I spent quite some time experimenting with different libraries and mixins available out there, but eventually all of them failed to do everything I needed in an elegant way. Some of them wouldn't let me mix set breakpoints with case-specific values, others wouldn't properly handle the CSS OR operator and most of them had a syntax that I found complicated and unnatural.

progress-tracker - A progress tracker written in SASS with flexbox to be flexible and responsive out of the box

  •    CSS

A progress tracker written in SASS with flexbox to be flexible and responsive out of the box. This can be used to illustrate a multi stage process e.g. form, quiz or a timeline. Once you have downloaded the code, run the commands below to view the demo.

avalanche - Superclean, powerful, responsive, Sass-based, BEM-syntax CSS grid system

  •    CSS

Example of a two column, responsive, centered grid. All grid layout classes and responsive width classes are modifiers. $av-namespace Global prefix for layout and cell class names. Default: grid.

node-sass - :rainbow: Node.js bindings to libsass

  •    C++

Node-sass is a library that provides binding for Node.js to LibSass, the C version of the popular stylesheet preprocessor, Sass. It allows you to natively compile .scss files to css at incredible speed and automatically via a connect middleware.

sass-build-structure - An example SASS build structure sample to start a project

  •    CSS

After reading the book SMACSS and finding it very helpful the Front End team at Evernote has used some of the ideas in our SASS build. We've found breaking the SASS files out into directories (Base, Layout, Modules, and Views) helps organize our files in a project and compile CSS into a clean, logical file. Each page has a SASS (.scss) file created that acts as a project file that imports the individual modular components from Base, Layout, Modules, and Views that are needed to build the particular page. This build methodology is currently being used on Evernote.com.

postcss-scss - SCSS parser for PostCSS.

  •    Javascript

A SCSS parser for PostCSS.This module does not compile SCSS. It simply parses mixins as custom at-rules & variables as properties, so that PostCSS plugins can then transform SCSS source code alongside CSS.

Saas - CSS with superpowers

  •    Ruby

Sass makes CSS fun again. Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It's translated to well-formatted, standard CSS using the command line tool or a web-framework plugin. Sass boasts more features and abilities than any other CSS extension language out there.

sassy-starter - :tada: Sassy starter - HTML / SCSS (SMACSS)

  •    CSS

For theming: add separate file (theme.scss) insrc/scss/themes/, override the default $theme variable, and run gulp themes. Developed by @MinaMarkham. Please list all bugs and feature requests in the Github issue tracker.





We have large collection of open source products. Follow the tags from Tag Cloud >>


Open source products are scattered around the web. Please provide information about the open source projects you own / you use. Add Projects.