fix buttons styles - makes them more visible (#526)

* fix buttons styles - makes them more visible

* increase thikness of the icons

* fix: add lighter border and background while not hovering

Co-authored-by: Robert Stewart (eXcell <v-stewro@microsoft.com>
Co-authored-by: stew-ro <60453211+stew-ro@users.noreply.github.com>

src/react/components/pages/editorPage/canvas.scss

@@ -19,19 +19,21 @@
   width: 48px;
   height: 48px;
   outline: none;
-
-  background-color: transparent;
-  border: none;
-  color: #CCC;
+  background-color: $darker-1;
+  border: solid 1px $lighter-2;
+  color: rgb(0, 161, 241);
 
   &:hover, &.active {
-      background-color: $lighter-2;
-      border: solid 1px $lighter-3;
+    background-color: $darker-2;
+    border: solid 1px $lighter-3;
   }
 
   &:active {
       background-color: $darker-2;
   }
+  .ms-Icon {
+      font-weight: 600;
+  }
 }
 
 .prev {