Merge pull request #63 from dhg637/new-tool-icons

New tool icons

3 files changed, 162 insertions, 214 deletions

diff --git a/scss/imports/scss/_MontageOverrides.scss b/scss/imports/scss/_MontageOverrides.scss
index 65b9ede0..6e728863 100644
--- a/scss/imports/scss/_MontageOverrides.scss
+++ b/scss/imports/scss/_MontageOverrides.scss
@@ -16,4 +16,8 @@
 }
 .montage-popup-container {
     background: none;
+}
+
+.montage-invisible {
+    display: none;
 }
\ No newline at end of file
diff --git a/scss/imports/scss/_Tools.scss b/scss/imports/scss/_Tools.scss
index 935c4cd6..19ede70a 100755
--- a/scss/imports/scss/_Tools.scss
+++ b/scss/imports/scss/_Tools.scss
@@ -12,23 +12,15 @@
 // 
   
 
-// Made changes to toolButton  
+// Made changes to toolButton  }
 
-.toolButton {
-    width:26px;
-    height:23px;
-    padding: 0px;
-    margin:1px;
-    border-width: 1px;
-    border-style: solid; 
-}
-
-.subToolButton {
+.subToolHolderPanel .toolbutton {
     float:left;
+    -webkit-transform: scale(0.6);
 }
 
-#topPanelContainer .subToolButton {
-
+.subToolHolderPanel .toolbutton:hover, .subToolHolderPanel .toolbutton.active {
+    -webkit-transform: scale(0.75);
 }
 
 .subOption{
@@ -39,21 +31,6 @@
     margin-right: 10px;
 }
 
-.toolButton:active {   
-    border-top-width: 1px;
-    border-top-style: solid; 
-    border-left-width: 1px;
-    border-left-style: solid; 
-}
-
-.toolButtonSelected {
-    border-top-width: 1px;
-    border-top-style: solid; 
-    border-left-width: 1px;
-    border-left-style: solid;
-
-}
-
 .toolSeparator {
     height:1px;
     width:30px;
diff --git a/scss/imports/scss/_toolbar.scss b/scss/imports/scss/_toolbar.scss
index 048c1f88..00d8b5f0 100755
--- a/scss/imports/scss/_toolbar.scss
+++ b/scss/imports/scss/_toolbar.scss
@@ -11,280 +11,247 @@
 // _scss/themes/themename/_colors.scss and _scss/themes/themename/_fonts.scss
   
 
-//  New Tool List CSS  
-.SelectionToolPressed {
-    @include background-pos(12,1,26px,23px);
-    @include opacity(1.0);
+//  New Tool List CSS
+#toolsPanelContent {
+    width:40px;
 }
 
-.SelectionToolUnpressed {
-    @include background-pos(13,1,26px,23px);
-    @include opacity(0.7);
+.toolsList {
+    width:29px;
+    margin:auto;
 }
 
-.SubselectionToolPressed {
-    @include background-pos(14,1,26px,23px);
-    @include opacity(1.0);
+.toolsList hr {
+    border:0px;
+    border-top: 1px solid #232323;
+    border-bottom: 1px solid #3A3A3A;
+    margin:2px;
 }
 
-.SubselectionToolUnpressed {
-    @include background-pos(15,1,26px,23px);
-    @include opacity(0.7);
+.toolbutton {
+    width:29px;
+    height:29px;
+    background-position: center center;
+    background-repeat: no-repeat;
+    border-radius:3px;
+    opacity: 1;
+    margin-bottom: 2px;
+    -webkit-transform: scale(0.8);
+    -webkit-transition: 0.15s all cubic-bezier(.44,.19,0,.99);
 }
 
-.RotateTool3DPressed {
-    @include background-pos(0,0,26px,23px);
-    @include opacity(1.0);
-}
+.toolbutton:hover, .toolbutton.active {
+    box-shadow:  0px 0px 2px 2px #999;
 
-.RotateTool3DUnpressed {
-    @include background-pos(1,0,26px,23px);
-    @include opacity(0.7);
+    -webkit-transform: scale(1);
+    opacity: 1;
 }
 
-.Translate3DPressed {
-    @include background-pos(4,0,26px,23px);
-    @include opacity(1.0);
+.toolbutton:active {
+    background-color: #8c8c8c;
 }
 
-.Translate3DUnpressed {
-    @include background-pos(5,0,26px,23px);
-    @include opacity(0.7);
+.toolbutton.active {
+    box-shadow: inset 0px 0px 2px 2px #555;
+    background-color:#363636;
 }
 
-.TagToolPressed {
-    @include background-pos(0,2,26px,23px);
-    @include opacity(1.0);
+.SelectionTool {
+    background-image:url("../images/tools/Tool-Selection.png");
 }
 
-.TagToolUnpressed {
-    @include background-pos(1,2,26px,23px);
-    @include opacity(0.7);
+.SubselectionTool {
+    background-image:url("../images/tools/Tool-Subselect.png");
 }
 
-.PenToolPressed {
-    @include background-pos(6,1,26px,23px);
-    @include opacity(1.0);
+.RotateTool3D {
+    background-image:url("../images/tools/Tool-3DRotate.png");
 }
 
-.PenToolUnpressed {
-    @include background-pos(7,1,26px,23px);
-    @include opacity(0.7);
+.Translate3D {
+    background-image:url("../images/tools/Tool-3DTranslate.png");
 }
 
-.TextToolPressed {
-    @include background-pos(2,2,26px,23px);
-    @include opacity(1.0);
+.TagTool {
+    background-image:url("../images/tools/Tool-Tag.png");
 }
 
-.TextToolUnpressed {
-    @include background-pos(3,2,26px,23px);
-    @include opacity(0.7);
+.PenTool {
+    background-image:url("../images/tools/Tool-Pen.png");
 }
 
-.ShapeContainerPressed {
-    @include background-pos(4,1,26px,23px);
-    @include opacity(1.0);
-}
-.ShapeContainerUnpressed {
-    @include background-pos(5,1,26px,23px);
-    @include opacity(0.7);
+.TextTool {
+    background-image:url("../images/tools/Tool-Text.png");
 }
 
-.OvalToolPressed {
-    @include background-pos(4,1,26px,23px);
-    @include opacity(1.0);
+.ShapeContainer {
+    background-image:url("../images/tools/Tool-Rectangle.png");
 }
 
-.OvalToolUnpressed {
-    @include background-pos(5,1,26px,23px);
-    @include opacity(0.7);
+.OvalTool {
+    background-image:url("../images/tools/Tool-Oval.png");
 }
 
-.RectangleToolPressed {
-    @include background-pos(10,1,26px,23px);
-    @include opacity(1.0);
+.RectangleTool {
+    background-image:url("../images/tools/Tool-Square.png");
 }
 
-.RectangleToolUnpressed {
-    @include background-pos(11,1,26px,23px);
-    @include opacity(0.7);
+.LineTool {
+    background-image:url("../images/tools/Tool-Line.png");
 }
 
-.LineToolPressed {
-    @include background-pos(2,1,26px,23px);
-    @include opacity(1.0);
+.PencilTool {
+    background-image:url("../images/tools/Tool-Pencil.png");
 }
 
-.LineToolUnpressed {
+.BrushTool {