fixed SearchDate

app/Components/SearchDateBetween/SearchDate.css

@@ -0,0 +1,11 @@
+.containerDate{
+    gap: 10px;
+    width: 100%;
+    max-width: 100%;
+}
+.alingDate{
+    display: flex;
+    justify-content: flex-start;
+    gap: 10px;
+    
+}

app/Components/SearchDateBetween/SearchDateBetween.tsx

@@ -1,14 +1,15 @@
-'use client';
+"use client";
 
-import { useState } from 'react';
+import { useState } from "react";
 
+import "./SearchDate.css";
 interface Props {
   onSearch: (desde: string, hasta: string) => void;
 }
 
 function SearchDateBetween({ onSearch }: Props) {
-  const [startDate, setStartDate] = useState('');
-  const [endDate, setEndDate] = useState('');
+  const [startDate, setStartDate] = useState("");
+  const [endDate, setEndDate] = useState("");
 
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
@@ -17,26 +18,37 @@ function SearchDateBetween({ onSearch }: Props) {
   };
 
   return (
-    <form className="containerForm" onSubmit={handleSubmit}>
-      <label className="label">Desde</label>
-      <div className="groupInput">
-        <input
-          type="date"
-          value={startDate}
-          onChange={(e) => setStartDate(e.target.value)}
-        />
+    <form className="containerForm containerDate" onSubmit={handleSubmit}>
+      <div className="alingDate">
+        <div className="">
+          <label className="label">Desde</label>
+          <div className="groupInput">
+            <input
+              type="date"
+              value={startDate}
+              onChange={(e) => setStartDate(e.target.value)}
+            />
+          </div>
+        </div>
+
+        <div>
+          <label className="label">Hasta</label>
+
+          <div className="groupInput">
+            <input
+              type="date"
+              value={endDate}
+              onChange={(e) => setEndDate(e.target.value)}
+            />
+          </div>
+        </div>
       </div>
 
-      <label className="label">Hasta</label>
-      <div className="groupInput">
-        <input
-          type="date"
-          value={endDate}
-          onChange={(e) => setEndDate(e.target.value)}
-        />
-      </div>
-
-      <button className="button buttonSearch" type="submit" style={{marginBottom:"10px"}}>
+      <button
+        className="button buttonSearch"
+        type="submit"
+        style={{ marginBottom: "10px" }}
+      >
         Buscar
       </button>
     </form>