!-- flask-bootstrapモジュールのおまじない-->
{% extends "bootstrap/base.html" %} <!-- タイトル --> {% if title %} {% block title %} {{title}} {% endblock title %} {% else %} {% block title %} Flaskr {% endblock title %} {% endif %} <!-- 静的ファイルフォルダからCSSを読み込む --> {%- block styles %} {{ super() }} <!-- userのスクリプト--> <link rel=stylesheet type=text/css href="{{ url_for('static', filename='user_style.css') }}"> <!-- もしCSSデバックするなら--> {% if config.CSS_DEBUG %} <link rel=stylesheet type=text/css href="{{ url_for('static', filename='css_debug.css') }}"> {% endif %} {%- endblock styles %} {% block navbar %} <div class="navbar navbar-default"> <h1>Flaskr</h1> <!-- デバッグモード機能 --> <div> <a href="{{ url_for('debug_css_mode') }}">CSSデバッグモード</a> </div> <!-- デバッグ用リセット機能 --> <div> {% if session.logged_in %} <a href="{{ url_for('reset_entry') }}">リセット</a> {% endif %} </div> <!-- ログインログアウトの表示(session.logged_inキーを使って、ログインアウトの状態を判別) --> <div> {% if not session.logged_in %} <a href="{{ url_for('login') }}">ログイン</a> {% else %} <a href="{{ url_for('logout') }}">ログアウト</a> {% endif %} </div> <!-- ビューの変更 --> <div> <a href="{{ url_for('show_pyramid') }}">ピラミッドビュー</a> </div> <div> <a href="{{ url_for('show_entries') }}">タイムラインビュー</a> </div> <!-- flashを使ったメッセージの表示 --> {% for message in get_flashed_messages() %} <div class="flash">{{ message }}</div> {% endfor %} </div> {%- endblock navbar %} {% block content %} <div class="container"> <div class="row"> <div class="col-md-4"> {% block left %} <!-- ログイン中ならば追加要素を表示 --> {% if session.logged_in %} <form action="{{ url_for('add_entry') }}" method="post" class="add-entry"> <p>新規作成</p> <div class="form-group"> <label>title</label> <textarea name="title" class="form-control form-title" rows=1 cols=4>タイトルを入力してください</textarea> </div> <div class="form-group"> <label>why</label> <textarea name="why" class="form-control form-why" rows=1 cols=4>目的を入力してください</textarea> </div> <div class="form-group"> <label>method</label> <textarea name="method" class="form-control form-method" rows=1 cols=4>手法を入力してください</textarea> </div> <button type="submit" class="btn btn-default">Submit</button> </form> {% endif %} {% endblock left %} </div> <div class="col-md-8"> {% block right %}{% endblock right %} </div> </div> </div> {% block footer %} jQuery日本語リファレンス http://semooh.jp/jquery/api/selectors/.class/ {% endblock footer %} {% endblock content %}