GithubHelp home page GithubHelp logo

flowingis / frontsize Goto Github PK

View Code? Open in Web Editor NEW
11.0 6.0 0.0 3.71 MB

:art: A fully customizable CSS generator

Home Page: http://ideatosrl.github.io/frontsize/

License: MIT License

CSS 74.75% JavaScript 25.25%
bem sass multiple-themes

frontsize's Introduction

frontsize

Version TravisCI Built with SASS MIT licence Join the chat at Gitter

Frontsize is not a set of widgets ready to be used in your website, it's a set of mixins and functions to build BEM widgets, it's a tool to generate your sets.

Main features

  • It's BEM ready
  • It's build to work with multiple themes in the same project
  • It's born to be flexible and customization oriented
  • It's covered by tests

The project was originally developed in LESS, now only the SASS version is mantained.


Release 4.0.4

  • Folder widgets is renamed to blocks necause of frontsize's BEM based nature

Release 4.0.3

  • Adds $invalidate-cache var to let theme functions for background images generates also a random unique id

Release 4.0.2

  • Fix vertical-gradient mixin

Release 4.0.1

  • Adds $frontsize-release-infos to theme config
  • Removes a-pollo module from node dependencies

Install

NPM way:

npm install --save frontsize

YARN way:

yarn add frontsize

Documentation

Run this command inside frontsize module:

cd node_modules/frontsize && npm run styleguideServe

This will open a browser window with the documented code.


Theme installation

Once you have downloaded it, copy your theme to the project front-end development folder:

cp -r node_modules/frontsize/themes frontend/frontsize

Then change core references to let it point to module folder:

In frontend/frontsize/_config/import.scss file:

@import '../../node_modules/frontsize/core/import';

Now the core can be easily upgraded with npm update frontsize-sass --save when a new release is available.


To test frontsize:

npm install && npm run test

Created by Vittorio Vittori and Alessandro Minoccheri @ ideato srl

frontsize's People

Contributors

alessandrominoccheri avatar gitter-badger avatar vitto avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.