Skip to content

pyx/flask-pure

Repository files navigation

Flask-Pure - a Flask extension for Pure.css

Flask-Pure is an extension to Flask that helps integrate Pure.css to your Flask application.

Quick Start

  1. Installation
pip install Flask-Pure
  1. Configuration
from flask import Flask, render_template
from flask_pure import Pure

app = Flask(__name__)
app.config['PURECSS_RESPONSIVE_GRIDS'] = True
app.config['PURECSS_USE_CDN'] = True
app.config['PURECSS_USE_MINIFIED'] = True
Pure(app)

@app.route('/')
def hello():
    return render_template('hello.html')

if __name__ == '__main__':
    app.run(debug=True)
  1. In templates/hello.html:
{% extends "pure/layout.html" %}
{% block title %}Hello world from flask-pure{% endblock %}

{% block nav %}
<div class="pure-menu pure-menu-horizontal">
  <!-- ... -->
</div>
{% endblock %}

{% block content %}
  <h1>Hello world</h1>
{% endblock %}
  1. Profit!

How It Works

Once registered, this extension provides a template variable called pure, it has a property named css that will be rendered as HTML <link> tag to the Pure.css stylesheets either from free CDN or be served from a bundled blueprint, also called pure.

A {{ pure.css }} inside <head> tag is all you need.

A bare bone HTML5 template is also available as pure/layout.html. Please check out the example in code repository and documentation for details.

License

BSD New, see LICENSE for details.

Links