From a1757b282a25ffb63de93ca89ddca8188adb393e Mon Sep 17 00:00:00 2001
From: Hiyorimi <playittodeath@gmail.com>
Date: Thu, 6 Sep 2018 21:52:32 +0300
Subject: [PATCH] Finished transition to BS4. Fixes #313 and #266
---
.../templates/layout.html | 36 +++++++++----------
.../templates/nav.html | 2 +-
.../templates/public/about.html | 4 +--
.../templates/public/home.html | 22 ++++++------
.../templates/public/register.html | 2 +-
5 files changed, 33 insertions(+), 33 deletions(-)
diff --git a/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/layout.html b/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/layout.html
index 725edb44..b405c1dc 100644
--- a/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/layout.html
+++ b/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/layout.html
@@ -32,28 +32,26 @@
{% endwith %}
<header>{% block header %}{% endblock %}</header>
-<div class="{% block content_class %}container{% endblock content_class %}">
- <div role="main">
- {% with messages = get_flashed_messages(with_categories=true) %}
- {% if messages %}
- <div class="row">
- <div class="col-md-12">
- {% for category, message in messages %}
- <div class="alert alert-{{ category }}">
- <a class="close" title="Close" href="#" data-dismiss="alert">×</a>
- {{message}}
- </div><!-- end .alert -->
- {% endfor %}
- </div><!-- end col-md -->
- </div><!-- end row -->
- {% endif %}
- {% endwith %}
+<main role="main">
+{% with messages = get_flashed_messages(with_categories=true) %}
+{% if messages %}
+<div class="row">
+ <div class="col-md-12">
+ {% for category, message in messages %}
+ <div class="alert alert-{{ category }}">
+ <a class="close" title="Close" href="#" data-dismiss="alert">×</a>
+ {{message}}
+ </div><!-- end .alert -->
+ {% endfor %}
+ </div><!-- end col-md -->
+</div><!-- end row -->
+ {% endif %}
+{% endwith %}
- {% block content %}{% endblock %}
- </div>
+{% block content %}{% endblock %}
+</main>
-</div><!-- end container -->
{% include "footer.html" %}
diff --git a/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/nav.html b/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/nav.html
index 784bcc18..a6e28832 100644
--- a/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/nav.html
+++ b/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/nav.html
@@ -31,7 +31,7 @@
</li>
</ul>
{% elif form %}
- <form class="form" id="loginForm" method="POST" action="/" role="login">
+ <form class="form-inline my-2" id="loginForm" method="POST" action="/" role="login">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
<div class="input-group mb-2 mr-sm-2">
{{ form.username(placeholder="Username", class_="form-control mr-sm-1 my-auto") }} {{ form.password(placeholder="Password",
diff --git a/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/about.html b/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/about.html
index 7365ee49..4dcb7c1d 100644
--- a/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/about.html
+++ b/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/about.html
@@ -3,9 +3,9 @@
{% block content %}
<div class="container">
- <h1>About</h1>
+ <h1 class="mt-5">About</h1>
<div class="row">
- <p>This template was created by <a href="http://github.com/sloria/">Steven Loria</a> for use with the <a href="http://github.com/audreyr/cookiecutter/">cookiecutter</a> package by <a href="http://github.com/audreyr/">Audrey Roy</a>.</p>
+ <p class="lead">This template was created by <a href="http://github.com/sloria/">Steven Loria</a> for use with the <a href="http://github.com/audreyr/cookiecutter/">cookiecutter</a> package by <a href="http://github.com/audreyr/">Audrey Roy</a>.</p>
</div>
</div>
{% endblock %}
diff --git a/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/home.html b/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/home.html
index 4a8476b7..0a9cd83e 100644
--- a/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/home.html
+++ b/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/home.html
@@ -2,30 +2,32 @@
{% extends "layout.html" %}
{% block content %}
<!-- Main jumbotron for a primary marketing message or call to action -->
-<div class="jumbotron my-2">
-{% endraw %}
- <h1>Welcome to {{ cookiecutter.project_name }}</h1>
-{% raw %}
- <p>This is a starter Flask template. It includes Bootstrap 4, jQuery 3, Flask-SQLAlchemy, WTForms, and various testing utilities out of the box.</p>
- <p><a href="https://github.com/sloria/cookiecutter-flask" class="btn btn-primary btn-large">Learn more »</a></p>
+<div class="jumbotron">
+ <div class="container">
+ {% endraw %}
+ <h1 class="display-3">Welcome to {{ cookiecutter.project_name }}</h1>
+ {% raw %}
+ <p>This is a starter Flask template. It includes Bootstrap 4, jQuery 3, Flask-SQLAlchemy, WTForms, and various testing utilities out of the box.</p>
+ <p><a href="https://github.com/sloria/cookiecutter-flask" class="btn btn-primary btn-large">Learn more »</a></p>
+ </div>
</div><!-- /.jumbotron -->
-<div class="body-content">
+<div class="container">
<div class="row">
<div class="col-lg-4">
<h2><i class="fa fa-code"></i> Bootstrap 4</h2>
<p>Sleek, intuitive, and powerful mobile-first front-end framework for faster and easier web development.</p>
- <p><a class="btn btn-primary" href="http://getbootstrap.com/">Official website »</a></p>
+ <p><a class="btn btn-outline-secondary" href="http://getbootstrap.com/">Official website »</a></p>
</div>
<div class="col-lg-4">
<h2><i class="fa fa-flask"></i> SQLAlchemy</h2>
<p>SQLAlchemy is the Python SQL toolkit and Object Relational Mapper that gives application developers the full power and flexibility of SQL.</p>
- <p><a href="http://www.sqlalchemy.org/" class="btn btn-primary">Official website »</a></p>
+ <p><a href="http://www.sqlalchemy.org/" class="btn btn-outline-secondary">Official website »</a></p>
</div>
<div class="col-lg-4">
<h2><i class="fa fa-edit"></i> WTForms</h2>
<p>WTForms is a flexible forms validation and rendering library for python web development.</p>
- <p><a href="http://wtforms.simplecodes.com/" class="btn btn-primary">Official website »</a></p>
+ <p><a href="http://wtforms.simplecodes.com/" class="btn btn-outline-secondary">Official website »</a></p>
</div>
</div><!-- /.row -->
</div>
diff --git a/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/register.html b/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/register.html
index 16290890..d36caa5d 100644
--- a/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/register.html
+++ b/{{cookiecutter.app_name}}/{{cookiecutter.app_name}}/templates/public/register.html
@@ -2,7 +2,7 @@
{% extends "layout.html" %}
{% block content %}
<div class="container-narrow">
- <h1>Register</h1>
+ <h1 class="mt-5">Register</h1>
<br/>
<form id="registerForm" class="form form-register" method="POST" action="" role="form">
{{ form.csrf_token }}
--
GitLab