From 864fa961fae83019b0c6c5e61fc1e284cbf2688e Mon Sep 17 00:00:00 2001 From: Matt Huntington Date: Fri, 10 Nov 2023 07:11:33 -0500 Subject: [PATCH] dragging highlights --- app.css | 12 +++++++----- app.js | 10 ++++++++++ index.html | 26 ++++++++++++++++++++------ 3 files changed, 37 insertions(+), 11 deletions(-) diff --git a/app.css b/app.css index 699e237..ffb186d 100644 --- a/app.css +++ b/app.css @@ -1,12 +1,14 @@ -ul { - padding:0px; +ul.dragging { + border-color:red; +} +ul, li { + padding:1em; + border:1px solid black; + margin:1em; } li { cursor:grab; - border:1px solid black; - padding: 1em; - margin: 1em; list-style:none; } diff --git a/app.js b/app.js index e69de29..615f6a1 100644 --- a/app.js +++ b/app.js @@ -0,0 +1,10 @@ +const uls = document.querySelectorAll('ul'); + +for (ul of uls) { + ul.addEventListener('dragover', (event)=>{ + event.target.classList.add('dragging'); + }) + ul.addEventListener('dragleave', (event)=>{ + event.target.classList.remove('dragging'); + }) +} diff --git a/index.html b/index.html index 4060ad2..68ad7a0 100644 --- a/index.html +++ b/index.html @@ -9,14 +9,28 @@

New Trello