style: update CSS for a bitmap aesthetic, enhance export options in templates, and streamline form field styling

pages/templates/decision-framework.vue

@@ -3,6 +3,14 @@
     <!-- Wizard Subnav -->
     <WizardSubnav />
 
+    <!-- Export Options at Top -->
+    <div class="flex justify-center py-6">
+      <ExportOptions
+        :export-data="exportData"
+        filename="decision-framework"
+        title="Decision Framework Helper" />
+    </div>
+
     <div
       class="template-wrapper bg-white dark:bg-neutral-950 text-neutral-900 dark:text-neutral-100"
       style="font-family: 'Ubuntu', monospace">
@@ -385,10 +393,20 @@
         </div>
       </div>
     </div>
+
+    <!-- Export Options at Bottom -->
+    <div class="flex justify-center py-6">
+      <ExportOptions
+        :export-data="exportData"
+        filename="decision-framework"
+        title="Decision Framework Helper" />
+    </div>
   </div>
 </template>
 
 <script setup>
+import ExportOptions from '~/components/ExportOptions.vue'
+
 const state = reactive({
   urgency: 3,
   reversible: null,
@@ -916,6 +934,35 @@ function printResult() {
   window.print();
 }
 
+// Export data for standardized export component
+const exportData = computed(() => ({
+  formData: {
+    state: state,
+    currentStep: currentStep.value,
+    showResult: showResult.value,
+    result: result.value
+  },
+  surveyResponses: {
+    urgency: state.urgency,
+    reversible: state.reversible,
+    expertise: state.expertise,
+    impact: state.impact,
+    options: state.options,
+    investment: state.investment,
+    teamSize: state.teamSize
+  },
+  recommendedFramework: result.value || null,
+  metadata: {
+    completedAt: showResult.value ? new Date().toISOString() : null,
+    totalSteps: totalSteps,
+    progressPercentage: Math.round((currentStep.value / totalSteps) * 100)
+  },
+  exportedAt: new Date().toISOString(),
+  section: "decision-framework",
+  title: "Decision Framework Helper",
+  description: "Interactive wizard to find the right way to decide together"
+}))
+
 // Keyboard navigation
 onMounted(() => {
   const handleKeydown = (event) => {