Add styling

2026-11-14 13:58:21 +00:00 · 2023-04-13 23:14:52 +02:00
parent a9752a3aa8
commit acf74408c9
13 changed files with 364 additions and 67 deletions
@@ -0,0 +1,15 @@
+import { getAllData } from '../lib/icons'
+
+const getRandomItem = <Item>(items: Item[]): Item => items[Math.floor(Math.random()*items.length)];
+
+export default {
+  async load() {
+    const icons = await getAllData()
+
+    const randomIcons = Array.from({ length: 55 }, () => getRandomItem(icons))
+
+    return {
+      icons: randomIcons,
+    }
+  }
+}
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { data } from './HomeHeroIconsCard.data'
+import LucideIcon from './LucideIcon.vue'
+console.log(data);
+
+</script>
+
+<template>
+  <TransitionGroup class="icons-card" name="list" tag="div">
+    <LucideIcon
+      v-for="icon in data.icons"
+      v-bind="icon"
+    />
+  </TransitionGroup>
+</template>
+
+<style scoped>
+.icons-card {
+  background: var(--vp-input-bg-color);
+  padding: 24px;
+  border-radius: 8px;
+  width: 100%;
+  height:100%;
+  display: grid;
+  gap: 8px;
+  grid-template-columns: repeat(auto-fill, minmax(36px, 1fr));
+  grid-template-rows: repeat(auto-fill, minmax(36px, 1fr));
+  box-shadow: var(--vp-shadow-4);
+  overflow: hidden;
+}
+
+.list-move, /* apply transition to moving elements */
+.list-enter-active,
+.list-leave-active {
+  transition: all 0.5s ease;
+}
+
+.list-enter-from,
+.list-leave-to {
+  opacity: 0;
+  transform: translateX(30px);
+}
+
+/* ensure leaving items are taken out of layout flow so that moving
+   animations can be calculated correctly. */
+.list-leave-active {
+  position: absolute;
+}
+</style>
@@ -0,0 +1,31 @@
+<template>
+  <div class="extra-info">
+    Some Extra info hero
+  </div>
+</template>
+
+<style>
+.extra-info {
+    position: relative;
+    padding: 24px;
+}
+
+@media (min-width: 640px) {
+  .extra-info {
+    padding: 48px;
+  }
+}
+
+@media (min-width: 960px) {
+  .extra-info {
+    padding: 64px;
+  }
+}
+
+
+
+
+
+
+
+</style>
@@ -0,0 +1,132 @@
+<script setup lang="ts">
+  import type { IconEntity } from '../types'
+  import { ref, computed } from 'vue'
+  import {
+    Dialog,
+    DialogPanel,
+    DialogTitle,
+    DialogDescription,
+  } from '@headlessui/vue'
+import createLucideIcon from 'lucide-vue-next/src/createLucideIcon';
+
+  const props = defineProps<{
+    icon: IconEntity
+  }>()
+
+  const emit = defineEmits(['close'])
+
+  const isOpen = computed(() => !!props.icon)
+
+  function onClose() {
+    emit('close')
+  }
+
+  const size = 24
+
+  const gridLines = computed(() => Array.from({ length:(size - 1) }))
+
+  const iconComponent = computed(() => {
+    if (!props.icon) return null
+    return createLucideIcon(props.icon.name, props.icon.iconNode)
+  })
+</script>
+
+<template >
+  <div class="overlay-container" v-if="props.icon">
+    <div class="overlay-panel">
+      <div class="icon-container">
+        <component :is="iconComponent" class="icon-component" />
+        <svg class="icon-grid" :viewBox="`0 0 ${size} ${size}`" fill="none" stroke-width="0.1" xmlns="http://www.w3.org/2000/svg">
+          <g :key="`grid-${i}`" v-for="(_, i) in gridLines">
+            <line :key="`horizontal-${i}`" :x1="0" :y1="i + 1" :x2="size" :y2="i + 1" />
+            <line :key="`vertical-${i}`" :x1="i + 1" y1="0" :x2="i + 1" :y2="size" />
+          </g>
+        </svg>
+      </div>
+      <div class="icon-info">
+        <h1 class="icon-name">
+          {{ props.icon.name }}
+        </h1>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.overlay-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  pointer-events: none;
+  height: 100%;
+  width: 100%;
+  display: flex;
+  align-items: flex-end;
+}
+
+@media (min-width: 960px) {
+  .overlay-container {
+    left: var(--vp-sidebar-width);
+  }
+}
+
+@media (min-width: 1440px) {
+  .overlay-container {
+    left: calc((100% - (var(--vp-layout-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px);
+  }
+}
+
+.overlay-panel {
+  position: relative;
+  width: 100%;
+  margin: 0 auto;
+  padding: 1rem;
+  background-color: var(--vp-c-bg-elv);
+  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
+  will-change: transform;
+  pointer-events: all;
+  height: 240px;
+  padding: 24px 32px;
+  display: flex;
+  box-shadow: var(--vp-shadow-5);
+}
+
+.icon-container {
+  height: 100%;
+  aspect-ratio: 1/1;
+  position: relative;
+  background: var(--vp-c-bg-alt);
+  border-radius: 8px;
+}
+
+.icon-grid {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+  stroke: var(--vp-c-divider);
+}
+
+.icon-component {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  z-index: 1;
+}
+
+.icon-info {
+  padding: 0 24px;
+}
+
+.icon-name {
+  font-size: 24px;
+  font-weight: 500;
+  line-height: 32px;
+}
+
+
+
+</style>
@@ -13,13 +13,20 @@ const props = defineProps<{
  iconNode: IconNode;
 }>()

+const emit = defineEmits(['setActiveIcon'])
+
 const { go } = useRouter()

 const icon = createLucideIcon(props.name, props.iconNode)
+
+function navigateToIcon() {
+  window.history.pushState({}, '', `/icons/${props.name}`)
+  emit('setActiveIcon', props.name)
+}
 </script>

 <template>
-  <button class="icon-button" @click="go(`icons/${name}`)">
+  <button class="icon-button" @click="navigateToIcon">
    <component :is="icon" />
  </button>
 </template>
@@ -1,28 +1,39 @@
 <script setup lang="ts">
+import { ref, computed } from 'vue'
 import type { IconEntity } from '../types'
 import IconItem from './IconItem.vue'
+import IconDetailOverlay from './IconDetailOverlay.vue'

 const props = defineProps<{
  icons: IconEntity[]
 }>()

-console.log(props.icons);
+const activeIconName = ref('')
+
+function setActiveIconName(name: string) {
+  activeIconName.value = name
+}
+
+const activeIcon = computed(() =>
+  props.icons.find((icon) => icon.name === activeIconName.value)
+)

 </script>

 <template>
  <div class="icons">
    <div class="icon" v-for="icon in icons" :key="icon.name">
-      <IconItem v-bind="icon" />
+      <IconItem v-bind="icon" @setActiveIcon="setActiveIconName"/>
    </div>
  </div>
+  <IconDetailOverlay :icon="activeIcon" @close="setActiveIconName('')"/>
 </template>

 <style>
 .icons {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(56px, 1fr));
-  padding: 32px 24px 96px;
+  padding: 32px 32px 96px;
  gap: 8px;
  width: 100%;
 }
@@ -0,0 +1,20 @@
+<script setup lang="ts">
+import type { IconEntity } from '../types'
+import createLucideIcon from 'lucide-vue-next/src/createLucideIcon';
+
+export type IconNode = [elementName: string, attrs: Record<string, string>][]
+
+const props = defineProps<{
+  name: string;
+  tags: string[];
+  categories: string[];
+  // contributors: Contributor[];
+  iconNode: IconNode;
+}>()
+
+const icon = createLucideIcon(props.name, props.iconNode)
+</script>
+
+<template>
+  <component :is="icon" />
+</template>
@@ -3,12 +3,14 @@ import DefaultTheme from 'vitepress/theme'
 import './style.css'
 import { Theme } from 'vitepress'
 import IconsLayout from './layouts/IconsLayout.vue'
+import HomeHeroIconsCard from '../components/HomeHeroIconsCard.vue'

 const theme: Partial<Theme> = {
  extends: DefaultTheme,
  Layout() {
    return h(DefaultTheme.Layout, null, {
-      'sidebar-nav-after': () => h(IconsLayout)
+      'sidebar-nav-after': () => h(IconsLayout),
+      'home-hero-image': () => h(HomeHeroIconsCard)
    })
  },

@@ -12,4 +12,14 @@

 .VPNavBarTitle .title {
  font-size: 21px;
-}
+}
+
+/* .VPHomeHero > .container {
+  flex-direction: column-reverse;
+} */
+
+.VPHomeHero .image-container {
+  transform: none;
+  width: auto;
+  /* padding: 0 24px; */
+}
@@ -0,0 +1,4 @@
+declare module "*.vue" {
+  import Vue from "vue";
+  export default Vue;
+}
@@ -9,7 +9,7 @@ hero:
  image:
    src: /favicon.svg
    alt: VueUse
-  actions:  
+  actions:
    - theme: brand
      text: View all icons
      link: icons/index
@@ -21,7 +21,7 @@ hero:
      link: https://github.com/lucide-icons/lucide

 features:
-  
+
  - title: Lightweight & Scalable
    details: Icons are lightweight, highly optimized scalable vector graphics (SVG).
    icon: |
@@ -48,4 +48,6 @@ features:
      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#F56565" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-users"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M22 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path></svg>
 ---

-asdfasdf  
+<script setup>
+import HomeInfo from './.vitepress/components/HomeInfo.vue'
+</script>
@@ -18,10 +18,11 @@
  "devDependencies": {
    "@lucide/docs": "workspace:*",
    "nitropack": "latest",
-    "vitepress": "1.0.0-alpha.65",
-    "node-fetch": "2"
+    "node-fetch": "2",
+    "vitepress": "1.0.0-alpha.65"
  },
  "dependencies": {
+    "@headlessui/vue": "^1.7.13",
    "js-yaml": "^4.1.0",
    "jszip": "^3.7.0",
    "lucide-vue-next": "workspace:*"
@@ -43,6 +43,9 @@ importers:

  docs:
    dependencies:
+      '@headlessui/vue':
+        specifier: ^1.7.13
+        version: 1.7.13(vue@3.2.45)
      js-yaml:
        specifier: ^4.1.0
        version: 4.1.0
@@ -58,7 +61,7 @@ importers:
        version: 'link:'
      nitropack:
        specifier: latest
-        version: 2.3.2
+        version: 2.3.3
      node-fetch:
        specifier: '2'
        version: 2.6.7
@@ -7232,6 +7235,15 @@ packages:
      '@hapi/hoek': 9.3.0
    dev: true

+  /@headlessui/vue@1.7.13(vue@3.2.45):
+    resolution: {integrity: sha512-obG5TdPdBDfs+jiA1mY29LPFqyJl93Q90EL86ontfRe1B6XvbjPkx+x1aAC5DA18bXbb0Juni1ayDbXo0w1u0A==}
+    engines: {node: '>=10'}
+    peerDependencies:
+      vue: ^3.2.0
+    dependencies:
+      vue: 3.2.45
+    dev: false
+
  /@humanwhocodes/config-array@0.10.4:
    resolution: {integrity: sha512-mXAIHxZT3Vcpg83opl1wGlVZ9xydbfZO3r5YfRSH6Gpp2J/PfdBP0wbDa2sO6/qRbcalpoevVyW6A/fI6LfeMw==}
    engines: {node: '>=10.10.0'}
@@ -7962,7 +7974,7 @@ packages:
      nopt: 5.0.0
      npmlog: 5.0.1
      rimraf: 3.0.2
-      semver: 7.3.8
+      semver: 7.4.0
      tar: 6.1.13
    transitivePeerDependencies:
      - encoding
@@ -8248,7 +8260,7 @@ packages:
    engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
    dependencies:
      '@gar/promisify': 1.1.3
-      semver: 7.3.8
+      semver: 7.4.0
    dev: true

  /@npmcli/git@3.0.2:
@@ -8262,7 +8274,7 @@ packages:
      proc-log: 2.0.1
      promise-inflight: 1.0.1
      promise-retry: 2.0.1
-      semver: 7.3.8
+      semver: 7.4.0
      which: 2.0.2
    transitivePeerDependencies:
      - bluebird
@@ -8618,8 +8630,8 @@ packages:
    resolution: {integrity: sha512-K0aGNn1TjalKj+65D7ycc1//H9roAQ51GJVk5ZJQFb2teECGmzd86bYDC0aYdbRf7gtovescq4Zt6FR0tgXiHQ==}
    dev: true

-  /@rollup/plugin-alias@4.0.4(rollup@3.20.2):
-    resolution: {integrity: sha512-0CaAY238SMtYAWEXXptWSR8iz8NYZnH7zNBKuJ14xFJSGwLtPgjvXYsoApAHfzYXXH1ejxpVw7WlHss3zhh9SQ==}
+  /@rollup/plugin-alias@5.0.0(rollup@3.20.2):
+    resolution: {integrity: sha512-l9hY5chSCjuFRPsnRm16twWBiSApl2uYFLsepQYwtBuAxNMQ/1dJqADld40P0Jkqm65GRTLy/AC6hnpVebtLsA==}
    engines: {node: '>=14.0.0'}
    peerDependencies:
      rollup: ^1.20.0||^2.0.0||^3.0.0
@@ -8737,24 +8749,6 @@ packages:
      rollup: 2.77.2
    dev: true

-  /@rollup/plugin-node-resolve@15.0.1(rollup@3.20.2):
-    resolution: {integrity: sha512-ReY88T7JhJjeRVbfCyNj+NXAG3IIsVMsX9b5/9jC98dRP8/yxlZdz7mHZbHk5zHr24wZZICS5AcXsFZAXYUQEg==}
-    engines: {node: '>=14.0.0'}
-    peerDependencies:
-      rollup: ^2.78.0||^3.0.0
-    peerDependenciesMeta:
-      rollup:
-        optional: true
-    dependencies:
-      '@rollup/pluginutils': 5.0.2(rollup@3.20.2)
-      '@types/resolve': 1.20.2
-      deepmerge: 4.2.2
-      is-builtin-module: 3.2.0
-      is-module: 1.0.0
-      resolve: 1.22.1
-      rollup: 3.20.2
-    dev: true
-
  /@rollup/plugin-node-resolve@15.0.1(rollup@3.5.1):
    resolution: {integrity: sha512-ReY88T7JhJjeRVbfCyNj+NXAG3IIsVMsX9b5/9jC98dRP8/yxlZdz7mHZbHk5zHr24wZZICS5AcXsFZAXYUQEg==}
    engines: {node: '>=14.0.0'}
@@ -8773,6 +8767,24 @@ packages:
      rollup: 3.5.1
    dev: true

+  /@rollup/plugin-node-resolve@15.0.2(rollup@3.20.2):
+    resolution: {integrity: sha512-Y35fRGUjC3FaurG722uhUuG8YHOJRJQbI6/CkbRkdPotSpDj9NtIN85z1zrcyDcCQIW4qp5mgG72U+gJ0TAFEg==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      rollup: ^2.78.0||^3.0.0
+    peerDependenciesMeta:
+      rollup:
+        optional: true
+    dependencies:
+      '@rollup/pluginutils': 5.0.2(rollup@3.20.2)
+      '@types/resolve': 1.20.2
+      deepmerge: 4.2.2
+      is-builtin-module: 3.2.1
+      is-module: 1.0.0
+      resolve: 1.22.1
+      rollup: 3.20.2
+    dev: true
+
  /@rollup/plugin-replace@5.0.1(rollup@3.5.1):
    resolution: {integrity: sha512-Z3MfsJ4CK17BfGrZgvrcp/l6WXoKb0kokULO+zt/7bmcyayokDaQ2K3eDJcRLCTAlp5FPI4/gz9MHAsosz4Rag==}
    engines: {node: '>=14.0.0'}
@@ -10043,7 +10055,6 @@ packages:
      '@vue/shared': 3.2.45
      estree-walker: 2.0.2
      source-map: 0.6.1
-    dev: true

  /@vue/compiler-core@3.2.47:
    resolution: {integrity: sha512-p4D7FDnQb7+YJmO2iPEv0SQNeNzcbHdGByJDsT4lynf63AFkOTFN07HsiRSvjGo0QrxR/o3d0hUyNCUnBU2Tig==}
@@ -10059,7 +10070,6 @@ packages:
    dependencies:
      '@vue/compiler-core': 3.2.45
      '@vue/shared': 3.2.45
-    dev: true

  /@vue/compiler-dom@3.2.47:
    resolution: {integrity: sha512-dBBnEHEPoftUiS03a4ggEig74J2YBZ2UIeyfpcRM2tavgMWo4bsEfgCGsu+uJIL/vax9S+JztH8NmQerUo7shQ==}
@@ -10089,7 +10099,6 @@ packages:
      magic-string: 0.25.9
      postcss: 8.4.16
      source-map: 0.6.1
-    dev: true

  /@vue/compiler-sfc@3.2.47:
    resolution: {integrity: sha512-rog05W+2IFfxjMcFw10tM9+f7i/+FFpZJJ5XHX72NP9eC2uRD+42M3pYcQqDXVYoj74kHMSEdQ/WmCjt8JFksQ==}
@@ -10111,7 +10120,6 @@ packages:
    dependencies:
      '@vue/compiler-dom': 3.2.45
      '@vue/shared': 3.2.45
-    dev: true

  /@vue/compiler-ssr@3.2.47:
    resolution: {integrity: sha512-wVXC+gszhulcMD8wpxMsqSOpvDZ6xKXSVWkf50Guf/S+28hTAXPDYRTbLQ3EDkOP5Xz/+SY37YiwDquKbJOgZw==}
@@ -10132,7 +10140,6 @@ packages:
      '@vue/shared': 3.2.45
      estree-walker: 2.0.2
      magic-string: 0.25.9
-    dev: true

  /@vue/reactivity-transform@3.2.47:
    resolution: {integrity: sha512-m8lGXw8rdnPVVIdIFhf0LeQ/ixyHkH5plYuS83yop5n7ggVJU+z5v0zecwEnX7fa7HNLBhh2qngJJkxpwEEmYA==}
@@ -10148,7 +10155,6 @@ packages:
    resolution: {integrity: sha512-PRvhCcQcyEVohW0P8iQ7HDcIOXRjZfAsOds3N99X/Dzewy8TVhTCT4uXpAHfoKjVTJRA0O0K+6QNkDIZAxNi3A==}
    dependencies:
      '@vue/shared': 3.2.45
-    dev: true

  /@vue/reactivity@3.2.47:
    resolution: {integrity: sha512-7khqQ/75oyyg+N/e+iwV6lpy1f5wq759NdlS1fpAhFXa8VeAIKGgk2E/C4VF59lx5b+Ezs5fpp/5WsRYXQiKxQ==}
@@ -10161,7 +10167,6 @@ packages:
    dependencies:
      '@vue/reactivity': 3.2.45
      '@vue/shared': 3.2.45
-    dev: true

  /@vue/runtime-core@3.2.47:
    resolution: {integrity: sha512-RZxbLQIRB/K0ev0K9FXhNbBzT32H9iRtYbaXb0ZIz2usLms/D55dJR2t6cIEUn6vyhS3ALNvNthI+Q95C+NOpA==}
@@ -10176,7 +10181,6 @@ packages:
      '@vue/runtime-core': 3.2.45
      '@vue/shared': 3.2.45
      csstype: 2.6.20
-    dev: true

  /@vue/runtime-dom@3.2.47:
    resolution: {integrity: sha512-ArXrFTjS6TsDei4qwNvgrdmHtD930KgSKGhS5M+j8QxXrDJYLqYw4RRcDy1bz1m1wMmb6j+zGLifdVHtkXA7gA==}
@@ -10194,7 +10198,6 @@ packages:
      '@vue/compiler-ssr': 3.2.45
      '@vue/shared': 3.2.45
      vue: 3.2.45
-    dev: true

  /@vue/server-renderer@3.2.47(vue@3.2.47):
    resolution: {integrity: sha512-dN9gc1i8EvmP9RCzvneONXsKfBRgqFeFZLurmHOveL7oH6HiFXJw5OGu294n1nHc/HMgTy6LulU/tv5/A7f/LA==}
@@ -10208,7 +10211,6 @@ packages:

  /@vue/shared@3.2.45:
    resolution: {integrity: sha512-Ewzq5Yhimg7pSztDV+RH1UDKBzmtqieXQlpTVm2AwraoRL/Rks96mvd8Vgi7Lj+h+TH8dv7mXD3FRZR3TUvbSg==}
-    dev: true

  /@vue/shared@3.2.47:
    resolution: {integrity: sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ==}
@@ -11614,7 +11616,7 @@ packages:
  /builtins@5.0.1:
    resolution: {integrity: sha512-qwVpFEHNfhYJIzNRBvd2C1kyo6jz3ZSMPyyuR47OPdiKWlbYnZNyDWuyR175qDnAJLiCo5fBBqPb3RiXgWlkOQ==}
    dependencies:
-      semver: 7.3.8
+      semver: 7.4.0
    dev: true

  /bytes@3.0.0:
@@ -12221,8 +12223,8 @@ packages:
      - supports-color
    dev: true

-  /consola@2.15.3:
-    resolution: {integrity: sha512-9vAdYbHj6x2fLKC4+oPH0kFzY/orMZyG2Aj+kNylHxKGJ/Ed4dpNyAQYwJOdqO4zdM7XpVHmyejQDcQHrnuXbw==}
+  /consola@3.0.2:
+    resolution: {integrity: sha512-o/Wau2FmZKiQgyp3c3IULgN6J5yc0lwYMnoyiZdEpdGxKGBtt2ACbkulBZ6BUsHy1HlSJqoP4YOyPIJLgRJyKQ==}
    dev: true

  /console-control-strings@1.1.0:
@@ -12581,7 +12583,6 @@ packages:

  /csstype@2.6.20:
    resolution: {integrity: sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==}
-    dev: true

  /csstype@3.0.9:
    resolution: {integrity: sha512-rpw6JPxK6Rfg1zLOYCSwle2GFOOsnjmDYDaBwEcwoOg4qlsIVCN789VkBZDJAGi4T07gI4YSutR43t9Zz4Lzuw==}
@@ -16275,6 +16276,13 @@ packages:
      builtin-modules: 3.3.0
    dev: true

+  /is-builtin-module@3.2.1:
+    resolution: {integrity: sha512-BSLE3HnV2syZ0FK0iMA/yUGplUeMmNz4AW5fnTunbCIqZi4vG3WjJT9FHMy5D69xmAYBHXQhJdALdpwVxV501A==}
+    engines: {node: '>=6'}
+    dependencies:
+      builtin-modules: 3.3.0
+    dev: true
+
  /is-callable@1.2.4:
    resolution: {integrity: sha512-nsuwtxZfMX67Oryl9LCQ+upnC0Z0BgpwntpS89m1H/TLF0zNfzfLMV/9Wa/6MZsj0acpEjAO0KF1xT6ZdLl95w==}
    engines: {node: '>= 0.4'}
@@ -17170,7 +17178,7 @@ packages:
      jest-resolve: 26.6.2
      natural-compare: 1.4.0
      pretty-format: 26.6.2
-      semver: 7.3.8
+      semver: 7.4.0
    transitivePeerDependencies:
      - supports-color
    dev: true
@@ -18109,7 +18117,6 @@ packages:
    resolution: {integrity: sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==}
    dependencies:
      sourcemap-codec: 1.4.8
-    dev: true

  /magic-string@0.26.2:
    resolution: {integrity: sha512-NzzlXpclt5zAbmo6h6jNc8zl2gNRGHvmsZW4IvZhTC4W7k4OlLP+S5YLussa/r3ixNT66KOQfNORlXHSOy/X4A==}
@@ -19012,18 +19019,18 @@ packages:
    resolution: {integrity: sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==}
    dev: true

-  /nitropack@2.3.2:
-    resolution: {integrity: sha512-bps3OvC3JocB3Hl6/FUaQpbLw1Xsr6KXV3hTDnh54N0B0uAGWN9aF1LVHKBpWSS5JJvjwd+ZewOUFsPRM2NJ9Q==}
+  /nitropack@2.3.3:
+    resolution: {integrity: sha512-1g/4zdwWo+tWSvno57rhRXeGk6jNbG5W1yRNtOywInT1nyoEG1ksOwQ3W3JHGB2E1GNjZwAVi611UVOVL+JgYw==}
    engines: {node: ^14.16.0 || ^16.11.0 || ^17.0.0 || ^18.0.0 || ^19.0.0}
    hasBin: true
    dependencies:
      '@cloudflare/kv-asset-handler': 0.3.0
      '@netlify/functions': 1.4.0
-      '@rollup/plugin-alias': 4.0.4(rollup@3.20.2)
+      '@rollup/plugin-alias': 5.0.0(rollup@3.20.2)
      '@rollup/plugin-commonjs': 24.0.1(rollup@3.20.2)
      '@rollup/plugin-inject': 5.0.3(rollup@3.20.2)
      '@rollup/plugin-json': 6.0.0(rollup@3.20.2)
-      '@rollup/plugin-node-resolve': 15.0.1(rollup@3.20.2)
+      '@rollup/plugin-node-resolve': 15.0.2(rollup@3.20.2)
      '@rollup/plugin-replace': 5.0.2(rollup@3.20.2)
      '@rollup/plugin-terser': 0.4.1(rollup@3.20.2)
      '@rollup/plugin-wasm': 6.1.2(rollup@3.20.2)
@@ -19033,7 +19040,7 @@ packages:
      c12: 1.2.0
      chalk: 5.2.0
      chokidar: 3.5.3
-      consola: 2.15.3
+      consola: 3.0.2
      cookie-es: 0.5.0
      defu: 6.1.2
      destr: 1.2.2
@@ -19066,13 +19073,13 @@ packages:
      rollup: 3.20.2
      rollup-plugin-visualizer: 5.9.0(rollup@3.20.2)
      scule: 1.0.0
-      semver: 7.3.8
+      semver: 7.4.0
      serve-placeholder: 2.0.1
      serve-static: 1.15.0
      source-map-support: 0.5.21
      std-env: 3.3.2
      ufo: 1.1.1
-      unenv: 1.2.2
+      unenv: 1.3.1
      unimport: 3.0.6(rollup@3.20.2)
      unstorage: 1.4.1
    transitivePeerDependencies:
@@ -19169,7 +19176,7 @@ packages:
      nopt: 6.0.0
      npmlog: 6.0.2
      rimraf: 3.0.2
-      semver: 7.3.8
+      semver: 7.4.0
      tar: 6.1.13
      which: 2.0.2
    transitivePeerDependencies:
@@ -19187,7 +19194,7 @@ packages:
    dependencies:
      growly: 1.3.0
      is-wsl: 2.2.0
-      semver: 7.3.8
+      semver: 7.4.0
      shellwords: 0.1.1
      uuid: 8.3.2
      which: 2.0.2
@@ -19233,7 +19240,7 @@ packages:
    dependencies:
      hosted-git-info: 5.1.0
      is-core-module: 2.10.0
-      semver: 7.3.8
+      semver: 7.4.0
      validate-npm-package-license: 3.0.4
    dev: true

@@ -19271,7 +19278,7 @@ packages:
    resolution: {integrity: sha512-65lUsMI8ztHCxFz5ckCEC44DRvEGdZX5usQFriauxHEwt7upv1FKaQEmAtU0YnOAdwuNWCmk64xYiQABNrEyLA==}
    engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
    dependencies:
-      semver: 7.3.8
+      semver: 7.4.0
    dev: true

  /npm-normalize-package-bin@1.0.1:
@@ -20495,7 +20502,6 @@ packages:
      nanoid: 3.3.4
      picocolors: 1.0.0
      source-map-js: 1.0.2
-    dev: true

  /postcss@8.4.19:
    resolution: {integrity: sha512-h+pbPsyhlYj6N2ozBmHhHrs9DzGmbaarbLvWipMRO7RLS+v4onj26MPFXA5OBYFxyqYhUJK456SwDcY9H2/zsA==}
@@ -22037,6 +22043,14 @@ packages:
    hasBin: true
    dependencies:
      lru-cache: 6.0.0
+    dev: true
+
+  /semver@7.4.0:
+    resolution: {integrity: sha512-RgOxM8Mw+7Zus0+zcLEUn8+JfoLpj/huFTItQy2hsM4khuC1HYRDp0cU482Ewn/Fcy6bCjufD8vAj7voC66KQw==}
+    engines: {node: '>=10'}
+    hasBin: true
+    dependencies:
+      lru-cache: 6.0.0

  /send@0.18.0:
    resolution: {integrity: sha512-qqWzuOjSFOuqPjFe4NOsMLafToQQwBSOEpS+FwEt3A2V3vKubTquT3vmLTQpFgMXp8AlFWFuP1qKaJZOtPpVXg==}
@@ -22143,7 +22157,7 @@ packages:
      detect-libc: 1.0.3
      node-addon-api: 3.2.1
      prebuild-install: 6.1.4
-      semver: 7.3.8
+      semver: 7.4.0
      simple-get: 3.1.1
      tar-fs: 2.1.1
      tunnel-agent: 0.6.0
@@ -23738,8 +23752,8 @@ packages:
    resolution: {integrity: sha512-kuZwRKV615lEw/Xx3Iz56FKk3nOeOVGaVmw0eg+x4Mne28lCotNFbBhDW7dEBCBKyKbRQiCadEZeNAFPVC5cgw==}
    dev: true

-  /unenv@1.2.2:
-    resolution: {integrity: sha512-SYqIFLFC4wYtLyxD6RyAfoK/dkgvW85BfNdiYvroyfrL4cyLkoigSldSBBiUTgtxwb4pcE0zexw502DghVWeuA==}
+  /unenv@1.3.1:
+    resolution: {integrity: sha512-4hTMiJf1TgQNnOsZxaI6XpCpVvOUNYLW3NxEkjdzXf+Dukys4b01AShapcXzKzvgoyoWByP3MLbg/CkzcKx+GA==}
    dependencies:
      defu: 6.1.2
      mime: 3.0.0
@@ -24531,7 +24545,6 @@ packages:
      '@vue/runtime-dom': 3.2.45
      '@vue/server-renderer': 3.2.45(vue@3.2.45)
      '@vue/shared': 3.2.45
-    dev: true

  /vue@3.2.47:
    resolution: {integrity: sha512-60188y/9Dc9WVrAZeUVSDxRQOZ+z+y5nO2ts9jWXSTkMvayiWxCWOWtBQoYjLeccfXkiiPZWAHcV+WTPhkqJHQ==}