WP6
/
expub_compendium
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Switched to Bootstrap

joel
Simon Bowie 3 years ago
parent
baf379cae7
commit
7fc421d495
5 changed files with 89 additions and 110 deletions
Unified View Show Diff Stats
  1. +65
    -45
      web/app/templates/base.html
  2. +8
    -19
      web/app/templates/create.html
  3. +7
    -22
      web/app/templates/login.html
  4. +8
    -23
      web/app/templates/signup.html
  5. +1
    -1
      web/app/tool.py

+ 65
- 45
web/app/templates/base.html View File

<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>COPIM online toolkit</title> <title>COPIM online toolkit</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.min.css" />
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head> </head>


<body> <body>
<section class="hero is-primary is-fullheight">

<div class="hero-head">
<nav class="navbar">
<div class="container">

<div id="navbarMenuHeroA" class="navbar-menu">
<div class="navbar-end">
<a href="{{ url_for('main.index') }}" class="navbar-item">
Home
</a>
{% if current_user.is_authenticated %}
<a href="{{ url_for('tool.create') }}" class="navbar-item">
Add tool
</a>
{% endif %}
{% if current_user.is_authenticated %}
<a href="{{ url_for('main.profile') }}" class="navbar-item">
Profile
</a>
{% endif %}
{% if not current_user.is_authenticated %}
<a href="{{ url_for('auth.login') }}" class="navbar-item">
Login
</a>
<a href="{{ url_for('auth.signup') }}" class="navbar-item">
Sign Up
</a>
{% endif %}
{% if current_user.is_authenticated %}
<a href="{{ url_for('auth.logout') }}" class="navbar-item">
Logout
</a>
{% endif %}
</div>
</div>
</div>
</nav>
<nav class="navbar navbar-expand-md navbar-light bg-light">
<a class="navbar-brand" href="{{ url_for('main.index')}}">COPIM online toolkit</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a href="{{ url_for('main.index') }}" class="nav-link">
Home
</a>
</li>
{% if current_user.is_authenticated %}
<li class="nav-item">
<a href="{{ url_for('tool.create') }}" class="nav-link">
Add tool
</a>
</li>
{% endif %}
{% if current_user.is_authenticated %}
<li class="nav-item">
<a href="{{ url_for('main.profile') }}" class="nav-link">
Profile
</a>
</li>
{% endif %}
{% if not current_user.is_authenticated %}
<li class="nav-item">
<a href="{{ url_for('auth.login') }}" class="nav-link">
Login
</a>
</li>
<li class="nav-item">
<a href="{{ url_for('auth.signup') }}" class="nav-link">
Sign Up
</a>
</li>
{% endif %}
{% if current_user.is_authenticated %}
<li class="nav-item">
<a href="{{ url_for('auth.logout') }}" class="nav-link">
Logout
</a>
</li>
{% endif %}
</ul>
</div> </div>
</nav>


<div class="hero-body">
<div class="container has-text-centered">
{% block content %}
{% endblock %}
<div class="container">
{% with messages = get_flashed_messages() %}
{% if messages %}
<div class="alert alert-danger">
{{ messages[0] }}
</div> </div>
</div>
</section>
{% endif %}
{% endwith %}
{% block content %}
{% endblock %}
</div>

<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body> </body>


</html> </html>

+ 8
- 19
web/app/templates/create.html View File

{% extends "base.html" %} {% extends "base.html" %}


{% block content %} {% block content %}
<div class="column is-4 is-offset-4">
<h3 class="title">Add a new tool</h3>
<div class="box">
{% with messages = get_flashed_messages() %}
{% if messages %}
<div class="notification is-danger">
{{ messages[0] }}
</div>
{% endif %}
{% endwith %}
<h1>{% block title %} Add a New Tool {% endblock %}</h1>
<form method="POST" action="/create"> <form method="POST" action="/create">
<div class="field">
<div class="control">
<input class="input is-large" type="text" name="name" placeholder="Tool name" autofocus="">
</div>
<div class="form-group">
<label for="name">Name</label>
<input class="form-control" type="text" name="name" placeholder="Tool name" autofocus="">
</div> </div>


