Ticket #814

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

@@ -14,11 +14,6 @@
 	display: block;
 }
 
-.bx-base-pofile-unit div {
-    width:136px;
-    width:8.5rem;
-}
-
 .bx-search-result-block {
     text-align:center;
 }

modules/base/profile/template/unit.html

@@ -1,5 +1,12 @@
-
-<div class="bx-base-pofile-unit bx-def-unit bx-def-margin-bottom bx-def-margin-sec-right">
-    <a href="__content_url__"><img class="bx-def-thumb bx-def-thumb-size" src="__thumb_url__" /></a><div class="bx-def-unit-info bx-def-thumb-size-max-height bx-def-padding-sec-left"><a class="bx-def-unit-info-title" href="__content_url__">__title__</a></div>
+<div class="bx-base-pofile-unit bx-def-unit absolute bx-def-margin-bottom bx-def-margin-sec-right">
+    <div class="bx-def-unit-img bx-def-thumb bx-def-thumb-size">
+        <a href="__content_url__"><img class="bx-def-thumb bx-def-thumb-size" src="__thumb_url__" /></a>
+    </div>
+    <div class="bx-def-unit-info bx-def-thumb-size-min-height bx-def-thumb-size-max-height bx-def-thumb-size-left-indent">
+        <div class="bx-def-unit-info-cnt bx-def-box-sizing">
+            <div class="bx-def-unit-line">
+                <a class="bx-def-unit-info-title" href="__content_url__">__title__</a>
+            </div>
+        </div>
+    </div>
 </div>
-

modules/base/text/classes/BxBaseModTextTemplate.php

@@ -42,12 +42,14 @@ class BxBaseModTextTemplate extends BxBaseModGeneralTemplate
         if (!$oProfile)
             return '';
 
