Style optimizations

diff --git a/com.woltlab.wcf/templates/accountManagement.tpl b/com.woltlab.wcf/templates/accountManagement.tpl
index ebab5310acd08a98f09a6d1f4037ad76a87f62bb..8056baf7749cf23c5611fc5a35a49690e1aa51d9 100644 (file)
--- a/com.woltlab.wcf/templates/accountManagement.tpl
+++ b/com.woltlab.wcf/templates/accountManagement.tpl
@@ -69,7 +69,7 @@
                                <dl>
                                        <dt></dt>
                                        <dd>
-                                               <ul class="buttonList">
+                                               <ul class="buttonList smallButtons">
                                                        <li><a class="button small" href="{link controller='LostPassword'}{/link}"><span>{lang}wcf.user.lostPassword{/lang}</span></a></li>
                                                </ul>
                                        </dd>
@@ -180,7 +180,7 @@
                                        <dl>
                                                <dt></dt>
                                                <dd>
-                                                       <ul class="buttonList">
+                                                       <ul class="buttonList smallButtons">
                                                                <li><a class="button small" href="{link controller='EmailActivation'}{/link}"><span>{lang}wcf.user.emailActivation{/lang}</span></a></li>
                                                        </ul>
                                                </dd>

diff --git a/com.woltlab.wcf/templates/emailActivation.tpl b/com.woltlab.wcf/templates/emailActivation.tpl
index e94027f2f66dd5dcaf58680f95fcd440ec5e3b33..e0383c1df85553344acd8a325e5a79db673585b6 100644 (file)
--- a/com.woltlab.wcf/templates/emailActivation.tpl
+++ b/com.woltlab.wcf/templates/emailActivation.tpl
@@ -66,7 +66,7 @@
                        <dl>
                                <dt></dt>
                                <dd>
-                                       <ul class="buttonList">
+                                       <ul class="buttonList smallButtons">
                                                <li><a class="button small" href="{link controller='EmailNewActivationCode'}{/link}"><span>{lang}wcf.user.newActivationCode{/lang}</span></a></li>
                                                {event name='buttons'}
                                        </ul>

diff --git a/com.woltlab.wcf/templates/following.tpl b/com.woltlab.wcf/templates/following.tpl
index 1ef1764226f6b8bb90dc93f6409278db6db2f5ec..47212431a40921418a16233b8ddd47d34f09b591 100644 (file)
--- a/com.woltlab.wcf/templates/following.tpl
+++ b/com.woltlab.wcf/templates/following.tpl
@@ -51,7 +51,7 @@
                                                        {include file='userInformationHeadline'}
                                                        
                                                        <nav class="jsMobileNavigation buttonGroupNavigation">
-                                                               <ul class="buttonList jsOnly">
+                                                               <ul class="buttonList iconList jsOnly">
                                                                        <li><span class="icon icon16 icon-remove pointer jsTooltip jsDeleteButton" title="{lang}wcf.user.button.unfollow{/lang}" data-object-id="{@$user->followID}"></span></li>
                                                                        {event name='userButtons'}
                                                                </ul>

diff --git a/com.woltlab.wcf/templates/ignoredUsers.tpl b/com.woltlab.wcf/templates/ignoredUsers.tpl
index e8d186978dff638b1b9701e273ac1428dc2ff00f..ffd82cb3892ab86a188920a7548747663ab085e9 100644 (file)
--- a/com.woltlab.wcf/templates/ignoredUsers.tpl
+++ b/com.woltlab.wcf/templates/ignoredUsers.tpl
@@ -51,7 +51,7 @@
                                                        {include file='userInformationHeadline'}
                                                        
                                                        <nav class="jsMobileNavigation buttonGroupNavigation">
-                                                               <ul class="buttonList jsOnly">
+                                                               <ul class="buttonList iconList jsOnly">
                                                                        <li><span class="icon icon16 icon-remove pointer jsTooltip jsDeleteButton" title="{lang}wcf.user.button.unignore{/lang}" data-object-id="{@$user->ignoreID}"></span></li>
                                                                        {event name='userButtons'}
                                                                </ul>

