<!DOCTYPE html> <!–[if lt IE 7]> <html class=“no-js ie6” lang=“en”> <![endif]–> <!–[if IE 7]> <html class=“no-js ie7” lang=“en”> <![endif]–> <!–[if IE 8]> <html class=“no-js ie8” lang=“en”> <![endif]–> <!–[if gt IE 8]><!–> <html class=“no-js” lang=“en”> <!–<![endif]–> <head>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<title>{{ headers['title'] }}</title>

<meta name="generator" content="{{ headers['generator'] }}">
<meta name="author"    content="{{ headers['author'] }}">
<meta name="viewport"  content="width=1024, user-scalable=no">

<!-- Core and extension CSS files -->
<link rel="stylesheet" href="core/deck.core.css">
<link rel="stylesheet" href="extensions/goto/deck.goto.css">
<link rel="stylesheet" href="extensions/menu/deck.menu.css">
<link rel="stylesheet" href="extensions/navigation/deck.navigation.css">
<link rel="stylesheet" href="extensions/status/deck.status.css">
<link rel="stylesheet" href="extensions/hash/deck.hash.css">

<!-- Theme CSS files (menu swaps these out) -->
<link rel="stylesheet" id="style-theme-link" href="themes/style/web-2.0.css">
<link rel="stylesheet" id="transition-theme-link" href="themes/transition/horizontal-slide.css">

<!-- Custom CSS just for this page -->
<!-- GB: changed fixed name to variable -->
<link rel="stylesheet"  href="style.css">

<script src="lib/modernizr.custom.js"></script>

</head>

<body class=“deck-container”>

<div class=“theme-menu”>

<h2>Themes</h2>

<label for="style-themes">Style:</label>
<select id="style-themes">
        <option selected value="themes/style/web-2.0.css">Web 2.0</option>
        <option value="themes/style/swiss.css">Swiss</option>
        <option value="themes/style/neon.css">Neon</option>
        <option value="">None</option>
</select>

<label for="transition-themes">Transition:</label>
<select id="transition-themes">
        <option selected value="themes/transition/horizontal-slide.css">Horizontal Slide</option>
        <option value="themes/transition/vertical-slide.css">Vertical Slide</option>
        <option value="themes/transition/fade.css">Fade</option>
        <option value="">None</option>
</select>

</div>

<section class=“slide” id=“title-slide”>

<h1>{{ headers['title'] }}</h1>

</section>

<!– note: assumes no header (breaking slides w/ SLIDE directive) –> {% for slide in slides %}

<section class="slide" id="{{ forloop.index }}"> <!--fix: add with filter? +1 toindex -title slide is 1 already -->
  {{ slide.content }}
</section>

{% endfor %}

<a href=“#” class=“deck-prev-link” title=“Previous”>&#8592;</a> <a href=“#” class=“deck-next-link” title=“Next”>&#8594;</a>

<p class=“deck-status”>

<span class="deck-status-current"></span>
/
<span class="deck-status-total"></span>

</p>

<form action=“.” method=“get” class=“goto-form”>

<label for="goto-slide">Go to slide:</label>
<input type="number" name="slidenum" id="goto-slide">
<input type="submit" value="Go">

</form>

<a href=“.” title=“Permalink to this slide” class=“deck-permalink”>#</a>

<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="lib/jquery-1.6.4.min.js"><\/script>')</script>

<!– Deck Core and extensions –> <script src=“core/deck.core.js”></script> <script src=“extensions/menu/deck.menu.js”></script> <script src=“extensions/goto/deck.goto.js”></script> <script src=“extensions/status/deck.status.js”></script> <script src=“extensions/navigation/deck.navigation.js”></script> <script src=“extensions/hash/deck.hash.js”></script>

<!– Specific to this page –> <!– GB: adding introduction.js inline –> <script> $(function() {

// Deck initialization
$.deck('.slide');

$('#style-themes').change(function() {
        $('#style-theme-link').attr('href', $(this).val());
});

$('#transition-themes').change(function() {
        $('#transition-theme-link').attr('href', $(this).val());
});

});

{{ more_content_for_js }} </script>

</body> </html>