Fixed user profile

diff --git a/com.woltlab.wcf/templates/userHeader.tpl b/com.woltlab.wcf/templates/userHeader.tpl
index 9a4b702c1f31e018aa1d3835adc68680f0b3a500..f2c07b578a02f5b011208ff281fb026dfe1aafdc 100644 (file)
--- a/com.woltlab.wcf/templates/userHeader.tpl
+++ b/com.woltlab.wcf/templates/userHeader.tpl
@@ -16,63 +16,64 @@
                        {/if}>
                        
                        <div class="layoutBoundary">
-                               <div class="userAvatar">
+                               <header class="contentHeader">
                                        {if $user->userID == $__wcf->user->userID}
-                                               <a href="{link controller='AvatarEdit'}{/link}" class="jsTooltip" title="{lang}wcf.user.avatar.edit{/lang}">{@$user->getAvatar()->getImageTag(128)}</a>
+                                               <a href="{link controller='AvatarEdit'}{/link}" class="contentHeaderIcon jsTooltip" title="{lang}wcf.user.avatar.edit{/lang}">{@$user->getAvatar()->getImageTag(128)}</a>
                                        {else}
-                                               <span>{@$user->getAvatar()->getImageTag(128)}</span>
-                                       {/if}
-                               </div>
-                               
-                               <header class="contentHeader">
-                                       <h1 class="contentTitle">
-                                               {$user->username}{if $user->banned} <span class="icon icon16 fa-lock jsTooltip jsUserBanned" title="{lang}wcf.user.banned{/lang}"></span>{/if}
-                                       </h1>
-                                       {if MODULE_USER_RANK}
-                                               {if $user->getUserTitle()}
-                                                       <span class="badge userTitleBadge{if $user->getRank() && $user->getRank()->cssClassName} {@$user->getRank()->cssClassName}{/if}">{$user->getUserTitle()}</span>
-                                               {/if}
-                                               {if $user->getRank() && $user->getRank()->rankImage}
-                                                       <span class="userRankImage">{@$user->getRank()->getImage()}</span>
-                                               {/if}
+                                               <span class="contentHeaderIcon">{@$user->getAvatar()->getImageTag(128)}</span>
                                        {/if}
-                               </header>
-                               
-                               <div class="buttonGroupNavigation">
-                                       <ul id="profileButtonContainer" class="buttonGroup">
-                                               {hascontent}
-                                                       <li class="dropdown">
-                                                               <a href="#" class="button dropdownToggle jsTooltip" title="{lang}wcf.user.searchUserContent{/lang}"><span class="icon icon16 fa-search"></span> <span class="invisible">{lang}wcf.user.searchUserContent{/lang}</span></a>
-                                                               <ul class="dropdownMenu">
-                                                                       {content}
-                                                                       {event name='quickSearchItems'}
-                                                                       {/content}
-                                                               </ul>
-                                                       </li>
-                                               {/hascontent}
-                                               
-                                               {if $__wcf->session->getPermission('user.profile.canReportContent')}
-                                                       <li class="jsReportUser jsOnly" data-object-id="{@$user->userID}"><a href="#" title="{lang}wcf.user.profile.report{/lang}" class="button jsTooltip"><span class="icon icon16 fa-exclamation-triangle"></span> <span class="invisible">{lang}wcf.user.profile.report{/lang}</span></a></li>
-                                               {/if}
-                                               
-                                               {if $user->userID != $__wcf->user->userID}
-                                                       {if $user->isAccessible('canViewEmailAddress') || $__wcf->session->getPermission('admin.user.canEditMailAddress')}
-                                                               <li><a class="button jsTooltip" href="mailto:{@$user->getEncodedEmail()}" title="{lang}wcf.user.button.mail{/lang}"><span class="icon icon16 fa-envelope-o"></span> <span class="invisible">{lang}wcf.user.button.mail{/lang}</span></a></li>
-                                                       {elseif $user->isAccessible('canMail') && $__wcf->session->getPermission('user.profile.canMail')}
-                                                               <li><a class="button jsTooltip" href="{link controller='Mail' object=$user}{/link}" title="{lang}wcf.user.button.mail{/lang}"><span class="icon icon16 fa-envelope-o"></span> <span class="invisible">{lang}wcf.user.button.mail{/lang}</span></a></li>
+                                       
+                                       <div class="contentHeaderTitle">
+                                               <h1 class="contentTitle">
+                                                       {$user->username}{if $user->banned} <span class="icon icon16 fa-lock jsTooltip jsUserBanned" title="{lang}wcf.user.banned{/lang}"></span>{/if}
+                                               </h1>
+                                               {if MODULE_USER_RANK}
+                                                       {if $user->getUserTitle()}
+                                                               <span class="badge userTitleBadge{if $user->getRank() && $user->getRank()->cssClassName} {@$user->getRank()->cssClassName}{/if}">{$user->getUserTitle()}</span>
+                                                       {/if}
+                                                       {if $user->getRank() && $user->getRank()->rankImage}
+                                                               <span class="userRankImage">{@$user->getRank()->getImage()}</span>
                                                        {/if}
                                                {/if}
