Style overhaul (WIP)

* container list overhaul
* comment list overhaul
* user profile overhaul
* some minor tweaks

diff --git a/com.woltlab.wcf/templates/__commentJavaScript.tpl b/com.woltlab.wcf/templates/__commentJavaScript.tpl
index 9c4e728b3e93b0dd984368c36e2aba589c51cf9b..3ebedce8ffdfd3c8d26b3a420db1ceb16c0c187f 100644 (file)
--- a/com.woltlab.wcf/templates/__commentJavaScript.tpl
+++ b/com.woltlab.wcf/templates/__commentJavaScript.tpl
@@ -14,7 +14,7 @@
                        'wcf.moderation.report.success': '{lang}wcf.moderation.report.success{/lang}'
                });
                
-               new {if $commentHandlerClass|isset}{@$commentHandlerClass}{else}WCF.Comment.Handler{/if}('{$commentContainerID}', '{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(32)}');
+               new {if $commentHandlerClass|isset}{@$commentHandlerClass}{else}WCF.Comment.Handler{/if}('{$commentContainerID}', '{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(48)}', '{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(32)}');
                {if MODULE_LIKE && $commentList->getCommentManager()->supportsLike() && $__wcf->getSession()->getPermission('user.like.canViewLike')}
                        new WCF.Comment.Like({if $__wcf->getUser()->userID && $__wcf->getSession()->getPermission('user.like.canLike')}1{else}0{/if}, {@LIKE_ENABLE_DISLIKE}, false, {@LIKE_ALLOW_FOR_OWN_CONTENT});
                        new WCF.Comment.Response.Like({if $__wcf->getUser()->userID && $__wcf->getSession()->getPermission('user.like.canLike')}1{else}0{/if}, {@LIKE_ENABLE_DISLIKE}, false, {@LIKE_ALLOW_FOR_OWN_CONTENT});

diff --git a/com.woltlab.wcf/templates/authorSidebarBox.tpl b/com.woltlab.wcf/templates/authorSidebarBox.tpl
index ed99f9e70af7ceae8801eb1cecb2b15bc2ed545b..03f648b4649318794d6df9c44dc6144a3e75faf4 100644 (file)
--- a/com.woltlab.wcf/templates/authorSidebarBox.tpl
+++ b/com.woltlab.wcf/templates/authorSidebarBox.tpl
@@ -18,7 +18,9 @@
                        </div>
                        
                        {if $userProfile->userID}
-                               {include file='userInformationStatistics' user=$userProfile __userStatsClassname='dataList'}
+                               <dl class="plain dataList">
+                                       {include file='userInformationStatistics'}
+                               </dl>
                        {/if}
                </div>
        </div>

diff --git a/com.woltlab.wcf/templates/commentList.tpl b/com.woltlab.wcf/templates/commentList.tpl
index 29947da77ddaa400f942a5dbfc310597473436ed..4a7e8602561b84472d08cc7e1fa8f15485c6fba0 100644 (file)
--- a/com.woltlab.wcf/templates/commentList.tpl
+++ b/com.woltlab.wcf/templates/commentList.tpl
@@ -1,13 +1,13 @@
 {if !$commentManager|isset}{assign var='commentManager' value=$commentList->getCommentManager()}{/if}
 {foreach from=$commentList item=comment}
        <li class="comment jsComment" data-comment-id="{@$comment->commentID}" data-object-type="com.woltlab.wcf.comment" data-like-liked="{if $likeData[comment][$comment->commentID]|isset}{@$likeData[comment][$comment->commentID]->liked}{/if}" data-like-likes="{if $likeData[comment][$comment->commentID]|isset}{@$likeData[comment][$comment->commentID]->likes}{else}0{/if}" data-like-dislikes="{if $likeData[comment][$comment->commentID]|isset}{@$likeData[comment][$comment->commentID]->dislikes}{else}0{/if}" data-like-users='{if $likeData[comment][$comment->commentID]|isset}{ {implode from=$likeData[comment][$comment->commentID]->getUsers() item=likeUser}"{@$likeUser->userID}": { "username": "{$likeUser->username|encodeJSON}" }{/implode} }{else}{ }{/if}' data-can-edit="{if $comment->isEditable()}true{else}false{/if}" data-can-delete="{if $comment->isDeletable()}true{else}false{/if}" data-responses="{@$comment->responses}" data-last-response-time="{@$comment->getLastResponseTime()}" data-user-id="{@$comment->userID}">
-               <div class="box32">
+               <div class="box48">
                        {if $comment->userID}
-                               <a href="{link controller='User' object=$comment->getUserProfile()}{/link}" title="{$comment->getUserProfile()->username}" class="framed">
-                                       {@$comment->getUserProfile()->getAvatar()->getImageTag(32)}
+                               <a href="{link controller='User' object=$comment->getUserProfile()}{/link}" title="{$comment->getUserProfile()->username}">
+                                       {@$comment->getUserProfile()->getAvatar()->getImageTag(48)}
                                </a>
                        {else}
-                               <span class="framed">{@$comment->getUserProfile()->getAvatar()->getImageTag(32)}</span>
+                               {@$comment->getUserProfile()->getAvatar()->getImageTag(48)}
                        {/if}
                        
                        <div>
@@ -20,14 +20,14 @@
                                                                {$comment->username}
                                                        {/if}
                                                        
-                                                       <small> - {@$comment->time|time}</small>
+                                                       <small class="separatorLeft">{@$comment->time|time}</small>
                                                </h3>
                                        </div>
                                        
-                                       <p class="userMessage">{@$comment->getFormattedMessage()}</p>
+                                       <div class="userMessage">{@$comment->getFormattedMessage()}</div>
                                        
                                        <nav class="jsMobileNavigation buttonGroupNavigation">
-                                               <ul class="commentOptions">
+                                               <ul class="buttonList iconList">
                                                        {if $commentManager->supportsReport() && $__wcf->session->getPermission('user.profile.canReportContent')}
                                                                <li class="jsReportCommentComment jsOnly" data-object-id="{@$comment->commentID}"><a href="#" title="{lang}wcf.moderation.report.reportContent{/lang}" class="jsTooltip"><span class="icon icon16 fa-exclamation-triangle"></span> <span class="invisible">{lang}wcf.moderation.report.reportContent{/lang}</span></a></li>
                                                        {/if}
@@ -38,7 +38,7 @@
                                </div>
                                
                                {if $comment|count}
-                                       <ul data-responses="{@$comment->responses}" class="commentResponseList">
+                                       <ul data-responses="{@$comment->responses}" class="containerList commentResponseList">
                                                {include file='commentResponseList' responseList=$comment}
                                        </ul>
                                {/if}

