Indicate on a card that multi-select mode is active

This commit is contained in:
Eike Kettner 2020-11-14 11:03:22 +01:00
parent ee6b54006c
commit 4b700fb249
2 changed files with 26 additions and 4 deletions

View File

@ -148,7 +148,12 @@ type alias ViewConfig =
view : ViewConfig -> UiSettings -> Model -> Html Msg view : ViewConfig -> UiSettings -> Model -> Html Msg
view cfg settings model = view cfg settings model =
div [ class "ui container" ] div
[ classList
[ ( "ui container", True )
, ( "multi-select-mode", isMultiSelectMode cfg )
]
]
(List.map (viewGroup model cfg settings) model.results.groups) (List.map (viewGroup model cfg settings) model.results.groups)
@ -185,3 +190,17 @@ viewItem model cfg settings item =
Comp.ItemCard.view vvcfg settings cardModel item Comp.ItemCard.view vvcfg settings cardModel item
in in
Html.map (ItemCardMsg item) cardHtml Html.map (ItemCardMsg item) cardHtml
--- Helpers
isMultiSelectMode : ViewConfig -> Bool
isMultiSelectMode cfg =
case cfg.selection of
Data.ItemSelection.Active _ ->
True
Data.ItemSelection.Inactive ->
False

View File

@ -93,15 +93,18 @@
padding: 0.8em; padding: 0.8em;
} }
.default-layout .ui.card .link.content:hover {
box-shadow: 0 0 0 1px #d4d4d5,0 2px 4px 0 rgba(34,36,38,.12),0 2px 10px 0 rgba(34,36,38,.15);
}
.default-layout .card .card-attachment-nav { .default-layout .card .card-attachment-nav {
position: absolute; position: absolute;
left: 4px; left: 4px;
top: 4px; top: 4px;
z-index: 8; z-index: 8;
} }
.default-layout .multi-select-mode .ui.card {
border: 1px dashed rgba(34,36,38, .8);
}
.default-layout .ui.card:hover {
box-shadow: 0 0 0 1px #d4d4d5,0 2px 4px 0 rgba(34,36,38,.12),0 2px 10px 0 rgba(34,36,38,.15);
}
.default-layout .image.ds-card-image { .default-layout .image.ds-card-image {
overflow: auto; overflow: auto;
} }