// src/components/apps/extranet/category-overview/app-category-overview/schema.yaml

$schema: http://json-schema.org/draft-07/schema
$id: https://finstral.com/apps/extranet/category-overview/app-category-overview
type: object
required:
  - categories
  - title
additionalProperties: false
properties:
  categories:
    heading:
      type: string
    items:
      type: array
      card:
        type: string
        format: html
  title:
    type: string

// src/components/apps/extranet/category-overview/app-category-overview/mocks.yaml

categories:
  heading: Kategorien
  items:
    - $tpl: elements/link-card
      $ref: elements/link-card#Extranet Category Card
      link:
        label: Handbücher
    - $tpl: elements/link-card
      $ref: elements/link-card#Extranet Category Card
      link:
        label: Finstral-Logo
    - $tpl: elements/link-card
      $ref: elements/link-card#Extranet Category Card
      link:
        label: Prospekte und Anleitungen
    - $tpl: elements/link-card
      $ref: elements/link-card#Extranet Category Card
      link:
        label: Produktdatenblätter
    - $tpl: elements/link-card
      $ref: elements/link-card#Extranet Category Card
      link:
        label: Filme
title: Marketing

// src/components/apps/extranet/category-overview/app-category-overview/app-category-overview.twig

{{ attach_library('finstral_global/apps-app-category-overview') }}

<article class="u-container">
	<h1 class="u-typo-HeadlineM">
		{{ title }}
	</h1>

	<section class="ExtranetCategoryOverview-categories">
		{% include "@patterns/teaser-card-list/teaser-card-list.twig" with {
			heading: categories.heading,
			items: categories.items,
		} only %}
	</section>
</article>