style/bluenightsky/index.en.html.tmpl

   1 <!DOCTYPE html>
   2 <html xmlns="http://www.w3.org/1999/xhtml"
   3       lang="en">
   4   <head>
   5     <meta charset="utf-8" />
   6     <title>$title</title>
   7     <link rel="stylesheet" href="/css/styles.css"
   8           type="text/css" media="screen" />
   9     <link rel="stylesheet" href="/css/print.css"
  10           type="text/css" media="print" />
  11     <script type="text/javascript"
  12             src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js">
  13     </script>
  14     <script type="text/javascript" src="/js/simpletabs.js"></script>
  15     <link rel="stylesheet" href="lightbox.css"
  16           type="text/css" media="screen" />
  17     <script type="text/javascript" src="/js/jquery.js"></script>
  18     <script type="text/javascript" src="/js/jquery.lightbox-0.5.js"></script>
  19     <!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
  20     <script type="text/javascript">
  21       $(function() {
  22       $('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
  23       });
  24     </script>
  25   </head>
  26   <body>
  27     <div id="wrapper"><!-- #wrapper -->
  28
  29       <header><!-- header -->
  30         <h1><a href="/">Site name</a></h1>
  31         <h2>Your compelling tag line goes here</h2>
  32         <img src="images/bluenightsky.png" width="940" height="200" alt=""/>
  33         <!-- header image -->
  34       </header><!-- end of header -->
  35
  36       <nav><!-- top nav -->
  37         <div class="menu">
  38           $menu
  39         </div>
  40       </nav><!-- end of top nav -->
  41
  42       <section id="main"><!-- #main content and sidebar area -->
  43         <section id="content"><!-- #content -->
  44           <article>
  45             $article
  46           </article>
  47         </section><!-- end of #content -->
  48
  49         <aside id="sidebar"><!-- sidebar -->
  50
  51           <div class="tabwidget">
  52             <ul class="tabs">
  53               <li><a href="#tab1">Menu</a></li>
  54               <li><a href="#tab2">Popular</a></li>
  55               <li><a href="#tab3">About Me</a></li>
  56             </ul>
  57             <div class="tab_container">
  58               <div id="tab1" class="tab_content">
  59                 <h3>$levelname</h3>
  60                 $levelmenu
  61               </div>
  62               <div id="tab3" class="tab_content">
  63                 <h3>Who I Am</h3> <img src="images/me.png" alt=""
  64                 /><p>Lorem ipsum in libris debitis facilis qui, in usu
  65                 esse falli deseruisse. Vel ut vivendo sensibus
  66                 partiendo, liber philosophia ne vim. Viris oblique
  67                 explicari has et. Nam noster iisque discere te, sale
  68                 doming delectus est te, an debet quando eruditi
  69                 pro. Ad dicant praesent persequeris has, ne vel
  70                 minimum petentium periculis.</p>
  71               </div>
  72             </div>
  73           </div>
  74
  75           <div class="standard">
  76             <h3>Things To Do</h3>
  77             <ul>
  78               <li><a href="#">Create</a></li>
  79               <li><a href="#">Have Fun</a></li>
  80               <li><a href="#">Share With Friends</a></li>
  81               <li><a href="#">Play Games</a></li>
  82               <li><a href="#">Upload</a></li>
  83               <li><a href="#">Download</a></li>
  84             </ul>
  85
  86
  87             <h3>Sponsors</h3>
  88             <img src="images/ad180.png" alt="" /><br /><br />
  89
  90             <h3>Connect With Us</h3>
  91             <ul>
  92               <li><a href="#">Twitter</a></li>
  93               <li><a href="#">Facebook</a></li>
  94               <li><a href="#">LinkedIn</a></li>
  95               <li><a href="#">Flickr</a></li>
  96             </ul>
  97           </div>
  98
  99         </aside><!-- end of sidebar -->
 100
 101       </section><!-- end of #main content and sidebar-->
 102
 103       <footer>
 104         <section id="footer-area">
 105
 106           <section id="footer-outer-block">
 107             <aside class="footer-segment">
 108               <h4>Friends</h4>
 109               <ul>
 110                 <li><a href="#">one linkylink</a></li>
 111                 <li><a href="#">two linkylinks</a></li>
 112                 <li><a href="#">three linkylinks</a></li>
 113               </ul>
 114             </aside><!-- end of #first footer segment -->
 115
 116             <aside class="footer-segment">
 117               <h4>Awesome Stuff</h4>
 118               <ul>
 119                 <li><a href="#">one linkylink</a></li>
 120                 <li><a href="#">two linkylinks</a></li>
 121                 <li><a href="#">three linkylinks</a></li>
 122               </ul>
 123             </aside><!-- end of #second footer segment -->
 124
 125             <aside class="footer-segment">
 126               <h4>Coolness</h4>
 127               <ul>
 128                 <li><a href="#">one linkylink</a></li>
 129                 <li><a href="#">two linkylinks</a></li>
 130                 <li><a href="#">three linkylinks</a></li>
 131               </ul>
 132             </aside><!-- end of #third footer segment -->
 133
 134             <aside class="footer-segment">
 135               <h4>Blahdyblah</h4>
 136               <p>© 2010 <a href="/">site</a> Praesent
 137               libero. Sed cursus ante dapibus diam. Sed nisi.</p>
 138             </aside><!-- end of #fourth footer segment -->
 139
 140           </section><!-- end of footer-outer-block -->
 141
 142         </section><!-- end of footer-area -->
 143       </footer>
 144
 145     </div><!-- #wrapper -->
 146     <!-- Free template created by http://freehtml5templates.com -->
 147   </body>
 148 </html>