Ticket #2430 - Thumbnail size and alignment refactoring.

modules/base/general/classes/BxBaseModGeneralModule.php

@@ -436,11 +436,12 @@ class BxBaseModGeneralModule extends BxDolModule
             'design_box' => BX_DB_PADDING_DEF,
             'empty_message' => false,
             'ajax_paginate' => true,
+            'class_search_result' => 'SearchResult'
         );
         $aParams = array_merge($aDefaults, $aParams);
-        return $this->_serviceBrowse ($aParams['mode'], $aParams['params'], $aParams['design_box'], $aParams['empty_message'], $aParams['ajax_paginate']);
+        return $this->_serviceBrowse ($aParams['mode'], $aParams['params'], $aParams['design_box'], $aParams['empty_message'], $aParams['ajax_paginate'], $aParams['class_search_result']);
     }
-    
+
     /**
      * @page service Service Calls
      * @section bx_base_general Base General

modules/base/groups/classes/BxBaseModGroupsTemplate.php

@@ -20,7 +20,7 @@ class BxBaseModGroupsTemplate extends BxBaseModProfileTemplate
     {
         parent::__construct($oConfig, $oDb);
 
-        $this->_bLetterAvatar = false;
+        $this->_bLetterAvatar = true;
         $this->_iUnitCharsSummary = 50;
 
         $this->_sUnitClassWithCover .= ' bx-base-groups-unit-with-cover';
@@ -53,6 +53,24 @@ class BxBaseModGroupsTemplate extends BxBaseModProfileTemplate
 
         return $aVars;
     }
+
+    protected function _getUnitSize($aData, $sTemplateName = 'unit.html')
+    {
+        $sResult = '';
+
+        switch($sTemplateName) {
+            case 'unit.html':
+            case 'unit_with_cover.html':
+                $sResult = 'ava';
+                break;
+
+            default:
+                $sResult = $this->_sUnitSizeDefault;
+                break;
+        }
+
+        return $sResult;
+    }
 }
 
 /** @} */

modules/base/groups/template/css/main.css

@@ -7,9 +7,12 @@
     -webkit-border-radius:0.1875rem;
 }
 
