<main role="main">
    <header class="standard-header visual-trainings-04-bg-image">
        <h1 class="standard-header__title standard-header__title--separated">Unser Schulungsangebot</h1>
        <div class="standard-header__intro">
            <h2>Weil wir Wissen gerne mit Ihnen teilen</h2>
            <div class="standard-header__intro__text">Sich auf das Wissen von Beratern und externen Dienstleistern zu verlassen
                ist das Eine, das Wissen im eigenen Haus zu vertiefen, um die Leistung
                Dritter beurteilen zu können das Andere. INNOQ unterstützt Sie natürlich
                auch beim „Anderen“, sodass Sie nicht immer auf unsere Projektbegleitung
                angewiesen sind.</div>
        </div>
    </header>
    <article class="page-layout--grid">
        <section class="center">
            <p>Wir bieten Schulungen zu bewährten und aktuellen Themen an. Dabei achten
                wir immer darauf, dass die Inhalte einen hohen Praxisbezug haben und wenden
                einprägsame Methoden an.</p>
            <p>Darüber hinaus können Ihre Mitarbeiter bei uns Ausbildungen zum iSAQB
                Certified Professional for Software Architecture (CPSA) – Foundation Level
                besuchen und sich anschließend zertifizieren lassen.</p>
        </section>
    </article>
    <article class="stripe stripe--primary">
        <section class="page-layout-md--default">
            <h3 class="section-heading--primary">Unser Schulungsangebot im Überblick</h3><a class=" list-teaser-training primary">
                <div class="list-teaser__body">
                    <h2 class="list-teaser-training__headline">Titel</h2>
                    <div class="list-teaser-training__caption">Untertitel</div>
                </div>
                <div class="list-teaser__footer"><span class="link-teaser inverted-text-color">Termine &amp; Details</span></div>
            </a>
            <a class="list-teaser-training secondary">
                <div class="list-teaser__body">
                    <h2 class="list-teaser-training__headline">Titel</h2>
                    <div class="list-teaser-training__caption">Untertitel</div>
                </div>
                <div class="list-teaser__footer"><span class="link-teaser inverted-interaction-color">Termine &amp; Details</span>
                </div>
            </a>
            <div class="blocks"><a href="#" class="case-tile-teaser case-tile-teaser-bg-image-training case-tile-teaser--sm">
                    <div class="case-tile-teaser__content case-tile-teaser__content--sm">
                        <div class="case-tile-teaser__body">
                            <h2 class="case-tile-teaser__caption">Training Caption</h2>
                            <h2 class="case-tile-teaser__headline case-tile-teaser__headline--sm">Training Headline</h2>
                            <p class="case-tile-teaser__text case-tile-teaser__text--sm">
                                <div class="label-big badge">Interaktiv!</div>
                            </p>
                        </div>
                        <div class="case-tile-teaser__goto"><span class="link-teaser">Termine &amp; Details</span></div>
                    </div>
                </a>
                <a href="#" class="case-tile-teaser case-tile-teaser-bg-image-training case-tile-teaser--sm">
                    <div class="case-tile-teaser__content case-tile-teaser__content--sm">
                        <div class="case-tile-teaser__body">
                            <h2 class="case-tile-teaser__caption">Training Caption</h2>
                            <h2 class="case-tile-teaser__headline case-tile-teaser__headline--sm">Training Headline</h2>
                            <p class="case-tile-teaser__text case-tile-teaser__text--sm"></p>
                        </div>
                        <div class="case-tile-teaser__goto"><span class="link-teaser">Termine &amp; Details</span>
                        </div>
                    </div>
                </a>
            </div>
            <div class="blocks"><a href="#" class="case-tile-teaser case-tile-teaser-bg-image-training case-tile-teaser--sm">
                    <div class="case-tile-teaser__content case-tile-teaser__content--sm">
                        <div class="case-tile-teaser__body">
                            <h2 class="case-tile-teaser__caption">Training Caption</h2>
                            <h2 class="case-tile-teaser__headline case-tile-teaser__headline--sm">Training Headline</h2>
                            <p class="case-tile-teaser__text case-tile-teaser__text--sm"></p>
                        </div>
                        <div class="case-tile-teaser__goto"><span class="link-teaser">Termine &amp; Details</span></div>
                    </div>
                </a>
                <a href="#" class="case-tile-teaser case-tile-teaser-bg-image-training case-tile-teaser--sm">
                    <div class="case-tile-teaser__content case-tile-teaser__content--sm">
                        <div class="case-tile-teaser__body">
                            <h2 class="case-tile-teaser__caption">Training Caption</h2>
                            <h2 class="case-tile-teaser__headline case-tile-teaser__headline--sm">Training Headline</h2>
                            <p class="case-tile-teaser__text case-tile-teaser__text--sm"></p>
                        </div>
                        <div class="case-tile-teaser__goto"><span class="link-teaser">Termine &amp; Details</span>
                        </div>
                    </div>
                </a>
            </div>
        </section>
    </article>
    <article class="page-layout--grid">
        <section class="center">
            <h3 class="section-heading--primary">Unsere Inhouse Schulungen</h3>
            <div class="blocks">
                <div class="simple-teaser">
                    <div class="simple-teaser__body"><a class="simple-teaser__link">
                            <h5>Inhouse Schulung Titel</h5>
                            <h6>Das ist ein Untertitel</h6>
                        </a>
                    </div>
                    <div class="simple-teaser__footer">
                        <button class="btn btn--small btn--cta" data-label="Jetzt anfragen!">Jetzt anfragen!</button>
                    </div>
                </div>
                <div class="simple-teaser">
                    <div class="simple-teaser__body"><a class="simple-teaser__link">
                            <h5>Inhouse Schulung Titel</h5>
                            <h6>Das ist ein Untertitel</h6>
                        </a>
                    </div>
                    <div class="simple-teaser__footer">
                        <button class="btn btn--small btn--cta" data-label="Jetzt anfragen!">Jetzt anfragen!</button>
                    </div>
                </div>
            </div>
            <div class="blocks">
                <div class="simple-teaser">
                    <div class="simple-teaser__body"><a class="simple-teaser__link">
                            <h5>Inhouse Schulung Titel</h5>
                            <h6>Das ist ein Untertitel</h6>
                        </a>
                    </div>
                    <div class="simple-teaser__footer">
                        <button class="btn btn--small btn--cta" data-label="Jetzt anfragen!">Jetzt anfragen!</button>
                    </div>
                </div>
                <div class="simple-teaser">
                    <div class="simple-teaser__body"><a class="simple-teaser__link">
                            <h5>Inhouse Schulung Titel</h5>
                            <h6>Das ist ein Untertitel</h6>
                        </a>
                    </div>
                    <div class="simple-teaser__footer">
                        <button class="btn btn--small btn--cta" data-label="Jetzt anfragen!">Jetzt anfragen!</button>
                    </div>
                </div>
            </div>
            <div class="blocks">
                <div class="simple-teaser">
                    <div class="simple-teaser__body"><a class="simple-teaser__link">
                            <h5>Inhouse Schulung Titel</h5>
                            <h6>Das ist ein Untertitel</h6>
                        </a>
                    </div>
                    <div class="simple-teaser__footer">
                        <button class="btn btn--small btn--cta" data-label="Jetzt anfragen!">Jetzt anfragen!</button>
                    </div>
                </div>
                <div class="simple-teaser">
                    <div class="simple-teaser__body"><a class="simple-teaser__link">
                            <h5>Inhouse Schulung Titel</h5>
                            <h6>Das ist ein Untertitel</h6>
                        </a>
                    </div>
                    <div class="simple-teaser__footer">
                        <button class="btn btn--small btn--cta" data-label="Jetzt anfragen!">Jetzt anfragen!</button>
                    </div>
                </div>
            </div>
            <div class="blocks">
                <div class="simple-teaser">
                    <div class="simple-teaser__body"><a class="simple-teaser__link">
                            <h5>Inhouse Schulung Titel</h5>
                            <h6>Das ist ein Untertitel</h6>
                        </a>
                    </div>
                    <div class="simple-teaser__footer">
                        <button class="btn btn--small btn--cta" data-label="Jetzt anfragen!">Jetzt anfragen!</button>
                    </div>
                </div>
                <div class="simple-teaser">
                    <div class="simple-teaser__body"><a class="simple-teaser__link">
                            <h5>Inhouse Schulung Titel</h5>
                            <h6>Das ist ein Untertitel</h6>
                        </a>
                    </div>
                    <div class="simple-teaser__footer">
                        <button class="btn btn--small btn--cta" data-label="Jetzt anfragen!">Jetzt anfragen!</button>
                    </div>
                </div>
            </div>
        </section>
    </article>
    <section class="breakout">
        <div class="case-teaser case-teaser--simple case-teaser--left-aligned visual-trainings-03-bg-image">
            <div class="case-teaser__wrapper">
                <div class="case-teaser__body">
                    <div>
                        <div class="case-teaser__caption">Individuelle Schulungen</div>
                        <div>
                            <div class="case-teaser__header">
                                <h1>Auf Ihr Bedürfnis angepasst</h1>
                            </div>
                            <div class="case-teaser__text">Ich erhalte Informationen dazu, das ich die Schulungsinhalte individualisieren
                                kann, den Umfang individualisieren kann, etc. Ich erhalte Informationen
                                dazu, das ich die Schulungsinhalte individualisieren kann, den Umfang individualisieren
                                kann, etc. Ich erhalte Informationen dazu, das ich die Schulungsinhalte
                                individualisieren kann, den Umfang individualisieren kann, etc.</div>
                            <div class="case-teaser__footer"><a href="#" class="btn btn--small btn--cta" data-label="Schulung anfragen">Schulung anfragen</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</main>
