danielsiepmann/ds-site
danielsiepmann/ds-site
1
0
Code Activity

Add full page size layout

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

22
Configuration/PageTSconfig/Mod/WebLayout/BackendLayouts/Full.tsconfig Normal file
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
}
}
}
}
}
}
}
}

21
Resources/Private/Layouts/Page/Full.html Normal file
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>

2
Resources/Private/Sass/Frontend/_layout.scss
View file

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

2
Resources/Private/Sass/Frontend/layout/page/_blogPost.scss → Resources/Private/Sass/Frontend/layout/page/_blogPost-and-full.scss
View file

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

26
Resources/Private/Templates/Page/Full.html Normal file
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>