diff --git a/com.woltlab.wcf/templates/login.tpl b/com.woltlab.wcf/templates/login.tpl
index fa7729221cf84fe0964c09671ae7ad4105d2d132..eb51d0154a5b7fec9a25d9beccc7d0e58b71b52d 100644 (file)
--- a/com.woltlab.wcf/templates/login.tpl
+++ b/com.woltlab.wcf/templates/login.tpl
@@ -99,7 +99,7 @@
                        <dl>
                                <dt></dt>
                                <dd>
-                                       <ul class="buttonList">
+                                       <ul class="buttonList smallButtons">
                                                <li><a class="button small" href="{link controller='LostPassword'}{/link}"><span>{lang}wcf.user.lostPassword{/lang}</span></a></li>
                                                {if !REGISTER_DISABLED && REGISTER_ACTIVATION_METHOD == 1}<li><a class="button small" href="{link controller='RegisterActivation'}{/link}"><span>{lang}wcf.user.registerActivation{/lang}</span></a></li>{/if}
                                                {event name='buttons'}
@@ -115,7 +115,7 @@
                                <dl>
                                        <dt></dt>
                                        <dd>
-                                               <ul class="buttonList">
+                                               <ul class="buttonList smallButtons">
                                                        {content}
                                                                {if GITHUB_PUBLIC_KEY !== '' && GITHUB_PRIVATE_KEY !== ''}
                                                                        <li id="githubAuth" class="3rdPartyAuth">

diff --git a/com.woltlab.wcf/templates/mainMenu.tpl b/com.woltlab.wcf/templates/mainMenu.tpl
index 86680de958579446b84e5d7ccd39845320948c2e..820d103656f105e1e122e9a1b562e9214ff89d7d 100644 (file)
--- a/com.woltlab.wcf/templates/mainMenu.tpl
+++ b/com.woltlab.wcf/templates/mainMenu.tpl
@@ -1,11 +1,19 @@
 {if $__wcf->getPageMenu()->getMenuItems('header')|count > 0}
        <nav id="mainMenu" class="mainMenu jsMobileNavigation" data-button-label="{lang}wcf.page.mainMenu{/lang}">
