⚙️ Fix #53

- 🎨 [v1.0.1] `BlocklyApp/components/BlocklyWorkspace`: Increase the opaque to the scrollbars and the trashcan (#53).
lgraziani2712 · Aug 31, 2017 · 1e33e88 · 1e33e88
1 parent 7e89a23
commit 1e33e88
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 4 deletions.
diff --git a/core/CHANGELOG.md b/core/CHANGELOG.md
@@ -4,6 +4,7 @@
 
 - 🎨 [v1.0.1] `Activity`: Add more visually atractive cursors (#57).
 - 🎨 [v1.0.1] `BlocklyApp`: Add more visually atractive cursors (#57).
+- 🎨 [v1.0.1] `BlocklyApp/components/BlocklyWorkspace`: Increase the opaque to the scrollbars and the trashcan (#53).
 
 ## v1.0.0-alpha.0
 
@@ -48,5 +49,6 @@
 - 🆕 [v1.0.0] `Activity`.
 - 🆕 [v1.0.0] `BlocklyApp`.
 - 🆕 [v1.0.0] `BlocklyApp/components/BlocklyToolbox`.
+- 🆕 [v1.0.0] `BlocklyApp/components/BlocklyWorkspace`.
 - 🆕 [v1.0.0] `CodimoRouter`.
 - 🆕 [v1.0.0] `PixiApp`.
diff --git a/core/ui/BlocklyApp/components/BlocklyWorkspace.jsx b/core/ui/BlocklyApp/components/BlocklyWorkspace.jsx
@@ -17,16 +17,38 @@ const Workspace = styled.div`
   height: 520px;
   width: 580px;
 
+  & .blocklyTrash {
+    opacity: 1 !important;
+  }
+
   & .blocklyDraggable {
     cursor: url(${GrabURL}) 15 5, auto;
+
+    &.blocklyDragging {
+      cursor: url(${GrabbingURL}) 15 5, auto;
+
+      &.blocklyDraggingDelete {
+        cursor: url(${GrabbingNotURL}) 15 5, auto;
+      }
+    }
   }
 
-  & .blocklyDraggable.blocklyDragging {
-    cursor: url(${GrabbingURL}) 15 5, auto;
+  & .blocklyScrollbarBackground {
+    &:hover+.blocklyScrollbarHandle {
+      fill: rgba(80, 80, 80, 0.75);
+    }
   }
 
-  & .blocklyDraggable.blocklyDragging.blocklyDraggingDelete {
-    cursor: url(${GrabbingNotURL}) 15 5, auto;
+  & .blocklyScrollbarHandle {
+    fill: rgba(100, 100, 100, 0.75);
+
+    &:hover {
+      fill: rgba(80, 80, 80, 0.75);
+    }
+
+    &:active {
+      fill: rgba(60, 60, 60, 0.75);
+    }
   }
 `;