Fix the mismatching icon sizes of the new desktop user panel

Fixes #5408

diff --git a/wcfsetup/install/files/acp/style/layout.scss b/wcfsetup/install/files/acp/style/layout.scss
index 28effcaa8d1515302439a920132e5cb84393c0a3..d1529d3df401a4c3f397fa30b3f9c3238d8c9686 100644 (file)
--- a/wcfsetup/install/files/acp/style/layout.scss
+++ b/wcfsetup/install/files/acp/style/layout.scss
@@ -181,10 +181,18 @@ html[data-color-scheme="dark"] {
                .userPanel .boxFlag {
                        font-size: 12px;
                }
+
+               .pageHeaderPanel fa-icon[size="32"] {
+                       display: none;
+               }
        }
 
        @include screen-md-down {
                max-width: 100vw;
+
+               .pageHeaderPanel fa-icon[size="16"] {
+                       display: none;
+               }
        }
 }
 

diff --git a/wcfsetup/install/files/acp/templates/pageHeaderUser.tpl b/wcfsetup/install/files/acp/templates/pageHeaderUser.tpl
index b0bd18e4dab7cfd1aa73caef91d082975c45162e..4163fe39ac4f281448d347912db879e8f9e6a069 100644 (file)
--- a/wcfsetup/install/files/acp/templates/pageHeaderUser.tpl
+++ b/wcfsetup/install/files/acp/templates/pageHeaderUser.tpl
@@ -10,18 +10,28 @@
                                </li>
                                
                                <li id="jumpToPage">
-                                       <a href="{link forceFrontend=true}{/link}" class="jsTooltip" title="{lang}wcf.global.jumpToPage{/lang}">{icon size=16 name='house'}</a>
+                                       <a href="{link forceFrontend=true}{/link}" class="jsTooltip" title="{lang}wcf.global.jumpToPage{/lang}">
+                                               {icon size=16 name='house'}
+                                               {icon size=32 name='house'}
+                                       </a>
                                </li>
                                
                                {if $__wcf->session->getPermission('admin.configuration.package.canUpdatePackage') && $__wcf->getAvailableUpdates()}
                                        <li>
-                                               <a href="{link controller='PackageUpdate'}{/link}" class="jsTooltip" title="{lang}wcf.acp.package.updates{/lang}">{icon size=16 name='arrows-rotate'} <span class="badge badgeUpdate">{#$__wcf->getAvailableUpdates()}</span></a>
+                                               <a href="{link controller='PackageUpdate'}{/link}" class="jsTooltip" title="{lang}wcf.acp.package.updates{/lang}">
+                                                       {icon size=16 name='arrows-rotate'}
+                                                       {icon size=32 name='arrows-rotate'}
+                                                       <span class="badge badgeUpdate">{#$__wcf->getAvailableUpdates()}</span>
+                                               </a>
                                        </li>
                                {/if}
                        {/if}
                        
                        <li id="woltlab" class="dropdown">
-                               <a href="#" class="dropdownToggle jsTooltip" title="WoltLab&reg;">{icon size=16 name='info'}</a>
+                               <a href="#" class="dropdownToggle jsTooltip" title="WoltLab&reg;">
+                                       {icon size=16 name='info'}
+                                       {icon size=32 name='info'}
+                               </a>
                                
                                <ul class="dropdownMenu dropdownMenuUserPanel" data-dropdown-alignment-horizontal="right">
                                        <li><a class="externalURL" href="https://www.woltlab.com/{if $__wcf->getLanguage()->getFixedLanguageCode() === 'de'}de/{/if}"{if EXTERNAL_LINK_TARGET_BLANK} target="_blank" rel="noopener"{/if}>{lang}wcf.acp.index.woltlab.website{/lang}</a></li>