Add full page size layout

This commit is contained in:
Daniel Siepmann 2020-01-23 10:06:00 +01:00
parent 085fcb2025
commit a45150998d
5 changed files with 72 additions and 1 deletions

View file

@ -0,0 +1,22 @@
mod.web_layout.BackendLayouts {
full {
title = Full
icon = content-panel
config {
backend_layout {
colCount = 1
rowCount = 1
rows {
1 {
columns {
1 {
name = Content
colPos = 0
}
}
}
}
}
}
}
}

View file

@ -0,0 +1,21 @@
<html xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers"
data-namespace-typo3-fluid="true">
{f:render(partial: 'Header', arguments: _all) -> f:spaceless()}
<main>
<header>
<h1>{data.title}</h1>
</header>
<article>
<aside>
{f:render(section: 'Aside', arguments: _all) -> f:spaceless()}
</aside>
{f:render(section: 'Content', arguments: _all)}
</article>
</main>
{f:render(partial: 'Footer', arguments: _all)}
</html>

View file

@ -2,7 +2,7 @@
@import "layout/header"; @import "layout/header";
@import "layout/footer"; @import "layout/footer";
@import "layout/content"; @import "layout/content";
@import "layout/page/blogPost"; @import "layout/page/blogPost-and-full";
body { body {
@extend .container; @extend .container;

View file

@ -1,3 +1,4 @@
body.LayoutFull,
body.LayoutBlogPost { body.LayoutBlogPost {
article { article {
@extend .row; @extend .row;
@ -21,6 +22,7 @@ body.LayoutBlogPost {
} }
@media (max-width: 1023px) { @media (max-width: 1023px) {
body.LayoutFull,
body.LayoutBlogPost { body.LayoutBlogPost {
article, article,
article > main { article > main {

View file

@ -0,0 +1,26 @@
<html xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers"
data-namespace-typo3-fluid="true">
<f:layout name="Full" />
<f:section name="Content">
<main>{contentMain -> f:format.raw()}</main>
</f:section>
<f:section name="Aside">
<nav>
<h1>Table of Content</h1>
<ol>
<f:alias map="{contentSections: pageSections.0.content}">
<f:for each="{contentSections}" as="contentEntry">
<f:if condition="{contentEntry.data.header}">
<li>
<a href="#c{contentEntry.data.uid}">{contentEntry.data.header}</a>
</li>
</f:if>
</f:for>
</f:alias>
</ol>
</nav>
</f:section>
</html>