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
Show whitespace changes
Inline Side-by-side
Showing with 989 additions and 125 deletions
Breadcrumbs/forms.py
View file @ 00c6ebe6
...@@ -3,8 +3,9 @@ import datetime ...@@ -3,8 +3,9 @@ import datetime
from django.core.validators import FileExtensionValidator from django.core.validators import FileExtensionValidator
class LoginForm(forms.Form): class LoginForm(forms.Form):
user = forms.CharField(label = 'username', max_length = 100) user = forms.CharField(label = 'username', max_length = 100, widget = forms.TextInput(attrs={'class':'emailBox'}))
password = forms.CharField(widget = forms.PasswordInput()) password = forms.CharField(widget = forms.PasswordInput(attrs={'class':'passwordBox'}))
auto_id = False
class ProductTypeForm(forms.Form): class ProductTypeForm(forms.Form):
Product_Name = forms.CharField(max_length = 255) Product_Name = 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 { ...@@ -146,7 +146,7 @@ body {
.listItem { .listItem {
background-color: rgba(237, 237, 237, 0.7); background-color: rgba(237, 237, 237, 0.7);
display: grid; display: grid;
grid-template-columns: 10vw 15vw; grid-template-columns: 10vw 40vw 20vw;
grid-template-rows: repeat(5, 5vh); grid-template-rows: repeat(5, 5vh);
transform: none; transform: none;
} }
...@@ -159,13 +159,13 @@ body { ...@@ -159,13 +159,13 @@ body {
height: 150px*/ height: 150px*/
background-color: rgba(196, 196, 196, 1); background-color: rgba(196, 196, 196, 1);
margin: 5px; margin: 5px;
margin-left:110px; margin-left:130px;
} }
.listText { .listText {
grid-column: 2/3; grid-column: 2/3;
text-align: left; text-align: left;
margin: 10px; margin: 10px;
margin-left:130px; margin-left:100px;
} }
.daysLeft { .daysLeft {
font-family: "Roboto Black"; font-family: "Roboto Black";
...@@ -179,55 +179,27 @@ body { ...@@ -179,55 +179,27 @@ body {
font-family: "Roboto"; font-family: "Roboto";
font-size: 14px; font-size: 14px;
} }
.one { .listToBuy {
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 {
grid-column: 3/4; grid-column: 3/4;
grid-row: 2/3; grid-row: 2/4;
} background-color: rgba(175, 175, 175);
.seven {
grid-column: 3/4;
grid-row: 3/4;
} }
.eight { .toBuyText {
grid-column: 3/4; font-size: 20px;
grid-row: 4/5; text-align: center;
margin: 15px;
font-family: "Roboto Medium";
} }
.nine {
grid-column: 4/5; .one {
grid-column: 2/5;
grid-row: 1/2; grid-row: 1/2;
} }
.ten {
grid-column: 4/5; a {
grid-row: 2/3; color: rgba(0,0,0,0);
}
.eleven {
grid-column: 4/5;
grid-row: 3/4;
} }
.twelve {
grid-column: 4/5;
grid-row: 4/5;
} */
@font-face { @font-face {
font-family: Roboto Bold; font-family: Roboto Bold;
......
Breadcrumbs/views.py
View file @ 00c6ebe6
...@@ -43,7 +43,7 @@ class ProductListViewCategory(ListView): ...@@ -43,7 +43,7 @@ class ProductListViewCategory(ListView):
class ToBuyViewName(ListView): class ToBuyViewName(ListView):
model = Product_Type model = Product_Type
template_name = 'placeholder-list.html' template_name = 'to-buy.html'
context_object_name = 'product' context_object_name = 'product'
def get_queryset(self): def get_queryset(self):
...@@ -93,6 +93,7 @@ def add_product_type(request): ...@@ -93,6 +93,7 @@ def add_product_type(request):
return render(request,'add-product-type.html',context) return render(request,'add-product-type.html',context)
def delete_product_type(request,id): def delete_product_type(request,id):
model = Product_Type
context = {} context = {}
obj = get_object_or_404(Product_Type,Product_ID = id) obj = get_object_or_404(Product_Type,Product_ID = id)
......
templates/add-item.html
View file @ 00c6ebe6
<!DOCTYPE html> <html>
<html lang="en">
{% load static %}
<link rel="stylesheet" href="{%static "sidebar.css" %}">
<head> <head>
<meta charset="UTF-8"> {% load static %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="{%static "mainAddItem.css" %}">
<title>Add Item</title>
</head> </head>
<body> <body>
<div class = "listViewHeader"> <div class = "listViewHeader">
...@@ -15,42 +11,49 @@ ...@@ -15,42 +11,49 @@
</div> </div>
<div class = "lowerPage"> <div class = "lowerPage">
<div class = "sidebar"> <div class = "sidebar">
<div class = "sideItem text fridge"> <div class = "sideItem fridge">
FRIDGE <div class = " sideText"><a href="http://127.0.0.1:8000/fridge/list/"> FRIDGE</a> </div>
</div> </div>
<div class = "sideItem icon fridge"> <img id= "fridgeIcon" src= "" alt= "a flat icon of a refrigerator";>
<div class = "circle"> :3 </div>
<div class = "sideItem stats">
<div class = "sideText"> STATS </div>
</div> </div>
<img id= "statsIcon" src= "" alt= "a flat icon of a graph";>
<div class = "sideItem text recipes"> <div class = "sideItem toBuy">
RECIPES <div class = "sideText"> <a href = "http://127.0.0.1:8000/to-buy/">TO BUY</a> </div>
</div> </div>
<div class = "sideItem icon recipes"> <img id= "toBuyIcon" src= "" alt= "a flat icon of a shopping cart";>
<div class = "circle"> :3 </div>
</div> </div>
<div class = "sideItem text stats"> <div class = "pageSubhead">
STATS <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 = "sideItem icon stats">
<div class = "circle"> :3 </div>
</div> </div>
<div class = "changeView">
<div class = "sideItem text toBuy"> <div class = "changeViewDropdown">
TO BUY <div class = "changeViewText"> LIST VIEW </div>
</div> </div>
<div class = "sideItem icon toBuy">
<div class = "circle"> :3 </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>
</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> </body>
</html> </html>
\ No newline at end of file
templates/placeholder-list.html
View file @ 00c6ebe6
...@@ -16,17 +16,23 @@ ...@@ -16,17 +16,23 @@
<div class = "lowerPage"> <div class = "lowerPage">
<div class = "sidebar"> <div class = "sidebar">
<div class = "sideItem fridge"> <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> </div>
<img id= "fridgeIcon" src= "" alt= "a flat icon of a refrigerator";> <img id= "fridgeIcon" src= "" alt= "a flat icon of a refrigerator";>
<div class = "sideItem stats"> <div class = "sideItem stats">
<a href = "">
<div class = "sideText"> STATS </div> <div class = "sideText"> STATS </div>
</a>
</div> </div>
<img id= "statsIcon" src= "" alt= "a flat icon of a graph";> <img id= "statsIcon" src= "" alt= "a flat icon of a graph";>
<div class = "sideItem toBuy"> <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> </div>
<img id= "toBuyIcon" src= "" alt= "a flat icon of a shopping cart";> <img id= "toBuyIcon" src= "" alt= "a flat icon of a shopping cart";>
</div> </div>
......
templates/product-type-confirm-delete.html
View file @ 00c6ebe6
<html> <html>
<head>
{% load static %}
<link rel="stylesheet" href="{%static "sidebar.css" %}">
</head>
<body> <body>
<form method="post">{% csrf_token %} <div class = "listViewHeader">
<p>Are you sure you want to delete "{{ object }}"?</p> <div class = "breadcrumbsHead">
<input type="submit" value="Confirm"> BREADCRUMBS
</form> </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> </body>
</html> </html>
templates/registration/login.html
View file @ 00c6ebe6
{% load static %} {% load static %}
<link rel="stylesheet" href="{%static "sidebar.css" %}"> <html>
<div class = "listViewHeader"> <head>
<link rel="stylesheet" href="{%static "mainLogIn.css" %}">
</head>
<body>
<div class = "loginHeader">
<div class = "breadcrumbsHead"> <div class = "breadcrumbsHead">
BREADCRUMBS BREADCRUMBS
</div> </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> </div>
<form method="post"> </a>
</div>
</div>
<div class = "lowerPage">
<div class = "loginArea">
<div class = "breadcrumbsText"> BREADCRUMBS </div>
<div class = "loginText2"> Log In </div>
<form method="POST">
{% csrf_token %} {% csrf_token %}
{{ form.as_p }} <div class = "continueText">{{ form.non_field_errors }}
<button type="submit">Log In</button> {{ form.username.errors }}
</form> {{ form.password.errors }}</div>
\ No newline at end of file <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> {% load static %}
<html> <html>
<head> <head>
<title> Sign Up to BreadCrumbs! </title> <link rel="stylesheet" href="{%static "mainSignUp.css" %}">
<!-- I used a random css online so pls change it to what we're using --> </head>
<link rel="stylesheet" href "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<body> <body>
<center> <div class = "signupHeader">
<h1 class = 'alert alert-success'> Sign Up </h1> <div class = "breadcrumbsHead">
<h3 class = "p-3 mb-2 bg-primary text-white" style = 'font-size: 50px;'>BREADCRUMBS EMAIL </h3> 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"> <form method="POST">
<!-- Very Important csrf Token --> <!-- Very Important csrf Token -->
{% csrf_token %} {% csrf_token %} <br>
<div class = "form-group">
<p> <div class = "getStartedText">{{ form.non_field_errors }}
<h3> {{ form.as_p }} </h3> {{ form.username.errors }}
</p> {{ form.email.errors }}
<br> {{ form.password1.errors }}
<input type="submit" name="SignUp" class = 'btn btn-primary btn-lg'> {{ 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> </div>
</form> </form>
</center> </div>
</body> </body>
</html> </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