Updated Feature edit style

rpg-docs/client/views/character/features/featureDialog/featureDialog.html

@@ -4,27 +4,30 @@
 			<core-toolbar>
 				<paper-icon-button id="backButton" role="button" tabindex="0" icon="arrow-back" aria-label="close"></paper-icon-button>
 				<div flex>{{name}}</div>
-				<paper-menu-button>
-					<paper-icon-button role="button" tabindex="0" icon="delete" aria-label="Delete Feature" noink></paper-icon-button>
-					<paper-dropdown layered class="dropdown">
-						<paper-button id="deleteFeature">Delete Feature</paper-button>
-						<paper-button>Cancel</paper-button>
-					</paper-dropdown>
-				</paper-menu-button>
+				<paper-icon-button id="deleteFeature" 
+								   role="button"
+								   tabindex="0"
+								   icon="delete" 
+								   aria-label="Delete Feature" 
+								   noink></paper-icon-button>
 			</core-toolbar>
 			<div class="featureContent">
 				<paper-input id="featureNameInput" label="Name" floatinglabel value={{name}}></paper-input>
+				<hr style="margin: 16px 0 16px 0;">
 				<paper-input-decorator label="Description" floatinglabel layout vertical>
 					<paper-autogrow-textarea>
 						<textarea id="featureDescriptionInput" placeholder aria-label="Description" value={{description}}></textarea>
 					</paper-autogrow-textarea>
 				</paper-input-decorator>
-				<h3>Effects</h3>
-				{{#each effects}}
-					{{>effectEdit}}
-				{{/each}}
-				<div layout horizontal end-justified>
-					<paper-button id="addEffectButton"  raised>Add Effect</paper-button>
+				<hr style="margin: 16px 0 16px 0;">
+				<div id="effects">
+					<h2>Effects</h2>
+					{{#each effects}}
+						{{>effectEdit}}
+					{{/each}}
+					<div layout horizontal end-justified>
+						<paper-button id="addEffectButton"  raised>Add Effect</paper-button>
+					</div>
 				</div>
 			</div>
 		</core-header-panel>

rpg-docs/client/views/character/features/featureDialog/featureDialog.js

@@ -4,6 +4,16 @@ Template.featureDialog.rendered = function(){
 		var feature = Features.findOne(Template.currentData().featureId, {fields: {name: 1}});
 		if(feature && feature.name) Session.set("global.ui.dialogHeader", feature.name);
 	})
+	//update all autogrows after they've been filled
+	var pata = this.$("paper-autogrow-textarea");
+	pata.each(function(index, el){
+		el.update($(el).children().get(0));
+	})
+	//update all input fields as well
+	var input = this.$("paper-input");
+	input.each(function(index, el){
+		el.valueChanged();
+	})
 	//after the dialog is built, open it
 	if (!this.alreadyRendered){
 		Session.set("global.ui.detailShow", true);

rpg-docs/client/views/character/features/featureDialog/featuresDialog.css

@@ -9,4 +9,5 @@ body /deep/ .featureDialogWidth {
 #addEffectButton {
 	background: #d23f31;
 	color: #fff;
+	margin-top: 16px;
 }