1 files changed, 30 insertions, 28 deletions
diff --git a/src/tools/http-status-codes/http-status-codes.vue b/src/tools/http-status-codes/http-status-codes.vue
index 9f827f5..0fb1125 100644
--- a/src/tools/http-status-codes/http-status-codes.vue
+++ b/src/tools/http-status-codes/http-status-codes.vue
@@ -1,3 +1,27 @@
+<script setup lang="ts">
+import { SearchRound } from '@vicons/material';
+import { codesByCategories } from './http-status-codes.constants';
+import { useFuzzySearch } from '@/composable/fuzzySearch';
+
+const search = ref('');
+
+const { searchResult } = useFuzzySearch({
+  search,
+  data: codesByCategories.flatMap(({ codes, category }) => codes.map(code => ({ ...code, category }))),
+  options: {
+    keys: [{ name: 'code', weight: 3 }, { name: 'name', weight: 2 }, 'description', 'category'],
+  },
+});
+
+const codesByCategoryFiltered = computed(() => {
+  if (!search.value) {
+    return codesByCategories;
+  }
+
+  return [{ category: 'Search results', codes: searchResult.value }];
+});
+</script>
+
 <template>
   <div>
     <n-form-item :show-label="false">
@@ -21,35 +45,13 @@
       <n-h2> {{ category }} </n-h2>
 
       <c-card v-for="{ code, description, name, type } of codes" :key="code" mb-2>
-        <n-text strong block text-lg> {{ code }} {{ name }} </n-text>
-        <n-text block depth="3">{{ description }} {{ type !== 'HTTP' ? `For ${type}.` : '' }}</n-text>
+        <n-text strong block text-lg>
+          {{ code }} {{ name }}
+        </n-text>
+        <n-text block depth="3">
+          {{ description }} {{ type !== 'HTTP' ? `For ${type}.` : '' }}
+        </n-text>
       </c-card>
     </div>
   </div>
 </template>
-
-<script setup lang="ts">
-import { useFuzzySearch } from '@/composable/fuzzySearch';
-import { SearchRound } from '@vicons/material';
-import { codesByCategories } from './http-status-codes.constants';
-
-const search = ref('');
-
-const { searchResult } = useFuzzySearch({
-  search,
-  data: codesByCategories.flatMap(({ codes, category }) => codes.map((code) => ({ ...code, category }))),
-  options: {
-    keys: [{ name: 'code', weight: 3 }, { name: 'name', weight: 2 }, 'description', 'category'],
-  },
-});
-
-const codesByCategoryFiltered = computed(() => {
-  if (!search.value) {
-    return codesByCategories;
-  }
-
-  return [{ category: 'Search results', codes: searchResult.value }];
-});
-</script>
-
-<style lang="less" scoped></style>