[filebrowser] Visual improvements in share menu in gallery.

BUG=chromium-os:19534
TEST=none
Review URL: http://codereview.chromium.org/8334019

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@106254 0039d316-1c4b-4281-b951-d872f2087c98

4 files changed, 23 insertions, 4 deletions

diff --git a/chrome/browser/resources/component_extension_resources.grd b/chrome/browser/resources/component_extension_resources.grd
index 7c9cf34..4cfcc10 100644
--- a/chrome/browser/resources/component_extension_resources.grd
+++ b/chrome/browser/resources/component_extension_resources.grd
@@ -90,6 +90,7 @@
         <include name="IDR_FILE_MANAGER_IMG_GALLERY_OK" file="file_manager/images/gallery/icon_ok_check.png" type="BINDATA" />
         <include name="IDR_FILE_MANAGER_IMG_GALLERY_CANCEL" file="file_manager/images/gallery/icon_cancel_x.png" type="BINDATA" />
         <include name="IDR_FILE_MANAGER_IMG_GALLERY_CLOSE" file="file_manager/images/gallery/close_x.png" type="BINDATA" />
+        <include name="IDR_FILE_MANAGER_IMG_GALLERY_BUBBLE_POINT" file="file_manager/images/gallery/bubble_point.png" type="BINDATA" />
         <include name="IDR_FILE_MANAGER_IMG_GALLERY_FADE_LEFT" file="file_manager/images/gallery/thumb_fade_left.png" type="BINDATA" />
         <include name="IDR_FILE_MANAGER_IMG_GALLERY_FADE_RIGHT" file="file_manager/images/gallery/thumb_fade_right.png" type="BINDATA" />
         <include name="IDR_FILE_MANAGER_IMG_GALLERY_CURSOR_CROP" file="file_manager/images/gallery/cursor_crop.png" type="BINDATA" />
diff --git a/chrome/browser/resources/file_manager/images/gallery/bubble_point.png b/chrome/browser/resources/file_manager/images/gallery/bubble_point.png
new file mode 100644
index 0000000..aa48f2a
--- /dev/null
+++ b/chrome/browser/resources/file_manager/images/gallery/bubble_point.png
diff --git a/chrome/browser/resources/file_manager/js/image_editor/gallery.css b/chrome/browser/resources/file_manager/js/image_editor/gallery.css
index 741f8bb..54905f4 100644
--- a/chrome/browser/resources/file_manager/js/image_editor/gallery.css
+++ b/chrome/browser/resources/file_manager/js/image_editor/gallery.css
@@ -661,15 +661,29 @@ body {
 .gallery .share-menu {
   position: absolute;
   right: 10px;
-  bottom: 80px;
-  background-color: rgba(240,240,240,1);
+  bottom: 60px;
+  background-color: white;
   opacity: 1.0;
   -webkit-transition: opacity 0.5s ease-in-out;
-  padding: 10px;
+  padding: 8px;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-box-align: stretch;
   -webkit-box-pack: start;
+  border: 1px solid #7f7f7f;
+  -webkit-border-radius: 1px;
+}
+
+.gallery .share-menu .bubble-point {
+  background-image: url(../../images/gallery/bubble_point.png);
+  background-position: center top;
+  background-repeat: no-repeat;
+  position: absolute;
+  width: 20px;
+  height: 8px;
+  bottom: -8px;
+  right: 20px;
+  padding: 0;
 }
 
 .gallery .share-menu[hidden] {
@@ -688,9 +702,10 @@ body {
 }
 
 .gallery .share-menu > div:hover {
-  background-color: rgba(200,200,200,1);
+  background-color: rgba(240,240,240,1);
 }
 
 .gallery .share-menu > div > img {
   margin-right: 5px;
+  display: block;
 }
diff --git a/chrome/browser/resources/file_manager/js/image_editor/gallery.js b/chrome/browser/resources/file_manager/js/image_editor/gallery.js
index c43be05..2ab9da8 100644
--- a/chrome/browser/resources/file_manager/js/image_editor/gallery.js
+++ b/chrome/browser/resources/file_manager/js/image_editor/gallery.js
@@ -848,6 +848,9 @@ function ShareMode(container, toolbar, shareActions,
     row.addEventListener('click', actionCallback.bind(null, action));
     this.menu_.appendChild(row);
   }
+  var arrow = doc.createElement('div');
+  arrow.className = 'bubble-point';
+  this.menu_.appendChild(arrow);
   container.appendChild(this.menu_);
 }