-               <ul>{foreach from=$__wcf->getPageMenu()->getMenuItems('header') item=menuItem}<li{if $__wcf->getPageMenu()->getActiveMenuItem() == $menuItem->menuItem} class="active"{/if}>{*
-                       *}<a href="{$menuItem->getProcessor()->getLink()}">{lang}{$menuItem->menuItem}{/lang}{if $menuItem->getProcessor()->getNotifications()} <span class="badge badgeUpdate">{#$menuItem->getProcessor()->getNotifications()}</span>{/if}</a>{*
-               *}{if $__wcf->getPageMenu()->getMenuItems($menuItem->menuItem)|count > 0 && $__wcf->getPageMenu()->getActiveMenuItem() == $menuItem->menuItem}<ul class="invisible">{*
-                               *}{foreach from=$__wcf->getPageMenu()->getMenuItems($menuItem->menuItem) item=subMenuItem}{*
-                                       *}<li{if $__wcf->getPageMenu()->getActiveMenuItem(1) == $subMenuItem->menuItem} class="active"{/if}><a href="{$subMenuItem->getProcessor()->getLink()}"><span>{lang}{$subMenuItem->menuItem}{/lang}</span></a>{if $subMenuItem->getProcessor()->getNotifications()} <span class="badge badgeUpdate">{#$subMenuItem->getProcessor()->getNotifications()}</span>{/if}</li>{*
-                               *}{/foreach}{*
-               *}{event name='items'}</ul>{/if}</li>{/foreach}</ul>
+               <ul>
+                       {foreach from=$__wcf->getPageMenu()->getMenuItems('header') item=menuItem}
+                               <li{if $__wcf->getPageMenu()->getActiveMenuItem() == $menuItem->menuItem} class="active"{/if}>
+                                       <a href="{$menuItem->getProcessor()->getLink()}">{lang}{$menuItem->menuItem}{/lang}{if $menuItem->getProcessor()->getNotifications()} <span class="badge badgeUpdate">{#$menuItem->getProcessor()->getNotifications()}</span>{/if}</a>
+                                       {if $__wcf->getPageMenu()->getMenuItems($menuItem->menuItem)|count > 0 && $__wcf->getPageMenu()->getActiveMenuItem() == $menuItem->menuItem}
+                                               <ul class="invisible">
+                                                       {foreach from=$__wcf->getPageMenu()->getMenuItems($menuItem->menuItem) item=subMenuItem}
+                                                               <li{if $__wcf->getPageMenu()->getActiveMenuItem(1) == $subMenuItem->menuItem} class="active"{/if}><a href="{$subMenuItem->getProcessor()->getLink()}"><span>{lang}{$subMenuItem->menuItem}{/lang}</span></a>{if $subMenuItem->getProcessor()->getNotifications()} <span class="badge badgeUpdate">{#$subMenuItem->getProcessor()->getNotifications()}</span>{/if}</li>
+                                                       {/foreach}
+                                                       {event name='items'}
+                                               </ul>
+                                       {/if}
+                               </li>
+                       {/foreach}
+               </ul>
        </nav>
 {/if}

diff --git a/com.woltlab.wcf/templates/membersList.tpl b/com.woltlab.wcf/templates/membersList.tpl
index 7cf5537776559bfb7c711f425e9763c955d54c7f..ceed61997d80cf2437320879f7253c2249ac9435 100644 (file)
--- a/com.woltlab.wcf/templates/membersList.tpl
+++ b/com.woltlab.wcf/templates/membersList.tpl
@@ -58,7 +58,7 @@
        <fieldset>
                <legend>{lang}wcf.user.members.sort.letters{/lang}</legend>
                                
-               <ul class="buttonList letters">
+               <ul class="buttonList smallButtons letters">
                        {foreach from=$letters item=__letter}
                                <li><a href="{if $searchID}{link controller='MembersList' id=$searchID}sortField={$sortField}&sortOrder={$sortOrder}&letter={$__letter|rawurlencode}{/link}{else}{link controller='MembersList'}sortField={$sortField}&sortOrder={$sortOrder}&letter={$__letter|rawurlencode}{/link}{/if}" class="button small{if $letter == $__letter} active{/if}">{$__letter}</a></li>
                        {/foreach}

diff --git a/com.woltlab.wcf/templates/notificationList.tpl b/com.woltlab.wcf/templates/notificationList.tpl
index 65426425a3d468438142280a79c3b74280839aef..ba147cfd1362fafb5ccf4240e4f3daf4afed5408 100644 (file)
--- a/com.woltlab.wcf/templates/notificationList.tpl
+++ b/com.woltlab.wcf/templates/notificationList.tpl
@@ -72,7 +72,7 @@
                                                        <p>{@$notification[event]->getMessage()}</p>
                                                        
                                                        <nav class="jsMobileNavigation buttonGroupNavigation">
-                                                               <ul class="buttonList jsOnly">
+                                                               <ul class="buttonList iconList jsOnly">
                                                                        <li><a class="jsMarkAsConfirmed jsTooltip" title="{lang}wcf.user.notification.markAsConfirmed{/lang}"><span class="icon icon16 icon-remove"></span></a></li>
                                                                </ul>
                                                        </nav>

diff --git a/com.woltlab.wcf/templates/recaptcha.tpl b/com.woltlab.wcf/templates/recaptcha.tpl
index 10474f46bce8eada6b13ce69d4248939a687619d..22ef413416163aa9f2ca77646254d5472755a71d 100644 (file)
--- a/com.woltlab.wcf/templates/recaptcha.tpl
+++ b/com.woltlab.wcf/templates/recaptcha.tpl
@@ -28,7 +28,7 @@
                {event name='fields'}
                
                <dd class="jsOnly">
-                       <ul class="buttonList">
+                       <ul class="buttonList smallButtons">
                                <li><a href="javascript:Recaptcha.reload()" class="button small"><span class="icon icon16 icon-repeat"></span> <span>{lang}wcf.recaptcha.reload{/lang}</span></a></li>
                                <li class="recaptcha_only_if_image"><a href="javascript:Recaptcha.switch_type('audio')" class="button small"><span class="icon icon16 icon-volume-up"></span> <span>{lang}wcf.recaptcha.audio{/lang}</span></a></li>
                                <li class="recaptcha_only_if_audio"><a href="javascript:Recaptcha.switch_type('image')" class="button small"><span class="icon icon16 icon-eye-open"></span> <span>{lang}wcf.recaptcha.image{/lang}</span></a></li>

diff --git a/com.woltlab.wcf/templates/registerActivation.tpl b/com.woltlab.wcf/templates/registerActivation.tpl
index d041940fa93e456972a0d8133c4eda453169d77d..e6e62ba98c1f3ffe679570043e840d373e43f1cd 100644 (file)
--- a/com.woltlab.wcf/templates/registerActivation.tpl
+++ b/com.woltlab.wcf/templates/registerActivation.tpl
@@ -67,7 +67,7 @@
                        <dl>
                                <dt></dt>
                                <dd>
-                                       <ul class="buttonList">
+                                       <ul class="buttonList smallButtons">
                                                <li><a class="button small" href="{link controller='RegisterNewActivationCode'}{/link}"><span>{lang}wcf.user.newActivationCode{/lang}</span></a></li>
                                                {event name='buttons'}
                                        </ul>

diff --git a/com.woltlab.wcf/templates/userInformationButtons.tpl b/com.woltlab.wcf/templates/userInformationButtons.tpl
index 59ef99f620eb04667641448f85f9dec051946a8e..6f72153d9add36c3b0bfbaf70c1f96434f471063 100644 (file)
--- a/com.woltlab.wcf/templates/userInformationButtons.tpl
+++ b/com.woltlab.wcf/templates/userInformationButtons.tpl
@@ -1,6 +1,6 @@
 {hascontent}
        <nav class="jsMobileNavigation buttonGroupNavigation">
-               <ul class="buttonList">
+               <ul class="buttonList iconList">
                        {content}
                                {if $user->homepage && $user->homepage != 'http://'}
                                        <li><a class="jsTooltip" href="{$user->homepage}" title="{lang}wcf.user.option.homepage{/lang}"{if EXTERNAL_LINK_REL_NOFOLLOW} rel="nofollow"{/if}{if EXTERNAL_LINK_TARGET_BLANK} target="_blank"{/if}><span class="icon icon16 icon-home"></span> <span class="invisible">{lang}wcf.user.option.homepage{/lang}</span></a></li>

diff --git a/wcfsetup/install/files/acp/templates/styleList.tpl b/wcfsetup/install/files/acp/templates/styleList.tpl
index 14ab433b21eba1c3a1a2e3d6c9dbcfcdb78efaf5..0d2e5225bbb2bf630d03a773fed3f8a807afb7a3 100644 (file)
--- a/wcfsetup/install/files/acp/templates/styleList.tpl
+++ b/wcfsetup/install/files/acp/templates/styleList.tpl
@@ -51,7 +51,7 @@
                                                        <dd>{if $style->authorURL}<a href="{@$__wcf->getPath()}acp/dereferrer.php?url={$style->authorURL}">{$style->authorName}</a>{else}{$style->authorName}{/if}</dd>
                                                </dl>
                                                <nav class="jsMobileNavigation buttonGroupNavigation">
-                                                       <ul class="buttonList" data-style-id="{@$style->styleID}">
+                                                       <ul class="buttonList iconList" data-style-id="{@$style->styleID}">
                                                                <li><a href="{link controller='StyleEdit' id=$style->styleID}{/link}" title="{lang}wcf.global.button.edit{/lang}" class="jsTooltip"><span class="icon icon16 icon-pencil"></span></a></li>
                                                                <li><a href="{link controller='StyleExport' id=$style->styleID}{/link}" title="{lang}wcf.acp.style.exportStyle{/lang}" class="jsTooltip"><span class="icon icon16 icon-download-alt"></span></a></li>
                                                                

diff --git a/wcfsetup/install/files/style/button.less b/wcfsetup/install/files/style/button.less
index 0526def12c091377d5658b1b35952412a69bee2d..1094dacb82005d461d16eba17fb2ac7d8d512e01 100644 (file)
--- a/wcfsetup/install/files/style/button.less
+++ b/wcfsetup/install/files/style/button.less
@@ -9,7 +9,7 @@ input[type='button'],
        border-width: 1px;
        cursor: pointer;
        display: inline-block;
-       margin: 0 2px;
+       margin: 0 4px;
        padding: 5px 13px;
        position: relative;
 }
@@ -115,15 +115,44 @@ button.active:hover {
        }
 }
 
