[bootstrap v4] doctable styling

dist/styles/sass.css

@@ -694,13 +694,6 @@ li .leaf:hover a.settings {
   font-weight: bold;
   text-decoration: underline;
 }
-.table tr td .column-tag {
-  align-items: center;
-}
-.table tr td .column-tag .doc-chooser {
-  cursor: pointer;
-  padding: 10px;
-}
 .table tr td .ngrams-selector {
   display: flex;
 }

dist/styles/sass.css.map

-{"version":3,"sourceRoot":"","sources":["../../src/sass/_menu.sass","../../src/sass/_context_menu.sass","../../src/sass/_graph.sass","../../src/sass/_login.sass","../../src/sass/_tree.sass","../../src/sass/_code_editor.sass","../../src/sass/_styles.sass","../../src/sass/_range_slider.sass"],"names":[],"mappings":"AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;EACI;EACA;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;AACI;EACA;;;AAEJ;AACI;EACA;;;AAGJ;AACA;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;EACA;;;AAEF;EACE;;;AC7CF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;ACjBA;EACE;EACA;;AAEA;EACE;EACA;EACA;;AACA;EACE;EACA;;AAEN;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EAtCA;EACA;EAEA;EAqCE;EACA;;AACF;EACE;;AACF;EACE;;AAEF;EACE;;AAEF;EAlDA;EACA;EAEA;EAiDE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AAGA;EACE;EACA;;AACN;EACE;;AACF;EACE;;AAEF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACrFJ;EACE;;;AAOF;EACE;;AACA;EACE;EACA;;;AAEJ;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;AAEE;EACE;EACA;;AACA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAKJ;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACA;EACE;EACA;EACA;;AACA;EACE;;AACF;EACE;EACA;EACA;EACA;;AACA;EACE;;AACN;EACE;EACA;EACA;EACA;;;AAGN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;;;AAGF;EACE;;;AAEJ;EACI;EACA;;;AAEJ;EACI;EACA;;;AAGF;EACE;;;AAEJ;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAGA;EACE;EACA;;AACF;EACE;EACA;;;AClLJ;EACE;;;AAGA;EACE;EACA;;AACA;EACE;;AACF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAER;EACE;;AAEE;EACE;;AACA;EACE;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;EACA;EACA;;AACF;EACE;;AACF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AACF;EACE;;AAGN;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AAIR;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAEV;EACE;;AACF;EACE;;AAEE;EACE;;AACF;EACE;;AACN;EACE;;AAEE;EACE;EACA;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;;AAIF;EACE;;AAEA;EACE;;;AC/HR;EACE;;AAEA;EACE;;AACA;EACE;;AACJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;;AACF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EArDR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AA2DM;EACE;EACA;EACA;EACA;EACA;EA7DR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAmEE;EACE;EACA;EACA;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAGE;EACE;;AAEF;EACE;;;ACtGV;EACE;;AACF;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAEV;EACE;;AACA;EACE;EACA;EACA;;;AAKE;EACE;EACA;;AACF;EACE;;AACA;EACE;EACA;;AACJ;EACE;;AACA;EACE;;AACJ;EACE;;;AAER;EACE;;;AChDF;EACE;AACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;;AAEA;EACE;EAEA;EACA;EACA","file":"sass.css"}
+{"version":3,"sourceRoot":"","sources":["../../src/sass/_menu.sass","../../src/sass/_context_menu.sass","../../src/sass/_graph.sass","../../src/sass/_login.sass","../../src/sass/_tree.sass","../../src/sass/_code_editor.sass","../../src/sass/_styles.sass","../../src/sass/_range_slider.sass"],"names":[],"mappings":"AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;EACI;EACA;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;AACI;EACA;;;AAEJ;AACI;EACA;;;AAGJ;AACA;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;EACA;;;AAEF;EACE;;;AC7CF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;ACjBA;EACE;EACA;;AAEA;EACE;EACA;EACA;;AACA;EACE;EACA;;AAEN;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EAtCA;EACA;EAEA;EAqCE;EACA;;AACF;EACE;;AACF;EACE;;AAEF;EACE;;AAEF;EAlDA;EACA;EAEA;EAiDE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AAGA;EACE;EACA;;AACN;EACE;;AACF;EACE;;AAEF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACrFJ;EACE;;;AAOF;EACE;;AACA;EACE;EACA;;;AAEJ;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;AAEE;EACE;EACA;;AACA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAKJ;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACA;EACE;EACA;EACA;;AACA;EACE;;AACF;EACE;EACA;EACA;EACA;;AACA;EACE;;AACN;EACE;EACA;EACA;EACA;;;AAGN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;;;AAGF;EACE;;;AAEJ;EACI;EACA;;;AAEJ;EACI;EACA;;;AAGF;EACE;;;AAEJ;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;AAGA;EACE;EACA;;AACF;EACE;EACA;;;AClLJ;EACE;;;AAGA;EACE;EACA;;AACA;EACE;;AACF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAER;EACE;;AAEE;EACE;;AACA;EACE;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;EACA;EACA;;AACF;EACE;;AACF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AACF;EACE;;AAGN;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AAIR;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAEV;EACE;;AACF;EACE;;AAEE;EACE;;AACF;EACE;;AACN;EACE;;AAEE;EACE;EACA;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;;AAIF;EACE;;AAEA;EACE;;;AC/HR;EACE;;AAEA;EACE;;AACA;EACE;;AACJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;;AACF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EArDR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AA2DM;EACE;EACA;EACA;EACA;EACA;EA7DR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAmEE;EACE;EACA;EACA;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAGE;EACE;;AAEF;EACE;;;ACtGV;EACE;;AACF;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAEV;EACE;;AACA;EACE;EACA;EACA;;;AAKE;EACE;EACA;;AACF;EACE;;AACA;EACE;;AACJ;EACE;;;AAER;EACE;;;AC3CF;EACE;AACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;;AAEA;EACE;EAEA;EACA;EACA","file":"sass.css"}
\ No newline at end of file

