TheAnachronism/docspell
1
0
Fork 0
mirror of https://github.com/TheAnachronism/docspell.git synced 2025-03-25 16:45:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

Move card size definition in css and fix height bug

Browse Source 
For very tall images (sometimes shopping receipts), the height must be
restricted, too.
This commit is contained in:
Eike Kettner 2020-11-09 21:36:06 +01:00
parent 10305bc82d
commit 976aa75710
3 changed files with 35 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
modules/webapp/src/main/elm/Comp/ItemCard.elm
View File

@ -179,7 +179,7 @@ view cfg settings model item =
pageCountLabel = pageCountLabel =
div div
[ classList [ classList
[ ( "card-attachment-nav", True ) [ ( "card-attachment-nav top", True )
, ( "invisible", pageCount == 0 || (item.fileCount == 1 && pageCount == 1) ) , ( "invisible", pageCount == 0 || (item.fileCount == 1 && pageCount == 1) )
] ]
] ]
@ -227,7 +227,10 @@ view cfg settings model item =
span [ class "invisible" ] [] span [ class "invisible" ] []
else else
div [ class "image" ] div
[ class "image ds-card-image"
, Data.UiSettings.cardPreviewSize settings
]
[ img [ img
[ class "preview-image" [ class "preview-image"
, src previewUrl , src previewUrl

11
modules/webapp/src/main/elm/Data/UiSettings.elm
View File

@ -226,15 +226,8 @@ fieldHidden settings field =
cardPreviewSize : UiSettings -> Attribute msg cardPreviewSize : UiSettings -> Attribute msg
cardPreviewSize settings = cardPreviewSize settings =
case settings.cardPreviewSize of Data.BasicSize.asString settings.cardPreviewSize
Data.BasicSize.Small -> |> HA.class
HA.style "max-width" "80px"
Data.BasicSize.Medium ->
HA.style "max-width" "160px"
Data.BasicSize.Large ->
HA.style "max-width" "none"

29
modules/webapp/src/main/webjar/docspell.css
View File

@ -92,19 +92,46 @@
background: floralwhite; background: floralwhite;
padding: 0.8em; padding: 0.8em;
} }
.default-layout .ui.card .link.content:hover { .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); 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 .card-attachment-nav { .default-layout .image .card-attachment-nav {
position: absolute; position: absolute;
bottom: 2px;
right: 2px; right: 2px;
z-index: 10; z-index: 10;
} }
.default-layout .image .card-attachment-nav.bottom {
bottom: 2px;
}
.default-layout .image .card-attachment-nav.top {
top: 2px;
}
.default-layout .image.ds-card-image {
overflow: auto;
}
.default-layout .image.ds-card-image.small {
max-height: 120px;
}
.default-layout .image.ds-card-image.medium {
max-height: 240px;
}
.default-layout .image.ds-card-image.large {
max-height: 600px;
}
.default-layout img.preview-image { .default-layout img.preview-image {
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
} }
.default-layout img.preview-image.small {
max-width: 80px;
}
.default-layout img.preview-image.medium {
max-width: 160px;
}
.default-layout img.preview-image.large {
max-width: none;
}
.default-layout .menu .item.active a.right-tab-icon-link { .default-layout .menu .item.active a.right-tab-icon-link {
position: relative; position: relative;