diff --git a/com.woltlab.wcf/templates/commentResponseList.tpl b/com.woltlab.wcf/templates/commentResponseList.tpl
index 86fde39341a1b7a176e05d89363b767a56d4dd81..fe86d2fb19fd994cf86f068ba7e9a33dbd45d52a 100644 (file)
--- a/com.woltlab.wcf/templates/commentResponseList.tpl
+++ b/com.woltlab.wcf/templates/commentResponseList.tpl
@@ -2,11 +2,11 @@
        <li class="commentResponse jsCommentResponse" data-response-id="{@$response->responseID}" data-object-type="com.woltlab.wcf.comment.response" data-like-liked="{if $likeData[response][$response->responseID]|isset}{@$likeData[response][$response->responseID]->liked}{/if}" data-like-likes="{if $likeData[response][$response->responseID]|isset}{@$likeData[response][$response->responseID]->likes}{else}0{/if}" data-like-dislikes="{if $likeData[response][$response->responseID]|isset}{@$likeData[response][$response->responseID]->dislikes}{else}0{/if}" data-like-users='{if $likeData[response][$response->responseID]|isset}{ {implode from=$likeData[response][$response->responseID]->getUsers() item=likeUser}"{@$likeUser->userID}": { "username": "{$likeUser->username|encodeJSON}" }{/implode} }{else}{ }{/if}' data-can-edit="{if $response->isEditable()}true{else}false{/if}" data-can-delete="{if $response->isDeletable()}true{else}false{/if}" data-user-id="{@$response->userID}">
                <div class="box32">
                        {if $response->userID}
-                               <a href="{link controller='User' object=$response->getUserProfile()}{/link}" title="{$response->getUserProfile()->username}" class="framed">
+                               <a href="{link controller='User' object=$response->getUserProfile()}{/link}" title="{$response->getUserProfile()->username}">
                                        {@$response->getUserProfile()->getAvatar()->getImageTag(32)}
                                </a>
                        {else}
-                               <span class="framed">{@$response->getUserProfile()->getAvatar()->getImageTag(32)}</span>
+                               {@$response->getUserProfile()->getAvatar()->getImageTag(32)}
                        {/if}
                        
                        <div class="commentContent commentResponseContent">
@@ -18,14 +18,14 @@
                                                        {$response->username}
                                                {/if}
                                                
-                                               <small> - {@$response->time|time}</small>
+                                               <small class="separatorLeft">{@$response->time|time}</small>
                                        </h3>
                                </div>
                                
-                               <p class="userMessage">{@$response->getFormattedMessage()}</p>
+                               <div class="userMessage">{@$response->getFormattedMessage()}</div>
                                
                                <nav class="jsMobileNavigation buttonGroupNavigation">
-                                       <ul class="commentOptions">
+                                       <ul class="buttonList iconList">
                                                {if $commentManager->supportsReport() && $__wcf->session->getPermission('user.profile.canReportContent')}
                                                        <li class="jsReportCommentResponse jsOnly" data-object-id="{@$response->responseID}"><a href="#" title="{lang}wcf.moderation.report.reportContent{/lang}" class="jsTooltip"><span class="icon icon16 fa-exclamation-triangle"></span> <span class="invisible">{lang}wcf.moderation.report.reportContent{/lang}</span></a></li>
                                                {/if}

diff --git a/com.woltlab.wcf/templates/dashboardBoxSignedInAs.tpl b/com.woltlab.wcf/templates/dashboardBoxSignedInAs.tpl
index 8d5d3e5e76086014f25d3ac863d21c60020d4c4b..bb32c06a99e3c937d7f1c1084628af3a37ce8038 100644 (file)
--- a/com.woltlab.wcf/templates/dashboardBoxSignedInAs.tpl
+++ b/com.woltlab.wcf/templates/dashboardBoxSignedInAs.tpl
@@ -17,7 +17,9 @@
                                {/if}
                        </div>
                        
-                       {include file='userInformationStatistics' user=$__wcf->user}
+                       <dl class="plain dataList">
+                               {include file='userInformationStatistics' user=$__wcf->user}
+                       </dl>   
                </div>
        </div>
 </section>
\ No newline at end of file

diff --git a/com.woltlab.wcf/templates/moderationReport.tpl b/com.woltlab.wcf/templates/moderationReport.tpl
index fb63e5fae2b69015b8b7e9a0f772277636ea3c3b..1d1d3cfd4fdc89b2bddb5768d7d13662fd4421e6 100644 (file)
--- a/com.woltlab.wcf/templates/moderationReport.tpl
+++ b/com.woltlab.wcf/templates/moderationReport.tpl
@@ -109,7 +109,7 @@
                                                {lang}wcf.user.guest{/lang}
                                        {/if}
                                        
-                                       <small> - {@$queue->time|time}</small>
+                                       <small class="separatorLeft">{@$queue->time|time}</small>
                                </h3>
                        </div>
                        

diff --git a/com.woltlab.wcf/templates/recentActivityListItem.tpl b/com.woltlab.wcf/templates/recentActivityListItem.tpl
index 90cdcac8691f70b05ee4e064dd151791870049f6..34f36fb4e8ea095e50771ef98042e0f00c558068 100644 (file)
--- a/com.woltlab.wcf/templates/recentActivityListItem.tpl
+++ b/com.woltlab.wcf/templates/recentActivityListItem.tpl
@@ -5,8 +5,11 @@
                        
                        <div>
                                <div class="containerHeadline">
-                                       <h3><a href="{link controller='User' object=$event->getUserProfile()}{/link}" class="userLink" data-user-id="{@$event->getUserProfile()->userID}">{$event->getUserProfile()->username}</a><small> - {@$event->time|time}</small></h3> 
-                                       <p><strong>{@$event->getTitle()}</strong></p>
+                                       <h3>
+                                               <a href="{link controller='User' object=$event->getUserProfile()}{/link}" class="userLink" data-user-id="{@$event->getUserProfile()->userID}">{$event->getUserProfile()->username}</a>
+                                               <small class="separatorLeft">{@$event->time|time}</small>
+                                       </h3> 
+                                       <p>{@$event->getTitle()}</p>
                                        <small class="containerContentType">{lang}wcf.user.recentActivity.{@$event->getObjectTypeName()}{/lang}</small>
                                </div>
                                

diff --git a/com.woltlab.wcf/templates/searchResultList.tpl b/com.woltlab.wcf/templates/searchResultList.tpl
index f31f855b35174b6e12a6f3e678c71f9b853c6379..7129b03edad8cfd96506931a4bd170ec0d8c4bd5 100644 (file)
--- a/com.woltlab.wcf/templates/searchResultList.tpl
+++ b/com.woltlab.wcf/templates/searchResultList.tpl
@@ -18,23 +18,23 @@
                                                        <h3><a href="{$message->getLink($query)}">{$message->getSubject()}</a></h3>
                                                        
                                                        {if $message->getUserProfile() || $message->getTime() || $message->getContainerTitle()}
