blechreiz-website/website/templates/website/mainpage.html

{% extends "website/base.html" %}


{% load sekizai_tags staticfiles %}


{% block feature_slider %}
	
	{% addtoblock "css" %}
	<style>
	
	#eventManagement.slide .info {
	    position: absolute;
	    top: 260px;
	    left: 8%;
	    width: 24%;
	    display: none;
	    z-index: 10;
	}
	#eventManagement.slide .info a {
	    text-transform: uppercase;
	    color: rgb(255, 255, 255);
	    background: none repeat scroll 0% 0% rgb(166, 3, 3);
	    font-size: 25px;
	    font-weight: bolder;
	    padding: 15px 24px;
	    border: 0px none;
	    border-radius: 6px 6px 6px 6px;
	    transition: background 0.2s linear 0s, box-shadow 0.2s linear 0s;
	}
	#eventManagement.slide .info .subtitle  {
		margin: 25px;
		font-size: 20px;
		font-style: italic;
	}
	#eventManagement.slide .info .subtitlebg
	{
		background: none repeat scroll 0% 0% rgb(243, 243, 243);
		padding: 15px 24px;
		border-radius: 6px 6px 6px 6px;
	
	}
	
	
	</style>
	{% endaddtoblock %}   
	
    <section id="feature_slider" class="">
		<article class="slide" id="eventManagement" style="background: url('{{STATIC_URL}}/img/slides/blechreiz01/andi2.jpg') repeat-x top center;">
            <div class="info">
                <a href="/events">Einsatzplanung</a>
                <div class="subtitle subtitlebg">
                	{% if hasParticipationSetForAllEvents %}
                	Sehr gut - du hast dich für alles eingetragen 
                	{% else %}
                		Du hast dich noch nicht für alle Termine eingetragen!!
                	{% endif %}
                </div>
            </div>
        </article>
		
		<article class="slide" id="eventManagement" style="background: url('{{STATIC_URL}}/img/backgrounds/silver.jpg') repeat-x top center;">
            <img class="asset left-30 sp600 t120 z1" src="{{STATIC_URL}}/img/slides/blechreiz01/gruppe.png" />
            <div class="info">
                <a href="/messages">Forum</a>
                <div class="subtitle"> Nachricht an alle schreiben... </div>
            </div>
        </article>
    </section>

{% endblock %}

{% block content %}

	{% addtoblock "css" strip %}<link rel="stylesheet" type="text/css" href="{{STATIC_URL}}/css/lib/animate.css" media="screen, projection">{% endaddtoblock %}                                                       
	{% addtoblock "css" strip %}<link rel="stylesheet" href="{{STATIC_URL}}/css/coming-soon.css" type="text/css" media="screen" />{% endaddtoblock %}                                    
	
	
	{% addtoblock "js" %}
	    <script type="text/javascript">
        $(function () {
        

            
            function callback(event) {
                $this = $(this);
                $this.find('span#'+event.type).html(event.value);
                switch(event.type) {
                    case "seconds":
                    case "minutes":
                    case "hours":
                    case "days":
                    case "weeks":
                    case "daysLeft":
                    case "finished":
                }
            }
      
            $('div#clock').countdown(new Date().valueOf() + {{epoch}} , callback);
        });
    	</script>
	{% endaddtoblock %}



    <div id="coming_soon">
        <div class="head">
            <div class="container">
	           <div class="span6 text">
	               <h4>Der nächste Termin:</h4>
	               <p>
	                   {{event.title}} ist am {{event.date}} um {{event.displaytime | time:"H:i" }} in {{event.location}} 
	                   
	                   <br/>
	                   {% if participation == "?" %}
	                   		Du hast dich noch nicht für diesen Termin eingetragen!
	                   {% elif participation == "Yes" %}
	                   		Du hast für diesen Termin zugesagt.
	                   {% elif participation == "No" %}
	                   		Du hast für diesen Termin abgesagt.
	                   {%endif %}
	               </p>
	           </div>
                <div class="span6 count" id="clock">
                    <div class="box last">
                        <div class="circle">
                            <span id="seconds"></span>
                        </div>
                        <p>Sekunden</p>
                    </div>
                    <div class="box">
                        <div class="circle">
                            <span id="minutes"></span>
                        </div>
                        <p>Minuten</p>
                    </div>
                    <div class="box">
                        <div class="circle">
                            <span id="hours"></span>
                        </div>
                        <p>Stunden</p>
                    </div>
                    <div class="box">
                        <div class="circle">
                            <span id="days"></span>
                        </div>
                        <p>Tage</p>
                    </div>
                   <!--  <div class="box">
                        <div class="circle">
                            <span id="weeks"></span>
                        </div>
                        <p>Weeks</p>
                    </div> -->
                </div>
            </div>
        </div>
	</div>

{% endblock %}