import StandardHeader from "./components/02-molecules/visual-elements/header/standard-header"
import { SectionHeading } from "./components/01-atoms/text/block/heading"
import TrainingListTeaser from "./components/02-molecules/visual-elements/teaser/list-teaser/training-list-teaser"
import CaseTileTeaser from "./components/02-molecules/visual-elements/teaser/tile-teaser/case-tile-teaser"
import Label from "./components/01-atoms/text/block/label"
import SimpleTileTeaser from "./components/02-molecules/visual-elements/teaser/tile-teaser/simple-tile-teaser"
import CaseListTeaser from "./components/02-molecules/visual-elements/teaser/list-teaser/case-list-teaser"

<main role="main">
    <StandardHeader title="Unser Schulungsangebot" introTitle="Weil wir Wissen gerne mit Ihnen teilen" additionalClassnames="visual-trainings-04-bg-image" titleSeparated>
        Sich auf das Wissen von Beratern und externen Dienstleistern zu verlassen ist das Eine, das Wissen im eigenen Haus zu vertiefen, um die Leistung Dritter beurteilen zu können das Andere. INNOQ unterstützt Sie natürlich auch beim „Anderen“,
        sodass Sie nicht immer auf unsere Projektbegleitung angewiesen sind.
    </StandardHeader>
    <article class="page-layout--grid">
        <section class="center">
            <p>Wir bieten Schulungen zu bewährten und aktuellen Themen an. Dabei achten wir immer darauf, dass die Inhalte einen hohen Praxisbezug haben und wenden einprägsame Methoden an.</p>
            <p>Darüber hinaus können Ihre Mitarbeiter bei uns Ausbildungen zum iSAQB Certified Professional for Software Architecture (CPSA) – Foundation Level besuchen und sich anschließend zertifizieren lassen.</p>
        </section>
    </article>
    <article class="stripe stripe--primary">
        <section class="page-layout-md--default">
            <SectionHeading primary>Unser Schulungsangebot im Überblick</SectionHeading>
            <TrainingListTeaser primary title="Titel" subtitle="Untertitel" label="Labeltext" linkText="Termine & Details" />
            <TrainingListTeaser secondary title="Titel" subtitle="Untertitel" label="Labeltext" linkText="Termine & Details" />

            <div class="blocks">
                <CaseTileTeaser size="sm" additionalClassnames="case-tile-teaser-bg-image-training" href="#" caption="Training Caption" headline="Training Headline" linkTeaser="Termine &amp; Details">
                    <Label type="badge" big>Interaktiv!</Label>
                </CaseTileTeaser>
                <CaseTileTeaser size="sm" additionalClassnames="case-tile-teaser-bg-image-training" href="#" caption="Training Caption" headline="Training Headline" linkTeaser="Termine &amp; Details" />
            </div>
            <div class="blocks">
                <CaseTileTeaser size="sm" additionalClassnames="case-tile-teaser-bg-image-training" href="#" caption="Training Caption" headline="Training Headline" linkTeaser="Termine &amp; Details" />
                <CaseTileTeaser size="sm" additionalClassnames="case-tile-teaser-bg-image-training" href="#" caption="Training Caption" headline="Training Headline" linkTeaser="Termine &amp; Details" />
            </div>
        </section>
    </article>
    <article class="page-layout--grid">
        <section class="center">
            <SectionHeading primary>Unsere Inhouse Schulungen</SectionHeading>
            <div class="blocks">
                <SimpleTileTeaser title="Inhouse Schulung Titel" subtitle="Das ist ein Untertitel" buttonText="Jetzt anfragen!"></SimpleTileTeaser>
                <SimpleTileTeaser title="Inhouse Schulung Titel" subtitle="Das ist ein Untertitel" buttonText="Jetzt anfragen!"></SimpleTileTeaser>
            </div>
            <div class="blocks">
                <SimpleTileTeaser title="Inhouse Schulung Titel" subtitle="Das ist ein Untertitel" buttonText="Jetzt anfragen!"></SimpleTileTeaser>
                <SimpleTileTeaser title="Inhouse Schulung Titel" subtitle="Das ist ein Untertitel" buttonText="Jetzt anfragen!"></SimpleTileTeaser>
            </div>
            <div class="blocks">
                <SimpleTileTeaser title="Inhouse Schulung Titel" subtitle="Das ist ein Untertitel" buttonText="Jetzt anfragen!"></SimpleTileTeaser>
                <SimpleTileTeaser title="Inhouse Schulung Titel" subtitle="Das ist ein Untertitel" buttonText="Jetzt anfragen!"></SimpleTileTeaser>
            </div>
            <div class="blocks">
                <SimpleTileTeaser title="Inhouse Schulung Titel" subtitle="Das ist ein Untertitel" buttonText="Jetzt anfragen!"></SimpleTileTeaser>
                <SimpleTileTeaser title="Inhouse Schulung Titel" subtitle="Das ist ein Untertitel" buttonText="Jetzt anfragen!"></SimpleTileTeaser>
            </div>
        </section>
    </article>
    <section class="breakout">
        <CaseListTeaser header="Auf Ihr Bedürfnis angepasst" caption="Individuelle Schulungen" href="#" linkText="Schulung anfragen" additionalClasses="visual-trainings-03-bg-image" simple withButton align="left">
            Ich erhalte Informationen dazu, das ich die Schulungsinhalte individualisieren kann, den Umfang
            individualisieren kann, etc. Ich erhalte Informationen dazu, das ich die Schulungsinhalte individualisieren
            kann, den Umfang individualisieren kann, etc. Ich erhalte Informationen dazu, das ich die Schulungsinhalte
            individualisieren kann, den Umfang individualisieren kann, etc.
        </CaseListTeaser>
    </section>
</main>
/* No context defined for this component. */
  • Content:
    .visual-trainings-01-bg-image {
      background-image: linear-gradient($gradient-stencil, $gradient-stencil), asset-url('visual-trainings-01.jpg');
    }
    
    .visual-trainings-02-bg-image {
      background-image: linear-gradient($gradient-stencil, $gradient-stencil), asset-url('visual-trainings-02.jpg');
    }
    
    .visual-trainings-03-bg-image {
      background-image: asset-url('visual-trainings-03.jpg');
    }
    
    .visual-trainings-04-bg-image {
      background-image: linear-gradient($gradient-stencil, $gradient-stencil), asset-url('visual-trainings-04.jpg');
    }
    
    .visual-trainings-05-bg-image {
      background-image: linear-gradient($gradient-stencil, $gradient-stencil), asset-url('visual-trainings-05.jpg');
    }
    
    .visual-trainings-06-bg-image {
      background-image: linear-gradient($gradient-stencil, $gradient-stencil), asset-url('visual-trainings-06.jpg');
    }
    
  • URL: /components/raw/trainings-page/_trainings-page.scss
  • Filesystem Path: components/04-pages/trainings-page/_trainings-page.scss
  • Size: 832 Bytes

There are no notes for this item.