Ticket #3988 - Artificer template (part 5): Author/Cover blocks, Profile covers.

modules/base/profile/classes/BxBaseModProfileTemplate.php

@@ -284,14 +284,20 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
         $sShowData = isset($aParams['show_data']) ? $aParams['show_data'] : '';
         $bShowCover = !isset($aParams['show_cover']) || $aParams['show_cover'] === true;
         $bShowAvatar = !isset($aParams['show_avatar']) || $aParams['show_avatar'] === true;
+        $bShowClickable = !isset($aParams['show_clickable']) || $aParams['show_clickable'] === true; //--- Is available for UseAsBlock appearance only.
         $sAddCode = "";
 
         $bUseAsAuthor = isset($aParams['use_as_author']) && $aParams['use_as_author'] === true;
         $bUseAsBlock = $bUseAsAuthor || (isset($aParams['use_as_block']) && $aParams['use_as_block'] === true);
 
-        if(!$bUseAsAuthor)
+        if($bUseAsAuthor)
+            $sClass .= ' bx-base-author';
+        else
             BxDolTemplate::getInstance()->addInjection('injection_main_class', 'text', 'bx-base-profile-view');
 
+        if($bUseAsBlock && $bShowClickable)
+            $sClass .= ' bx-clickable';
+
         $bProfileViewAllowed = $oModule->checkAllowedView($aData) === CHECK_ACTION_RESULT_ALLOWED;
 
         if($oModule->checkAllowedViewProfileImage($aData) !== CHECK_ACTION_RESULT_ALLOWED)
@@ -471,7 +477,7 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
 
         $aTmplVars = [
             'module' => $this->_oConfig->getName(),
-            'class' => $sClass,
+            'class' => trim($sClass),
             'id' => $aData[$CNF['FIELD_ID']],
             'content_url' => $sUrl,
             'title' => $sTitle,
@@ -506,6 +512,12 @@ class BxBaseModProfileTemplate extends BxBaseModGeneralTemplate
 
         if($bUseAsBlock)
             $aTmplVars = array_merge($aTmplVars, [
+                'bx_if:show_clickable' => [
+                    'condition' => $bShowClickable,
+                    'content' => [
+                        'content_url' => $sUrl
+                    ]
+                ],
                 'bx_if:show_cover' => [
                     'condition' => $bTmplVarsShowCover,
                     'content' => $aTmplVarsShowCover

modules/base/profile/template/cover_block.html

@@ -1,6 +1,6 @@
 <div class="bx-base-profile-cover-block-wrapper">
     <div class="bx-base-pofile-cover-wrapper __class__ bx-def-centered bx-def-box-sizing">
-        <div class="bx-base-pofile-cover bx-def-cover-color-bg bx-def-box-sizing">
+        <div class="bx-base-pofile-cover bx-def-cover-color-bg bx-def-box-sizing"<bx_if:show_clickable> onclick="bx_click_area('__content_url__', event)"</bx_if:show_clickable>>
             <bx_if:show_cover>
                 <div class="bx-base-pofile-cover-image __add_class__">
                     <a class="bx-base-pofile-cover-image bx-def-box-sizing" href="__cover_href__" onclick="$('#__cover_popup_id__').dolPopupImage('__cover_url__', this)">
@@ -14,8 +14,8 @@
                     <bx_if:show_avatar>
                         <div class="bx-base-pofile-cover-thumb __add_class__">
                             <a class="bx-base-pofile-cover-thumb" href="__picture_href__" onclick="$('#__picture_popup_id__').dolPopupImage('__picture_url__', $(this).parent()); event.stopPropagation();">
-                                <img class="bx-base-pofile-unit-thumb bx-def-ava-big bx-def-ava-big-size __img_class__" src="__ava_url__" <bx_if:show_ava_letter> style="display:none" </bx_if:show_ava_letter> />
-                                <p class="bx-base-pofile-unit-thumb bx-def-ava-big bx-def-ava-big-size bx-def-border" style="background-color:rgba(__color__);<bx_if:show_ava_image>display:none</bx_if:show_ava_image>" >__letter__</p>
+                                <img class="bx-base-pofile-unit-thumb bx-def-ava-big bx-def-ava-big-size rounded-full ring-4 mx-auto ring-white dark:ring-gray-900 __img_class__" src="__ava_url__" <bx_if:show_ava_letter> style="display:none" </bx_if:show_ava_letter> />
+                                <p class="bx-base-pofile-unit-thumb bx-def-ava-big bx-def-ava-big-size flex items-center justify-center box-border m-0 rounded-full ring-4 mx-auto ring-white dark:ring-gray-900 text-white font-bold text-5xl __img_class__-placeholder" style="background-color:rgba(__color__);<bx_if:show_ava_image>display:none</bx_if:show_ava_image>" >__letter__</p>
                             </a>
                             <bx_if:show_online>
                                 <div class="bx-base-pofile-unit-online"></div>

modules/base/profile/template/css/main.css

@@ -212,6 +212,9 @@ p.bx-base-pofile-unit-thumb.bx-def-ava-size {
     height: auto;
     margin: 1rem 0 0 0;
 }
+.bx-base-pofile-cover-wrapper.bx-clickable .bx-base-pofile-cover {
+    cursor: pointer;
+}
 
 .bx-media-phone .bx-base-pofile-cover-wrapper {
     padding-left: 0;

modules/boonex/artificer/data/template/mod_groups/cover.html

@@ -1,11 +1,5 @@
 <div class="bx-menu-toolbar-padding pt-16">
     <div class="bx-base-pofile-cover-wrapper __class__ relative">
-        <div class="bx-base-pofile-cover-bg absolute top-0 left-0 w-full h-full dark:hidden">
-            <img src="<bx_image_url:cover-profile.svg />" class="object-cover h-full w-full" />
-        </div>
-        <div class="bx-base-pofile-cover-bg absolute top-0 left-0 w-full h-full hidden dark:block">
-            <img src="<bx_image_url:cover-profile-dark.svg />" class="object-cover h-full w-full" />
-        </div>
         <div class="bx-base-pofile-cover relative">
             <div class="bx-base-pofile-cover-image-wrp relative xl:px-4 overflow-hidden">
                 <div class="bx-base-pofile-cover-image bx-def-page-width relative mx-auto opacity-100 xl:rounded-b-lg <bx_if:show_cover_placeholder>bx-bpci-holder h-32 lg:h-32 bg-gradient-to-b from-green-400 to-green-500</bx_if:show_cover_placeholder><bx_if:show_cover>h-64 lg:h-80</bx_if:show_cover> __add_class__">

modules/boonex/artificer/data/template/mod_profile/cover.html

@@ -1,11 +1,5 @@
 <div class="bx-menu-toolbar-padding pt-16">
     <div class="bx-base-pofile-cover-wrapper __class__ relative">
-        <div class="bx-base-pofile-cover-bg absolute top-0 left-0 w-full h-full dark:hidden">
-            <img src="<bx_image_url:cover-profile.svg />" class="object-cover h-full w-full" />
-        </div>
-        <div class="bx-base-pofile-cover-bg absolute top-0 left-0 w-full h-full hidden dark:block">
-            <img src="<bx_image_url:cover-profile-dark.svg />" class="object-cover h-full w-full" />
-        </div>
         <div class="bx-base-pofile-cover relative">
             <div class="bx-base-pofile-cover-image-wrp relative xl:px-4 overflow-hidden">
                 <div class="bx-base-pofile-cover-image bx-def-page-width relative mx-auto opacity-100 xl:rounded-b-lg <bx_if:show_cover_placeholder>bx-bpci-holder h-32 lg:h-32 bg-gradient-to-b from-blue-400 to-blue-500</bx_if:show_cover_placeholder><bx_if:show_cover>h-64 lg:h-80</bx_if:show_cover> __add_class__">

modules/boonex/artificer/data/template/mod_profile/cover_block.html

@@ -1,12 +1,6 @@
 <div class="bx-base-profile-cover-block-wrapper">
     <div class="bx-base-pofile-cover-wrapper __class__ relative bg-gradient-to-b from-gray-100 to-white dark:from-black dark:to-gray-900 rounded-md">
-        <div class="bx-base-pofile-cover-bg absolute top-0 left-0 w-full h-full dark:hidden rounded-md overflow-hidden">
-            <img src="<bx_image_url:cover-profile.svg />" class="object-cover h-full w-full" />
-        </div>
-        <div class="bx-base-pofile-cover-bg absolute top-0 left-0 w-full h-full hidden dark:block rounded-md overflow-hidden">
-            <img src="<bx_image_url:cover-profile-dark.svg />" class="object-cover h-full w-full" />
-        </div>
-        <div class="bx-base-pofile-cover relative">
+        <div class="bx-base-pofile-cover relative"<bx_if:show_clickable> onclick="bx_click_area('__content_url__', event)"</bx_if:show_clickable>>
             <bx_if:show_cover>
                 <div class="bx-base-pofile-cover-image-wrp relative overflow-hidden">
                     <div class="bx-base-pofile-cover-image relative h-64 lg:h-40 max-w-7xl mx-auto opacity-100 bg-gradient-to-b from-blue-400 to-blue-500 rounded-t-md __add_class__">

modules/boonex/artificer/data/template/mod_profile/css/main.css

@@ -156,15 +156,15 @@ p.bx-base-pofile-unit-thumb.bx-def-ava-big-size {
 
 
 /*--- Entry: Profile Cover ---*/
-.bx-base-pofile-cover-wrapper.bx-no-cover .bx-base-pofile-cover-bg  {
-    height: 50%;
-}
 .bx-base-pofile-cover-wrapper.bx-no-cover .bx-base-pofile-cover-info {
     padding-top: 1rem;
 }
 .bx-base-pofile-cover-wrapper.bx-no-cover .bx-base-pofile-ci-cnt {
     margin-top: 0;
 }
+.bx-base-pofile-cover-wrapper.bx-clickable .bx-base-pofile-cover {
+    cursor: pointer;
+}
 .bx-base-profile-cover-meta .bx-menu-custom.bx-menu-custom-hor {
     -webkit-align-items: center;
     align-items: center;

modules/boonex/artificer/data/template/system/css/common.css

@@ -24,9 +24,6 @@ import url(../../../../../../../template/css/common.css);
 .bx-main.bx-pt-application .bx-menu-toolbar-padding {
     padding-top: 0;
 }
-.bx-main.bx-pt-application .bx-main-content .bx-main-column .bx-def-page-width {
-    width: 100%;
-}
 .bx-main.bx-pt-application .bx-main-column.narrow.bx-mc-narrowed .bx-mc-cnt {
     padding: 0;
 }

modules/boonex/artificer/data/template/system/images/cover-profile-dark.svg

@@ -1 +0,0 @@
-            <svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 1600 900'><rect fill='#111827' width='1600' height='900'/><defs><linearGradient id='g' gradientUnits='objectBoundingBox' x1='0' y1='1' x2='0' y2='0' gradientTransform='rotate(0,0.5,0.5)'><stop  offset='0' stop-color='#111827'/><stop  offset='1' stop-color='#374151'/></linearGradient><path fill='url(#g)' id='s' d='M-1-1v962.99c0 0 83-21.32 133.95 3.07c30.49 14.6 62.26 29.49 94.53 31.22c48.12 2.58 83.83-43.35 134.28-28.36c48.31 14.35 77.41 38.45 127.71 21.62c57.71-19.31 79.67-28.82 134.22-0.47c45.19 23.49 69.44-20.07 112.8-22.78c24.62-1.54 47.65 20.86 71.51 27.14c30.32 7.98 45.34-2.78 73.3-17.86c47.93-25.86 73.7 10.17 120.63 17.73c47.42 7.63 89.49-29.52 138.45-19.47c57.07 11.71 92.9 22.9 150.33 5.31c55.2-16.91 84.9-2.33 138.27 10.43c42.48 10.16 70.72-5.45 110.92-22.69c49.74-21.33 87.42-12.78 135.85 6.42c57.47 22.78 91.63 0.27 148.01-7.13c48.48-6.37 92.85 25.53 140.83 28.72c50.26 3.35 98.07-36.73 147.67-26.18c52.04 11.06 75.93 26.45 127.95 6.28c51.71-20.05 70.96 13.72 118.82 22.69c54.92 10.29 89.44-43.34 145.6-13.92c47.61 24.94 59.53-1.14 103.25-17.59c49-18.44 96.2 32.64 145.07 32c47.46-0.62 88.49-46.72 137.13-33.07c46.15 12.95 70.4 36.99 119.16 20.85c31.56-10.45 62.88-42.89 93.1-22.96C3157 999 3199 981.74 3199 981.74V-1H-1z'/></defs><g  stroke='#000000' stroke-width='0' stroke-opacity='1'><use href='#s' x='-11' y='0'/><use href='#s' x='-850' y='-150'/><use href='#s' x='-1200' y='-300'/><use href='#s' x='-144' y='-450'/><use href='#s' x='-1599' y='-600'/><use href='#s' x='-760' y='-750'/><use href='#s' x='-1336' y='-900'/></g></svg>          

modules/boonex/artificer/data/template/system/images/cover-profile.svg

@@ -1 +0,0 @@
-              <svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 1600 900'><rect fill='#ffffff' width='1600' height='900'/><defs><linearGradient id='g' gradientUnits='objectBoundingBox' x1='0' y1='1' x2='0' y2='0'><stop  offset='0' stop-color='#ffffff'/><stop  offset='1' stop-color='#D1D5DB'/></linearGradient><path fill='url(#g)' id='s' d='M-1-1v962.99c0 0 83-21.32 133.95 3.07c30.49 14.6 62.26 29.49 94.53 31.22c48.12 2.58 83.83-43.35 134.28-28.36c48.31 14.35 77.41 38.45 127.71 21.62c57.71-19.31 79.67-28.82 134.22-0.47c45.19 23.49 69.44-20.07 112.8-22.78c24.62-1.54 47.65 20.86 71.51 27.14c30.32 7.98 45.34-2.78 73.3-17.86c47.93-25.86 73.7 10.17 120.63 17.73c47.42 7.63 89.49-29.52 138.45-19.47c57.07 11.71 92.9 22.9 150.33 5.31c55.2-16.91 84.9-2.33 138.27 10.43c42.48 10.16 70.72-5.45 110.92-22.69c49.74-21.33 87.42-12.78 135.85 6.42c57.47 22.78 91.63 0.27 148.01-7.13c48.48-6.37 92.85 25.53 140.83 28.72c50.26 3.35 98.07-36.73 147.67-26.18c52.04 11.06 75.93 26.45 127.95 6.28c51.71-20.05 70.96 13.72 118.82 22.69c54.92 10.29 89.44-43.34 145.6-13.92c47.61 24.94 59.53-1.14 103.25-17.59c49-18.44 96.2 32.64 145.07 32c47.46-0.62 88.49-46.72 137.13-33.07c46.15 12.95 70.4 36.99 119.16 20.85c31.56-10.45 62.88-42.89 93.1-22.96C3157 999 3199 981.74 3199 981.74V-1H-1z'/></defs><g  stroke='#E5E7EB' stroke-width='0' stroke-opacity='1'><use href='#s' x='-11' y='0'/><use href='#s' x='-850' y='-150'/><use href='#s' x='-1200' y='-300'/><use href='#s' x='-144' y='-450'/><use href='#s' x='-1599' y='-600'/><use href='#s' x='-760' y='-750'/><use href='#s' x='-1336' y='-900'/></g></svg>

modules/boonex/artificer/data/template/system/pt_application.html

@@ -86,7 +86,7 @@
                     </div>
                 </div>
                 <bx_injection:injection_between_content_menu />
-                <div id="bx-content-wrapper">
+                <div id="bx-content-wrapper" class="bx-def-page-width mx-auto">
                     __informer__
                     <div class="bx-page-wrapper mx-auto px-3 md:px-4 lg:px-6 box-border">
                         <div id="bx-content-container" class="bx-content-container">

plugins_public/tailwind/css/tailwind.css

@@ -1169,7 +1169,9 @@
         @apply inline-flex grow-0 space-x-1 w-min
     }
     .bx-badge{
-        @apply space-x-1 w-min opacity-90 hover:opacity-100 active:translate-y-0.5 text-white inline-flex items-center px-1.5 py-0.5  text-xs font-medium rounded-full 
+        @apply inline-flex items-center w-min space-x-1 px-1.5 py-0.5 rounded-full;
+        @apply text-white text-xs font-medium whitespace-nowrap;
+        @apply opacity-90 hover:opacity-100 active:translate-y-0.5
     }
     .sys-icon-image.bx-badge-icon,
     .sys-icon-svg.bx-badge-icon{

template/scripts/BxBaseServices.php

@@ -682,8 +682,8 @@ class BxBaseServices extends BxDol implements iBxDolProfileService
             return '';
 
         return bx_srv($sModuleAuthor, $sMethodGetCover, [$oAuthor->getContentId(), [
-            'class' => 'bx-base-author',
-            'use_as_author' => true
+            'use_as_author' => true,
+            'show_text' => false
         ]]);
     }