key: bs-columns
name: $string.bscolumns_name
category: bootstrap
icon: fa fa-columns
instructions: $string.bscolumns_instructions
engine: ejs
template: |
  <div class="container-fluid">
    <div class="row">
      <div class="col-sm-<%=w1%>">
        <p>__LOREM__</p>
      </div>
      <div class="col-sm-<%=12-w1%>">
        <p>__LOREM__</p>
      </div>
    </div>
  </div>
  <p><br></p>
selectors: 
  - div.container-fluid
  - div.row
unwrap: div.row div > *
parameters:
  - name: w1
    title: $string.bscolumns_width
    tip: $string.bscolumns_width_tip
    value: 6
    options:
      - {l: '8%',  v: 1}
      - {l: '16%', v: 2}
      - {l: '25%', v: 3}
      - {l: '33%', v: 4}
      - {l: '42%', v: 5}
      - {l: '50%', v: 6}
      - {l: '58%', v: 7}
      - {l: '66%', v: 8}
      - {l: '75%', v: 9}
      - {l: '83%', v: 10}
      - {l: '92%', v: 11}
    bind:
      getValue: |
        (el) => {
            var col1 = el.querySelector('div.row > div');
            var className = col1 ? col1.className : '';
            var match = /col-sm-(\d+)/.exec(className) || [];
            return parseInt(match[1] || '6', 10);
        }
      setValue: |
        (el, v) => {
            var col1 = el.querySelector('div.row > div');
            var col2 = col1 ? col1.nextElementSibling : null;
            if (col1 && col2) {
              col1.className = 'col-sm-' + v;
              col2.className = 'col-sm-' + (12 - v);
            }
        }
author: Josep Mulet <pep.mulet@gmail.com>
version: 2.1.1
