diff --git a/rpg-docs/client/views/character/features/featureDialog/featureDialog.html b/rpg-docs/client/views/character/features/featureDialog/featureDialog.html
index 45a49e37..a5a76035 100644
--- a/rpg-docs/client/views/character/features/featureDialog/featureDialog.html
+++ b/rpg-docs/client/views/character/features/featureDialog/featureDialog.html
@@ -1,40 +1,85 @@
 <template name="featureDialog">
 	{{#with feature}}
-		{{#baseDialog title=name class=colorClass}}
-			<!--name-->
-			<paper-input id="featureNameInput" label="Name" floatinglabel value={{name}}></paper-input>
-			<hr style="margin: 16px 0 16px 0;">
-			<!--description-->
-			<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>
-			<hr style="margin: 16px 0 16px 0;">
-			<div layout horizontal center style="height: 60px;">
-				<div class="caption">Limit Uses</div>
-				<paper-toggle-button id="limitUseCheck"
-									 checked={{usesSet}} 
-									 role="button" 
-									 aria-pressed="false" 
-									 tabindex="0" 
-									 touch-action="pan-y"
-									 style="margin-left: 8px; margin-right:8px;">
-				</paper-toggle-button>
-				{{#if usesSet}}
-				<paper-input id="usesInput" label="Uses" floatinglabel value={{uses}}></paper-input>
-				{{/if}}
-				<paper-dropdown-menu id="enabledDropdown" label="Enable Feature">
-					<paper-dropdown layered class="dropdown">
-						<core-menu id="enabledMenu" class="menu"  selected={{enabled}} on-tap="onStatMenuTap">
-							<paper-item name="alwaysEnabled"> Always Enabled </paper-item>
-							<paper-item name="enabled">       Enabled        </paper-item>
-							<paper-item name="disabled">      Disabled       </paper-item>
-						</core-menu>
-					</paper-dropdown>
-				</paper-dropdown-menu>
-			</div>
-			{{> effectsEditList parentId=_id parentCollection="Features" charId=charId type="feature" name=name enabled=isEnabled}}
+		{{#baseDialog title=name class=colorClass showEdit=true editing=editing}}
+			{{#if editing}}
+				{{> featureEdit}}
+			{{else}}
+				{{> featureDetails}}
+			{{/if}}
 		{{/baseDialog}}
 	{{/with}}
-</template>
\ No newline at end of file
+</template>
+
+<template name="featureDetails">
+	{{#if or canEnable hasUses}}
+		<div layout horizontal center justified wrap>
+			{{#if canEnable}}
+				<div>enabled:</div>
+				<paper-checkbox class="sideMargin" checked={{enabled}}></paper-checkbox>
+			{{/if}}
+			{{#if hasUses}}
+				<div class="subhead" style="margin-right: 16px">
+					Uses: {{usesLeft}}/{{usesValue}}
+				</div>
+			{{/if}}
+			{{#if hasUses}}
+				<div layout horizontal>
+					<paper-button class="useFeature" disabled={{noUsesLeft}}>Use</paper-button>
+					<paper-button class="resetFeature" disabled={{usesFull}}>Reset</paper-button>
+				</div>
+			{{/if}}
+		</div>
+
+		<hr class="vertMargin">
+	{{/if}}
+
+	{{#if description}}
+		<div class="prewrap">{{description}}</div>
+	{{/if}}
+
+	{{> effectsViewList charId=charId parentId=_id}}
+</template>
+
+<template name="featureEdit">
+	<!--name-->
+	<paper-input id="featureNameInput" class="fullwidth" label="Name" floatinglabel value={{name}}></paper-input>
+
+	<hr class="vertMargin">
+
+	<div layout horizontal center style="height: 60px;">
+		<paper-dropdown-menu id="enabledDropdown" label="Enable Feature">
+			<paper-dropdown layered class="dropdown">
+				<core-menu id="enabledMenu" class="menu"  selected={{enabledSelection}} on-tap="onStatMenuTap">
+					<paper-item name="alwaysEnabled"> Always Enabled </paper-item>
+					<paper-item name="enabled">       Enabled        </paper-item>
+					<paper-item name="disabled">      Disabled       </paper-item>
+				</core-menu>
+			</paper-dropdown>
+		</paper-dropdown-menu>
+		<div layout horizontal center class="sideMargin">
+			<div>Limit Uses: </div>
+			<paper-toggle-button id="limitUseCheck"
+								 class="sideMargin"
+								 checked={{usesSet}}
+								 role="button" 
+								 aria-pressed="false"
+								 tabindex="0"
+								 touch-action="pan-y">
+			</paper-toggle-button>
+		</div>
+		{{#if usesSet}}
+			<paper-input flex id="usesInput" label="Uses" floatinglabel value={{uses}}></paper-input>
+		{{/if}}
+	</div>
+
+	<hr class="vertMargin">
+
+	<!--description-->
+	<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>
+
+	{{> effectsEditList parentId=_id parentCollection="Features" charId=charId type="feature" name=name enabled=enabled}}
+</template>
diff --git a/rpg-docs/client/views/character/features/featureDialog/featureDialog.js b/rpg-docs/client/views/character/features/featureDialog/featureDialog.js
index 7d52ace0..5ffa015e 100644
--- a/rpg-docs/client/views/character/features/featureDialog/featureDialog.js
+++ b/rpg-docs/client/views/character/features/featureDialog/featureDialog.js
@@ -1,12 +1,80 @@
+Template.featureDialog.onCreated(function(){
+	this.editing = new ReactiveVar(false);
+});
+
+Template.featureDialog.helpers({
+	editing: function(){
+		return Template.instance().editing.get();
+	},
+	feature: function(){
+		return Features.findOne(this.featureId);
+	},
+});
+
 Template.featureDialog.events({
 	"color-change": function(event, instance){
 		Features.update(instance.data.featureId, {$set: {color: event.color}});
 	},
+	"tap #editButton": function(event, instance){
+		instance.editing.set(true);
+	},
+	"tap #doneEditingButton": function(event, instance){
+		instance.editing.set(false);
+	},
 	"tap #deleteButton": function(event, instance){
 		Features.softRemoveNode(instance.data.featureId);
 		GlobalUI.deletedToast(instance.data.featureId, "Features", "Feature");
 		GlobalUI.closeDetail();
 	},
+});
+
+Template.featureDetails.helpers({
+	or: function(a, b){
+		return a ||b;
+	},
+	hasUses: function(){
+		return this.usesValue() > 0;
+	},
+	noUsesLeft: function(){
+		return this.usesLeft() <= 0;
+	},
+	usesFull: function(){
+		return this.usesLeft() >= this.usesValue();
+	},
+});
+
+Template.featureDetails.events({
+	"tap .useFeature": function(event){
+		var featureId = this._id;
+		Features.update(featureId, {$inc: {used: 1}});
+	},
+	"tap .resetFeature": function(event){
+		var featureId = this._id;
+		Features.update(featureId, {$set: {used: 0}});
+	},
+
+	"change .enabledCheckbox": function(event){
+		var enabled = !this.enabled;
+		Features.update(this._id, {$set: {enabled: enabled}});
+	}
+});
+
+Template.featureEdit.onRendered(function(){
+	updatePolymerInputs(this);
+});
+
+Template.featureEdit.helpers({
+	usesSet: function(){
+		return _.isString(this.uses);
+	},
+	enabledSelection: function(){
+		if(!this.enabled) return "disabled";
+		if(this.alwaysEnabled) return "alwaysEnabled";
+		return "enabled";
+	}
+});
+
+Template.featureEdit.events({
 	"change #featureNameInput": function(event){
 		var name = Template.instance().find("#featureNameInput").value;
 		Features.update(this._id, {$set: {name: name}});
@@ -45,15 +113,3 @@ Template.featureDialog.events({
 		Features.update(this._id, {$set: setter});
 	},
 });
-
-Template.featureDialog.helpers({
-	feature: function(){
-		return Features.findOne(this.featureId);
-	},
-	usesSet: function(){
-		return _.isString(this.uses);
-	},
-	isEnabled: function(){
-		return this.enabled !== "disabled";
-	}
-});
\ No newline at end of file