bainternet · mohamedhamad · Dec 12, 2014 · Dec 12, 2014 · Dec 12, 2014 · Dec 12, 2014
diff --git a/class-usage-demo.php b/class-usage-demo.php
@@ -11,14 +11,14 @@
 //include the main class file
 require_once("meta-box-class/my-meta-box-class.php");
 if (is_admin()){
-  /* 
+  /*
    * prefix of meta keys, optional
    * use underscore (_) at the beginning to make keys hidden, for example $prefix = '_ba_';
    *  you also can make prefix empty to disable it
-   * 
+   *
    */
   $prefix = 'ba_';
-  /* 
+  /*
    * configure your meta box
    */
   $config = array(
@@ -31,17 +31,17 @@
     'local_images'   => false,          // Use local or hosted images (meta box images for add/remove)
     'use_with_theme' => false          //change path if used with theme set to true, false for a plugin or anything else for a custom path(default false).
   );
-  
-  
+
+
   /*
    * Initiate your meta box
    */
   $my_meta =  new AT_Meta_Box($config);
-  
+
   /*
    * Add fields to your meta box
    */
-  
+
   //text field
   $my_meta->addText($prefix.'text_field_id',array('name'=> 'My Text '));
   //textarea field
@@ -59,15 +59,15 @@
   //file upload field with type limitation
   $my_meta->addFile($prefix.'file_pdf_field_id',array('name'=> 'My File limited to PDF Only','ext' =>'pdf','mime_type' => 'application/pdf'));
   /*
-   * Don't Forget to Close up the meta box Declaration 
+   * Don't Forget to Close up the meta box Declaration
    */
-  //Finish Meta Box Declaration 
+  //Finish Meta Box Declaration
   $my_meta->Finish();
 
   /**
    * Create a second metabox
    */
-  /* 
+  /*
    * configure your meta box
    */
   $config2 = array(
@@ -80,17 +80,17 @@
     'local_images'   => false,          // Use local or hosted images (meta box images for add/remove)
     'use_with_theme' => false          //change path if used with theme set to true, false for a plugin or anything else for a custom path(default false).
   );
-  
-  
+
+
   /*
    * Initiate your 2nd meta box
    */
   $my_meta2 =  new AT_Meta_Box($config2);
-  
+
   /*
    * Add fields to your 2nd meta box
    */
-  //add checkboxes list 
+  //add checkboxes list
   $my_meta2->addCheckboxList($prefix.'CheckboxList_field_id',array('checkboxkey1'=>'checkbox Value1','checkboxkey2'=>'checkbox Value2'),array('name'=> 'My checkbox list ', 'std'=> array('checkboxkey2')));
   //date field
   $my_meta2->addDate($prefix.'date_field_id',array('name'=> 'My Date '));
@@ -106,11 +106,11 @@
   $my_meta2->addPosts($prefix.'posts_field_id',array('post_type' => 'post'),array('name'=> 'My Posts '));
   //add Code editor field
   $my_meta2->addCode($prefix.'code_field_id',array(
-    'name'   => 'Code editor Field', 
+    'name'   => 'Code editor Field',
     'syntax' => 'php',
     'theme'  => 'light'
   ));
-    
+
   /*
    * To Create a reapeater Block first create an array of fields
    * use the same functions as above but add true as a last param
@@ -124,12 +124,12 @@
    */
   //repeater block
   $my_meta2->addRepeaterBlock($prefix.'re_',array(
-    'inline'   => true, 
+    'inline'   => true,
     'name'     => 'This is a Repeater Block',
-    'fields'   => $repeater_fields, 
+    'fields'   => $repeater_fields,
     'sortable' => true
   ));
-  
+
   /*
    * To Create a conditinal Block first create an array of fields
    * use the same functions as above but add true as a last param (like the repater block)
@@ -138,7 +138,7 @@
   $Conditinal_fields[] = $my_meta2->addTextarea($prefix.'con_textarea_field_id',array('name'=> 'My Textarea '),true);
   $Conditinal_fields[] = $my_meta2->addCheckbox($prefix.'con_checkbox_field_id',array('name'=> 'My Checkbox '),true);
   $Conditinal_fields[] = $my_meta2->addColor($prefix.'con_color_field_id',array('name'=> 'My color '),true);
-  
+
   /*
    * Then just add the fields to the repeater block
    */
@@ -150,14 +150,14 @@
         'fields' => $Conditinal_fields,
         'std'    => false
       ));
-  
+
   /*
-   * Don't Forget to Close up the meta box Declaration 
+   * Don't Forget to Close up the meta box Declaration
    */
-  //Finish Meta Box Declaration 
+  //Finish Meta Box Declaration
   $my_meta2->Finish();
-  
-  
+
+
   $prefix = "_groupped_";
   $config3 = array(
     'id'             => 'demo_meta_box3',          // meta box id, unique per meta box
@@ -169,14 +169,14 @@
     'local_images'   => false,          // Use local or hosted images (meta box images for add/remove)
     'use_with_theme' => false          //change path if used with theme set to true, false for a plugin or anything else for a custom path(default false).
   );
