Event-Dropdown

Kombination von Überschrift und Select-Box um ein Event auszuwählen. Nach Auswahl eines Events wird der Benutzer per JavaScript zur entsprechenden Einstiegsseite geleitet.

Die Select-Box beeinhaltet ein Suchfeld, mit dem der Benutzer die verfügbaren Veranstaltungen eingrenzen kann.

Benutzt auf 02.choose-event.html. Benötigt jQuery-Plugin 'select2.js'.

Überschrift
Optionale Unterüberschrift


                
<!-- src/frontend/templates/modules/choose-event-select.twig -->
<div class="choose-event-select">
    
<!-- src/frontend/templates/elements/headlines/headline-h1.twig -->
<h1>
    Überschrift
    <br />
        <span class="font-light">Optionale Unterüberschrift</span>
    
</h1>


    
</div>

Event Buttons

Kombination von Überschrift und Buttons für aktuelle Events. Das Logo wird per inline Style auf den Button gesetzt. Da die Buttons einen weißen Hintergrund haben, sollte das Modul auf hellgrau eingesetzt werden.

Benutzt auf 02.choose-event.html

Überschrift

Automechanika Frankfurt

Frankfurter Buchmesse

Heimtextil

Paper World


                
<!-- src/frontend/templates/modules/choose-event-buttons.twig -->
<div class="choose-event-current">

    
        
<!-- src/frontend/templates/elements/headlines/headline-h2.twig -->
<h2 class="font-light">
    Überschrift
</h2>

    


    <div class="columns is-clearfix">
        
            <div class="column is-quarter-desktop is-third-tablet">
                
<!-- src/frontend/templates/elements/buttons/button-logo.twig -->
<a href="." class="button-logo">
    <span style="background-image: url(../resources/svg/logos/automechanika-ffm.svg)">Automechanika Frankfurt</span>
</a>

            </div>
        
            <div class="column is-quarter-desktop is-third-tablet">
                
<!-- src/frontend/templates/elements/buttons/button-logo.twig -->
<a href="." class="button-logo">
    <span style="background-image: url(../resources/svg/logos/frankfurter-buchmesse.svg)">Frankfurter Buchmesse</span>
</a>

            </div>
        
            <div class="column is-quarter-desktop is-third-tablet">
                
<!-- src/frontend/templates/elements/buttons/button-logo.twig -->
<a href="." class="button-logo">
    <span style="background-image: url(../resources/svg/logos/heimtextil.svg)">Heimtextil</span>
</a>

            </div>
        
            <div class="column is-quarter-desktop is-third-tablet">
                
<!-- src/frontend/templates/elements/buttons/button-logo.twig -->
<a href="." class="button-logo">
    <span style="background-image: url(../resources/svg/logos/paperworld.svg)">Paper World</span>
</a>

            </div>
        
    </div>

</div>

Stand Buttons

Kombination von Überschriften und Buttons für gebuchte Stände.

Benutzt auf 03.choose-booth.html

Überschrift
Unterüberschrift

Halle
Stand
Messename
Jahr Halle 1.0
B01
Messename
Jahr Halle 10.4
B02
Messename
Jahr


                
<!-- src/frontend/templates/modules/choose-booth-buttons.twig -->
<div class="choose-booth">

    
<!-- src/frontend/templates/elements/headlines/headline-h1.twig -->
<h1>
    Überschrift
    <br />
        <span class="font-light">Unterüberschrift</span>
    
</h1>


    <div class="choose-booth-buttons is-clearfix">

        
            
<!-- src/frontend/templates/elements/buttons/button-booth.twig -->
<a href="." class="button-booth color-event bg-color-event-hover border-color-event border-color-event-hover">
    <span class="hall">Halle</span><br />
    <span class="booth">Stand</span><br />
    <span class="fair">Messename<br />Jahr</span>
    <span class="color-event icon "></span>
</a>

        
            
<!-- src/frontend/templates/elements/buttons/button-booth.twig -->
<a href="." class="button-booth color-event bg-color-event-hover border-color-event border-color-event-hover">
    <span class="hall">Halle 1.0</span><br />
    <span class="booth">B01</span><br />
    <span class="fair">Messename<br />Jahr</span>
    <span class="color-event icon "></span>
</a>

        
            
<!-- src/frontend/templates/elements/buttons/button-booth.twig -->
<a href="." class="button-booth color-event bg-color-event-hover border-color-event border-color-event-hover">
    <span class="hall">Halle 10.4</span><br />
    <span class="booth">B02</span><br />
    <span class="fair">Messename<br />Jahr</span>
    <span class="color-event icon "></span>
</a>

        

    </div>

</div>

Auswahl Module