BB extend column

extend-column-settings.php

<?php


function zestsms_load_custom_bb_extensions() {
	if(class_exists('FLBuilder')) {
    add_filter('fl_builder_register_settings_form', 'zestsms_extend_column_settings', 10, 2);
    add_filter('fl_builder_render_css', 'zestsms_add_column_css', 10, 3);
	}
}
add_action( 'after_setup_theme', 'zestsms_load_custom_bb_extensions' );

function zestsms_extend_column_settings( $form, $id ) {
  if($id == 'col') {
    $column_form = array(
      'tabs' => array(
        'style' => array(
          'sections' => array(
            'bg_color' => array(
              'fields'  => array(
                'expand_bg'  => array(
                  'type'    => 'select',
                  'label'   => __('Expand Background', 'zestsms'),
                  'help'    => 'Expand the background past the container',
                  'default' => '0',
                  'options' => array(
                    '0'   => __('No', 'zestsms'),
                    '1'   => __('Yes', 'zestsms')
                  ),
                  'preview' => 'none'
                )
              )
            )
          )
        )
      )
    );

    $form = array_merge_recursive($form, $column_form);
  }

  return $form;
}

function zestsms_add_column_css( $css, $nodes, $global_settings) {
  $columns = $nodes['columns'];
  foreach($columns as $id=>$col) {
    if($col->settings->expand_bg) :
      $parent = $nodes['groups'][$col->parent]->parent;
      $hex_to_rgb = implode(',', FLBuilderColor::hex_to_rgb($col->settings->bg_color));
      $css .= '
        @media (min-width: '. $global_settings->responsive_breakpoint .'px) {
          .fl-node-'. $parent .',
          .fl-node-'. $col->node .' .fl-col-content {
            position: relative;
          }
          .fl-node-'. $col->node .' .fl-col-content {
            z-index: 2;
          }
          .fl-node-'. $col->node .'::before {
            content: "" !important;
            display: block;
            top: 0;
            bottom: 0;';
            if($col->position == '0') $css .= 'left: 0;';
            $css .= '
            width: '. $col->settings->size .'%;
            height: 100%;
            position: absolute;
            background-color: #'. $col->settings->bg_color .';
          	background-color: rgba('. $hex_to_rgb .', '. $col->settings->bg_opacity/100 .');
          }
        }
      ';
    endif;
  }

  return $css;
}