Commit 32af60f8 authored by Thomas Löffler's avatar Thomas Löffler

Add typo3 universe header element

* Remove meta navigation in head and in navigation on mobile view
* Add lint rule to ignore new css type
* Add JS and markup for new navigation

Closes: #619
parent 54efeda9
......@@ -146,7 +146,12 @@
"selector-pseudo-element-colon-notation": "single",
"selector-pseudo-element-no-unknown": true,
"selector-type-case": "lower",
"selector-type-no-unknown": true,
"selector-type-no-unknown": [
true,
{
"ignoreTypes": ["/^typo3-/"]
}
],
"shorthand-property-no-redundant-values": true,
"string-no-newline": true,
"unit-case": "lower",
......
.page-container {
padding-top: 44px;
}
typo3-universe {
z-index: 1001;
position: absolute;
top: 0;
left: 0;
right: 0;
--universe-link-background: #fff;
--universe-link-color: #212121;
--universe-link-hover-background: #f2f2f2;
--universe-link-hover-color: #212121;
--universe-background-color: #fff;
--universe-button-background: #f2f2f2;
--universe-button-color: #212121;
--universe-button-hover-background: #e2e2e2;
--universe-button-hover-color: #212121;
--universe-caret-color: #f49700;
--universe-maxwidth: 1170px;
}
@media (max-width: 991.99px) {
typo3-universe {
position: fixed;
}
.main-header .main-header__bottom {
top: 44px;
}
.main-nav__collapse {
top: 100px;
max-height: calc(100vh - 100px);
}
}
......@@ -59,6 +59,7 @@
@import "layout/infoBanner";
@import "layout/alert-fixed";
@import "layout/lightbox";
@import "layout/typo3-universe";
// Components
//
......
......@@ -5,5 +5,10 @@ page {
includeJSFooterlibs {
t3olayout = EXT:t3olayout/Resources/Public/JavaScript/main.min.js
typo3infrastructure = https://typo3.azureedge.net/typo3infrastructure/universe/dist/webcomponents-loader.js
typo3infrastructure.external = 1
typo3universe = https://typo3.azureedge.net/typo3infrastructure/universe/dist/typo3-universe.js
typo3universe.external = 1
typo3universe.type = module
}
}
<typo3-universe active="{settings.platformKey}">
<!-- Fallback to consume the defined space on loading and no component support -->
<div style="display: block; height: 44px; background-color: #fff;"></div>
</typo3-universe>
<f:render section="Main"/>
......@@ -19,13 +19,6 @@
<header class="container-fluid main-header">
<div class="row clearfix main-header__top">
<div class="col-12 pull-right">
<div class="container m-auto text-right">
<f:render partial="Page/Meta" section="Meta" arguments="{_all}" />
</div>
</div>
</div>
<div class="main-header__bottom">
<div class="container m-auto">
<f:render partial="Page/Navigation" section="Navigation" arguments="{_all}" />
......
<div xmlns="http://www.w3.org/1999/xhtml" lang="en"
xmlns:f="http://xsd.helhum.io/ns/typo3/cms-fluid/master/ViewHelpers"
data-namespace-typo3-fluid="true">
<f:section name="Meta">
<ul class="navbar-nav main-nav__list main-nav__meta-nav">
<f:for each="{metanavigation}" as="metaitem">
<li class="main-nav__meta-nav_item{f:if(condition: metaitem.active, then: ' active', else: '')}">
<f:link.typolink title="{metaitem.data.description}" parameter="{metaitem.link}">
<f:if condition="{metaitem.meta_icon}">
<f:image class="main-nav__meta-nav_item-icon img-fluid" image="{metaitem.meta_icon.0}" alt="{metaitem.meta_icon.0.description}" />
</f:if>
{metaitem.title}
</f:link.typolink>
</li>
</f:for>
</ul>
</f:section>
</div>
......@@ -33,8 +33,6 @@
</form>
<!-- END OF solr search form -->
</div>
<f:render partial="Page/Meta" section="Meta" arguments="{_all}" />
</div>
</div>
</nav>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment