<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta http-equiv="x-ua-compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Flasgger - Demo apps</title>
  <link rel="icon" type="image/png" href="/restful/flasgger_static/images/favicon-32x32.png" sizes="32x32" />
  <link rel="icon" type="image/png" href="/restful/flasgger_static/images/favicon-16x16.png" sizes="16x16" />
  <link href='/restful/flasgger_static/css/typography.css' media='screen' rel='stylesheet' type='text/css'/>
  <link href='/restful/flasgger_static/css/reset.css' media='screen' rel='stylesheet' type='text/css'/>
  <link href='/restful/flasgger_static/css/screen.css' media='screen' rel='stylesheet' type='text/css'/>
  <link href='/restful/flasgger_static/css/reset.css' media='print' rel='stylesheet' type='text/css'/>
  <link href='/restful/flasgger_static/css/print.css' media='print' rel='stylesheet' type='text/css'/>
  <link href='{{ url_for('static', filename='styles.css') }}' rel="styleshet" type='text/css'/>
  <style>
    .swagger-section #header,
    .swagger-section .swagger-ui-wrap {
      min-width: auto;
    }

    #examples {
      display: flex;
      flex-wrap: wrap;
      font-size: 1rem;
      justify-content: space-between;
      margin-top: 1rem;
      padding: .5rem;
    }

    #examples h2 {
      font-size: 1rem;
      font-weight: bold;
      word-wrap: break-word;
    }

    #examples li {
      background-color: #efefef;
      margin: .5rem 0 0 0;
      overflow: hidden;
      width: 100%;
      padding: .5rem;
    }

    #examples ol,
    #examples li li {
      margin: .5rem 0 0 0;
      padding: 0;
      width: 100%;
    }

    #examples p {
      line-height: 1.2;
    }

    #examples a {
      word-wrap: break-word;
    }

    @media all and (min-width: 410px) {
      #examples li {
        width: calc(50% - 1.25rem);
      }
      #examples li li {
        width: 100%;
      }
    }

    @media all and (min-width: 760px) {
      #examples li {
        width: calc(33% - 1.25rem);
      }
      #examples li li {
        width: 100%;
      }
    }
  </style>

  <script src='/restful/flasgger_static/lib/object-assign-pollyfill.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/jquery-1.8.0.min.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/jquery.slideto.min.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/jquery.wiggle.min.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/jquery.ba-bbq.min.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/handlebars-4.0.5.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/lodash.min.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/backbone-min.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/swagger-ui.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/highlight.9.1.0.pack.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/highlight.9.1.0.pack_extended.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/jsoneditor.min.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/marked.js' type='text/javascript'></script>
  <script src='/restful/flasgger_static/lib/swagger-oauth.js' type='text/javascript'></script>

  <!-- Some basic translations -->
  <!-- <script src='lang/translator.js' type='text/javascript'></script> -->
  <!-- <script src='lang/ru.js' type='text/javascript'></script> -->
  <!-- <script src='lang/en.js' type='text/javascript'></script> -->
</head>

<body class="swagger-section">
<div id='header'>
  <div class="swagger-ui-wrap">
    <a id="logo" href="/"><img class="logo__img" alt="swagger" height="30" width="30" src="/restful/flasgger_static/images/logo_small.png" /><span class="logo__title">Flasgger</span></a>
  </div>
</div>

<div id="message-bar" class="swagger-ui-wrap" data-sw-translate>
    <h1>Flasgger {{version}} demo apps</h1>
    <a target="_blank" href="http://github.com/rochacbruno/flasgger">Get flasgger</a>
</div>
<div id="swagger-ui-container" class="swagger-ui-wrap">

    <ul id="examples">
    {% for example, mod in examples.items() %}
        <li>
            <h2>{{example}}</h2>
            <p>{{mod.__doc__}}</p>
            <ol>
                <li>Live demo: <a href="{{example}}/apidocs">{{example}}</a></li>
                <li>Json output: <a href="{{example}}/apidocs/?json=true">{{example}}/?json=true</a></li>
                <li>Code: <a target="_blank" href="https://github.com/rochacbruno/flasgger/blob/master/examples/{{example}}.py">examples{{example}}.py</a></li>
            </ol>
        </li>
    {% endfor %}
    </ul>

</div>
<div class="swagger-ui-wrap footer">
<small style="font-size: 60%; color: #ccc;">
[Powered by <a href="https://github.com/rochacbruno/flasgger">Flasgger</a>]
</small>
</div>
</body>
</html>
