Avery

app/views/add/index.html.erb

@@ -13,28 +13,31 @@
 
 	<%= form_tag("/logs/create", class: "simple-input-groups", method: "post") do %>
 		<div class="input-group input-group">
-			<span class="input-group-addon" id="basic-addon1">PLATE NUMBER</span>
-			<input type="text" class="form-control" name="plate_number" placeholder="plate number"/>
+			<span class="input-group-addon" id="basic-addon1">PLATE NUMBER:	</span>
+			<input type="text" class="form-control" name="plate_number" placeholder="ex. AAA 111"/>
 		</div>
 		<br>
 		<div class="input-group input-group">
-		<input type="time" class="form-control" name="time_in"/><br>
+		<span class="input-group-addon" id="basic-addon1">TIME-IN:	</span><input type="time" class="form-control" name="time_in"/><br>
 		</div>
+		<br>
 		<div class="input-group input-group">
-		<input type="time"class="form-control"  name="time_out"/><br>
+		<span class="input-group-addon" id="basic-addon1">TIME-OUT:	</span><input type="time"class="form-control"  name="time_out"/><br>
 		</div>
+		<br>
 		<div class="input-group input-group">
-		<select class="form-control" name="color">
+		<span class="input-group-addon" id="basic-addon1">COLOR:	</span><select class="form-control" name="color">
 			<option value="White">White</option>
 			<option value="Black">Black</option>
 			<option value="Silver">Silver</option>
 			<option value="Red">Red</option>
 			<option value="Blue">Blue</option>
 			<option value="Yellow">Yellow</option>
-		</select><br>
+		</select>
 		</div>
+		<br>
 		<div class="input-group input-group">
-		<select class="form-control" name="brand">
+		<span class="input-group-addon" id="basic-addon1">BRAND:	</span><select class="form-control" name="brand">
 			<option value="Honda">Honda</option>
 			<option value="Toyota">Toyota</option>
 			<option value="Ford">Ford</option>
@@ -43,9 +46,10 @@
 			<option value="Mercedes Benz">Mercedes Benz</option>
 			<option value="Ferrari">Ferrari</option>
 			<option value="Hyundai">Hyundai</option>
-		</select><br>
+		</select>
 		</div>
-		<input type="submit" class="btn btn-default navbar-btn" value="SAVE"/>
-	<% end %><br>
+		<br>
+		<input type="submit" class="btn btn-default navbar-btn" value="Save"/>
+	<% end %>
 	</div>
 </div>
\ No newline at end of file

app/views/layouts/application.html.erb

@@ -14,9 +14,23 @@
 			font-family: "ProximaNova", sans-serif;
 			font-size: 2vh;
 			font-weight: bold;
-			color: #585858;
+			color: #aaa;
 			text-transform: uppercase;
 			letter-spacing: 1px;
+			margin: 0px;
+		}
+
+		a {
+			color: white;
+		}
+
+		li {
+			display: inline;
+			margin: 10px;
+		}
+
+		h1 {
+			color: white;
 		}
 
 		.flexboxed-row {
@@ -46,7 +60,7 @@
 			align-items: center;
 		}
 		.navbar-custom {
-			background-color: #4c4c4c;
+			background-color: #2D2D2D;
 		}
 		.bottom-bar {
 			position: fixed;
@@ -62,9 +76,11 @@
 		.item-option {
 			display: block;
 			background-color: white;
+			color: #3D3D3D;
 			border-radius: 2px;
 			border: none;
 			margin: 12px;
+			text-decoration: none;
 
 			text-align: center;
 			padding: 9px 12px;
@@ -93,6 +109,30 @@
 			color: white;
 		}
 
+		.input-group-addon {
+			color: #aaa;
+		}
+
+		.item-option-delete {
+			display: inline-block;
+			background-color: #990000;
+			color: #aaa;
+			border-radius: 50px;
+			border: none;
+			margin: 12px;
+			margin-left: 200px;
+			text-decoration: none;
+
+			text-align: center;
+			padding: 9px 20px;
+			flex-grow: 1;
+			transition: 0.2s;
+		}
+
+		.item-option-delete:hover {
+			text-decoration: none;
+			background-color: #cc0000;
+		}
 
 	</style>
 	

app/views/logs/index.html.erb

@@ -9,7 +9,7 @@
 
 <div style="background-color: black" class="flexboxed-column wrapper bounceInRight animation">
 	<div style="max-height: 90%; max-width: 90%; height: 90%; width: 90%">
-		<h1 style="font-size: 3vh">Car Logs</h1><br>
+		<h1 style="font-size: 4vh">Car Logs</h1><br>
 		<ul>
 			<% @CarLogs.each do |car| %>
 				<div class="col-md-3 well" style="margin: 2vh">
@@ -21,7 +21,7 @@
 						Time out: <%= "#{car.time_out}" %><br>
 						Color: <%= "#{car.color}" %><br>
 						Brand: <%= "#{car.brand}" %><br>
-						<a class="item-option" href="/logs/delete/<%= car.id%>">Delete</a>
+						<a class="item-option-delete" href="/logs/delete/<%= car.id%>">Delete</a>
 					</li>
 				</div>
 			<% end %>