From 2cdefe05cdc058160093d7ab9d50a4fadd1c45fc Mon Sep 17 00:00:00 2001
From: John Mayhew
Date: Mon, 14 May 2012 12:41:47 -0700
Subject: -updated images for tag and zoom tool

-made tag and zoom tool radio group button styles consistent and removed duplicate classes
---
 scss/imports/scss/_Tools.scss | 138 ++++++++++++++----------------------------
 1 file changed, 46 insertions(+), 92 deletions(-)

(limited to 'scss')

diff --git a/scss/imports/scss/_Tools.scss b/scss/imports/scss/_Tools.scss
index c2d2498a..1813fb14 100755
--- a/scss/imports/scss/_Tools.scss
+++ b/scss/imports/scss/_Tools.scss
@@ -31,11 +31,6 @@
     float:left;
 }
 
-// .toolOptionsFloatChildren select.nj-skinned {
-//     margin-top: 2px;
-// }
-
-
 .toolOptionsSpacer {
     margin-right: 9px;
 }
@@ -57,6 +52,45 @@
     background-color: rgb(40, 40, 40);
 }
 
+// generic styles for image radio button groups used in the tool options bar
+.subToolHolderPanel input.toolOptsRadioButton {
+	background: none;
+	width: 20px;
+	height: 20px;
+	display: block;
+	margin: 0px;
+	padding: 0px;
+	margin-right: 5px;
+	margin-top: 0px;
+	background-repeat: no-repeat;
+	opacity: 0.8;
+	text-indent: -9999px;
+	cursor: pointer;
+	-webkit-border-radius: 3px;
+	-webkit-user-select: none;
+	border: 1px solid transparent;
+	background-position: 1px 1px;
+}
+
+.subToolHolderPanel input.toolOptsRadioButton:active {
+	border: 1px solid transparent;
+}
+
+.subToolHolderPanel input.toolOptsRadioButton:hover {
+	opacity: 1.0;
+	-webkit-box-shadow: 0px 0px 4px #fff;
+}
+
+.subToolHolderPanel input.toolOptsRadioButton:checked {
+	background-color: $color-tool-bg-active;
+	opacity: 1.0;
+	cursor: default;
+	-webkit-box-shadow: none;
+	background-repeat: no-repeat;
+	background-position: 1px 1px;
+}
+
+
 //  Added new styling Sub Tool Shape Options 
 .textBox {
 
@@ -270,70 +304,20 @@ input[type="radio"]:disabled {
 }
 
 //  Begin: styles for tag toolbar  
-.tagRadioButtons input.tag-type {
-	background: none;
-	width: 20px;
-	height: 20px;
-	display: block;
-	float: left;
-	margin: 0px;
-	padding: 0px;
-	margin-right: 5px;
-	margin-top: 0px;
-	background-repeat: no-repeat;
-	opacity: 0.8;
-	text-indent: -9999px;
-	cursor: pointer;
-	-webkit-border-radius: 3px;
-	-webkit-user-select: none;
-	border: 1px solid transparent;
-}
-.tagRadioButtons input.tag-type {
-	background-image: url("../images/tools/sprite-toolbar-tag.png");
-}
-.tagRadioButtons input.tag-type:active {
-	border: 1px solid transparent;
-}
-.tagRadioButtons input.tag-type:hover {
-	opacity: 1.0;
-	-webkit-box-shadow: 0px 0px 4px #fff;
-}
-.tagRadioButtons input.tag-type:checked {
-	background-color: transparent;
-	opacity: 1.0;
-	cursor: default;
-	-webkit-box-shadow: none;
-}
 .tagRadioButtons input.divTool {
-	margin-left: 8px;
-	background-position: -40px 0px;
-}
-.tagRadioButtons input.divTool:checked {
-	background-position: -40px -20px;
+	background-image: url("../images/optionsbar/tag/div-tag.png");
 }
 .tagRadioButtons input.imageTool {
-	background-position: -60px 0px;
-}
-.tagRadioButtons input.imageTool:checked {
-	background-position: -60px -20px;
+	background-image: url("../images/optionsbar/tag/img-tag.png");
 }
 .tagRadioButtons input.videoTool {
-	background-position: -100px 0px;
-}
-.tagRadioButtons input.videoTool:checked {
-	background-position: -100px -20px;
+	background-image: url("../images/optionsbar/tag/vid-tag.png");
 }
 .tagRadioButtons input.canvasTool {
-	background-position: -20px 0px;
-}
-.tagRadioButtons input.canvasTool:checked {
-	background-position: -20px -20px;
+	background-image: url("../images/optionsbar/tag/canvas-tag.png");
 }
 .tagRadioButtons input.customTool {
-	background-position: 0px 0px;
-}
-.tagRadioButtons input.customTool:checked {
-	background-position: 0px -20px;
+	background-image: url("../images/optionsbar/tag/custom-tag.png");
 }
 
 .tagRadioButtons .nj-divider {
@@ -354,42 +338,12 @@ input[type="radio"]:disabled {
 }
 //  End: styles for tag toolbar  
 
-#zoomToolOptionHolder input#zoomInTool:checked{
-    border-style:solid;
-    border-width:1px ;
-    border-color: $color-input;
-    background-image:url("../images/optionsbar/zoom/zoom_plus.png");
-    background-repeat: no-repeat;
-    background-position:4px 3px;
-}
-
-#zoomToolOptionHolder input#zoomOutTool:checked{
-    border-style:solid;
-    border-width:1px ;
-    border-color: $color-input;
+#zoomToolOptionHolder .zoomOutToolIcon {
     background-image:url("../images/optionsbar/zoom/zoom_minus.png");
-    background-repeat: no-repeat;
-    background-position:4px 3px;
 }
 
-#zoomToolOptionHolder input#zoomInTool{
-    border-style:solid;
-    border-width:1px ;
+#zoomToolOptionHolder .zoomInToolIcon {
     background-image:url("../images/optionsbar/zoom/zoom_plus.png");
-    background-repeat: no-repeat;
-    background-position:4px 3px;
-}
-
-#zoomToolOptionHolder input#zoomOutTool{
-    border-style:solid;
-    border-width:1px ;
-    background-image:url("../images/optionsbar/zoom/zoom_minus.png");
-    background-repeat: no-repeat;
-    background-position:4px 3px;
-
-}
-#zoomToolOptionHolder input.zoom-option {
-    background:none;
 }
 
 // object 3D container styles
-- 
cgit v1.2.3