Generic `layoutBoundary` to cover all your bases

diff --git a/com.woltlab.wcf/templates/footer.tpl b/com.woltlab.wcf/templates/footer.tpl
index 9b25060029e176f2beda93cea5fe0d6b3205834d..55d2a2b5ce12e5739b51b4f91b61f5696214571f 100644 (file)
--- a/com.woltlab.wcf/templates/footer.tpl
+++ b/com.woltlab.wcf/templates/footer.tpl
@@ -12,7 +12,7 @@
        </section>
        
        <div id="pageFooterBoxes">
-               <div class="layoutFluid">
+               <div class="layoutBoundary">
                        {hascontent}
                                <ul>
                                        {content}{if !$footerBoxes|empty}{@$footerBoxes}{/if}{/content}
@@ -40,7 +40,7 @@
        </nav>*}
        
        <footer id="pageFooter" class="footer{if $sidebarOrientation|isset && $sidebar|isset} sidebarOrientation{@$sidebarOrientation|ucfirst}{if $sidebarOrientation == 'right' && $sidebarCollapsed} sidebarCollapsed{/if}{/if}">
-               <div class="layoutFluid">
+               <div class="layoutBoundary">
                        <div class="footerContent">
                                {event name='footerContents'}
                                

diff --git a/com.woltlab.wcf/templates/header.tpl b/com.woltlab.wcf/templates/header.tpl
index 6dd9f0c5877658bdff5ddff082927e619ff60f87..90a5f6613697152713940eda6445099491818ff9 100644 (file)
--- a/com.woltlab.wcf/templates/header.tpl
+++ b/com.woltlab.wcf/templates/header.tpl
@@ -10,7 +10,7 @@
        {include file='pageNavbarTop'}
        
        <section id="main" class="main" role="main">
-               <div class="{if $__wcf->getStyleHandler()->getStyle()->getVariable('useFluidLayout')}layoutFluid{else}layoutFixed{/if}">
+               <div class="layoutBoundary">
                        {capture assign='__sidebar'}
                                {if $sidebar|isset}
                                        <aside class="sidebar"{if $sidebarOrientation|isset && $sidebarOrientation == 'right'} data-is-open="{if $sidebarCollapsed}false{else}true{/if}" data-sidebar-name="{$sidebarName}"{/if}>

diff --git a/com.woltlab.wcf/templates/pageHeader.tpl b/com.woltlab.wcf/templates/pageHeader.tpl
index 7286a33fc6583549a7e60c9a766c361ab8bff60f..1b8091f3253b9713e769f16c87c6ad21625146aa 100644 (file)
--- a/com.woltlab.wcf/templates/pageHeader.tpl
+++ b/com.woltlab.wcf/templates/pageHeader.tpl
@@ -1,6 +1,6 @@
 <header id="pageHeader" class="pageHeader">
        <div>
-               <div class="{if $__wcf->getStyleHandler()->getStyle()->getVariable('useFluidLayout')}layoutFluid{else}layoutFixed{/if}">
+               <div class="layoutBoundary">
                        {include file='pageHeaderLogo'}
                        
                        {include file='pageHeaderSearch'}

diff --git a/wcfsetup/install/files/acp/templates/footer.tpl b/wcfsetup/install/files/acp/templates/footer.tpl
index 3e023b4674caafa1a7bdd53eccca35975c533c9d..98f61f511154e96215887560bd712fff1f463393 100644 (file)
--- a/wcfsetup/install/files/acp/templates/footer.tpl
+++ b/wcfsetup/install/files/acp/templates/footer.tpl
@@ -3,7 +3,7 @@
        </section>
        
        <footer id="pageFooter" class="footer">
-               <div class="layoutFluid">
+               <div class="layoutBoundary">
                        {*<nav id="footerNavigation" class="navigation navigationFooter">
                                <ul class="navigationIcons">
                                        <li id="toTopLink" class="toTopLink"><a href="{$__wcf->getAnchor('top')}" title="{lang}wcf.global.scrollUp{/lang}" class="jsTooltip"><span class="icon icon16 icon-arrow-up"></span> <span class="invisible">{lang}wcf.global.scrollUp{/lang}</span></a></li>

diff --git a/wcfsetup/install/files/acp/templates/header.tpl b/wcfsetup/install/files/acp/templates/header.tpl
index 792d9fd548672ebb4b75f7c0fdd848b6a05844b7..70bfbeedc0b63c9bf632bb3fa1ccb63b597a8c23 100644 (file)
--- a/wcfsetup/install/files/acp/templates/header.tpl
+++ b/wcfsetup/install/files/acp/templates/header.tpl
@@ -160,11 +160,11 @@
                <section id="main" class="main" role="main">
        
        {*
-       <header id="pageHeader" class="layoutFluid">
+       <header id="pageHeader" class="layoutBoundary">
                <div>
                        {if $__wcf->user->userID}
                                <nav id="topMenu" class="userPanel">
-                                       <div class="layoutFluid">
+                                       <div class="layoutBoundary">
                                                <ul class="userPanelItems">
                                                        <li id="userMenu" class="dropdown">
                                                                <a class="dropdownToggle framed" data-toggle="userMenu">{if PACKAGE_ID}{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(24)} {/if}{lang}wcf.user.userNote{/lang}</a>
@@ -261,6 +261,6 @@
        </header>
        *}
        
-       <div class="layoutFluid">
+       <div class="layoutBoundary">
                <div id="content" class="content">
                                

diff --git a/wcfsetup/install/files/acp/templates/pageHeader.tpl b/wcfsetup/install/files/acp/templates/pageHeader.tpl
index b0e30eee1065a067ac2c886cf111e327c1cc3be7..3044c2d9b0a001ddeb5a46b406e4507f0987d757 100644 (file)
--- a/wcfsetup/install/files/acp/templates/pageHeader.tpl
+++ b/wcfsetup/install/files/acp/templates/pageHeader.tpl
@@ -1,6 +1,6 @@
 <header id="pageHeader" class="pageHeader">
        <div>
-               <div class="layoutFluid">
+               <div class="layoutBoundary">
                        {include file='pageLogo'}
                        
                        {include file='pageSearchArea'}

diff --git a/wcfsetup/install/files/style/layout/global.scss b/wcfsetup/install/files/style/layout/global.scss
index 7ef1e643e539f49b2a6369e0e0e0c47239e93e0d..8925b8e12438dfc91a5a792c9a3943987c5fa710 100644 (file)
--- a/wcfsetup/install/files/style/layout/global.scss
+++ b/wcfsetup/install/files/style/layout/global.scss
@@ -1,8 +1,13 @@
-.layoutFluid {
-       margin-left: auto;
-       margin-right: auto;
-       min-width: $wcfLayoutMinWidth;
-       max-width: $wcfLayoutMaxWidth;
+.layoutBoundary {
+       margin: 0 auto;
+       
+       @if $useFluidLayout {
+               min-width: $wcfLayoutMinWidth;
+               max-width: $wcfLayoutMaxWidth;
+       }
+       @else {
+               width: $wcfLayoutFixedWidth;
+       }
 }
 
 .marginTop {