BUG Fix up markup and classes to work better with flexbox

This commit is contained in:
Christopher Joe 2017-10-12 16:49:19 +13:00
parent acadcadbdf
commit a930d7ae2e
3 changed files with 32 additions and 38 deletions

View File

@ -1,40 +1,34 @@
<div id="pages-controller-cms-content" class="has-panel cms-content flexbox-area-grow fill-width fill-height $BaseCSSClasses" data-layout-type="border" data-pjax-fragment="Content" data-ignore-tab-state="true"> <div id="pages-controller-cms-content" class="has-panel cms-content flexbox-area-grow fill-width fill-height $BaseCSSClasses" data-layout-type="border" data-pjax-fragment="Content" data-ignore-tab-state="true">
<div class="fill-width fill-height flexbox-area-grow"> $Tools
$Tools
<div class="fill-height flexbox-area-grow"> <div class="fill-height flexbox-area-grow">
<div class="cms-content-header north"> <div class="cms-content-header north vertical-align-items fill-width">
<div class="cms-content-header-nav fill-width vertical-align-items"> <a href="$BreadcrumbsBackLink" class="btn btn-secondary btn--no-text font-icon-left-open-big hidden-lg-up toolbar__back-button"></a>
<div class="cms-content-header-nav__left vertical-align-items flexbox-area-grow"> <% include SilverStripe\\Admin\\CMSBreadcrumbs %>
<a href="$BreadcrumbsBackLink" class="btn btn-secondary btn--no-text font-icon-left-open-big hidden-lg-up toolbar__back-button"></a>
<% include SilverStripe\\Admin\\CMSBreadcrumbs %>
</div>
<div class="cms-content-header-tabs cms-tabset"> <div class="cms-content-header-tabs cms-tabset">
<ul class="cms-tabset-nav-primary nav nav-tabs"> <ul class="cms-tabset-nav-primary nav nav-tabs">
<li class="nav-item content-treeview<% if $TabIdentifier == 'edit' %> ui-tabs-active<% end_if %>"> <li class="nav-item content-treeview<% if $TabIdentifier == 'edit' %> ui-tabs-active<% end_if %>">
<a href="$LinkPageEdit" class="nav-link cms-panel-link" title="Form_EditForm" data-href="$LinkPageEdit"> <a href="$LinkPageEdit" class="nav-link cms-panel-link" title="Form_EditForm" data-href="$LinkPageEdit">
<%t SilverStripe\\CMS\\Controllers\\CMSMain.TabContent 'Content' %> <%t SilverStripe\\CMS\\Controllers\\CMSMain.TabContent 'Content' %>
</a> </a>
</li> </li>
<li class="nav-item content-listview<% if $TabIdentifier == 'settings' %> ui-tabs-active<% end_if %>"> <li class="nav-item content-listview<% if $TabIdentifier == 'settings' %> ui-tabs-active<% end_if %>">
<a href="$LinkPageSettings" class="nav-link cms-panel-link" title="Form_EditForm" data-href="$LinkPageSettings"> <a href="$LinkPageSettings" class="nav-link cms-panel-link" title="Form_EditForm" data-href="$LinkPageSettings">
<%t SilverStripe\\CMS\\Controllers\\CMSMain.TabSettings 'Settings' %> <%t SilverStripe\\CMS\\Controllers\\CMSMain.TabSettings 'Settings' %>
</a> </a>
</li> </li>
<li class="nav-item content-listview<% if $TabIdentifier == 'history' %> ui-tabs-active<% end_if %>"> <li class="nav-item content-listview<% if $TabIdentifier == 'history' %> ui-tabs-active<% end_if %>">
<a href="$LinkPageHistory" class="nav-link cms-panel-link" title="Form_EditForm" data-href="$LinkPageHistory"> <a href="$LinkPageHistory" class="nav-link cms-panel-link" title="Form_EditForm" data-href="$LinkPageHistory">
<%t SilverStripe\\CMS\\Controllers\\CMSMain.TabHistory 'History' %> <%t SilverStripe\\CMS\\Controllers\\CMSMain.TabHistory 'History' %>
</a> </a>
</li> </li>
</ul> </ul>
</div>
</div>
</div> </div>
</div>
<div class="flexbox-area-grow fill-height"> <div class="flexbox-area-grow fill-height">
$EditForm $EditForm
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -1,10 +1,10 @@
<div class="cms-content-tools fill-height cms-panel cms-panel-layout" data-expandOnClick="true" data-layout-type="border" id="cms-content-tools-CMSMain"> <div class="cms-content-tools fill-height cms-panel cms-panel-layout" data-expandOnClick="true" data-layout-type="border" id="cms-content-tools-CMSMain">
<div class="cms-content-header north"> <div class="cms-content-header north vertical-align-items">
<div class="cms-content-header-info vertical-align-items"> <div class="cms-content-header-info vertical-align-items fill-width">
<div class="section-heading"> <div class="section-heading flexbox-area-grow">
<span class="section-label"><a href="$LinkPages">{$MenuCurrentItem.Title}</a></span> <span class="section-label"><a href="$LinkPages">{$MenuCurrentItem.Title}</a></span>
</div> </div>
<% include SilverStripe\\CMS\\Controllers\\CMSMain_Filter %> <% include SilverStripe\\CMS\\Controllers\\CMSMain_Filter %>
</div> </div>
</div> </div>
<div class="panel panel--scrollable flexbox-area-grow fill-height cms-panel-content"> <div class="panel panel--scrollable flexbox-area-grow fill-height cms-panel-content">

View File

@ -1,9 +1,9 @@
<div id="pages-controller-cms-content" class="flexbox-area-grow fill-height cms-content $BaseCSSClasses" data-layout-type="border" data-pjax-fragment="Content"> <div id="pages-controller-cms-content" class="flexbox-area-grow fill-height cms-content $BaseCSSClasses" data-layout-type="border" data-pjax-fragment="Content">
<div class="cms-content-header north"> <div class="cms-content-header north vertical-align-items">
<div class="cms-content-header-info fill-width vertical-align-items"> <div class="cms-content-header-info fill-width vertical-align-items">
<% include SilverStripe\\Admin\\CMSBreadcrumbs %> <% include SilverStripe\\Admin\\CMSBreadcrumbs %>
<% include SilverStripe\\CMS\\Controllers\\CMSMain_Filter %> <% include SilverStripe\\CMS\\Controllers\\CMSMain_Filter %>
</div> </div>
</div> </div>