diff --git a/app/imports/ui/creature/character/characterSheetTabs/StatsTab.vue b/app/imports/ui/creature/character/characterSheetTabs/StatsTab.vue
index f21ca745..7fcce972 100644
--- a/app/imports/ui/creature/character/characterSheetTabs/StatsTab.vue
+++ b/app/imports/ui/creature/character/characterSheetTabs/StatsTab.vue
@@ -79,7 +79,7 @@
         class="stat"
       >
         <attribute-card
-          v-bind="stat"
+          :model="stat"
           :data-id="stat._id"
           @click="clickProperty({_id: stat._id})"
         />
@@ -91,8 +91,7 @@
         class="modifier"
       >
         <attribute-card
-          modifier
-          v-bind="modifier"
+          :model="modifier"
           :data-id="modifier._id"
           @click="clickProperty({_id: modifier._id})"
         />
@@ -105,7 +104,7 @@
       >
         <attribute-card
           modifier
-          v-bind="check"
+          :model="check"
           :data-id="check._id"
           @click="clickProperty({_id: check._id})"
         />
diff --git a/app/imports/ui/properties/components/attributes/AttributeCard.vue b/app/imports/ui/properties/components/attributes/AttributeCard.vue
index d8a2452a..40346c71 100644
--- a/app/imports/ui/properties/components/attributes/AttributeCard.vue
+++ b/app/imports/ui/properties/components/attributes/AttributeCard.vue
@@ -1,43 +1,58 @@
 <template lang="html">
-  <v-card :hover="hasClickListener" @click="click">
-  	<v-card-text>
-  		<div class="layout row align-center">
-  			<div class="value display-1 mr-1">
-  				{{modifier ? signed(value) : value}}
-  			</div>
-				<div class="name text-truncate">
-					{{name}}
-				</div>
-  		</div>
-  	</v-card-text>
+  <v-card
+    :hover="hasClickListener"
+    @click="click"
+  >
+    <v-card-text>
+      <div class="layout row align-center">
+        <div class="value display-1 mr-1">
+          {{ computedValue }}
+        </div>
+        <div class="name text-truncate">
+          {{ model.name }}
+        </div>
+      </div>
+    </v-card-text>
   </v-card>
 </template>
 
 <script>
-	import numberToSignedString from '/imports/ui/utility/numberToSignedString.js';
-	export default {
-		props: {
-			name: String,
-			value: Number,
-			modifier: Boolean,
-		},
-		methods: {
-			signed: numberToSignedString,
-			click(e){
-				this.$emit('click', e);
-			},
-		},
-		computed: {
-			hasClickListener(){
-	    	return this.$listeners && !!this.$listeners.click
-			},
-		},
-	}
+  import numberToSignedString from '/imports/ui/utility/numberToSignedString.js';
+  export default {
+    props: {
+      model: {
+        type: Object,
+        required: true,
+      },
+    },
+    computed: {
+      hasClickListener(){
+        return this.$listeners && !!this.$listeners.click
+      },
+      computedValue(){
+        if (this.model.type === 'attribute'){
+          if (this.model.attributeType === 'modifier'){
+            return numberToSignedString(this.model.currentValue);
+          } else {
+            return this.model.currentValue
+          }
+        } else {
+          return this.model.value;
+        }
+      }
+    },
+    methods: {
+      signed: numberToSignedString,
+      click(e){
+        this.$emit('click', e);
+      },
+    },
+  }
 </script>
 
 <style lang="css" scoped>
-	.value {
-		min-width: 64px;
-		text-align: center;
-	}
+  .value {
+    min-width: 64px;
+    text-align: center;
+  }
 </style>