Properly scope the .sortable-ghost style for the problem set detail page.

Currently that style is defined in the `system.scss` and is not scoped.
As a result it applies to most content generator pages of webwork2.  In
particular it applies to problem pages, and thus it affects draggable
proof problems which use the same sortablejs library with that same css
class.

Note that a related pull request to PG will change the styles for drag
and drop problems and this conflicts with that.  This is probably
already a problem because the opacity of 0.5 does make the drag and drop
elements in problems lack sufficient contrast. Although it only occurs
during a mouse drag and in that situation perhaps that contrast is not
necessary. Still I think there is a better way to do this for problems.

On a related note to the PG pull request, perhaps at some point keyboard
support should be added for reorganizing problems on the problem set
detail page.

Author: drgrice1

htdocs/js/System/system.scss

@@ -942,17 +942,17 @@ input.changed[type='text'] {
 	}
 }
 
-.sortable-ghost {
-	opacity: 0.5;
-}
-
 #psd_list {
 	padding-left: 0;
 	padding-bottom: 0.25rem;
 	margin-bottom: 0;
 
 	.psd_list_item {
 		list-style-type: none;
+
+		&.sortable-ghost {
+			opacity: 0.5;
+		}
 	}
 
 	&:not(.disable_renumber) .pdr_handle {