imporved customizer framework fields styles

Author: Codestar

assets/css/csf.css

@@ -2790,11 +2790,6 @@ This file is generated by `grunt build`, do not edit it by hand.
 .control-section .csf-field .csf-fieldset {
   margin-left: 0;
 }
-.control-section .widget-content .csf-field {
-  margin-right: -10px;
-  margin-left: -10px;
-  padding: 10px 12px;
-}
 .control-section .csf-field-select select {
   width: 100%;
 }
@@ -2818,12 +2813,12 @@ This file is generated by `grunt build`, do not edit it by hand.
   font-size: 12px;
 }
 .control-section .csf-field-content,
-.control-section .csf-field-notice .csf-notice {
+.control-section .csf-field-submessage .csf-submessage {
   margin-right: -15px;
   margin-left: -15px;
   padding: 15px;
 }
-.control-section .csf-fieldset .csf-field-notice .csf-notice,
+.control-section .csf-fieldset .csf-field-submessage .csf-submessage,
 .control-section .csf-fieldset .csf-field-heading,
 .control-section .csf-fieldset .csf-field-subheading {
   margin-left: 0;
@@ -2836,37 +2831,25 @@ This file is generated by `grunt build`, do not edit it by hand.
   float: none;
   width: 100%;
 }
-.control-section .csf-field-sorter .csf-disabled {
-  margin-left: 0;
-  margin-top: 15px;
-}
-.control-section .csf-field-background .csf-field-upload {
-  width: 100%;
-}
-.control-section .csf-field-background .csf-field-upload input {
-  width: 100%;
-  margin: 0;
+.control-section .csf-field-sorter .csf-modules:first-child {
+  padding-right: 0;
+  padding-bottom: 15px;
 }
-.control-section .csf-field-background .csf-field-upload a {
+.control-section .csf-field-background .csf--select {
   width: 100%;
-  text-align: center;
-  margin: 5px 1px;
 }
-.control-section .csf-field-background .csf-pseudo-field {
-  width: 100%;
-  padding: 0 0 5px 0 !important;
+.control-section .csf-field-border select,
+.control-section .csf-field-spacing select,
+.control-section .csf-field-dimensions select {
+  width: auto;
 }
-.control-section .csf-field-background .csf-field-color {
-  top: 0;
+.control-section .csf-field-spinner input {
+  width: 50px;
 }
 .control-section .csf-field-backup .csf-export-data {
   display: none;
 }
-.control-section .csf-field-typography select {
-  width: 100% !important;
-  margin: 0 0 5px 0;
-}
-.control-section .csf-field-fieldset .csf-inner {
+.control-section .csf-field-fieldset .csf-fieldset-content {
   border-color: #e5e5e5;
 }
 .control-section .csf-field-fieldset .csf-field {
@@ -2880,18 +2863,21 @@ This file is generated by `grunt build`, do not edit it by hand.
 }
 .control-section .csf-field-group .csf-field,
 .control-section .csf-field-tabbed .csf-field,
+.control-section .csf-field-sortable .csf-field,
 .control-section .csf-field-repeater .csf-field,
 .control-section .csf-field-accordion .csf-field {
   padding: 10px;
 }
 .control-section .csf-field-group .csf-field .csf-title,
 .control-section .csf-field-tabbed .csf-field .csf-title,
+.control-section .csf-field-sortable .csf-field .csf-title,
 .control-section .csf-field-repeater .csf-field .csf-title,
 .control-section .csf-field-accordion .csf-field .csf-title {
   margin-bottom: 5px;
 }
 .control-section .csf-field-group .csf-field h4,
 .control-section .csf-field-tabbed .csf-field h4,
+.control-section .csf-field-sortable .csf-field h4,
 .control-section .csf-field-repeater .csf-field h4,
 .control-section .csf-field-accordion .csf-field h4 {
   font-size: 12px;

assets/css/csf.min.css

@@ -426,8 +426,6 @@
 
       $this.find('> [data-controller]').each( function() {
 
-        console.log( $this );
-
         var $field      = $(this),
             controllers = $field.data('controller').split('|'),
             conditions  = $field.data('condition').split('|'),
@@ -1144,7 +1142,7 @@
         CSF.helper.inputs_rename( $wrapper.find('.csf-cloneable-item') );
 
         $wrapper.csf_customizer_refresh();
-        $wrapper.csf_customizer_listen(true);
+        $wrapper.csf_customizer_listen({closest: true});
 
       });
 
@@ -1227,7 +1225,6 @@
 
       $sortable.find('.csf--sortable-content').csf_reload_script();
 
-
     });
   };
 

assets/js/csf.js

@@ -53,8 +53,8 @@ public function render() {
         echo '</div>';
       }
 
-      echo '<div class="csf--placeholder'. $hidden_url .'">';
-      echo '<input type="text" name="'. $this->field_name('[url]') .'" value="'. $this->value['url'] .'" class="csf--url" readonly="readonly"'. $this->field_attributes() . $placeholder .' />';
+      echo '<div class="csf--placeholder">';
+      echo '<input type="text" name="'. $this->field_name('[url]') .'" value="'. $this->value['url'] .'" class="csf--url'. $hidden_url .'" readonly="readonly"'. $this->field_attributes() . $placeholder .' />';
       echo '<a href="#" class="button button-primary csf--button" data-library="'. esc_attr( $library ) .'" data-preview-size="'. esc_attr( $args['preview_size'] ) .'">'. $args['button_title'] .'</a>';
       echo '</div>';
 

assets/js/csf.min.js

@@ -65,7 +65,7 @@ protected function render() {
 
     public function render_content() {
 
-      $unallows   = array();
+      $unallows   = array( 'sortable' );
       $complex    = array( 'accordion', 'background', 'backup', 'border', 'button_set', 'checkbox', 'color_group', 'dimensions', 'fieldset', 'group', 'image_select', 'link_color', 'media', 'palette', 'repeater', 'sortable', 'sorter', 'switcher', 'tabbed' );
       $field_id   = ( ! empty( $this->field['id'] ) ) ? $this->field['id'] : '';
       $custom     = ( ! empty( $this->field['customizer'] ) ) ? true : false;

fields/media/media.php

@@ -1273,10 +1273,10 @@
     ),
 
     array(
-      'id'      => 'opt-media-3',
-      'type'    => 'media',
-      'title'   => 'Media without url',
-      'preview' => false,
+      'id'    => 'opt-media-3',
+      'type'  => 'media',
+      'title' => 'Media without url',
+      'url'   => false,
     ),
 
     array(