+/* small buttons */
+button.small,
+.button.small {
+       border-radius: @wcfSmallButtonBorderRadius;
+       font-size: @wcfSmallFontSize;
+       min-height: 13px;
+       padding: 5px 11px;
+       margin: 0 2px;
+}
+
 /* button list */
 .buttonList {
+       font-size: 0;
+       
        > li {
                display: inline-block;
+               font-size: 1rem;
                
-               > .button {
+               &:not(:last-child) {
+                       margin-right: 8px;
+               }
+               
+               .button {
                        margin: 0;
                }
        }
+       
+       &.smallButtons {
+               > li:not(:last-child) {
+                       margin-right: 4px;
+               }
+       }
+       
+       &.iconList {
+               > li:not(:last-child) {
+                       margin-right: 2px;
+               }
+       }
 }
 
 /* button group */
@@ -240,15 +269,6 @@ button.active:hover {
        }
 }
 
-/* small buttons */
-button.small,
-.button.small {
-       border-radius: @wcfSmallButtonBorderRadius;
-       font-size: @wcfSmallFontSize;
-       min-height: 13px;
-       padding: 5px 11px;
-}
-
 /* button icons */
 .button > .icon {
        margin: -1px -5px;

diff --git a/wcfsetup/install/files/style/form.less b/wcfsetup/install/files/style/form.less
index ae81f63f7488798714122381959c3738354f176d..30dd2f294c4b922fce80355f50820b36a78faa77 100644 (file)
--- a/wcfsetup/install/files/style/form.less
+++ b/wcfsetup/install/files/style/form.less
@@ -180,8 +180,17 @@ dl:not(.plain) {
 
 /* submit buttons */
 .formSubmit {
+       font-size: 0;
        margin-top: @wcfGapMedium;
        text-align: center;
+       
+       button,
+       input[type='reset'],
+       input[type='submit'],
+       input[type='button'],
+       .button {
+               font-size: 1rem;
+       }
 }
 
 

diff --git a/wcfsetup/install/files/style/label.less b/wcfsetup/install/files/style/label.less
index bfc79ff470e6d416e569f7ee4afb2a4aafc588d6..6311b0db8837b662a0fadb195284af7c68ac6de6 100644 (file)
--- a/wcfsetup/install/files/style/label.less
+++ b/wcfsetup/install/files/style/label.less
@@ -1,7 +1,15 @@
 /* #### Labels #### */
 /* label list */
+.labelList {
+       font-size: 0;
+}
+
 .labelList, .labelList > li {
-       display: inline-block; 
+       display: inline-block;
+}
+
+.labelList > li:not(:last-child) {
+       margin-right: 4px;
 }
 
 /* ACP label list */

diff --git a/wcfsetup/install/files/style/layout.less b/wcfsetup/install/files/style/layout.less
index cb095a711ecbb1753a82be36dd048ea282f45bc1..03446cba242560db2c94f9ab1b32961f70b4a36a 100644 (file)
--- a/wcfsetup/install/files/style/layout.less
+++ b/wcfsetup/install/files/style/layout.less
@@ -322,6 +322,8 @@
 /* main menu */
 @media screen and (min-width: 801px), print {
        .mainMenu {
+               font-size: 0;
+               
                > ul {
                        background-color: @wcfMainMenuBackgroundColor;
                        display: inline-block;
@@ -452,6 +454,7 @@
        
        > ul {
                display: inline-block;
+               font-size: 0;
                
                &.navigationItems, &.navigationIcons {
                        float: right;
@@ -467,7 +470,7 @@
                                
                                > a {
                                        display: inline-block;
-                                       padding: 3px;
+                                       padding: 4px 3px 3px;
                                }
                        }
                }
@@ -484,11 +487,11 @@
                
                &.navigationItems, &.navigationMenuItems {
                        > li {
-                               margin: 4px 7px 1px;
+                               font-size: 1rem;
+                               margin: 4px 7px 2px;
                                
                                > a {
                                        color: @wcfLinkColor;
-                                       padding: 2px 0;
                                        
                                        &:hover {
                                                color: @wcfLinkHoverColor;
@@ -845,21 +848,14 @@
                margin-top: @wcfGapMedium;
        }
        
-       nav ul {
-               text-align: left;
+       > nav.pageNavigation > ul {
+               float: left;
        }
        
-       nav > ul {
-               float: left;
-               
-               &:not(.pageNavigation) {
-                       float: right;
-                       text-align: right;
-               }
-               
-               li {
-                       display: inline;
-               }
+       > nav:not(.pageNavigation) > ul {
+               margin-right: 2px;
+               float: right;
+               .buttonList;
        }
 }