From e8d7e2e3378a5da4e1f11f20d426c9371395c806 Mon Sep 17 00:00:00 2001
From: NejcZdovc <nejc.zdovc@3zsistemi.si>
Date: Thu, 2 Feb 2017 07:17:15 +0100
Subject: [PATCH] Added new icons

---
 img/toolbar/add_BM_folder_btn.svg |  2 +-
 img/toolbar/add_bookmark_btn.svg  |  2 +-
 img/toolbar/bookmarks_export.svg  |  2 +
 img/toolbar/bookmarks_import.svg  |  1 +
 js/about/bookmarks.js             |  4 +-
 less/about/bookmarks.less         | 62 +++++++++++++++++--------------
 6 files changed, 42 insertions(+), 31 deletions(-)
 create mode 100644 img/toolbar/bookmarks_export.svg
 create mode 100644 img/toolbar/bookmarks_import.svg

diff --git a/img/toolbar/add_BM_folder_btn.svg b/img/toolbar/add_BM_folder_btn.svg
index 79f11b5e104..b2ce75e48c2 100644
--- a/img/toolbar/add_BM_folder_btn.svg
+++ b/img/toolbar/add_BM_folder_btn.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15.51 11.41"><defs><style>.cls-1{fill:none;stroke:#6d6e70;stroke-linecap:round;stroke-linejoin:round;stroke-width:0.83px;}.cls-2{fill:#6d6e70;}</style></defs><title>add_BM_folder_btn</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><line class="cls-1" x1="12.92" y1="4.78" x2="12.92" y2="0.41"/><line class="cls-1" x1="10.73" y1="2.6" x2="15.1" y2="2.6"/><path class="cls-2" d="M12.28,10H1.36V3.23H8.56a.61.61,0,0,0,.61-.61V2.4a.54.54,0,0,0-.54-.54H6.82L5.46.5H1.36A1.36,1.36,0,0,0,0,1.86V10a1.36,1.36,0,0,0,1.36,1.36H12.28A1.36,1.36,0,0,0,13.65,10V7.21a.71.71,0,0,0-.71-.71h-.06a.6.6,0,0,0-.6.6Z"/></g></g></svg>
\ No newline at end of file
+<svg version="1.2" baseProfile="tiny" id="Layer_1_copy" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 48 48" xml:space="preserve"><g><line fill="none" stroke="#6D6E70" stroke-width="2.4266" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" x1="38.8" y1="20.5" x2="38.8" y2="7.7"/><line fill="none" stroke="#6D6E70" stroke-width="2.4266" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" x1="32.4" y1="14.1" x2="45.1" y2="14.1"/></g><g>	<path fill="#6D6E70" d="M36.9,35.9H5V16H26c1,0,1.8-0.8,1.8-1.8v-0.6c0-0.9-0.7-1.6-1.6-1.6h-5.3l-4-4H5c-2.2,0-4,1.8-4,4l0,24c0,2.2,1.8,4,4,4h32c2.2,0,4-1.8,4-4v-8.3c0-1.1-0.9-2.1-2.1-2.1h-0.2c-1,0-1.8,0.8-1.8,1.8V35.9z"/></g></svg>
diff --git a/img/toolbar/add_bookmark_btn.svg b/img/toolbar/add_bookmark_btn.svg
index 99341b82bad..58eaadbfa3f 100644
--- a/img/toolbar/add_bookmark_btn.svg
+++ b/img/toolbar/add_bookmark_btn.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15.13 15.46"><defs><style>.cls-1,.cls-2{fill:none;stroke:#6d6e70;stroke-linecap:round;stroke-linejoin:round;}.cls-2{stroke-width:0.96px;}</style></defs><title>add_bookmark_btn</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><g id="X1vBn6.tif"><path class="cls-1" d="M11.16,15a.89.89,0,0,0,0-.13c-.22-1.29-.44-2.57-.67-3.86a.94.94,0,0,1,.29-.92c.93-.89,1.84-1.79,2.76-2.68l.15-.17L9.63,6.61a.87.87,0,0,1-.71-.52L7.2,2.61l-.11-.2L7,2.62C6.41,3.78,5.84,4.94,5.27,6.1a.82.82,0,0,1-.64.5L1.3,7.08.53,7.2l0,.05.17.13c.92.89,1.83,1.8,2.76,2.68a.89.89,0,0,1,.27.85l-.57,3.27c0,.25-.08.49-.13.77l.19-.1c1.12-.59,2.25-1.17,3.37-1.78a1,1,0,0,1,1,0c1.11.6,2.24,1.18,3.35,1.77Z"/></g><line class="cls-2" x1="12.49" y1="4.79" x2="12.49" y2="0.48"/><line class="cls-2" x1="10.33" y1="2.64" x2="14.65" y2="2.64"/></g></g></svg>
\ No newline at end of file
+<svg version="1.2" baseProfile="tiny" id="Layer_1_copy" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 48 48" xml:space="preserve"><g id="X1vBn6.tif_19_"><g><path fill="none" stroke="#6D6E70" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" d="M34.9,44.3c0-0.2,0-0.3,0-0.4c-0.6-3.8-1.3-7.5-1.9-11.3c-0.2-1.1,0-1.9,0.8-2.7c2.7-2.6,5.4-5.2,8.1-7.8c0.1-0.1,0.3-0.3,0.4-0.5c-4-0.6-7.9-1.2-11.9-1.7c-1-0.1-1.6-0.6-2.1-1.5c-1.7-3.4-3.3-6.8-5-10.2c-0.1-0.2-0.2-0.3-0.3-0.6c-0.1,0.3-0.2,0.4-0.3,0.6c-1.7,3.4-3.4,6.8-5,10.2c-0.4,0.8-1,1.3-1.9,1.5c-3.2,0.5-6.5,0.9-9.7,1.4c-0.8,0.1-1.5,0.2-2.3,0.3c0,0.1-0.1,0.1-0.1,0.2c0.2,0.1,0.3,0.2,0.5,0.4c2.7,2.6,5.4,5.2,8.1,7.8c0.7,0.7,1,1.5,0.8,2.5c-0.5,3.2-1.1,6.4-1.7,9.6c-0.1,0.7-0.2,1.4-0.4,2.3c0.3-0.1,0.4-0.2,0.6-0.3c3.3-1.7,6.6-3.4,9.8-5.2c1.1-0.6,2-0.5,3,0c3.3,1.7,6.5,3.4,9.8,5.2C34.5,44.2,34.7,44.2,34.9,44.3z"/></g></g><g><line fill="none" stroke="#6D6E70" stroke-width="2.4266" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" x1="37.7" y1="15.8" x2="37.7" y2="3.1"/><line fill="none" stroke="#6D6E70" stroke-width="2.4266" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" x1="31.4" y1="9.4" x2="44" y2="9.4"/></g></svg>
diff --git a/img/toolbar/bookmarks_export.svg b/img/toolbar/bookmarks_export.svg
new file mode 100644
index 00000000000..54b8e34ad88
--- /dev/null
+++ b/img/toolbar/bookmarks_export.svg
@@ -0,0 +1,2 @@
+<svg version="1.1" id="Layer_1_copy" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 39.7 26.6" style="enable-background:new 0 0 39.7 26.6;" xml:space="preserve"><g>	<path style="fill:none;stroke:#666666;stroke-width:1.9786;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" d="
+		M24.9,17.4c-1.7,4.7-6.1,8.1-11.4,8.2C6.7,25.7,1.1,20.3,1,13.5S6.3,1.1,13.1,1c5.1-0.1,9.5,3,11.5,7.3"/><g id="X1vBn6.tif_10_"><g><path style="fill:#666666;stroke:#666666;stroke-width:1.6451;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" d="M18.4,19.8c0-0.1,0-0.1,0-0.1c-0.3-1.5-0.5-3-0.8-4.5c-0.1-0.4,0-0.8,0.3-1.1c1.1-1,2.1-2.1,3.2-3.1c0.1-0.1,0.1-0.1,0.2-0.2c-1.6-0.2-3.2-0.5-4.7-0.7c-0.4-0.1-0.7-0.3-0.8-0.6c-0.7-1.4-1.3-2.7-2-4.1c0-0.1-0.1-0.1-0.1-0.2c-0.1,0.1-0.1,0.2-0.1,0.2c-0.7,1.4-1.3,2.7-2,4.1c-0.2,0.3-0.4,0.5-0.8,0.6c-1.3,0.2-2.6,0.4-3.9,0.6c-0.3,0-0.6,0.1-0.9,0.1c0,0,0,0,0,0.1C6.1,11,6.1,11,6.2,11.1c1.1,1,2.1,2.1,3.2,3.1c0.3,0.3,0.4,0.6,0.3,1C9.5,16.5,9.3,17.7,9,19c0,0.3-0.1,0.6-0.1,0.9c0.1-0.1,0.2-0.1,0.2-0.1c1.3-0.7,2.6-1.4,3.9-2.1c0.4-0.2,0.8-0.2,1.2,0c1.3,0.7,2.6,1.4,3.9,2.1C18.2,19.7,18.3,19.8,18.4,19.8z"/></g></g><g><line style="fill:none;stroke:#666666;stroke-width:1.7128;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="33.4" y1="17.9" x2="38.9" y2="12.9"/><line style="fill:none;stroke:#666666;stroke-width:1.7128;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="33.4" y1="8.1" x2="38.9" y2="12.3"/><line style="fill:none;stroke:#666666;stroke-width:1.7128;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="23.6" y1="12.8" x2="38.5" y2="12.8"/></g></g></svg>
diff --git a/img/toolbar/bookmarks_import.svg b/img/toolbar/bookmarks_import.svg
new file mode 100644
index 00000000000..85e722f58a6
--- /dev/null
+++ b/img/toolbar/bookmarks_import.svg
@@ -0,0 +1 @@
+<svg version="1.1" id="Layer_1_copy" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 47.1 25.3" style="enable-background:new 0 0 47.1 25.3;" xml:space="preserve"><g><path style="fill:none;stroke:#666666;stroke-width:1.9786;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" d="M23.7,8.2c1.8-4.3,6.1-7.3,11.1-7.2c6.4,0.2,11.5,5.5,11.3,12c-0.2,6.4-5.5,11.5-12,11.3c-4.8-0.1-8.9-3.2-10.5-7.4"/><g>		<line style="fill:none;stroke:#666666;stroke-width:1.7128;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="31.9" y1="17.6" x2="37.4" y2="12.6"/><line style="fill:none;stroke:#666666;stroke-width:1.7128;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="31.9" y1="7.8" x2="37.4" y2="12"/><line style="fill:none;stroke:#666666;stroke-width:1.7128;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" x1="22.1" y1="12.5" x2="36.9" y2="12.5"/></g><g id="X1vBn6.tif_9_"><g><path style="fill:#666666;stroke:#666666;stroke-width:1.9786;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" d="M16,19.9c0-0.1,0-0.1,0-0.2c-0.3-1.8-0.6-3.6-0.9-5.4c-0.1-0.5,0-0.9,0.4-1.3c1.3-1.2,2.6-2.5,3.9-3.8c0.1-0.1,0.1-0.1,0.2-0.2c-1.9-0.3-3.8-0.6-5.7-0.8c-0.5-0.1-0.8-0.3-1-0.7c-0.8-1.6-1.6-3.3-2.4-4.9c0-0.1-0.1-0.2-0.2-0.3c-0.1,0.1-0.1,0.2-0.2,0.3C9.3,4.2,8.5,5.9,7.7,7.5C7.5,7.9,7.2,8.1,6.8,8.2C5.2,8.4,3.7,8.6,2.1,8.9C1.7,9,1.4,9,1,9.1v0.1c0.1,0.1,0.2,0.1,0.2,0.2c1.3,1.3,2.6,2.5,3.9,3.8c0.4,0.1,0.5,0.5,0.4,1c-0.3,1.5-0.5,3.1-0.8,4.6c0,0.3-0.1,0.7-0.1,1.1c0.1-0.1,0.2-0.1,0.3-0.1c1.6-0.8,3.2-1.6,4.7-2.5c0.5-0.3,1-0.3,1.5,0c1.6,0.8,3.1,1.7,4.7,2.5C15.8,19.8,15.9,19.8,16,19.9z"/></g></g></g></svg>
diff --git a/js/about/bookmarks.js b/js/about/bookmarks.js
index 8476f3a7c0e..abf96166281 100644
--- a/js/about/bookmarks.js
+++ b/js/about/bookmarks.js
@@ -451,6 +451,8 @@ class AboutBookmarks extends React.Component {
         <div data-l10n-id='bookmarkManager' className='sectionTitle' />
         <div className='headerActions'>
           <div className='searchWrapper'>
+            <span data-l10n-id='importBrowserData' className='importBrowserData' onClick={this.importBrowserData} />
+            <span data-l10n-id='exportBookmarks' className='exportBookmarks' onClick={this.exportBookmarks} />
             <input type='text' className='searchInput' ref='bookmarkSearch' id='bookmarkSearch' value={this.state.search} onChange={this.onChangeSearch} data-l10n-id='bookmarkSearch' />
             {
               this.state.search
@@ -465,8 +467,6 @@ 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='addBookmarkFolder' className='addBookmarkFolder' onClick={this.addBookmarkFolder} />
           </div>
           <BookmarkFolderList
diff --git a/less/about/bookmarks.less b/less/about/bookmarks.less
index 7f3977b666d..dee2b8362d5 100644
--- 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,51 @@
   padding-left: 12px;
 }
 
-.addBookmarkFolder {
+.addBookmarkFolder,
+.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;
+  margin-right: 7px;
 }
-.addBookmarkFolder:hover {
-  background-color: #000;
+
+.addBookmarkFolder {
+  -webkit-mask-image: url('../../img/toolbar/add_BM_folder_btn.svg');
 }
+
 .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;
 }
-.addBookmark:hover {
-  background-color: #000;
+
+.addBookmark,
+.addBookmarkFolder,
+.importBrowserData,
+.exportBookmarks {
+  &:hover {
+    background-color: #000;
+  }
+}
+
+.exportBookmarks,
+.importBrowserData {
+  background-color: @buttonColor;
+  -webkit-mask-repeat: no-repeat;
+  width: 43px;
+  height: 22px;
+  display: inline-block;
+  vertical-align: top;
+  margin: 7px 10px 5px 0;
+}
+
+
+.importBrowserData {
+  -webkit-mask-image: url('../../img/toolbar/bookmarks_import.svg');
+}
+
+.exportBookmarks {
+  -webkit-mask-image: url('../../img/toolbar/bookmarks_export.svg');
 }