feat(sidebar): ellipsis for too long tab title

extension/panel.css

@@ -1,12 +1,21 @@
+html, body {
+  width: 100%;
+}
+
 #tabs {
   margin-top: 1px;
+  width: 100%;
 }
 
 .tab {
   border: solid grey 1px;
   margin-bottom: 1px;
+  padding-left: 2px;
+  width: 100%;
 }
 
-.tab {
-  padding-left: 2px;
+.tab-title {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }

src/Sidebar.purs

@@ -55,11 +55,11 @@ createTabElement tab' = do
   let
     tab = unwrap tab'
   tabDiv <- create "<div>"
-  setText tab.title tabDiv
   setAttr "class" "tab" tabDiv
   setAttr "id" tab.id tabDiv
   favicon <- create "<span class=\"favicon\">"
-  tabTitle <- create "<span class=\"tab-title\">"
+  tabTitle <- create "<div class=\"tab-title\">"
+  setText tab.title tabTitle
   append favicon tabDiv
   append tabTitle tabDiv
   pure tabDiv