feat: improve toast animations and update to original Zinc color palette

frontend/src/components/ui/drag_and_drop.rs

@@ -0,0 +1,25 @@
+use leptos::prelude::*;
+use leptos_ui::clx;
+
+mod components {
+    use super::*;
+    clx! {Draggable, div, "flex flex-col gap-4 w-full max-w-4xl"}
+    clx! {DraggableZone, div, "dragabble__container", "bg-neutral-600 p-4 mt-4"}
+
+    // TODO. ItemRoot (needs `draggable` as clx attribute).
+}
+
+pub use components::*;
+
+/* ========================================================== */
+/*                     ✨ FUNCTIONS ✨                        */
+/* ========================================================== */
+
+#[component]
+pub fn DraggableItem(#[prop(into)] text: String) -> impl IntoView {
+    view! {
+        <div class="p-4 border cursor-move border-input bg-card draggable" draggable="true">
+            {text}
+        </div>
+    }
+}