Browse Source

Form styling

joel
Simon Bowie 3 years ago
parent
commit
6f55e258a5
3 changed files with 16 additions and 16 deletions
  1. +8
    -8
      web/app/templates/base.html
  2. +5
    -5
      web/app/templates/create.html
  3. +3
    -3
      web/app/templates/login.html

+ 8
- 8
web/app/templates/base.html View File

<!-- Fixed navbar --> <!-- Fixed navbar -->
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark"> <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<div class="container-fluid"> <div class="container-fluid">
<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">
<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"> <ul class="navbar-nav">
<li class="nav-item"> <li class="nav-item">
<a href="{{ url_for('main.index') }}" class="nav-link"> <a href="{{ url_for('main.index') }}" class="nav-link">
</li> </li>
{% endif %} {% endif %}
</ul> </ul>
</div>
</div>
</div> </div>
</nav> </nav>
</header> </header>
</main> </main>




<footer class="footer mt-auto py-3 bg-light fixed-bottom">
<footer class="footer py-3 bg-light fixed-bottom">
<div class="container"> <div class="container">
<span class="text-muted">© {{ moment().format('YYYY') }} COPIM and licensed under a Creative Commons Attribution 4.0 International License (CC BY 4.0).</span>
<span class="text-muted">© {{ moment().format('YYYY') }} <a href="https://copim.ac.uk/">COPIM</a> and licensed under a <a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License (CC BY 4.0)</a>.</span>
</div> </div>
</footer> </footer>
<!-- Optional JavaScript --> <!-- Optional JavaScript -->

+ 5
- 5
web/app/templates/create.html View File

{% block content %} {% block content %}
<h1>{% block title %} Add a New Tool, Example, or Practice {% endblock %}</h1> <h1>{% block title %} Add a New Tool, Example, or Practice {% endblock %}</h1>
<form method="POST" action="/create" id="resource"> <form method="POST" action="/create" id="resource">
<div class="form-group">
<div class="mb-3 mt-3">
<label for="cars">Type</label> <label for="cars">Type</label>
<select id="type" name="type" form="resource">
<select class="form-select" id="type" name="type" form="resource">
<option value="tool">Tool</option> <option value="tool">Tool</option>
<option value="example">Example</option> <option value="example">Example</option>
<option value="practice">Practice</option> <option value="practice">Practice</option>
</select> </select>
</div> </div>
<div class="form-group">
<div class="mb-3 mt-3">
<label for="name">Name</label> <label for="name">Name</label>
<input class="form-control" type="text" name="name" placeholder="Name" autofocus=""> <input class="form-control" type="text" name="name" placeholder="Name" autofocus="">
</div> </div>


<div class="form-group">
<div class="mb-3 mt-3">
<label for="description">Description</label> <label for="description">Description</label>
<textarea class="form-control" type="text" name="description" placeholder="Description" autofocus=""></textarea>
<textarea class="form-control" rows="4" type="text" name="description" placeholder="Description" autofocus=""></textarea>
</div> </div>


<button type="submit" class="btn btn-primary">Submit</button> <button type="submit" class="btn btn-primary">Submit</button>

+ 3
- 3
web/app/templates/login.html View File

{% block content %} {% block content %}
<h1>{% block title %} Login {% endblock %}</h1> <h1>{% block title %} Login {% endblock %}</h1>
<form method="POST" action="/login"> <form method="POST" action="/login">
<div class="form-group">
<div class="mb-3 mt-3">
<input class="form-control" type="email" name="email" placeholder="Your Email" autofocus=""> <input class="form-control" type="email" name="email" placeholder="Your Email" autofocus="">
</div> </div>


<div class="form-group">
<div class="mb-3 mt-3">
<input class="form-control" type="password" name="password" placeholder="Your Password"> <input class="form-control" type="password" name="password" placeholder="Your Password">
</div> </div>
<div class="form-group">
<div class="mb-3 mt-3">
<label class="checkbox"> <label class="checkbox">
<input type="checkbox"> <input type="checkbox">
Remember me Remember me

Loading…
Cancel
Save