-.bx-base-group-unit .bx-def-thumb,
-.bx-base-groups-unit-wo-info .bx-def-thumb,
-.bx-base-groups-unit-with-cover .bx-base-pofile-unit-cover .bx-def-thumb {
+.bx-base-group-unit .bx-def-unit-img img,
+.bx-base-group-unit .bx-def-unit-img p.bx-base-pofile-unit-thumb,
+.bx-base-groups-unit-wo-info .bx-def-unit-img img,
+.bx-base-groups-unit-wo-info .bx-def-unit-img p.bx-base-pofile-unit-thumb,
+.bx-base-groups-unit-with-cover .bx-def-unit-img img,
+.bx-base-groups-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb {
     border-width:0.0625rem;
     border-radius:0.1875rem;
     -moz-border-radius:0.1875rem;

modules/base/groups/template/unit_live_search.html

@@ -1,12 +1,12 @@
 <div class="bx-base-group-unit bx-def-unit bx-def-unit-live-search bx-def-margin-sec-bottom" data-ts="__ts__">
-    <div class="bx-def-unit-img">
+    <div class="bx-def-unit-img bx-def-__size__-size">
         <a class="bx-def-font-align-center" href="__content_url__">
             <bx_if:show_thumb_image>
-                <img class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size" src="__thumb_url__" />
+                <img class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size" src="__thumb_url__" />
             </bx_if:show_thumb_image>
             <bx_if:show_thumb_letter>
-                <p class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size bx-def-border bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
+                <p class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-border bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
             </bx_if:show_thumb_letter>
         </a>
-    </div><div class="bx-def-unit-info bx-def-thumb-size-max-height bx-def-padding-sec-left"><a href="__content_url__">__title__</a><br /><span class="bx-def-font-grayed bx-def-font-small">__module_name__</span></div>
+    </div><div class="bx-def-unit-info bx-def-__size__-size-max-height bx-def-padding-sec-left"><a href="__content_url__">__title__</a><br /><span class="bx-def-font-grayed bx-def-font-small">__module_name__</span></div>
 </div>

modules/base/profile/classes/BxBaseModProfileModule.php

@@ -317,12 +317,12 @@ class BxBaseModProfileModule extends BxBaseModGeneralModule implements iBxDolCon
 
     public function serviceProfileThumb ($iContentId)
     {
-        return $this->_serviceTemplateFunc('thumb', $iContentId);
+        return $this->_serviceTemplateFunc('urlThumb', $iContentId);
     }
 
     public function serviceProfileIcon ($iContentId)
     {
-        return $this->_serviceTemplateFunc('icon', $iContentId);
+        return $this->_serviceTemplateFunc('urlIcon', $iContentId);
     }
 
     public function serviceProfileName ($iContentId)

modules/base/profile/classes/BxBaseModProfileTemplate.php

@@ -93,13 +93,8 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
         // get profile's url
         $sUrl = BX_DOL_URL_ROOT . BxDolPermalinks::getInstance()->permalink('page.php?i=' . $CNF['URI_VIEW_ENTRY'] . '&id=' . $iContentId);
 
-        $sThumbUrl = $sAvatarUrl = '';
-        if($bPublicThumb) {
-            $sThumbUrl = $this->thumb($aData, false);
-            $sAvatarUrl = $this->avatar($aData, false);
-        };
+        $sThumbUrl = $bPublicThumb ? $this->_getUnitThumbUrl($sTemplateSize, $aData, false) : '';
         $bThumbUrl = !empty($sThumbUrl);
-        $bAvatarUrl = !empty($sAvatarUrl);
 
         $aTmplVarsThumbnail = array(
             'bx_if:show_thumb_image' => array(
@@ -109,15 +104,8 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
                     'thumb_url' => $sThumbUrl
                 )
             ),
-            'bx_if:show_avatar_image' => array(
-                'condition' => $bAvatarUrl,
-                'content' => array(
-                    'size' => $sTemplateSize,
-                    'avatar_url' => $sAvatarUrl
-                )
-            ),
             'bx_if:show_thumb_letter' => array(
-                'condition' => !$bThumbUrl && !$bAvatarUrl,
+                'condition' => !$bThumbUrl,
                 'content' => array(
                     'size' => $sTemplateSize,
                     'color' => implode(', ', BxDolTemplate::getColorCode($iProfile, 1.0)),
@@ -130,7 +118,6 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
             ),
             'size' => $sTemplateSize,
             'thumb_url' => $bThumbUrl ? $sThumbUrl : $this->getImageUrl('no-picture-thumb.png'),
-            'avatar_url' => $bAvatarUrl ? $sAvatarUrl : $this->getImageUrl('no-picture-thumb.png'),
         );
 
         $sCoverUrl = $bPublicCover ? $this->urlCoverUnit($aData, false) : '';
@@ -146,7 +133,7 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
             'id' => $iContentId,
             'public' => $bPublic,
             'bx_if:show_thumbnail' => array(
-                'condition' => $bThumbUrl || $bAvatarUrl || $this->_bLetterAvatar,
+                'condition' => $bThumbUrl || $this->_bLetterAvatar,
                 'content' => $aTmplVarsThumbnail
             ),
             'cover_url' => $sCoverUrl,
@@ -333,33 +320,51 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
         BxDolCover::getInstance($this)->set($aVars, $sTemplateName);
     }
 
-	/**
+    /**
      * Get profile picture thumb url
+     * @deprecated since 11.0.0 use BxBaseModProfileTemplate::urlAvatar instead.
      */
     function avatar ($aData, $bSubstituteNoImage = true)
     {
-        $CNF = &$this->_oConfig->CNF;
-        return $this->_image ($CNF['FIELD_PICTURE'], $CNF['OBJECT_IMAGES_TRANSCODER_AVATAR'], 'no-picture-thumb.png', $aData, $bSubstituteNoImage);
+        return $this->urlAvatar($aData, $bSubstituteNoImage);
     }
 
     /**
      * Get profile picture thumb url
+     * @deprecated since 11.0.0 use BxBaseModProfileTemplate::urlThumb instead.
      */
     function thumb ($aData, $bSubstituteNoImage = true)
     {
-        $CNF = &$this->_oConfig->CNF;
-        return $this->_image ($CNF['FIELD_PICTURE'], $CNF['OBJECT_IMAGES_TRANSCODER_THUMB'], 'no-picture-thumb.png', $aData, $bSubstituteNoImage);
+        return $this->urlThumb($aData, $bSubstituteNoImage);
     }
 
     /**
-     * Get profile picture icon url
+     * Get profile picture thumb url
+     * @deprecated since 11.0.0 use BxBaseModProfileTemplate::urlIcon instead.
      */
     function icon ($aData, $bSubstituteNoImage = true)
+    {
+        return $this->urlIcon($aData, $bSubstituteNoImage);
+    }
+
+    /**
+     * Get profile picture icon url
+     */
+    function urlIcon ($aData, $bSubstituteNoImage = true)
     {
         $CNF = &$this->_oConfig->CNF;
         return $this->_image ($CNF['FIELD_PICTURE'], $CNF['OBJECT_IMAGES_TRANSCODER_ICON'], 'no-picture-icon.png', $aData, $bSubstituteNoImage);
     }
 
+    /**
+     * Get profile thumb url
+     */
+    function urlThumb ($aData, $bSubstituteNoImage = true)
+    {
+        $CNF = &$this->_oConfig->CNF;
+        return $this->_image ($CNF['FIELD_PICTURE'], $CNF['OBJECT_IMAGES_TRANSCODER_THUMB'], 'no-picture-thumb.png', $aData, $bSubstituteNoImage);
+    }
+
     /**
      * Get profile avatar url
      */
@@ -396,19 +401,19 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
 
         $sImageUrl = $this->_image($CNF['FIELD_COVER'], $CNF['OBJECT_IMAGES_TRANSCODER_COVER'], '', $aData, false);
         if($sImageUrl === false) {
-        	$iImageId = (int)getParam('sys_site_cover_common');
-        	$oImageTranscoder = BxDolTranscoderImage::getObjectInstance(BX_DOL_TRANSCODER_OBJ_COVER);
-        	if($oImageTranscoder && $iImageId != 0)
-        		$sImageUrl = $oImageTranscoder->getFileUrl($iImageId);
+            $iImageId = (int)getParam('sys_site_cover_common');
+            $oImageTranscoder = BxDolTranscoderImage::getObjectInstance(BX_DOL_TRANSCODER_OBJ_COVER);
+            if($oImageTranscoder && $iImageId != 0)
+                $sImageUrl = $oImageTranscoder->getFileUrl($iImageId);
         }
 
         if($bSubstituteNoImage && !$sImageUrl)
-        	$sImageUrl = $this->getImageUrl('cover.jpg');
+            $sImageUrl = $this->getImageUrl('cover.jpg');
 
-		return $sImageUrl;
+        return $sImageUrl;
     }
 
