Service-Links, Warenkorb, Suche im Header überarbeitet

Vorbereitung für Versandinfo und Service-Telefonnummer.

frontend/_public/src/less/_modules/header.less

@@ -1,16 +1,49 @@
 /* *** HEADER / BASICS ********************************************************************************************** */
 
+/* Header */
 .header-main {
   background: @brand-primary;
   > div {
     background: @brand-primary; }
   .header--navigation {
-    min-height: 80px!important;
+    min-height: 100px!important;
     .logo--shop {
       a {
+        padding: 5px 0;
         img {
-          min-height: 60px; } } } } }
+          min-height: 70px; } } } } }
 
+/* Suche */
+.entry--search {
+  background: @brand-primary!important;
+  .main-search--form {
+    box-shadow: none!important;
+    label{
+      display: block;
+      width: 10%;
+      padding: 0.7em 0.5em 0 0;
+      float: left;
+      text-transform: uppercase;
+      font-weight: 700;
+      color: #fff; }
+    input{
+      width: 80%!important;
+      float: left;
+      border: none;
+      border-radius: 0;
+      box-shadow: none;
+      background: #fff!important;
+      margin-top: 0.4em!important;
+      padding-top: 0.2em!important;
+      padding-bottom: 0.2em!important;
+      height: 2em!important; }
+    button{
+      width: 10%!important;
+      float: left;
+      i{
+        color: #fff; } } } }
+
+/* Main Navigation */
 .navigation--list-wrapper {
   padding: 0;
   text-align: center;
@@ -29,3 +62,42 @@
           margin-bottom: 0.5em;
           &:before {
             font-size: 35px; } } } } } }
+
+/* Service Navigation */
+.navigation--list {
+  .navigation--entry {
+    .account--link {
+      text-align: center;
+      background: transparent;
+      padding: 0 5px;
+      border-color: transparent;
+      .account--display {
+        display: block;
+        color: #fff;
+        font-weight: 300;
+        padding: 2px 5px!important; }
+      .wbn-icon-set {
+        display: block;
+        height: 35px!important;
+        margin-bottom: 2px;
+        &:before {
+          font-size: 35px;
+          color: #fff; } } }
+    .cart--link {
+      text-align: center;
+      background: transparent;
+      padding: 2px 5px;
+      border-color: transparent;
+      .cart--amount {
+        display: block;
+        color: #fff;
+        font-weight: 300;
+        padding: 2px 5px!important; }
+      .wbn-icon-set {
+        display: block;
+        height: 35px!important;
+        &:before {
+          font-size: 35px;
+          color: #fff; } } } } }
+
+.cssAnker {}

frontend/index/main-navigation.tpl

@@ -2,8 +2,6 @@
 
 {block name='frontend_index_navigation_categories'}
 
-    {debug}
-
     <div class="navigation--list-wrapper">
         {block name='frontend_index_navigation_categories_navigation_list'}
             <ul class="navigation--list container" role="menubar" itemscope="itemscope" itemtype="http://schema.org/SiteNavigationElement">

frontend/index/search.tpl

@@ -0,0 +1,42 @@
+{* Search container *}
+{block name='frontend_index_search_container'}
+    <form action="{url controller='search' fullPath=false}" method="get" class="main-search--form">
+        {block name="frontend_index_search_innerform"}{/block}
+
+        {* Search icon *}
+        {block name='frontend_index_search_icon'}
+            <label>{s name='LabelSearch'}text{/s}</label>
+        {/block}
+
+        {* Search field *}
+        {block name='frontend_index_search_field'}
+            <input type="search" name="sSearch" aria-label="{s name="IndexSearchFieldPlaceholder"}{/s}" class="main-search--field" autocomplete="off" autocapitalize="off" placeholder="{s name="IndexSearchFieldPlaceholder"}{/s}" maxlength="30"  />
+        {/block}
+
+        {* Search input *}
+        {block name='frontend_index_search_field_submit'}
+            <button type="submit" class="main-search--button" aria-label="{s name="IndexSearchFieldSubmit"}{/s}">
+
+                {* Search icon *}
+                {block name='frontend_index_search_field_submit_icon'}
+                    <i class="icon--search"></i>
+                {/block}
+
+                {* Search text *}
+                {block name='frontend_index_search_field_submit_text'}
+                    <span class="main-search--text">{s name="IndexSearchFieldSubmit"}{/s}</span>
+                {/block}
+            </button>
+        {/block}
+
+        {* Ajax loader *}
+        {block name='frontend_index_search_ajax_loader'}
+            <div class="form--ajax-loader">&nbsp;</div>
+        {/block}
+    </form>
+
+    {* Search results *}
+    {block name='frontend_index_search_results'}
+        <div class="main-search--results"></div>
+    {/block}
+{/block}