+        $sName = $oProfile->getDisplayName();
         $sAddon = $sFuncAuthorAddon ? $this->$sFuncAuthorAddon($aData, $oProfile) : '';
 
         $aVars = array (
             'author_url' => $oProfile->getUrl(),
             'author_thumb_url' => $oProfile->getThumb(),
-            'author_title' => $oProfile->getDisplayName(),
+            'author_title' => $sName,
+            'author_title_attr' => bx_html_attribute($sName),
             'author_desc' => $sFuncAuthorDesc ? $this->$sFuncAuthorDesc($aData) : '',
             'bx_if:addon' => array (
                 'condition' => (bool)$sAddon,

modules/base/text/template/author.html

@@ -1,11 +1,16 @@
-
-<div class="bx-base-text-author bx-def-unit">
-    <a href="__author_url__"><img class="bx-def-thumb bx-def-thumb-size" src="__author_thumb_url__" /></a><div class="bx-def-unit-info bx-def-thumb-size-max-height bx-def-padding-left"><a class="bx-def-unit-info-title" href="__author_url__">__author_title__</a><br /><span class="bx-def-font-grayed bx-def-font-small">__author_desc__</span></div>
+<div class="bx-base-text-author bx-def-unit absolute">
+    <div class="bx-def-unit-img bx-def-thumb bx-def-thumb-size">
+        <a href="__author_url__"><img class="bx-def-thumb bx-def-thumb-size" src="__author_thumb_url__" /></a>
+    </div>
+    <div class="bx-def-unit-info bx-def-thumb-size-min-height bx-def-thumb-size-max-height bx-def-thumb-size-left-indent">
+        <div class="bx-def-unit-info-cnt bx-def-box-sizing">
+            <div class="bx-def-unit-line"><a class="bx-def-unit-info-title" href="__author_url__" title="__author_title_attr__">__author_title__</a></div>
+            <div class="bx-def-unit-line bx-def-font-grayed bx-def-font-small">__author_desc__</div>
+        </div>
+    </div>
 </div>
-
 <bx_if:addon>
     <div class="bx-def-margin-sec-top">
         __content__
     </div>
 </bx_if:addon>
-

modules/boonex/convos/template/messages_previews.html

@@ -1,16 +1,18 @@
-
 <bx_repeat:messages>
-
-<div class="bx-cnv-preview bx-def-margin-top-auto">
-    <div class="bx-cnv-title bx-def-font-h3"><a href="__url__" style="font-weight:__font_weight__;">__text__</a></div>
-    __label__
-
-    <div class="bx-def-unit bx-def-margin-thd-top">
-        <a href="__last_replier_url__" title="__last_replier_title_attr__"><img class="bx-def-icon bx-def-icon-size" src="__last_replier_thumb_url__" /></a><div class="bx-def-unit-info bx-def-thumb-size-max-height bx-def-padding-sec-left bx-def-font-middle">__cmt_text__<div class="bx-def-font-grayed bx-def-font-small">__last_reply_time_and_replier__</div></div>
-    </div>
-</div>
-
+	<div class="bx-cnv-preview bx-def-margin-top-auto">
+	    <div class="bx-cnv-title bx-def-font-h3"><a href="__url__" style="font-weight:__font_weight__;">__text__</a></div>
+	    __label__
+	    <div class="bx-def-unit absolute bx-def-margin-thd-top">
+            <div class="bx-def-unit-img bx-def-icon bx-def-icon-size">
+	           <a href="__last_replier_url__" title="__last_replier_title_attr__"><img class="bx-def-icon bx-def-icon-size" src="__last_replier_thumb_url__" /></a>
+	        </div>   
+            <div class="bx-def-unit-info bx-def-icon-size-min-height bx-def-icon-size-max-height bx-def-icon-size-left-indent bx-def-font-middle">
+                <div class="bx-def-unit-info-cnt bx-def-box-sizing">
+	                <div class="bx-def-unit-line">__cmt_text__</div>
+	                <div class="bx-def-unit-line bx-def-font-grayed bx-def-font-small">__last_reply_time_and_replier__</div>
+                </div>
+            </div>
+	    </div>
+	</div>
 </bx_repeat:messages>
-
 <div class="bx-def-margin-top"><b><a href="__see_all_url__"><bx_text:_bx_cnv_see_all /></a></b></div>
-

template/css/default.less

@@ -461,6 +461,9 @@ h3,
 .bx-def-ava-size-min-height {
     .min-height(@bx-size-avatar);
 }
+.bx-def-ava-size-left-indent {
+    .margin-left(@bx-size-avatar + @bx-margin);
+}
 
 
 .bx-def-thumb-size {
@@ -488,6 +491,9 @@ h3,
 .bx-def-icon-size-min-height {
     .min-height(@bx-size-icon);
 }
+.bx-def-icon-size-left-indent {
+    .margin-left(@bx-size-icon + @bx-margin);
+}
 
 
 .bx-def-unit {
@@ -502,12 +508,30 @@ h3,
     vertical-align:middle;
     .line-height(19px);
 }
+.bx-def-unit.absolute .bx-def-unit-img {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+}
+.bx-def-unit.absolute .bx-def-unit-info {
+    display: -webkit-flex;
+    display: flex;
+    -webkit-align-items: center;
+    align-items: center;
+}
+.bx-def-unit.absolute .bx-def-unit-info-cnt {
+    width: 100%;
+}
 .bx-def-unit-info {
     .box-sizing(border-box);
 
     text-overflow:ellipsis;
     overflow:hidden;
 }
+.bx-def-unit.absolute .bx-def-unit-line {
+    text-overflow:ellipsis;
+    overflow:hidden;
+}
 .bx-def-unit-alert-middle,
 .bx-def-unit-alert {
     display:block;

template/css/media-phone.css

@@ -125,7 +125,8 @@ html {
 
 /* menu.css */
 
-ul.bx-menu-toolbar li a span {
+ul.bx-menu-toolbar li a span.bx-menu-toolbar-item-title,
+#bx-menu-toolbar-2-container ul.bx-menu-toolbar li a span.bx-menu-toolbar-item-title {
     display:none;
 }
 

template/css/menu.css

@@ -196,15 +196,6 @@ ul.bx-menu-main-submenu {
 }
 
 /* --------------- toolbar menu */
-
-#bx-menu-toolbar-1-container .bx-menu-toolbar {
-    float:left;
-}
-
-#bx-menu-toolbar-2-container .bx-menu-toolbar {
-    float:right;
-}
-
 .bx-menu-toolbar {
     list-style:none;
     margin:0 0 0 0;
@@ -270,8 +261,24 @@ ul.bx-menu-toolbar li .sys-icon {
 	padding-top: 3rem;
 }
 
-/* --------------- floating blocks menu */
+#bx-menu-toolbar-1-container .bx-menu-toolbar {
+    float:left;
+}
+
+#bx-menu-toolbar-2-container .bx-menu-toolbar {
+    float:right;
+}
 
+#bx-menu-toolbar-2-container .bx-menu-toolbar .bx-menu-toolbar-item-title {
+	display: inline-block;
+	max-width: 10.0rem;
+
+	white-space: nowrap;
+	text-overflow:ellipsis;
+    overflow:hidden;
+}
+
+/* --------------- floating blocks menu */
 .bx-sliding-menu-close,
 .bx-sliding-menu-close:hover {
     position:absolute;

template/profile_stats.html

@@ -1,7 +1,12 @@
-
-    <div class="bx-def-unit bx-def-margin-bottom">
-        <a href="__profile_url__" title="__profile_title_attr__"><img class="bx-def-ava bx-def-ava-size" src="__profile_ava_url__" /></a><div class="bx-def-unit-info bx-def-ava-size-max-height bx-def-padding-left"><div class="bx-def-font-h2 bx-def-margin-sec-bottom"><a href="__profile_url__" title="__profile_title_attr__">__profile_title__</a></div><a href="__profile_edit_url__"><bx_text:_sys_edit_profile /></a></div>
+<div class="bx-def-unit absolute bx-def-margin-bottom">
+    <div class="bx-def-unit-img bx-def-ava bx-def-ava-size">
+        <a href="__profile_url__" title="__profile_title_attr__"><img class="bx-def-ava bx-def-ava-size" src="__profile_ava_url__" /></a>
     </div>
-
-    __menu__
-
+    <div class="bx-def-unit-info bx-def-ava-size-min-height bx-def-ava-size-max-height bx-def-ava-size-left-indent">
+        <div class="bx-def-unit-info-cnt bx-def-box-sizing">
+            <div class="bx-def-unit-line bx-def-font-h2 bx-def-padding-sec-bottom"><a href="__profile_url__" title="__profile_title_attr__">__profile_title__</a></div>
+            <div class="bx-def-unit-line"><a href="__profile_edit_url__"><bx_text:_sys_edit_profile /></a></div>
+        </div>
+    </div>
+</div>
+__menu__

template/profile_unit.html

@@ -1,3 +1,10 @@
-<div class="bx-def-unit bx-def-margin-bottom bx-def-margin-sec-right">
-    <img class="bx-def-thumb bx-def-thumb-size" src="__thumb_url__" /><div class="bx-def-unit-info bx-def-thumb-size-max-height bx-def-padding-sec-left"><span class="bx-def-unit-info-title">__title__</span></div>
+<div class="bx-def-unit absolute bx-def-margin-bottom bx-def-margin-sec-right">
+    <div class="bx-def-unit-img bx-def-thumb bx-def-thumb-size">
+        <img class="bx-def-thumb bx-def-thumb-size" src="__thumb_url__" />
+    </div>
+    <div class="bx-def-unit-info bx-def-thumb-size-min-height bx-def-thumb-size-max-height bx-def-thumb-size-left-indent">
+        <div class="bx-def-unit-info-cnt bx-def-box-sizing">
+            <div class="bx-def-unit-line bx-def-unit-info-title">__title__</div>
+        </div>
+    </div>
 </div>