bachir
/
ola4doc


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
							<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="generator" content="pandoc">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
  <title></title>
  <style type="text/css">code{white-space: pre;}</style>
  <!--[if lt IE 9]>
    <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>
  <![endif]-->
  <style type="text/css">
  @font-face {
    font-family: 'ola';
    src: url("fonts/ola/olasans-webfont.eot");
    src: url("fonts/ola/olasans-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/ola/olasans-webfont.woff2") format("woff2"), url("fonts/ola/olasans-webfont.woff") format("woff"), url("fonts/ola/olasans-webfont.ttf") format("truetype");
    font-weight: normal;
    font-style: normal; }
  
  /* Generated by Font Squirrel (https://www.fontsquirrel.com) on June 17, 2016 */
  @font-face {
    font-family: 'vollkorn';
    src: url("fonts/volkorn/vollkorn-bold-webfont.woff2") format("woff2"), url("fonts/volkorn/vollkorn-bold-webfont.woff") format("woff");
    font-weight: bold;
    font-style: normal; }
  
  @font-face {
    font-family: 'vollkorn';
    src: url("fonts/volkorn/vollkorn-bolditalic-webfont.woff2") format("woff2"), url("fonts/volkorn/vollkorn-bolditalic-webfont.woff") format("woff");
    font-weight: bold;
    font-style: italic; }
  
  @font-face {
    font-family: 'vollkorn';
    src: url("fonts/volkorn/vollkorn-italic-webfont.woff2") format("woff2"), url("fonts/volkorn/vollkorn-italic-webfont.woff") format("woff");
    font-weight: normal;
    font-style: italic; }
  
  @font-face {
    font-family: 'vollkorn';
    src: url("fonts/volkorn/vollkorn-regular-webfont.woff2") format("woff2"), url("fonts/volkorn/vollkorn-regular-webfont.woff") format("woff");
    font-weight: normal;
    font-style: normal; }
  
  body {
    font-family: 'vollkorn',sans-serif;
    max-width: 100%;
    height: 100%;
    margin: 30px 0;
    font-size: 14px; }
  
  h1, h2, h3, h4, h5, h6 {
    font-family: 'ola',sans-serif;
    margin: 0; }
  
  #main h1, #main h2 {
    border: 2px solid #000;
    padding: 5px;
    display: inline-block;
    position: absolute; }
  
  #main h1 {
    padding: 5px 1rem;
    top: 100px;
    white-space: nowrap; }
  
  #main h2 {
    top: 0;
    white-space: nowrap;
    padding: 5px 1rem;
    font-size: 1rem; }
  
  p {
    font-size: 1.5em; }
  
  ul {
    margin: 0;
    padding: 0; }
  
  li {
    list-style: none; }
  
  img {
    max-width: 100%; }
  
  code {
    border: 1px solid #000;
    padding: 5px; }
  
  header#header {
    width: 18%;
    min-width: 200px;
    position: fixed;
    padding: 0 1rem; }
    header#header h1 {
      font-size: 1rem;
      border-bottom: 2px solid #000;
      margin-bottom: 1em; }
    header#header #menu li p {
      margin-top: 0;
      margin-bottom: 0.2em;
      font-size: 1em; }
    header#header #menu li a {
      color: #000; }
  
  div.user {
    position: relative;
    width: 55%;
    max-width: 800px;
    margin: 0 auto 5rem auto; }
    div.user header {
      min-height: 200px; }
    div.user .content {
      border: 2px solid #000;
      padding: 1rem;
      width: 100%;
      margin-bottom: 2rem; }
    div.user section.images ul {
      width: 105%; }
      div.user section.images ul li {
        line-height: 0;
        margin: 1rem 0;
        border: 2px solid #000; }
        div.user section.images ul li img {
          max-width: 100%;
          width: 100%; }
    div.user p img {
      border: none; }
  
  @media print {
    @page {
      margin: 1cm;
      size: A4; }
    div.user {
      width: 17cm;
      margin-top: 2cm;
      page-break-after: always;
      max-width: 19cm; }
      div.user p, div.user code {
        page-break-inside: avoid; }
      div.user section.images ul li {
        page-break-inside: avoid;
        margin-top: 1cm; } }
  
  </style>
</head>
<body>
<header id='header'>
<h1 id="ola3-documentation">OLA#3 Documentation</h1>
<p><nav id='menu'></p>
<ul>
<li><a href="#content/model">content/model</a></li>
</ul>
<p></nav></p>
</header>
<section id='main'>
<div id='content/model' class='user'>
<section class='content'>
<h1 id="le-nom-de-mon-animatique">Le nom de mon animatique</h1>
<h2 id="monprenom-monnom">Monprenom Monnom</h2>
<p>à partir d'ici vous pouvez écrire le texte de description de votre projet d'aniamtique</p>
<p><img src="images/model-00.jpg" alt="" /></p>
<p>Pour insérer des images, comme des shoot écrans de votre travail, commencez par les déposer dans le dossier images de votre dossier perso<br />
puis ajouter cette ligne:</p>
<pre><code>!images/nomdemonimage.jpeg!</code></pre>
<p>Toutes les images seront insérez automatiquement a la fin de votre description dans la documentation finale, sauf celle ajouté manuellement dans le texte.</p>
</section>
<section class='images'>
<ul>
<li><img src="images/model-01.jpg" alt="" /></li>
</ul>
</section>
<section class='sources'>
</section>
</div>
<div class="pagebreak">
</div>
</section>
<script src="bower_components/jquery/dist/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.line/jquery.line.js" type="text/javascript"></script>
<script src="js/main.js" type="text/javascript"></script>
</body>
</html>