fix: Make color slider disabled state consistent with disabled color area (#489)

* Make color slider disabled state consistent with disabled color area

* Add cursor on parent and disable pointer events on child

Author: bjarnef

packages/uui-color-area/lib/uui-color-area.element.ts

@@ -24,11 +24,17 @@ export class UUIColorAreaElement extends LitElement {
         width: 280px;
         height: 200px;
       }
+
       :host([disabled]) {
-        pointer-events: none;
         cursor: not-allowed;
+      }
+
+      :host([disabled]) .color-area {
+        user-select: none;
+        pointer-events: none;
         opacity: 0.55;
       }
+
       .color-area {
         position: relative;
         height: 100%;

packages/uui-color-slider/lib/uui-color-slider.element.ts

@@ -95,9 +95,14 @@ export class UUIColorSliderElement extends LabelMixin('label', LitElement) {
         height: 300px;
       }
 
+      :host([disabled]) {
+        cursor: not-allowed;
+      }
+
       :host([disabled]) #color-slider {
         user-select: none;
-        cursor: not-allowed;
+        pointer-events: none;
+        opacity: 0.55;
       }
 
       #color-slider__handle {