fix: remaining admin & layout light theme polish

- Admin forms, dialogs, and page editors: light-mode borders, text contrast
- YandexMap: theme-aware map styles
- Layout: theme init script adjustments
This commit is contained in:
2026-04-10 21:36:33 +03:00
parent 97663c514e
commit a080ef5a8e
17 changed files with 177 additions and 144 deletions
+21 -21
View File
@@ -222,7 +222,7 @@ function ClassBlock({
: {}),
}}
className={`absolute left-1 right-1 rounded-md border border-white/20 border-l-3 px-2 py-0.5 text-left text-xs text-white cursor-grab active:cursor-grabbing overflow-hidden select-none ${colors} ${
isOverlapping ? "ring-2 ring-red-500 ring-offset-1 ring-offset-neutral-900" : ""
isOverlapping ? "ring-2 ring-red-500 ring-offset-1 ring-offset-white dark:ring-offset-neutral-900" : ""
} ${isDragging ? "opacity-30" : "hover:opacity-90 hover:border-white/40"}`}
title={`${cls.time}\n${cls.type}\n${cls.trainer}${cls.level ? ` · ${cls.level}` : ""}${cls.status ? ` · ${cls.status}` : ""}`}
>
@@ -415,14 +415,14 @@ function ClassModal({
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/60" onClick={onClose}>
<div
className="w-full max-w-md rounded-xl border border-white/10 bg-neutral-900 p-6 shadow-2xl"
className="w-full max-w-md rounded-xl border border-neutral-200 bg-white p-6 shadow-2xl dark:border-white/10 dark:bg-neutral-900"
onClick={(e) => e.stopPropagation()}
>
<div className="flex items-center justify-between mb-4">
<h3 className="text-lg font-bold text-white">
<h3 className="text-lg font-bold text-neutral-900 dark:text-white">
{isNew ? "Новое занятие" : "Редактировать занятие"}
</h3>
<button type="button" onClick={onClose} className="text-neutral-400 hover:text-white">
<button type="button" onClick={onClose} className="text-neutral-400 hover:text-neutral-900 transition-colors dark:hover:text-white">
<X size={20} />
</button>
</div>
@@ -431,7 +431,7 @@ function ClassModal({
{/* Day selector */}
{allDays.length > 1 && (
<div>
<label className="block text-sm text-neutral-400 mb-2">Дни</label>
<label className="block text-sm text-neutral-500 mb-2 dark:text-neutral-400">Дни</label>
{/* Day toggle buttons */}
<div className="flex flex-wrap gap-1.5">
@@ -445,7 +445,7 @@ function ClassModal({
className={`rounded-lg px-3 py-1.5 text-xs font-medium transition-all ${
active
? "bg-gold/20 text-gold border border-gold/40"
: "border border-white/10 text-neutral-500 hover:text-white hover:border-white/20"
: "border border-neutral-200 text-neutral-500 hover:text-neutral-900 hover:border-neutral-300 dark:border-white/10 dark:hover:text-white dark:hover:border-white/20"
}`}
>
{d.dayShort}
@@ -473,10 +473,10 @@ function ClassModal({
});
}
}}
className="flex items-center gap-2 text-sm text-neutral-300 select-none"
className="flex items-center gap-2 text-sm text-neutral-600 select-none dark:text-neutral-300"
>
<span className={`inline-flex items-center justify-center w-4 h-4 rounded border transition-colors ${
sameTime ? "bg-gold border-gold" : "border-white/20 bg-neutral-800"
sameTime ? "bg-gold border-gold" : "border-neutral-300 bg-neutral-100 dark:border-white/20 dark:bg-neutral-800"
}`}>
{sameTime && <span className="text-black text-xs font-bold leading-none"></span>}
</span>
@@ -492,10 +492,10 @@ function ClassModal({
/>
) : (
<div className="space-y-1.5">
<label className="block text-sm text-neutral-400">Время по дням</label>
<label className="block text-sm text-neutral-500 dark:text-neutral-400">Время по дням</label>
{allDays.filter((d) => selectedDays.has(d.day)).map((d) => (
<div key={d.day} className="flex items-center gap-2">
<span className="shrink-0 text-xs font-medium text-neutral-400 min-w-[28px]">
<span className="shrink-0 text-xs font-medium text-neutral-500 min-w-[28px] dark:text-neutral-400">
{d.dayShort}
</span>
<div className="flex-1">
@@ -576,7 +576,7 @@ function ClassModal({
}}
className={`flex-1 rounded-lg px-4 py-2.5 text-sm font-medium transition-opacity ${
touched && !isValid
? "bg-neutral-700 text-neutral-400 cursor-not-allowed"
? "bg-neutral-200 text-neutral-400 cursor-not-allowed dark:bg-neutral-700"
: "bg-gold text-black hover:opacity-90"
}`}
>
@@ -973,18 +973,18 @@ function CalendarGrid({
{/* Calendar */}
{sortedDays.length > 0 && (
<div className="overflow-x-auto rounded-lg border border-white/10" ref={gridRef}>
<div className="overflow-x-auto rounded-lg border border-neutral-200 dark:border-white/10" ref={gridRef}>
<div className="min-w-[600px]">
{/* Day headers */}
<div className="flex border-b border-white/10 bg-neutral-800/50">
<div className="w-14 shrink-0 bg-neutral-900" />
<div className="flex border-b border-neutral-200 bg-neutral-100 dark:border-white/10 dark:bg-neutral-800/50">
<div className="w-14 shrink-0 bg-neutral-50 dark:bg-neutral-900" />
{sortedDays.map((day, di) => (
<div
key={day.day}
className="flex-1 border-l border-white/10 px-2 py-2 text-center"
className="flex-1 border-l border-neutral-200 px-2 py-2 text-center dark:border-white/10"
>
<div className="flex items-center justify-center gap-1">
<span className="text-sm font-medium text-white">{day.dayShort}</span>
<span className="text-sm font-medium text-neutral-900 dark:text-white">{day.dayShort}</span>
<span className="text-xs text-neutral-500">({day.classes.length})</span>
</div>
</div>
@@ -1017,7 +1017,7 @@ function CalendarGrid({
<div
key={day.day}
ref={(el) => { columnRefs.current[di] = el; }}
className={`flex-1 border-l border-white/10 relative ${drag ? "cursor-grabbing" : "cursor-pointer"}`}
className={`flex-1 border-l border-neutral-200 relative dark:border-white/10 ${drag ? "cursor-grabbing" : "cursor-pointer"}`}
style={{ height: `${TOTAL_HOURS * HOUR_HEIGHT}px` }}
onMouseMove={(e) => {
if (drag) return;
@@ -1044,7 +1044,7 @@ function CalendarGrid({
{hours.slice(0, -1).map((h) => (
<div
key={h}
className="absolute left-0 right-0 border-t border-white/5"
className="absolute left-0 right-0 border-t border-neutral-200/60 dark:border-white/5"
style={{ top: `${(h - HOUR_START) * HOUR_HEIGHT}px` }}
/>
))}
@@ -1052,7 +1052,7 @@ function CalendarGrid({
{hours.slice(0, -1).map((h) => (
<div
key={`${h}-30`}
className="absolute left-0 right-0 border-t border-white/[0.02]"
className="absolute left-0 right-0 border-t border-neutral-200/30 dark:border-white/[0.02]"
style={{ top: `${(h - HOUR_START) * HOUR_HEIGHT + HOUR_HEIGHT / 2}px` }}
/>
))}
@@ -1330,7 +1330,7 @@ export default function ScheduleEditorPage() {
className={`flex items-center gap-1 rounded-lg px-4 py-2 text-sm font-medium transition-colors ${
i === activeLocation
? "bg-gold/10 text-gold border border-gold/30"
: "border border-white/10 text-neutral-400 hover:text-white"
: "border border-neutral-200 text-neutral-500 hover:text-neutral-900 dark:border-white/10 dark:text-neutral-400 dark:hover:text-white"
}`}
>
<button
@@ -1362,7 +1362,7 @@ export default function ScheduleEditorPage() {
update({ ...data, locations: newLocations });
setActiveLocation(newLocations.length - 1);
}}
className="rounded-lg border border-dashed border-white/20 px-4 py-2 text-sm text-neutral-500 hover:text-white transition-colors"
className="rounded-lg border border-dashed border-neutral-300 px-4 py-2 text-sm text-neutral-500 hover:text-neutral-900 transition-colors dark:border-white/20 dark:hover:text-white"
>
<Plus size={14} className="inline" /> Локация
</button>