Header Module

ATP Header (keine Veranstaltung ausgewählt)

Der Schlagschatten ist beim normalen Einsatz nur unter dem Modul zu sehen, es sollte auf 100% Breite laufen und oben auf der Seite sitzen.

Benutzt auf 02.choose-event.html.

Ausstellerticketingportal

  • Link 1 

                
<!-- src/frontend/templates/modules/header-atp.twig -->
<header class="atp-header bg-default">
    <div class="wrapper is-clearfix is-relative">
        <h2>
            <a href="" class="color-default">
                Ausstellerticketingportal
            </a>
        </h2>

        <div class="logo">
            Messe Frankfurt
        </div>

        <ul class="atp-primary-navigation is-clearfix">
            
                <li class="color-light">
                    <a href="index.html" class="color-light color-light-darker-hover primary-link">Link 1</a>
                </li>
            
            
                <li class="language-chooser">
                    <form name="language-chooser" method="post" action="../dummy/php/proxy.php">
                        <span class="no-border color-light language-chooser">
                            <select name="language" class="select2 basic-select submit-on-change">
                                
                                    <option value="de">Deutsch</option>
                                
                                    <option value="en">English</option>
                                
                                    <option value="es">Español</option>
                                
                                    <option value="fr">Français</option>
                                
                                    <option value="jp">日本語</option>
                                
                            </select>
                        </span>
                    </form>
                </li>
            
        </ul>
        <div class="hamburger">
            <span class="hamburger-box">
                <span class="hamburger-inner"></span>
            </span>
        </div>
    </div>
</header>

Veranstaltungs-Header

Eingesetzt auf 03.choose-booth.html.

24. － 27.12.2016, Frankfurt am Main

                
<!-- src/frontend/templates/modules/header-event.twig -->
<header class="atp-header-event bg-color-event">
    <div class="wrapper is-clearfix is-relative">
        <div class="event-signature">
            <div class="event-logo" style="background-image: url(../resources/svg/logos/automechanika-ffm-white.svg)">Automechanika Frankfurt</div>
            <div class="event-date-location">24. － 27.12.2016, Frankfurt am Main</div>
        </div>
        
        
    </div>
</header>

Veranstaltungs-Header mit Reiternavigation

Eingesetzt auf 04.dashboard.html.

24. － 27.12.2016, Frankfurt am Main
Halle 10.4, B01 

                
<!-- src/frontend/templates/modules/header-event.twig -->
<header class="atp-header-event bg-color-event">
    <div class="wrapper is-clearfix is-relative has-tabs">
        <div class="event-signature">
            <div class="event-logo" style="background-image: url(../resources/svg/logos/automechanika-ffm-white.svg)">Automechanika Frankfurt</div>
            <div class="event-date-location">24. － 27.12.2016, Frankfurt am Main</div>
        </div>
        
            <div class="event-booth">
                
                    <span class="button-booth-small">
                        Halle 10.4, B01
                    </span>
                
                
            </div>
        
        
            <div class="event-tabs-wrapper">
                <ul class="event-tabs">
                    
                        <li>
                            <a href="04.dashboard.html" class="bg-color-event-darker bg-color-event-darker-hover active">
                                Aktiver Reiter
                            </a>
                        </li>
                    
                        <li>
                            <a href="07.listing.html" class="bg-color-event-darker bg-color-event-darker-hover">
                                Reiter 2
                            </a>
                        </li>
                    
                        <li>
                            <a href="07.listing.html" class="bg-color-event-darker bg-color-event-darker-hover">
                                Reiter 3
                            </a>
                        </li>
                    
                </ul>
            </div>
        
    </div>
</header>

Content Header

Kombination aus Headline 1 und optionalen Button mit Icon.

Eingesetzt auf 08.ticket-listing.html.

Meine Austellertickets
Sie haben 8 Tickets vergeben.

Tickets erstellen 

                
<!-- src/frontend/templates/modules/content-header.twig -->
<div class="content-header">
    
<!-- src/frontend/templates/elements/headlines/headline-h1.twig -->
<h1>
    Meine Austellertickets
    <br />
        <span class="font-light">Sie haben 8 Tickets vergeben.</span>
    
</h1>

    
        
<!-- src/frontend/templates/elements/buttons/button-brand.twig -->

<a href="#" class="button button-brand bg-color-event bg-color-event-darker-hover">
    
        <span class="icon ticket-tilted"> </span>
    
    
        <span>Tickets erstellen</span>
    
</a>

    
</div>