-                                                               <p>
+                                                               <ul class="inlineList dotSeparated">
                                                                        {if $message->getUserProfile()}
-                                                                               {if $message->getUserProfile()->userID}
-                                                                                       <a href="{link controller='User' object=$message->getUserProfile()}{/link}" class="userLink" data-user-id="{@$message->getUserProfile()->userID}">{$message->getUserProfile()->username}</a>
-                                                                               {else}
-                                                                                       {$message->getUserProfile()->username}
-                                                                               {/if}
+                                                                               <li>
+                                                                                       {if $message->getUserProfile()->userID}
+                                                                                               <a href="{link controller='User' object=$message->getUserProfile()}{/link}" class="userLink" data-user-id="{@$message->getUserProfile()->userID}">{$message->getUserProfile()->username}</a>
+                                                                                       {else}
+                                                                                               {$message->getUserProfile()->username}
+                                                                                       {/if}
+                                                                               </li>
                                                                        {/if}
-                                                                       
                                                                        {if $message->getTime()}
-                                                                               <small>{if $message->getUserProfile()}- {/if}{@$message->getTime()|time}</small>
+                                                                               <li><small>{@$message->getTime()|time}</small></li>
                                                                        {/if}
-                                                                       
                                                                        {if $message->getContainerTitle()}
-                                                                               <small>{if $message->getUserProfile() || $message->getTime()}- {/if}<a href="{$message->getContainerLink()}">{$message->getContainerTitle()}</a></small>
+                                                                               <li><small><a href="{$message->getContainerLink()}">{$message->getContainerTitle()}</a></small></li>
                                                                        {/if}
-                                                               </p>
+                                                               </ul>
                                                        {/if}
                                                        <small class="containerContentType">{lang}wcf.search.object.{@$message->getObjectTypeName()}{/lang}</small>
                                                </div>

diff --git a/com.woltlab.wcf/templates/team.tpl b/com.woltlab.wcf/templates/team.tpl
index 45e8bbcdf17a032e059b333add70716867ff37d0..76874d044d328b9c8216cdbfd5c2eee0e03a00bc 100644 (file)
--- a/com.woltlab.wcf/templates/team.tpl
+++ b/com.woltlab.wcf/templates/team.tpl
@@ -51,12 +51,12 @@
 </div>
 
 {foreach from=$objects->getTeams() item=team}
