feat: making node inputs bigger on hover

lunarcast · Apr 23, 2020 · 6604ff1 · 6604ff1
1 parent 02070b4
commit 6604ff1
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 2 deletions.
diff --git a/public/styles/components/node.scss b/public/styles/components/node.scss
@@ -1,3 +1,13 @@
+@import "../theme.scss";
+
 .node.selected {
   border: 10px solid red;
 }
+
+.node-input {
+  transition: transform $transition-time;
+}
+
+.node-input:hover {
+  transform: scale(1.1);
+}
diff --git a/public/styles/theme.scss b/public/styles/theme.scss
@@ -1,5 +1,5 @@
-// I curently have only one theme so using hardcoded scss variables is ok
-// In the future I might take a more complex aproach if I want to allow multiple themes
+// I currently have only one theme so using hard-coded scss variables is ok
+// In the future I might take a more complex approach if I want to allow multiple themes
 
 $primary: #262335;
 $on-primary: #e2e2e2;

diff --git a/src/Component/Editor/Node/Input.purs b/src/Component/Editor/Node/Input.purs
@@ -27,4 +27,5 @@ input { radius, spacing, arc: Arc start end _, color } =
     , SA.stroke $ Just color
     , strokeWidth arcWidth
     , strokeLinecap Round
+    , SA.class_ "node-input"
     ]