diff --git a/app/main/__init__.py b/app/main/__init__.py index 3d3ab5cde..578ea5e92 100644 --- a/app/main/__init__.py +++ b/app/main/__init__.py @@ -4,5 +4,5 @@ main = Blueprint('main', __name__) from app.main.views import ( index, sign_in, sign_out, register, two_factor, verify, sms, add_service, - code_not_received, jobs, dashboard, templates, service_settings, forgot_password, new_password + code_not_received, jobs, dashboard, templates, service_settings, forgot_password, new_password, styleguide ) diff --git a/app/main/views/styleguide.py b/app/main/views/styleguide.py new file mode 100644 index 000000000..516a39b6c --- /dev/null +++ b/app/main/views/styleguide.py @@ -0,0 +1,7 @@ +from flask import render_template +from app.main import main + + +@main.route('/_styleguide') +def styleguide(): + return render_template('views/styleguide.html') diff --git a/app/templates/views/styleguide.html b/app/templates/views/styleguide.html new file mode 100644 index 000000000..9ad7ba9a3 --- /dev/null +++ b/app/templates/views/styleguide.html @@ -0,0 +1,162 @@ +{% extends "admin_template.html" %} + +{% from "components/banner.html" import banner %} +{% from "components/big-number.html" import big_number %} +{% from "components/browse-list.html" import browse_list %} +{% from "components/page-footer.html" import page_footer %} +{% from "components/sms-message.html" import sms_message, message_status %} +{% from "components/table.html" import mapping_table, list_table, row, field %} +{% from "components/textbox.html" import textbox %} + +{% block page_title %} + Styleguide – GOV.UK Notify +{% endblock %} + +{% block fullwidth_content %} + +
Used to show the result of a user’s action.
+ {{ banner("This is a banner") }} + +Used to show some important statistics.
+ +Used to navigate to child pages.
+ + {{ browse_list([ + { + 'title': 'Change your username', + 'link': 'http://example.com', + }, + { + 'title': 'Change your password', + 'link': 'http://example.com', + 'hint': 'Your password is used to log in' + }, + { + 'title': 'Delete everything', + 'link': 'http://example.com', + 'hint': 'You can’t undo this', + 'destructive': True + } + ]) }} + ++ Used to submit forms and optionally provide a link to go back to the + previous page. +
++ Must be used inside a form. +
++ Adds a hidden CSRF token to the page. +
+ + {{ page_footer( + button_text='Save and continue' + ) }} + + {{ page_footer( + button_text='Delete', destructive=True + ) }} + + {{ page_footer( + button_text='Send', back_link='http://example.com', back_link_text="Back to dashboard" + ) }} + +Used to show or preview an SMS message.
+ +