-  
-  
+
+
   /*
    * Initiate your 3rd meta box
    */
   $my_meta3 =  new AT_Meta_Box($config3);
   //first field of the group has 'group' => 'start' and last field has 'group' => 'end'
-  
+
   //text field
   $my_meta3->addText($prefix.'text_field_id',array('name'=> 'My Text ','group' => 'start'));
   //textarea field
@@ -189,8 +189,8 @@
   $my_meta3->addRadio($prefix.'radio_field_id',array('radiokey1'=>'Radio Value1','radiokey2'=>'Radio Value2'),array('name'=> 'My Radio Filed', 'std'=> array('radionkey2'),'group' => 'end'));
 
   /*
-   * Don't Forget to Close up the meta box Declaration 
+   * Don't Forget to Close up the meta box Declaration
    */
-  //Finish Meta Box Declaration 
+  //Finish Meta Box Declaration
   $my_meta3->Finish();
 }
diff --git a/meta-box-class/css/meta-box.css b/meta-box-class/css/meta-box.css
@@ -8,26 +8,29 @@
 
 /* =Common Rules for all fields.
 ----------------------------------------------- */
-.form-table td.at-field{ border: 1px solid #DDD; padding: 10px 10px 20px; margin: 0px; font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue", Helvetica, Arial, sans-serif; }
-.at-label { margin: 0 0 5px 0; padding: 5px 0 0 0; 
-						font: 20px/31px "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue", Helvetica, Arial, sans-serif; 
+.form-table td.at-field{ border: 1px solid #DDD; padding: 10px 10px 20px; margin: 0px; font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue", Helvetica, Arial, sans-serif; width:0; vertical-align: top;}
+.at-label { margin: 0 0 5px 0; padding: 5px 0 0 0;
+						font: 20px/31px "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue", Helvetica, Arial, sans-serif;
 						text-shadow: rgba(255, 255, 255, 1) 0 1px 0; width: auto; }
-.at-radio-label{ padding-right: 10px; }				
-.at-file-upload-label{ clear: both; margin: 5px 0px 5px 1px; }	
+.at-radio-label{ padding-right: 10px; }
+.at-file-upload-label{ clear: both; margin: 5px 0px 5px 1px; }
+
+table.repeater-table{ width:100%; }
+
 
 
 /* =Form Fields
 ----------------------------------------------- */
 .postbox .at-field input,
-.postbox .at-field textarea { padding: 5px; line-height: 18px; } 
+.postbox .at-field textarea { padding: 5px; line-height: 18px; }
 .postbox .at-field input.at-radio{}
 .postbox .at-field input.at-color{ border: 0px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-right: 10px; min-width: 100px; }
-.at-field input:focus, 
+.at-field input:focus,
 .at-field textarea:focus { background: #fffff8; }
 #wpcontent select.at-select { height: 30px !important; padding: 5px; display: block; min-width: 200px; }
 .at-field .desc-field { color: #AAA; font-style: italic; margin: 5px 0 0 3px !important; font-size: 13px; }
 .at-field .wp_themeSkin table.mceLayout{ border: 1px solid #DFDFDF; }
-#post-body .at-field .wp_themeSkin .mceStatusbar a.mceResize{ top: -25px; } 
+#post-body .at-field .wp_themeSkin .mceStatusbar a.mceResize{ top: -25px; }
 
 /* =Uploaded Images
 ----------------------------------------------- */
@@ -40,7 +43,7 @@
 ----------------------------------------------- */
 .at-upload-button { float: left; clear: both; margin-top: 10px; }
 .at-add-file { float: left; clear: both; margin-top: 10px; }
- 
+
 /* =Time Picker
 ----------------------------------------------- */
 .ui-timepicker-div { font-size: 0.9em; }
@@ -59,4 +62,11 @@
 /* code Editor */
 .CodeMirror{
 	background-color: #fff;
-}
+}
+
+td.at-field .simplePanelImagePreview img{
+  max-width: 100% !important;
+  height: auto;
+}
+
+.conditinal_container table{ width: 100% !important; max-width: 100% !important; }
diff --git a/meta-box-class/js/select2/select2.css b/meta-box-class/js/select2/select2.css
@@ -34,6 +34,9 @@ Version: @@ver@@ Timestamp: @@timestamp@@
     overflow: hidden;
     position: relative;
 
+    min-width: 200px !important;
+    max-width: 100% !important;
+
     border: 1px solid #aaa;
     white-space: nowrap;
     line-height: 26px;
@@ -75,7 +78,7 @@ Version: @@ver@@ Timestamp: @@timestamp@@
 }
 
 .select2-container .select2-choice span {
-    margin-right: 26px;
+    margin-right: 0/* 26px */;
     display: block;
     overflow: hidden;
 
@@ -91,7 +94,7 @@ Version: @@ver@@ Timestamp: @@timestamp@@
     width: 12px;
     height: 12px;
     position: absolute;
-    right: 26px;
+    right: 6px/* 26px */;
     top: 8px;
 
     font-size: 1px;
@@ -442,6 +445,8 @@ disabled look for already selected choices in the results dropdown
     height: 15px;
     padding: 5px;
     margin: 1px 0;
+    max-width: 100% !important;
+    min-width: 200px !important;
 
     font-family: sans-serif;
     font-size: 100%;