Improved bio styling and fixed penis sizes.

pages/actors/@actorId/edit/+Page.vue

@@ -141,6 +141,48 @@
 							>{{ option?.label || option }}</option>
 						</select>
 
+						<div
+							v-if="item.type === 'size'"
+							class="figure size"
+						>
+							<div class="value-section">
+								<span class="value-label">Units</span>
+
+								<select
+									v-model="sizeUnits"
+									class="input"
+									:disabled="!editing.has(item.key)"
+								>
+									<option value="imperial">Imperial</option>
+									<option value="metric">Metric</option>
+								</select>
+							</div>
+
+							<span class="figure-bust">
+								<div class="value-section">
+									<span class="value-label">Bust</span>
+
+									<select
+										v-model="edits[item.key].bust"
+										class="select input"
+										placeholder="Bust"
+										:disabled="!editing.has(item.key)"
+									>
+										<option
+											:key="`${item.key}-bust-unknown`"
+											:value="null"
+										/>
+
+										<option
+											v-for="bust in bustSizes[figureUnits]"
+											:key="`${item.key}-bust-${bust}`"
+											:value="Array.isArray(bust) ? bust[0] : bust"
+										>{{ Array.isArray(bust) ? bust.join('/') : bust }}</option>
+									</select>
+								</div>
+							</span>
+						</div>
+
 						<div
 							v-if="item.type === 'place'"
 							class="place"
@@ -755,18 +797,12 @@ const fields = computed(() => [
 		},
 	},
 	{
-		key: 'height',
-		type: 'number',
-		value: actor.value.height?.metric,
-		unit: 'cm',
-		inline: true,
-	},
-	{
-		key: 'weight',
-		type: 'number',
-		value: actor.value.weight?.metric,
-		unit: 'kg',
-		inline: true,
+		key: 'size',
+		type: 'size',
+		value: {
+			height: actor.value.height?.metric,
+			weight: actor.value.weight?.metric,
+		},
 	},
 	{
 		key: 'figure',
@@ -866,8 +902,8 @@ const fields = computed(() => [
 		key: 'penis',
 		type: 'penis',
 		value: {
-			penisLength: actor.value.penisLength,
-			penisGirth: actor.value.penisGirth,
+			penisLength: actor.value.penisLength.imperial,
+			penisGirth: actor.value.penisGirth.imperial,
 			isCircumcised: actor.value.isCircumcised,
 		},
 	},
@@ -887,6 +923,7 @@ const comment = ref(null);
 const apply = ref(user.role !== 'user');
 const submitted = ref(false);
 
+const sizeUnits = ref('metric');
 const figureUnits = ref('us');
 const penisUnits = ref('imperial');