src/Gargantext/Components/Category.purs

@@ -82,27 +82,27 @@ carousselCpt = R.hooksComponentWithModule thisModule "caroussel" cpt
           void $ launchAff $ putCategories session nodeId $ CategoryQuery {nodeIds: [r._id], category: c}
 
 icon :: Category -> Boolean -> String
-icon cat b = btn b $ "glyphicon glyphicon-" <> (color $ size b $ icon' cat b)
+icon cat b = btn b $ "fa fa-" <> (color $ size b $ icon' cat b)
   where
     icon' :: Category -> Boolean -> String
-    icon' Trash   false = "remove"
-    icon' Trash   true  = "remove-sign"
+    icon' Trash   false = "times"
+    icon' Trash   true  = "times-circle"
 
-    icon' UnRead  true  = "question-sign"
-    icon' UnRead  false = "question-sign"
+    icon' UnRead  false = "question"
+    icon' UnRead  true  = "question-circle"
 
-    icon' Checked true  = "ok-sign"
-    icon' Checked false = "ok"
+    icon' Checked false = "check"
+    icon' Checked true  = "check-circle"
 
+    icon' Topic  false = "star-o"
     icon' Topic  true  = "star"
-    icon' Topic  false = "star-empty"
 
+    icon' Favorite false = "heart-o"
     icon' Favorite true = "heart"
-    icon' Favorite false = "heart-empty"
 
     size :: Boolean -> String -> String
     size true  s = s <> " btn-lg"
-    size false s = s <> " btn-xs"
+    size false s = s <> " btn-sm"
 
     color :: String -> String
     color x = x <> " text-primary"

src/Gargantext/Components/DocsTable.purs

@@ -154,17 +154,17 @@ searchBar (query /\ setQuery) = R.createElement el {} []
     cpt {} _children = do
       queryText <- R.useState' query
 
-      pure $ H.div {className: "row"}
-        [ H.div {className: "col col-md-3"} []
-        , H.div {className: "col col-md-1"} [if query /= "" then clearButton else H.div {} []]
-        , H.div {className: "col col-md-3 form-group"}
+      pure $ H.div {className: "col-md-12 row"}
+        [ H.div {className: "col-md-3"} []
+        , H.div {className: "col-md-1"} [if query /= "" then clearButton else H.div {} []]
+        , H.div {className: "col-md-3 form-group"}
           [ H.input { type: "text"
                     , className: "form-control"
                     , on: {change: onSearchChange queryText, keyUp: onSearchKeyup queryText}
                     , placeholder: query
                     , defaultValue: query}
           ]
-        , H.div {className: "col col-md-1"} [searchButton queryText]
+        , H.div {className: "col-md-1"} [searchButton queryText]
         ]
 
     onSearchChange :: forall e. R.State Query -> e -> Effect Unit
@@ -180,14 +180,14 @@ searchBar (query /\ setQuery) = R.createElement el {} []
 
     searchButton (queryText /\ _) =
       H.button { type: "submit"
-               , className: "btn btn-default"
+               , className: "btn btn-secondary"
                , on: {click: \e -> setQuery $ const queryText}}
-      [ H.span {className: "glyphicon glyphicon-search"} [] ]
+      [ H.span {className: "fa fa-search"} [] ]
 
     clearButton =
       H.button { className: "btn btn-danger"
                , on: {click: \e -> setQuery $ const ""}}
-      [ H.span {className: "glyphicon glyphicon-remove"} [] ]
+      [ H.span {className: "fa fa-times"} [] ]
 
 mock :: Boolean
 mock = false
@@ -372,8 +372,8 @@ pagePaintRawCpt = R.hooksComponentWithModule thisModule "pagePaintRawCpt" cpt wh
       }
       where
         sid = sessionId session
-        gi Favorite  = "glyphicon glyphicon-star"
-        gi _ = "glyphicon glyphicon-star-empty"
+        gi Favorite  = "fa fa-star"
+        gi _ = "fa fa-star-o"
         trashClassName Trash _ = "trash"
         trashClassName _ true = "active"
         trashClassName _ false = ""
@@ -388,9 +388,9 @@ pagePaintRawCpt = R.hooksComponentWithModule thisModule "pagePaintRawCpt" cpt wh
             row dv@(DocumentsView r) =
               { row:
                 T.makeRow [ -- H.div {} [ H.a { className, style, on: {click: click Favorite} } [] ]
-                            H.div { className: "column-tag flex" } [ docChooser { listId, mCorpusId, nodeId: r._id, selected, sidePanelTriggers, tableReload: reload } []
+                            H.div { className: "" } [ docChooser { listId, mCorpusId, nodeId: r._id, selected, sidePanelTriggers, tableReload: reload } []
                                                                    ]
-                          , H.div { className: "column-tag flex" } [ caroussel { category: cat, nodeId, row: dv, session, setLocalCategories } [] ]
+                          , H.div { className: "" } [ caroussel { category: cat, nodeId, row: dv, session, setLocalCategories } [] ]
                 --, H.input { type: "checkbox", defaultValue: checked, on: {click: click Trash} }
                 -- TODO show date: Year-Month-Day only
                 , H.div { className: tClassName } [ R2.showText r.date ]
@@ -435,7 +435,7 @@ docChooserCpt = R.hooksComponentWithModule thisModule "docChooser" cpt
 
       let eyeClass = if selected then "fa-eye" else "fa-eye-slash"
 
-      pure $ H.div { className: "doc-chooser" } [
+      pure $ H.div { className: "btn" } [
         H.span { className: "fa " <> eyeClass
                , on: { click: onClick } } []
       ]

src/Gargantext/Components/Forest.purs

@@ -92,7 +92,7 @@ plus :: Handed -> R.Setter Boolean -> R.State (Maybe Backend) -> R.Element
 plus handed showLogin backend = H.div { className: handedClass } [
   H.button { title: "Add or remove connections to the server(s)."
            , on: {click}
-           , className: "btn btn-default"
+           , className: "btn btn-secondary"
            }
           [ H.div { "type": ""
                   , className: "fa fa-universal-access fa-lg"

src/Gargantext/Components/Login.purs

@@ -162,7 +162,8 @@ renderBackend state backend@(Backend {name}) =
           ]
     where
       iconLog = H.td {} [ H.a { on : {click}
-                        , className : "glyphitem glyphicon glyphicon-log-in"
+                        --, className : "glyphitem glyphicon glyphicon-log-in"
+                        , className : "fa fa-hand-o-right"
                         , title: "Log In"} []
                         ]
 

src/Gargantext/Components/NgramsTable.purs

@@ -321,7 +321,7 @@ loadedNgramsTableCpt = R.hooksComponentWithModule thisModule "loadedNgramsTable"
       pure $ R.fragment $
         autoUpdate <> [
           H.h4 {style: {textAlign : "center"}}
-               [ H.span {className: "glyphicon glyphicon-hand-down"} []
+               [ H.span {className: "fa fa-hand-o-down"} []
                , H.text "Extracted Terms"
                ]
         , search ]

src/Gargantext/Components/NgramsTable/Components.purs

@@ -158,11 +158,11 @@ treeCpt = R.hooksComponentWithModule thisModule "tree" cpt
             Nothing ->
               span ngramsStyle
         edit effect = [ H.text " "
-                      , H.i { className: "glyphicon glyphicon-pencil"
+                      , H.i { className: "fa fa-pencil"
                             , on: { click: const effect } } []
                       ]
         leaf = L.null cs
-        className = "glyphicon glyphicon-chevron-" <> if open then "down" else "right"
+        className = "fa fa-chevron-" <> if open then "down" else "right"
         style = if leaf then {color: "#adb5bd"} else {color: ""}
         open = not leaf || false {- TODO -}
         cs   = ngramsTable ^.. ix ngramsDepth.ngrams <<< _NgramsRepoElement <<< _children <<< folded
@@ -215,7 +215,7 @@ renderNgramsItemCpt = R.hooksComponentWithModule thisModule "renderNgramsItem" c
             then renderNgramsTree { ngramsTable, ngrams, ngramsStyle, ngramsClick, ngramsEdit }
             else
               H.a { on: { click: const $ dispatch $ ToggleChild true ngrams } } [
-                  H.i { className: "glyphicon glyphicon-plus" } []
+                  H.i { className: "fa fa-plus" } []
                 , (R2.buff $ span ngramsStyle [text $ " " <> ngramsTermText ngrams])
               ]
         ]

src/Gargantext/Components/Nodes/Corpus.purs

@@ -100,7 +100,7 @@ corpusLayoutViewCpt = R.hooksComponentWithModule thisModule "corpusLayoutView" c
 
       pure $ H.div {} [
         H.div { className: "row" } [
-           H.div { className: "btn btn-default " <> (saveEnabled fieldsWithIndex fieldsS)
+           H.div { className: "btn btn-secondary " <> (saveEnabled fieldsWithIndex fieldsS)
                  , on: { click: onClickSave {fields: fieldsS, nodeId, reload, session} }
                  } [
               H.span { className: "fa fa-floppy-o" } [  ]
@@ -110,7 +110,7 @@ corpusLayoutViewCpt = R.hooksComponentWithModule thisModule "corpusLayoutView" c
                                       , nodeId
                                       , session } ]
         , H.div { className: "row" } [
-           H.div { className: "btn btn-default"
+           H.div { className: "btn btn-secondary"
                  , on: { click: onClickAdd fieldsS }
                  } [
               H.span { className: "fa fa-plus" } [  ]
@@ -244,14 +244,14 @@ fieldCodeEditorWrapperCpt = R.hooksComponentWithModule thisModule "fieldCodeEdit
       where
         moveDownButton false = H.div {} []
         moveDownButton true =
-          H.div { className: "btn btn-default"
+          H.div { className: "btn btn-secondary"
                 , on: { click: \_ -> onMoveDown unit }
                 } [
             H.span { className: "fa fa-arrow-down" } [  ]
             ]
         moveUpButton false = H.div {} []
         moveUpButton true =
-          H.div { className: "btn btn-default"
+          H.div { className: "btn btn-secondary"
                 , on: { click: \_ -> onMoveUp unit }
                 } [
             H.span { className: "fa fa-arrow-up" } [  ]

src/Gargantext/Components/Nodes/Corpus/Dashboard.purs

@@ -93,7 +93,7 @@ dashboardLayoutLoadedCpt = R.hooksComponentWithModule thisModule "dashboardLayou
                   ] <> chartsEls <> [addNew])
       where
         addNew = H.div { className: "row" } [
-          H.span { className: "btn btn-default"
+          H.span { className: "btn btn-secondary"
                  , on: { click: onClickAdd }} [ H.span { className: "fa fa-plus" } [] ]
           ]
           where

src/Gargantext/Components/Nodes/File.purs

@@ -103,7 +103,7 @@ fileLayoutLoadedCpt = R.hooksComponentWithModule thisModule "fileLayoutLoaded" c
             H.h2 {} [ H.text hyperdata.name ]
           ]
         , H.div { className: "row" } [
-            H.div { className: "btn btn-default" } [
+            H.div { className: "btn btn-secondary" } [
                H.a { href: toUrl session ("node/" <> show nodeId <> "/file/download")
                    , target: "_blank"
                    } [ H.text "Download" ]

src/Gargantext/Components/Nodes/Home/Public.purs

@@ -158,11 +158,11 @@ tableau (PublicData {title, abstract, img, url, date, database, author}) =
                         [ H.div { className: "btn-group" }
                                 [ 
 {- TODO
-                                H.button { className : "btn btn-default flex-between"
+                                H.button { className : "btn btn-secondary flex-between"
                                            , href : url
                                            , role : "button"
                                            } [ H.text "View the map" ]
-                                , H.button { className : "btn btn-default flex-start"
+                                , H.button { className : "btn btn-secondary flex-start"
                                            , href : url
                                            , role : "button"
                                            } [ H.text "More like this" ]

src/Gargantext/Components/TopBar.purs

@@ -101,7 +101,7 @@ divDropdownLeftCpt = R.hooksComponentWithModule thisModule "divDropdownLeft" cpt
               }
       , LiNav { title : "Report bug here"
               , href  : "https://www.iscpif.fr/gargantext/feedback-and-bug-reports/"
-              , icon  : "glyphicon glyphicon-bullhorn"
+              , icon  : "fa fa-bullhorn"
               , text  : "Feedback"
               }
       ]
@@ -120,7 +120,7 @@ divDropdownLeftCpt = R.hooksComponentWithModule thisModule "divDropdownLeft" cpt
       ,------------------------------------------------------------
       [ LiNav { title : "Code documentation"
               , href  : "https://doc.gargantext.org"
-              , icon  : "glyphicon glyphicon-book"
+              , icon  : "fa fa-book"
               , text  : "Source Code Documentation"
               }
       , LiNav { title : "API documentation"
@@ -138,7 +138,7 @@ divDropdownLeftCpt = R.hooksComponentWithModule thisModule "divDropdownLeft" cpt
       ,------------------------------------------------------------
       [ LiNav { title : "More about us (you)"
               , href  : "https://iscpif.fr"
-              , icon  : "glyphicon glyphicon-question-sign"
+              , icon  : "fa fa-question"
               , text  : "About"
               }
       ]
@@ -185,7 +185,7 @@ menuElements = R.createElement menuElementsCpt
                   , style: { display: "block" } } $ intercalate divider $ map (map liNav) elements
       where
         divider :: Array R.Element
-        divider = [H.li {className: "divider"} []]
+        divider = [H.li {className: "dropdown-divider"} []]
 
 -- | surgar for target : "blank"
 --data LiNav_ = LiNav_ { title  :: String
@@ -207,14 +207,15 @@ liNav (LiNav { title : title'
              , icon  : icon'
              , text  : text'
              }
-      ) = H.li {} [ H.a { tabIndex: (-1)
-                        , target: "blank"
-                        , title: title'
-                        , href: href'
-                        } [ H.span { className: icon' } []
-                          , H.text $ " " <> text'
-                          ]
+      ) = H.li { className: "dropdown-item" } [
+            H.a { tabIndex: (-1)
+                , target: "blank"
+                , title: title'
+                , href: href'
+                } [ H.span { className: icon' } []
+                  , H.text $ " " <> text'
                   ]
+            ]
 
 
 type HandedChooserProps = (

src/sass/_styles.sass

@@ -33,11 +33,6 @@
       .active
         font-weight: bold
         text-decoration: underline
-      .column-tag
-        align-items: center
-        .doc-chooser
-          cursor: pointer
-          padding: 10px
       .ngrams-selector
         display: flex
         .ngrams-chooser