Create a gist now

Instantly share code, notes, and snippets.

Bootstrap NodeTypes Package
{namespace ts=TYPO3\TypoScript\ViewHelpers}
<div class="panel-group" id="#{node.name}" role="tablist" aria-multiselectable="true">
{accordionTabs -> f:format.raw()}
</div>
{namespace neos=TYPO3\Neos\ViewHelpers}
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="heading-{node.name}">
<h4 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#{parent.name}" href="#collapse-{node.name}" aria-expanded="true" aria-controls="collapse-{node.name}">
{neos:contentElement.editable(property: 'title', tag: 'h3', class: 'panel-title')}
</a>
</h4>
</div>
<div id="collapse-{node.name}" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
{neos:contentElement.editable(property: 'body', tag: 'div', class: 'panel-body')}
</div>
</div>
'Js.Bootstrap:Accordion':
superTypes: ['TYPO3.Neos:Content']
ui:
label: 'Accordion'
icon: 'icon-reorder'
group: 'bootstrap'
childNodes:
accordionTabs:
type: 'TYPO3.Neos:ContentCollection'
constraints:
nodeTypes:
'*': FALSE
'Js.Bootstrap:Panel': TRUE
prototype(Js.Bootstrap:Accordion) < prototype(TYPO3.Neos:Content) {
templatePath = 'resource://Js.Bootstrap/Private/Templates/NodeTypes/Accordion.html'
accordionTabs = TYPO3.Neos:ContentCollection {
nodePath = 'accordionTabs'
}
prototype(Js.Bootstrap:Panel) {
templatePath = 'resource://Js.Bootstrap/Private/Templates/NodeTypes/AccordionItem.html'
parent = ${q(node).parent().parent().get(0)}
}
}
'Js.Bootstrap:Panel':
superTypes: ['TYPO3.Neos:Content']
ui:
label: 'Panel'
icon: 'icon-folder-close'
group: 'bootstrap'
properties:
title:
type: 'string'
defaultValue: 'Your panel headline ...'
ui:
label: 'Panel Titel'
inlineEditable: TRUE
body:
type: 'string'
defaultValue: 'Your panel body ...'
ui:
label: 'Panel Content'
inlineEditable: TRUE
{namespace neos=TYPO3\Neos\ViewHelpers}
<div class="panel panel-default">
<div class="panel-heading">
{neos:contentElement.editable(property: 'title', tag: 'h3', class: 'panel-title')}
</div>
{neos:contentElement.editable(property: 'body', tag: 'div', class: 'panel-body')}
</div>
prototype(Js.Bootstrap:Panel) < prototype(TYPO3.Neos:Content) {
templatePath = 'resource://Js.Bootstrap/Private/Templates/NodeTypes/Panel.html'
# Title property
title = ${q(node).property('title')}
# Body property
body = ${q(node).property('body')}
}
#
# Add NodeType Group "bootstrap"
#
TYPO3:
Neos:
typoScript:
autoInclude:
'Js.Bootstrap': TRUE
nodeTypes:
groups:
bootstrap:
label: 'Bootstrap 3 Elements'
position: 40
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment