Skip to content

a CSS library of classes to simplify the creation of flex-based layouts

License

Notifications You must be signed in to change notification settings

colbysargentcodes/fle.css

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

fle.css

fle.css is a CSS library of classes to simplify the creation of flex-based layouts.

The library can be generated through a javascript file with customisable options.

Usage

  1. Modify the options object in fle.css.js to your requirements to generate a custom fle.css stylesheet
  2. Either
    1. (recommended) Link to your generated fle.css in your HTML

      <link rel='stylesheet' href='fle.css'>
      
    2. Link to the script in your HTML

      <script src='fle.css.js'></script>
      

Options

All options are currenty required.

prefix

Type: String

Prepended to all classes. The can be omitted, however this may cause issues.

directionName

Type: String

Defines how direction classes are named (examples below). Valid options are direction, from, or both.

direction would use the class .fc-direction-right for a left to right flow.

from would use the class .fc-from-left for a left to right flow.

both would enable both types.

breaks

Type: Array of Objects

Media query breakpoints to be generated. Each breakpoint object requires prefix and size string properties.

Currently, these breakpoints are not sorted prior to generation, therefore should be in ascending order.

Key Files

fle.css.js

The main script, with customisable options, this generates and appends the CSS library to the document's head element.

fle.css-min.js

A minified version of fle.css.js

fle.css

The base CSS library, generated using default options.

About

a CSS library of classes to simplify the creation of flex-based layouts

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published