From f1ae04fd074e99dcaee7a9307c2defb56cb99221 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Brais=20Pi=C3=B1eiro?= <brapifra@gmail.com>
Date: Thu, 20 Sep 2018 00:12:38 +0100
Subject: [PATCH 1/2] Add text-overflow: ellipsi to FolderItem. Fixes #2409

---
 browser/main/modals/PreferencesModal/FolderItem.styl | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/browser/main/modals/PreferencesModal/FolderItem.styl b/browser/main/modals/PreferencesModal/FolderItem.styl
index 8bcf2b02c..f47af743b 100644
--- a/browser/main/modals/PreferencesModal/FolderItem.styl
+++ b/browser/main/modals/PreferencesModal/FolderItem.styl
@@ -19,6 +19,10 @@
   padding 0 10px
   line-height 30px
   float left
+  max-width calc(100% - 20px)
+  white-space nowrap
+  text-overflow ellipsis
+  overflow hidden
 .folderItem-left-danger
   color $danger-color
   font-weight bold

From 5dcd74b3b00ff252973c081d6de8371466e847a0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Brais=20Pi=C3=B1eiro?= <brapifra@gmail.com>
Date: Sun, 23 Sep 2018 11:13:45 +0100
Subject: [PATCH 2/2] FolderItem/StorageItem: Use flex layout

---
 browser/main/modals/PreferencesModal/FolderItem.styl  |  7 ++++---
 browser/main/modals/PreferencesModal/StorageItem.styl | 10 +++++++---
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/browser/main/modals/PreferencesModal/FolderItem.styl b/browser/main/modals/PreferencesModal/FolderItem.styl
index f47af743b..f4a44675d 100644
--- a/browser/main/modals/PreferencesModal/FolderItem.styl
+++ b/browser/main/modals/PreferencesModal/FolderItem.styl
@@ -2,6 +2,7 @@
   height 35px
   box-sizing border-box
   padding 2.5px 15px
+  display flex
   &:hover
     background-color darken(white, 3%)
 
@@ -18,8 +19,7 @@
   border-left solid 2px transparent
   padding 0 10px
   line-height 30px
-  float left
-  max-width calc(100% - 20px)
+  flex 1
   white-space nowrap
   text-overflow ellipsis
   overflow hidden
@@ -56,7 +56,8 @@
   outline none
 
 .folderItem-right
-  float right
+  -webkit-box-flex: 1
+  white-space nowrap
 
 .folderItem-right-button
   vertical-align middle
diff --git a/browser/main/modals/PreferencesModal/StorageItem.styl b/browser/main/modals/PreferencesModal/StorageItem.styl
index 29dfbd0b0..adcc483ee 100644
--- a/browser/main/modals/PreferencesModal/StorageItem.styl
+++ b/browser/main/modals/PreferencesModal/StorageItem.styl
@@ -9,13 +9,17 @@
   box-sizing border-box
   border-bottom $default-border
   margin-bottom 5px
+  display flex
 
 .header-label
-  float left
   cursor pointer
   &:hover
     .header-label-editButton
       opacity 1
+  flex 1
+  white-space nowrap
+  text-overflow ellipsis
+  overflow hidden
 
 .header-label-path
   color $ui-inactive-text-color
@@ -38,8 +42,8 @@
   outline none
 
 .header-control
-  float right
-
+  -webkit-box-flex: 1
+  white-space nowrap
 .header-control-button
   width 30px
   height 25px