diff --git a/modules/webapp/src/main/elm/Comp/ItemCardList.elm b/modules/webapp/src/main/elm/Comp/ItemCardList.elm
index 6ac01407..cf97719f 100644
--- a/modules/webapp/src/main/elm/Comp/ItemCardList.elm
+++ b/modules/webapp/src/main/elm/Comp/ItemCardList.elm
@@ -13,6 +13,7 @@ import Api.Model.ItemLightGroup exposing (ItemLightGroup)
import Api.Model.ItemLightList exposing (ItemLightList)
import Data.Direction
import Data.Flags exposing (Flags)
+import Data.Icons as Icons
import Html exposing (..)
import Html.Attributes exposing (..)
import Html.Events exposing (onClick)
@@ -80,10 +81,11 @@ view model =
viewGroup : ItemLightGroup -> Html Msg
viewGroup group =
div [ class "item-group" ]
- [ div [ class "ui horizontal divider" ]
- [ text group.name
+ [ div [ class "ui horizontal divider header item-list" ]
+ [ i [ class "calendar alternate outline icon" ] []
+ , text group.name
]
- , div [ class "ui one column grid" ]
+ , div [ class "ui stackable three cards" ]
(List.map viewItem group.items)
]
@@ -116,81 +118,80 @@ viewItem item =
newColor =
"blue"
in
- div [ class "column item-list" ]
- [ a
- [ classList
- [ ( "ui fluid card", True )
- , ( newColor, not isConfirmed )
- ]
- , href "#"
- , onClick (SelectItem item)
+ a
+ [ classList
+ [ ( "ui fluid card", True )
+ , ( newColor, not isConfirmed )
]
- [ div [ class "content" ]
+ , href "#"
+ , onClick (SelectItem item)
+ ]
+ [ div [ class "content" ]
+ [ div
+ [ class "header"
+ , Data.Direction.labelFromMaybe item.direction
+ |> title
+ ]
+ [ dirIcon
+ , Util.String.underscoreToSpace item.name
+ |> text
+ ]
+ , span [ class "meta" ]
[ div
- [ class "header"
- , Data.Direction.labelFromMaybe item.direction
- |> title
- ]
- [ dirIcon
- , Util.String.ellipsis 45 item.name |> text
- ]
- , span [ class "meta" ]
- [ div
- [ classList
- [ ( "ui ribbon label", True )
- , ( newColor, True )
- , ( "invisible", isConfirmed )
- ]
- ]
- [ i [ class "exclamation icon" ] []
- , text " New"
+ [ classList
+ [ ( "ui ribbon label", True )
+ , ( newColor, True )
+ , ( "invisible", isConfirmed )
]
]
- , span [ class "right floated meta" ]
- [ Util.Time.formatDateShort item.date |> text
+ [ i [ class "exclamation icon" ] []
+ , text " New"
]
]
- , div [ class "content" ]
+ , span [ class "right floated meta" ]
+ [ Util.Time.formatDateShort item.date |> text
+ ]
+ ]
+ , div [ class "content" ]
+ [ div [ class "ui horizontal list" ]
+ [ div
+ [ class "item"
+ , title "Correspondent"
+ ]
+ [ Icons.correspondentIcon
+ , text " "
+ , Util.String.withDefault "-" corr |> text
+ ]
+ , div
+ [ class "item"
+ , title "Concerning"
+ ]
+ [ Icons.concernedIcon
+ , text " "
+ , Util.String.withDefault "-" conc |> text
+ ]
+ ]
+ , div [ class "right floated meta" ]
[ div [ class "ui horizontal list" ]
[ div
[ class "item"
- , title "Correspondent"
+ , title "Source"
]
- [ i [ class "envelope outline icon" ] []
- , text " "
- , Util.String.withDefault "-" corr |> text
+ [ text item.source
]
, div
[ class "item"
- , title "Concerning"
+ , title ("Due on " ++ dueDate)
]
- [ i [ class "comment outline icon" ] []
- , text " "
- , Util.String.withDefault "-" conc |> text
- ]
- ]
- , div [ class "right floated meta" ]
- [ div [ class "ui horizontal list" ]
[ div
- [ class "item"
- , title "Source"
- ]
- [ text item.source
- ]
- , div
- [ class "item"
- , title ("Due on " ++ dueDate)
- ]
- [ div
- [ classList
- [ ( "ui basic grey label", True )
- , ( "invisible hidden", item.dueDate == Nothing )
- ]
- ]
- [ i [ class "bell icon" ] []
- , text (" " ++ dueDate)
+ [ classList
+ [ ( "ui basic grey label", True )
+ , ( "invisible hidden", item.dueDate == Nothing )
]
]
+ [ Icons.dueDateIcon
+ , text (" " ++ dueDate)
+ ]
]
]
]
diff --git a/modules/webapp/src/main/elm/Comp/ItemDetail.elm b/modules/webapp/src/main/elm/Comp/ItemDetail.elm
index c093e023..3eab2894 100644
--- a/modules/webapp/src/main/elm/Comp/ItemDetail.elm
+++ b/modules/webapp/src/main/elm/Comp/ItemDetail.elm
@@ -31,6 +31,7 @@ import Comp.SentMails
import Comp.YesNoDimmer
import Data.Direction exposing (Direction)
import Data.Flags exposing (Flags)
+import Data.Icons as Icons
import DatePicker exposing (DatePicker)
import Dict exposing (Dict)
import Html exposing (..)
@@ -1416,7 +1417,7 @@ renderItemInfo model =
[ class "item"
, title "Due Date"
]
- [ i [ class "bell icon" ] []
+ [ Icons.dueDateIcon
, Maybe.map Util.Time.formatDate model.item.dueDate
|> Maybe.withDefault ""
|> text
@@ -1427,7 +1428,7 @@ renderItemInfo model =
[ class "item"
, title "Correspondent"
]
- [ i [ class "envelope outline icon" ] []
+ [ Icons.correspondentIcon
, List.filterMap identity [ model.item.corrOrg, model.item.corrPerson ]
|> List.map .name
|> String.join ", "
@@ -1440,7 +1441,7 @@ renderItemInfo model =
[ class "item"
, title "Concerning"
]
- [ i [ class "comment outline icon" ] []
+ [ Icons.concernedIcon
, List.filterMap identity [ model.item.concPerson, model.item.concEquipment ]
|> List.map .name
|> String.join ", "
diff --git a/modules/webapp/src/main/elm/Data/Icons.elm b/modules/webapp/src/main/elm/Data/Icons.elm
new file mode 100644
index 00000000..96ddbecb
--- /dev/null
+++ b/modules/webapp/src/main/elm/Data/Icons.elm
@@ -0,0 +1,41 @@
+module Data.Icons exposing
+ ( concerned
+ , concernedIcon
+ , correspondent
+ , correspondentIcon
+ , dueDate
+ , dueDateIcon
+ )
+
+import Html exposing (Html, i)
+import Html.Attributes exposing (class)
+
+
+concerned : String
+concerned =
+ "crosshairs icon"
+
+
+concernedIcon : Html msg
+concernedIcon =
+ i [ class concerned ] []
+
+
+correspondent : String
+correspondent =
+ "address card outline icon"
+
+
+correspondentIcon : Html msg
+correspondentIcon =
+ i [ class correspondent ] []
+
+
+dueDate : String
+dueDate =
+ "bell icon"
+
+
+dueDateIcon : Html msg
+dueDateIcon =
+ i [ class dueDate ] []
diff --git a/modules/webapp/src/main/elm/Util/String.elm b/modules/webapp/src/main/elm/Util/String.elm
index e96888bc..c5d637f3 100644
--- a/modules/webapp/src/main/elm/Util/String.elm
+++ b/modules/webapp/src/main/elm/Util/String.elm
@@ -1,6 +1,7 @@
module Util.String exposing
( crazyEncode
, ellipsis
+ , underscoreToSpace
, withDefault
)
@@ -40,3 +41,8 @@ withDefault default str =
else
str
+
+
+underscoreToSpace : String -> String
+underscoreToSpace str =
+ String.replace "_" " " str
diff --git a/modules/webapp/src/main/webjar/docspell.css b/modules/webapp/src/main/webjar/docspell.css
index 9453556b..2c9c204d 100644
--- a/modules/webapp/src/main/webjar/docspell.css
+++ b/modules/webapp/src/main/webjar/docspell.css
@@ -132,12 +132,12 @@ textarea.markdown-editor {
padding-right: 1em;
}
-.default-layout .ui.grid > .column.item-list:not(.row) {
- padding-top: 0.8em;
- padding-bottom: 0;
+.default-layout .item-group:not(:first-child) > .ui.horizontal.divider.header.item-list {
+ margin-top: 1.5em;
}
-.default-layout .ui.grid > .column.item-list:not(.row):last-child {
- padding-bottom: 1.5rem;
+.default-layout .ui.horizontal.divider.header.item-list {
+ margin-bottom: 1em;
+ background: rgba(240,248,255,0.4);
}
label span.muted {