Nine Parsecs from Milwaukee
    Wondering what’s next for npm?Check out our public roadmap! »

    @mrclark/recyclables
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.5 • Public • Published

    Recyclables

    This library currently only contains an angular directive for adding flexbox properties that are configurable at runtime.

    This library was generated with Angular CLI version 11.0.5.

    Getting Started

    Run npm install @mrclark/recyclables -g to install the library globally. In your @NgModule decorator import the FlexibleDirective. On any element add the attribute recFlexible which will give default flex-box functionality and brings with it 3 other properties recDirection, recJustify, and recAlign.

    Note: Simply adding recFlexible to an element is equivalent to writing: display: flex; justify-content: flex-start; align-items: start;

    Important Note: The Recyclable FlexibleDirection adds the style properties inline, so changing these properties in the css file would require use defining the change !important

    Recyclable is tree shakable!

    Usage

    Add attribute to element

    • <div recFlexible> centent </div>

    Configure the direction, justification and alignment

    • <div recFlexible recDirection='column' recJustify='center' recAlign='center'> centent </div>

    Additionally

    MDN Web Docs has extensive documentation on the flex-box layout model. To understand how it works refer to the documentation.

    Install

    npm i @mrclark/recyclables

    DownloadsWeekly Downloads

    26

    Version

    0.0.5

    License

    none

    Unpacked Size

    24.7 kB

    Total Files

    17

    Last publish

    Collaborators

    • avatar