Initial commit: spreewaldzeit + Dockerfile for Coolify (Next.js + Prisma/SQLite)

components/ui/Input.tsx

@@ -0,0 +1,80 @@
+import { cn } from "@/lib/utils";
+import { forwardRef, type InputHTMLAttributes, type TextareaHTMLAttributes, type LabelHTMLAttributes } from "react";
+
+// -----------------------------------------------------------------
+// Label
+// -----------------------------------------------------------------
+export function Label({
+  className,
+  ...props
+}: LabelHTMLAttributes<HTMLLabelElement>) {
+  return (
+    <label
+      className={cn(
+        "text-xs uppercase tracking-[0.18em] text-ink/70 font-medium",
+        className
+      )}
+      {...props}
+    />
+  );
+}
+
+// -----------------------------------------------------------------
+// Input
+// -----------------------------------------------------------------
+interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
+  error?: string;
+}
+
+export const Input = forwardRef<HTMLInputElement, InputProps>(
+  ({ className, error, ...props }, ref) => (
+    <input
+      ref={ref}
+      className={cn(
+        "w-full bg-transparent border-b py-2.5 text-base",
+        "placeholder:text-ink/40 focus:outline-none",
+        error
+          ? "border-red-600 focus:border-red-700"
+          : "border-ink/25 focus:border-ink",
+        "transition-colors",
+        className
+      )}
+      {...props}
+    />
+  )
+);
+Input.displayName = "Input";
+
+// -----------------------------------------------------------------
+// Textarea
+// -----------------------------------------------------------------
+interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+  error?: string;
+}
+
+export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
+  ({ className, error, ...props }, ref) => (
+    <textarea
+      ref={ref}
+      className={cn(
+        "w-full bg-transparent border py-3 px-3 text-base rounded-md",
+        "placeholder:text-ink/40 focus:outline-none resize-y min-h-[120px]",
+        error
+          ? "border-red-600 focus:border-red-700"
+          : "border-ink/25 focus:border-ink",
+        "transition-colors",
+        className
+      )}
+      {...props}
+    />
+  )
+);
+Textarea.displayName = "Textarea";
+
+// -----------------------------------------------------------------
+// FieldError – ein einheitlicher Fehler-Text
+// -----------------------------------------------------------------
+export function FieldError({ message }: { message?: string }) {
+  if (!message) return null;
+  return <p className="mt-1.5 text-xs text-red-700">{message}</p>;
+}