-                                               
-                                               {event name='buttons'}
-                                               
-                                               {if $isAccessible && $__wcf->user->userID != $user->userID && ($__wcf->session->getPermission('admin.user.canBanUser') || $__wcf->session->getPermission('admin.user.canDisableAvatar') || $__wcf->session->getPermission('admin.user.canDisableSignature') || ($__wcf->session->getPermission('admin.general.canUseAcp') && $__wcf->session->getPermission('admin.user.canEditUser')){event name='moderationDropdownPermissions'})}
-                                                       <li class="dropdown">
-                                                               <a href="{link controller='UserEdit' object=$user isACP=true}{/link}" class="button jsTooltip jsUserInlineEditor" title="{lang}wcf.user.moderate{/lang}"><span class="icon icon16 fa-wrench"></span> <span class="invisible">{lang}wcf.user.moderate{/lang}</span></a>
-                                                               <ul class="dropdownMenu"></ul>
-                                                       </li>
-                                               {/if}
-                                       </ul>
-                               </div>
+                                       </div>
+                                       
+                                       
+                                       <div class="buttonGroupNavigation">
+                                               <ul id="profileButtonContainer" class="buttonGroup">
+                                                       {hascontent}
+                                                               <li class="dropdown">
+                                                                       <a href="#" class="button dropdownToggle jsTooltip" title="{lang}wcf.user.searchUserContent{/lang}"><span class="icon icon16 fa-search"></span> <span class="invisible">{lang}wcf.user.searchUserContent{/lang}</span></a>
+                                                                       <ul class="dropdownMenu">
+                                                                               {content}
+                                                                               {event name='quickSearchItems'}
+                                                                               {/content}
+                                                                       </ul>
+                                                               </li>
+                                                       {/hascontent}
+                                                       
+                                                       {if $__wcf->session->getPermission('user.profile.canReportContent')}
+                                                               <li class="jsReportUser jsOnly" data-object-id="{@$user->userID}"><a href="#" title="{lang}wcf.user.profile.report{/lang}" class="button jsTooltip"><span class="icon icon16 fa-exclamation-triangle"></span> <span class="invisible">{lang}wcf.user.profile.report{/lang}</span></a></li>
+                                                       {/if}
+                                                       
+                                                       {if $user->userID != $__wcf->user->userID}
+                                                               {if $user->isAccessible('canViewEmailAddress') || $__wcf->session->getPermission('admin.user.canEditMailAddress')}
+                                                                       <li><a class="button jsTooltip" href="mailto:{@$user->getEncodedEmail()}" title="{lang}wcf.user.button.mail{/lang}"><span class="icon icon16 fa-envelope-o"></span> <span class="invisible">{lang}wcf.user.button.mail{/lang}</span></a></li>
+                                                               {elseif $user->isAccessible('canMail') && $__wcf->session->getPermission('user.profile.canMail')}
+                                                                       <li><a class="button jsTooltip" href="{link controller='Mail' object=$user}{/link}" title="{lang}wcf.user.button.mail{/lang}"><span class="icon icon16 fa-envelope-o"></span> <span class="invisible">{lang}wcf.user.button.mail{/lang}</span></a></li>
+                                                               {/if}
+                                                       {/if}
+                                                       
+                                                       {event name='buttons'}
+                                                       
+                                                       {if $isAccessible && $__wcf->user->userID != $user->userID && ($__wcf->session->getPermission('admin.user.canBanUser') || $__wcf->session->getPermission('admin.user.canDisableAvatar') || $__wcf->session->getPermission('admin.user.canDisableSignature') || ($__wcf->session->getPermission('admin.general.canUseAcp') && $__wcf->session->getPermission('admin.user.canEditUser')){event name='moderationDropdownPermissions'})}
+                                                               <li class="dropdown">
+                                                                       <a href="{link controller='UserEdit' object=$user isACP=true}{/link}" class="button jsTooltip jsUserInlineEditor" title="{lang}wcf.user.moderate{/lang}"><span class="icon icon16 fa-wrench"></span> <span class="invisible">{lang}wcf.user.moderate{/lang}</span></a>
+                                                                       <ul class="dropdownMenu"></ul>
+                                                               </li>
+                                                       {/if}
+                                               </ul>
+                                       </div>
+                               </header>
                        </div>
                </div>
                <div class="userProfileDetails">

diff --git a/wcfsetup/install/files/style/ui/userProfile.scss b/wcfsetup/install/files/style/ui/userProfile.scss
index 20ad3dd8ded0f4e1a7368c3f952854a035d56015..40599d8217666f123c8b772fb3ddd30cba513b3d 100644 (file)
--- a/wcfsetup/install/files/style/ui/userProfile.scss
+++ b/wcfsetup/install/files/style/ui/userProfile.scss
@@ -29,7 +29,13 @@
                }
        }
        
-       .userAvatar {
+       .contentHeader {
+               align-items: center;
+               color: $wcfHeaderText;
+               width: 100%;
+       }
+       
+       .contentHeaderIcon {
                background-color: $wcfHeaderBackground;
                border-radius: 50%;
                left: 0;
@@ -46,9 +52,8 @@
                }
        }
        
-       .contentHeader {
-               color: $wcfHeaderText;
-               flex: 1 1 auto;
+       .contentTitle + span {
+               margin-top: 5px;
        }
        
        .buttonGroupNavigation {