Ticket #1868

install/sql/system.sql

@@ -4287,7 +4287,7 @@ INSERT INTO `sys_pages_blocks` (`object`, `cell_id`, `module`, `title_system`, `
 
 ('sys_privacy', 1, 'system', '', '_sys_page_block_title_privacy', 11, 2147483647, 'lang', '_sys_page_lang_block_privacy', 0, 1, 1, 1),
 
-('sys_dashboard', 3, 'system', '', '_sys_page_block_title_profile_stats', 13, 2147483644, 'service', 'a:4:{s:6:"module";s:6:"system";s:6:"method";s:13:"profile_stats";s:6:"params";a:0:{}s:5:"class";s:20:"TemplServiceProfiles";}', 0, 1, 1, 1),
+('sys_dashboard', 3, 'system', '', '_sys_page_block_title_profile_stats', 3, 2147483644, 'service', 'a:4:{s:6:"module";s:6:"system";s:6:"method";s:13:"profile_stats";s:6:"params";a:0:{}s:5:"class";s:20:"TemplServiceProfiles";}', 0, 1, 1, 1),
 
 ('sys_dashboard', 3, 'system', '', '_sys_page_block_title_profile_membership', 11, 2147483647, 'service', 'a:4:{s:6:"module";s:6:"system";s:6:"method";s:18:"profile_membership";s:6:"params";a:0:{}s:5:"class";s:20:"TemplServiceProfiles";}', 0, 1, 0, 0),
 

template/css/default.less

@@ -616,6 +616,39 @@ h3,
     .box-sizing();
 }
 
+
+/* label */
+
+.bx-def-label {
+    .padding-top(@bx-padding-thd);
+    .padding-bottom(@bx-padding-thd);
+    .padding-left(@bx-padding-sec);
+    .padding-right(@bx-padding-sec);
+
+    .radius(@bx-round-corners-radius-label);
+
+    background-color: @bx-color-label;
+    
+    font-size: @bx-font-size-small;
+    
+}
+.bx-def-label,
+.bx-def-label a,
+.bx-def-label .sys-icon {
+    color: @bx-font-color-grayed;
+}
+
+.bx-def-label.menu {
+    background-color: @bx-color-label-menu;
+}
+
+.bx-def-label.menu,
+.bx-def-label.menu a,
+.bx-def-label.menu .sys-icon {
+    color: @bx-font-color-contrasted;
+}
+
+
 /* z-index */
 
 .bx-def-z-index-front {

template/css/general.css

@@ -174,9 +174,13 @@
 
 
 /* --------------- Profile Stats */
-
-.bx-profile-stats .bx-ps-acl span {
-	text-transform: uppercase;
+.bx-profile-stats .bx-def-unit-info-cnt {
+    display: -webkit-flex;
+    display: flex;
+    -webkit-align-items: flex-start;
+    align-items: flex-start;
+    -webkit-flex-direction: column;
+    flex-direction: column;
 }
 
 

template/css/menu.css

@@ -704,8 +704,8 @@ ul.bx-menu-btns-hor li:last-child .bx-btn {
 
 /* --------------- profile stats menu */
 .bx-menu-ver.bx-menu-object-sys_profile_stats li {
-	position: relative;
-	display: -webkit-flex;
+    position: relative;
+    display: -webkit-flex;
     display: flex;
     -webkit-flex-flow: row nowrap;
     flex-flow: row nowrap;
@@ -714,16 +714,15 @@ ul.bx-menu-btns-hor li:last-child .bx-btn {
     -webkit-justify-content: space-between;
     justify-content: space-between;
 
-	margin: 0.625rem 0;
-
-	border-radius: 0;
+    border-width: 0;
+    border-radius: 0;
 }
 .bx-menu-ver.bx-menu-object-sys_profile_stats li a {
-	-webkit-flex-grow: 3;
-	flex-grow: 3;
+    -webkit-flex-grow: 3;
+    flex-grow: 3;
 
-	position: relative;
-	display: -webkit-flex;
+    position: relative;
+    display: -webkit-flex;
     display: flex;
     -webkit-flex-flow: row nowrap;
     flex-flow: row nowrap;
@@ -732,19 +731,12 @@ ul.bx-menu-btns-hor li:last-child .bx-btn {
     -webkit-justify-content: flex-start;
     justify-content: flex-start;
 }
-.bx-menu-ver.bx-menu-object-sys_profile_stats li .bx-menu-addon-cnt {
-	height: 1.5rem;
-
-	border-radius: 1.0rem;
-
-	line-height: 1.4rem;
-}
 .bx-menu-ver.bx-menu-object-sys_profile_stats li img, 
 .bx-menu-ver.bx-menu-object-sys_profile_stats li .sys-icon {
-	display: inline-block;
+    display: inline-block;
     vertical-align: top;
-	width: 1.5rem;
-	height: 1.5rem;
-	line-height: 1.5rem;
-	font-size: 1.5rem;
+    width: 1.5rem;
+    height: 1.5rem;
+    line-height: 1.5rem;
+    font-size: 1.5rem;
 }

template/menu_profile_stats.html

@@ -1,16 +1,16 @@
 <ul class="bx-menu-profile-stats bx-menu-ver bx-menu-object-__object__ bx-clearfix">
     <bx_repeat:menu_items>
-        <li class="bx-def-round-corners bx-def-color-bg-hl-hover __class_add__">
+        <li class="bx-def-round-corners bx-def-border-top bx-def-color-bg-hl-hover __class_add__">
             <a class="bx-def-padding-thd-topbottom bx-def-padding-sec-leftright" href="__link__" target="__target__" onclick="__onclick__">
-				<bx_if:icon><i class="sys-icon __icon__"></i></bx_if:icon>
-				<bx_if:image><img style="background-image:url(__icon_url__)" src="<bx_icon_url:spacer.gif />" /></bx_if:image>
-				<span class="bx-def-margin-sec-left-auto">__title__</span>
+                <bx_if:icon><i class="sys-icon __icon__"></i></bx_if:icon>
+                <bx_if:image><img style="background-image:url(__icon_url__)" src="<bx_icon_url:spacer.gif />" /></bx_if:image>
+                <span class="bx-def-margin-sec-left-auto">__title__</span>
             </a>
             <bx_if:addon>
             	<div class="bx-menu-addon bx-def-padding-thd-topbottom bx-def-padding-sec-right">
-            		<div class="bx-menu-addon-cnt bx-def-padding-sec-leftright bx-def-color-bg-hl">__addon__</div>
-				</div>
-			</bx_if:addon>
+                    <div class="bx-menu-addon-cnt bx-def-label menu">__addon__</div>
+                </div>
+        </bx_if:addon>
         </li>
     </bx_repeat:menu_items>
 </ul>

template/profile_stats.html

@@ -1,15 +1,21 @@
 <div class="bx-profile-stats">
-	<div class="bx-def-unit absolute bx-ps-user">
-	    <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>
-	    <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-bottom"><a href="__profile_url__" title="__profile_title_attr__">__profile_title__</a></div>
-	            <div class="bx-def-unit-line bx-ps-acl"><i class="sys-icon __profile_acl_icon__"></i><span class="bx-def-padding-sec-left">__profile_acl_title__</span></div>
-	            <!--<div class="bx-def-unit-line"><a href="__profile_edit_url__"><bx_text:_sys_edit_profile /></a></div>-->
-	        </div>
-	    </div>
+    <div class="bx-profile-stats-cnt bx-def-padding">
+	<div class="bx-def-unit absolute bx-ps-user bx-def-margin-sec-leftright">
+            <div class="bx-def-unit-cnt">
+                <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>
+                <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"><a href="__profile_url__" title="__profile_title_attr__">__profile_title__</a></div>
+                        <div class="bx-def-unit-line bx-def-margin-sec-top">
+                            <div class="bx-def-label"><i class="sys-icon __profile_acl_icon__"></i><span class="bx-def-padding-sec-left">__profile_acl_title__</span></div>
+                        </div>
+                        <!--<div class="bx-def-unit-line"><a href="__profile_edit_url__"><bx_text:_sys_edit_profile /></a></div>-->
+                    </div>
+                </div>
+            </div>
 	</div>
 	<div class="bx-ps-menu bx-def-margin-top">__menu__</div>
+    </div>
 </div>

template/scripts/BxBaseConfig.php

@@ -35,6 +35,8 @@ class BxBaseConfig extends BxDol implements iBxDolSingleton
             'bx-color-block' => '#fff',
             'bx-color-box' => 'rgba(242, 242, 242, 1.0)',
             'bx-color-box-hover' => 'rgba(242, 242, 242, 0.8)',
+            'bx-color-label' => '#e8e8e8',
+            'bx-color-label-menu' => '#999999',
             'bx-color-sec' => '#f2f2f2',
             'bx-color-hl' => 'rgba(196, 248, 156, 0.2)',
             'bx-color-active' => 'rgba(196, 248, 156, 0.4)',
@@ -56,6 +58,7 @@ class BxBaseConfig extends BxDol implements iBxDolSingleton
             'bx-font-color-contrasted' => '#fff',
 
             'bx-round-corners-radius' => '3px',
+            'bx-round-corners-radius-label' => '4px',
         ),
     );