<div class="field">
<div class="control">
<textarea class="input is-large" type="text" name="description" placeholder="Tool description" autofocus=""></textarea>
</div>
<div class="form-group">
<label for="description">Description</label>
<textarea class="form-control" type="text" name="description" placeholder="Tool description" autofocus=""></textarea>
</div> </div>


<button class="button is-block is-info is-large is-fullwidth">Submit</button>
<button type="submit" class="btn btn-primary">Submit</button>
</form> </form>
</div> </div>
</div> </div>

+ 7
- 22
web/app/templates/login.html View File

{% extends "base.html" %} {% extends "base.html" %}


{% block content %} {% block content %}
<div class="column is-4 is-offset-4">
<h3 class="title">Login</h3>
<div class="box">
{% with messages = get_flashed_messages() %}
{% if messages %}
<div class="notification is-danger">
{{ messages[0] }}
</div>
{% endif %}
{% endwith %}
<h1>{% block title %} Login {% endblock %}</h1>
<form method="POST" action="/login"> <form method="POST" action="/login">
<div class="field">
<div class="control">
<input class="input is-large" type="email" name="email" placeholder="Your Email" autofocus="">
</div>
<div class="form-group">
<input class="form-control" type="email" name="email" placeholder="Your Email" autofocus="">
</div> </div>


<div class="field">
<div class="control">
<input class="input is-large" type="password" name="password" placeholder="Your Password">
</div>
<div class="form-group">
<input class="form-control" type="password" name="password" placeholder="Your Password">
</div> </div>
<div class="field">
<div class="form-group">
<label class="checkbox"> <label class="checkbox">
<input type="checkbox"> <input type="checkbox">
Remember me Remember me
</label> </label>
</div> </div>
<button class="button is-block is-info is-large is-fullwidth">Login</button>
<button class="btn btn-primary">Login</button>
</form> </form>
</div>
</div>
{% endblock %} {% endblock %}

+ 8
- 23
web/app/templates/signup.html View File

{% extends "base.html" %} {% extends "base.html" %}


{% block content %} {% block content %}
<div class="column is-4 is-offset-4">
<h3 class="title">Sign Up</h3>
<div class="box">
{% with messages = get_flashed_messages() %}
{% if messages %}
<div class="notification is-danger">
{{ messages[0] }}. Go to <a href="{{ url_for('auth.login') }}">login page</a>.
</div>
{% endif %}
{% endwith %}
<h1>{% block title %} Sign Up {% endblock %}</h1>
<form method="POST" action="/signup"> <form method="POST" action="/signup">
<div class="field">
<div class="control">
<input class="input is-large" type="email" name="email" placeholder="Email" autofocus="">
</div>
<div class="form-group">
<input class="form-control" type="email" name="email" placeholder="Email" autofocus="">
</div> </div>


<div class="field">
<div class="control">
<input class="input is-large" type="text" name="name" placeholder="Name" autofocus="">
</div>
<div class="form-group">
<input class="form-control" type="text" name="name" placeholder="Name" autofocus="">
</div> </div>


<div class="field">
<div class="control">
<input class="input is-large" type="password" name="password" placeholder="Password">
</div>
<div class="form-group">
<input class="form-control" type="password" name="password" placeholder="Password">
</div> </div>


<button class="button is-block is-info is-large is-fullwidth">Sign Up</button>
<button class="btn btn-primary">Sign Up</button>
</form> </form>
</div> </div>
</div> </div>

+ 1
- 1
web/app/tool.py View File

from flask import Blueprint, render_template, request, flash
from flask import Blueprint, render_template, request, flash, redirect, url_for
from flask_login import login_required, current_user from flask_login import login_required, current_user
from .models import Tool from .models import Tool
from . import db from . import db

Write Preview
Loading…
Cancel
Save