Fix alignments for people filters with select2 feature (#5806)

* Fix alignments for people filters with select2 feature

* Hide clear icon from people picker filters

protected/humhub/config/assets-prod.php

@@ -2,7 +2,7 @@
 /**
  * This file is generated by the "yii asset" command.
  * DO NOT MODIFY THIS FILE DIRECTLY.
- * @version 2022-07-05 18:53:28
+ * @version 2022-07-15 11:57:44
  */
 return [
     'app' => [

protected/humhub/modules/user/widgets/PeopleFilterPicker.php

@@ -78,6 +78,7 @@ class PeopleFilterPicker extends BasePicker
         return [
             'data-multiple' => 'false',
             'data-tags' => 'false',
+            'data-clearable' => 'false',
             'size' => '1',
             'class' => 'form-control',
             'style' => 'width:100%',

static/css/select2Theme/select2-humhub.less

@@ -87,10 +87,6 @@
 .select2-container--humhub {
     display: block;
 
-
-
-
-
     /*------------------------------------*\
             #COMMON STYLES
     \*------------------------------------*/
@@ -98,6 +94,7 @@
     .select2-selection {
         .humhub-input-defaults;
         outline: 0;
+        min-height: 35px;
     }
 
     /**

static/js/humhub/humhub.ui.picker.js

@@ -201,14 +201,15 @@ humhub.module('ui.picker', function (module, require, $) {
         }
 
         var placeholder = input.attr('placeholder');
-        if (placeholder.length) {
+        if (typeof placeholder !== 'undefined' && placeholder.length) {
             input.attr('size', placeholder.length);
         }
     };
 
     Picker.template = {
-        selectionWithImage: '{imageNode}<span class="picker-text with-image"></span> <i class="fa fa-times-circle picker-close"></i>',
-        selectionNoImage: '<span class="picker-text no-image"></span> <i class="fa fa-times-circle picker-close"></i>',
+        selectionWithImage: '{imageNode}<span class="picker-text with-image"></span>',
+        selectionNoImage: '<span class="picker-text no-image"></span>',
+        selectionClear: ' <i class="fa fa-times-circle picker-close"></i>',
         result: '<a href="#" tabindex="-1" style="margin-right:5px;">{imageNode} <span class="picker-text"></span></a>',
         resultDisabled: '<a href="#" title="{disabledText}" data-placement="right" tabindex="-1" style="margin-right:5px;opacity: 0.4;cursor:not-allowed">{imageNode} <span class="picker-text"></span></a>',
         imageNode: '<img class="img-rounded" src="{image}" alt="" style="width:24px;height:24px;"  height="24" width="24">',
@@ -302,6 +303,10 @@ humhub.module('ui.picker', function (module, require, $) {
 
         var selectionTmpl = (item.image && !item.new) ? Picker.template.selectionWithImage : Picker.template.selectionNoImage;
 
+        if (this.$.data('clearable') || this.$.data('clearable') === undefined) {
+            selectionTmpl += Picker.template.selectionClear;
+        }
+
         var $result = $(string.template(selectionTmpl, item));
 
         var test = $result.find('.picker-text');