-	/**
+    /**
      * Get profile cover image url for browse unit
      */
     function urlCoverUnit ($aData, $bSubstituteNoImage = true)
@@ -464,7 +469,7 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
                 $sResult = $this->_sUnitClassShowCase;
                 break;
 
-			case 'unit_wo_info_showcase.html':
+            case 'unit_wo_info_showcase.html':
                 $sResult = $this->_sUnitClassWoInfoShowCase;
                 break;
         }
@@ -488,6 +493,16 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
 
         return $sResult;
     }
+
+    protected function _getUnitThumbUrl($sSize, $aData, $bSubstituteNoImage = true)
+    {
+        $sMethod = 'url' . bx_gen_method_name(str_replace('ava', 'avatar', $sSize), array('_', '-'));
+
+        if(method_exists($this, $sMethod))
+            return $this->$sMethod($aData, $bSubstituteNoImage);
+        else
+            return $this->_getUnitThumbUrl($this->_sUnitSizeDefault, $aData, $bSubstituteNoImage);
+    }
 }
 
 /** @} */

modules/base/profile/template/unit_live_search.html

@@ -1,12 +1,12 @@
 <div class="bx-base-profile-unit bx-def-unit bx-def-unit-live-search bx-def-margin-sec-bottom" data-ts="__ts__">
