Show a ghost placeholder when dragging channels

[xPaw]

I think it provides a better UI.

[astorije]

@xPaw, no offense but... that's not pretty :D :D

I tried a couple things (including a skeleton placeholder which... didn't go well lol) and I think the following works well:

What do you think?

The GIF doesn't show it well, but it's a dotted border, similar to this example.
The diff to get there:

Diff

diff --git a/client/css/style.css b/client/css/style.css
index 37bc17f2..a3f5a5f9 100644
--- a/client/css/style.css
+++ b/client/css/style.css
@@ -542,6 +542,13 @@ kbd {
 	display: none;
 }

+#sidebar .network-placeholder,
+#sidebar .chan-placeholder {
+	border: 1px dotted #99a2b4;
+	border-radius: 4px;
+	margin: -1px 10px;
+}
+
 #sidebar .network,
 #sidebar .network-placeholder {
 	position: relative;
@@ -549,6 +556,10 @@ kbd {
 	touch-action: pan-y;
 }

+#sidebar .network-placeholder {
+	margin-bottom: 29px;
+}
+
 #sidebar .empty {
 	flex-grow: 1;
 	line-height: 1.6;
@@ -561,7 +572,6 @@ kbd {
 	display: flex;
 	padding: 8px 14px;
 	transition: color 0.2s;
-	width: 100%;
 }

 #sidebar .chan.lobby {

[xPaw]

@astorije used your method, except I used dashed style because it's doesn't blend in as much.