-       <section>
-               <div class="containerHeadline">
-                       <h3 id="group{@$team->groupID}">{$team->groupName|language} <span class="badge">{#$team->getMembers()|count}</span></h3>
-                       <p>{$team->groupDescription|language}</p>
-               </div>
-               
+       <section class="section sectionContainerList">
+               <header class="sectionHeader">
+                       <h2 class="sectionTitle" id="group{@$team->groupID}">{$team->groupName|language} <span class="badge">{#$team->getMembers()|count}</span></h2>
+                       <small class="sectionDescription">{$team->groupDescription|language}</small>
+               </header>
+                       
                <ol class="containerList userList">
                        {foreach from=$team->getMembers() item=user}
                                {include file='userListItem'}

diff --git a/com.woltlab.wcf/templates/userBirthdayList.tpl b/com.woltlab.wcf/templates/userBirthdayList.tpl
index 7a685ec80cc2b595760fa6bb20c030fdea28a59b..cc83d402782007dc7ebed2aca0963bcbfeb35e98 100644 (file)
--- a/com.woltlab.wcf/templates/userBirthdayList.tpl
+++ b/com.woltlab.wcf/templates/userBirthdayList.tpl
@@ -23,7 +23,9 @@
                                                        
                                                        {include file='userInformationButtons'}
                                                        
-                                                       {include file='userInformationStatistics'}
+                                                       <dl class="plain inlineDataList">
+                                                               {include file='userInformationStatistics'}
+                                                       </dl>   
                                                </div>
                                        </div>
                                </li>

diff --git a/com.woltlab.wcf/templates/userInformation.tpl b/com.woltlab.wcf/templates/userInformation.tpl
index 62f416322a7aeada868635f718bdaf1cabde9586..03c080ee1b2cd58bc1f262dda0e397c4ec6110ac 100644 (file)
--- a/com.woltlab.wcf/templates/userInformation.tpl
+++ b/com.woltlab.wcf/templates/userInformation.tpl
@@ -2,4 +2,6 @@
 
 {include file='userInformationButtons'}
 
-{include file='userInformationStatistics'}
+<dl class="plain inlineDataList small">
+       {include file='userInformationStatistics'}
+</dl>

diff --git a/com.woltlab.wcf/templates/userInformationHeadline.tpl b/com.woltlab.wcf/templates/userInformationHeadline.tpl
index d11fb4e34a5c8d0bda51ece9b481d8da27752a94..9e116b1796fb53fe9842e67dde758673adb60985 100644 (file)
--- a/com.woltlab.wcf/templates/userInformationHeadline.tpl
+++ b/com.woltlab.wcf/templates/userInformationHeadline.tpl
@@ -1,13 +1,16 @@
-<a href="{link controller='User' object=$user}{/link}" class="username">{$user->username}</a>{if $user->banned} <span class="icon icon16 fa-lock jsTooltip jsUserBanned" title="{lang}wcf.user.banned{/lang}"></span>{/if}
-{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}
-<ul class="dataList userFacts">
+<div class="containerHeadline">
+       <h3><a href="{link controller='User' object=$user}{/link}" class="username">{$user->username}</a>{if $user->banned} <span class="icon icon16 fa-lock jsTooltip jsUserBanned" title="{lang}wcf.user.banned{/lang}"></span>{/if}
+               {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}
+       </h3>
+</div> 
+<ul class="inlineList commaSeparated">
        {if $user->isAccessible('canViewProfile')}
                {if $user->isVisibleOption('gender') && $user->gender}<li>{lang}wcf.user.gender.{if $user->gender == 1}male{else}female{/if}{/lang}</li>{/if}
                {if $user->isVisibleOption('birthday') && $user->getAge()}<li>{@$user->getAge()}</li>{/if}

diff --git a/com.woltlab.wcf/templates/userInformationStatistics.tpl b/com.woltlab.wcf/templates/userInformationStatistics.tpl
index e26cac5a719c7a7a62626f0d365015b67ce7cdd5..08ea41fd8bc8b7c144b60294f33ad43d54d5bbc0 100644 (file)
--- a/com.woltlab.wcf/templates/userInformationStatistics.tpl
+++ b/com.woltlab.wcf/templates/userInformationStatistics.tpl
@@ -1,13 +1,11 @@
-<dl class="plain {if !$__userStatsClassname|empty}{@$__userStatsClassname}{else}inlineDataList{/if} userStats">
-       {event name='statistics'}
-       
-       {if MODULE_LIKE && $user->likesReceived}
-               <dt><a href="{link controller='User' object=$user}{/link}#likes" class="jsTooltip" title="{lang}wcf.like.showLikesReceived{/lang}">{lang}wcf.like.likesReceived{/lang}</a></dt>
-               <dd>{#$user->likesReceived}</dd>
-       {/if}
-       
-       {if $user->activityPoints}
-               <dt><a href="#" class="activityPointsDisplay jsTooltip" title="{lang}wcf.user.activityPoint.showActivityPoints{/lang}" data-user-id="{@$user->userID}">{lang}wcf.user.activityPoint{/lang}</a></dt>
-               <dd>{#$user->activityPoints}</dd>
-       {/if}
-</dl>
\ No newline at end of file
+{event name='statistics'}
+
+{if MODULE_LIKE && $user->likesReceived}
+       <dt><a href="{link controller='User' object=$user}{/link}#likes" class="jsTooltip" title="{lang}wcf.like.showLikesReceived{/lang}">{lang}wcf.like.likesReceived{/lang}</a></dt>
+       <dd>{#$user->likesReceived}</dd>
+{/if}
+
+{if $user->activityPoints}
+       <dt><a href="#" class="activityPointsDisplay jsTooltip" title="{lang}wcf.user.activityPoint.showActivityPoints{/lang}" data-user-id="{@$user->userID}">{lang}wcf.user.activityPoint{/lang}</a></dt>
+       <dd>{#$user->activityPoints}</dd>
+{/if}

diff --git a/com.woltlab.wcf/templates/userProfileLikeItem.tpl b/com.woltlab.wcf/templates/userProfileLikeItem.tpl
index 5550bb525a5ebd91dfdf1544c5b80eda01e1a231..bd2e8e5ce153a98d669cd9ac5f16a78aeaed2309 100644 (file)
--- a/com.woltlab.wcf/templates/userProfileLikeItem.tpl
+++ b/com.woltlab.wcf/templates/userProfileLikeItem.tpl
@@ -5,8 +5,11 @@
                        
                        <div>
                                <div class="containerHeadline">
-                                       <h3><a href="{link controller='User' object=$like->getUserProfile()}{/link}" class="userLink" data-user-id="{@$like->getUserProfile()->userID}">{$like->getUserProfile()->username}</a><small> - {@$like->time|time}</small></h3> 
-                                       <p><strong>{@$like->getTitle()}</strong></p>
+                                       <h3>
+                                               <a href="{link controller='User' object=$like->getUserProfile()}{/link}" class="userLink" data-user-id="{@$like->getUserProfile()->userID}">{$like->getUserProfile()->username}</a>
+                                               <small class="separatorLeft">{@$like->time|time}</small>
+                                       </h3> 
+                                       <p>{@$like->getTitle()}</p>
                                        <small class="containerContentType">{lang}wcf.like.objectType.{@$like->getObjectTypeName()}{/lang}</small>
                                </div>
                                

diff --git a/com.woltlab.wcf/templates/userSidebar.tpl b/com.woltlab.wcf/templates/userSidebar.tpl
index e642c81b635c34a30ddbb332fd50231f2fa2f45c..17ac5f44be93fabb53c71896412781cec292199d 100644 (file)
--- a/com.woltlab.wcf/templates/userSidebar.tpl
+++ b/com.woltlab.wcf/templates/userSidebar.tpl
@@ -115,11 +115,11 @@
 
 {if !$user->isProtected()}
        {if $followingCount}
-               <section>
-                       <h1>{lang}wcf.user.profile.following{/lang} <span class="badge">{#$followingCount}</span></h1>
+               <section class="box">
+                       <h2 class="boxTitle">{lang}wcf.user.profile.following{/lang} <span class="badge">{#$followingCount}</span></h2>
                        
-                       <div>
-                               <ul class="framedIconList">
+                       <div class="boxContent">
+                               <ul class="userAvatarList">
                                        {foreach from=$following item=followingUser}
                                                <li><a href="{link controller='User' object=$followingUser}{/link}" title="{$followingUser->username}" class="framed jsTooltip">{@$followingUser->getAvatar()->getImageTag(48)}</a></li>
                                        {/foreach}
@@ -133,11 +133,11 @@
        {/if}
        
        {if $followerCount}
-               <section>
-                       <h1>{lang}wcf.user.profile.followers{/lang} <span class="badge">{#$followerCount}</span></h1>
+               <section class="box">
+                       <h2 class="boxTitle">{lang}wcf.user.profile.followers{/lang} <span class="badge">{#$followerCount}</span></h2>
                        
-                       <div>
-                               <ul class="framedIconList">
+                       <div class="boxContent">
+                               <ul class="userAvatarList">
                                        {foreach from=$followers item=follower}
                                                <li><a href="{link controller='User' object=$follower}{/link}" title="{$follower->username}" class="framed jsTooltip">{@$follower->getAvatar()->getImageTag(48)}</a></li>
                                        {/foreach}
@@ -151,11 +151,11 @@
        {/if}
        
        {if $visitorCount}
-               <section>
-                       <h1>{lang}wcf.user.profile.visitors{/lang} <span class="badge">{#$visitorCount}</span></h1>
+               <section class="box">
+                       <h2 class="boxTitle">{lang}wcf.user.profile.visitors{/lang} <span class="badge">{#$visitorCount}</span></h2>
                        
-                       <div>
-                               <ul class="framedIconList">
+                       <div class="boxContent">
+                               <ul class="userAvatarList">
                                        {foreach from=$visitors item=visitor}
                                                <li><a href="{link controller='User' object=$visitor}{/link}" title="{$visitor->username} ({@$visitor->time|plainTime})" class="framed jsTooltip">{@$visitor->getAvatar()->getImageTag(48)}</a></li>
                                        {/foreach}

diff --git a/com.woltlab.wcf/templates/usersOnlineList.tpl b/com.woltlab.wcf/templates/usersOnlineList.tpl
index 0eb0fade181e706dbedca3517b5810a48974a04b..d9410e17f9da09638f03455d15c0fd14abe5ed90 100644 (file)
--- a/com.woltlab.wcf/templates/usersOnlineList.tpl
+++ b/com.woltlab.wcf/templates/usersOnlineList.tpl
@@ -98,13 +98,13 @@
 {foreach from=$objects item=user}
        {capture assign=locationData}
                <p>
-                       {if $user->getLocation()}{@$user->getLocation()}{else}{lang}wcf.user.usersOnline.location.unknown{/lang}{/if} <small>- {@$user->lastActivityTime|time}</small>
+                       {if $user->getLocation()}{@$user->getLocation()}{else}{lang}wcf.user.usersOnline.location.unknown{/lang}{/if} <small class="separatorLeft">{@$user->lastActivityTime|time}</small>
                </p>
        {/capture}
        
        {capture assign=sessionData}
                {if $__wcf->session->getPermission('admin.user.canViewIpAddress')}
-                       <dl class="plain inlineDataList">
+                       <dl class="plain inlineDataList small">
                                <dt>{lang}wcf.user.usersOnline.ipAddress{/lang}</dt>
                                <dd title="{$user->getFormattedIPAddress()}">{$user->getFormattedIPAddress()|truncate:30}</dd>
                                
@@ -124,17 +124,19 @@
                                        <a href="{link controller='User' object=$user}{/link}" title="{$user->username}" class="framed">{@$user->getAvatar()->getImageTag(48)}</a>
                                        
                                        <div class="details userInformation">
-                                               <a href="{link controller='User' object=$user}{/link}" class="username">{@$user->getFormattedUsername()}</a>
-                                               {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}
-                                               
-                                               {@$locationData}
+                                               <div class="containerHeadline">
+                                                       <h3><a href="{link controller='User' object=$user}{/link}" class="username">{@$user->getFormattedUsername()}</a>
+                                                               {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}
+                                                       </h3>
+                                                       {@$locationData}
+                                               </div>
                                                
                                                {@$sessionData}
                                                
@@ -150,7 +152,7 @@
                {capture append=robotsOnlineList}
                        <li>
                                <div class="box48">
-                                       <p class="framed"><img src="{$__wcf->getPath()}images/avatars/avatar-spider-default.svg" alt="" class="icon48" /></p>
+                                       <div class="framed"><img src="{$__wcf->getPath()}images/avatars/avatar-spider-default.svg" alt="" class="icon48" /></div>
                                        
                                        <div class="details userInformation">
                                                <div class="containerHeadline">
@@ -170,7 +172,7 @@
                {capture append=guestsOnlineList}
                        <li>
                                <div class="box48">
-                                       <p class="framed"><img src="{$__wcf->getPath()}images/avatars/avatar-default.svg" alt="" class="icon48" /></p>
+                                       <div class="framed"><img src="{$__wcf->getPath()}images/avatars/avatar-default.svg" alt="" class="icon48" /></div>
                                        
                                        <div class="details userInformation">
                                                <div class="containerHeadline">

diff --git a/wcfsetup/install/files/acp/templates/pageHeaderUser.tpl b/wcfsetup/install/files/acp/templates/pageHeaderUser.tpl
index 329db54f37ed00b29107f74ae84326526517f36c..844a40721328a451278763e1c50876c8f234e4d2 100644 (file)
--- a/wcfsetup/install/files/acp/templates/pageHeaderUser.tpl
+++ b/wcfsetup/install/files/acp/templates/pageHeaderUser.tpl
@@ -2,16 +2,32 @@
        <ul class="userPanelItems">
                {if $__wcf->user->userID}
                        <!-- user menu -->
-                       <li id="userMenu">
-                               {* TODO *}
-                               <a class="framed" href="{link controller='User' object=$__wcf->user}{/link}">{*@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(32)*} <span>{lang}wcf.user.userNote{/lang}</span></a>
+                       <li id="userMenu" class="dropdown">
+                               <a class="dropdownToggle framed" data-toggle="userMenu">{if PACKAGE_ID}{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(32)} {/if}{lang}wcf.user.userNote{/lang}</a>
+                               <ul class="dropdownMenu">
+                                       {if PACKAGE_ID > 1}
+                                               <li><a href="{link controller='User' object=$__wcf->user forceFrontend=true}{/link}" class="box32">
+                                                               <div class="framed">{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(32)}</div>
+                                                               
+                                                               <div class="containerHeadline">
+                                                                       <h3>{$__wcf->user->username}</h3>
+                                                                       <small>{lang}wcf.user.myProfile{/lang}</small>
+                                                               </div>
+                                                       </a></li>
+                                               {if $__wcf->getUserProfileHandler()->canEditOwnProfile()}<li><a href="{link controller='User' object=$__wcf->user forceFrontend=true}editOnInit=true#about{/link}">{lang}wcf.user.editProfile{/lang}</a></li>{/if}
+                                               <li><a href="{link controller='Settings' forceFrontend=true}{/link}">{lang}wcf.user.menu.settings{/lang}</a></li>
+                                               
+                                               {event name='userMenuItems'}
+                                               
+                                               <li class="dropdownDivider"></li>
+                                       {/if}
+                                       <li><a href="{link controller='Logout'}t={@SECURITY_TOKEN}{/link}" onclick="WCF.System.Confirmation.show('{lang}wcf.user.logout.sure{/lang}', $.proxy(function (action) { if (action == 'confirm') window.location.href = $(this).attr('href'); }, this)); return false;">{lang}wcf.user.logout{/lang}</a></li>
+                               </ul>
                        </li>
                        
-                       <li><a href="{link controller='Settings'}{/link}" class="noJsOnly" style="display: none"><span class="icon icon16 fa-cogs"></span> <span>{lang}wcf.user.menu.settings{/lang}</span></a></li>
-                       
                        {if PACKAGE_ID}
                                <li id="jumpToPage" class="dropdown">
-                                       <a href="{link forceFrontend=true}{/link}" class="dropdownToggle" data-toggle="jumpToPage"><span class="icon icon16 fa-home"></span> <span>{lang}wcf.global.jumpToPage{/lang}</span></a>
+                                       <a href="{link forceFrontend=true}{/link}" class="dropdownToggle" data-toggle="jumpToPage"><span class="icon icon32 fa-home"></span> <span>{lang}wcf.global.jumpToPage{/lang}</span></a>
                                        <ul class="dropdownMenu">
                                                {foreach from=$__wcf->getPageMenu()->getMenuItems('header') item=_menuItem}
                                                        <li><a href="{$_menuItem->getProcessor()->getLink()}">{lang}{$_menuItem->menuItem}{/lang}</a></li>
@@ -21,13 +37,13 @@
                                
                                {if $__wcf->session->getPermission('admin.system.package.canUpdatePackage') && $__wcf->getAvailableUpdates()}
                                        <li>
-                                               <a href="{link controller='PackageUpdate'}{/link}"><span class="icon icon16 fa-refresh"></span> <span>{lang}wcf.acp.package.updates{/lang}</span> <span class="badge badgeInverse">{#$__wcf->getAvailableUpdates()}</span></a>
+                                               <a href="{link controller='PackageUpdate'}{/link}"><span class="icon icon32 fa-refresh"></span> <span>{lang}wcf.acp.package.updates{/lang}</span> <span class="badge badgeInverse">{#$__wcf->getAvailableUpdates()}</span></a>
                                        </li>
                                {/if}
                        {/if}
                        
                        <li id="woltlab" class="dropdown">
-                               <a class="dropdownToggle" data-toggle="woltlab"><span class="icon icon16 fa-info"></span> <span>WoltLab&reg;</span></a>
+                               <a class="dropdownToggle" data-toggle="woltlab"><span class="icon icon32 fa-info"></span> <span>WoltLab&reg;</span></a>
                                
                                <ul class="dropdownMenu">
                                        <li><a class="externalURL" href="{@$__wcf->getPath()}acp/dereferrer.php?url={"https://www.woltlab.com"|rawurlencode}"{if EXTERNAL_LINK_TARGET_BLANK} target="_blank"{/if}>{lang}wcf.acp.index.woltlab.website{/lang}</a></li>
@@ -39,9 +55,5 @@
                {/if}
                
                {event name='menuItems'}
-               
-               {if $__wcf->user->userID}
-                       <li><a href="{link controller='Logout'}t={@SECURITY_TOKEN}{/link}" class="noJsOnly" style="display: none"><span class="icon icon16 fa-sign-out"></span> <span>{lang}wcf.user.logout{/lang}</span></a></li>
-               {/if}
        </ul>
 </nav>
\ No newline at end of file

diff --git a/wcfsetup/install/files/js/WCF.Comment.js b/wcfsetup/install/files/js/WCF.Comment.js
index 470efcae6ef5a307fa7caa0d0050b7f2ac971ddb..c9cd72fa1d978361ad66f5018f15a18fcd56515c 100644 (file)
--- a/wcfsetup/install/files/js/WCF.Comment.js
+++ b/wcfsetup/install/files/js/WCF.Comment.js
@@ -74,11 +74,17 @@ WCF.Comment.Handler = Class.extend({
        _responses: { },
        
        /**
-        * user's avatar
+        * user's avatar (48px version)
         * @var string
         */
        _userAvatar: '',
        
+       /**
+        * user's avatar (32px version)
+        * @var string
+        */
+       _userAvatarSmall: '',
+       
        /**
         * data of the comment the active guest user is about to create
         * @var object
@@ -96,8 +102,9 @@ WCF.Comment.Handler = Class.extend({
         * 
         * @param       string          containerID
         * @param       string          userAvatar
+        * @param       string          userAvatarSmall
         */
-       init: function(containerID, userAvatar) {
+       init: function(containerID, userAvatar, userAvatarSmall) {
                this._commentAdd = null;
                this._commentButtonList = { };
                this._comments = { };
@@ -107,6 +114,7 @@ WCF.Comment.Handler = Class.extend({
                this._loadNextResponses = { };
                this._responses = { };
                this._userAvatar = userAvatar;
+               this._userAvatarSmall = userAvatarSmall;
                
                this._container = $('#' + $.wcfEscapeID(this._containerID));
                if (!this._container.length) {
@@ -138,7 +146,7 @@ WCF.Comment.Handler = Class.extend({
        _handleLoadNextComments: function() {
                if (this._displayedComments < this._container.data('comments')) {
                        if (this._loadNextComments === null) {
-                               this._loadNextComments = $('<li class="commentLoadNext"><button class="small">' + WCF.Language.get('wcf.comment.more') + '</button></li>').appendTo(this._container);
+                               this._loadNextComments = $('<li class="commentLoadNext showMore"><button class="small">' + WCF.Language.get('wcf.comment.more') + '</button></li>').appendTo(this._container);
                                this._loadNextComments.children('button').click($.proxy(this._loadComments, this));
                        }
                        
@@ -248,7 +256,7 @@ WCF.Comment.Handler = Class.extend({
                        if (!$insertAfter.length) $insertAfter = $comment.find('.commentContent');
                        
                        var $container = $('<div class="commentOptionContainer" />').hide().insertAfter($insertAfter);
-                       self._commentButtonList[$commentID] = $('<ul />').appendTo($container);
+                       self._commentButtonList[$commentID] = $('<ul class="inlineList dotSeparated" />').appendTo($container);
                        
                        self._handleLoadNextResponses($commentID);
                        self._initComment($commentID, $comment);
@@ -325,7 +333,7 @@ WCF.Comment.Handler = Class.extend({
         */
        _initAddComment: function() {
                // create UI
-               this._commentAdd = $('<li class="box32 jsCommentAdd"><span class="framed">' + this._userAvatar + '</span><div /></li>').prependTo(this._container);
+               this._commentAdd = $('<li class="box48 jsCommentAdd">' + this._userAvatar + '<div /></li>').prependTo(this._container);
                var $inputContainer = this._commentAdd.children('div');
                var $input = $('<textarea placeholder="' + WCF.Language.get('wcf.comment.add') + '" maxlength="65535" class="long" />').appendTo($inputContainer).flexible();
                $('<button class="small">' + WCF.Language.get('wcf.global.button.submit') + '</button>').click($.proxy(this._save, this)).appendTo($inputContainer);
@@ -342,7 +350,7 @@ WCF.Comment.Handler = Class.extend({
        _initAddResponse: function(commentID, comment) {
                var $placeholder = $('<li class="jsCommentShowAddResponse"><a>' + WCF.Language.get('wcf.comment.button.response.add') + '</a></li>').data('commentID', commentID).click($.proxy(this._showAddResponse, this)).appendTo(this._commentButtonList[commentID]);
                
-               var $listItem = $('<div class="box32 commentResponseAdd jsCommentResponseAdd"><span class="framed">' + this._userAvatar + '</span><div /></div>').hide();
+               var $listItem = $('<div class="box32 commentResponseAdd jsCommentResponseAdd">' + this._userAvatarSmall + '<div /></div>').hide();
                $listItem.appendTo(this._commentButtonList[commentID].parent().show());
                
                var $inputContainer = $listItem.children('div');

diff --git a/wcfsetup/install/files/style/element/dl.scss b/wcfsetup/install/files/style/element/dl.scss
index 1a3b91837f74a818147072099a92c79800ad7582..356af3cb4a8d10320771fc75805c3124f795fa54 100644 (file)
--- a/wcfsetup/install/files/style/element/dl.scss
+++ b/wcfsetup/install/files/style/element/dl.scss
@@ -89,8 +89,6 @@ dl {
        }
        
        &.inlineDataList {
-               @extend .wcfFontSmall;
-               
                > dt {
                        display: inline-block;
                        

diff --git a/wcfsetup/install/files/style/element/list.scss b/wcfsetup/install/files/style/element/list.scss
index c12856967b8972a9257894e82139df1d125d2e46..f86dd72fb0fa0ff4c0f2f803951390e3bb4c071a 100644 (file)
--- a/wcfsetup/install/files/style/element/list.scss
+++ b/wcfsetup/install/files/style/element/list.scss
@@ -18,8 +18,6 @@
        
        /* adds a comma after each list item */
        &.commaSeparated {
-               @extend .wcfFontSmall;
-               
                > li {
                        &:not(:last-child):after {
                                content: ",";
@@ -27,6 +25,16 @@
                        }
                }
        }
+       
+       /* adds a dot after each list item */
+       &.dotSeparated {
+               > li {
+                       &:not(:last-child):after {
+                               content: "\00b7";
+                               margin-left: 5px;
+                       }
+               }
+       }
 }
 
 /* restores the native styling for lists */
@@ -44,36 +52,14 @@ ol.nativeList {
        list-style-type: decimal;
 }
 
-
-/*@todo*/
-.framedIconList {
-       display: flex;
-       flex-wrap: wrap;
-       padding-top: 10px;
-       
-       > li {
-               flex: 0 0 25%;
-               text-align: center;
-               
-               > a {
-                       display: block;
-               }
-       }
-       
-       & + .more {
-               float: right;
-               margin-top: 10px;
-       }
-}
-
-/*@todo*/
+/* tag cloud list */
 .tagList {
        @extend .inlineList;
        
        align-items: baseline;
 }
 
-/*@todo*/
+/* list of smileys */
 .smileyList {
        align-items: center;
 }

diff --git a/wcfsetup/install/files/style/layout/containerList.scss b/wcfsetup/install/files/style/layout/containerList.scss
index 31b192c88a9200e33f3372d85ed6bc8127eeb347..c6b432fe711edd96064f2f76cf7df4909b680029 100644 (file)
--- a/wcfsetup/install/files/style/layout/containerList.scss
+++ b/wcfsetup/install/files/style/layout/containerList.scss
@@ -1,5 +1,6 @@
 .containerList > li {
-       padding: 20px 0;
+       padding: 20px;
+       position: relative;
        
        &:not(:last-child) {
                border-bottom: 1px solid $wcfContentBorderInner;
@@ -13,8 +14,16 @@
                border-bottom: 1px solid $wcfContentBorder;
        }
        
+       &:hover {
+               background-color: $wcfTabularBoxBackgroundActive;
+       }
+               
        &.showMore {
                text-align: center;
+               
+               &:hover {
+                       background-color: transparent;
+               }
        }
        
        .containerHeadline {
@@ -31,6 +40,47 @@
                        margin-top: 10px;
                }
        }
+       
+       .buttonGroupNavigation {
+               opacity: 0;
+               position: absolute;
+               right: 20px;
+               top: 18px;
+               
+               > ul {
+                       background-color: $wcfContentBackground;
+                       border: 1px solid rgba(0, 0, 0, .15);
+                       border-radius: 6px;
+                       
+                       > li {
+                               margin-right: 0;
+                               
+                               &:not(:last-child) {
+                                       border-right: 1px solid rgba(0, 0, 0, .15);
+                               }
+                               
+                               > a {
+                                       padding: 6px;
+                                       
+                                       > .icon {
+                                               color: rgba(0, 0, 0, .5);
+                                       }
+                               }
+                               
+                               &:hover {
+                                       > a {
+                                               > .icon {
+                                                       color: $wcfContentText;
+                                               }
+                                       }
+                               }
+                       }
+               }
+       }
+       
+       &:hover .buttonGroupNavigation {
+               opacity: 1;
+       }
 }
 
 .containerBoxList {
@@ -64,18 +114,12 @@
        }
 }
 
+/*
 .userList .userInformation {
        position: relative;
        
-       &:hover > .buttonGroupNavigation {
-               opacity: 1;
-       }
        
-       > .buttonGroupNavigation {
-               opacity: 0;
-               position: absolute;
-               right: 0;
-               top: 0;
-               transition: opacity .2s linear;
-       }
-}
\ No newline at end of file
+       
+       > 
+}
+*/
\ No newline at end of file

diff --git a/wcfsetup/install/files/style/layout/content.scss b/wcfsetup/install/files/style/layout/content.scss
index ef4c592c7bc35d7b2e514563e3b8c4622a0bdebe..d8f04f83b5776c7df570061d4637d34000b8b981 100644 (file)
--- a/wcfsetup/install/files/style/layout/content.scss
+++ b/wcfsetup/install/files/style/layout/content.scss
@@ -46,11 +46,8 @@
        .section {
                margin-top: 30px;
                
-               > .sectionTitle {
-                       border-bottom: 1px solid $wcfContentBorderInner;
+               .sectionTitle {
                        color: $wcfContentHeadlineText; // todo: rename variable
-                       margin-bottom: 20px;
-                       padding-bottom: 10px;
                        
                        @extend .wcfFontHeadline;
                        
@@ -62,6 +59,23 @@
                                }
                        }
                }
+               
+               .sectionDescription {
+                       color: $wcfContentDimmedText;
+               }
+               
+               > .sectionHeader,
+               > .sectionTitle {
+                       margin-bottom: 20px;
+               }
+               
+               &:not(.sectionContainerList) {
+                       > .sectionHeader,
+                       > .sectionTitle {
+                               border-bottom: 1px solid $wcfContentBorderInner;
+                               padding-bottom: 10px;
+                       }
+               }
        }
        
        /* fieldset styling (old sections / deprecated) */
@@ -89,6 +103,12 @@
                        &+ * {
                                clear: left;
                        }
+                       
+                       + small {
+                               color: $wcfContentDimmedText;
+                               position: relative;
+                               top: -12px;
+                       }
                }
        }
 }

diff --git a/wcfsetup/install/files/style/layout/global.scss b/wcfsetup/install/files/style/layout/global.scss
index 73f92dd3f98607b8186fd29ccfd1dc77f2830297..083d4305ff5c67767498997bdd39ba0e255cc245 100644 (file)
--- a/wcfsetup/install/files/style/layout/global.scss
+++ b/wcfsetup/install/files/style/layout/global.scss
@@ -25,23 +25,23 @@
 
 /* boxes with an image */
 @mixin box($imageSize, $margin: 0) {
-       display: flex !important;
+       display: flex;
        
        > :first-child:not(:last-child) {
-               flex: 0 auto !important;
+               flex: 0 auto;
                margin-right: $margin;
        }
        
        > :last-child {
-               flex: 1 !important;
+               flex: 1;
        }
 }
 
 .box16 { @include box(16px, 5px); }
 .box24 { @include box(24px, 5px); }
 .box32 { @include box(32px, 8px); }
-.box48 { @include box(48px, 8px); }
-.box64 { @include box(64px, 8px); }
+.box48 { @include box(48px, 10px); }
+.box64 { @include box(64px, 10px); }
 .box96 { @include box(96px, 12px); }
 .box128 { @include box(128px, 12px); }
 .box256 { @include box(256px, 21px); }
@@ -79,7 +79,7 @@
        line-height: $wcfFontLineHeight;
 }
 
-small {
+small, .small {
        @extend .wcfFontSmall;
 }
 
@@ -172,3 +172,13 @@ ol.nativeList {
                list-style-type: decimal;
        }
 }
+
+.separatorLeft::before {
+       content: "\00b7";
+       margin-right: 5px;
+}
+
+.separatorRight::after {
+       content: "\00b7";
+       margin-left: 5px;
+}
\ No newline at end of file

diff --git a/wcfsetup/install/files/style/layout/sidebar.scss b/wcfsetup/install/files/style/layout/sidebar.scss
index cd1281e02410240714b70cb4ec4ea093dcdaf1c2..d90cfcc98ec587c9dff33afeac14bcc220ba6281 100644 (file)
--- a/wcfsetup/install/files/style/layout/sidebar.scss
+++ b/wcfsetup/install/files/style/layout/sidebar.scss
@@ -49,6 +49,26 @@
        .formSubmit:not(:first-child) {
                margin-top: 20px;
        }
+       
+       .boxContainer {
+               > div,
+               > fieldset,
+               > section {
+                       overflow: hidden;
+                       
+                       .button.more {
+                               float: right;
+                               margin-top: 10px;
+                       }
+               }
+       }
+       
+       .boxTitle {
+               .badge {
+                       float: right;
+                       margin-top: 5px;
+               }
+       }
 }
 
 /*.sidebar {

diff --git a/wcfsetup/install/files/style/ui/comment.scss b/wcfsetup/install/files/style/ui/comment.scss
index 33feac391945e38001e70dd598e4e8c8562d69c1..5378a959651ea480b3d94e4019780510783dd506 100644 (file)
--- a/wcfsetup/install/files/style/ui/comment.scss
+++ b/wcfsetup/install/files/style/ui/comment.scss
@@ -1,18 +1,59 @@
-.commentContent {
-       position: relative;
+.commentList {
+       > li {
+               > .box48 > div > .commentContent > .buttonGroupNavigation {
+                       right: 40px;
+               }
+               
+               
+               &:hover {
+                       background-color: transparent;
+                       
+                       .buttonGroupNavigation {
+                               opacity: 0;
+                       }
+               }
+       }
        
-       &:hover > .buttonGroupNavigation {
-               opacity: 1;
+       .commentContent {
+               &:hover {
+                       .buttonGroupNavigation {
+                               opacity: 1;
+                       }
+               }
+               
+               + .commentOptionContainer {
+                       .commentResponseAdd {
+                               border-top: 1px solid $wcfContentBorderInner;
+                               padding-top: 20px;
+                               margin-top: 20px;
+                       }
+               }
        }
        
-       > .buttonGroupNavigation {
-               opacity: 0;
-               position: absolute;
-               top: 5px;
-               transition: opacity .2s linear;
-               right: 10px;
+       .commentResponseList {
+               &:not(:empty) {
+                       margin-top: 20px;
+               }
+               
+               > li {
+                       &:first-child,
+                       &:last-child {
+                               border-color: $wcfContentBorderInner;
+                       }
+               }
+       }
+       
+       .commentOptionContainer {
+               margin-top: 10px;
        }
        
+       .commentResponseAdd {
+               padding: 10px 20px 0 20px;
+       }
+}
+
+/*
+.commentContent {
        > .containerHeadline {
                margin-bottom: 5px;
        }
@@ -35,3 +76,4 @@
        // TODO: border-top: 1px solid $wcfContentBorder;
        padding-top: 10px;
 }
+*/
\ No newline at end of file

diff --git a/wcfsetup/install/files/style/ui/message.scss b/wcfsetup/install/files/style/ui/message.scss
index 65a6d08e7d390c4bf894186143d5a377d1a32d92..fbf5dcd3df44a87aa509b907c81b5477954bded8 100644 (file)
--- a/wcfsetup/install/files/style/ui/message.scss
+++ b/wcfsetup/install/files/style/ui/message.scss
@@ -430,7 +430,7 @@
                        white-space: nowrap;
                }
        }
-       
+       /*todo
        .messageGroupInfo {
                @extend .inlineList;
                @extend .wcfFontSmall;
@@ -443,7 +443,7 @@
                                margin-left: 5px;
                        }
                }
-       }
+       }*/
        
        // hover
        .tabularListRow:hover,

diff --git a/wcfsetup/install/files/style/ui/tabMenu.scss b/wcfsetup/install/files/style/ui/tabMenu.scss
index 2c99eb15e3a068667e68159c44ef45756e76996a..63d27469dec0c84c579e3ee83a3afc66cf868832 100644 (file)
--- a/wcfsetup/install/files/style/ui/tabMenu.scss
+++ b/wcfsetup/install/files/style/ui/tabMenu.scss
@@ -1,10 +1,10 @@
 .tabMenuContainer:not(:first-child) {
-       margin-top: 30px;
+       //margin-top: 30px;
 }
 
 /* main tabs */
 .tabMenu {
-       margin-bottom: 20px;
+       //margin-bottom: 20px;
        position: relative;
        
        > ul {
@@ -42,6 +42,14 @@
        display: none;
 }
 
+.tabMenuContent {
+       // remove upper border if containerList is the first child
+       > .containerList:first-child > li:first-child {
+               border-top-width: 0;
+       }
+       
+}
+
 /* sub tabs */
 .menu {
        margin: -10px 0 40px 0;

diff --git a/wcfsetup/install/files/style/ui/userProfile.scss b/wcfsetup/install/files/style/ui/userProfile.scss
index 2f86945675214447096ef488bd7d516fe3f76131..9377b4e8200243322078d58f9de190caa488e961 100644 (file)
--- a/wcfsetup/install/files/style/ui/userProfile.scss
+++ b/wcfsetup/install/files/style/ui/userProfile.scss
@@ -74,7 +74,7 @@
 
 .userProfile #profileContent {
        > .tabMenu {
-               margin-bottom: 30px;
+               //margin-bottom: 30px;
                
                > ul > li {
                        &:not(:last-child) {
@@ -88,11 +88,6 @@
                                @extend .wcfFontHeadline;
                        }
                }
-               
-               > span {
-                       border-width: 2px;
-                       bottom: -5px;
-               }
        }
 }
 
@@ -110,7 +105,33 @@
                }
        }
 }
-
+/*
 .username {
        @extend .wcfFontHeadline;
+}*/
+
+.userAvatarList {
+       display: flex;
+       flex-wrap: wrap;
+       margin-bottom: -10px;
+       
+       > li {
+               flex: 0 0 25%;
+               margin-bottom: 10px;
+               text-align: center;
+               
+               > a {
+                       display: block;
+               }
+       }
+}
+
+.userList {
+       .box48 {
+               align-items: center;
+       }
+       
+       li .containerHeadline + *:not(.buttonGroupNavigation) {
+               margin-top: 0;
+       }
 }