Fix html select defaultValue

astro.config.mjs

@@ -48,6 +48,7 @@ export default defineConfig({
   output: 'server',
   adapter: node({ mode: 'standalone' }),
   redirects: {
+    '/en/[...params]': '/[...params]',
     '/anim/[id]': { status: 307, destination: '/maintenance' },
     '/anim/list': { status: 307, destination: '/maintenance' },
     '/game/[slug]': { status: 307, destination: '/maintenance' },

src/components/form/Input.tsx

@@ -54,14 +54,21 @@ export function InputArea(props: CustomInputProps & Omit<ComponentProps<'textare
 }
 
 export function InputSelect(props: CustomInputProps & ComponentProps<'select'>) {
-  const { name, className, dark = false, label, ...attrs } = props
+  const { name, className, dark = false, label, children, ...attrs } = props
 
   return (
     <div className='flex flex-col'>
       <InputLabel dark={dark} name={name}>
         {label}
       </InputLabel>
-      <select name={name} className='bg-zinc-200 rounded-md p-2 mt-2 h-full mb-3 text-black' {...attrs} />
+      <select
+        autoComplete='off'
+        name={name}
+        className='bg-zinc-200 rounded-md p-2 mt-2 h-full mb-3 text-black'
+        {...attrs}
+      >
+        {children}
+      </select>
     </div>
   )
 }

src/pages/404.astro

@@ -9,7 +9,7 @@ import BaseLayout from '../layouts/base.astro'
     <div class='text-md` text-center'>
       <a class='text-blue-500 underline' href='https://twitter.com/i/status/1890946922908721317'>Boat Goes Binted</a>
     </div>
-    <video class='mt-4' controls autoplay style={{ height: '350px', width: 'auto' }} onloadstart='this.volume=0.15'>
+    <video class='mt-4 mx-auto' controls style={{ height: '350px', width: '200px' }} onloadstart='this.volume=0.15'>
       <source src='/video/boat-goes-binted.mp4' type='video/mp4' />
     </video>
   </div>