add font files

kit/functions.php

@@ -14,86 +14,88 @@ function kit_setup() {
 
 add_action( 'after_setup_theme', 'kit_setup' );
 
+// <ul id="menu-hauptmenue" class="">
+//     <li id="menu-item-45" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-45 dropdown"><a title="Über uns" href="#" data-toggle="dropdown" class="dropdown-toggle">Über uns <i class="fa fa-angle-down"></i></a>
+//         <ul role="menu" class=" dropdown-menu">
+//             <li id="menu-item-46" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-46"><a title="MitarbeiterInnen" href="http://localhost:8080/mitarbeiterinnen/">MitarbeiterInnen</a></li>
+//         </ul>
+//     </li>
+// </ul>
+
+// <ul id="menu-hauptmenue" class="">
+//     <li class=' menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children'>
+//       <a href="http://localhost:8080/ueber-uns/">Über uns</a>
+//         <ul class="sub-menu">
+//             <li class=' menu-item menu-item-type-post_type menu-item-object-page'><a href="http://localhost:8080/mitarbeiterinnen/">MitarbeiterInnen</a></li>
+//         </ul>
+//     </li>
+// </ul>
+
 class kit_custom_main_menu extends Walker_Nav_Menu {
 
-	public function start_lvl( &$output, $depth = 0, $args = array() ) {
+  function start_lvl( &$output, $depth = 0, $args = array() ) {
-		$indent = str_repeat( "\t", $depth );
+      // depth dependent classes
-		$output .= "\n$indent<ul role=\"menu\" class=\" dropdown-menu\">\n";
+      $indent = ( $depth > 0  ? str_repeat( "\t", $depth ) : '' ); // code indent
-	}
+      $display_depth = ( $depth + 1); // because it counts the first submenu as 0
+      $classes = array(
+          'sub-menu',
+          'menu-depth-' . $display_depth
+      );
+      $class_names = implode( ' ', $classes );
 
-	public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
+      // build html
-		$indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';
+      if ($display_depth == 1) {
-
+          $output .= "\n" . $indent . '<section class="nav-second-level mega-flyout" style=""><div class="content-wrap"><ul class="' . $class_names . '">' . "\n";
-		$class_names = $value = '';
-
-		$classes = empty( $item->classes ) ? array() : (array) $item->classes;
-		$classes[] = 'menu-item-' . $item->ID;
-
-		/*grab the default wp nav classes*/
-		$class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );
-
-		/*if the current item has children, append the dropdown class*/
-		if ( $args->has_children )
-			$class_names .= ' dropdown';
-
-		/*if there aren't any class names, don't show class attribute*/
-		$class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';
-
-		$id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args );
-		$id = $id ? ' id="' . esc_attr( $id ) . '"' : '';
-
-
-		$output .= $indent . '<li' . $id . $value . $class_names .'>';
-
-		$atts = array();
-		$atts['title']  = ! empty( $item->title )	? $item->title	: '';
-		$atts['target'] = ! empty( $item->target )	? $item->target	: '';
-		$atts['rel']    = ! empty( $item->xfn )		? $item->xfn	: '';
-
-
-		/*if the current menu item has children and it's the parent, set the dropdown attributes*/
-		if ( $args->has_children && $depth === 0 ) {
-			$atts['href']   		= '#';
-			$atts['data-toggle']	= 'dropdown';
-			$atts['class']			= 'dropdown-toggle';
       } else {
-			$atts['href'] = ! empty( $item->url ) ? $item->url : '';
+          $output .= "\n" . $indent . '<ul class="' . $class_names . '">' . "\n";
-		}
-
-		$atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args );
-
-		$attributes = '';
-		foreach ( $atts as $attr => $value ) {
-			if ( ! empty( $value ) ) {
-				$value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
-				$attributes .= ' ' . $attr . '="' . $value . '"';
       }
   }
 
-		$item_output = $args->before;
+  function end_lvl( &$output, $depth = 0, $args = array() ) {
 
-		$item_output .= '<a'. $attributes .'>';
+      $indent = ( $depth > 0  ? str_repeat( "\t", $depth ) : '' ); // code indent
+      $display_depth = ( $depth + 1); // because it counts the first submenu as 0
+      $classes = array(
+          'sub-menu',
+          'menu-depth-' . $display_depth
+      );
+      $class_names = implode( ' ', $classes );
 
-		$item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
+      // build html
-
+      if ($display_depth == 1) {
-	/*	if the current menu item has children and it's the parent item, append the fa-angle-down icon*/
+          $output .= "\n" . $indent . '</ul></div></section>' . "\n";
-		$item_output .= ( $args->has_children && $depth === 0 ) ? ' <i class="fa fa-angle-down"></i></a>' : '</a>';
+      } else {
-		$item_output .= $args->after;
+          $output .= "\n" . $indent . '</ul>' . "\n";
-
-		$output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
-
-	}
-
-
-	public function display_element( $element, &$children_elements, $max_depth, $depth, $args, &$output ) {
-		if ( ! $element )
-			return;
-
-		$id_field = $this->db_fields['id'];
-
-		if ( is_object( $args[0] ) )
-			$args[0]->has_children = ! empty( $children_elements[ $element->$id_field ] );
-
-		parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );
       }
+  }
+
+    function start_el(&$output, $item, $depth = 0, $args=array(), $id = 0) {
+    	$object = $item->object;
+    	$type = $item->type;
+    	$title = $item->title;
+    	$description = $item->description;
+    	$permalink = $item->url;
+
+      $output .= "<li class='" .  implode(" ", $item->classes) . "'>";
+
+      //Add SPAN if no Permalink
+      if( $permalink && $permalink != '#' ) {
+      	$output .= '<a href="' . $permalink . '">';
+      } else {
+      	$output .= '<span>';
+      }
+
+      $output .= $title;
+
+      if( $description != '' && $depth == 0 ) {
+      	$output .= '<small class="description">' . $description . '</small>';
+      }
+
+      if( $permalink && $permalink != '#' ) {
+      	$output .= '</a>';
+      } else {
+      	$output .= '</span>';
+      }
+    }
+
 }

