Started working on new item form

fincom/items/urls.py

@@ -3,4 +3,5 @@ from . import views
 
 urlpatterns = [
     url(r'^$', views.list, name='list'),
+    url(r'^new$', views.new_form, name='new_form'),
 ]

fincom/items/views.py

@@ -1,6 +1,7 @@
 from django.shortcuts import HttpResponse
 from django.template import loader
 from models import Item
+from committee.models import Committee
 
 
 # Create your views here.
@@ -11,3 +12,11 @@ def list(request):
     }
 
     return HttpResponse(template.render(context, request))
+
+def new_form(request):
+    template = loader.get_template('items/new.html')
+    context = {
+        'committees': Committee.objects.order_by('name'),
+    }
+
+    return HttpResponse(template.render(context, request))

fincom/static/sass/globals.scss

@@ -14,7 +14,7 @@ $pad-xl: 36;
 
 body {
 	color: $text;
-	font-family: Sans-Serif;
+	font-family: sans-serif;
 	background-color: $lightgray;
 	padding-bottom: 0px;
 	margin: 0px $pad-l;

fincom/static/sass/include.scss

@@ -1,2 +1,4 @@
+@import 'globals';
 @import 'items';
 @import 'login';
+@import 'new';

fincom/static/sass/items.scss

@@ -1,5 +1,3 @@
-@import 'globals';
-
 .item {
 	padding: $pad-m $pad-xl;
 	margin: 0px;
@@ -17,6 +15,7 @@
 	.details-row {
 		margin: $pad-m 0;
 		font-size: 16px;
+		font-weight: lighter;
 		color: $text;
 		padding: 0px;
 

fincom/static/sass/login.scss

@@ -1,5 +1,3 @@
-@import 'globals';
-
 body.login {
 	background-color: $purple;
 	color: $gold;

fincom/static/sass/new.scss

@@ -0,0 +1,54 @@
+h1 {
+	font-size: 18px;
+	font-weight: lighter;
+	color: $purple;
+	margin: $pad-l;
+}
+
+hr {
+	margin: $pad-l;
+	color: $midgray;
+}
+
+
+form {
+	div {
+		margin: $pad-l;
+		width: 376px;
+
+		* {
+			display: inline-block;
+		}
+
+		label {
+			text-align: right;
+			width: 180px;
+			color: $text;
+			vertical-align: top;
+		}
+
+		input, select, textarea {
+			width: 180px;
+			float: right;
+		}
+
+		&.clear {
+			margin: -$pad-l 0;
+			width: 180px;
+		}
+
+		&.clear:after {
+			content: "";
+			display: table;
+			clear: both;
+		}
+	}
+}
+
+.rcol {
+	float: right;
+	width: 40%;
+	margin: $pad-l;
+	color: $midgray;
+	font-weight: lighter;
+}

fincom/templates/items/new.html

@@ -0,0 +1,68 @@
+{% extends "../boilerplate.html" %}
+
+{% block title %}New Reimbursement{% endblock %}
+
+{% block main %}
+
+<h1>Add New Reimbursements</h1>
+<hr>
+
+<div class="rcol">
+  Make sure all information is accurate, you submit and itemized receipt, and
+  you select the correct committee.
+</div>
+
+<form action="/new/" method="post">
+  {% csrf_token %}
+  <div>
+    <label for="desc">Item</label>
+    <input id="desc" type="text" name="desc" placeholder="What you bought">
+  </div>
+
+  <div>
+    <label for="event">Event</label>
+    <input id="event" type="text" name="event" placeholder="When we need it">
+  </div>
+
+  <div>
+    <label for="committee">Committee or Budget</label>
+    <select name="committee" id="committee">
+      <option disabled selected>Select a committee</option>
+      {% for C in committees %}
+      <option>{{ C.name }}</option>
+      {% endfor %}
+    </select>
+  </div>
+
+  <div>
+    <label for="cost">Cost</label>
+    <input id="cost" type="text" name="cost" placeholder="15.00">
+  </div>
+
+  <div>
+    <label for="date">Date Purchased</label>
+    <input id="date" type="date" name="date" placeholder="mm/dd/yyyy">
+  </div>
+
+  <div class="clear">
+    <div>
+    <label for="details">Details</label>
+    <textarea id="details" name="details" rows="4" class="clear"></textarea>
+    </div>
+  </div>
+
+  <div>
+    <label for="image">Receipt</label>
+    <input type="file" name="image" id="image">
+  </div>
+
+  <div>
+  <input type="submit">
+  </div>
+</form>
+
+
+
+
+
+{% endblock %}