-    <div class="bx-def-unit-img">
-	    <a class="bx-def-font-align-center" href="__content_url__">
-			<bx_if:show_thumb_image>
-			    <img class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size" src="__thumb_url__" />
-			</bx_if:show_thumb_image>
-			<bx_if:show_thumb_letter>
-			    <p class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size bx-def-border bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
-			</bx_if:show_thumb_letter>
-	    </a>
-    </div><div class="bx-def-unit-info bx-def-thumb-size-max-height bx-def-padding-sec-left"><a href="__content_url__">__title__</a><br /><span class="bx-def-font-grayed bx-def-font-small">__module_name__</span></div>
+    <div class="bx-def-unit-img bx-def-__size__-size">
+        <a class="bx-def-font-align-center" href="__content_url__">
+            <bx_if:show_thumb_image>
+                <img class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size" src="__thumb_url__" />
+            </bx_if:show_thumb_image>
+            <bx_if:show_thumb_letter>
+                <p class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-border bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
+            </bx_if:show_thumb_letter>
+        </a>
+    </div><div class="bx-def-unit-info bx-def-__size__-size-max-height bx-def-padding-sec-left"><a href="__content_url__">__title__</a><br /><span class="bx-def-font-grayed bx-def-font-small">__module_name__</span></div>
 </div>

modules/base/profile/template/unit_with_cover.html

@@ -3,9 +3,9 @@
         <a class="bx-base-pofile-unit-cover bx-def-align-center" style="background-image:url(__cover_url__);" href="__content_url__" onclick="__content_click__">
             <bx_if:show_thumbnail>
                 <div class="bx-def-unit-img bx-def-__size__-size">
-                    <bx_if:show_avatar_image>
-                        <img class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-border bx-def-box-sizing" src="__avatar_url__" />
-                    </bx_if:show_avatar_image>
+                    <bx_if:show_thumb_image>
+                        <img class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-border bx-def-box-sizing" src="__thumb_url__" />
+                    </bx_if:show_thumb_image>
                     <bx_if:show_thumb_letter>
                         <p class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-border bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
                     </bx_if:show_thumb_letter>

modules/boonex/lucid/data/template/bx_channels/css/main.css

@@ -3,59 +3,51 @@
 
 /*--- Unit ---*/
 .bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover a.bx-base-pofile-unit-cover {
-	text-align: left;
+    text-align: left;
 }
-.bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover div.bx-def-unit-img {
-	display: inline-block;
-	vertical-align: middle;
-	width: 5.25rem;
-	height: 5.25rem;
-	margin-left: 1rem;
-}
-.bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb,
+
 .bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-def-unit-img img {
-	display: block;	
-	width: 5rem;
-	height: 5rem;
-	border: 0.125rem solid rgba(255,255,255,1);
-	border-radius: 0.5rem;
-	background-clip: border-box;
-	overflow: hidden;
+    display: block;
 }
 