kit/style.css

@@ -1244,84 +1244,84 @@ body.page-theme-color-quaternary h2::after {
   font-family: 'Roboto';
   font-style: normal;
   font-weight: 100;
-  src: local("Roboto Thin"), local("Roboto-Thin"), url("../fonts/roboto-v18-latin-100.woff2") format("woff2"), url("../fonts/roboto-v18-latin-100.woff") format("woff");
+  src: local("Roboto Thin"), local("Roboto-Thin"), url("fonts/roboto-v18-latin-100.woff2") format("woff2"), url("fonts/roboto-v18-latin-100.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: italic;
   font-weight: 100;
-  src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), url("../fonts/roboto-v18-latin-100italic.woff2") format("woff2"), url("../fonts/roboto-v18-latin-100italic.woff") format("woff");
+  src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), url("fonts/roboto-v18-latin-100italic.woff2") format("woff2"), url("fonts/roboto-v18-latin-100italic.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: normal;
   font-weight: 300;
-  src: local("Roboto Light"), local("Roboto-Light"), url("../fonts/roboto-v18-latin-300.woff2") format("woff2"), url("../fonts/roboto-v18-latin-300.woff") format("woff");
+  src: local("Roboto Light"), local("Roboto-Light"), url("fonts/roboto-v18-latin-300.woff2") format("woff2"), url("fonts/roboto-v18-latin-300.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: normal;
   font-weight: 400;
-  src: local("Roboto"), local("Roboto-Regular"), url("../fonts/roboto-v18-latin-regular.woff2") format("woff2"), url("../fonts/roboto-v18-latin-regular.woff") format("woff");
+  src: local("Roboto"), local("Roboto-Regular"), url("fonts/roboto-v18-latin-regular.woff2") format("woff2"), url("fonts/roboto-v18-latin-regular.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: italic;
   font-weight: 400;
-  src: local("Roboto Italic"), local("Roboto-Italic"), url("../fonts/roboto-v18-latin-italic.woff2") format("woff2"), url("../fonts/roboto-v18-latin-italic.woff") format("woff");
+  src: local("Roboto Italic"), local("Roboto-Italic"), url("fonts/roboto-v18-latin-italic.woff2") format("woff2"), url("fonts/roboto-v18-latin-italic.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: italic;
   font-weight: 300;
-  src: local("Roboto Light Italic"), local("Roboto-LightItalic"), url("../fonts/roboto-v18-latin-300italic.woff2") format("woff2"), url("../fonts/roboto-v18-latin-300italic.woff") format("woff");
+  src: local("Roboto Light Italic"), local("Roboto-LightItalic"), url("fonts/roboto-v18-latin-300italic.woff2") format("woff2"), url("fonts/roboto-v18-latin-300italic.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: normal;
   font-weight: 500;
-  src: local("Roboto Medium"), local("Roboto-Medium"), url("../fonts/roboto-v18-latin-500.woff2") format("woff2"), url("../fonts/roboto-v18-latin-500.woff") format("woff");
+  src: local("Roboto Medium"), local("Roboto-Medium"), url("fonts/roboto-v18-latin-500.woff2") format("woff2"), url("fonts/roboto-v18-latin-500.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: normal;
   font-weight: 700;
-  src: local("Roboto Bold"), local("Roboto-Bold"), url("../fonts/roboto-v18-latin-700.woff2") format("woff2"), url("../fonts/roboto-v18-latin-700.woff") format("woff");
+  src: local("Roboto Bold"), local("Roboto-Bold"), url("fonts/roboto-v18-latin-700.woff2") format("woff2"), url("fonts/roboto-v18-latin-700.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: italic;
   font-weight: 700;
-  src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), url("../fonts/roboto-v18-latin-700italic.woff2") format("woff2"), url("../fonts/roboto-v18-latin-700italic.woff") format("woff");
+  src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), url("fonts/roboto-v18-latin-700italic.woff2") format("woff2"), url("fonts/roboto-v18-latin-700italic.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: italic;
   font-weight: 500;
-  src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url("../fonts/roboto-v18-latin-500italic.woff2") format("woff2"), url("../fonts/roboto-v18-latin-500italic.woff") format("woff");
+  src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url("fonts/roboto-v18-latin-500italic.woff2") format("woff2"), url("fonts/roboto-v18-latin-500italic.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: normal;
   font-weight: 900;
-  src: local("Roboto Black"), local("Roboto-Black"), url("../fonts/roboto-v18-latin-900.woff2") format("woff2"), url("../fonts/roboto-v18-latin-900.woff") format("woff");
+  src: local("Roboto Black"), local("Roboto-Black"), url("fonts/roboto-v18-latin-900.woff2") format("woff2"), url("fonts/roboto-v18-latin-900.woff") format("woff");
 }
 
 @font-face {
   font-family: 'Roboto';
   font-style: italic;
   font-weight: 900;
-  src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), url("../fonts/roboto-v18-latin-900italic.woff2") format("woff2"), url("../fonts/roboto-v18-latin-900italic.woff") format("woff");
+  src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), url("fonts/roboto-v18-latin-900italic.woff2") format("woff2"), url("fonts/roboto-v18-latin-900italic.woff") format("woff");
 }
 
 /* header & header menu in seperate css file */