Using bootstrap and better view resolution
This commit is contained in:
parent
02bc2f4667
commit
7e446bcbec
|
@ -0,0 +1,32 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static %}
|
||||
|
||||
{% block title %}Delete Container: {{ object.named_id }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
|
||||
<h2>Container: {{ container.named_id }}</h2>
|
||||
<div>{{ container.description }}</div>
|
||||
<div>Color: {{ container.color }}</div>
|
||||
<div>Container Type: <a href="{% url 'container:container_type_detail' container.container_type.id %}">{{ container.container_type.named_id }}</a></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Action buttons -->
|
||||
<div class="row">
|
||||
|
||||
<div class="col-sm-12">
|
||||
<a class="btn btn-primary" href="{% url 'container:edit' %}" role="button">Edit</a>
|
||||
<a class="btn btn-primary" href="{% url 'container:delete' %}" role="button">Delete</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- End Action buttons -->
|
||||
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static %}
|
||||
|
||||
{% block title %}Container: {{ container.named_id }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
|
||||
<h2>Container: {{ container.named_id }}</h2>
|
||||
<div>{{ container.description }}</div>
|
||||
<div>Color: {{ container.color }}</div>
|
||||
<div>Container Type: <a href="{% url 'container:container_type_detail' container.container_type.id %}">{{ container.container_type.named_id }}</a></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Action buttons -->
|
||||
<div class="row">
|
||||
|
||||
<div class="col-sm-12">
|
||||
<a class="btn btn-primary" href="{% url 'container:edit' container.id %}" role="button">Edit</a>
|
||||
<a class="btn btn-primary" href="{% url 'container:delete' container.id %}" role="button">Delete</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- End Action buttons -->
|
||||
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
<h1>Container: {{ container.named_id }}</h1>
|
||||
<div>{{ container.description }}</div>
|
||||
<div>Color: {{ container.color }}</div>
|
||||
<div>Container Type: <a href="{% url 'container:container_type_details' container.container_type.id %}">{{ container.container_type.named_id }}</a></div>
|
|
@ -0,0 +1,32 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static %}
|
||||
|
||||
{% block title %}Edit Container: {{ object.named_id }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
|
||||
<h2>Container: {{ container.named_id }}</h2>
|
||||
<div>{{ container.description }}</div>
|
||||
<div>Color: {{ container.color }}</div>
|
||||
<div>Container Type: <a href="{% url 'container:container_type_detail' container.container_type.id %}">{{ container.container_type.named_id }}</a></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Action buttons -->
|
||||
<div class="row">
|
||||
|
||||
<div class="col-sm-12">
|
||||
<a class="btn btn-primary" href="{% url 'container:edit' %}" role="button">Edit</a>
|
||||
<a class="btn btn-primary" href="{% url 'container:delete' %}" role="button">Delete</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- End Action buttons -->
|
||||
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static %}
|
||||
|
||||
{% block title %}Container: {{ container.named_id }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<div>New Container:</div>
|
||||
{% if container_list %}
|
||||
<ul>
|
||||
{% for container in container_list %}
|
||||
<li><a href="{% url 'container:detail' container.id %}">{{ container.named_id }}: {{ container.description }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<p>No container are available.</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div>
|
||||
{% if container_type_list %}
|
||||
<div>New Container Types:</div>
|
||||
<ul>
|
||||
{% for ctype in container_type_list %}
|
||||
<li><a href="{% url 'container:container_type_detail' ctype.id %}">{{ ctype.named_id }} {{ ctype.description }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% else %}
|
||||
<p>No container types are available.</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static %}
|
||||
|
||||
{% block title %}Container Type: {{ container_type.named_id }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
|
||||
<h2>Container Type: {{ container_type.named_id }}</h2>
|
||||
<div>{{ container_type.description }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-2">Size:</div><div class="col-sm-3">{{ container_type.width }}mm x {{ container_type.length }}mm x {{ container_type.height }}mm</div>
|
||||
<div class="col-sm-2">Inner Size:</div><div class="col-sm-3">
|
||||
{% if container_type.inner_width and container_type.inner_length and container_type.inner_height %}
|
||||
{{ container_type.inner_width }}mm x {{ container_type.inner_length }}mm x {{ container_type.inner_height }}mm
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-2">Has Cover:</div><div class="col-sm-3">{% if container_type.has_cover %} yes {% else %} no {% endif %}</div>
|
||||
<div class="col-sm-2">Can hold Containers:</div><div class="col-sm-3">{% if container_type.contains_container %} yes {% else %} no {% endif %}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table>
|
||||
</table>
|
||||
|
||||
<!-- Action buttons -->
|
||||
<div class="row">
|
||||
|
||||
<div class="col-sm-12">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- End Action buttons -->
|
||||
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
<h1>Container: {{ container_type.named_id }}</h1>
|
||||
<div>{{ container_type.description }}</div>
|
||||
<table>
|
||||
<tr><td>Width:</td><td>{{ container_type.width }} mm</td><td>Inner Width:</td><td>{{ container_type.inner_width }} mm</td></tr>
|
||||
<tr><td>Length:</td><td>{{ container_type.length }} mm</td><td>Inner Length:</td><td>{{ container_type.inner_length }} mm</td></tr>
|
||||
<tr><td>Height:</td><td>{{ container_type.height }} mm</td><td>Inner Height:</td><td>{{ container_type.inner_height }} mm</td></tr>
|
||||
<tr><td>Has Cover:</td><td>{% if container_type.has_cover %} yes {% else %} no {% endif %}</td><td>Can hold Containers:</td><td>{% if container_type.contains_container %} yes {% else %} no {% endif %}</td></tr>
|
||||
</table>
|
|
@ -0,0 +1,21 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static %}
|
||||
|
||||
{% block title %}Container: {{ container.named_id }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
{% if container_type_list %}
|
||||
<div>New Container Types:</div>
|
||||
<ul>
|
||||
{% for ctype in container_type_list %}
|
||||
<li><a href="{% url 'container:container_type_detail' ctype.id %}">{{ ctype.named_id }} {{ ctype.description }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% else %}
|
||||
<p>No container types are available.</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
<div>
|
||||
<div>New Container:</div>
|
||||
{% if container_list %}
|
||||
<ul>
|
||||
{% for container in container_list %}
|
||||
<li><a href="{% url 'container:container_details' container.id %}">{{ container.named_id }}: {{ container.description }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<p>No container are available.</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div>
|
||||
<div>New Container Types:</div>
|
||||
{% if container_type_list %}
|
||||
<ul>
|
||||
{% for ctype in container_type_list %}
|
||||
<li><a href="{% url 'container:container_type_details' ctype.id %}">{{ ctype.named_id }} {{ ctype.description }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
<p>No container types are available.</p>
|
||||
{% endif %}
|
||||
</div>
|
|
@ -4,9 +4,11 @@ from . import views
|
|||
|
||||
app_name = 'container'
|
||||
urlpatterns = [
|
||||
path('', views.index, name='index'),
|
||||
path('<int:container_id>/', views.container_details, name='container_details'),
|
||||
path('type/<int:container_type_id>/', views.container_type_details, name='container_type_details'),
|
||||
# path('type/<string:container_type_named_id>/', views.container_type_details, name='container_type_details'),
|
||||
path('', views.IndexView.as_view(), name='index'),
|
||||
path('<int:pk>/', views.DetailView.as_view(), name='detail'),
|
||||
path('edit/<int:pk>/', views.EditView.as_view(), name='edit'),
|
||||
path('delete/<int:pk>/', views.DeleteView.as_view(), name='delete'),
|
||||
path('type/', views.TypeIndexView.as_view(), name='container_type_index'),
|
||||
path('type/<int:pk>/', views.TypeDetailView.as_view(), name='container_type_detail'),
|
||||
]
|
||||
|
||||
|
|
|
@ -2,27 +2,39 @@ from django.shortcuts import render
|
|||
from django.http import HttpResponse
|
||||
from django.template import loader
|
||||
from django.http import Http404
|
||||
from django.urls import reverse
|
||||
from django.views import generic
|
||||
|
||||
from .models import Container, ContainerType
|
||||
|
||||
def index(request):
|
||||
container_list = Container.objects.order_by('-created_ts')[:5]
|
||||
container_type_list = ContainerType.objects.order_by('-created_ts')[:5]
|
||||
ctx = {'container_list': container_list, 'container_type_list': container_type_list}
|
||||
return render(request, 'container/index.html', ctx)
|
||||
class IndexView(generic.ListView):
|
||||
template_name = 'container/container_index.html'
|
||||
context_object_name = 'container_list'
|
||||
|
||||
def container_type_details(request, container_type_id):
|
||||
try:
|
||||
ctype = ContainerType.objects.get(pk=container_type_id)
|
||||
except ContainerType.DoesNotExist:
|
||||
raise Http404("Container Type does not exist")
|
||||
return render(request, 'container/container_type_details.html', {'container_type': ctype})
|
||||
def get_queryset(self):
|
||||
# Return the last five created containers
|
||||
return Container.objects.order_by('-created_ts')[:5]
|
||||
|
||||
def container_details(request, container_id):
|
||||
try:
|
||||
container = Container.objects.get(pk=container_id)
|
||||
except Container.DoesNotExist:
|
||||
raise Http404("Container does not exist")
|
||||
return render(request, 'container/container_details.html', {'container': container})
|
||||
class TypeIndexView(generic.ListView):
|
||||
template_name = 'container/container_type_index.html'
|
||||
context_object_name = 'container_type_list'
|
||||
|
||||
def get_queryset(self):
|
||||
# Return the last five created container types
|
||||
return ContainerType.objects.order_by('-created_ts')[:5]
|
||||
|
||||
class DetailView(generic.DetailView):
|
||||
model = Container
|
||||
# template_name = 'container/detail.html'
|
||||
|
||||
class TypeDetailView(generic.DetailView):
|
||||
model = ContainerType
|
||||
context_object_name = 'container_type'
|
||||
template_name = 'container/container_type_detail.html'
|
||||
|
||||
class EditView(generic.DetailView):
|
||||
model = Container
|
||||
|
||||
class DeleteView(generic.DetailView):
|
||||
model = Container
|
||||
|
||||
|
|
|
@ -55,7 +55,7 @@ ROOT_URLCONF = 'homelog.urls'
|
|||
TEMPLATES = [
|
||||
{
|
||||
'BACKEND': 'django.template.backends.django.DjangoTemplates',
|
||||
'DIRS': [],
|
||||
'DIRS': [ BASE_DIR / 'homelog/templates' ],
|
||||
'APP_DIRS': True,
|
||||
'OPTIONS': {
|
||||
'context_processors': [
|
||||
|
|
|
@ -0,0 +1,113 @@
|
|||
{% load static i18n %}<!DOCTYPE html>
|
||||
{% get_current_language as LANGUAGE_CODE %}
|
||||
<html lang="{{ LANGUAGE_CODE }}">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
||||
<title>{% block title %}homelog{% endblock title %}</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="Home Logistics -- remember where things are">
|
||||
<meta name="author" content="Dirk Jahnke">
|
||||
|
||||
<link rel="icon" href="{% static 'images/favicons/favicon.ico' %}">
|
||||
|
||||
{% block css %}
|
||||
<!-- Latest compiled and minified Bootstrap CSS -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.1.3/css/bootstrap.min.css" integrity="sha512-GQGU0fMMi238uA+a/bdWJfpUGKUkBdgfFdgBm72SUQ6BeyWjoY/ton0tEjH+OSH9iP4Dfh+7HM0I9f5eR0L/4w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
|
||||
<!-- Your stuff: Third-party CSS libraries go here -->
|
||||
<!-- This file stores project-specific CSS -->
|
||||
<link href="{% static 'css/project.css' %}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
<!-- Le javascript
|
||||
================================================== -->
|
||||
{# Placed at the top of the document so pages load faster with defer #}
|
||||
{% block javascript %}
|
||||
<!-- Bootstrap JS -->
|
||||
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.1.3/js/bootstrap.min.js" integrity="sha512-OvBgP9A2JBgiRad/mM36mkzXSXaJE9BEIENnVEmeZdITvwT09xnxLtT4twkCa8m/loMbPHsvPl0T8lRGVBwjlQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<!-- Your stuff: Third-party javascript libraries go here -->
|
||||
|
||||
<!-- place project specific Javascript in this file -->
|
||||
<script defer src="{% static 'js/project.js' %}"></script>
|
||||
|
||||
{% endblock javascript %}
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="mb-1">
|
||||
<nav class="navbar navbar-expand-md navbar-light bg-light">
|
||||
<div class="container-fluid">
|
||||
<button class="navbar-toggler navbar-toggler-right" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="{% url 'home' %}">homelog</a>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link" href="{% url 'home' %}">Home <span class="visually-hidden">(current)</span></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{% url 'about' %}">About</a>
|
||||
</li>
|
||||
{% if request.user.is_authenticated %}
|
||||
<li class="nav-item">
|
||||
{# URL provided by django-allauth/account/urls.py #}
|
||||
{# <a class="nav-link" href="{% url 'users:detail' request.user.username %}">{% translate "My Profile" %}</a> #}
|
||||
nyi my profile
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
{# URL provided by django-allauth/account/urls.py #}
|
||||
{# <a class="nav-link" href="{% url 'account_logout' %}">{% translate "Sign Out" %}</a> #} Logout
|
||||
</li>
|
||||
{% else %}
|
||||
{% if ACCOUNT_ALLOW_REGISTRATION %}
|
||||
<li class="nav-item">
|
||||
{# URL provided by django-allauth/account/urls.py #}
|
||||
<a id="sign-up-link" class="nav-link" href="{% url 'account_signup' %}">{% translate "Sign Up" %}</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
<li class="nav-item">
|
||||
{# URL provided by django-allauth/account/urls.py #}
|
||||
<a id="log-in-link" class="nav-link" href="{% url 'account_login' %}">{% translate "Sign In" %}</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
|
||||
{% if messages %}
|
||||
{% for message in messages %}
|
||||
<div class="alert alert-dismissible {% if message.tags %}alert-{{ message.tags }}{% endif %}">
|
||||
{{ message }}
|
||||
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% block content %}
|
||||
<p>Use this document as a way to quick start any new project.</p>
|
||||
{% endblock content %}
|
||||
|
||||
</div> <!-- /container -->
|
||||
|
||||
{% block modal %}{% endblock modal %}
|
||||
|
||||
{% block inline_javascript %}
|
||||
{% comment %}
|
||||
Script tags with only code, no src (defer by default). To run
|
||||
with a "defer" so that you run inline code:
|
||||
<script>
|
||||
window.addEventListener('DOMContentLoaded', () => {/* Run whatever you want */});
|
||||
</script>
|
||||
{% endcomment %}
|
||||
{% endblock inline_javascript %}
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,8 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
This is ABOUT
|
||||
|
||||
{% endblock %}
|
|
@ -0,0 +1,11 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<h2>This is HOME</h2>
|
||||
<a href="{% url 'container:container_type_index' %}">Container Types</a><br>
|
||||
<a href="{% url 'container:index' %}">Container</a><br>
|
||||
|
||||
|
||||
{% endblock %}
|
|
@ -15,8 +15,16 @@ Including another URLconf
|
|||
"""
|
||||
from django.contrib import admin
|
||||
from django.urls import include, path
|
||||
from django.views.generic import TemplateView
|
||||
from homelog import views
|
||||
|
||||
urlpatterns = [
|
||||
]
|
||||
|
||||
urlpatterns = [
|
||||
path('', TemplateView.as_view(template_name="homelog/home.html"), name='index'),
|
||||
path('home/', TemplateView.as_view(template_name="homelog/home.html"), name='home'),
|
||||
path('about/', TemplateView.as_view(template_name="homelog/about.html"), name='about'),
|
||||
path('container/', include('container.urls')),
|
||||
path('admin/', admin.site.urls),
|
||||
]
|
||||
|
|
|
@ -0,0 +1,14 @@
|
|||
from django.shortcuts import render
|
||||
from django.http import HttpResponse
|
||||
from django.template import loader
|
||||
from django.http import Http404
|
||||
|
||||
|
||||
"""
|
||||
def home(request):
|
||||
return render(request, 'homelog/home.html')
|
||||
|
||||
def about(request):
|
||||
return render(request, 'homelog/about.html')
|
||||
"""
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
/* These styles are generated from project.scss. */
|
||||
|
||||
.alert-debug {
|
||||
color: black;
|
||||
background-color: white;
|
||||
border-color: #d6e9c6;
|
||||
}
|
||||
|
||||
.alert-error {
|
||||
color: #b94a48;
|
||||
background-color: #f2dede;
|
||||
border-color: #eed3d7;
|
||||
}
|
Binary file not shown.
After Width: | Height: | Size: 8.2 KiB |
|
@ -0,0 +1 @@
|
|||
/* Project specific Javascript goes here. */
|
|
@ -0,0 +1,37 @@
|
|||
|
||||
|
||||
|
||||
|
||||
// project specific CSS goes here
|
||||
|
||||
////////////////////////////////
|
||||
//Variables//
|
||||
////////////////////////////////
|
||||
|
||||
// Alert colors
|
||||
|
||||
$white: #fff;
|
||||
$mint-green: #d6e9c6;
|
||||
$black: #000;
|
||||
$pink: #f2dede;
|
||||
$dark-pink: #eed3d7;
|
||||
$red: #b94a48;
|
||||
|
||||
////////////////////////////////
|
||||
//Alerts//
|
||||
////////////////////////////////
|
||||
|
||||
// bootstrap alert CSS, translated to the django-standard levels of
|
||||
// debug, info, success, warning, error
|
||||
|
||||
.alert-debug {
|
||||
background-color: $white;
|
||||
border-color: $mint-green;
|
||||
color: $black;
|
||||
}
|
||||
|
||||
.alert-error {
|
||||
background-color: $pink;
|
||||
border-color: $dark-pink;
|
||||
color: $red;
|
||||
}
|
Loading…
Reference in New Issue