No Password Management

    control-brick

    0.0.1 • Public • Published

    control-brick

    Lego plugin to toggle or radio any dom elements. Useful to create tab-based navigation bar, toolbar, etc.

    Installation

    with component:

    $ component install bredele/control-brick
    

    with nodejs:

    $ component install control-brick
    

    Usage

    First, add the plugin to your view (see lego to know more about views):

    var controller = require('control-brick')({
        handler : function() {
          //do something
      }
    });
    view.add('data-control', controller);

    Basic

    radio:

    <nav class="toolbar" data-control="radio:click .menu, handler">
        <button class="menu">Menu 1</button>
        <button class="menu">Menu 2</button>
        <button></button>
    <nav>

    Add active class to the clicked button (with the class menu). Only one button can be 'active' at a time.

    toggle:

    <ul class="list" data-control="toggle:click .link, handler">
        <li class="link"></li>
        <li></li>
    <ul>

    Toggle active class to the clicked link (with the class link). Serveral links can be 'active' at the same time.

    Control uses events-brick and inherits its behaviour.

    see live example

    Advanced

    You can change the class applied to your radio/toggle elements (active is the default class):

    <nav class="toolbar" data-control="radio:click .menu, clicked handler">
        <button class="menu">Menu 1</button>
        <button class="menu">Menu 2</button>
        <button></button>
    <nav>

    Add clicked class to the clicked button

    License

    MIT

    Install

    npm i control-brick

    DownloadsWeekly Downloads

    1

    Version

    0.0.1

    License

    MIT

    Last publish

    Collaborators

    • bredele