-.bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb {
-	line-height: 4.7rem;
-	text-align: center;
+.bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb,
+.bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-def-unit-img img {
+    border: 0.125rem solid rgba(255,255,255,1);
+    border-radius: 0.5rem;
+    background-clip: border-box;
+    overflow: hidden;
 }
 
 .bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-def-unit-img img {
-	background-color: #ffffff;
+    background-color: #ffffff;
 }
 
 .bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-base-pofile-unit-title {
-	text-align: left;
+    text-align: left;
 }
 
 .bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-base-pofile-unit-title a {
-	font-weight: 800;
-	font-size: 1.25rem;
-	color: rgba(29, 75, 96, 1.0);
+    font-weight: 800;
+    font-size: 1.25rem;
+    color: rgba(29, 75, 96, 1.0);
 }
 
 .bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom {
-	display: -webkit-flex;
-   	display: flex;
-   	-webkit-align-items: center;
-   	align-items: center;
-	-webkit-justify-content: left;
-	justify-content: left;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-align-items: center;
+    align-items: center;
+    -webkit-justify-content: left;
+    justify-content: left;
 }
+
 .bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom li {
-	-webkit-flex: 0 1 auto; 
-	-ms-flex:  0 1 auto; 
-	flex:  0 1 auto;
+    -webkit-flex: 0 1 auto; 
+    -ms-flex:  0 1 auto; 
+    flex:  0 1 auto;
 }
+
 .bx-base-pofile-unit-with-cover.bx-channels-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom li.bx-menu-item-stretcher {
-	-webkit-flex-grow: 3;
-	flex-grow: 3;
+    -webkit-flex-grow: 3;
+    flex-grow: 3;
 }

modules/boonex/lucid/data/template/bx_channels/unit.html

@@ -2,12 +2,12 @@
     <div class="bx-base-pofile-unit-cnt bx-def-box bx-def-border bx-def-round-corners bx-def-color-bg-box">
 	    <a class="bx-base-pofile-unit-cover bx-def-align-center" style="background-image:url(__cover_url__);" href="__content_url__" onclick="__content_click__">
                 <bx_if:show_thumbnail>
-                    <div class="bx-def-unit-img bx-def-thumb-size">
-                        <bx_if:show_avatar_image>
-                            <img class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size" src="__avatar_url__" />
-                        </bx_if:show_avatar_image>
+                    <div class="bx-def-unit-img bx-def-__size__-size">
+                        <bx_if:show_thumb_image>
+                            <img class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-box-sizing" src="__thumb_url__" />
+                        </bx_if:show_thumb_image>
                         <bx_if:show_thumb_letter>
-                            <p class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
+                            <p class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
                         </bx_if:show_thumb_letter>
                         <bx_if:show_online>
                             <div class="bx-base-pofile-unit-online"></div>

modules/boonex/lucid/data/template/bx_events/css/main.css

@@ -3,59 +3,51 @@
 
 /*--- Unit ---*/
 .bx-base-pofile-unit-with-cover.bx-events-unit-with-cover a.bx-base-pofile-unit-cover {
-	text-align: right;
+    text-align: right;
 }
-.bx-base-pofile-unit-with-cover.bx-events-unit-with-cover div.bx-def-unit-img {
-	display: inline-block;
-	vertical-align: middle;
-	width: 5.25rem;
-	height: 5.25rem;
-	margin-right: 1rem;
-}
-.bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb,
+
 .bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-def-unit-img img {
-	display: block;	
-	width: 5rem;
-	height: 5rem;
-	border: 0.125rem solid rgba(255,255,255,1);
-	border-radius: 0.5rem;
-	background-clip: border-box;
-	overflow: hidden;
+    display: block;
 }
 
-.bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb {
-	line-height: 4.7rem;
-	text-align: center;
+.bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb,
+.bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-def-unit-img img {
+    border: 0.125rem solid rgba(255,255,255,1);
+    border-radius: 0.5rem;
+    background-clip: border-box;
+    overflow: hidden;
 }
 
 .bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-def-unit-img img {
-	background-color: #ffffff;
+    background-color: #ffffff;
 }
 
 .bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-base-pofile-unit-title {
-	text-align: left;
+    text-align: left;
 }
 
 .bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-base-pofile-unit-title a {
-	font-weight: 800;
-	font-size: 1.25rem;
-	color: rgba(29, 75, 96, 1.0);
+    font-weight: 800;
+    font-size: 1.25rem;
+    color: rgba(29, 75, 96, 1.0);
 }
 
 .bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom {
-	display: -webkit-flex;
-   	display: flex;
-   	-webkit-align-items: center;
-   	align-items: center;
-	-webkit-justify-content: left;
-	justify-content: left;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-align-items: center;
+    align-items: center;
+    -webkit-justify-content: left;
+    justify-content: left;
 }
+
 .bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom li {
-	-webkit-flex: 0 1 auto; 
-	-ms-flex:  0 1 auto; 
-	flex:  0 1 auto;
+    -webkit-flex: 0 1 auto; 
+    -ms-flex:  0 1 auto; 
+    flex:  0 1 auto;
 }
+
 .bx-base-pofile-unit-with-cover.bx-events-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom li.bx-menu-item-stretcher {
-	-webkit-flex-grow: 3;
-	flex-grow: 3;
+    -webkit-flex-grow: 3;
+    flex-grow: 3;
 }

modules/boonex/lucid/data/template/bx_events/unit.html

@@ -2,12 +2,12 @@
     <div class="bx-base-pofile-unit-cnt bx-def-box bx-def-border bx-def-round-corners bx-def-color-bg-box">
 	    <a class="bx-base-pofile-unit-cover bx-def-align-center" style="background-image:url(__cover_url__);" href="__content_url__" onclick="__content_click__">
                 <bx_if:show_thumbnail>
-                    <div class="bx-def-unit-img bx-def-thumb-size">
-                        <bx_if:show_avatar_image>
-                            <img class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size" src="__avatar_url__" />
-                        </bx_if:show_avatar_image>
+                    <div class="bx-def-unit-img bx-def-__size__-size">
+                        <bx_if:show_thumb_image>
+                            <img class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-box-sizing" src="__thumb_url__" />
+                        </bx_if:show_thumb_image>
                         <bx_if:show_thumb_letter>
-                            <p class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
+                            <p class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
                         </bx_if:show_thumb_letter>
                         <bx_if:show_online>
                             <div class="bx-base-pofile-unit-online"></div>

modules/boonex/lucid/data/template/bx_groups/css/main.css

@@ -3,59 +3,51 @@
 
 /*--- Unit ---*/
 .bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover a.bx-base-pofile-unit-cover {
-	text-align: left;
+    text-align: left;
 }
-.bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover div.bx-def-unit-img {
-	display: inline-block;
-	vertical-align: middle;
-	width: 5.25rem;
-	height: 5.25rem;
-	margin-left: 1rem;
-}
-.bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb,
+
 .bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-def-unit-img img {
-	display: block;	
-	width: 5rem;
-	height: 5rem;
-	border: 0.125rem solid rgba(255,255,255,1);
-	border-radius: 0.5rem;
-	background-clip: border-box;
-	overflow: hidden;
+    display: block;
 }
 
-.bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb {
-	line-height: 4.7rem;
-	text-align: center;
+.bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb,
+.bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-def-unit-img img {
+    border: 0.125rem solid rgba(255,255,255,1);
+    border-radius: 0.5rem;
+    background-clip: border-box;
+    overflow: hidden;
 }
 
 .bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-def-unit-img img {
-	background-color: #ffffff;
+    background-color: #ffffff;
 }
 
 .bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-base-pofile-unit-title {
-	text-align: left;
+    text-align: left;
 }
 
 .bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-base-pofile-unit-title a {
-	font-weight: 800;
-	font-size: 1.25rem;
-	color: rgba(29, 75, 96, 1.0);
+    font-weight: 800;
+    font-size: 1.25rem;
+    color: rgba(29, 75, 96, 1.0);
 }
 
 .bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom {
-	display: -webkit-flex;
-   	display: flex;
-   	-webkit-align-items: center;
-   	align-items: center;
-	-webkit-justify-content: left;
-	justify-content: left;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-align-items: center;
+    align-items: center;
+    -webkit-justify-content: left;
+    justify-content: left;
 }
+
 .bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom li {
-	-webkit-flex: 0 1 auto; 
-	-ms-flex:  0 1 auto; 
-	flex:  0 1 auto;
+    -webkit-flex: 0 1 auto; 
+    -ms-flex:  0 1 auto; 
+    flex:  0 1 auto;
 }
+
 .bx-base-pofile-unit-with-cover.bx-groups-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom li.bx-menu-item-stretcher {
-	-webkit-flex-grow: 3;
-	flex-grow: 3;
+    -webkit-flex-grow: 3;
+    flex-grow: 3;
 }

modules/boonex/lucid/data/template/bx_groups/unit.html

@@ -2,12 +2,12 @@
     <div class="bx-base-pofile-unit-cnt bx-def-box bx-def-border bx-def-round-corners bx-def-color-bg-box">
 	    <a class="bx-base-pofile-unit-cover bx-def-align-center" style="background-image:url(__cover_url__);" href="__content_url__" onclick="__content_click__">
                 <bx_if:show_thumbnail>
-                    <div class="bx-def-unit-img bx-def-thumb-size">
-                        <bx_if:show_avatar_image>
-                            <img class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size" src="__avatar_url__" />
-                        </bx_if:show_avatar_image>
+                    <div class="bx-def-unit-img bx-def-__size__-size">
+                        <bx_if:show_thumb_image>
+                            <img class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-box-sizing" src="__thumb_url__" />
+                        </bx_if:show_thumb_image>
                         <bx_if:show_thumb_letter>
-                            <p class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
+                            <p class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
                         </bx_if:show_thumb_letter>
                         <bx_if:show_online>
                             <div class="bx-base-pofile-unit-online"></div>

modules/boonex/lucid/data/template/bx_persons/unit_with_cover.html

@@ -1,21 +1,21 @@
 <div class="__class__ bx-def-padding-sec bx-def-box-sizing">
     <div class="bx-base-pofile-unit-cnt bx-def-box bx-def-border bx-def-round-corners bx-def-color-bg-box">
-	    <a class="bx-base-pofile-unit-cover bx-def-align-center" style="background-image:url(__cover_url__);" href="__content_url__" onclick="__content_click__">
-	    	<div class="bx-def-unit-img bx-def-__size__-size">
-	            <bx_if:show_avatar_image>
-	                <img class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-border" src="__avatar_url__" />
-	            </bx_if:show_avatar_image>
-	            <bx_if:show_thumb_letter>
-	                <p class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-border bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
-	            </bx_if:show_thumb_letter>
-	            <bx_if:show_online>
-					<div class="bx-base-pofile-unit-online"></div>
-				</bx_if:show_online>
-			</div>
-	    </a>
-	    <div class="bx-base-pofile-unit-title bx-def-box-sizing bx-def-padding"><a href="__content_url__" onclick="__content_click__">__title__</a></div>
-	    <div class="bx-base-pofile-unit-info">
+        <a class="bx-base-pofile-unit-cover bx-def-align-center" style="background-image:url(__cover_url__);" href="__content_url__" onclick="__content_click__">
+            <div class="bx-def-unit-img bx-def-__size__-size">
+                <bx_if:show_thumb_image>
+                    <img class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-border bx-def-box-sizing" src="__thumb_url__" />
+                </bx_if:show_thumb_image>
+                <bx_if:show_thumb_letter>
+                    <p class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-border bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
+                </bx_if:show_thumb_letter>
+                <bx_if:show_online>
+                    <div class="bx-base-pofile-unit-online"></div>
+                </bx_if:show_online>
+            </div>
+        </a>
+        <div class="bx-base-pofile-unit-title bx-def-box-sizing bx-def-padding"><a href="__content_url__" onclick="__content_click__">__title__</a></div>
+        <div class="bx-base-pofile-unit-info">
             <bx_if:meta><div class="bx-base-general-unit-meta bx-def-box-sizing bx-def-padding-rightbottomleft">__meta__</div></bx_if:meta>
-	    </div>
+        </div>
     </div>
 </div>

modules/boonex/lucid/data/template/bx_spaces/css/main.css

@@ -3,59 +3,51 @@
 
 /*--- Unit ---*/
 .bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover a.bx-base-pofile-unit-cover {
-	text-align: left;
+    text-align: left;
 }
-.bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover div.bx-def-unit-img {
-	display: inline-block;
-	vertical-align: middle;
-	width: 5.25rem;
-	height: 5.25rem;
-	margin-left: 1rem;
-}
-.bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb,
+
 .bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-def-unit-img img {
-	display: block;	
-	width: 5rem;
-	height: 5rem;
-	border: 0.125rem solid rgba(255,255,255,1);
-	border-radius: 0.5rem;
-	background-clip: border-box;
-	overflow: hidden;
+    display: block;
 }
 
-.bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb {
-	line-height: 4.7rem;
-	text-align: center;
+.bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-def-unit-img p.bx-base-pofile-unit-thumb,
+.bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-def-unit-img img {
+    border: 0.125rem solid rgba(255,255,255,1);
+    border-radius: 0.5rem;
+    background-clip: border-box;
+    overflow: hidden;
 }
 
 .bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-def-unit-img img {
-	background-color: #ffffff;
+    background-color: #ffffff;
 }
 
 .bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-base-pofile-unit-title {
-	text-align: left;
+    text-align: left;
 }
 
 .bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-base-pofile-unit-title a {
-	font-weight: 800;
-	font-size: 1.25rem;
-	color: rgba(29, 75, 96, 1.0);
+    font-weight: 800;
+    font-size: 1.25rem;
+    color: rgba(29, 75, 96, 1.0);
 }
 
 .bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom {
-	display: -webkit-flex;
-   	display: flex;
-   	-webkit-align-items: center;
-   	align-items: center;
-	-webkit-justify-content: left;
-	justify-content: left;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-align-items: center;
+    align-items: center;
+    -webkit-justify-content: left;
+    justify-content: left;
 }
+
 .bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom li {
-	-webkit-flex: 0 1 auto; 
-	-ms-flex:  0 1 auto; 
-	flex:  0 1 auto;
+    -webkit-flex: 0 1 auto; 
+    -ms-flex:  0 1 auto; 
+    flex:  0 1 auto;
 }
+
 .bx-base-pofile-unit-with-cover.bx-spaces-unit-with-cover .bx-base-general-unit-meta ul.bx-menu-custom li.bx-menu-item-stretcher {
-	-webkit-flex-grow: 3;
-	flex-grow: 3;
+    -webkit-flex-grow: 3;
+    flex-grow: 3;
 }

modules/boonex/lucid/data/template/bx_spaces/unit.html

@@ -2,12 +2,12 @@
     <div class="bx-base-pofile-unit-cnt bx-def-box bx-def-border bx-def-round-corners bx-def-color-bg-box">
 	    <a class="bx-base-pofile-unit-cover bx-def-align-center" style="background-image:url(__cover_url__);" href="__content_url__" onclick="__content_click__">
                 <bx_if:show_thumbnail>
-                    <div class="bx-def-unit-img bx-def-thumb-size">
-                        <bx_if:show_avatar_image>
-                            <img class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size" src="__avatar_url__" />
-                        </bx_if:show_avatar_image>
+                    <div class="bx-def-unit-img bx-def-__size__-size">
+                        <bx_if:show_thumb_image>
+                            <img class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-box-sizing" src="__thumb_url__" />
+                        </bx_if:show_thumb_image>
                         <bx_if:show_thumb_letter>
-                            <p class="bx-base-pofile-unit-thumb bx-def-thumb bx-def-thumb-size bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
+                            <p class="bx-base-pofile-unit-thumb bx-def-__size__ bx-def-__size__-size bx-def-box-sizing" style="background-color:rgba(__color__)">__letter__</p>
                         </bx_if:show_thumb_letter>
                         <bx_if:show_online>
                             <div class="bx-base-pofile-unit-online"></div>

modules/boonex/organizations/classes/BxOrgsTemplate.php

@@ -31,6 +31,11 @@ class BxOrgsTemplate extends BxBaseModGroupsTemplate
     {
         return BxBaseModProfileTemplate::_getUnitClass($aData, $sTemplateName);
     }
+
+    protected function _getUnitSize($aData, $sTemplateName = 'unit.html')
+    {
+        return BxBaseModProfileTemplate::_getUnitSize($aData, $sTemplateName);
+    }
 }
 
 /** @} */