Updated edit UI for keeping save/cancel buttons on the bottom of the screen

frontend/delta/scss/core/layout.scss

@@ -512,15 +512,38 @@ div.cardContent {
 	line-height: $mainCardToolbarHeight;
 	
 	&.edit {
+		@include order(1);
+
 		@include chromeFix();
 
 		li.save {
 			cursor: default;
+			background-color: #55aa55;
+		}
+		li.cancel {
+			background-color: #666666;
+
+			&:hover {
+				background-color: #444444;
+			};
 		}
 		
 		&.hasPendingChanges {
 			li.save {
 				cursor: pointer;
+				background-color: #22aa22;
+
+				&:hover {
+					background-color: #1a801a;
+				};
+			}
+
+			li.cancel {
+				background-color: #aa2222;
+
+				&:hover {
+					background-color: #dd1111;
+				};
 			}
 		}
 	}

frontend/delta/scss/style/card.scss

@@ -267,7 +267,18 @@ $cardViewBasePadding: 10px;
 			background-color: $cardToolbarBackgroundColor;
 			color: white;
 
-//			box-shadow: inset 2px 0 6px 0 rgba(0, 0, 0, 0.1);
+			&.narrow {
+				@include transition(height, 2.5s, ease-in);
+
+				&.commands {
+					height: 12px;
+
+					div {
+						display: none;
+						visibility: hidden;
+					}
+				}
+			}
 		}
 		
 		.cardField {
@@ -316,7 +327,16 @@ $cardViewBasePadding: 10px;
 
 
 
-
+.edit {
+	.cardDetailToolbar {
+		&.commands {
+			div, ul {
+				display: none;
+				visibility: hidden;
+			}
+		}
+	}
+}
 
 .cardDetailToolbar {
 	&.edit {
@@ -342,7 +362,7 @@ $cardViewBasePadding: 10px;
 			}
 		}
 	}
-	
+
 	ul {
 		li {
 			text-align: center;