Skip to content

H
Hunger Buster - Breadcrumbs
Commit 00c6ebe6 authored by Julia Santos's avatar Julia Santos
Browse files
Options

Integrated html and css for Log In and Sign Up pages

parent fdf55220
Hide whitespace changes
Inline Side-by-side
Showing with 989 additions and 125 deletions
Breadcrumbs/forms.py
View file @ 00c6ebe6
......@@ -3,9 +3,10 @@ import datetime
from django.core.validators import FileExtensionValidator
class LoginForm(forms.Form):
user = forms.CharField(label = 'username', max_length = 100)
password = forms.CharField(widget = forms.PasswordInput())
user = forms.CharField(label = 'username', max_length = 100, widget = forms.TextInput(attrs={'class':'emailBox'}))
password = forms.CharField(widget = forms.PasswordInput(attrs={'class':'passwordBox'}))
auto_id = False
class ProductTypeForm(forms.Form):
Product_Name = forms.CharField(max_length = 255)
Product_Category = forms.CharField(max_length = 255)
......
Breadcrumbs/static/mainAddItem.css 0 → 100644
View file @ 00c6ebe6
body {
width: 100%;
height: 100%;
margin: 0px;
}
.listViewHeader {
background-color: rgba(40, 40, 40, 1);
width: 100vw;
color: white;
text-align: left;
}
.breadcrumbsHead {
font-family: "Roboto Bold";
font-size: 46px;
margin-left: 50px;
}
.lowerPage {
width: 100vw;
display: grid;
grid-template-columns: repeat(6, 16.67vw);
grid-template-rows: 12.5vh 87.5vh;
text-align: left;
background-color: rgba(196, 196, 196, 1);
}
.sidebar {
height: 200vh;
background-color: rgba(196, 196, 196, 1);
display: grid;
grid-template-rows: repeat(16, 6.25vh);
grid-template-columns: repeat(2, 8.33vw);
grid-column: 1/2;
z-index: 1;
left: 0;
}
.sideItem {
display: grid;
background-color: rgba(104, 104, 104, 0.7);
transform: none;
}
.sideText {
font-family: "Roboto";
font-size: 24px;
color: white;
grid-column: 2/3;
margin-right: 5px;
text-align: right;
}
#fridgeIcon {
background-color: white;
clip-path: circle();
height: 15vh;
grid-row: 1/6;
grid-column: 1/2;
margin: 10px;
}
#statsIcon {
background-color: white;
clip-path: circle();
height: 15vh;
grid-row: 4/9;
grid-column: 1/2;
margin: 10px;
}
#toBuyIcon {
background-color: white;
clip-path: circle();
height: 15vh;
grid-row: 7/12;
grid-column: 1/2;
margin: 10px;
}
.fridge {
grid-row: 3/4;
grid-column: 1/3;
}
.stats {
grid-row: 6/7;
grid-column: 1/3;
}
.toBuy {
grid-row: 9/10;
grid-column: 1/3;
}
.pageSubhead {
grid-column: 2/7;
grid-row: 1/2;
background-color: white;
display: grid;
grid-template-columns: 3vw repeat(6, 15.67vw) 3vw;
grid-template-rows: repeat(3, 6.25vh);
}
.subheader {
font-family: "Roboto Medium";
font-size: 10vh;
grid-column: 2/3;
text-align: center;
}
.addItem {
grid-column: 3/4;
grid-row: 2/3
}
.addItemButton {
margin-left: 20px;
margin-right: 20px;
background-color: rgba(175, 175, 175, 0.7);
border-radius: 100px;
transform: none;
}
.addItemText {
font-family: "Roboto Medium";
font-size: 18px;
color: white;
text-align: center;
}
.changeView {
grid-column: 5/6;
grid-row: 2/3;
}
.changeViewDropdown {
background-color: rgba(228, 228, 228, 0.7);
transform: none;
}
.changeViewText {
text-align: center;
font-family: "Roboto Medium";
font-size: 14px;
}
.month {
display: grid;
grid-column: 2/3;
margin-left: 1vw;
font-family: Roboto;
font-style: normal;
font-size: 24px;
align-items: center;
}
.addItem {
display: grid;
grid-column: 2/3;
margin-left: 1vw;
align-items: center;
font-family: Roboto;
font-style: normal;
font-size: 24px;
}
\ No newline at end of file
Breadcrumbs/static/mainLogIn.css 0 → 100644
View file @ 00c6ebe6
body {
width: 100%;
height: 100%;
margin: 0px;
}
.loginHeader {
background-color: rgba(40, 40, 40, 1);
width: 100vw;
display: grid;
grid-template-columns: repeat(4, 25vw);
}
.breadcrumbsHead {
font-family: "Roboto Bold";
font-size: 46px;
margin-left: 50px;
color: white;
grid-column: 1/2;
}
.sideHeader {
grid-column: 4/5;
display: grid;
grid-template-columns: repeat(2, 12.5vw);
}
.loginText {
grid-column: 1/2;
font-family: "Roboto";
font-size: 24px;
margin-top: 15px;
color: white;
text-align: center;
}
.signUpButton {
grid-column: 2/3;
margin: 10px;
background-color: rgba(140, 140, 140, 0.7);
transform: none;
}
.signUpText {
font-family: "Roboto Black";
font-size: 16px;
color: white;
margin: 10px;
text-align: center;
}
.lowerPage {
width: 100vw;
display: grid;
grid-template-columns: repeat(4, 25vw);
background-color: white;
}
.loginArea {
grid-column: 2/4;
margin-top: 20vh;
border: solid;
border-color: black;
border-radius: 10px;
grid-template-rows: repeat (7, 4.76vh);
}
.breadcrumbsText {
grid-row: 1/2;
text-align: center;
font-family: "Roboto Black";
font-size: 36px;
margin: 10px;
}
.loginText2 {
grid-row: 2/3;
text-align: center;
font-family: "Roboto";
font-size: 24px;
margin: 10px;
}
.continueText {
grid-row: 3/4;
text-align: center;
font-family: "Roboto Slab";
font-size: 16px;
margin: 10px;
}
.emailBox {
grid-row: 4/5;
text-align: left;
font-family: "Roboto Slab";
font-size: 16px;
margin: 5px;
margin-left: 15px;
margin-right: 15px;
border: solid;
border-color: rgba(141, 141, 141, 1);
color: rgba(141, 141, 141, 1);
}
.passwordBox {
grid-row: 5/6;
text-align: left;
font-family: "Roboto Slab";
font-size: 16px;
margin: 5px;
margin-left: 15px;
margin-right: 15px;
border: solid;
border-color: rgba(141, 141, 141, 1);
color: rgba(141, 141, 141, 1);
}
.lowerBar {
grid-row: 7/8;
display: grid;
grid-template-columns: repeat(2)
}
.createAccountText {
grid-column: 1/2;
font-family: "Roboto";
font-size: 16px;
margin: 10px;
color: blue;
}
.nextButton {
grid-column: 2/3;
font-family: "Roboto";
font-size: 16px;
margin: 10px;
text-align: center;
background-color: rgba(31, 31, 31, 1);
color: white;
}
@font-face {
font-family: Roboto Bold;
src: url(Roboto-Bold.ttf);
}
@font-face {
font-family: Roboto Black;
src: url(Roboto-Black.ttf);
}
@font-face {
font-family: Roboto Medium;
src: url(Roboto-Medium.ttf);
}
@font-face {
font-family: Roboto;
src: url(Roboto-Regular.ttf);
}
@font-face {
font-family: Roboto Slab;
src: url(Roboto-Slab.ttf);
}
.signUpButton:hover {
background-color: rgba(140, 140, 140, 1);
transition: background-color .5s;
}
a {
color: rgba(0,0,0,0);
}
Breadcrumbs/static/mainSignUp.css 0 → 100644
View file @ 00c6ebe6
body {
width: 100%;
height: 100%;
margin: 0px;
}
.signUpHeader {
background-color: rgba(40, 40, 40, 1);
width: 100vw;
display: grid;
grid-template-columns: repeat(4, 25vw);
}
.breadcrumbsHead {
font-family: "Roboto Bold";
font-size: 46px;
margin-left: 50px;
color: white;
grid-column: 1/2;
}
.sideHeader {
grid-column: 4/5;
display: grid;
grid-template-columns: repeat(2, 12.5vw);
}
.loginText {
grid-column: 1/2;
font-family: "Roboto";
font-size: 24px;
margin-top: 15px;
color: white;
text-align: center;
}
.signUpButton {
grid-column: 2/3;
margin: 10px;
background-color: rgba(140, 140, 140, 0.7);
transform: none;
}
.signUpText {
font-family: "Roboto Black";
font-size: 16px;
color: white;
margin: 10px;
text-align: center;
}
.lowerPage {
width: 100vw;
display: grid;
grid-template-columns: repeat(4, 25vw);
background-color: white;
}
.signUpArea {
grid-column: 2/4;
margin-top: 20vh;
border: solid;
border-color: black;
border-radius: 10px;
}
.breadcrumbsText {
text-align: center;
font-family: "Roboto Black";
font-size: 36px;
margin: 10px;
}
.signUpText2 {
text-align: center;
font-family: "Roboto";
font-size: 24px;
margin: 10px;
}
.getStartedText {
text-align: center;
font-family: "Roboto Slab";
font-size: 16px;
margin: 10px;
}
.box {
text-align: left;
font-family: "Roboto Slab";
font-size: 16px;
margin: 5px;
margin-left: 15px;
margin-right: 15px;
border: solid;
border-color: rgba(141, 141, 141, 1);
color: rgba(141, 141, 141, 1);
}
.lowerBar {
display: grid;
grid-template-columns: repeat(2)
}
.alreadyHaveAccountText {
grid-column: 1/2;
font-family: "Roboto";
font-size: 16px;
margin: 10px;
color: blue;
}
.submitButton {
grid-column: 2/3;
font-family: "Roboto";
font-size: 16px;
margin: 10px;
text-align: center;
background-color: rgba(31, 31, 31, 1);
color: white;
}
b{
font-family:"Roboto-Black";
}
@font-face {
font-family: Roboto Bold;
src: url(Roboto-Bold.ttf);
}
@font-face {
font-family: Roboto Black;
src: url(Roboto-Black.ttf);
}
@font-face {
font-family: Roboto Medium;
src: url(Roboto-Medium.ttf);
}
@font-face {
font-family: Roboto;
src: url(Roboto-Regular.ttf);
}
@font-face {
font-family: Roboto Slab;
src: url(Roboto-Slab.ttf);
}
.signUpButton:hover {
background-color: rgba(140, 140, 140, 1);
transition: background-color .5s;
}
a {
color: rgba(0,0,0,0);
}
.main{
margin-left: 23%;
}
\ No newline at end of file
Breadcrumbs/static/mainToBuy.css 0 → 100644
View file @ 00c6ebe6
body {
width: 100%;
height: 100%;
margin: 0px;
}
.toBuyHeader {
background-color: rgba(40, 40, 40, 1);
width: 100vw;
color: white;
text-align: left;
}
.breadcrumbsHead {
font-family: "Roboto Bold";
font-size: 46px;
margin-left: 50px;
}
.lowerPage {
width: 100vw;
display: grid;
grid-template-columns: repeat(6, 16.67vw);
grid-template-rows: 12.5vh 87.5vh;
text-align: left;
background-color: rgba(196, 196, 196, 1);
}
.sidebar {
height: 200vh;
background-color: rgba(196, 196, 196, 1);
display: grid;
grid-template-rows: repeat(16, 6.25vh);
grid-template-columns: repeat(2, 8.33vw);
grid-column: 1/2;
z-index:1;
left:0;
}
.sideItem {
display: grid;
background-color: rgba(104, 104, 104, 0.7);
transform: none;
}
.sideText {
font-family: "Roboto";
font-size: 24px;
color: white;
grid-column: 2/3;
margin-right: 5px;
text-align: right;
}
#fridgeIcon {
background-color: white;
clip-path: circle();
height: 15vh;
grid-row: 1/6;
grid-column: 1/2;
margin: 10px;
}
#statsIcon {
background-color: white;
clip-path: circle();
height: 15vh;
grid-row: 4/9;
grid-column: 1/2;
margin: 10px;
}
#toBuyIcon {
background-color: white;
clip-path: circle();
height: 15vh;
grid-row: 7/12;
grid-column: 1/2;
margin: 10px;
}
.fridge {
grid-row: 3/4;
grid-column: 1/3;
}
.stats {
grid-row: 6/7;
grid-column: 1/3;
}
.toBuy {
grid-row: 9/10;
grid-column: 1/3;
}
.pageSubhead {
grid-column: 2/7;
grid-row: 1/2;
background-color: white;
display: grid;
grid-template-columns: 3vw repeat(6, 15.67vw) 3vw;
grid-template-rows: repeat(3, 6.25vh);
}
.subheader {
font-family: "Roboto Medium";
font-size: 10vh;
grid-column: 2/5;
text-align: left;
}
.sortBy {
grid-column: 5/6;
grid-row: 2/3;
}
.sortByDropdown {
background-color: rgba(228, 228, 228, 0.7);
transform: none;
}
.sortByText {
text-align: center;
font-family: "Roboto Medium";
font-size: 14px;
}
.listView {
grid-column: 2/7;
grid-row: 2/3;
background-color: white;
display: grid;
grid-template-columns: 0vw repeat(3, 25vw) 0vw;
grid-template-rows: repeat(4, 20vh);
grid-column-gap: 0vw;
grid-row-gap: 3vw;
}
.listItem {
background-color: rgba(237, 237, 237, 0.7);
display: grid;
grid-template-columns: 10vw 40vw 20vw;
grid-template-rows: repeat(5, 5vh);
transform: none;
}
#listIcon {
grid-column: 1/2;
grid-row: 1/5;
text-align: center;
clip-path: circle();
/* width: 150px;
height: 150px*/
background-color: rgba(196, 196, 196, 1);
margin: 5px;
margin-left:130px;
}
.listText {
grid-column: 2/3;
text-align: left;
margin: 10px;
margin-left: 100px;
}
.product {
font-family: "Roboto Black";
font-size: 24px;
}
.category {
font-family: "Roboto";
font-size: 18px;
}
.listRemove {
grid-column: 3/4;
grid-row: 2/4;
background-color: rgba(175, 175, 175);
}
.removeText {
font-size: 20px;
text-align: center;
margin: 15px;
font-family: "Roboto Medium";
}
.one {
grid-column: 2/5;
grid-row: 1/2;
}
@font-face {
font-family: Roboto Bold;
src: url(Roboto-Bold.ttf);
}
@font-face {
font-family: Roboto Black;
src: url(Roboto-Black.ttf);
}
@font-face {
font-family: Roboto Medium;
src: url(Roboto-Medium.ttf);
}
@font-face {
font-family: Roboto;
src: url(Roboto-Regular.ttf);
}
.sideItem:hover {
background-color: rgba(104, 104, 104, 1);
transition: background-color .5s;
}
.listItem:hover {
background-color: rgba(237, 237, 237, 1);
transition: background-color .5s;
}
.addItemButton:hover {
background-color: rgba(175, 175, 175, 1);
transition: background-color .5s;
}
.changeViewDropdown:hover {
background-color: rgba(240, 240, 240, 1);
transition: background-color .5s;
}
a {
color: rgba(0,0,0,0);
}
.main{
margin-left: 23%;
}
Breadcrumbs/static/sidebar.css
View file @ 00c6ebe6
......@@ -146,7 +146,7 @@ body {
.listItem {
background-color: rgba(237, 237, 237, 0.7);
display: grid;
grid-template-columns: 10vw 15vw;
grid-template-columns: 10vw 40vw 20vw;
grid-template-rows: repeat(5, 5vh);
transform: none;
}
......@@ -159,13 +159,13 @@ body {
height: 150px*/
background-color: rgba(196, 196, 196, 1);
margin: 5px;
margin-left:110px;
margin-left:130px;
}
.listText {
grid-column: 2/3;
text-align: left;
margin: 10px;
margin-left:130px;
margin-left:100px;
}
.daysLeft {
font-family: "Roboto Black";
......@@ -179,55 +179,27 @@ body {
font-family: "Roboto";
font-size: 14px;
}
.one {
grid-column: 2/5;
grid-row: 1/2;
}
/*.two {
grid-column: 2/3;
grid-row: 2/3;
}
.three {
grid-column: 2/3;
grid-row: 3/4;
}
.four {
grid-column: 2/3;
grid-row: 4/5;
}
.five {
grid-column: 3/4;
grid-row: 1/2;
}
.six {
.listToBuy {
grid-column: 3/4;
grid-row: 2/3;
}
.seven {
grid-column: 3/4;
grid-row: 3/4;
grid-row: 2/4;
background-color: rgba(175, 175, 175);
}
.eight {
grid-column: 3/4;
grid-row: 4/5;
.toBuyText {
font-size: 20px;
text-align: center;
margin: 15px;
font-family: "Roboto Medium";
}
.nine {
grid-column: 4/5;
.one {
grid-column: 2/5;
grid-row: 1/2;
}
.ten {
grid-column: 4/5;
grid-row: 2/3;
}
.eleven {
grid-column: 4/5;
grid-row: 3/4;
a {
color: rgba(0,0,0,0);
}
.twelve {
grid-column: 4/5;
grid-row: 4/5;
} */
@font-face {
font-family: Roboto Bold;
......
Breadcrumbs/views.py
View file @ 00c6ebe6
......@@ -13,7 +13,7 @@ from .models import User, Product_Type, Item, Recipe
def login(request):
username = "not logged in"
if request.method =="POST":
MyLoginForm = LoginForm(request.POST)
......@@ -43,7 +43,7 @@ class ProductListViewCategory(ListView):
class ToBuyViewName(ListView):
model = Product_Type
template_name = 'placeholder-list.html'
template_name = 'to-buy.html'
context_object_name = 'product'
def get_queryset(self):
......@@ -93,6 +93,7 @@ def add_product_type(request):
return render(request,'add-product-type.html',context)
def delete_product_type(request,id):
model = Product_Type
context = {}
obj = get_object_or_404(Product_Type,Product_ID = id)
......
templates/add-item.html
View file @ 00c6ebe6
<!DOCTYPE html>
<html lang="en">
{% load static %}
<link rel="stylesheet" href="{%static "sidebar.css" %}">
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Add Item</title>
{% load static %}
<link rel="stylesheet" href="{%static "mainAddItem.css" %}">
</head>
<body>
<div class = "listViewHeader">
......@@ -15,42 +11,49 @@
</div>
<div class = "lowerPage">
<div class = "sidebar">
<div class = "sideItem text fridge">
FRIDGE
</div>
<div class = "sideItem icon fridge">
<div class = "circle"> :3 </div>
</div>
<div class = "sideItem text recipes">
RECIPES
</div>
<div class = "sideItem icon recipes">
<div class = "circle"> :3 </div>
<div class = "sideItem fridge">
<div class = " sideText"><a href="http://127.0.0.1:8000/fridge/list/"> FRIDGE</a> </div>
</div>
<img id= "fridgeIcon" src= "" alt= "a flat icon of a refrigerator";>
<div class = "sideItem text stats">
STATS
</div>
<div class = "sideItem icon stats">
<div class = "circle"> :3 </div>
<div class = "sideItem stats">
<div class = "sideText"> STATS </div>
</div>
<img id= "statsIcon" src= "" alt= "a flat icon of a graph";>
<div class = "sideItem text toBuy">
TO BUY
<div class = "sideItem toBuy">
<div class = "sideText"> <a href = "http://127.0.0.1:8000/to-buy/">TO BUY</a> </div>
</div>
<div class = "sideItem icon toBuy">
<div class = "circle"> :3 </div>
<img id= "toBuyIcon" src= "" alt= "a flat icon of a shopping cart";>
</div>
<div class = "pageSubhead">
<div class = "subheader"> Fridge </div>
<div class = "addItem">
<div class = "addItemButton">
<div class = "addItemText"><a href="http://127.0.0.1:8000/fridge/add/"> ADD ITEM +</a> </div>
</div>
</div>
<div class = "changeView">
<div class = "changeViewDropdown">
<div class = "changeViewText"> LIST VIEW </div>
</div>
</div>
</div>
<div class="addItem">
Item Quantity:<input class="box firstName" type="text" placeholder="">
Quantity Unity:<input class="box lastName" type="text" placeholder="">
Item Description:<input class="box email" type="email" placeholder="">
Purchase Date:<input class="box password" type="password" placeholder="">
Expiration Date:<input class="box passwordConfirm" type="password" placeholder="">
<label class="deleteItemBox">
<input type="checkbox" checked="checked">
<span class="checkmark"></span>
Is this Item Consumed?
</label>
<button type="button">SUBMIT</button>
<a href="url">Back</a>
</div>
</div>
<h3>Add Item</h3>
<form method="POST" enctype="multipart/form-data" div class="main">
{% csrf_token %}
{{ form.as_p }}
<input type="submit" value="Submit">
</form>
<a href="http://127.0.0.1:8000/fridge/list" div class="main">Back</a>
</body>
</html>
\ No newline at end of file
templates/placeholder-list.html
View file @ 00c6ebe6
......@@ -16,17 +16,23 @@
<div class = "lowerPage">
<div class = "sidebar">
<div class = "sideItem fridge">
<div class = " sideText"><a href="http://127.0.0.1:8000/fridge/list/"> FRIDGE</a> </div>
<a href="http://127.0.0.1:8000/fridge/list/">
<div class = " sideText"> FRIDGE </div>
</a>
</div>
<img id= "fridgeIcon" src= "" alt= "a flat icon of a refrigerator";>
<div class = "sideItem stats">
<div class = "sideText"> STATS </div>
<a href = "">
<div class = "sideText"> STATS </div>
</a>
</div>
<img id= "statsIcon" src= "" alt= "a flat icon of a graph";>
<div class = "sideItem toBuy">
<div class = "sideText"> <a href = "http://127.0.0.1:8000/to-buy/">TO BUY</a> </div>
<a href = "http://127.0.0.1:8000/to-buy/">
<div class = "sideText"> TO BUY </div>
</a>
</div>
<img id= "toBuyIcon" src= "" alt= "a flat icon of a shopping cart";>
</div>
......
templates/product-type-confirm-delete.html
View file @ 00c6ebe6
<html>
<head>
{% load static %}
<link rel="stylesheet" href="{%static "sidebar.css" %}">
</head>
<body>
<form method="post">{% csrf_token %}
<p>Are you sure you want to delete "{{ object }}"?</p>
<input type="submit" value="Confirm">
</form>
<div class = "listViewHeader">
<div class = "breadcrumbsHead">
BREADCRUMBS
</div>
</div>
<div class = "lowerPage">
<div class = "sidebar">
<div class = "sideItem fridge">
<div class = " sideText"><a href="http://127.0.0.1:8000/fridge/list/"> FRIDGE</a> </div>
</div>
<img id= "fridgeIcon" src= "" alt= "a flat icon of a refrigerator";>
<div class = "sideItem stats">
<div class = "sideText"> STATS </div>
</div>
<img id= "statsIcon" src= "" alt= "a flat icon of a graph";>
<div class = "sideItem toBuy">
<div class = "sideText"> <a href = "http://127.0.0.1:8000/to-buy/">TO BUY</a> </div>
</div>
<img id= "toBuyIcon" src= "" alt= "a flat icon of a shopping cart";>
</div>
<div class = "pageSubhead">
<div class = "subheader"> Fridge </div>
<div class = "addItem">
<div class = "addItemButton">
<div class = "addItemText"><a href="http://127.0.0.1:8000/fridge/add/"> ADD ITEM +</a> </div>
</div>
</div>
<div class = "changeView">
<div class = "changeViewDropdown">
<div class = "changeViewText"> LIST VIEW </div>
</div>
</div>
</div>
{% block content %}
<div class = "listView">
<div class = "listItem one">
<div class = "listText">
<br/>
<form method="post">{% csrf_token %}
Are you sure you want to delete this item? <br/> <br/>
<input type="submit" value = "Confirm"></form></div>
</div>
</div>
</div>
{% endblock %}
</body>
</html>
templates/registration/login.html
View file @ 00c6ebe6
{% load static %}
<link rel="stylesheet" href="{%static "sidebar.css" %}">
<div class = "listViewHeader">
<div class = "breadcrumbsHead">
BREADCRUMBS
<html>
<head>
<link rel="stylesheet" href="{%static "mainLogIn.css" %}">
</head>
<body>
<div class = "loginHeader">
<div class = "breadcrumbsHead">
BREADCRUMBS
</div>
<div class = "sideHeader">
<a href= "http://127.0.0.1:8000/accounts/login">
<div class = "loginText">Log In</div>
</a>
<a href= "http://127.0.0.1:8000/accounts/signup">
<div class = "signUpButton">
<div class = "signUpText">Sign Up for Free!</div>
</div>
</a>
</div>
</div>
<form method="post">
{% csrf_token %}
{{ form.as_p }}
<button type="submit">Log In</button>
</form>
\ No newline at end of file
<div class = "lowerPage">
<div class = "loginArea">
<div class = "breadcrumbsText"> BREADCRUMBS </div>
<div class = "loginText2"> Log In </div>
<form method="POST">
{% csrf_token %}
<div class = "continueText">{{ form.non_field_errors }}
{{ form.username.errors }}
{{ form.password.errors }}</div>
<div class = "loginText2"> Username:<br>
{{form.username}}
</div>
<div class = "loginText2"> Password:<br>
{{form.password}}
</div>
<div class = "lowerBar">
<a href= "http://127.0.0.1:8000/accounts/signup">
<div class = "createAccountText"> Create an account</div>
</a>
<button type = "submit" class = "nextButton">NEXT</button></form>
</div>
</div>
</div>
</body>
</html>
templates/registration/signup.html
View file @ 00c6ebe6
<!DOCTYPE html>
<html>
<head>
<title> Sign Up to BreadCrumbs! </title>
<!-- I used a random css online so pls change it to what we're using -->
<link rel="stylesheet" href "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
{% load static %}
<html>
<head>
<link rel="stylesheet" href="{%static "mainSignUp.css" %}">
</head>
<body>
<center>
<h1 class = 'alert alert-success'> Sign Up </h1>
<h3 class = "p-3 mb-2 bg-primary text-white" style = 'font-size: 50px;'>BREADCRUMBS EMAIL </h3>
<form method="POST">
<!-- Very Important csrf Token -->
{% csrf_token %}
<div class = "form-group">
<p>
<h3> {{ form.as_p }} </h3>
</p>
<br>
<input type="submit" name="SignUp" class = 'btn btn-primary btn-lg'>
</div>
</form>
</center>
<div class = "signupHeader">
<div class = "breadcrumbsHead">
BREADCRUMBS
</div>
<div class = "sideHeader">
<a href= "http://127.0.0.1:8000/accounts/login">
<div class = "loginText">Log In</div>
</a>
<a href= "http://127.0.0.1:8000/accounts/signup">
<div class = "signUpButton">
<div class = "signUpText">Sign Up for Free!</div>
</div>
</a>
</div>
</div>
<div class = "lowerPage">
<div class = "signUpArea">
<div class = "breadcrumbsText"> BREADCRUMBS </div>
<div class = "signUpText2"> Sign Up </div>
<div class = "getStartedText"> Get started on leaving your trail(mix)! </div>
<form method="POST">
<!-- Very Important csrf Token -->
{% csrf_token %} <br>
<div class = "getStartedText">{{ form.non_field_errors }}
{{ form.username.errors }}
{{ form.email.errors }}
{{ form.password1.errors }}
{{ form.password2.errors }}</div>
<div class ="signUpText2"> Username</div><div class ="getStartedText">
Required. 150 characters or fewer. Letters, digits and @/./+/-/_ only.<br><br>
{{ form.username }} </div><br>
<div class ="signUpText2"> Email</div><div class ="getStartedText">
{{form.email}}
</div><br>
<div class ="signUpText2"> Password</div><div class ="getStartedText">
<ul>
<li> Your password can’t be too similar to your other personal information.
<li> Your password must contain at least 8 characters.
<li> Your password can’t be a commonly used
<li> Your password can’t be entirely numeric. <br><br></ul>
{{ form.password1 }} </div><br>
<div class ="signUpText2"> Password confirmation</div>
<div class ="getStartedText">Enter the same password as before, for verification.<br><br>
{{form.password2}}
</div>
<div class = "lowerBar">
<a href= "http://127.0.0.1:8000/accounts/login">
<div class = "alreadyHaveAccountText">I already have an account</div>
</a>
<input type="submit" name="SignUp" class = "submitButton">
</div>
</form>
</div>
</body>
</html>
\ No newline at end of file
templates/to-buy.html 0 → 100644
View file @ 00c6ebe6
<html>
<head>
{% load static %}
<link rel="stylesheet" href="{%static "mainToBuy.css" %}">
</head>
<body>
<div class = "toBuyHeader">
<div class = "breadcrumbsHead">
BREADCRUMBS
</div>
</div>
<div class = "lowerPage">
<div class = "sidebar">
<div class = "sideItem fridge">
<a href="http://127.0.0.1:8000/fridge/list/">
<div class = " sideText"> FRIDGE </div>
</a>
</div>
<img id= "fridgeIcon" src= "" alt= "a flat icon of a refrigerator";>
<div class = "sideItem stats">
<a href = "">
<div class = "sideText"> STATS </div>
</a>
</div>
<img id= "statsIcon" src= "" alt= "a flat icon of a graph";>
<div class = "sideItem toBuy">
<a href = "http://127.0.0.1:8000/to-buy/">
<div class = "sideText"> TO BUY </div>
</a>
</div>
<img id= "toBuyIcon" src= "" alt= "a flat icon of a shopping cart";>
</div>
<div class = "pageSubhead">
<div class = "subheader"> To Buy </div>
<div class = "sortBy">
<div class = "sortByDropdown">
<div class = "sortByText"> SORT BY </div>
</div>
</div>
</div>
{% for product in object_list %}
<div class = "listView">
<div class = "listItem one">
<img id= "listIcon" src= "" alt= "a flat icon the product";>
<div class = "listText">
<div class = "product"> {{product.Product_Name}} </div>
<div class = "category"> {{product.Product_Category}} </div>
</div>
<div class = "listRemove">
<div class= "removeText"> REMOVE </div>
</div>
{% endfor %}
</div>
</body>
</html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment