Added new icons

brave · Feb 2, 2017 · faeae7f · faeae7f
1 parent b244e67
commit faeae7f
Show file tree

Hide file tree

Showing 6 changed files with 127 additions and 31 deletions.
diff --git a/img/toolbar/add_BM_folder_btn.svg b/img/toolbar/add_BM_folder_btn.svg
diff --git a/img/toolbar/add_bookmark_btn.svg b/img/toolbar/add_bookmark_btn.svg
diff --git a/img/toolbar/bookmarks_export.svg b/img/toolbar/bookmarks_export.svg
diff --git a/img/toolbar/bookmarks_import.svg b/img/toolbar/bookmarks_import.svg
diff --git a/js/about/bookmarks.js b/js/about/bookmarks.js
@@ -465,8 +465,8 @@ class AboutBookmarks extends React.Component {
         <div className='folderView'>
           <div className='columnHeader'>
             <span data-l10n-id='folders' />
-            <span data-l10n-id='importBrowserData' className='fa fa-upload importBrowserData' onClick={this.importBrowserData} />
-            <span data-l10n-id='exportBookmarks' className='fa fa-download exportBookmarks' onClick={this.exportBookmarks} />
+            <span data-l10n-id='importBrowserData' className='importBrowserData' onClick={this.importBrowserData} />
+            <span data-l10n-id='exportBookmarks' className='exportBookmarks' onClick={this.exportBookmarks} />
             <span data-l10n-id='addBookmarkFolder' className='addBookmarkFolder' onClick={this.addBookmarkFolder} />
           </div>
           <BookmarkFolderList

diff --git a/less/about/bookmarks.less b/less/about/bookmarks.less
@@ -47,22 +47,6 @@
         padding-left: 10px;
         -webkit-user-select: none;
         cursor: default;
-
-        .importBrowserData,
-        .exportBookmarks {
-          color: @buttonColor;
-          float: right;
-          font-size: 20px;
-          margin: 0;
-
-          &:hover {
-            color: #000;
-          }
-        }
-
-        .exportBookmarks {
-          margin: 1px 7px 0 0;
-        }
       }
 
       > .bookmarkFolderList {
@@ -153,27 +137,46 @@
   padding-left: 12px;
 }
 
-.addBookmarkFolder {
+.addBookmarkFolder,
+.importBrowserData,
+.exportBookmarks,
+.addBookmark {
   background-color: @buttonColor;
-  -webkit-mask-image: url('../../img/toolbar/add_BM_folder_btn.svg');
   -webkit-mask-repeat: no-repeat;
-  margin-right: 7px;
   width: 24px;
   height: 26px;
   float: right;
 }
-.addBookmarkFolder:hover {
-  background-color: #000;
+
+.addBookmarkFolder {
+  -webkit-mask-image: url('../../img/toolbar/add_BM_folder_btn.svg');
+  margin: 0 10px 0 0;
+}
+
+.importBrowserData {
+  -webkit-mask-image: url('../../img/toolbar/bookmarks_import.svg');
+  width: 31px;
+  margin: 3px 0 0 0;
 }
+
+.exportBookmarks {
+  -webkit-mask-image: url('../../img/toolbar/bookmarks_export.svg');
+  width: 26px;
+  margin: 3px 10px 0 0;
+}
+
 .addBookmark {
-  background-color: @buttonColor;
   -webkit-mask-image: url('../../img/toolbar/add_bookmark_btn.svg');
-  -webkit-mask-repeat: no-repeat;
-  margin-right: 7px;
   width: 20px;
   height: 20px;
-  float: right;
+  margin-right: 7px;
 }
-.addBookmark:hover {
-  background-color: #000;
+
+.addBookmark,
+.addBookmarkFolder,
+.importBrowserData,
+.exportBookmarks {
+  &:hover {
+    background-color: #000;
+  }
 }