Updated css confirmation button style

martinsbalodis · Nov 24, 2013 · 840df60 · 840df60
1 parent 0e895de
commit 840df60
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 27 deletions.
diff --git a/extension/content_script/content_script.css b/extension/content_script/content_script.css
@@ -1,46 +1,63 @@
 .-sitemap-preview {
-    outline: 1px #d94e37 solid !important;
+	outline: 1px #d94e37 solid !important;
 }
 
 .-sitemap-parent {
-    outline: 2px #FFCC33 solid !important;
+	outline: 2px #FFCC33 solid !important;
 }
 
 .-sitemap-select-item-hover {
-    outline: 2px solid green !important;
+	outline: 2px solid green !important;
 }
 
 .-sitemap-select-item-selected {
-    outline: 2px solid #C70000 !important;
+	outline: 2px solid #C70000 !important;
 }
 
 #-selector-toolbar {
-    position: fixed !important;
-    bottom: 0 !important;
-    left: 0 !important;
-    background: #DEDEDE !important;
-    width: 300px !important;
-    height: 50px !important;
-    z-index:99999 !important;
-    font:100%/1em Verdana, Helvetica, sans-serif !important;
+	position: fixed !important;
+	bottom: 10px !important;
+	left: 10px !important;
+	z-index: 99999 !important;
 }
+
 #-selector-toolbar * {
-    font:100%/1em Verdana, Helvetica, sans-serif !important;
+	font: 100%/1em Verdana, Helvetica, sans-serif !important;
+	padding: 3px 12px !important;
+	color: #333333 !important;
+	font-size: 14px !important;
+	font-weight: normal !important;
+	line-height: 1.428571429 !important;
+	white-space: nowrap !important;
+	vertical-align: middle !important;
+	border: 1px solid #285e8e !important;
+	text-transform: none !important;
+	margin: 0 !important;
+	letter-spacing: normal !important;
+	word-spacing: normal !important;
+	text-indent: 0px !important;
+	text-shadow: none !important;
+	text-decoration: none !important;
+	display: inline-block !important;
+	text-align: right !important;
+	overflow: hidden !important;
 }
 
 #-selector-toolbar a {
-    display:block !important;
-    margin:2px !important;
-    text-align:center !important;
-    color:#FFF !important;
-    cursor:pointer !important;
-    background: #909090 !important;
+	color: #ffffff !important;
+	background-color: #3276b1 !important;
+	text-align: center !important;
+	cursor: pointer !important;
+	border-radius: 0 4px 4px 0 !important;
+	-webkit-user-select: none !important;
 }
 
-#-selector-toolbar span {
-    color: #282828 !important;
-    display:block !important;
-    margin:0 2px 2px 2px !important;
-    font-size:9px !important;
-    text-align:left !important;
+#-selector-toolbar span.selector {
+	padding: 3px 6px !important;
+	width: 350px !important;
+	color: #333333 !important;
+	background: #FFFFFF none no-repeat !important;
+	border-radius: 4px 0 0 4px !important;
+	/*height: 28px !important;*/
+	border-right:none !important;
 }
diff --git a/extension/scripts/ContentSelector.js b/extension/scripts/ContentSelector.js
@@ -169,9 +169,8 @@ ContentSelector.prototype = {
 	attachToolbar: function () {
 
 		var $toolbar = '<div id="-selector-toolbar">' +
+			'<span class="selector">&nbsp;</span>' +
 			'<a>Done selecting!</a>' +
-			'<span class="info">Use up/down arrows to select parent elements of an element</span>' +
-			'<span class="selector"></span>' +
 			'</div>';
 		$("body").append($toolbar);
 

diff --git a/playgrounds/extension/index.html b/playgrounds/extension/index.html
@@ -3,6 +3,7 @@
 <head>
 	<link rel="stylesheet" href="../../extension/assets/bootstrap-3.0.0/css/bootstrap.css">
 	<link rel="stylesheet" href="../../extension/devtools/devtools_scraper_panel.css">
+	<link rel="stylesheet" href="../../extension/content_script/content_script.css">
 	<link rel="stylesheet" href="webpage.css">
 	<script src="../../extension/assets/jquery-2.0.3.js"></script>
 	<script src="../../extension/assets/pouchdb-nightly.min.js"></script>