iaiaiaia
/
travelmarine-frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Доработки по главной странице, итерация 11

This commit is contained in:
Sergey Bolshakov 2025-10-27 04:46:35 +03:00
parent ce2fdaa7c3
commit e420440cea
2 changed files with 27 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/app/globals.css
View File

@ -134,17 +134,6 @@
} }
} }
input[type="time"] {
/* Фиксируем размеры */
min-width: 0;
width: 100%;
box-sizing: border-box;
/* Убираем нативные отступы */
padding: 0;
margin: 0;
}
input[type="time"]::-webkit-calendar-picker-indicator { input[type="time"]::-webkit-calendar-picker-indicator {
background: none; background: none;
} }

49
src/components/ui/date-picker.tsx
View File

@ -86,45 +86,50 @@ export function DatePicker({ showIcon = true }: DatePickerProps) {
weekdays: "flex", weekdays: "flex",
weekday: weekday:
"flex-1 text-gray-500 text-xs font-normal p-2 text-center", "flex-1 text-gray-500 text-xs font-normal p-2 text-center",
day_button: "font-bold", day_button: "font-bold ring-0 focus:ring-0",
week: "mt-2 flex w-full", week: "mt-2 flex w-full",
today: "bg-gray-100 text-gray-900", today: "bg-gray-100 text-gray-900 rounded-full",
outside: "text-gray-300", outside: "text-gray-300",
disabled: "text-gray-400 cursor-not-allowed", disabled: "text-gray-400 cursor-not-allowed",
day_selected: "!bg-red",
selected: selected:
"rounded-full border-none outline-none !bg-[#008299] text-white", "rounded-full border-none outline-none !bg-brand text-white",
}} }}
/> />
{/* Поля времени */} {/* Поля времени */}
<div className="flex gap-3 mb-4"> <div className="flex gap-3 mb-4">
<div className="relative w-full"> <div className="relative w-full h-12 px-3 border border-gray-300 rounded-full text-gray-700 font-medium text-center">
<label className="absolute left-[24px] top-0 transform -translate-y-1/2 text-xs text-gray-500 pointer-events-none transition-all duration-200 bg-white px-1"> <label className="absolute left-[24px] top-0 transform -translate-y-1/2 text-xs text-gray-500 pointer-events-none transition-all duration-200 bg-white px-1">
Выход Выход
</label> </label>
<ChevronDownIcon className="absolute right-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-500 pointer-events-none" /> <div className="relative h-full flex align-center">
<input <ChevronDownIcon className="absolute right-0 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-500 pointer-events-none" />
type="time" <input
value={departureTime} type="time"
onChange={(e) => value={departureTime}
setDepartureTime(e.target.value) onChange={(e) =>
} setDepartureTime(e.target.value)
className="w-full h-12 !px-3 border border-gray-300 rounded-full text-gray-700 font-medium text-center focus:outline-none focus:ring-2 focus:ring-[#008299] focus:border-transparent" }
/> className="w-full focus:outline-none focus:border-transparent"
/>
</div>
</div> </div>
<div className="relative w-full"> <div className="relative w-full h-12 px-3 border border-gray-300 rounded-full text-gray-700 font-medium text-center">
<label className="absolute left-[24px] top-0 transform -translate-y-1/2 text-xs text-gray-500 pointer-events-none transition-all duration-200 bg-white px-1"> <label className="absolute left-[24px] top-0 transform -translate-y-1/2 text-xs text-gray-500 pointer-events-none transition-all duration-200 bg-white px-1">
Заход Заход
</label> </label>
<ChevronDownIcon className="absolute right-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-500 pointer-events-none" /> <div className="relative h-full flex align-center">
<input <ChevronDownIcon className="absolute right-0 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-500 pointer-events-none" />
type="time" <input
value={arrivalTime} type="time"
onChange={(e) => setArrivalTime(e.target.value)} value={arrivalTime}
className="w-full h-12 !px-3 border border-gray-300 rounded-full text-gray-700 font-medium text-center focus:outline-none focus:ring-2 focus:ring-[#008299] focus:border-transparent" onChange={(e) =>
/> setArrivalTime(e.target.value)
}
className="w-full focus:outline-none focus:border-transparent"
/>
</div>
</div> </div>
</div> </div>